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