chrono_forge-dashboard 0.1.0

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

@@ -0,0 +1,73 @@
+<h1 class="mb-1 text-lg font-semibold tracking-tight">Waiting workflows</h1>
+<p class="mb-5 text-sm text-zinc-500">
+  Idle workflows parked on a condition. <span class="font-mono">wait_until</span> polls and times out;
+  <span class="font-mono">continue_if</span> waits on an external event with no timeout — so a signal that never
+  arrives sits here indefinitely.
+</p>
+
+<% if @oldest_event_by_class.any? %>
+  <section class="cf-card mb-5 border-amber-200 bg-amber-50/40 p-5">
+    <h2 class="mb-1 text-xs font-medium uppercase tracking-wide text-amber-700">Oldest unresolved event wait, by class</h2>
+    <p class="mb-3 text-xs text-zinc-500">A <span class="font-mono">continue_if</span> that never resolves is a silent stall. Oldest per class:</p>
+    <div class="divide-y divide-amber-100">
+      <% @oldest_event_by_class.each do |h| %>
+        <% long = (Time.current - (h[:wait].waiting_since || Time.current)) > @threshold %>
+        <div class="flex items-baseline justify-between gap-4 py-1.5">
+          <div class="min-w-0">
+            <span class="font-mono text-sm text-zinc-900"><%= h[:workflow].job_class %></span>
+            <span class="ml-2 font-mono text-xs text-zinc-500"><%= h[:wait].condition %></span>
+          </div>
+          <div class="flex shrink-0 items-baseline gap-3">
+            <span class="text-sm <%= long ? "font-medium text-amber-700" : "text-zinc-600" %>">
+              <%= h[:wait].waiting_since ? "#{distance_of_time_in_words(h[:wait].waiting_since, Time.current)} waiting" : "—" %>
+            </span>
+            <%= link_to "open →", workflow_path(h[:workflow]), class: cf_chip %>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  </section>
+<% end %>
+
+<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">Key</th>
+        <th class="px-4 py-2.5 font-medium">Class</th>
+        <th class="px-4 py-2.5 font-medium">Kind</th>
+        <th class="px-4 py-2.5 font-medium">Condition</th>
+        <th class="px-4 py-2.5 font-medium">Waiting</th>
+        <th class="px-4 py-2.5 text-right font-medium">Timeout</th>
+      </tr>
+    </thead>
+    <tbody class="divide-y divide-zinc-100">
+      <% @waits.each do |h| %>
+        <% long = (Time.current - (h[:wait].waiting_since || Time.current)) > @threshold %>
+        <tr class="cursor-pointer <%= "cf-wait--long bg-amber-50" if long %> hover:bg-zinc-50" data-href="<%= workflow_path(h[:workflow]) %>">
+          <td class="px-4 py-2.5"><%= link_to h[:workflow].key, workflow_path(h[:workflow]), class: "font-mono hover:underline" %></td>
+          <td class="px-4 py-2.5 font-mono text-xs text-zinc-600"><%= h[:workflow].job_class %></td>
+          <td class="px-4 py-2.5 text-xs">
+            <% if h[:wait].event_wait? %>
+              <span class="font-medium text-amber-700">event</span>
+            <% else %>
+              <span class="text-zinc-500">poll</span>
+            <% end %>
+          </td>
+          <td class="px-4 py-2.5 font-mono text-xs text-zinc-600"><%= h[:wait].condition %></td>
+          <td class="px-4 py-2.5 <%= long ? "font-medium text-amber-700" : "text-zinc-600" %>"><%= distance_of_time_in_words(h[:wait].waiting_since, Time.current) %></td>
+          <td class="px-4 py-2.5 text-right font-mono text-xs text-zinc-500"><%= h[:wait].event_wait? ? "none" : (h[:wait].timeout_at || "—") %></td>
+        </tr>
+      <% end %>
+    </tbody>
+  </table>
+  </div>
+  <% if @waits.none? %>
+    <p class="px-4 py-12 text-center text-sm text-zinc-500">No workflows are waiting.</p>
+  <% end %>
+</div>
+
+<% if @capped %>
+  <p class="mt-3 text-xs text-zinc-400">Scanned the <%= @cap %> oldest idle workflows. Narrow with filters on the workflow list for more.</p>
+<% end %>

data/app/views/chrono_forge/dashboard/workflows/_branches.html.erb

