Add a minimal 404 page matching the app's style
Two boundaries share the same content: src/app/not-found.tsx catches genuinely unmatched URLs (rendered bare in the root layout), and (app)/not-found.tsx catches notFound() calls from within app routes (already used by scripts/[scriptId] and runs/[runId]) so it renders nested inside AppLayout, keeping nav and footer visible. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,5 @@
|
||||
import { NotFoundContent } from "@/components/layout/not-found-content";
|
||||
|
||||
export default function NotFound() {
|
||||
return <NotFoundContent />;
|
||||
}
|
||||
@@ -0,0 +1,5 @@
|
||||
import { NotFoundContent } from "@/components/layout/not-found-content";
|
||||
|
||||
export default function NotFound() {
|
||||
return <NotFoundContent />;
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
import Link from "next/link";
|
||||
import { Home } from "lucide-react";
|
||||
import { buttonVariants } from "@/components/ui/button";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
export function NotFoundContent() {
|
||||
return (
|
||||
<div className="mx-auto flex max-w-md flex-col items-center gap-3 py-24 text-center">
|
||||
<span className="text-primary font-mono text-6xl font-semibold tracking-tight">
|
||||
404
|
||||
</span>
|
||||
<h1 className="font-heading text-xl font-medium">Page not found</h1>
|
||||
<p className="text-muted-foreground text-sm">
|
||||
The page you’re looking for doesn’t exist or may have been
|
||||
moved.
|
||||
</p>
|
||||
<Link
|
||||
href="/"
|
||||
className={cn(
|
||||
buttonVariants({ variant: "outline", size: "sm" }),
|
||||
"mt-2",
|
||||
)}
|
||||
>
|
||||
<Home className="size-3.5" />
|
||||
Back to dashboard
|
||||
</Link>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user