Improve SSE status and event auth handling

static/js/events.js

@@ -6,7 +6,7 @@
  */
 
 import { state } from './state.js';
-import { api } from './api.js';
+import { api, getStoredToken } from './api.js';
 
 let _es = null;
 let _reconnectTimer = null;
@@ -19,7 +19,12 @@ export function connectSSE() {
 }
 
 function _connect() {
-  _es = new EventSource('/api/events');
+  const token = getStoredToken();
+  const url = token
+    ? `/api/events?access_token=${encodeURIComponent(token)}`
+    : '/api/events';
+
+  _es = new EventSource(url);
 
   _es.onopen = () => {
     console.debug('[SSE] connected');
@@ -43,7 +48,6 @@ function _connect() {
 
   _es.onerror = () => {
     console.warn('[SSE] connection lost – reconnecting in', RECONNECT_DELAY_MS, 'ms');
-    state.set('serverOnline', false);
     _reconnecting = true;
     state.set('sseReconnecting', true);
     _es.close();

static/js/state.js

@@ -9,6 +9,7 @@ const _state = {
   status: null,       // StatusResponse | null
   config: null,       // ConfigResponse | null
   serverOnline: false,
+  sseReconnecting: false,
 };
 
 const _listeners = {};  // key -> Set<fn>

static/js/status.js

@@ -34,8 +34,10 @@ function updateHeaderLeds(serverOnline, status) {
 
   if (!serverLed || !agentLed) return;
 
-  // Don't overwrite reconnecting state – events.js sets that
-  if (serverOnline && !state.get('sseReconnecting')) {
+  if (state.get('sseReconnecting')) {
+    serverLed.className = 'led led--amber led--pulse';
+    serverLed.querySelector('.led__label').textContent = 'Reconnecting…';
+  } else if (serverOnline) {
     serverLed.className = 'led led--green led--pulse';
     serverLed.querySelector('.led__label').textContent = 'Server Online';
   } else if (!serverOnline) {
@@ -58,8 +60,11 @@ function renderStatusPanel(status) {
   const el = document.getElementById('status-panel-body');
   if (!el || !status) return;
 
-  const agent = status.agent;
-  const queue = status.queue;
+  const agent = status.agent ?? {};
+  const queue = {
+    pending_count: status.queue?.pending_count ?? 0,
+    consumed_count: status.queue?.consumed_count ?? 0,
+  };
 
   el.innerHTML = `
     <div class="stat-row">