cosmonats 0.8.0 → 0.9.0

data/lib/cosmo/web/views/batches/_table.erb

@@ -1,58 +1,46 @@
 <% if @batches.empty? -%>
-  <div class="alert alert-success">No batches tracked.</div>
+  <section class="card"><div class="empty"><b>No batches tracked</b>Group jobs with <code>Cosmo::Batch.new.jobs { … }</code>.</div></section>
 <% else -%>
-  <div class="table-container">
-    <table>
-      <thead>
-        <tr>
-          <th>Batch</th>
-          <th>Parent</th>
-          <th>Status</th>
-          <th>Progress</th>
-          <th>Total</th>
-          <th>Pending</th>
-          <th>Succeeded</th>
-          <th>Failed</th>
-          <th>Created</th>
-        </tr>
-      </thead>
-      <tbody>
-        <% @batches.each do |b| -%>
-          <% stats = b.stats -%>
-          <% total = stats[:total].to_i -%>
-          <tr>
-            <td><code><%= h(b.bid) %></code></td>
-            <td>
-              <% if b.parent_id -%>
-                <code><%= h(b.parent_id) %></code>
-              <% else -%>
-                <span class="text-muted">&mdash;</span>
-              <% end -%>
-            </td>
-            <td>
-              <% if !b.ready? -%>
-                <span class="badge badge-info">Open</span>
-              <% elsif stats[:failed].to_i.positive? -%>
-                <span class="badge badge-danger">Complete</span>
-              <% else -%>
-                <span class="badge badge-success">Success</span>
-              <% end -%>
-            </td>
-            <td>
-              <% if total.positive? -%>
-                <%= ((total - stats[:pending].to_i) * 100 / total).clamp(0, 100) %>%
-              <% else -%>
-                <span class="text-muted">&mdash;</span>
-              <% end -%>
-            </td>
-            <td><%= format_numbers(stats[:total]) %></td>
-            <td><%= format_numbers(stats[:pending]) %></td>
-            <td><%= format_numbers(stats[:succeeded]) %></td>
-            <td><%= format_numbers(stats[:failed]) %></td>
-            <td><%= format_timestamp(b.created_at) %></td>
-          </tr>
-        <% end -%>
-      </tbody>
-    </table>
+  <div class="batches">
+    <% @batches.each do |b| -%>
+      <% stats = b.stats -%>
+      <% total = stats[:total].to_i -%>
+      <% succeeded = stats[:succeeded].to_i -%>
+      <% failed = stats[:failed].to_i -%>
+      <% done = total - stats[:pending].to_i -%>
+      <% status, tone = if !b.ready? then ['open', 'var(--acc)'] elsif failed.positive? then ['complete with failures', 'var(--warn)'] else ['success', 'var(--ok)'] end -%>
+      <% callbacks = b.callbacks.compact -%>
+      <section class="card batch">
+        <div class="batch-top">
+          <div class="stack" style="flex:1;gap:4px">
+            <div class="mono strong ellip"><%= h(b.bid) %></div>
+            <div class="small-mono ellip">
+              <% if b.parent_id -%>parent <%= h(b.parent_id) %> · <% end -%>started <%= b.created_at ? "#{elapsed(b.created_at)} ago" : '—' %>
+            </div>
+          </div>
+          <span class="pill" style="--tone:<%= tone %>"><%= status %></span>
+        </div>
+        <div class="batch-pct">
+          <b><%= total.positive? ? (done * 100 / total).clamp(0, 100) : 0 %>%</b>
+          <span class="mono mute" style="font-size:11.5px"><%= compact_number(done) %> / <%= compact_number(total) %></span>
+        </div>
+        <div class="progress">
+          <% if total.positive? -%>
+            <i style="width:<%= (succeeded * 100.0 / total).round(2) %>%;background:<%= hue(b.bid) %>"></i>
+            <% if failed.positive? -%><i style="width:<%= [failed * 100.0 / total, 0.6].max.round(2) %>%;background:var(--err)"></i><% end -%>
+          <% end -%>
+        </div>
+        <div class="batch-foot">
+          <span><span class="num" style="color:var(--ink)"><%= format_numbers(succeeded) %></span> succeeded</span>
+          <span><span class="num" style="color:var(--err)"><%= format_numbers(failed) %></span> failed</span>
+          <span><span class="num" style="color:var(--ink)"><%= format_numbers(stats[:pending]) %></span> pending</span>
+          <% if callbacks.any? -%>
+            <span class="cb">
+              <% callbacks.each do |event, callback| -%><span>on_<%= event %> → <%= h(callback[:class]) %></span><% end -%>
+            </span>
+          <% end -%>
+        </div>
+      </section>
+    <% end -%>
   </div>
 <% end -%>

