feat: SSE live ping stream for monitors

apps/web/src/views/detail.ejs

@@ -267,7 +267,35 @@
     });
 
     load();
-    setInterval(load, 30000);
+    setInterval(load, 60000); // fallback poll, less frequent now that SSE handles updates
+
+    // SSE: live ping updates
+    const id = window.location.pathname.split('/').pop();
+    watchMonitor(id, (ping) => {
+      // Update stat bar
+      document.getElementById('stat-last').innerHTML = timeAgo(ping.checked_at);
+      if (ping.latency_ms) document.getElementById('stat-latency').textContent = ping.latency_ms + 'ms';
+
+      // Prepend new row to ping table
+      const tbody = document.getElementById('pings-table');
+      if (tbody) {
+        const upBadge = ping.up
+          ? '<span class="text-green-400">Up</span>'
+          : '<span class="text-red-400">Down</span>';
+        const tr = document.createElement('tr');
+        tr.className = 'border-b border-gray-800 fade-in-row';
+        tr.innerHTML = `
+          <td class="px-4 py-2">${upBadge}</td>
+          <td class="px-4 py-2 text-gray-300">${ping.status_code ?? '—'}</td>
+          <td class="px-4 py-2 text-gray-300">${ping.latency_ms ? ping.latency_ms + 'ms' : '—'}</td>
+          <td class="px-4 py-2 text-gray-500">${timeAgo(ping.checked_at)}</td>
+          <td class="px-4 py-2 text-red-400 text-xs">${ping.error ?? ''}</td>
+        `;
+        tbody.prepend(tr);
+        // Trim to keep table manageable
+        while (tbody.children.length > 100) tbody.removeChild(tbody.lastChild);
+      }
+    });
   </script>
 
 <%~ include('./partials/foot') %>