CUB-195: add useSSE hook and Zustand camera store for live SSE events #2

2026-05-20T18:57:18-04:00

Rex commented

2026-05-20 18:57:18 -04:00

What

Creates useSSE hook connecting to /api/v1/events/stream via EventSource, with a Zustand store (useCameraStore) for shared camera state.

Files

src/hooks/useSSE.ts — React hook that opens an SSE connection, parses camera_status, camera_online, camera_offline, recording_event events, and dispatches them to the camera store. Exposes connectionState, lastEventTs, and reconnect().
src/store/useCameraStore.ts — Zustand store with Map<string, CameraStatus> core state + setCameras, updateCamera, setOffline, setOnline, setRecording actions. Provides getCameras(), getOnlineCount(), getRecordingCount() derived helpers.
src/store/index.ts — Barrel export.
src/types/index.ts — Added CameraStatus and SSEEvent interfaces matching the Go backend.
src/hooks/index.ts — Re-export useSSE and SSEConnectionState.

Validation

npm run lint → PASS
npm run build → PASS
No new dependencies beyond zustand (which is the lightest state manager at ~1KB)

## What Creates `useSSE` hook connecting to `/api/v1/events/stream` via `EventSource`, with a Zustand store (`useCameraStore`) for shared camera state. ## Files - **`src/hooks/useSSE.ts`** — React hook that opens an SSE connection, parses `camera_status`, `camera_online`, `camera_offline`, `recording_event` events, and dispatches them to the camera store. Exposes `connectionState`, `lastEventTs`, and `reconnect()`. - **`src/store/useCameraStore.ts`** — Zustand store with `Map<string, CameraStatus>` core state + `setCameras`, `updateCamera`, `setOffline`, `setOnline`, `setRecording` actions. Provides `getCameras()`, `getOnlineCount()`, `getRecordingCount()` derived helpers. - **`src/store/index.ts`** — Barrel export. - **`src/types/index.ts`** — Added `CameraStatus` and `SSEEvent` interfaces matching the Go backend. - **`src/hooks/index.ts`** — Re-export `useSSE` and `SSEConnectionState`. ## Validation - `npm run lint` → PASS - `npm run build` → PASS - No new dependencies beyond `zustand` (which is the lightest state manager at ~1KB)

Rex added 1 commit 2026-05-20 18:57:19 -04:00

CUB-195: add useSSE hook and Zustand camera store for live SSE events fa0956c6fd

overseer merged commit cf3df557dd into dev

2026-05-21 10:10:33 -04:00

overseer deleted branch agent/rex/CUB-195-react-sse-hook

2026-05-21 10:10:33 -04:00

overseer referenced this issue from a commit

2026-05-21 10:10:34 -04:00

Merge pull request 'CUB-195: add useSSE hook and Zustand camera store for live SSE events' (#2) from agent/rex/CUB-195-react-sse-hook into dev

Sign in to join this conversation.