data/lib/cosmo/web/views/batches/index.erb

@@ -1,10 +1,3 @@
-<section>
-  <header><%= render('jobs/_tabs') %></header>
-
-  <div id="batches-table"
-       hx-get="<%= url_for('/batches/_table') %>"
-       hx-trigger="load, every <%= poll_interval %>s"
-       hx-swap="innerHTML">
-    <div class="alert alert-info">Loading batches&hellip;</div>
-  </div>
-</section>
+<div hx-get="<%= url_for('/batches/_table') %>" hx-trigger="load, cosmo:poll" data-poll="<%= poll_interval %>" hx-swap="innerHTML">
+  <section class="card"><div class="loading">Loading batches&hellip;</div></section>
+</div>

data/lib/cosmo/web/views/crons/_table.erb

@@ -1,58 +1,37 @@
 <% if @schedules.empty? -%>
-  <div class="alert alert-success">
-    No cron schedules deployed in NATS.<br>
-    Add a <code>cron:</code> section to <code>cosmo.yml</code> and run
-    <code>cosmo --setup</code> to publish them.
+  <div class="empty">
+    <b>No cron schedules deployed in NATS</b>
+    <span>Add a <code>cron:</code> section to <code>cosmo.yml</code> and run <code>cosmo --setup</code> to publish them.</span>
   </div>
 <% else -%>
-  <div class="table-container">
-    <table>
-      <thead>
-        <tr>
-          <th>Job</th>
-          <th>Expression</th>
-          <th>Timezone</th>
-          <th>Args</th>
-          <th>Stream</th>
-          <th>Actions</th>
-        </tr>
-      </thead>
-      <tbody>
-        <% @schedules.each do |s| -%>
-        <tr id="cron-row-<%= h(s[:registry_key].to_s.gsub("/", "-")) %>">
-          <td>
-            <div class="job-class"><%= h(s[:class].to_s) %></div>
-            <% if s[:name] -%>
-              <code class="text-muted" style="font-size:0.8em;"><%= h(s[:name].to_s) %></code>
-            <% end -%>
-            <div style="font-size:0.75em; color:#888; margin-top:2px;">
-              <code><%= h(s[:schedule_subject].to_s) %></code>
-            </div>
-          </td>
-          <td><code class="subject-tag"><%= h(s[:schedule].to_s) %></code></td>
-          <td><%= h(s[:timezone] || "UTC") %></td>
-          <td>
-            <% if s[:args]&.any? -%>
-              <code><%= h(s[:args].inspect) %></code>
-            <% else -%>
-              <span class="text-muted">&mdash;</span>
-            <% end -%>
-          </td>
-          <td><code><%= h(s[:stream].to_s) %></code></td>
-          <td style="white-space:nowrap;">
-            <a hx-post="<%= url_for('/crons/run', { subject: u(s[:schedule_subject].to_s) }) %>"
-               class="btn btn-success btn-sm"
-               title="Dispatch this job now, bypassing the schedule timer">&#x25BA; Run Now</a>
-            <a hx-delete="<%= url_for('/crons/delete', { subject: u(s[:schedule_subject].to_s) }) %>"
-               hx-target="#crons-table"
-               hx-swap="innerHTML"
-               hx-confirm="Delete '<%= h(s[:schedule_subject].to_s) %>'? NATS will stop firing it."
-               class="btn btn-danger btn-sm"
-               title="Purge schedule from NATS">&#x1F5D1; Delete</a>
-          </td>
-        </tr>
+  <div class="scroll"><div style="min-width:900px">
+    <div class="thead t-crons"><span>Schedule</span><span>Cron</span><span>Stream</span><span>Args</span><span></span></div>
+    <% @schedules.each do |s| -%>
+      <% subject = s[:schedule_subject].to_s -%>
+      <div class="trow hover t-crons">
+        <div class="stack">
+          <span class="strong ellip"><%= h(s[:name] || s[:class]) %></span>
+          <% if s[:name] -%><span class="small-mono ellip"><%= h(s[:class]) %></span><% end -%>
+          <span class="small-mono ellip" title="<%= h(subject) %>"><%= h(subject) %></span>
+        </div>
+        <div class="stack">
+          <span class="mono" style="font-size:12.5px"><%= h(s[:schedule]) %></span>
+          <span class="mute" style="font-size:11.5px"><%= h(s[:timezone] || 'UTC') %></span>
+        </div>
+        <span class="qname"><span class="dot" style="background:<%= hue(s[:stream]) %>"></span><span class="mono ellip"><%= h(s[:stream]) %></span></span>
+        <% if s[:args]&.any? -%>
+          <span class="mono mute ellip" style="font-size:11.5px" title="<%= h(s[:args].inspect) %>"><%= h(s[:args].inspect) %></span>
+        <% else -%>
+          <span class="faint">—</span>
         <% end -%>