@@ -0,0 +1,57 @@
+<section class="cf-card mb-5 p-5">
+  <h2 class="mb-4 text-xs font-medium uppercase tracking-wide text-zinc-500">Branches</h2>
+  <div class="overflow-x-auto">
+    <table class="w-full min-w-[40rem] text-sm">
+      <thead>
+        <tr class="border-b border-zinc-200 text-left text-xs uppercase tracking-wide text-zinc-500">
+          <th class="py-2 pr-4 font-medium">Branch</th>
+          <th class="py-2 pr-4 font-medium">Status</th>
+          <th class="py-2 pr-4 text-right font-medium">Dispatched</th>
+          <th class="py-2 pr-4 text-right font-medium">Pending</th>
+          <th class="py-2 pr-4 text-right font-medium">Blocked</th>
+          <th class="py-2 font-medium"></th>
+        </tr>
+      </thead>
+      <tbody class="divide-y divide-zinc-100">
+        <% branches.branches.each do |b| %>
+          <tr class="cursor-pointer hover:bg-zinc-50" data-href="<%= workflow_branch_path(workflow, b.log) %>">
+            <td class="py-2 pr-4 font-mono"><%= b.name %></td>
+            <td class="py-2 pr-4 text-xs text-zinc-600">
+              <%= b.sealed? ? "sealed" : "dispatching" %><%
+                if b.merge_state %> · <span class="<%= b.merge_state == :merging ? "text-amber-600" : "text-zinc-500" %>"><%= b.merge_state %></span><%
+                elsif b.sealed? %> · <span class="text-zinc-400">unmerged</span><% end %>
+              <% if b.poll_overdue? %>
+                · <span class="font-medium text-rose-600" title="last polled <%= b.last_polled_at&.iso8601 %> · next poll was due <%= b.next_poll_at&.iso8601 %> · <%= b.polls %> polls">poll overdue</span>
+                <%= button_to "resume poller", resume_workflow_path(workflow), method: :post,
+                      form_class: "ml-1 inline-block align-middle",
+                      class: "inline-flex items-center rounded-md border border-rose-200 px-2 py-0.5 text-xs text-rose-700 hover:bg-rose-50" %>
+              <% elsif b.polled? %>
+                · <span class="text-zinc-400" title="<%= b.polls %> polls · next <%= b.next_poll_at&.iso8601 || "—" %>">polling</span>
+              <% end %>
+            </td>
+            <td class="py-2 pr-4 text-right font-mono tabular-nums text-zinc-600"><%= cf_capped(b.dispatched, b.cap) %></td>
+            <td class="py-2 pr-4 text-right font-mono tabular-nums text-zinc-600"><%= cf_capped(b.pending, b.cap) %></td>
+            <td class="py-2 pr-4 text-right font-mono tabular-nums <%= "font-medium text-rose-600" if b.blocked > 0 %>"><%= cf_capped(b.blocked, b.cap) %></td>
+            <td class="py-2 text-right"><%= link_to "details →", workflow_branch_path(workflow, b.log), class: cf_chip %></td>
+          </tr>
+        <% end %>
+      </tbody>
+    </table>
+  </div>
+
+  <% if branches.merges.any? %>
+    <div class="mt-4 border-t border-zinc-100 pt-3">
+      <p class="mb-1 text-[11px] font-medium uppercase tracking-wider text-zinc-400">Merges</p>
+      <p class="mb-2 text-xs text-zinc-400">Each is a <code class="font-mono">BranchMergeJob</code> polling until its branches complete.</p>
+      <% branches.merges.each do |m| %>
+        <div class="flex flex-wrap items-baseline justify-between gap-x-3 gap-y-0.5 py-1 text-sm">
+          <div class="min-w-0">
+            <span class="break-all font-mono text-zinc-700"><%= m.names.join(" + ") %></span>
+            <span class="ml-1.5 text-xs <%= m.merging? ? "text-amber-600" : "text-zinc-400" %>"><%= m.state %></span>
+          </div>
+          <% if m.started_at %><span class="shrink-0 text-xs text-zinc-400">started <%= cf_ago(m.started_at) %></span><% end %>
+        </div>
+      <% end %>
+    </div>
+  <% end %>
+</section>

data/app/views/chrono_forge/dashboard/workflows/_context_tree.html.erb

