Frontend

The dashboard is a Vite/React application in frontend/. Vite runs on strict port 5183, generates TanStack Router’s routeTree.gen.ts from src/routes/, and proxies /api to VITE_API_PROXY_TARGET (default http://localhost:8081). Do not hand-edit the generated route tree.

main.tsx installs React Query, i18next, theme state, and the router. The (auth) group contains setup/login; _authenticated/route.tsx uses React Query to load setup status and the current user, redirects unauthenticated users, and renders the authenticated layout. Feature routes cover dashboard, proxy hosts, load balancing, operations, security, analytics, users, audit logs, settings, cluster, plugins, and AI advisor.

src/api.ts is the typed control-plane client. Requests include cookies, decode API errors, attach JSON content types, and add X-CSRF-Token from bearust_csrf for mutation requests; multipart requests preserve their browser-managed content type while still carrying CSRF. Add an exposed API endpoint here with its request/response type, then consume it through React Query rather than scattering fetch calls.

Theme preference is stored locally first and persisted for an authenticated account. Locale preference resolves account, local storage, then browser preference; formatting goes through Intl helpers in i18n.ts. API-backed development is npm --prefix frontend run dev:api; dev:demo sets VITE_DEMO_MODE=true and uses local demo state instead of relying on a control-plane account.

Run npm test --prefix frontend -- --run for Vitest, npm run build --prefix frontend for the generated route/type/build path, and npm run test:e2e --prefix frontend after installing Chromium with npx playwright install chromium from frontend/.