chrono_forge-dashboard 0.1.0

data/app/queries/chrono_forge/dashboard/analytics_query.rb

@@ -0,0 +1,133 @@
+module ChronoForge
+  module Dashboard
+    # Time-bucketed completion/failure/duration metrics over a window.
+    #
+    # The aggregation runs in the database (GROUP BY a per-day bucket), so it
+    # returns one row per day regardless of how many workflows match — it never
+    # loads workflow rows into Ruby. The bucket and duration expressions are
+    # adapter-specific (SQLite / PostgreSQL / MySQL), chosen once per query.
+    #
+    # Scale note: completed workflows are bucketed (and windowed) by
+    # `completed_at`, which is the leading-range column of the existing
+    # `[state, completed_at]` index, so the heavy path (millions of completed
+    # rows) is an index range scan. Failed workflows have no `completed_at`, so
+    # they are bucketed by `updated_at` (when they reached the failed state) —
+    # a tiny set in practice. The two terminal axes are merged per day.
+    #
+    # Rates here are WORKFLOW-level, not execution-log level: a high count of
+    # failed *execution logs* is normal durably_repeat catch-up churn, whereas a
+    # failed *workflow* is a real incident. This query only ever counts
+    # workflows.
+    class AnalyticsQuery
+      WINDOWS = {"24h" => 1.day, "7d" => 7.days, "30d" => 30.days}.freeze
+      DEFAULT_WINDOW = "7d"
+
+      Bucket = Struct.new(:day, :completed, :failed, :avg_duration) do
+        def terminal = completed + failed
+      end
+
+      def initialize(window: DEFAULT_WINDOW, job_class: nil, now: Time.current)
+        @window = WINDOWS.key?(window.presence) ? window : DEFAULT_WINDOW
+        @job_class = job_class.presence
+        @now = now
+        @since = now - WINDOWS.fetch(@window)
+      end
+
+      attr_reader :window, :since, :job_class
+
+      def windows = WINDOWS.keys
+
+      # Per-day buckets within the window, oldest first.
+      def buckets = data[:buckets]
+
+      # Roll-ups over the whole window: counts, workflow-level rates (nil when no
+      # terminal workflows), and average completed duration in seconds.
+      def totals = data[:totals]
+
+      # The most frequent error classes in the window, highest first, as an
+      # ordered {error_class => count} hash. Scoped to the class when set.
+      def top_errors(limit: 8)
+        rel = ChronoForge::ErrorLog.where(created_at: @since..@now)
+        rel = rel.joins(:workflow).where(ChronoForge::Workflow.table_name => {job_class: @job_class}) if @job_class
+        rel.group(:error_class).order(Arel.sql("COUNT(*) DESC")).limit(limit).count
+      end
+
+      private
+
+      def data
+        @data ||= compute
+      end
+
+      def compute
+        completed_by_day = scope(:completed, "completed_at").group(day("completed_at")).count
+        failed_by_day = scope(:failed, "updated_at").group(day("updated_at")).count
+        durations_by_day = completed_with_duration.group(day("completed_at"))
+          .average(Arel.sql(duration_secs("#{table}.started_at", "#{table}.completed_at")))
+
+        days = (completed_by_day.keys + failed_by_day.keys).uniq.sort
+        buckets = days.map do |d|
+          Bucket.new(
+            day: d,
+            completed: completed_by_day[d].to_i,
+            failed: failed_by_day[d].to_i,
+            avg_duration: durations_by_day[d]&.to_f&.round
+          )
+        end
+
+        c = buckets.sum(&:completed)
+        f = buckets.sum(&:failed)
+        n = c + f
+        avg = completed_with_duration.average(Arel.sql(duration_secs("#{table}.started_at", "#{table}.completed_at")))
+
+        totals = {
+          completed: c, failed: f, terminal: n,
+          completion_rate: n.zero? ? nil : c.to_f / n,
+          failure_rate: n.zero? ? nil : f.to_f / n,
+          avg_duration: avg&.to_f&.round
+        }
+        {buckets: buckets, totals: totals}
+      end
+
+      # Terminal workflows of one state within the window, by the given timestamp
+      # column. Optionally scoped to a single class.
+      def scope(state, time_col)
+        s = ChronoForge::Workflow
+          .where(state: ChronoForge::Workflow.states[state])
+          .where("#{table}.#{time_col}": @since..@now)
+        s = s.where(job_class: @job_class) if @job_class
+        s
+      end
+
+      def completed_with_duration
+        scope(:completed, "completed_at").where.not(started_at: nil)
+      end
+
+      def table = ChronoForge::Workflow.table_name
+
+      def adapter_name
+        @adapter_name ||= ChronoForge::Workflow.with_connection { |c| c.adapter_name }
+      end
+
+      # A 'YYYY-MM-DD' day key for the given timestamp column.
+      def day(col)
+        qualified = "#{table}.#{col}"
+        Arel.sql(
+          case adapter_name
+          when /postgres/i then "to_char(#{qualified}, 'YYYY-MM-DD')"
+          when /mysql|trilogy/i then "DATE_FORMAT(#{qualified}, '%Y-%m-%d')"
+          else "strftime('%Y-%m-%d', #{qualified})" # sqlite + fallback
+          end
+        )
+      end
+
+      # Elapsed seconds between two timestamp columns.
+      def duration_secs(from, to)
+        case adapter_name
+        when /postgres/i then "EXTRACT(EPOCH FROM (#{to} - #{from}))"
+        when /mysql|trilogy/i then "TIMESTAMPDIFF(SECOND, #{from}, #{to})"
+        else "(julianday(#{to}) - julianday(#{from})) * 86400" # sqlite + fallback
+        end
+      end
+    end
+  end
+end

