docs: describe React dashboard migration state

This commit is contained in:
jjbrunton committed 2026-08-08 15:32:16 +01:00
1 parent dcf2a1200c
commit 8824da3f15
6 files changed
+194 -95

No files matched your search

+28 -3
View File
@@ -670,7 +670,32 @@ How the bot automatically replies to chat messages.
## Dashboard Data Flow
How data flows from services to the web dashboard.
How data flows from services to the React operator console.
### Current React model
1. Feature-local API clients request authoritative snapshots from `/api/*`.
2. Shared Zod schemas in `packages/api-contracts` validate HTTP responses and
realtime envelopes at runtime.
3. TanStack Query caches snapshots, preserves them during background refresh,
and owns mutation pending/error/success state.
4. Operations opens `/api/events/stream`. Each typed event invalidates the
affected query keys, such as stats, timers, conversations, media, or
operations activity.
5. Browser `EventSource` reconnects automatically. The client marks cached
state stale while reconnecting instead of blanking the UI.
```text
services/repositories -> Express /api snapshots -> Zod -> TanStack Query -> React routes
| ^
+-> realtime event hub -> /api/events/stream --------+
```
### Legacy fallback model
The diagram below describes `public/index.html`, which remains only as a
compatibility fallback until Express is switched to authenticated React static
hosting and private-media protection is verified.
```
┌─────────────────────────────────────────────────────────────────┐
@@ -698,7 +723,7 @@ How data flows from services to the web dashboard.
│ ├─► Update in-memory config │
│ └─► Return updated config │
│ │
│ ──── SSE LOG STREAMING ────────────────────────────────────── │
│ ──── LEGACY SSE LOG STREAMING ─────────────────────────────── │
│ │
│ GET /api/logs/stream │
│ ├─► Client connects │
@@ -709,7 +734,7 @@ How data flows from services to the web dashboard.
│ │ └─► Data: { level, message, timestamp } │
│ └─► On disconnect: unsubscribe │
│ │
│ ──── FRONTEND (public/index.html) ─────────────────────────── │
│ ──── LEGACY FALLBACK (public/index.html) ──────────────────── │
│ │
│ JavaScript polls API endpoints: │
│ ├─► /api/stats every 5 seconds │