botmux 2.98.4-canary.2 → 2.99.0

package/dist/dashboard/web/insights-page.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"insights-page.js","sourceRoot":"","sources":["../../../src/dashboard/web/insights-page.tsx"],"names":[],"mappings":"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"}

package/dist/dashboard/web/insights.d.ts

@@ -1,2 +1,19 @@
-export declare function renderInsightsPage(root: HTMLElement): () => void;
+import type { SafeInsightReport } from '../../services/insight/types.js';
+type InsightRecord = {
+    session: Record<string, any>;
+    report: SafeInsightReport | null;
+    error?: string;
+};
+type InsightTab = 'overview' | 'sessions' | 'flow' | 'dist' | 'hot';
+export declare function renderTabBar(active: InsightTab): string;
+export declare const TIME_WINDOWS: Array<{
+    key: string;
+    label: string;
+    days: number;
+}>;
+export declare function renderDetailShell(rec: InsightRecord | undefined): string;
+export declare function parseInsightsHash(): Record<string, string>;
+export declare function initialInsightTab(): InsightTab;
+export declare function wireInsightsPage(root: HTMLElement): () => void;
+export {};
 //# sourceMappingURL=insights.d.ts.map

package/dist/dashboard/web/insights.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"insights.d.ts","sourceRoot":"","sources":["../../../src/dashboard/web/insights.ts"],"names":[],"mappings":"AAygDA,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,WAAW,GAAG,MAAM,IAAI,CA8nBhE"}
+{"version":3,"file":"insights.d.ts","sourceRoot":"","sources":["../../../src/dashboard/web/insights.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAQV,iBAAiB,EASlB,MAAM,iCAAiC,CAAC;AAMzC,KAAK,aAAa,GAAG;IACnB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAC7B,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AA4UF,KAAK,UAAU,GAAG,UAAU,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG,KAAK,CAAC;AAQpE,wBAAgB,YAAY,CAAC,MAAM,EAAE,UAAU,GAAG,MAAM,CAIvD;AAYD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAK5E,CAAC;AA4kBF,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,aAAa,GAAG,SAAS,GAAG,MAAM,CAUxE;AAwhBD,wBAAgB,iBAAiB,IAAI,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAO1D;AAWD,wBAAgB,iBAAiB,IAAI,UAAU,CAG9C;AAED,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,WAAW,GAAG,MAAM,IAAI,CA+kB9D"}

package/dist/dashboard/web/insights.js

@@ -333,7 +333,7 @@ const INSIGHT_TABS = [
     { key: 'dist', label: 'insights.tabDist' },
     { key: 'hot', label: 'insights.tabHot' },
 ];
-function renderTabBar(active) {
+export function renderTabBar(active) {
     return `<div class="insight-tabs" role="tablist">${INSIGHT_TABS.map(tb => `<button type="button" class="itab${tb.key === active ? ' on' : ''}" data-itab="${tb.key}" role="tab" aria-selected="${tb.key === active}">${escapeHtml(t(tb.label))}</button>`).join('')}</div>`;
 }
 function projectOf(rec) {
@@ -351,7 +351,7 @@ function projectOptions(records) {
     }
     return [...m.entries()].map(([id, count]) => ({ id, count })).sort((a, b) => b.count - a.count || a.id.localeCompare(b.id));
 }
-const TIME_WINDOWS = [
+export const TIME_WINDOWS = [
     { key: 'all', label: 'insights.timeAll', days: 0 },
     { key: '1d', label: 'insights.time1d', days: 1 },
     { key: '7d', label: 'insights.time7d', days: 7 },
@@ -963,7 +963,7 @@ function renderEvidence(report, focus, spanFilter, openSpans) {
         : `<p class="mut">${escapeHtml(t('insights.evNoFlags'))}</p>`;
     return `<div class="evidence">${work}${reason}<div class="spanfilter">${chips}</div><div class="spantable">${rows}</div></div>`;
 }
-function renderDetailShell(rec) {
+export function renderDetailShell(rec) {
     if (!rec)
         return `<section class="insight-detail"><p class="mut">${escapeHtml(t('insights.selectSession'))}</p></section>`;
     const s = rec.session;
@@ -1507,7 +1507,7 @@ async function fetchDetail(sessionId) {
 // URL state (deep-link + refresh-stable): the insights view state lives in the hash
 // query after #/insights (e.g. #/insights?tab=dist&project=botmux&sess=<id>). Written
 // via history.replaceState (no router re-run), read back on (re)mount.
-function parseInsightsHash() {
+export function parseInsightsHash() {
     const h = typeof location !== 'undefined' ? (location.hash || '') : '';
     const qi = h.indexOf('?');
     if (qi < 0)
@@ -1528,7 +1528,11 @@ function buildInsightsHash(p) {
 const INSIGHT_FILTERS = ['all', 'review', 'failed', 'slow'];
 const INSIGHT_TAB_KEYS = ['overview', 'sessions', 'flow', 'dist', 'hot'];
 const SESS_SORT_KEYS = ['recent', 'review', 'spans', 'fails', 'slow', 'agent'];
-export function renderInsightsPage(root) {
+export function initialInsightTab() {
+    const hp = parseInsightsHash();
+    return INSIGHT_TAB_KEYS.includes(hp.tab) ? hp.tab : 'overview';
+}
+export function wireInsightsPage(root) {
     const hp = parseInsightsHash();
     let overviewData = null;
     let records = [];
@@ -1564,58 +1568,6 @@ export function renderInsightsPage(root) {
     let paletteOpen = false;
     let paletteQ = '';
     let paletteIdx = 0;
-    root.innerHTML = `
-    <section class="page insights-page">
-      <div class="page-heading">
-        <div>
-          <p class="eyebrow">${escapeHtml(t('nav.insights'))}</p>
-          <h1>${escapeHtml(t('insights.title'))}</h1>
-          <p>${escapeHtml(t('insights.subtitle'))}</p>
-        </div>
-        <div class="insight-head-acts">
-          <button type="button" id="insight-palette-open" class="ins-clear">${escapeHtml(t('insights.paletteOpen'))}</button>
-          <button type="button" id="insight-refresh" class="primary">${escapeHtml(t('insights.refresh'))}</button>
-        </div>
-      </div>
-      <form id="insight-filters" class="filters insights-filters">
-        <input type="search" name="q" placeholder="${escapeHtml(t('insights.search'))}">
-        <select id="insight-project" class="ins-select" aria-label="${escapeHtml(t('insights.projectAll'))}"></select>
-        <select id="insight-time" class="ins-select" aria-label="${escapeHtml(t('insights.timeAll'))}">
-          ${TIME_WINDOWS.map(w => `<option value="${w.key}">${escapeHtml(t(w.label))}</option>`).join('')}
-        </select>
-        <div class="segmented" role="group" aria-label="${escapeHtml(t('insights.filter'))}">
-          <button type="button" data-filter="all">${escapeHtml(t('insights.filterAll'))}</button>
-          <button type="button" data-filter="review">${escapeHtml(t('insights.filterReview'))}</button>
-          <button type="button" data-filter="failed">${escapeHtml(t('insights.filterFailed'))}</button>
-          <button type="button" data-filter="slow">${escapeHtml(t('insights.filterSlow'))}</button>
-        </div>
-        <div id="insight-cli-filter" class="spanfilter cli-filter" role="group" aria-label="${escapeHtml(t('insights.filter'))}"></div>
-        <label class="ins-toggle"><input type="checkbox" id="insight-noise"> ${escapeHtml(t('insights.showAll'))}</label>
-        <button type="button" id="insight-clear" class="ins-clear">${escapeHtml(t('insights.clear'))}</button>
-      </form>
-      <div id="insight-tabbar">${renderTabBar(tab)}</div>
-      <div id="insight-status" class="insight-page-status"></div>
-      <div class="insight-panel" role="tabpanel" data-tabpanel="overview"><div id="insight-overview"></div></div>
-      <div class="insight-panel" role="tabpanel" data-tabpanel="sessions" hidden>
-        <div id="insight-list-view">
-          <div class="insight-list-head">
-            <span id="insight-list-subtitle"></span>
-            <div class="sesssort" id="insight-sort"></div>
-          </div>
-          <div id="insight-list"></div>
-        </div>
-        <div id="insight-detail-view" hidden>
-          <button type="button" id="insight-back" class="ins-back">← ${escapeHtml(t('insights.backToList'))}</button>
-          <div id="insight-detail">${renderDetailShell(undefined)}</div>
-        </div>
-      </div>
-      <div class="insight-panel" role="tabpanel" data-tabpanel="flow" hidden><div id="insight-flow"></div></div>
-      <div class="insight-panel" role="tabpanel" data-tabpanel="dist" hidden><div id="insight-dist"></div></div>
-      <div class="insight-panel" role="tabpanel" data-tabpanel="hot" hidden><div id="insight-hot"></div></div>
-      <div id="insight-modal" class="insight-modal" hidden></div>
-      <div id="insight-palette" class="insight-palette" hidden></div>
-      <div id="insight-tip" class="ins-tip" role="tooltip" hidden></div>
-    </section>`;
     const status = root.querySelector('#insight-status');
     const overviewEl = root.querySelector('#insight-overview');
     const list = root.querySelector('#insight-list');
@@ -1865,6 +1817,8 @@ export function renderInsightsPage(root) {
         const sid = selectedId;
         try {
             const r = await fetch(`/api/sessions/${encodeURIComponent(sid)}/insight?${params.toString()}`, { cache: 'no-store' });
+            if (disposed || sid !== selectedId)
+                return;
             const d = await r.json().catch(() => ({}));
             if (disposed || sid !== selectedId)
                 return;
@@ -1877,6 +1831,8 @@ export function renderInsightsPage(root) {
             }
         }
         catch { /* leave what we have */ }
+        if (disposed || sid !== selectedId)
+            return;
         convo.loading = false;
         if (detailTab === 'convo')
             paintDetailBody();
@@ -1914,13 +1870,15 @@ export function renderInsightsPage(root) {
         paintModal();
         try {
             const r = await fetch(`/api/sessions/${encodeURIComponent(sid)}/insight/turn/${turnIndex}?offset=0&limit=40000`, { cache: 'no-store' });
+            if (req !== modalReq || disposed || sid !== selectedId)
+                return;
             const d = await r.json().catch(() => ({}));
-            if (req !== modalReq || disposed)
+            if (req !== modalReq || disposed || sid !== selectedId)
                 return;
             modalPrompt = d?.turn?.prompt ?? { text: '', truncated: false };
         }
         catch {
-            if (req !== modalReq)
+            if (req !== modalReq || disposed || sid !== selectedId)
                 return;
             modalPrompt = { text: t('insights.unavailable'), truncated: false };
         }
@@ -2110,13 +2068,13 @@ export function renderInsightsPage(root) {
             return;
         try {
             const report = await fetchDetail(sessionId);
-            if (!disposed && report) {
+            if (!disposed && selectedId === sessionId && report) {
                 detailReport = report;
                 paintDetailBody();
             }
         }
         catch (e) {
-            if (!disposed)
+            if (!disposed && selectedId === sessionId)
                 body.innerHTML = `<p class="mut">${escapeHtml(String(e))}</p>`;
         }
     }
@@ -2125,7 +2083,11 @@ export function renderInsightsPage(root) {
         status.textContent = t('insights.loading');
         try {
             const r = await fetch('/api/insights/summary?limit=200', { cache: 'no-store' });
+            if (disposed)
+                return;
             const d = await r.json().catch(() => ({}));
+            if (disposed)
+                return;
             if (!r.ok || d?.ok === false || !d.overview) {
                 overviewData = null;
                 records = [];
@@ -2138,6 +2100,8 @@ export function renderInsightsPage(root) {
             }
         }
         catch (e) {
+            if (disposed)
+                return;
             overviewData = null;
             records = [];
             status.textContent = `${t('insights.unavailable')}: ${String(e)}`;