data/app/queries/chrono_forge/dashboard/repetitions_query.rb

@@ -0,0 +1,110 @@
+module ChronoForge
+  module Dashboard
+    # The per-iteration run logs of a single durably_repeat step.
+    #
+    # These live on their own page rather than in the timeline: a long-running
+    # periodic step can accumulate many runs — mostly catch-up "tombstones"
+    # (expired/retried repetitions the engine marks failed and moves past) — and
+    # inlining them would both bury the timeline and load an unbounded set.
+    #
+    # All access is keyed on `[workflow_id, step_name LIKE 'durably_repeat$step$%']`,
+    # which rides the unique `[workflow_id, step_name]` index as a range scan, so
+    # the summary counts and keyset pages stay cheap regardless of history depth.
+    class RepetitionsQuery
+      DEFAULT_PER = 50
+      MAX_PER = 200
+      # Bound the metadata scan used to count fast-forwarded ticks (see #summary):
+      # a pre-upgrade step may carry a long history of legacy per-tick rows.
+      CATCHUP_SCAN_CAP = 1_000
+
+      def initialize(workflow:, step:, before: nil, after: nil, per: DEFAULT_PER)
+        @workflow = workflow
+        @step = step
+        @before = before.presence&.to_i
+        @after = after.presence&.to_i
+        @per = per.to_i.clamp(1, MAX_PER)
+      end
+
+      attr_reader :workflow, :step, :per
+
+      def records
+        load
+        @records
+      end
+
+      def has_next?
+        load
+        @has_next
+      end
+
+      def has_prev?
+        load
+        @has_prev
+      end
+
+      def next_cursor = records.last&.id
+      def prev_cursor = records.first&.id
+
+      # Cheap roll-up (counts + last run) without loading run rows. Grouping by
+      # the `state` enum yields string-label keys ("completed"/"failed"), not
+      # integers.
+      #
+      # `tombstones` is the number of catch-up *rows* (cheap group count).
+      # `skipped_ticks` is the true number of skipped ticks: a fast-forward
+      # summary row collapses N expired ticks into one failed row tagged
+      # `fast_forwarded: N`, so it counts as N, while a legacy per-tick tombstone
+      # counts as 1. They diverge only once a fast-forward has happened.
+      def summary
+        @summary ||= begin
+          by_state = scope.group(:state).count
+          failed = by_state["failed"].to_i
+          {
+            iterations: by_state.values.sum,
+            completed: by_state["completed"].to_i,
+            tombstones: failed,
+            skipped_ticks: failed.zero? ? 0 : skipped_tick_count,
+            last_run_at: scope.maximum(:started_at)
+          }
+        end
+      end
+
+      def scope
+        @workflow.execution_logs.where(
+          "step_name LIKE ?",
+          "durably_repeat#{StepNameParser::DELIM}#{@step}#{StepNameParser::DELIM}%"
+        )
+      end
+
+      private
+
+      # Sum the skipped ticks across catch-up rows: each fast-forward summary row
+      # contributes its `fast_forwarded` count; a legacy per-tick row contributes
+      # 1. Bounded scan (only failed rows, capped) since metadata must be read.
+      def skipped_tick_count
+        scope.where(state: ChronoForge::ExecutionLog.states[:failed])
+          .limit(CATCHUP_SCAN_CAP).pluck(:metadata)
+          .sum { |m| [m&.dig("fast_forwarded").to_i, 1].max }
+      end
+
+      def load
+        return if @loaded
+        @loaded = true
+        col = "#{ChronoForge::ExecutionLog.table_name}.id"
+
+        if @after
+          rows = scope.where("#{col} > ?", @after).order(id: :asc).limit(@per + 1).to_a
+          @has_prev = rows.size > @per
+          @records = rows.first(@per).reverse
+          @has_next = true
+        else
+          s = scope
+          s = s.where("#{col} < ?", @before) if @before
+          rows = s.order(id: :desc).limit(@per + 1).to_a
+          @has_next = rows.size > @per
+          @records = rows.first(@per)
+          @has_prev = @before.present?
+        end
+      end
+    end
+  end
+end

