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/templates/dashboard/_grid_item.html

@@ -11,6 +11,7 @@
         <span class="widget-title" title="{{ item.title }}">{{ item.title }}</span>
       </span>
       <span style="display:flex;align-items:center;gap:0.5rem;flex-shrink:0;">
+        <span class="widget-asof" aria-live="polite"></span>
         <a href="{{ item.defn.detail_url }}" class="widget-link">Details →</a>
         {% if can_edit %}<button type="button" class="panel-chrome btn btn-danger btn-sm"
                 data-remove="{{ item.db.id }}" title="Remove widget"
@@ -19,7 +20,9 @@
     </div>
     <div class="dash-cell-body" id="widget-{{ item.db.id }}"
          hx-get="{{ item.hx_url }}"
-         hx-trigger="load{% if item.defn.poll %}, every {{ poll_interval }}s{% endif %}"
-         hx-swap="innerHTML"></div>
+         hx-trigger="load, retry{% if item.defn.poll %}, every {{ poll_interval }}s{% endif %}"
+         hx-request='{"timeout": 20000}'
+         data-poll="{{ '1' if item.defn.poll else '0' }}"
+         hx-swap="innerHTML"><div class="cell-state">Loading…</div></div>
   </div>
 </div>

steward/templates/dashboard/index.html

@@ -55,6 +55,7 @@
 
 {% block extra_scripts %}
 <script src="{{ url_for('static', filename='vendor/gridstack-12.6.0-all.min.js') }}"></script>
+<script src="{{ url_for('static', filename='dash-cells.js') }}"></script>
 <script>
 (function () {
   var gridEl = document.querySelector('.grid-stack');

steward/templates/dashboard/share_view.html

@@ -11,6 +11,7 @@
   <link rel="stylesheet" href="{{ url_for('static', filename='theme.css') }}">
   <link rel="stylesheet" href="{{ url_for('static', filename='steward.css') }}">
   <script src="{{ url_for('static', filename='chart-colors.js') }}"></script>
+  <script defer src="{{ url_for('static', filename='dash-cells.js') }}"></script>
   {# The palette, type and widget classes come from steward.css like every
      other page; only the read-only page's own frame and its grid live here. #}
   <style>
@@ -45,13 +46,15 @@
          style="grid-column:{{ gw.grid_x + 1 }} / span {{ gw.grid_w }};grid-row:{{ gw.grid_y + 1 }} / span {{ gw.grid_h }};">
       <div class="widget-header">
         <span class="widget-title" title="{{ item.title }}">{{ item.title }}</span>
+        <span class="widget-asof" aria-live="polite"></span>
       </div>
       {# Pass share token as &s= param so require_role allows through #}
       <div class="dash-cell-body" id="widget-{{ gw.id }}"
            hx-get="{{ item.hx_url }}&s={{ raw_token }}"
-           hx-trigger="load{% if item.defn.poll %}, every {{ poll_interval }}s{% endif %}"
-           hx-swap="innerHTML">
-      </div>
+           hx-trigger="load, retry{% if item.defn.poll %}, every {{ poll_interval }}s{% endif %}"
+           hx-request='{"timeout": 20000}'
+           data-poll="{{ '1' if item.defn.poll else '0' }}"
+           hx-swap="innerHTML"><div class="cell-state">Loading…</div></div>
     </div>
     {% endfor %}
   </div>