feat(ux): add locale error boundary and retry flow
Some checks failed
CI / lint (push) Has been cancelled
Some checks failed
CI / lint (push) Has been cancelled
Add error.tsx with retry support and QA route for testing Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
parent
e0fa300213
commit
d0c3649cf3
2 changed files with 56 additions and 0 deletions
51
src/app/[locale]/error.tsx
Normal file
51
src/app/[locale]/error.tsx
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
"use client";
|
||||
|
||||
import { useTranslations } from "next-intl";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import {
|
||||
Card,
|
||||
CardContent,
|
||||
CardDescription,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
} from "@/components/ui/card";
|
||||
|
||||
interface ErrorProps {
|
||||
error: Error & { digest?: string };
|
||||
reset: () => void;
|
||||
}
|
||||
|
||||
export default function Error({ error, reset }: ErrorProps) {
|
||||
const t = useTranslations("Fallback.Error");
|
||||
|
||||
const handleRetry = () => {
|
||||
if (typeof window !== "undefined" && "unstable_retry" in window.location) {
|
||||
(window.location as unknown as { unstable_retry: () => void }).unstable_retry();
|
||||
} else {
|
||||
reset();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
data-testid="route-error"
|
||||
className="flex items-center justify-center min-h-[60vh] p-4"
|
||||
>
|
||||
<Card className="max-w-md w-full">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-2xl">{t("Title")}</CardTitle>
|
||||
<CardDescription>{t("Description")}</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<Button
|
||||
data-testid="route-error-retry"
|
||||
onClick={handleRetry}
|
||||
className="w-full"
|
||||
>
|
||||
{t("Retry")}
|
||||
</Button>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
5
src/app/[locale]/qa/route-error/page.tsx
Normal file
5
src/app/[locale]/qa/route-error/page.tsx
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
"use client";
|
||||
|
||||
export default function RouteErrorPage() {
|
||||
throw new Error("Intentional error for QA testing - this should trigger the error boundary");
|
||||
}
|
||||
Loading…
Reference in a new issue