@@ -0,0 +1,16 @@
+<p class="mb-3 font-mono text-xs text-zinc-400"><%= number_to_human_size(context.byte_size) %></p>
+<% if context.nodes.any? %>
+  <dl class="space-y-3">
+    <% context.nodes.each do |n| %>
+      <div>
+        <div class="flex items-baseline justify-between gap-2">
+          <dt class="font-mono text-sm text-zinc-900"><%= n[:key] %></dt>
+          <span class="shrink-0 font-mono text-[11px] text-zinc-400"><%= n[:type] %></span>
+        </div>
+        <dd class="mt-0.5 break-words font-mono text-sm text-zinc-600"><%= truncate(n[:value].inspect, length: 200) %></dd>
+      </div>
+    <% end %>
+  </dl>
+<% else %>
+  <p class="text-sm text-zinc-500">No context stored.</p>
+<% end %>

data/app/views/chrono_forge/dashboard/workflows/_error_card.html.erb

@@ -0,0 +1,13 @@
+<div class="mt-1.5 rounded-md border border-rose-200 bg-rose-50 px-2.5 py-1.5">
+  <div class="flex flex-wrap items-baseline gap-x-2 font-mono text-xs">
+    <span class="font-medium text-rose-600"><%= err.error_class %></span>
+    <% if err.attempt %><span class="text-zinc-400">attempt <%= err.attempt %></span><% end %>
+  </div>
+  <% if err.error_message.present? %><div class="mt-0.5 text-xs text-rose-700"><%= err.error_message %></div><% end %>
+  <% if err.backtrace.present? %>
+    <details class="mt-1">
+      <summary class="cursor-pointer text-[11px] text-zinc-500">backtrace</summary>
+      <pre class="mt-1 overflow-x-auto rounded bg-white p-2 font-mono text-[11px] text-zinc-600"><%= err.backtrace %></pre>
+    </details>
+  <% end %>
+</div>

data/app/views/chrono_forge/dashboard/workflows/_filters.html.erb

@@ -0,0 +1,6 @@
+<%= form_with url: workflows_path, method: :get, class: "mb-4 flex flex-wrap items-center gap-2" do |f| %>
+  <%= f.select :state, options_for_select([["All states", ""], *ChronoForge::Workflow.states.keys], params[:state]), {}, class: "rounded-md border border-zinc-300 bg-white px-2 py-1.5 text-sm", data: {autosubmit: true} %>
+  <%= f.text_field :job_class, value: params[:job_class], placeholder: "Job class", class: "rounded-md border border-zinc-300 px-2.5 py-1.5 text-sm placeholder:text-zinc-400" %>
+  <%= f.text_field :key, value: params[:key], placeholder: "Key", class: "rounded-md border border-zinc-300 px-2.5 py-1.5 text-sm placeholder:text-zinc-400" %>
+  <%= f.submit "Filter", class: "cf-btn" %>
+<% end %>

data/app/views/chrono_forge/dashboard/workflows/_parent_breadcrumb.html.erb

@@ -0,0 +1,9 @@
+<% parent = parent_log.workflow %>
+<% branch_name = ChronoForge::Dashboard::StepNameParser.parse(parent_log.step_name).name %>
+<div class="mb-2 flex flex-wrap items-center gap-1.5 text-xs text-zinc-500">
+  <%= link_to parent.key, workflow_path(parent), class: "max-w-[16rem] truncate font-mono hover:text-zinc-900 hover:underline" %>
+  <span class="text-zinc-300">›</span>
+  <%= link_to "branch #{branch_name}", workflow_branch_path(parent, parent_log), class: "font-mono hover:text-zinc-900 hover:underline" %>
+  <span class="text-zinc-300">›</span>
+  <span class="text-zinc-400">this child</span>
+</div>

data/app/views/chrono_forge/dashboard/workflows/_periodic.html.erb

@@ -0,0 +1,24 @@
+<div class="overflow-x-auto">
+<table class="w-full min-w-[36rem] text-sm">
+  <thead>
+    <tr class="border-b border-zinc-200 text-left text-xs uppercase tracking-wide text-zinc-500">
+      <th class="py-2 pr-4 font-medium">Task</th>
+      <th class="py-2 pr-4 font-medium">Last run</th>
+      <th class="py-2 pr-4 font-medium">Next run</th>
+      <th class="py-2 pr-4 font-medium">Missed</th>
+      <th class="py-2 font-medium">Latency</th>
+    </tr>
+  </thead>
+  <tbody class="divide-y divide-zinc-100">
+    <% tasks.each do |t| %>
+      <tr>
+        <td class="py-2 pr-4 font-mono"><%= link_to t.name, repetitions_workflow_path(workflow, step: t.name), class: "hover:underline" %></td>
+        <td class="py-2 pr-4 text-xs text-zinc-500"><%= cf_ago(t.last_execution_at) %></td>
+        <td class="py-2 pr-4 font-mono text-xs text-zinc-500"><%= cf_time(t.next_scheduled_at) %></td>
+        <td class="py-2 pr-4 font-mono <%= "cf-periodic--timeout text-rose-600" if t.timed_out_count.positive? %>"><%= t.timed_out_count %></td>
+        <td class="py-2 font-mono text-xs text-zinc-600" title="recent runs: <%= t.latencies.map { |l| "#{l}s" }.join(", ") %>"><%= cf_latency_summary(t.latencies) %></td>
+      </tr>
+    <% end %>
+  </tbody>
+</table>
+</div>