data/app/queries/chrono_forge/dashboard/stats_query.rb

@@ -0,0 +1,30 @@
+module ChronoForge
+  module Dashboard
+    # Per-state workflow counts, each capped so the panel never pays for an
+    # unbounded COUNT. Each count is an index-only COUNT over a `LIMIT CAP`
+    # subquery on the (state, ...) index, so it costs O(CAP) regardless of how
+    # many rows match; a saturated count renders as "CAP+".
+    class StatsQuery
+      CAP = 5000
+
+      def initialize(base: ChronoForge::Workflow.all, cap: CAP)
+        @base = base
+        @cap = cap
+      end
+
+      attr_reader :cap
+
+      def counts
+        ChronoForge::Workflow.states.keys.index_with do |name|
+          capped(@base.where(state: ChronoForge::Workflow.states[name]))
+        end
+      end
+
+      private
+
+      def capped(relation)
+        ChronoForge::Workflow.from(relation.reorder(nil).select(:id).limit(@cap), :capped).count
+      end
+    end
+  end
+end

data/app/queries/chrono_forge/dashboard/workflows_query.rb

@@ -0,0 +1,90 @@
+module ChronoForge
+  module Dashboard
+    # Keyset (cursor) pagination over workflows. Orders by primary key descending
+    # (newest first) and pages with `id < cursor` / `id > cursor` rather than
+    # OFFSET, and never issues a COUNT(*). Both degrade at scale; keyset stays
+    # constant-cost at any depth and over any number of rows. Accepts a `base`
+    # scope so it also drives bounded child lists (e.g. a branch's children).
+    class WorkflowsQuery
+      DEFAULT_PER = 50
+      MAX_PER = 200
+
+      def initialize(base: ChronoForge::Workflow.all, state: nil, job_class: nil, key: nil,
+        created_from: nil, created_to: nil, before: nil, after: nil, per: DEFAULT_PER)
+        @base = base
+        @state = state.presence
+        @job_class = job_class.presence
+        @key = key.presence
+        @created_from = created_from.presence
+        @created_to = created_to.presence
+        @before = before.presence&.to_i
+        @after = after.presence&.to_i
+        @per = per.to_i.clamp(1, MAX_PER)
+      end
+
+      def records
+        load
+        @records
+      end
+
+      attr_reader :per
+
+      def has_next? # older rows remain
+        load
+        @has_next
+      end
+
+      def has_prev? # newer rows remain
+        load
+        @has_prev
+      end
+
+      def next_cursor = records.last&.id
+      def prev_cursor = records.first&.id
+
+      private
+
+      def load
+        return if @loaded
+        @loaded = true
+        col = "#{ChronoForge::Workflow.table_name}.id"
+
+        if @after
+          # Paging toward newer rows (Prev): ids above the cursor, ascending,
+          # then flipped back to descending for display.
+          rows = filtered.where("#{col} > ?", @after).order(id: :asc).limit(@per + 1).to_a
+          @has_prev = rows.size > @per
+          @records = rows.first(@per).reverse
+          @has_next = true
+        else
+          scope = filtered
+          scope = scope.where("#{col} < ?", @before) if @before
+          rows = scope.order(id: :desc).limit(@per + 1).to_a
+          @has_next = rows.size > @per
+          @records = rows.first(@per)
+          @has_prev = @before.present?
+        end
+      end
+
+      # "blocked" is a virtual filter (failed + stalled) used by the branch
+      # children triage view to default to the actionable subset.
+      BLOCKED_STATES = %i[failed stalled].map { |s| ChronoForge::Workflow.states[s] }.freeze
+
+      def filtered
+        s = @base
+        if @state == "blocked"
+          s = s.where(state: BLOCKED_STATES)
+        elsif @state && ChronoForge::Workflow.states.key?(@state)
+          s = s.where(state: ChronoForge::Workflow.states[@state])
+        end
+        s = s.where(job_class: @job_class) if @job_class
+        # Prefix match (not substring) so it can use the `key` index instead of
+        # full-scanning; LIKE wildcards in the input are escaped to literals.
+        s = s.where("key LIKE ?", "#{ChronoForge::Workflow.sanitize_sql_like(@key)}%") if @key
+        s = s.where(created_at: @created_from..) if @created_from
+        s = s.where(created_at: ..@created_to) if @created_to
+        s
+      end
+    end
+  end
+end

