piotr.sliwa/t-convex-nextjs-saas
Template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

feat(routing): add localized and root not-found handling

Browse source 
Add localized 404 page, catch-all route, and root not-found fallback

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
nxtkofi 2026-04-21 23:26:52 +02:00
parent 2a6a7980ec
commit bad2b107ba
3 changed files with 68 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/app/[locale]/[...rest]/page.tsx Normal file
View file

@ -0,0 +1,5 @@
import { notFound } from "next/navigation";
export default function CatchAllPage() {
notFound();
}

34
src/app/[locale]/not-found.tsx Normal file
View file

@ -0,0 +1,34 @@
import { getTranslations } from "next-intl/server";
import Link from "next/link";
import { routes } from "@/lib/routes";
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle,
} from "@/components/ui/card";
import { Button } from "@/components/ui/button";
export default async function NotFound() {
const t = await getTranslations("Fallback.NotFound");
return (
<div
data-testid="localized-not-found"
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 asChild className="w-full">
<Link href={routes.public.home}>{t("GoHome")}</Link>
</Button>
</CardContent>
</Card>
</div>
);
}

29
src/app/not-found.tsx Normal file
View file

@ -0,0 +1,29 @@
"use client";
import Link from "next/link";
export default function NotFound() {
return (
<html lang="en">
<body>
<div
data-testid="root-not-found"
className="flex items-center justify-center min-h-screen bg-background"
>
<div className="text-center p-8">
<h1 className="text-4xl font-bold mb-4">404</h1>
<p className="text-lg text-muted-foreground mb-6">
Page not found
</p>
<Link
href="/"
className="text-primary hover:underline"
>
Go back home
</Link>
</div>
</div>
</body>
</html>
);
}