Ensure uniform code formatting across components by aligning with the established code style. Adjust imports, indentation, and spacing to enhance readability and maintainability.
51 lines
1.5 KiB
TypeScript
51 lines
1.5 KiB
TypeScript
"use client";
|
|
|
|
import { AlertTriangle, Home, RefreshCw } from "lucide-react";
|
|
import Link from "next/link";
|
|
import { useEffect } from "react";
|
|
import { Button } from "@/components/ui/button";
|
|
|
|
// biome-ignore lint/suspicious/noShadowRestrictedNames: correct use
|
|
export default function Error({
|
|
error,
|
|
reset,
|
|
}: {
|
|
error: Error & { digest?: string };
|
|
reset: () => void;
|
|
}) {
|
|
useEffect(() => {
|
|
console.error(error);
|
|
}, [error]);
|
|
|
|
return (
|
|
<div className="min-h-screen flex flex-col items-center justify-center bg-zinc-50 dark:bg-zinc-950 px-4">
|
|
<div className="text-center space-y-6 max-w-md">
|
|
<div className="flex justify-center">
|
|
<div className="bg-orange-100 dark:bg-orange-900/30 p-4 rounded-full">
|
|
<AlertTriangle className="h-12 w-12 text-orange-600 dark:text-orange-400" />
|
|
</div>
|
|
</div>
|
|
<h1 className="text-4xl font-bold tracking-tight">
|
|
Oups ! Une erreur est survenue
|
|
</h1>
|
|
<p className="text-muted-foreground text-lg">
|
|
La chèvre a glissé sur une peau de banane. Nous essayons de la remettre sur
|
|
pied.
|
|
</p>
|
|
<div className="flex flex-col sm:flex-row gap-3 justify-center">
|
|
<Button onClick={reset} size="lg" className="gap-2">
|
|
<RefreshCw className="h-4 w-4" />
|
|
Réessayer
|
|
</Button>
|
|
<Button asChild variant="outline" size="lg" className="gap-2">
|
|
<Link href="/">
|
|
<Home className="h-4 w-4" />
|
|
Retourner à l'accueil
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|