Mikkel Georgsen
d38f93dd67
- Vite 5 + React 18 + TypeScript 5 + Tailwind 3 scaffold in web/ - ClickHouse design tokens (volt, forest, canvas, charcoal, near-black) in tailwind.config.ts - TanStack Router v1 with placeholder routes for /, /item/$id, /intake, /scan - TanStack Query v5 QueryClientProvider + Zustand uiStore - shadcn/ui Button (neon/forest/secondary/outline/ghost), Card, Badge with ClickHouse variants - Vite proxy: /api -> http://localhost:8080 - Makefile: added frontend and dev-frontend targets - Fixed: @typescript-eslint v8 for ESLint v9 compatibility; @types/node for vite.config.ts
67 lines
1.9 KiB
TypeScript
67 lines
1.9 KiB
TypeScript
import { createRouter, createRoute, createRootRoute, Outlet } from '@tanstack/react-router'
|
|
import { TanStackRouterDevtools } from '@tanstack/router-devtools'
|
|
|
|
// Root layout — wraps all routes with the app shell
|
|
const rootRoute = createRootRoute({
|
|
component: () => (
|
|
<>
|
|
<Outlet />
|
|
{import.meta.env.DEV && <TanStackRouterDevtools />}
|
|
</>
|
|
),
|
|
})
|
|
|
|
// Routes — components are lazy-imported in Plan 03 and 04; stubs for now
|
|
const indexRoute = createRoute({
|
|
getParentRoute: () => rootRoute,
|
|
path: '/',
|
|
component: () => (
|
|
<div className="min-h-screen bg-canvas flex items-center justify-center">
|
|
<p className="text-volt font-display font-black text-2xl">HWLab — Dashboard loading…</p>
|
|
</div>
|
|
),
|
|
})
|
|
|
|
const itemRoute = createRoute({
|
|
getParentRoute: () => rootRoute,
|
|
path: '/item/$id',
|
|
component: () => (
|
|
<div className="min-h-screen bg-canvas flex items-center justify-center">
|
|
<p className="text-volt font-display font-black text-2xl">Item detail loading…</p>
|
|
</div>
|
|
),
|
|
})
|
|
|
|
const intakeRoute = createRoute({
|
|
getParentRoute: () => rootRoute,
|
|
path: '/intake',
|
|
component: () => (
|
|
<div className="min-h-screen bg-canvas flex items-center justify-center">
|
|
<p className="text-volt font-display font-black text-2xl">Intake wizard loading…</p>
|
|
</div>
|
|
),
|
|
})
|
|
|
|
const scanRoute = createRoute({
|
|
getParentRoute: () => rootRoute,
|
|
path: '/scan',
|
|
component: () => (
|
|
<div className="min-h-screen bg-canvas flex items-center justify-center">
|
|
<p className="text-volt font-display font-black text-2xl">QR Scanner loading…</p>
|
|
</div>
|
|
),
|
|
})
|
|
|
|
const routeTree = rootRoute.addChildren([indexRoute, itemRoute, intakeRoute, scanRoute])
|
|
|
|
export const router = createRouter({
|
|
routeTree,
|
|
defaultPreload: 'intent',
|
|
})
|
|
|
|
// TypeScript type augmentation for TanStack Router
|
|
declare module '@tanstack/react-router' {
|
|
interface Register {
|
|
router: typeof router
|
|
}
|
|
}
|