refactor(frontend): migrate agent stat-window selector to createTabStrip (#1464 step 1)

Replaces the agent stats page's bespoke window-tab click handler with the
shared createTabStrip (@hive/shared/tabs.js). The selector is now
hash-routed — #1h / #24h / … become deep-linkable and survive
back/forward navigation.

- window buttons use data-tab (was data-w); the strip resolves them by
  that convention and toggles .hive-tab--active + aria-selected.
- onShow(w) sets currentWindow + reloads stats; the strip's initial show
  fires it once, so the explicit loadStats() in DOMContentLoaded is
  dropped (avoids a double fetch).
- the selector keeps its distinct pill look — agent.css now targets
  .window-tabs button.hive-tab--active (was .active), not the shared
  .hive-tab text-tab base. It's a pure data-selector with no panes;
  createTabStrip skips the absent [data-tab-pane] gracefully.

Behaviour-preserving; aria-selected is now standardised on the buttons.
This commit is contained in:
iris 2026-06-08 22:32:17 +02:00 committed by mara
commit 0680f87d3d
3 changed files with 20 additions and 21 deletions

View file

@ -3,6 +3,7 @@
// when the operator clicks a window tab.
import Chart from 'chart.js/auto';
import { createTabStrip } from '@hive/shared/tabs.js';
// Expose for the IIFE below — pre-split this was a window global from
// the jsDelivr CDN script tag. esbuild now bundles chart.js into
@ -413,20 +414,15 @@ window.Chart = Chart;
} catch (_) { /* non-fatal */ }
}
function bindTabs() {
const tabs = document.getElementById('window-tabs');
tabs.addEventListener('click', (ev) => {
const btn = ev.target.closest('button[data-w]');
if (!btn) return;
currentWindow = btn.dataset.w;
for (const b of tabs.querySelectorAll('button')) b.classList.toggle('active', b === btn);
loadStats();
});
}
document.addEventListener('DOMContentLoaded', () => {
bindTabs();
loadIdentity();
loadStats();
// The shared hash-routed tab strip drives the stat-window selector,
// making it deep-linkable (#1h / #24h / …). onShow updates the
// window + reloads; the strip's initial show fires onShow once, so
// there's no separate loadStats() call here (avoids a double fetch).
createTabStrip(document.getElementById('window-tabs'), {
defaultId: currentWindow,
onShow: (w) => { currentWindow = w; loadStats(); },
});
});
})();