1/// <reference types="vite/client" />
2import type { ReactNode } from "react";
3import {
4 HeadContent,
5 Outlet,
6 Scripts,
7 createRootRoute,
8} from "@tanstack/react-router";
9
10export const Route = createRootRoute({
11 head: () => ({
12 meta: [
13 { charSet: "utf-8" },
14 { name: "viewport", content: "width=device-width, initial-scale=1" },
15 { title: "Alchemy Prisma TanStack Start" },
16 {
17 name: "description",
18 content: "TanStack Start deployed to Prisma Compute with Alchemy",
19 },
20 ],
21 }),
22 component: RootComponent,
23 notFoundComponent: NotFound,
24});
25
26function RootComponent() {
27 return (
28 <RootDocument>
29 <Outlet />
30 </RootDocument>
31 );
32}
33
34function RootDocument({ children }: Readonly<{ children: ReactNode }>) {
35 return (
36 <html lang="en">
37 <head>
38 <HeadContent />
39 </head>
40 <body>
41 {children}
42 <Scripts />
43 </body>
44 </html>
45 );
46}
47
48function NotFound() {
49 return (
50 <main
51 style={{
52 minHeight: "100vh",
53 display: "grid",
54 placeItems: "center",
55 fontFamily:
56 'Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',
57 color: "#171923",
58 }}
59 >
60 <p>Not Found</p>
61 </main>
62 );
63}