-      </tbody>
-    </table>
-  </div>
+        <div class="btns">
+          <button type="button" class="btn" title="Dispatch this job now, bypassing the schedule timer"
+                  hx-post="<%= url_for('/crons/run', { subject: u(subject) }) %>" hx-swap="none" hx-indicator="#global-spinner">► Run now</button>
+          <button type="button" class="btn danger" title="Purge schedule from NATS"
+                  hx-delete="<%= url_for('/crons/delete', { subject: u(subject) }) %>" hx-target="#crons-table" hx-swap="innerHTML"
+                  hx-indicator="#global-spinner" hx-confirm="Delete '<%= h(subject) %>'? NATS will stop firing it.">Delete</button>
+        </div>
+      </div>
+    <% end -%>
+  </div></div>
 <% end -%>

data/lib/cosmo/web/views/crons/index.erb

@@ -1,10 +1,3 @@
-<section>
-  <header><%= render('jobs/_tabs') %></header>
-
-  <div id="crons-table"
-       hx-get="<%= url_for('/crons/_table') %>"
-       hx-trigger="load, every 10s"
-       hx-swap="innerHTML">
-    <div class="alert alert-info">Loading cron schedules&hellip;</div>
-  </div>
+<section class="card" id="crons-table" hx-get="<%= url_for('/crons/_table') %>" hx-trigger="load, cosmo:poll" data-poll="10" hx-swap="innerHTML">
+  <div class="loading">Loading cron schedules&hellip;</div>
 </section>

data/lib/cosmo/web/views/jobs/_args.erb

@@ -0,0 +1,5 @@
+<% json = (JSON.generate(@args) rescue @args.to_s) -%>
+<details class="stack">
+  <summary class="mono mute ellip" style="font-size:11.5px" title="<%= h(json) %>"><%= h(json) %></summary>
+  <pre class="code-block"><%= h((JSON.pretty_generate(@args) rescue @args.to_s)) %></pre>
+</details>

data/lib/cosmo/web/views/jobs/_busy.erb

