refactor: single account-level SSE stream instead of per-monitor connections

apps/web/src/views/detail.ejs

@@ -265,9 +265,10 @@
       }
     });
 
-    // SSE: on each ping, refresh the chart (debounced — at most once per 5s)
+    // SSE: account stream filtered to this monitor — refresh chart on ping
     let _chartRefreshTimer = null;
-    watchMonitor(monitorId, () => {
+    watchAccount((ping) => {
+      if (ping.monitor_id !== monitorId) return;
       if (_chartRefreshTimer) return;
       _chartRefreshTimer = setTimeout(async () => {
         _chartRefreshTimer = null;

apps/web/src/views/home.ejs

@@ -88,13 +88,12 @@
       }, 5000);
     }
 
-    // SSE: subscribe to all monitors, refresh sparkline on each ping
-    document.querySelectorAll('[data-monitor-id]').forEach(card => {
-      const mid = card.dataset.monitorId;
-      watchMonitor(mid, () => {
-        const sparkEl = card.querySelector('.stat-sparkline');
-        if (sparkEl) scheduleSparklineRefresh(mid, sparkEl);
-      });
+    // SSE: single account stream — refresh sparkline for the relevant card on each ping
+    watchAccount((ping) => {
+      const card = document.querySelector(`[data-monitor-id="${ping.monitor_id}"]`);
+      if (!card) return;
+      const sparkEl = card.querySelector('.stat-sparkline');
+      if (sparkEl) scheduleSparklineRefresh(ping.monitor_id, sparkEl);
     });
   </script>