smgw-pki/frontend

smgw-pki-console

Web-Konsole für den smgw-pki-automator. React + TypeScript + Vite. Typisierter API-Client wird aus der utoipa-generierten OpenAPI-Spezifikation gebaut.

Stack

• React 19 + TypeScript (strict) + Vite 6
• TanStack Router (file-based) + TanStack Query
• Tailwind v4 + shadcn-Stil Primitives auf Radix
• openapi-typescript + openapi-fetch für typisierten Backend-Client
• Sonner für Toasts, Lucide-Icons

Layout

src/
├── api/schema.d.ts         Generiert via `just gen-api` (oder `bun run gen:api`)
├── components/
│   ├── ui/                 Button, Card, Badge, Table, Dialog …
│   ├── layout/             Sidebar, Topbar, App-Shell
│   └── state-badge.tsx
├── lib/
│   ├── api.ts              openapi-fetch Client
│   ├── format.ts           Datum/Serial-Formatter
│   └── utils.ts            cn()
├── routes/                 TanStack Router (file-based)
│   ├── __root.tsx
│   ├── login.tsx
│   ├── _app.tsx            Auth-Guard + Shell
│   ├── _app.index.tsx      Dashboard
│   ├── _app.certificates.tsx
│   ├── _app.configuration.tsx
│   └── _app.iconfig.tsx
├── index.css               Tailwind Theme (light, BSI-Ton)
└── main.tsx

Lokale Entwicklung

Bun ist die Standard-Toolchain (ein Binary, kein Approval-Tanz für Build-Skripte). Andere Manager (pnpm, npm) funktionieren grundsätzlich auch.

bun install
bun run gen:api         # liest ./openapi.json
bun run dev             # http://localhost:5173, /api wird zu localhost:8443 gepro­xied

Backend separat aus ../backend:

DEV_AUTH=1 CORS_ALLOW_ORIGIN=http://localhost:5173 cargo run

OpenAPI-Client

bun run gen:api          # statisch aus ./openapi.json
bun run gen:api:live     # gegen laufendes Backend (localhost:8443)

OpenAPI selbst stammt aus dem Rust-Code via utoipa-axum. Frischen Snapshot in diesem Verzeichnis ablegen:

cd ../backend && cargo run -- --emit-openapi > ../frontend/openapi.json

Docker (über Repo-Root)

just up         # beide Container bauen + starten
just down
just logs frontend

• Frontend: http://localhost:8080
• Backend (intern): backend:8443
• deploy/nginx.conf wird zur Laufzeit in den Frontend-Container gemountet — Edit + just nginx-reload ohne Image-Rebuild.
• mTLS-Termination findet vor nginx statt; der Proxy setzt X-Forwarded-Cert-Subject. Im Lab läuft das Backend mit DEV_AUTH=1 und akzeptiert ein dev_subject im Login-Body.

Was noch fehlt (TODOs)

• PEM-Anzeige im Certificate-Detail-Drawer (Backend liefert PEM noch nicht separat).
• SSE-Stream für Live-Scheduler-Logs (Endpoint /api/scheduler/stream).
• Vollständige iconfig-Profil-Felder, sobald InitialConfigBuilder real ist.
• Audit-Log-Seite.