feat: incident timeline visualizer — scrollable event stream with severity bands #57

New issue

Closed

opened 2026-05-28 10:39:19 -07:00 by pyr0ball · 1 comment

pyr0ball commented

2026-05-28 10:39:19 -07:00

Owner

A visual timeline view for incidents and diagnose results showing log events as a scrollable horizontal or vertical strip.

What it adds:

Time axis with log events plotted as points/bars colored by severity
Cluster bands showing burst periods (from Stage 1 timeline data)
Gap markers for silence periods
Click-to-expand individual events
Scope: can be a panel within DiagnoseView (below the reasoning card) and/or IncidentView

Data available:

pipeline_stage SSE events include cluster/burst/gap counts from the TimelineReconstructor
entries SSE event includes full entry list with timestamps and severities
Both are already in the frontend — just not visualized

Implementation options:

Pure CSS/SVG (no lib) — simplest, full control
D3.js — flexible, well-suited to time-series
Chart.js scatter — quick but less customizable

Priority: backlog / UX polish

A visual timeline view for incidents and diagnose results showing log events as a scrollable horizontal or vertical strip. **What it adds:** - Time axis with log events plotted as points/bars colored by severity - Cluster bands showing burst periods (from Stage 1 timeline data) - Gap markers for silence periods - Click-to-expand individual events - Scope: can be a panel within DiagnoseView (below the reasoning card) and/or IncidentView **Data available:** - `pipeline_stage` SSE events include cluster/burst/gap counts from the TimelineReconstructor - `entries` SSE event includes full entry list with timestamps and severities - Both are already in the frontend — just not visualized **Implementation options:** - Pure CSS/SVG (no lib) — simplest, full control - D3.js — flexible, well-suited to time-series - Chart.js scatter — quick but less customizable **Priority:** backlog / UX polish

pyr0ball added this to the beta milestone 2026-06-01 15:10:00 -07:00

pyr0ball modified the milestone from beta to (deleted)

2026-06-05 11:40:10 -07:00

pyr0ball commented

2026-06-10 16:02:37 -07:00

Author

Owner

Closing — pure SVG incident timeline is live in the detail drawer.

What shipped:

Time axis strip with start/end/duration labels
Event ticks colored by severity (height = severity level: DEBUG 16px → CRITICAL 52px)
50-bin density shading shows burst periods
Gap markers (dashed lines) for silence >10% of window or >60s
Hover tooltip: nearest entry severity, timestamp, truncated text
Click-to-scroll: clicking a tick highlights + scrolls the matching entry below
Legend showing only severity levels present in the incident
No external libs — pure SVG + Vue 3 computed

Bonus fix: discovered and fixed a pre-existing bug where get_incident_entries and build_bundle were called with INCIDENTS_DB_PATH instead of DB_PATH — all incident entry lookups were silently returning empty results from the wrong database.

Commit: 373018f

Closing — pure SVG incident timeline is live in the detail drawer. **What shipped:** - Time axis strip with start/end/duration labels - Event ticks colored by severity (height = severity level: DEBUG 16px → CRITICAL 52px) - 50-bin density shading shows burst periods - Gap markers (dashed lines) for silence >10% of window or >60s - Hover tooltip: nearest entry severity, timestamp, truncated text - Click-to-scroll: clicking a tick highlights + scrolls the matching entry below - Legend showing only severity levels present in the incident - No external libs — pure SVG + Vue 3 computed **Bonus fix:** discovered and fixed a pre-existing bug where `get_incident_entries` and `build_bundle` were called with `INCIDENTS_DB_PATH` instead of `DB_PATH` — all incident entry lookups were silently returning empty results from the wrong database. Commit: `373018f`

pyr0ball closed this issue

2026-06-10 16:02:44 -07:00

pyr0ball referenced this issue from a commit

2026-06-11 18:38:01 -07:00

feat(incidents): incident timeline visualizer + fix entry lookup using wrong DB path

pyr0ball referenced this issue from a commit

2026-06-13 21:54:47 -07:00

feat(incidents): incident timeline visualizer + fix entry lookup using wrong DB path

pyr0ball referenced this issue from a commit

2026-06-13 22:18:26 -07:00

feat(incidents): incident timeline visualizer + fix entry lookup using wrong DB path