P42 Dashboard: erster Stand

FastAPI-Backend und React-Frontend mit Konten, Sendungsverfolgung,
Projekt-Artikeln, Vorrat & Einkauf mit Rezeptabgleich, Reise-Weltkarte,
Kanban-Projekten mit Priorität, Server-Monitoring und den Designs
Matrix und Blackwall. Betrieb per Docker hinter nginx (siehe DEPLOY.md).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

frontend/src/main.jsx

@@ -0,0 +1,92 @@
+import { lazy, StrictMode, Suspense } from 'react';
+import { createRoot } from 'react-dom/client';
+import { createBrowserRouter, RouterProvider } from 'react-router-dom';
+import '@fontsource/vt323/400.css';
+import '@fontsource/ibm-plex-mono/400.css';
+import '@fontsource/ibm-plex-mono/600.css';
+// Schriften der übrigen Designs (nur @font-face; geladen wird eine Datei erst, wenn das Design sie nutzt)
+import '@fontsource/chakra-petch/latin-400.css';
+import '@fontsource/chakra-petch/latin-500.css';
+import '@fontsource/chakra-petch/latin-600.css';
+import '@fontsource/oxanium/latin-700.css';
+import '@fontsource/oxanium/latin-800.css';
+import { AuthProvider, useAuth } from './auth.jsx';
+import Layout from './components/Layout.jsx';
+import ThemeBackground from './components/ThemeBackground.jsx';
+import { LinksProvider } from './links.jsx';
+import Account from './pages/Account.jsx';
+import Haushalt from './pages/Haushalt.jsx';
+import Kanban from './pages/Kanban.jsx';
+import KanbanBoard from './pages/KanbanBoard.jsx';
+import Home from './pages/Home.jsx';
+import Login from './pages/Login.jsx';
+import Monitoring from './pages/Monitoring.jsx';
+import NotFound from './pages/NotFound.jsx';
+import Projects from './pages/Projects.jsx';
+import Users from './pages/Users.jsx';
+import './theme.js';
+import './styles.css';
+import './themes.css';
+
+// Artikelseite inkl. Editor erst bei Bedarf laden, damit die Startseite schnell bleibt
+const Project = lazy(() => import('./pages/Project.jsx'));
+// Weltkarte (d3, Kartendaten) ebenfalls nur bei Bedarf
+const Reisen = lazy(() => import('./pages/Reisen.jsx'));
+
+const router = createBrowserRouter([
+  {
+    element: <Layout />,
+    children: [
+      { index: true, element: <Home /> },
+      { path: 'projekte', element: <Projects /> },
+      {
+        path: 'projekte/:id',
+        element: <Suspense fallback={<p className="hint">Lade …</p>}><Project /></Suspense>,
+      },
+      { path: 'haushalt', element: <Haushalt /> },
+      { path: 'reisen', element: <Suspense fallback={<p className="hint">Lade …</p>}><Reisen /></Suspense> },
+      { path: 'kanban', element: <Kanban /> },
+      { path: 'kanban/:id', element: <KanbanBoard /> },
+      { path: 'monitoring', element: <Monitoring /> },
+      { path: 'konto', element: <Account /> },
+      { path: 'benutzer', element: <Users /> },
+      { path: '*', element: <NotFound /> },
+    ],
+  },
+]);
+
+// Ohne Anmeldung gibt es nur die Login- bzw. Einrichtungsseite
+function App() {
+  const { state, user, error, retry } = useAuth();
+
+  if (state === 'loading') {
+    return (
+      <div className="auth-page">
+        {error ? (
+          <div className="card auth-card">
+            <p className="error">Server nicht erreichbar: {error}</p>
+            <button className="btn" type="button" onClick={retry}>Erneut versuchen</button>
+          </div>
+        ) : (
+          <p className="hint">Lade …</p>
+        )}
+      </div>
+    );
+  }
+  if (state !== 'ready') return <Login />;
+
+  return (
+    <LinksProvider key={user.id}>
+      <RouterProvider router={router} />
+    </LinksProvider>
+  );
+}
+
+createRoot(document.getElementById('root')).render(
+  <StrictMode>
+    <ThemeBackground />
+    <AuthProvider>
+      <App />
+    </AuthProvider>
+  </StrictMode>,
+);