CUB-125: implement real-time SSE/WebSocket in React frontend #46

Otto · 2026-05-20T12:58:49-04:00

Otto commented

2026-05-20 12:58:49 -04:00

Summary

Replaces old PR #39 (closed due to structural drift). Clean branch from current dev, CUB-125 frontend commits cherry-picked.

Add useSSE hook with exponential back-off reconnect (1s → 30s), circuit-breaker, cleanup
Add useRealtimeSync hook: SSE events → React Query invalidation
Add SSEContext / SSEProvider for app-wide connection status
SSE status badge in sidebar + mobile header
Settings page: SSE status panel replaces polling-interval slider
Disabled React Query polling — all updates via SSE push
Typed SSE payload interfaces with discriminated union

Closes CUB-125

## Summary Replaces old PR #39 (closed due to structural drift). Clean branch from current dev, CUB-125 frontend commits cherry-picked. - Add `useSSE` hook with exponential back-off reconnect (1s → 30s), circuit-breaker, cleanup - Add `useRealtimeSync` hook: SSE events → React Query invalidation - Add `SSEContext` / `SSEProvider` for app-wide connection status - SSE status badge in sidebar + mobile header - Settings page: SSE status panel replaces polling-interval slider - Disabled React Query polling — all updates via SSE push - Typed SSE payload interfaces with discriminated union Closes CUB-125

Otto added 2 commits 2026-05-20 12:58:49 -04:00

CUB-125 : implement real-time SSE/WebSocket in React frontend 23f9d4a8fb

- Add useSSE hook with exponential back-off reconnect (1s → 30s)
- Add useRealtimeSync hook: maps SSE events to React Query invalidation
  (agent.status → agents; agent.task/agent.progress → tasks+agents; fleet.update → all)
- Add SSEContext/SSEProvider so connection status is available app-wide
- Mount SSEProvider in main.tsx inside QueryClientProvider (no polling)
- Show live/connecting/reconnecting/disconnected badge in sidebar + mobile header
- Update SettingsPage: replace polling interval UI with SSE status panel
- Disable React Query polling (staleTime 60s); all updates pushed via SSE

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

CUB-125 : address Grimm review — tests, type fixes, error state circuit breaker

Dev Build & Deploy / test-and-build (pull_request) Failing after 0s

Details

Dev Build & Deploy / docker-build-push (pull_request) Has been skipped

Details

010408cc45

- Add missing 'offline' to AgentStatus union type (types/index.ts)
- Add max-retry circuit breaker to useSSE; error state is now reachable
- Wire typed SSE payloads (SSEPayloadMap discriminated union) into useRealtimeSync
- Add Vitest + 20 unit tests: useSSE lifecycle, back-off, circuit breaker,
  event parsing, cleanup; useRealtimeSync event-to-invalidation mapping
- Rebase on dev to remove stale CUB-119 legacy-deletion commit and align
  CI workflow (dev already consolidated into single dev.yml)
- Tests: npm test → 20/20 pass; Build: npm run build → 0 errors

overseer merged commit 93bf434a47 into dev

2026-05-20 13:14:30 -04:00

overseer deleted branch agent/rex/CUB-125-realtime-sse-clean

2026-05-20 13:14:30 -04:00

overseer referenced this issue from a commit

2026-05-20 13:14:31 -04:00

Merge pull request 'CUB-125: implement real-time SSE/WebSocket in React frontend' (!46) from agent/rex/CUB-125-realtime-sse-clean into dev

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: CubeCraft-Creations/Control-Center#46