34 lines
1.4 KiB
TypeScript
34 lines
1.4 KiB
TypeScript
/**
|
|
* @file app/(app)/not-found.tsx
|
|
* @description Server component rendering a custom 404 page for missing or invalid routes within the app layout.
|
|
*/
|
|
|
|
import { AppHeader } from "@/components/layout/AppHeader";
|
|
import { AlertCircle } from "lucide-react";
|
|
|
|
/** Renders the 404 Not Found fallback view containing an alert icon, message, and navigation link back to the summary page. */
|
|
export default function NotFound() {
|
|
return (
|
|
<div className="flex flex-col h-full w-full bg-background p-4 min-h-0 overflow-hidden">
|
|
<AppHeader isNotFound />
|
|
<div className="flex flex-col items-center justify-center h-full w-full text-center my-auto">
|
|
<div className="max-w-md w-full space-y-6">
|
|
{/* Icon Badge */}
|
|
<div className="mx-auto w-16 h-16 rounded-2xl bg-destructive-bg border border-destructive-border flex items-center justify-center text-destructive shadow-sm">
|
|
<AlertCircle size={36} />
|
|
</div>
|
|
|
|
{/* Text Content */}
|
|
<div className="space-y-2">
|
|
<h1 className="text-2xl font-bold tracking-tight text-foreground">
|
|
Page not found
|
|
</h1>
|
|
<p className="text-sm text-foreground-muted leading-relaxed">
|
|
The page you are looking for doesn't exist or has been moved.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|