Lukas
36e1e12a8a
- Add v7_startTransition and v7_relativeSplatPath future flags to BrowserRouter to silence React Router deprecation warnings - Add hidden autocomplete='username' inputs to LoginPage and SetupPage so password managers and browsers stop warning about missing username fields in password forms - Mount fail2ban-dev-config volume into backend container at /config:ro so ban_service can open the fail2ban SQLite database returned by 'get dbfile'; this fixes the 500 on GET /api/dashboard/bans - Track compose.debug.yml in git (was previously untracked)
93 lines
3.6 KiB
TypeScript
93 lines
3.6 KiB
TypeScript
/**
|
|
* Application root component.
|
|
*
|
|
* Wraps the entire application in:
|
|
* 1. `FluentProvider` — supplies the Fluent UI theme and design tokens.
|
|
* 2. `BrowserRouter` — enables client-side routing via React Router.
|
|
* 3. `AuthProvider` — manages session state and exposes `useAuth()`.
|
|
*
|
|
* Routes:
|
|
* - `/setup` — first-run setup wizard (always accessible; redirects to /login if already done)
|
|
* - `/login` — master password login (redirects to /setup if not done)
|
|
* - `/` — dashboard (protected, inside MainLayout)
|
|
* - `/map` — world map (protected)
|
|
* - `/jails` — jail list (protected)
|
|
* - `/jails/:name` — jail detail (protected)
|
|
* - `/config` — configuration editor (protected)
|
|
* - `/history` — event history (protected)
|
|
* - `/blocklists` — blocklist management (protected)
|
|
* All unmatched paths redirect to `/`.
|
|
*/
|
|
|
|
import { FluentProvider } from "@fluentui/react-components";
|
|
import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
|
|
import { lightTheme } from "./theme/customTheme";
|
|
import { AuthProvider } from "./providers/AuthProvider";
|
|
import { TimezoneProvider } from "./providers/TimezoneProvider";
|
|
import { RequireAuth } from "./components/RequireAuth";
|
|
import { SetupGuard } from "./components/SetupGuard";
|
|
import { MainLayout } from "./layouts/MainLayout";
|
|
import { SetupPage } from "./pages/SetupPage";
|
|
import { LoginPage } from "./pages/LoginPage";
|
|
import { DashboardPage } from "./pages/DashboardPage";
|
|
import { MapPage } from "./pages/MapPage";
|
|
import { JailsPage } from "./pages/JailsPage";
|
|
import { JailDetailPage } from "./pages/JailDetailPage";
|
|
import { ConfigPage } from "./pages/ConfigPage";
|
|
import { HistoryPage } from "./pages/HistoryPage";
|
|
import { BlocklistsPage } from "./pages/BlocklistsPage";
|
|
|
|
/**
|
|
* Root application component — mounts providers and top-level routes.
|
|
*/
|
|
function App(): React.JSX.Element {
|
|
return (
|
|
<FluentProvider theme={lightTheme}>
|
|
<BrowserRouter future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
|
|
<AuthProvider>
|
|
<Routes>
|
|
{/* Setup wizard — always accessible; redirects to /login if already done */}
|
|
<Route path="/setup" element={<SetupPage />} />
|
|
|
|
{/* Login — requires setup to be complete */}
|
|
<Route
|
|
path="/login"
|
|
element={
|
|
<SetupGuard>
|
|
<LoginPage />
|
|
</SetupGuard>
|
|
}
|
|
/>
|
|
|
|
{/* Protected routes — require setup AND authentication */}
|
|
<Route
|
|
element={
|
|
<SetupGuard>
|
|
<RequireAuth>
|
|
<TimezoneProvider>
|
|
<MainLayout />
|
|
</TimezoneProvider>
|
|
</RequireAuth>
|
|
</SetupGuard>
|
|
}
|
|
>
|
|
<Route index element={<DashboardPage />} />
|
|
<Route path="/map" element={<MapPage />} />
|
|
<Route path="/jails" element={<JailsPage />} />
|
|
<Route path="/jails/:name" element={<JailDetailPage />} />
|
|
<Route path="/config" element={<ConfigPage />} />
|
|
<Route path="/history" element={<HistoryPage />} />
|
|
<Route path="/blocklists" element={<BlocklistsPage />} />
|
|
</Route>
|
|
|
|
{/* Fallback — redirect unknown paths to dashboard */}
|
|
<Route path="*" element={<Navigate to="/" replace />} />
|
|
</Routes>
|
|
</AuthProvider>
|
|
</BrowserRouter>
|
|
</FluentProvider>
|
|
);
|
|
}
|
|
|
|
export default App;
|