Fascinated/scoresaber-reloadedv3
Archived
1
1
Fork 0
Code Issues 1 Pull Requests 2 Actions Packages Activity

testing custom error page
All checks were successful
Deploy Website / deploy (push) Successful in 6m38s
Details

Browse Source
This commit is contained in:
Lee 2024-10-14 11:11:13 +01:00
parent 055e0869b8
commit 52e3ac9cec
1 changed files with 26 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
projects/website/src/app/global-error.tsx
View File

@ -1,23 +1,37 @@
"use client"; "use client";
import * as Sentry from "@sentry/nextjs"; import { GlobeAmericasIcon } from "@heroicons/react/24/solid";
import NextError from "next/error"; import Link from "next/link";
import { useEffect } from "react"; import { useEffect } from "react";
import * as Sentry from "@sentry/nextjs";
import Card from "@/components/card";
export default function GlobalError({ error }: { error: Error & { digest?: string } }) { /**
* 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 } }) {
useEffect(() => { useEffect(() => {
Sentry.captureException(error); Sentry.captureException(error);
}, [error]); }, [error]);
return ( return (
<html> <Card>
<body> <div className="flex flex-col items-center justify-center text-center h-screen">
{/* `NextError` is the default Next.js error page component. Its type <GlobeAmericasIcon className="h-24 w-24 text-red-500" />
definition requires a `statusCode` prop. However, since the App Router <h1 className="text-4xl font-bold text-gray-200 mt-6">Oops! Something went wrong.</h1>
does not expose status codes for errors, we simply pass 0 to render a <p className="text-lg text-gray-400 mt-2">
generic error message. */} We&#39;re experiencing some technical difficulties. Please try again later.
<NextError statusCode={0} /> </p>
</body> {error?.digest && <p className="text-sm text-gray-500 mt-1">Error Code: {error.digest}</p>}
</html>
<div className="mt-6">
<Link href="/" className="text-blue-500 hover:underline">
Go back to the homepage
</Link>
</div>
</div>
</Card>
); );
} }