data/app/views/chrono_forge/dashboard/workflows/_stats.html.erb

@@ -0,0 +1,14 @@
+<div class="mb-4 flex flex-wrap gap-2">
+  <% base = request.query_parameters.except("before", "after") %>
+  <% cf_state_order(stats.keys).each do |state| %>
+    <% count = stats[state] %>
+    <% active = params[:state].to_s == state %>
+    <% target = active ? base.except("state") : base.merge(state: state) %>
+    <%= link_to workflows_path(target),
+          class: "cf-stat 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 %>
+      <%= cf_dot(state) %>
+      <span class="text-zinc-500"><%= state %></span>
+      <span class="font-mono font-medium tabular-nums"><%= cf_capped(count, cap) %></span>
+    <% end %>
+  <% end %>
+</div>

data/app/views/chrono_forge/dashboard/workflows/_timeline.html.erb

@@ -0,0 +1,67 @@
+<ol class="cf-timeline">
+  <% entries = timeline.entries %>
+  <% entries.each_with_index do |e, i| %>
+    <% current = timeline.current_position&.id == e.id %>
+    <li class="relative border-l border-zinc-200 pb-5 pl-6 last:border-l-transparent last:pb-0">
+      <span class="cf-dot cf-dot-<%= e.status %> absolute -left-[5px] top-1.5 ring-4 ring-white"></span>
+      <div class="<%= "-ml-2 rounded-md bg-amber-50 px-2 py-1.5 ring-1 ring-amber-200" if current %>">
+        <div class="flex flex-wrap items-baseline gap-x-2 gap-y-1">
+          <span class="font-mono text-[11px] uppercase tracking-wider text-zinc-400"><%= cf_kind_label(e.kind) %></span>
+          <span class="font-mono text-sm font-medium text-zinc-900"><%= e.name %></span>
+          <span class="text-xs <%= cf_status_color(e.status) %>"><%= e.status %></span>
+          <span class="font-mono text-xs text-zinc-400">×<%= e.attempts %></span>
+          <% if e.started_at && e.completed_at %>
+            <span class="font-mono text-xs text-zinc-400">· <%= cf_duration(e.started_at, e.completed_at) %></span>
+          <% end %>
+        </div>
+        <% if e.started_at || e.last_executed_at %>
+          <div class="mt-0.5 font-mono text-[11px] text-zinc-400">
+            <% if e.started_at %>started <%= cf_ago(e.started_at) %><% end %>
+            <% if e.completed_at %> · finished <%= cf_ago(e.completed_at) %><% elsif e.last_executed_at %> · last run <%= cf_ago(e.last_executed_at) %><% end %>
+          </div>
+        <% end %>
+        <% pairs = cf_meta_pairs(e.metadata) %>
+        <% if pairs.any? %>
+          <dl class="mt-1 flex flex-wrap gap-x-4 gap-y-0.5 font-mono text-[11px]">
+            <% pairs.each do |label, value| %>
+              <div class="min-w-0"><span class="text-zinc-400"><%= label %>:</span> <span class="text-zinc-600"><%= truncate(value, length: 80) %></span></div>
+            <% end %>
+          </dl>
+        <% end %>
+        <% if e.missing_error_id %>
+          <div class="mt-1.5 rounded-md border border-zinc-200 bg-zinc-50 px-2.5 py-1.5 font-mono text-xs text-zinc-500">
+            error log #<%= e.missing_error_id %> is no longer available
+          </div>
+        <% end %>
+        <% if e.errors.any? %>
+          <%= render partial: "error_card", collection: e.errors, as: :err %>
+        <% elsif e.error_class %>
+          <div class="mt-1 font-mono text-xs text-rose-600">
+            <%= e.error_class %><% if e.error_message.present? %>: <span class="font-normal text-rose-500"><%= truncate(e.error_message, length: 160) %></span><% end %>
+          </div>
+        <% end %>
+        <% if e.kind == :repeat_coordination && e.iterations.to_i > 0 %>
+          <div class="mt-1.5 flex flex-wrap items-baseline gap-x-2 text-xs text-zinc-500">
+            <span><%= pluralize(e.iterations, "iteration") %></span>
+            <% if e.skipped_ticks.to_i > 0 %>
+              <span class="text-amber-600">· <%= e.skipped_ticks %> catch-up tick<%= "s" unless e.skipped_ticks == 1 %> skipped</span>
+            <% end %>
+            <% if e.last_run_at %>
+              <span>· last run <%= cf_ago(e.last_run_at) %></span>
+            <% end %>
+          </div>
+          <div class="mt-2">
+            <%= link_to "repetitions →", repetitions_workflow_path(timeline.workflow, step: e.name), class: cf_chip %>
+          </div>
+        <% end %>
+      </div>
+    </li>
+  <% end %>
+</ol>
+
+<% if timeline.orphan_errors.any? %>
+  <div class="mt-4 border-t border-zinc-100 pt-3">
+    <p class="mb-1 text-[11px] font-medium uppercase tracking-wider text-zinc-400">Other errors</p>
+    <%= render partial: "error_card", collection: timeline.orphan_errors, as: :err %>
+  </div>
+<% end %>