data/app/views/chrono_forge/dashboard/analytics/index.html.erb

@@ -0,0 +1,103 @@
+<div class="mb-5">
+  <div class="flex items-center justify-between gap-3">
+    <h1 class="text-lg font-semibold tracking-tight">Analytics</h1>
+    <div class="flex shrink-0 gap-1 rounded-md border border-zinc-200 bg-white p-0.5 text-sm">
+      <% @query.windows.each do |w| %>
+        <% active = @query.window == w %>
+        <%= link_to w, analytics_path(window: w, class: @job_class),
+              class: "rounded px-2.5 py-1 #{active ? "bg-zinc-900 text-white" : "text-zinc-500 hover:text-zinc-900"}" %>
+      <% end %>
+    </div>
+  </div>
+  <% if @job_class %>
+    <p class="mt-1.5 break-all font-mono text-base font-medium text-zinc-800"><%= @job_class %></p>
+    <%= link_to "‹ All classes", analytics_path(window: @query.window), class: cf_chip("mt-1") %>
+  <% else %>
+    <p class="mt-1 text-sm text-zinc-500">Workflow outcomes over time. Counts are workflows, not execution-log steps.</p>
+  <% end %>
+</div>
+
+<div class="mb-5 grid grid-cols-2 gap-3 sm:grid-cols-4">
+  <div class="cf-card p-4">
+    <div class="text-xs uppercase tracking-wide text-zinc-400">Completion rate</div>
+    <div class="mt-1 font-mono text-2xl font-semibold text-emerald-600"><%= cf_pct(@totals[:completion_rate]) %></div>
+  </div>
+  <div class="cf-card p-4">
+    <div class="text-xs uppercase tracking-wide text-zinc-400">Workflow failure rate</div>
+    <div class="mt-1 font-mono text-2xl font-semibold <%= (@totals[:failure_rate] || 0) > 0 ? "text-rose-600" : "text-zinc-900" %>"><%= cf_pct(@totals[:failure_rate]) %></div>
+    <div class="mt-0.5 text-xs text-zinc-400"><%= number_with_delimiter(@totals[:failed]) %> failed</div>
+  </div>
+  <div class="cf-card p-4">
+    <div class="text-xs uppercase tracking-wide text-zinc-400">Avg duration</div>
+    <div class="mt-1 font-mono text-2xl font-semibold text-zinc-900"><%= cf_secs(@totals[:avg_duration]) %></div>
+    <div class="mt-0.5 text-xs text-zinc-400">completed only</div>
+  </div>
+  <div class="cf-card p-4">
+    <div class="text-xs uppercase tracking-wide text-zinc-400">Completed</div>
+    <div class="mt-1 font-mono text-2xl font-semibold text-zinc-900"><%= number_with_delimiter(@totals[:completed]) %></div>
+    <div class="mt-0.5 text-xs text-zinc-400">in window</div>
+  </div>
+</div>
+
+<p class="mb-5 text-xs text-zinc-400">
+  Failure rate counts <strong class="font-medium text-zinc-500">workflows</strong> that ended in the failed state — not failed
+  execution-log steps, which are dominated by normal <code class="font-mono">durably_repeat</code> catch-up retries.
+</p>
+
+<% if @queue %>
+  <section class="cf-card mb-5 p-5">
+    <h2 class="mb-3 text-xs font-medium uppercase tracking-wide text-zinc-500">Queue health <span class="normal-case text-zinc-400">(current)</span></h2>
+    <div class="flex flex-wrap gap-4">
+      <% cf_state_order(@queue.counts.keys).each do |state| %>
+        <% count = @queue.counts[state] %>
+        <div class="flex items-center gap-2 text-sm">
+          <%= cf_dot(state) %>
+          <span class="text-zinc-500"><%= state %></span>
+          <span class="font-mono font-medium tabular-nums"><%= cf_capped(count, @queue.cap) %></span>
+        </div>
+      <% end %>
+    </div>
+  </section>
+<% end %>
+
+<% if @top_errors.any? %>
+  <section class="cf-card mb-5 p-5">
+    <h2 class="mb-3 text-xs font-medium uppercase tracking-wide text-zinc-500">Top error classes <span class="normal-case text-zinc-400">(in window)</span></h2>
+    <% emax = @top_errors.values.max.to_f %>
+    <div class="space-y-2">
+      <% @top_errors.each do |klass, count| %>
+        <div class="flex items-center gap-3 text-sm">
+          <div class="w-64 shrink-0 truncate font-mono text-xs text-rose-600" title="<%= klass %>"><%= klass || "(unknown)" %></div>
+          <div class="flex h-4 min-w-0 flex-1 overflow-hidden rounded bg-zinc-100">
+            <div class="cf-bar bg-rose-300 <%= cf_bar_width(count, emax) %>"></div>
+          </div>
+          <div class="w-16 shrink-0 text-right font-mono text-xs tabular-nums text-zinc-500"><%= number_with_delimiter(count) %></div>
+        </div>
+      <% end %>
+    </div>
+  </section>
+<% end %>
+
+<section class="cf-card p-5">
+  <h2 class="mb-4 text-xs font-medium uppercase tracking-wide text-zinc-500">Daily throughput</h2>
+  <% if @buckets.any? %>
+    <% max = @buckets.map(&:terminal).max.to_f %>
+    <div class="space-y-2">
+      <% @buckets.reverse_each do |b| %>
+        <div class="flex items-center gap-3 text-sm">
+          <div class="w-24 shrink-0 font-mono text-xs text-zinc-500"><%= b.day %></div>
+          <div class="flex h-4 min-w-0 flex-1 overflow-hidden rounded bg-zinc-100">
+            <div class="cf-bar bg-emerald-400 <%= cf_bar_width(b.completed, max) %>"></div>
+            <div class="cf-bar bg-rose-400 <%= cf_bar_width(b.failed, max) %>"></div>
+          </div>
+          <div class="w-32 shrink-0 text-right font-mono text-xs tabular-nums text-zinc-500">
+            <span class="text-emerald-600"><%= number_with_delimiter(b.completed) %></span>
+            <% if b.failed > 0 %><span class="text-rose-600"> / <%= number_with_delimiter(b.failed) %></span><% end %>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  <% else %>
+    <p class="py-8 text-center text-sm text-zinc-500">No workflows completed or failed in this window.</p>
+  <% end %>
+</section>

