About page for tests

packages/webui/src/routeTree.gen.ts

@@ -16,10 +16,16 @@ import { Route as rootRoute } from './routes/__root'
 
 // Create Virtual Routes
 
+const AboutLazyImport = createFileRoute('/about')()
 const IndexLazyImport = createFileRoute('/')()
 
 // Create/Update Routes
 
+const AboutLazyRoute = AboutLazyImport.update({
+  path: '/about',
+  getParentRoute: () => rootRoute,
+} as any).lazy(() => import('./routes/about.lazy').then((d) => d.Route))
+
 const IndexLazyRoute = IndexLazyImport.update({
   path: '/',
   getParentRoute: () => rootRoute,
@@ -36,12 +42,22 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof IndexLazyImport
       parentRoute: typeof rootRoute
     }
+    '/about': {
+      id: '/about'
+      path: '/about'
+      fullPath: '/about'
+      preLoaderRoute: typeof AboutLazyImport
+      parentRoute: typeof rootRoute
+    }
   }
 }
 
 // Create and export the route tree
 
-export const routeTree = rootRoute.addChildren({ IndexLazyRoute })
+export const routeTree = rootRoute.addChildren({
+  IndexLazyRoute,
+  AboutLazyRoute,
+})
 
 /* prettier-ignore-end */
 
@@ -51,11 +67,15 @@ export const routeTree = rootRoute.addChildren({ IndexLazyRoute })
     "__root__": {
       "filePath": "__root.tsx",
       "children": [
-        "/"
+        "/",
+        "/about"
       ]
     },
     "/": {
       "filePath": "index.lazy.tsx"
+    },
+    "/about": {
+      "filePath": "about.lazy.tsx"
     }
   }
 }

packages/webui/src/routes/__root.tsx

@@ -1,4 +1,4 @@
-import { Outlet, createRootRoute } from "@tanstack/react-router"
+import { Link, Outlet, createRootRoute } from "@tanstack/react-router"
 import { Suspense, lazy } from "react"
 
 
@@ -12,6 +12,16 @@ const TanStackRouterDevtools = process.env.NODE_ENV === "production"
 export function Root() {
     return <>
         <div className="container mx-auto mt-8">
+            <div className="flex flex-row gap-2 justify-center content-center">
+                <Link to="/">
+                    Home
+                </Link>
+
+                <Link to="/about">
+                    About
+                </Link>
+            </div>
+
             <Outlet />
         </div>
 

packages/webui/src/routes/about.lazy.tsx

@@ -0,0 +1,13 @@
+import { createLazyFileRoute } from "@tanstack/react-router"
+import { observer } from "mobx-react-lite"
+
+
+export const About = observer(() => {
+
+    return <>
+        <p className="mx-auto">About</p>
+    </>
+
+})
+
+export const Route = createLazyFileRoute("/about")({ component: About })