improve web ui

2026-06-26 05:43:34 +00:00
parent 764c814483
commit 187738ed86
73 changed files with 3373 additions and 2847 deletions
@@ -1,51 +1,54 @@
 /// <reference types="vite/client" />
+
+import type { QueryClient } from "@tanstack/react-query";
 import {
-  createRootRouteWithContext,
-  HeadContent,
-  Outlet,
-  Scripts,
-  useRouterState,
-} from '@tanstack/react-router'
-import type { QueryClient } from '@tanstack/react-query'
-import '@fontsource-variable/geist'
-import { AppShell } from '@/components/app-shell'
-import appCss from '@/styles.css?url'
+	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
+	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,
-})
+	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>
-  )
+	// 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>
+	);
 }