data/app/views/chrono_forge/dashboard/workflows/_wait_callout.html.erb

@@ -0,0 +1,5 @@
+<div class="cf-wait-callout mb-5 rounded-md border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-900">
+  Waiting on <span class="font-mono"><%= wait.condition %></span>
+  for <%= distance_of_time_in_words(wait.waiting_since, Time.current) %>
+  · timeout <span class="font-mono"><%= wait.timeout_at || "—" %></span>
+</div>

data/app/views/chrono_forge/dashboard/workflows/_workflow_row.html.erb

@@ -0,0 +1,8 @@
+<tr class="cursor-pointer hover:bg-zinc-50" data-href="<%= workflow_path(workflow) %>">
+  <td class="px-4 py-2.5 font-mono text-xs text-zinc-500"><%= workflow.job_class %></td>
+  <td class="px-4 py-2.5"><%= link_to workflow.key, workflow_path(workflow), class: "font-mono text-zinc-900 hover:underline" %></td>
+  <td class="px-4 py-2.5"><%= cf_state_badge(workflow, waits && waits[workflow.id]) %></td>
+  <td class="px-4 py-2.5 text-right text-xs text-zinc-500"><%= cf_ago(workflow.started_at) %></td>
+  <td class="px-4 py-2.5 text-right text-xs text-zinc-500"><%= cf_ago((waits && waits[workflow.id])&.next_run_at) %></td>
+  <td class="px-4 py-2.5 text-right text-xs text-zinc-500"><%= cf_ago(workflow.updated_at) %></td>
+</tr>

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

@@ -0,0 +1,39 @@
+<div class="mb-5 flex items-center justify-between">
+  <h1 class="text-lg font-semibold tracking-tight">Workflows</h1>
+  <%= button_to "Retry failed & stalled", bulk_retry_workflows_path, method: :post,
+        form: {data: {confirm: "Re-enqueue every failed and stalled workflow?"}}, class: "cf-btn" %>
+</div>
+
+<div data-poll-region>
+  <%= render "stats", stats: @stats, cap: @stats_cap %>
+  <%= render "filters", query: @query %>
+
+  <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: "workflow_row", collection: @workflows, as: :workflow, locals: {waits: @waits} %>
+        </tbody>
+      </table>
+    </div>
+    <% if @workflows.none? %>
+      <p class="px-4 py-12 text-center text-sm text-zinc-500">No workflows match these filters.</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/workflows/show.html.erb