@@ -1,121 +1,25 @@
-<% nav = @polling ? { limit: @limit } : { limit: @limit, poll: 0 } -%>
-<div id="busy-poller"
-     <% if @polling -%>
-     hx-get="<%= url_for('/jobs/_busy', page: @page, limit: @limit) %>"
-     hx-trigger="every <%= poll_interval %>s"
-     hx-swap="outerHTML"
-     <% end -%>
-     >
-  <div class="pending">
-    <span></span>
-    <span class="poll-status">
-      <span class="text-muted"><%= @total %> job(s) running</span>
-      <% if @polling -%>
-        <a class="btn btn-sm"
-           hx-get="<%= url_for('/jobs/_busy', nav.merge(page: @page, poll: 0)) %>"
-           hx-target="#busy-poller"
-           hx-swap="outerHTML"
-           hx-indicator="#global-spinner">&#9209; Stop Polling</a>
-      <% else -%>
-        <a class="btn btn-sm btn-primary"
-           hx-get="<%= url_for('/jobs/_busy', page: @page, limit: @limit) %>"
-           hx-target="#busy-poller"
-           hx-swap="outerHTML"
-           hx-indicator="#global-spinner">&#x25B6; Live Poll</a>
-      <% end -%>
-    </span>
-  </div>
-
-  <% if @jobs.empty? -%>
-    <div class="alert alert-success">No jobs are currently running</div>
-  <% else -%>
-    <div class="table-container">
-      <table>
-        <thead>
-          <tr>
-            <th>Job</th>
-            <th>JID[Args]</th>
-            <th>Stream</th>
-            <th>Worker</th>
-            <th>Attempt</th>
-            <th>Running for</th>
-          </tr>
-        </thead>
-        <tbody>
-          <% @jobs.each do |job| -%>
-          <tr>
-            <td>
-              <div class="job-class">
-                <%= h(job.dig(:data, :class).to_s) %>
-              </div>
-            </td>
-            <td>
-              <div class="job-id">
-                <details>
-                  <summary>
-                    <code><%= h(job.dig(:data, :jid)) %></code>
-                  </summary>
-                  <code><%= h(JSON.pretty_generate(job.dig(:data, :args))) %></code>
-                </details>
-              </div>
-            </td>
-            <td>
-              <code><%= h(job[:stream].to_s) %></code>
-            </td>
-            <td><code style="font-size: var(--font-size-small);"><%= h(job[:worker].to_s) %></code></td>
-            <td>
-              <% delivery = job[:delivery].to_i -%>
-              <% if delivery > 1 -%>
-                <span class="badge <%= delivery >= 5 ? 'badge-danger' : 'badge-warning' %>"><%= delivery %></span>
-              <% else -%>
-                <span class="text-muted"><%= delivery.zero? ? '&mdash;' : delivery %></span>
-              <% end -%>
-            </td>
-            <td>
-              <%= elapsed(job[:started_at]) %>
-            </td>
-          </tr>
-          <% end -%>
-        </tbody>
-      </table>
-    </div>
-  <% end -%>
-
-  <% if @total_pages.to_i > 1 -%>
-    <div class="pagination">
-      <% if @page > 1 -%>
-        <a hx-get="<%= url_for('/jobs/_busy', nav.merge(page: @page - 1)) %>"
-           hx-target="#busy-poller"
-           hx-swap="outerHTML"
-           hx-indicator="#global-spinner"
-           class="btn">&#x2190; Prev</a>
-      <% else -%>
-        <span class="btn btn-disabled">&#x2190; Prev</span>
-      <% end -%>
-
-      <% pages(@page, @total_pages).each do |p| -%>
-        <% if p == :gap -%>
-          <span class="pagination-gap">&hellip;</span>
-        <% elsif p == @page -%>
-          <span class="btn btn-primary btn-disabled"><%= p %></span>
-        <% else -%>
-          <a hx-get="<%= url_for('/jobs/_busy', nav.merge(page: p)) %>"
-             hx-target="#busy-poller"
-             hx-swap="outerHTML"
-             hx-indicator="#global-spinner"
-             class="btn"><%= p %></a>
-        <% end -%>
-      <% end -%>
-
-      <% if @page < @total_pages -%>
-        <a hx-get="<%= url_for('/jobs/_busy', nav.merge(page: @page + 1)) %>"
-           hx-target="#busy-poller"
-           hx-swap="outerHTML"
-           hx-indicator="#global-spinner"
-           class="btn">Next &#x2192;</a>
-      <% else -%>
-        <span class="btn btn-disabled">Next &#x2192;</span>
-      <% end -%>
-    </div>
-  <% end -%>
-</div>
+<% if @jobs.empty? -%>
+  <div class="empty"><b>All quiet</b>No jobs are running right now.</div>
+<% else -%>
+  <div class="scroll"><div style="min-width:860px">
+    <div class="thead t-jobs"><span>JID</span><span>Class</span><span>Args</span><span>Queue</span><span>Status</span><span class="r">Try</span><span class="r">Running for</span></div>
+    <% @jobs.each do |job| -%>
+      <% delivery = job[:delivery].to_i -%>
+      <% retries = job.dig(:data, :retry) -%>
+      <div class="trow hover t-jobs">
+        <span class="mono mute ellip" style="font-size:11.5px" title="<%= h(job.dig(:data, :jid)) %>"><%= h(job.dig(:data, :jid)) %></span>
+        <div class="stack">
+          <span class="strong ellip"><%= h(job.dig(:data, :class)) %></span>
+          <span class="small-mono ellip" title="<%= h(job[:worker]) %>"><%= h(job[:worker]) %></span>
+        </div>
+        <%= render('jobs/_args', { args: job.dig(:data, :args) }) %>
+        <span class="mono ellip" style="font-size:12px"><%= h(job[:stream]) %></span>
+        <span class="pill" style="--tone:var(--acc)">running</span>
+        <span class="mono r" style="font-size:12px;color:<%= delivery >= 5 ? 'var(--err)' : delivery > 1 ? 'var(--warn)' : 'var(--mute)' %>">
+          <%= delivery.zero? ? '—' : delivery %><%= "/#{retries.to_i + 1}" if retries.is_a?(Integer) && delivery.positive? %>
+        </span>
+        <span class="mono mute r" style="font-size:11.5px"><%= elapsed(job[:started_at]) %></span>
+      </div>
+    <% end -%>
+  </div></div>
+<% end -%>

