diff --git a/app/global-error.tsx b/app/global-error.tsx new file mode 100644 index 0000000..ba7726e --- /dev/null +++ b/app/global-error.tsx @@ -0,0 +1,122 @@ +"use client"; + +import { useEffect } from "react"; + +// This replaces the root layout entirely when something above app/error.tsx +// throws, so it can't rely on globals.css, the font variables, or any +// component from the library -- all of that may be what failed. Everything +// here is a plain inline-styled tag. + +export default function GlobalError({ + error, + reset, +}: { + error: Error & { digest?: string }; + reset: () => void; +}) { + useEffect(() => { + console.error("[global error]", error); + }, [error]); + + return ( + + +
+
+ ! +
+

+ Something went badly wrong +

+

+ The site itself failed to load, not just a page on it. The team has + been notified. +

+ {error.digest && ( +

+ ref: {error.digest} +

+ )} +
+ + + Registry + + + Report this + +
+
+ + + ); +}