@@ -0,0 +1,79 @@
+<%= link_to "‹ Workflows", workflows_path, class: cf_chip("mb-2") %>
+<%= render "parent_breadcrumb", parent_log: @parent_log if @parent_log %>
+
+<div class="mb-6">
+  <div class="flex flex-wrap items-start justify-between gap-3">
+    <div class="min-w-0">
+      <%= cf_state_badge(@workflow, @wait) %>
+      <h1 class="mt-1.5 break-all font-mono text-xl font-semibold tracking-tight"><%= @workflow.key %></h1>
+      <p class="mt-1 flex flex-wrap items-center gap-x-2 gap-y-1 text-sm text-zinc-500">
+        <span class="break-all font-mono"><%= @workflow.job_class %></span>
+        <%= link_to "metrics →", analytics_path(class: @workflow.job_class), class: cf_chip %>
+      </p>
+    </div>
+    <% if @workflow.retryable? || @workflow.running? || @workflow.idle? %>
+      <div class="flex shrink-0 flex-wrap items-center gap-2">
+        <% if @workflow.idle? %>
+          <%= button_to "Resume", resume_workflow_path(@workflow), method: :post, class: "cf-btn cf-btn-primary" %>
+        <% end %>
+        <% if @workflow.retryable? %>
+          <%= button_to "Retry", retry_workflow_path(@workflow), method: :post, class: "cf-btn cf-btn-primary" %>
+        <% end %>
+        <% if @workflow.running? %>
+          <%= button_to "Force unlock", unlock_workflow_path(@workflow), method: :post,
+                form: {data: {confirm: "Force-unlocking a running workflow can cause duplicate execution. Continue?"}}, class: "cf-btn cf-btn-danger" %>
+        <% end %>
+      </div>
+    <% end %>
+  </div>
+
+  <dl class="mt-4 grid grid-cols-2 gap-x-6 gap-y-3 text-sm sm:grid-cols-4">
+    <div><dt class="text-xs uppercase tracking-wide text-zinc-400">Created</dt><dd class="font-mono text-zinc-700"><%= cf_ago(@workflow.created_at) %></dd></div>
+    <div><dt class="text-xs uppercase tracking-wide text-zinc-400">Started</dt><dd class="font-mono text-zinc-700"><%= cf_ago(@workflow.started_at) %></dd></div>
+    <div><dt class="text-xs uppercase tracking-wide text-zinc-400">Completed</dt><dd class="font-mono text-zinc-700"><%= cf_ago(@workflow.completed_at) %></dd></div>
+    <div><dt class="text-xs uppercase tracking-wide text-zinc-400">Duration</dt><dd class="font-mono text-zinc-700"><%= cf_duration(@workflow.started_at, @workflow.completed_at || @workflow.updated_at) %></dd></div>
+    <div><dt class="text-xs uppercase tracking-wide text-zinc-400">Locked by</dt><dd class="break-all font-mono text-zinc-700"><%= @workflow.locked_by || "—" %></dd></div>
+    <div><dt class="text-xs uppercase tracking-wide text-zinc-400">Locked at</dt><dd class="font-mono text-zinc-700"><%= cf_ago(@workflow.locked_at) %></dd></div>
+  </dl>
+</div>
+
+<%= render "wait_callout", wait: @wait if @wait %>
+
+<section class="cf-card mb-5 p-5">
+  <h2 class="mb-4 text-xs font-medium uppercase tracking-wide text-zinc-500">Timeline</h2>
+  <%= render "timeline", timeline: @timeline %>
+</section>
+
+<% if @periodic.any? %>
+  <section class="cf-card mb-5 p-5">
+    <h2 class="mb-3 text-xs font-medium uppercase tracking-wide text-zinc-500">Periodic tasks</h2>
+    <%= render "periodic", tasks: @periodic, workflow: @workflow %>
+  </section>
+<% end %>
+
+<%= render "branches", branches: @branches, workflow: @workflow if @branches.any? %>
+
+<div class="grid gap-5 md:grid-cols-2">
+  <section class="cf-card p-5">
+    <h2 class="mb-3 text-xs font-medium uppercase tracking-wide text-zinc-500">Arguments</h2>
+    <% if @workflow.kwargs.present? %>
+      <dl class="space-y-3">
+        <% @workflow.kwargs.each do |key, value| %>
+          <div>
+            <div class="flex items-baseline justify-between gap-2">
+              <dt class="font-mono text-sm text-zinc-900"><%= key %></dt>
+              <span class="shrink-0 font-mono text-[11px] text-zinc-400"><%= value.class.name %></span>
+            </div>
+            <dd class="mt-0.5 break-words font-mono text-sm text-zinc-600"><%= truncate(value.inspect, length: 200) %></dd>
+          </div>
+        <% end %>
+      </dl>
+    <% else %>
+      <p class="text-sm text-zinc-500">No arguments.</p>
+    <% end %>
+  </section>
+  <section class="cf-card p-5">
+    <h2 class="mb-3 text-xs font-medium uppercase tracking-wide text-zinc-500">Context</h2>
+    <%= render "context_tree", context: @context %>
+  </section>
+</div>

data/app/views/layouts/chrono_forge/dashboard/application.html.erb

