58 lines
1.2 KiB
TypeScript
58 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import { Home, RefreshCw } from "lucide-react";
|
|
import Link from "next/link";
|
|
import { useTranslations } from "next-intl";
|
|
import { useEffect } from "react";
|
|
import { ErrorScreen } from "@/components/error-screen";
|
|
|
|
/**
|
|
* Route-segment error boundary. Renders inside the root layout (so the shell
|
|
* stays). Never shows the raw error to the user.
|
|
*/
|
|
export default function ErrorPage({
|
|
error,
|
|
reset,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
reset: () => void;
|
|
}) {
|
|
const t = useTranslations("pages.error");
|
|
|
|
useEffect(() => {
|
|
console.error(error);
|
|
}, [error]);
|
|
|
|
return (
|
|
<ErrorScreen
|
|
code={t("code")}
|
|
title={t("title")}
|
|
subtitle={t("subtitle")}
|
|
body={t("body")}
|
|
actions={
|
|
<>
|
|
<button
|
|
type="button"
|
|
className="btn btn-primary"
|
|
onClick={() => reset()}
|
|
>
|
|
<RefreshCw className="error-screen-btn-icon" aria-hidden />
|
|
{t("tryAgain")}
|
|
</button>
|
|
<Link className="btn btn-outline" href="/">
|
|
<Home className="error-screen-btn-icon" aria-hidden />
|
|
{t("backHome")}
|
|
</Link>
|
|
</>
|
|
}
|
|
footer={
|
|
error.digest ? (
|
|
<p className="error-screen-digest">
|
|
{t("reference", { digest: error.digest })}
|
|
</p>
|
|
) : null
|
|
}
|
|
/>
|
|
);
|
|
}
|