span-timeline-events

Installation
SKILL.md

Span Timeline Events

The trace view's right panel shows a timeline of events for the selected span. These are OTel span events rendered by app/utils/timelineSpanEvents.ts and the SpanTimeline component.

How They Work

  1. Span events in OTel are attached to a parent span. In ClickHouse, they're stored as separate rows with kind: "SPAN_EVENT" sharing the parent span's span_id. The #mergeRecordsIntoSpanDetail method reassembles them into the span's events array at query time.
  2. The timeline only renders events whose name starts with trigger.dev/ - all others are silently filtered out.
  3. The display name comes from properties.event (not the span event name), mapped through getFriendlyNameForEvent().
  4. Events are shown on the span they belong to - events on one span don't appear in another span's timeline.

ClickHouse Storage Constraint

When events are written to ClickHouse, spanEventsToTaskEventV1Input() filters out events whose start_time is not greater than the parent span's startTime. Events at or before the span start are silently dropped. This means span events must have timestamps strictly after the span's own startTimeUnixNano.

Timeline Rendering (SpanTimeline component)

The SpanTimeline component in app/components/run/RunTimeline.tsx renders:

Related skills
Installs
5
GitHub Stars
14.8K
First Seen
Apr 2, 2026