Phase 4B dashboard and incidents UI

[RobinOppenstam]

Summary

• Added DB-backed /dashboard route with operational health, active incidents, revenue at risk, delayed orders, SLA/availability, support signal, AI agent activity, pending approvals, and historical trend chart.
• Added /incidents route with seeded incident list, status/severity filters, sorting links, and impact summaries.
• Added /incidents/[id] flagship detail route with Warehouse API narrative, timeline, business/customer impact, affected services/customers/orders, evidence previews, agent/recommendation previews, approval/decision previews, reports, and audit previews.
• Wired role query state from the existing role switcher so executive/ops/engineer/support/finance/admin emphasis changes dashboard and detail ordering/actions.
• Added server DB opener, UI formatters, route role resolver, loading/error/not-found states, and live navigation entries.

Phase

• Phase 04B: Dashboard + Incidents UI
• PRD: /root/ralph/plans/commandgrid/phase-04-dashboard-incidents-prd.md
• Data contract: docs/dashboard-incidents-data-contract.md

Acceptance Checklist

• Dashboard displays operational health, active incidents, revenue at risk, delayed orders, SLA, support signal, AI actions, pending approvals, and trend data.
• Incident list displays seeded incidents and supports severity/status filters and sorting.
• Flagship incident detail tells the Warehouse API latency / 312 delayed orders / $48,200 revenue risk story.
• Timeline, impact, customers, evidence, agent preview, approval preview, report preview, and audit preview render from Phase 4A DB data.
• Role switcher affects dashboard/detail emphasis via ?role= query state.
• Planned actions are clearly labelled preview/coming phase.
• Loading/error/not-found states added for new routes.

Verification

• npm install — passed; existing audit output reports 8 moderate vulnerabilities.
• npm run lint — passed.
• npm run typecheck — passed.
• npm test — passed (4 files, 13 passed, 3 DB contract tests skipped by default).
• npm run build — passed.
• npm run cf:build — passed.
• npm run db:check — passed (warehouse-api-latency-spike, 312 delayed orders, $48,200 revenue at risk).

Route Smoke / Visual Notes

• Curl smoke against local dev server:
  • /dashboard?role=executive → 200, rendered Warehouse API content.
  • /incidents?status=active&severity=sev1&sortBy=revenueAtRisk → 200, rendered flagship incident.
  • /incidents/warehouse-api-latency-spike?role=engineer → 200, rendered flagship detail.
  • /incidents/warehouse-api-latency-spike?role=executive → 200, rendered flagship detail with executive role path.
• Browser screenshot tooling was unavailable: Clawdbot browser failed to start with PortInUseError: Port 18801 is already in use. No screenshots were faked.
• Light/dark readability handled with existing Phase 3 shell/primitives and Tailwind dark classes; manual browser screenshot pass is still recommended once browser relay is available.

Risks / Notes

• Normal tests still skip live DB query tests unless COMMANDGRID_RUN_DB_QUERY_TESTS=1; db:check verified the seeded DB connection and flagship data.
• Role switcher updates URL query params for server-rendered role emphasis; client local role state remains the visible shell source.
• Preview/action buttons remain intentionally disabled until Phase 5/6/7 workflow/report functionality.