perf(metrics): a latest-value table for "what is it now"; dashboard cells say loading, failed and as-of (#5208)

The dashboard's host widgets took 18-60 s. Every "latest reading" query
(hosts overview, host-agent fleet, host page, vitals, SNMP, MCP get_host)
searched plugin_metrics for the newest row per metric. Postgres has no skip
scan, so each one read every raw sample in the 7-day window.

- plugin_metric_latest: one row per (source, resource, metric).
  record_metrics upserts it in the same transaction, moving forward only and
  in sorted key order. Migration 0030 seeds it by stepping the existing index.
- Retention drops a latest row once its sample leaves the raw window, so a
  resource that stopped reporting disappears when its history does, as before.
  Renames carry it along.
- A quiet host keeps its last values, marked stale. A time-bounded query
  would have shown it as missing.
- Vitals sparklines span the 6 h they claim, averaged in SQL to ~120 points,
  instead of fetching 6 h raw and drawing the last 120 samples.
- Dashboard and share-view cells: "Loading…" until the first answer; a 20 s
  deadline per fetch; "Couldn't load (why)" with Retry now and an automatic
  retry for cells that don't poll; "as of HH:MM" in the header, and
  "couldn't refresh · as of" when a refresh fails over shown data.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

steward/static/dash-cells.js

@@ -0,0 +1,90 @@
+/* Dashboard widget cells: say when a cell is loading, when it could not load,
+   and how fresh what it shows is (#5208).
+
+   Each .dash-cell-body is an htmx target with a request deadline
+   (hx-request timeout), so every fetch ends in a swap or one of the error
+   events below. A cell that polls keeps polling through htmx's own `every`
+   trigger; a cell that loads once is retried here, re-armed from the failure
+   handler of each attempt, so a failed retry arms the next one. */
+(function () {
+  var RETRY_SECONDS = 30;
+
+  function hhmm(d) {
+    return d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+  }
+
+  function asofOf(cell) {
+    var box = cell.closest('.grid-stack-item-content, .dash-cell');
+    return box ? box.querySelector('.widget-asof') : null;
+  }
+
+  function isCell(el) {
+    return el && el.classList && el.classList.contains('dash-cell-body');
+  }
+
+  function scheduleRetry(cell) {
+    clearTimeout(cell._retry);
+    if (cell.dataset.poll === '1') return;     // its own poll is the retry
+    cell._retry = setTimeout(function () {
+      htmx.trigger(cell, 'retry');
+    }, RETRY_SECONDS * 1000);
+  }
+
+  function failed(cell, why) {
+    var asof = asofOf(cell);
+    var when = cell.dataset.loadedAt ? new Date(+cell.dataset.loadedAt) : null;
+    if (when) {
+      // Keep what it showed; say it is no longer current.
+      if (asof) {
+        asof.textContent = "couldn't refresh · as of " + hhmm(when);
+        asof.classList.add('widget-asof-failed');
+        asof.title = why;
+      }
+    } else {
+      var retryLine = cell.dataset.poll === '1'
+        ? 'Trying again with the next refresh.'
+        : 'Trying again in ' + RETRY_SECONDS + 's.';
+      cell.innerHTML = '';
+      var box = document.createElement('div');
+      box.className = 'cell-state cell-state-failed';
+      var line = document.createElement('div');
+      line.textContent = "Couldn't load this widget (" + why + '). ' + retryLine;
+      var btn = document.createElement('button');
+      btn.type = 'button';
+      btn.className = 'btn btn-sm';
+      btn.textContent = 'Retry now';
+      btn.addEventListener('click', function () {
+        clearTimeout(cell._retry);
+        htmx.trigger(cell, 'retry');
+      });
+      box.appendChild(line);
+      box.appendChild(btn);
+      cell.appendChild(box);
+    }
+    scheduleRetry(cell);
+  }
+
+  document.body.addEventListener('htmx:afterSwap', function (e) {
+    var cell = e.detail.target;
+    if (!isCell(cell)) return;
+    clearTimeout(cell._retry);
+    var now = new Date();
+    cell.dataset.loadedAt = String(now.getTime());
+    var asof = asofOf(cell);
+    if (asof) {
+      asof.textContent = 'as of ' + hhmm(now);
+      asof.classList.remove('widget-asof-failed');
+      asof.title = 'Loaded ' + now.toLocaleString();
+    }
+  });
+
+  document.body.addEventListener('htmx:responseError', function (e) {
+    if (isCell(e.detail.target)) failed(e.detail.target, 'HTTP ' + e.detail.xhr.status);
+  });
+  document.body.addEventListener('htmx:sendError', function (e) {
+    if (isCell(e.detail.target)) failed(e.detail.target, 'no connection');
+  });
+  document.body.addEventListener('htmx:timeout', function (e) {
+    if (isCell(e.detail.target)) failed(e.detail.target, 'timed out');
+  });
+})();

steward/static/steward.css

@@ -371,6 +371,12 @@ body.dash-editing .widget-drawer { transform:translateY(0); }
 .widget-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:0.75rem; }
 .widget-title { font-family:var(--fs-font-body); font-size:var(--fs-size-tiny); font-weight:500; color:var(--text-muted); text-transform:uppercase; letter-spacing:var(--fs-tracking-tiny); }
 .widget-link { font-size:0.8rem; color:var(--text-muted); }
+/* A widget cell's own state (#5208): loading, couldn't load, and how fresh
+   the shown data is. Set by static/dash-cells.js. */
+.widget-asof { font-size:var(--fs-size-tiny); color:var(--text-dim); white-space:nowrap; }
+.widget-asof-failed { color:var(--yellow); }
+.cell-state { font-size:0.85rem; color:var(--text-muted); padding:0.25rem 0; }
+.cell-state-failed { display:flex; flex-direction:column; align-items:flex-start; gap:0.5rem; color:var(--yellow); }
 .widget-link:hover { color:var(--text); }
 
 /* Time range selector */