From 383f41f9ca67a8fd1760096b08e139fe3f87bdce Mon Sep 17 00:00:00 2001 From: Liam Date: Mon, 14 Oct 2024 11:29:00 +0100 Subject: [PATCH] surely this works --- projects/common/src/utils/region-utils.ts | 6 +++- projects/website/src/app/error.tsx | 26 ++++++++++++++++ projects/website/src/app/global-error.tsx | 37 ++++++++--------------- 3 files changed, 43 insertions(+), 26 deletions(-) create mode 100644 projects/website/src/app/error.tsx diff --git a/projects/common/src/utils/region-utils.ts b/projects/common/src/utils/region-utils.ts index 632a4f1..df03b83 100644 --- a/projects/common/src/utils/region-utils.ts +++ b/projects/common/src/utils/region-utils.ts @@ -7,5 +7,9 @@ let regionNames = new Intl.DisplayNames(["en"], { type: "region" }); * @returns the normalized region name */ export function normalizedRegionName(region: string) { - return regionNames.of(region); + try { + return regionNames.of(region) || region; + } catch { + return region; + } } diff --git a/projects/website/src/app/error.tsx b/projects/website/src/app/error.tsx new file mode 100644 index 0000000..5799d5a --- /dev/null +++ b/projects/website/src/app/error.tsx @@ -0,0 +1,26 @@ +"use client"; // Error components must be Client Components + +import { GlobeAmericasIcon } from "@heroicons/react/24/solid"; +import Link from "next/link"; +import Card from "@/components/card"; + +export default function Error({ error, reset }: { error: Error & { digest?: string }; reset: () => void }) { + return ( + +
+ +

Oops! Something went wrong.

+

+ We're experiencing some technical difficulties. Please try again later. +

+ {error?.digest &&

Error Code: {error.digest}

} + +
+ + Go back to the homepage + +
+
+ + ); +} diff --git a/projects/website/src/app/global-error.tsx b/projects/website/src/app/global-error.tsx index 402754e..362f8e8 100644 --- a/projects/website/src/app/global-error.tsx +++ b/projects/website/src/app/global-error.tsx @@ -1,36 +1,23 @@ "use client"; -import { GlobeAmericasIcon } from "@heroicons/react/24/solid"; -import Link from "next/link"; -import { useEffect } from "react"; import * as Sentry from "@sentry/nextjs"; -import Card from "@/components/card"; +import NextError from "next/error"; +import { useEffect } from "react"; -/** - * Error page component for handling global errors. - * - * @param error - The error object passed to the component. - */ -export default function ErrorPage({ error }: { error: Error & { digest?: string } }) { +export default function GlobalError({ error }: { error: Error & { digest?: string } }) { useEffect(() => { Sentry.captureException(error); }, [error]); return ( - -
- -

Oops! Something went wrong.

-

- We're experiencing some technical difficulties. Please try again later. -

- -
- - Go Home - -
-
- + + + {/* `NextError` is the default Next.js error page component. Its type + definition requires a `statusCode` prop. However, since the App Router + does not expose status codes for errors, we simply pass 0 to render a + generic error message. */} + + + ); }