80 lines
2.1 KiB
TypeScript
80 lines
2.1 KiB
TypeScript
"use client";
|
|
|
|
import { LayoutDashboard, RefreshCw } from "lucide-react";
|
|
import { useTranslations } from "next-intl";
|
|
import { useEffect, useState } from "react";
|
|
import Link from "@/components/link";
|
|
import { Button } from "@/components/ui/button";
|
|
import { reportBrowserError } from "@/lib/browser-errors";
|
|
|
|
/**
|
|
* Admin route-segment error boundary. Renders inside the admin layout shell.
|
|
*/
|
|
export default function AdminErrorPage({
|
|
error,
|
|
reset,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
reset: () => void;
|
|
}) {
|
|
const t = useTranslations("pages.error");
|
|
const tNav = useTranslations("pages.admin.nav");
|
|
|
|
const [reference, setReference] = useState(error.digest);
|
|
useEffect(() => {
|
|
setReference(error.digest ?? reportBrowserError(error, "browser.boundary"));
|
|
if (error.digest) reportBrowserError(error, "browser.boundary");
|
|
}, [error]);
|
|
|
|
return (
|
|
<div
|
|
className="rounded-xl border p-8 max-w-lg mx-auto mt-8 text-center"
|
|
style={{
|
|
borderColor: "var(--admin-border, rgba(0,0,0,0.08))",
|
|
background: "var(--admin-surface, #fff)",
|
|
}}
|
|
role="alert"
|
|
>
|
|
<p
|
|
className="text-sm font-bold uppercase tracking-wider mb-2"
|
|
style={{ color: "var(--admin-muted, #6b7280)" }}
|
|
>
|
|
{t("code")}
|
|
</p>
|
|
<h1 className="text-xl font-extrabold mb-2">{t("title")}</h1>
|
|
<p
|
|
className="text-sm mb-1"
|
|
style={{ color: "var(--admin-muted, #6b7280)" }}
|
|
>
|
|
{t("subtitle")}
|
|
</p>
|
|
<p
|
|
className="text-sm mb-6"
|
|
style={{ color: "var(--admin-muted, #6b7280)" }}
|
|
>
|
|
{t("body")}
|
|
</p>
|
|
<div className="flex flex-wrap gap-3 justify-center">
|
|
<Button type="button" variant="default" onClick={() => reset()}>
|
|
<RefreshCw className="size-4" aria-hidden />
|
|
{t("tryAgain")}
|
|
</Button>
|
|
<Button variant="outline" asChild>
|
|
<Link href="/admin">
|
|
<LayoutDashboard className="size-4" aria-hidden />
|
|
{tNav("dashboard")}
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
{reference ? (
|
|
<p
|
|
className="mt-6 text-xs font-mono"
|
|
style={{ color: "var(--admin-muted, #9ca3af)" }}
|
|
>
|
|
{t("reference", { digest: reference })}
|
|
</p>
|
|
) : null}
|
|
</div>
|
|
);
|
|
}
|