diff --git a/packages/docusaurus/src/client/theme-fallback/Error/index.tsx b/packages/docusaurus/src/client/theme-fallback/Error/index.tsx
index 79ace57d7627..2ad45b7339df 100644
--- a/packages/docusaurus/src/client/theme-fallback/Error/index.tsx
+++ b/packages/docusaurus/src/client/theme-fallback/Error/index.tsx
@@ -8,12 +8,13 @@
// Should we translate theme-fallback?
/* eslint-disable @docusaurus/no-untranslated-text */
-import React from 'react';
+import React, {type ReactNode} from 'react';
import Head from '@docusaurus/Head';
import ErrorBoundary from '@docusaurus/ErrorBoundary';
import {getErrorCausalChain} from '@docusaurus/utils-common';
import Layout from '@theme/Layout';
import type {Props} from '@theme/Error';
+import {RouteContextProvider} from '../../routeContext';
function ErrorDisplay({error, tryAgain}: Props): JSX.Element {
return (
@@ -54,21 +55,38 @@ function ErrorBoundaryError({error}: {error: Error}): JSX.Element {
return {fullMessage}
;
}
+// A bit hacky: we need to add an artificial RouteContextProvider here
+// The goal is to be able to render the error inside the theme layout
+// Without this, our theme classic would crash due to lack of route context
+// See also https://github.com/facebook/docusaurus/pull/9852
+function ErrorRouteContextProvider({children}: {children: ReactNode}) {
+ return (
+
+ {children}
+
+ );
+}
+
export default function Error({error, tryAgain}: Props): JSX.Element {
// We wrap the error in its own error boundary because the layout can actually
// throw too... Only the ErrorDisplay component is simple enough to be
// considered safe to never throw
return (
- }>
-
- Page Error
-
-
-
-
-
+
+ }>
+
+ Page Error
+
+
+
+
+
+
);
}