@nockdev/hsa 1.2.5 → 1.2.7

package/dashboard.html

@@ -1157,6 +1157,33 @@
         opacity: 0.4;
       }
 
+      /* ERROR BANNER */
+      .error-banner {
+        display: none;
+        align-items: center;
+        gap: 8px;
+        padding: 8px 16px;
+        background: var(--red-subtle);
+        border-bottom: 1px solid rgba(248, 81, 73, 0.3);
+        color: var(--red);
+        font-size: 12px;
+        font-family: var(--font-mono);
+        grid-area: header;
+      }
+      .error-banner.visible {
+        display: flex;
+      }
+      .error-banner .error-dismiss {
+        margin-left: auto;
+        cursor: pointer;
+        opacity: 0.6;
+        background: none;
+        border: none;
+        color: var(--red);
+        font-size: 14px;
+      }
+      .error-banner .error-dismiss:hover { opacity: 1; }
+
       /* RESPONSIVE */
       @media (max-width: 1200px) {
         .kpi-grid {
@@ -1240,6 +1267,12 @@
           </button>
         </div>
       </header>
+      <!-- ERROR BANNER -->
+      <div class="error-banner" id="errorBanner">
+        <span>⚠</span>
+        <span id="errorBannerMsg">Connection failed</span>
+        <button class="error-dismiss" onclick="hideErrorBanner()">✕</button>
+      </div>
 
       <!-- CONTEXT SELECTOR BAR -->
       <div class="context-bar">
@@ -1495,6 +1528,7 @@
       const MAX_SSE_RETRIES = 5;
       let sseReconnectTimer = null;
       let fetchErrorCount = 0;
+      let dashboardAbortCtrl = null;
       const BASE_REFRESH_MS = 5000;
       const MAX_REFRESH_MS = 30000;
 
@@ -1524,6 +1558,16 @@
       function setStatus(status) {
         const dot = document.getElementById("statusDot");
         dot.className = "logo-dot " + (status === "connected" ? "" : status);
+        if (status === "connected") hideErrorBanner();
+      }
+
+      function showErrorBanner(msg) {
+        const banner = document.getElementById("errorBanner");
+        document.getElementById("errorBannerMsg").textContent = msg || "Connection failed";
+        banner.classList.add("visible");
+      }
+      function hideErrorBanner() {
+        document.getElementById("errorBanner").classList.remove("visible");
       }
 
       function toggleAutoRefresh() {
@@ -1626,10 +1670,16 @@
    FETCH & RENDER
    ================================================================ */
       async function fetchDashboard() {
+        // Cancel any in-flight request to prevent NS_BINDING_ABORTED
+        if (dashboardAbortCtrl) dashboardAbortCtrl.abort();
+        dashboardAbortCtrl = new AbortController();
+        const ctrl = dashboardAbortCtrl;
         try {
           let url = endpoint + "/api/dashboard";
           // Note: /api/dashboard doesn't support session filtering yet, handled client-side
-          const res = await fetch(url, { signal: AbortSignal.timeout(15000) });
+          const timeoutId = setTimeout(() => ctrl.abort(), 8000);
+          const res = await fetch(url, { signal: ctrl.signal });
+          clearTimeout(timeoutId);
           if (!res.ok) throw new Error("HTTP " + res.status);
           const data = await res.json();
           setStatus("connected");
@@ -1639,10 +1689,13 @@
           }
           render(data);
         } catch (err) {
+          if (err.name === "AbortError") return; // Intentional cancel, ignore
           setStatus("error");
           fetchErrorCount++;
           adjustRefreshInterval();
-          console.warn("HSA fetch error:", err.message);
+          const msg = err.message || "Connection failed";
+          console.warn("HSA fetch error:", msg);
+          showErrorBanner(msg);
         }
       }
 
@@ -2247,7 +2300,7 @@
             renderSidebar(allSessions);
             populateContextSelectors(allSessions);
           })
-          .catch(() => {});
+          .catch((err) => { console.warn("fetchSessions failed:", err.message || err); });
       }
 
       function connectSessionSSE() {
@@ -2406,9 +2459,15 @@
    INIT
    ================================================================ */
       document.getElementById("refreshToggle").classList.add("active");
-      connect();
-      startRefresh();
-      connectSessionSSE();
+      // Fast health check first, then full data load
+      (async () => {
+        try {
+          const res = await fetch(endpoint + "/api/health", { signal: AbortSignal.timeout(3000) });
+          if (res.ok) { setStatus("connected"); hideErrorBanner(); }
+        } catch { /* will fall through to connect() below */ }
+        connect();
+        startRefresh();
+      })();
       window.addEventListener("resize", drawCacheChart);
     </script>
   </body>

package/logs.html

@@ -628,6 +628,8 @@
       let filterTimeout = null;
       let allSessions = [];
       let sseRetryMs = 1000;
+      let sseRetryCount = 0;
+      const MAX_SSE_RETRIES = 5;
       let statsThrottleTimer = null;
 
       // ── Init ──────────────────────────────────────────────────
@@ -651,7 +653,9 @@
 
         setStatus("pending");
         try {
-          const res = await fetch(baseUrl + "/api/logs?limit=200");
+          const res = await fetch(baseUrl + "/api/logs?limit=200", {
+            signal: AbortSignal.timeout(8000),
+          });
           if (!res.ok) throw new Error(res.statusText);
           const data = await res.json();
           entries = data.entries || [];
@@ -758,6 +762,14 @@
               eventSource.close();
               eventSource = null;
             }
+            sseRetryCount++;
+            if (sseRetryCount >= MAX_SSE_RETRIES) {
+              console.warn("SSE: Max retries reached, stopping log stream reconnect");
+              isStreaming = false;
+              document.getElementById("streamBtn").textContent = "▶ Stream";
+              document.getElementById("streamBtn").classList.remove("active");
+              return;
+            }
             // FE-01: Auto-reconnect with exponential backoff
             setTimeout(() => {
               if (isStreaming) startStream();
@@ -767,6 +779,7 @@
           eventSource.onopen = () => {
             setStatus("ok");
             sseRetryMs = 1000;
+            sseRetryCount = 0;
           };
           isStreaming = true;
           document.getElementById("streamBtn").textContent = "⏸ Pause";
@@ -804,7 +817,9 @@
           document.getElementById("statErrors").textContent = s.errorCount;
           document.getElementById("statAvg").textContent = s.avgDurationMs;
           document.getElementById("statRate").textContent = s.callsPerMinute;
-        } catch {}
+        } catch (err) {
+          console.warn("fetchStats error:", err.message || err);
+        }
       }
 
       // ── Filters ───────────────────────────────────────────────

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nockdev/hsa",
-  "version": "1.2.5",
+  "version": "1.2.7",
   "description": "HSA - Hierarchical Semantic Analysis MCP Server for AI Code Agents",
   "type": "module",
   "main": "dist/hsa-lib.bundle.js",