@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>ChronoForge</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <%= csrf_meta_tags %>
+  <link rel="stylesheet" href="<%= "#{request.script_name}/assets/dashboard.css?v=#{ChronoForge::Dashboard.asset_digest("dashboard.css")}" %>">
+</head>
+<body class="min-h-screen bg-zinc-50 font-sans text-zinc-900 antialiased" data-poll-interval="<%= cf_poll_interval %>">
+  <% if flash.any? %>
+    <div class="pointer-events-none fixed right-4 top-4 z-50 flex w-80 max-w-[calc(100vw-2rem)] flex-col gap-2">
+      <% flash.each do |type, msg| %>
+        <div data-flash class="pointer-events-auto rounded-md border px-3 py-2 text-sm shadow-md transition-opacity duration-300 <%= type.to_s == "alert" ? "border-rose-200 bg-rose-50 text-rose-800" : "border-emerald-200 bg-emerald-50 text-emerald-800" %>"><%= msg %></div>
+      <% end %>
+    </div>
+  <% end %>
+  <header class="border-b border-zinc-200 bg-white">
+    <div class="mx-auto flex max-w-6xl flex-wrap items-center gap-x-6 gap-y-2 px-4 py-3">
+      <a href="<%= root_path %>" class="flex items-center gap-2 font-semibold tracking-tight">
+        <span class="inline-block h-3.5 w-3.5 rounded-sm bg-zinc-900"></span>
+        ChronoForge
+      </a>
+      <nav class="flex items-center gap-5 text-sm">
+        <a href="<%= root_path %>" class="<%= controller_name == "workflows" ? "font-medium text-zinc-900" : "text-zinc-500 hover:text-zinc-900" %>">Workflows</a>
+        <a href="<%= wait_states_path %>" class="<%= controller_name == "wait_states" ? "font-medium text-zinc-900" : "text-zinc-500 hover:text-zinc-900" %>">Waiting</a>
+        <a href="<%= analytics_path %>" class="<%= controller_name == "analytics" ? "font-medium text-zinc-900" : "text-zinc-500 hover:text-zinc-900" %>">Analytics</a>
+      </nav>
+      <div class="ml-auto flex flex-wrap items-center gap-2">
+        <% current_poll = cf_poll_interval %>
+        <label class="flex items-center gap-1 text-xs text-zinc-400" title="Auto-refresh">
+          <span>refresh</span>
+          <select data-poll-select class="rounded-md border border-zinc-200 bg-white px-1.5 py-1 text-xs text-zinc-700">
+            <% (cf_poll_options | [current_poll]).sort.each do |secs| %>
+              <option value="<%= secs %>" <%= "selected" if secs == current_poll %>><%= cf_poll_label(secs) %></option>
+            <% end %>
+          </select>
+        </label>
+        <div class="flex items-center gap-0.5 rounded-md border border-zinc-200 p-0.5 text-xs" title="Timestamp display">
+          <button type="button" data-time-set="relative" class="rounded px-2 py-0.5 <%= cf_absolute_time? ? "text-zinc-500 hover:text-zinc-900" : "bg-zinc-900 text-white" %>">relative</button>
+          <button type="button" data-time-set="absolute" class="rounded px-2 py-0.5 <%= cf_absolute_time? ? "bg-zinc-900 text-white" : "text-zinc-500 hover:text-zinc-900" %>">absolute</button>
+        </div>
+      </div>
+    </div>
+  </header>
+  <main class="mx-auto max-w-6xl px-4 py-6">
+    <%= yield %>
+  </main>
+  <script src="<%= "#{request.script_name}/assets/dashboard.js?v=#{ChronoForge::Dashboard.asset_digest("dashboard.js")}" %>"></script>
+</body>
+</html>

data/config/routes.rb

@@ -0,0 +1,20 @@
+ChronoForge::Dashboard::Engine.routes.draw do
+  root to: "workflows#index"
+  resources :workflows, only: %i[index show] do
+    member do
+      post :retry, to: "actions#retry"
+      post :resume, to: "actions#resume"
+      post :unlock, to: "actions#unlock"
+      get :repetitions, to: "repetitions#index"
+    end
+    collection do
+      post :bulk_retry, to: "actions#bulk_retry"
+    end
+    resources :branches, only: :show, controller: "branch_children" do
+      member { post :bulk_retry, to: "actions#bulk_retry_branch" }
+    end
+  end
+  resources :wait_states, only: :index
+  get "analytics", to: "analytics#index", as: :analytics
+  get "assets/:file", to: "assets#show", constraints: {file: /dashboard\.(css|js)/}
+end

data/lib/chrono_forge/dashboard/configuration.rb

