feat: ✨ created 404 - page not found

apps/www/app/(app)/sink/layout.tsx

@@ -13,7 +13,10 @@ export default function SinkLayout({ children }: SinkLayoutProps) {
       <div className="container">
         <div className="flex space-x-2 px-2 py-4">
           {styles.map((style) => (
-            <Link href={`/sink/${style.name}`} key={style.name}>
+            <Link
+              href={`/sink/${style.name === "default" ? "" : style.name}`}
+              key={style.name}
+            >
               {style.label}
             </Link>
           ))}

apps/www/app/layout.tsx

@@ -6,6 +6,8 @@ import { fontSans } from "@/lib/fonts"
 import { cn } from "@/lib/utils"
 import { Analytics } from "@/components/analytics"
 import { ThemeProvider } from "@/components/providers"
+import { SiteFooter } from "@/components/site-footer"
+import { SiteHeader } from "@/components/site-header"
 import { TailwindIndicator } from "@/components/tailwind-indicator"
 import { ThemeSwitcher } from "@/components/theme-switcher"
 import { Toaster as DefaultToaster } from "@/registry/default/ui/toaster"

apps/www/app/not-found.tsx

@@ -0,0 +1,23 @@
+import React from "react"
+import Link from "next/link"
+
+import { Button } from "@/registry/default/ui/button"
+
+export default function NotFoundPage() {
+  return (
+    <div className="container mt-auto flex h-full min-h-full flex-1 flex-col items-center justify-center gap-4">
+      <h1 className="text-8xl font-bold tracking-tight text-muted-foreground">
+        404
+      </h1>
+      <p className="text-xg font-semibold">Page not found</p>
+      <div className="mt-8 flex gap-2">
+        <Button asChild>
+          <Link href="/">Go home</Link>
+        </Button>
+        <Button asChild variant="outline">
+          <Link href="/docs/components">Components</Link>
+        </Button>
+      </div>
+    </div>
+  )
+}