data/app/views/chrono_forge/dashboard/branch_children/show.html.erb

@@ -0,0 +1,58 @@
+<%= link_to "‹ #{@workflow.key}", workflow_path(@workflow), class: cf_chip("mb-4 max-w-full truncate") %>
+
+<div class="mb-5 flex flex-wrap items-start justify-between gap-3">
+  <div class="min-w-0">
+    <h1 class="text-lg font-semibold tracking-tight">Branch <span class="break-all font-mono"><%= @branch.name %></span></h1>
+    <p class="mt-1 break-all text-sm text-zinc-500">children of <span class="font-mono"><%= @workflow.key %></span></p>
+  </div>
+  <%= button_to "Retry all blocked", bulk_retry_workflow_branch_path(@workflow, @branch_log), method: :post,
+        form: {data: {confirm: "Re-enqueue every failed/stalled child of this branch?"}}, class: "cf-btn cf-btn-primary shrink-0" %>
+</div>
+
+<div data-poll-region>
+  <% current = params.key?(:state) ? params[:state].to_s : "blocked" %>
+  <% blocked = @stats["failed"].to_i + @stats["stalled"].to_i %>
+  <% chip = ->(label, state, count, active) {
+       link_to workflow_branch_path(@workflow, @branch_log, state: state),
+         class: "flex items-center gap-2 rounded-md border px-3 py-1.5 text-sm transition #{active ? "border-zinc-900 bg-zinc-50" : "border-zinc-200 bg-white hover:bg-zinc-50"}" do
+         safe_join([tag.span(label, class: "text-zinc-500"),
+           (count ? tag.span(cf_capped(count, @stats_cap), class: "font-mono font-medium tabular-nums") : "".html_safe)])
+       end
+     } %>
+  <div class="mb-4 flex flex-wrap gap-2">
+    <%= chip.call("blocked", "blocked", blocked, current == "blocked") %>
+    <%= chip.call("all", "", nil, current == "") %>
+    <% ChronoForge::Workflow.states.keys.each do |s| %>
+      <%= chip.call(s, s, @stats[s], current == s) %>
+    <% end %>
+  </div>
+
+  <div class="cf-card overflow-hidden">
+    <div class="overflow-x-auto">
+      <table class="w-full min-w-[40rem] text-sm">
+        <thead>
+          <tr class="border-b border-zinc-200 bg-zinc-50 text-left text-xs uppercase tracking-wide text-zinc-500">
+            <th class="px-4 py-2.5 font-medium">Class</th>
+            <th class="px-4 py-2.5 font-medium">Key</th>
+            <th class="px-4 py-2.5 font-medium">State</th>
+            <th class="px-4 py-2.5 text-right font-medium">Started</th>
+            <th class="px-4 py-2.5 text-right font-medium">Next run</th>
+            <th class="px-4 py-2.5 text-right font-medium">Updated</th>
+          </tr>
+        </thead>
+        <tbody class="divide-y divide-zinc-100">
+          <%= render partial: "chrono_forge/dashboard/workflows/workflow_row", collection: @children, as: :workflow, locals: {waits: @waits} %>
+        </tbody>
+      </table>
+    </div>
+    <% if @children.none? %>
+      <p class="px-4 py-12 text-center text-sm text-zinc-500">No children match this filter.</p>
+    <% end %>
+  </div>
+
+  <% base_params = request.query_parameters.except("before", "after") %>
+  <nav class="mt-4 flex items-center justify-between text-sm">
+    <% if @query.has_prev? %><%= link_to "‹ Newer", base_params.merge(after: @query.prev_cursor), class: cf_chip %><% else %><span></span><% end %>
+    <% if @query.has_next? %><%= link_to "Older ›", base_params.merge(before: @query.next_cursor), class: cf_chip %><% else %><span></span><% end %>
+  </nav>
+</div>

