feat: container monitoring frontend UI (PR-2)

- Custom ToastContext + ToastProvider + ToastContainer (~170 lines, no deps)
- useEvents() SSE hook with exponential backoff reconnect
- EventProvider context for app-wide SSE stream sharing
- Event-to-toast bridge with severity mapping and deduplication
- Real-time status badge updates replacing 30s polling
- EventSource auth probe (401/429 detection via fetch)
- 14 frontend tests (useEvents + toast-rules)

Quality gates: vitest 14 passed, tsc clean, eslint clean
This commit is contained in:
2026-05-28 23:43:00 +02:00
parent 4a7f24348c
commit f13a63dc2f
16 changed files with 1979 additions and 1368 deletions
@@ -0,0 +1,19 @@
import { useEffect, useRef } from "react";
import { useEventContext } from "../state/events";
import { handleEventToast } from "./toast-rules";
export function EventToastBridge(): JSX.Element | null {
const { events } = useEventContext();
const processedRef = useRef<Set<string>>(new Set());
useEffect(() => {
for (const event of events) {
const key = `${event.correlation_id}:${event.timestamp}`;
if (processedRef.current.has(key)) continue;
processedRef.current.add(key);
handleEventToast(event);
}
}, [events]);
return null;
}