@@ -0,0 +1,32 @@
+module ChronoForge
+  module Dashboard
+    class AuthenticationNotConfigured < StandardError
+      MESSAGE = <<~MSG.freeze
+        ChronoForge::Dashboard has no authentication configured. Do one of:
+          - ChronoForge::Dashboard.configure { |c| c.http_basic = { username:, password: } }
+          - ChronoForge::Dashboard.configure { |c| c.authenticate { |controller| ... } }
+          - ChronoForge::Dashboard.configure { |c| c.authentication = :none }  # then guard the mount with your own routing constraint
+      MSG
+      def initialize(msg = MESSAGE) = super
+    end
+
+    class Configuration
+      attr_accessor :http_basic, :authentication
+      attr_reader :auth_hook
+      attr_accessor :polling_interval, :polling_interval_options, :page_size, :long_wait_threshold
+
+      def initialize
+        @http_basic = nil
+        @authentication = nil
+        @auth_hook = nil
+        @polling_interval = 5
+        # Selectable auto-refresh intervals (seconds; 0 = off) for the nav control.
+        @polling_interval_options = [0, 5, 10, 30, 60, 300]
+        @page_size = 50
+        @long_wait_threshold = 3600
+      end
+
+      def authenticate(&block) = @auth_hook = block
+    end
+  end
+end

data/lib/chrono_forge/dashboard/engine.rb

@@ -0,0 +1,9 @@
+require "rails/engine"
+
+module ChronoForge
+  module Dashboard
+    class Engine < ::Rails::Engine
+      isolate_namespace ChronoForge::Dashboard
+    end
+  end
+end

data/lib/chrono_forge/dashboard/step_name_parser.rb

@@ -0,0 +1,32 @@
+module ChronoForge
+  module Dashboard
+    module StepNameParser
+      Parsed = Struct.new(:kind, :name, :timestamp, :raw)
+      DELIM = "$"
+
+      def self.parse(step_name)
+        prefix, name, ts = step_name.to_s.split(DELIM, 3)
+        case prefix
+        when "" # framework lifecycle markers: $workflow_completion$, $workflow_failure$<id>, $workflow_retry$<ts>
+          # The trailing segment is the error-log id for failures (a timestamp for retries).
+          Parsed.new(kind: :lifecycle, name: name.to_s.delete_prefix("workflow_"),
+            timestamp: Integer(ts, exception: false), raw: step_name)
+        when "durably_execute" then Parsed.new(kind: :execute, name: name, raw: step_name)
+        when "wait" then Parsed.new(kind: :sleep, name: name, raw: step_name)
+        when "wait_until" then Parsed.new(kind: :wait, name: name, raw: step_name)
+        when "continue_if" then Parsed.new(kind: :continue, name: name, raw: step_name)
+        when "branch" then Parsed.new(kind: :branch, name: name, raw: step_name)
+        when "merge" then Parsed.new(kind: :merge, name: name, raw: step_name)
+        when "durably_repeat"
+          if ts
+            Parsed.new(kind: :repeat_run, name: name, timestamp: Integer(ts, exception: false), raw: step_name)
+          else
+            Parsed.new(kind: :repeat_coordination, name: name, raw: step_name)
+          end
+        else
+          Parsed.new(kind: :unknown, name: step_name, raw: step_name)
+        end
+      end
+    end
+  end
+end

data/lib/chrono_forge/dashboard/version.rb

@@ -0,0 +1,5 @@
+module ChronoForge
+  module Dashboard
+    VERSION = "0.1.0"
+  end
+end

data/lib/chrono_forge/dashboard.rb

@@ -0,0 +1,30 @@
+require "chrono_forge"
+require "chrono_forge/dashboard/version"
+require "chrono_forge/dashboard/configuration"
+require "chrono_forge/dashboard/engine"
+require "chrono_forge/dashboard/step_name_parser"
+
+module ChronoForge
+  module Dashboard
+    ASSET_ROOT = "app/assets/chrono_forge/dashboard"
+
+    class << self
+      def config = (@config ||= Configuration.new)
+      def configure = yield(config)
+      def reset_configuration! = @config = Configuration.new
+
+      # Short content digest of a shipped asset, used to cache-bust the served
+      # CSS/JS so a gem upgrade (or a local rebuild) is picked up despite the
+      # long immutable cache header. Memoized; computed once per boot.
+      def asset_digest(file)
+        @asset_digests ||= {}
+        @asset_digests[file] ||= begin
+          require "digest"
+          Digest::SHA256.file(Engine.root.join(ASSET_ROOT, file)).hexdigest[0, 12]
+        rescue
+          VERSION
+        end
+      end
+    end
+  end
+end