SCRUM-248 — AdminUI overview redesign¶
Plan ref: UI-3 (docs/11-admin-plane-plan.md). Stacked on SCRUM-247.
Reads the Dashboard /overview response from SCRUM-234 (with the prober's
ready/reason from SCRUM-235).
What exists¶
| Piece | Notes |
|---|---|
| API client | ServiceOverview gains ready, reason; numeric fields and host figures are number \| null (a failed query stays null, never 0); Overview.degraded |
| Host strip | CPU / Memory / Disk tiles (warn ≥ 80 %, danger ≥ 95 %) and Online players; null → "—" with an "unavailable" hint |
| Service grid | compact fixed-height cards sorted down → not ready → name; status dot (danger / warn / ok), version, the ready reason (ellipsis, full text on hover), rps / err % / p95 |
| Degraded notice | "Some figures are unavailable right now: disk, latency. The rest of the page is current." (warning style, human names) |
| Polling | usePolling: every 15 s, stopped while the tab is hidden (no timer, no requests), immediate refresh on return when stale, in-flight request aborted on hide/unmount |
| Mock | localStorage otomo.mock.overview = 'many' serves a 10-service fixture |
How to verify¶
cd services/adminui
npm run typecheck && npm run lint && npm run format:check && npx vitest run && npm run build
npx playwright test
Results at time of writing¶
- typecheck, lint, prettier, vitest (244 tests), build: pass; Playwright 7/7 incl. "10 services fit on one 1440×900 screen" (bounding boxes).
usePollingtests: no calls across 60 s of fake time while hidden.- Screenshots checked at 1440×900 (10 services + host strip) and 400 px (degraded disk, a down service first).
How it was built¶
DeepSeek run scoped (Landlock) to services/adminui (598 s, ~44k output tokens,
reasoning effort low). Claude review: the degraded notice listed raw card ids
("host.disk") in a red error panel; it now names the figures in words and uses the
warning style, since the rest of the page is still current.