55 lines
1.2 KiB
TypeScript
55 lines
1.2 KiB
TypeScript
/// <reference types="vite/client" />
|
|
|
|
import type { QueryClient } from "@tanstack/react-query";
|
|
import {
|
|
createRootRouteWithContext,
|
|
HeadContent,
|
|
Outlet,
|
|
Scripts,
|
|
useRouterState,
|
|
} from "@tanstack/react-router";
|
|
import "@fontsource-variable/geist";
|
|
import { AppShell } from "@/components/app-shell";
|
|
import appCss from "@/styles.css?url";
|
|
|
|
export interface RouterContext {
|
|
queryClient: QueryClient;
|
|
}
|
|
|
|
export const Route = createRootRouteWithContext<RouterContext>()({
|
|
head: () => ({
|
|
meta: [
|
|
{ charSet: "utf-8" },
|
|
{ name: "viewport", content: "width=device-width, initial-scale=1" },
|
|
{ name: "color-scheme", content: "dark light" },
|
|
{ title: "punktfunk" },
|
|
],
|
|
links: [{ rel: "stylesheet", href: appCss }],
|
|
}),
|
|
component: RootComponent,
|
|
});
|
|
|
|
function RootComponent() {
|
|
// The login screen renders bare (no sidebar); everything else gets the app shell.
|
|
const isLogin = useRouterState({
|
|
select: (s) => s.location.pathname === "/login",
|
|
});
|
|
return (
|
|
<html lang="en" className="dark">
|
|
<head>
|
|
<HeadContent />
|
|
</head>
|
|
<body className="min-h-screen">
|
|
{isLogin ? (
|
|
<Outlet />
|
|
) : (
|
|
<AppShell>
|
|
<Outlet />
|
|
</AppShell>
|
|
)}
|
|
<Scripts />
|
|
</body>
|
|
</html>
|
|
);
|
|
}
|