← ALL SYSTEMS
SYS.05 · Full-stackSTATUS ACTIVE

Overwatch

Live agent observability dashboard

SPECSYS.05
Stack
  • Astro
  • Vanilla TS
  • WebSockets / SSE
  • TimescaleDB
Metric
streaming UI · live latency histograms
Links

Problem

Once voice agents are live, “is it working?” is not a yes/no — it’s a hundred concurrent conversations, each with its own latency, errors and sentiment. You can’t operate what you can’t see. Overwatch is the operator’s window into the running fleet.

Approach — architecture

A streaming dashboard fed by SSE/WebSockets. Metrics land in TimescaleDB; latency is rendered as live histograms rather than misleading averages. The frontend is deliberately lightweight — Astro + vanilla TS — so a wall-mounted NOC screen stays smooth under a firehose of updates.

DATA FLOW
AgentsEvent busTimescaleDBSSE streamDashboard

Writes fan into Timescale; reads stream to the browser over SSE.

What I built

Live transcripts, per-tenant metric tiles, a rolling error feed and latency histograms — all updating in place without thrashing the DOM.

// Coalesce a burst of updates into one paint via rAF (keeps the NOC screen smooth).
let queued = false;
source.onmessage = (e) => {
  buffer.push(JSON.parse(e.data));
  if (!queued) { queued = true; requestAnimationFrame(flush); }
};

Hard parts

  • Streaming UI at volume — batched DOM updates, no per-message reflow.
  • Latency histograms — percentiles that tell the truth under skew.
  • Alerting — thresholds that page a human before customers notice.

Outcome

A single screen that answers “is the fleet healthy?” at a glance, and drills into any one call when it isn’t.

Repo and demo are placeholders until this is public.