data/lib/cosmo/web/views/jobs/_dead.erb

@@ -1,83 +1,43 @@
-<div id="dead-jobs">
-  <% if @jobs.empty? -%>
-    <div class="alert alert-success">No dead jobs found</div>
-  <% else -%>
-    <div class="table-container">
-      <table>
-        <thead>
-          <tr>
-            <th>Job</th>
-            <th>JID[Args]</th>
-            <th>Stream</th>
-            <th>Error</th>
-            <th>Failed</th>
-            <th>Actions</th>
-          </tr>
-        </thead>
-        <tbody>
-          <% @jobs.each do |job| -%>
-          <tr class="dead-row" id="dead-row-<%= job.seq %>">
-            <td>
-              <div class="job-class">
-                <%= h(job.data[:class].to_s) %>
-              </div>
-            </td>
-            <td>
-              <div class="job-id">
-                <details>
-                  <summary>
-                    <code><%= h(job.data[:jid].to_s) %></code>
-                  </summary>
-                  <code><%= h((JSON.pretty_generate(job.data[:args]) rescue job.data[:args].to_s)) %></code>
-                </details>
-              </div>
-            </td>
-            <td style="white-space: nowrap;">
-              <% if job.x_stream -%><code><%= h(job.x_stream) %></code><% else -%><span class="text-muted">&mdash;</span><% end -%>
-            </td>
-            <td style="min-width: 420px;">
-              <% if job.error? -%>
-              <div class="error-message">
-                <strong><%= h(job.error_class.to_s.empty? ? "Error" : job.error_class) %></strong>
-                <p><%= h(job.error_message) %></p>
-                <% if job.error_backtrace -%>
-                <details>
-                  <summary>Backtrace</summary>
-                  <code><%= h(job.error_backtrace_lines.join("\n")) %></code>
-                </details>
-                <% end -%>
-              </div>
-              <% else -%>
-              <div class="error-message">
-                <strong>Unknown</strong>
-                <p>No error recorded for this job</p>
-              </div>
-              <% end -%>
-            </td>
-            <td style="white-space: nowrap;">
-              <% if (failed_at = job.stored_at) -%>
-              <time datetime="<%= h(job.timestamp) %>" title="<%= h(job.timestamp) %>"><%= h(format_timestamp(failed_at)) %></time>
-              <div class="text-muted" style="font-size: var(--font-size-small);"><%= elapsed(failed_at) %> ago</div>
-              <% else -%>
-              <span class="text-muted">&mdash;</span>
-              <% end -%>
-            </td>
-            <td style="white-space: nowrap;">
-              <a hx-patch="<%= url_for("/jobs/retry/#{job.seq}") %>"
-                 hx-target="#dead-row-<%= job.seq %>"
-                 hx-swap="innerHTML"
-                 title="Retry"
-                 class="btn btn-primary btn-sm">&#x21BB;</a>
-              <a hx-delete="<%= url_for("/jobs/delete/#{job.seq}") %>"
-                 hx-target="#dead-row-<%= job.seq %>"
-                 hx-swap="innerHTML"
-                 title="Delete"
-                 class="btn btn-danger btn-sm">&#x2715;</a>
-            </td>
-          </tr>
+<% if @jobs.empty? -%>
+  <div class="empty"><b>No dead jobs</b>Nothing has given up.</div>
+<% else -%>
+  <div class="scroll"><div style="min-width:860px">
+    <div class="thead t-jobs actions"><span>JID</span><span>Class</span><span>Args</span><span>Queue</span><span>Status</span><span class="r">Failed</span><span></span></div>
+    <% @jobs.each do |job| -%>
+      <div class="trow hover t-jobs actions">
+        <span class="mono mute ellip" style="font-size:11.5px" title="<%= h(job.data[:jid]) %>"><%= h(job.data[:jid]) %></span>
+        <span class="strong ellip"><%= h(job.data[:class]) %></span>
+        <%= render('jobs/_args', { args: job.data[:args] }) %>
+        <span class="mono ellip" style="font-size:12px"><%= job.x_stream ? h(job.x_stream) : '—' %></span>
+        <span class="pill" style="--tone:var(--err)">dead</span>
+        <% if (failed_at = job.stored_at) -%>
+          <span class="mono mute r" style="font-size:11.5px" title="<%= h(format_timestamp(failed_at)) %>"><%= elapsed(failed_at) %> ago</span>
+        <% else -%>
+          <span class="mono mute r">—</span>
+        <% end -%>
+        <div class="btns">
+          <button type="button" class="btn" title="Retry"
+                  hx-patch="<%= url_for("/jobs/retry/#{job.seq}") %>" hx-target="closest .trow" hx-swap="outerHTML"
+                  hx-indicator="#global-spinner">↻</button>
+          <button type="button" class="btn danger" title="Delete"
+                  hx-delete="<%= url_for("/jobs/delete/#{job.seq}") %>" hx-target="closest .trow" hx-swap="outerHTML"
+                  hx-indicator="#global-spinner" hx-confirm="Delete dead job #<%= job.seq %>?">✕</button>
+        </div>
+        <div class="full error-line">
+          <% if job.error? -%>
+            <b><%= h(job.error_class.to_s.empty? ? 'Error' : job.error_class) %></b>
+            <span><%= h(job.error_message) %></span>
+            <% if job.error_backtrace -%>
+              <details>
+                <summary class="small-mono">Backtrace</summary>
+                <pre class="code-block"><%= h(job.error_backtrace_lines.join("\n")) %></pre>
+              </details>
+            <% end -%>
+          <% else -%>
+            <b>Unknown</b><span class="mute">No error recorded for this job</span>
           <% end -%>
-        </tbody>
-      </table>
-    </div>
-  <% end -%>
-</div>
+        </div>
+      </div>
+    <% end -%>
+  </div></div>
+<% end -%>