data/app/views/chrono_forge/dashboard/repetitions/index.html.erb

@@ -0,0 +1,69 @@
+<%= link_to "‹ #{@workflow.key}", workflow_path(@workflow), class: cf_chip("mb-4 max-w-full truncate") %>
+
+<div class="mb-5">
+  <h1 class="text-lg font-semibold tracking-tight">
+    Repetitions <span class="text-zinc-400">·</span> <span class="font-mono text-base"><%= @step %></span>
+  </h1>
+  <p class="mt-1 text-sm text-zinc-500">
+    <%= number_with_delimiter(@summary[:iterations]) %> iterations
+    <% if @summary[:skipped_ticks] > 0 %>· <span class="text-amber-600"><%= number_with_delimiter(@summary[:skipped_ticks]) %> catch-up tick<%= "s" unless @summary[:skipped_ticks] == 1 %> skipped</span><% end %>
+    <% if @summary[:last_run_at] %>· last run <%= cf_ago(@summary[:last_run_at]) %><% end %>
+  </p>
+  <p class="mt-1 text-xs text-zinc-400">
+    Skipped ticks are expired repetitions the engine steps past — normal <code class="font-mono">durably_repeat</code> catch-up, not workflow errors. They appear as a per-tick <span class="text-amber-700">tombstone</span> or, after a long gap, a single <span class="text-amber-700">caught&nbsp;up&nbsp;×N</span> summary row.
+  </p>
+</div>
+
+<div class="cf-card overflow-hidden">
+  <div class="overflow-x-auto">
+    <table class="w-full min-w-[44rem] text-sm">
+    <thead>
+      <tr class="border-b border-zinc-200 bg-zinc-50 text-left text-xs uppercase tracking-wide text-zinc-500">
+        <th class="px-4 py-2.5 font-medium">Scheduled</th>
+        <th class="px-4 py-2.5 font-medium">Status</th>
+        <th class="px-4 py-2.5 font-medium">Started</th>
+        <th class="px-4 py-2.5 text-right font-medium">Late by</th>
+        <th class="px-4 py-2.5 text-right font-medium">Duration</th>
+        <th class="px-4 py-2.5 text-right font-medium">Attempts</th>
+        <th class="px-4 py-2.5 font-medium">Error</th>
+      </tr>
+    </thead>
+    <tbody class="divide-y divide-zinc-100">
+      <% @runs.each do |run| %>
+        <% ts = ChronoForge::Dashboard::StepNameParser.parse(run.step_name).timestamp %>
+        <% ff = run.failed? ? run.metadata&.dig("fast_forwarded") : nil %>
+        <% tombstone = run.failed? && ff.nil? %>
+        <tr class="<%= "bg-amber-50" if run.failed? %>">
+          <td class="px-4 py-2.5 font-mono text-xs text-zinc-600"><%= ts ? cf_ago(Time.zone.at(ts)) : "—" %></td>
+          <td class="px-4 py-2.5 text-xs">
+            <% if ff %>
+              <span class="font-medium text-amber-700" title="fast-forwarded <%= ff %> expired tick(s): <%= run.metadata["from"] %> → <%= run.metadata["to"] %>">caught up ×<%= ff %></span>
+            <% elsif tombstone %>
+              <span class="font-medium text-amber-700">tombstone</span>
+            <% else %>
+              <span class="<%= cf_status_color(run.state) %>"><%= run.state %></span>
+            <% end %>
+          </td>
+          <td class="px-4 py-2.5 text-zinc-600"><%= cf_ago(run.started_at) %></td>
+          <% late = (ts && run.started_at) ? (run.started_at - Time.zone.at(ts)).to_i : nil %>
+          <td class="px-4 py-2.5 text-right font-mono text-xs <%= (late && late > 60) ? "text-amber-600" : "text-zinc-500" %>">
+            <%= late.nil? ? "—" : (late <= 0 ? "on time" : cf_secs(late)) %>
+          </td>
+          <td class="px-4 py-2.5 text-right font-mono text-xs text-zinc-500"><%= cf_duration(run.started_at, run.completed_at) %></td>
+          <td class="px-4 py-2.5 text-right font-mono text-xs text-zinc-500">×<%= run.attempts %></td>
+          <td class="px-4 py-2.5 font-mono text-xs text-rose-600"><%= ff ? "—" : (run.error_class || "—") %></td>
+        </tr>
+      <% end %>
+    </tbody>
+    </table>
+  </div>
+  <% if @runs.none? %>
+    <p class="px-4 py-12 text-center text-sm text-zinc-500">No repetitions recorded for this step.</p>
+  <% end %>
+</div>
+
+<% base_params = request.query_parameters.except("before", "after") %>
+<nav class="mt-4 flex items-center justify-between text-sm">
+  <% if @query.has_prev? %><%= link_to "‹ Newer", base_params.merge(after: @query.prev_cursor), class: cf_chip %><% else %><span></span><% end %>
+  <% if @query.has_next? %><%= link_to "Older ›", base_params.merge(before: @query.next_cursor), class: cf_chip %><% else %><span></span><% end %>
+</nav>