@agent-link/server 0.1.24 → 0.1.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agent-link/server",
-  "version": "0.1.24",
+  "version": "0.1.25",
   "description": "AgentLink relay server",
   "type": "module",
   "main": "dist/index.js",

package/web/app.js

@@ -825,6 +825,12 @@ const App = {
     });
 
     // ── WebSocket ──
+    let reconnectAttempts = 0;
+    const MAX_RECONNECT_ATTEMPTS = 50;
+    const RECONNECT_BASE_DELAY = 1000;
+    const RECONNECT_MAX_DELAY = 15000;
+    let reconnectTimer = null;
+
     function connect() {
       const sid = getSessionId();
       if (!sid) {
@@ -833,12 +839,14 @@ const App = {
         return;
       }
       sessionId.value = sid;
+      status.value = 'Connecting...';
+      error.value = '';
 
       const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
       const wsUrl = `${protocol}//${window.location.host}/?type=web&sessionId=${sid}`;
       ws = new WebSocket(wsUrl);
 
-      ws.onopen = () => { error.value = ''; };
+      ws.onopen = () => { error.value = ''; reconnectAttempts = 0; };
 
       ws.onmessage = (event) => {
         let msg;
@@ -1035,17 +1043,32 @@ const App = {
 
       ws.onclose = () => {
         sessionKey = null;
-        if (status.value === 'Connected' || status.value === 'Connecting...') {
-          status.value = 'Disconnected';
-          error.value = 'Connection to server lost.';
-        }
+        const wasConnected = status.value === 'Connected' || status.value === 'Connecting...';
         isProcessing.value = false;
         isCompacting.value = false;
+
+        if (wasConnected || reconnectAttempts > 0) {
+          scheduleReconnect();
+        }
       };
 
       ws.onerror = () => {};
     }
 
+    function scheduleReconnect() {
+      if (reconnectAttempts >= MAX_RECONNECT_ATTEMPTS) {
+        status.value = 'Disconnected';
+        error.value = 'Unable to reconnect. Please refresh the page.';
+        return;
+      }
+      const delay = Math.min(RECONNECT_BASE_DELAY * Math.pow(1.5, reconnectAttempts), RECONNECT_MAX_DELAY);
+      reconnectAttempts++;
+      status.value = 'Reconnecting...';
+      error.value = 'Connection lost. Reconnecting... (attempt ' + reconnectAttempts + ')';
+      if (reconnectTimer) clearTimeout(reconnectTimer);
+      reconnectTimer = setTimeout(() => { reconnectTimer = null; connect(); }, delay);
+    }
+
     function handleClaudeOutput(msg) {
       const data = msg.data;
       if (!data) return;
@@ -1111,7 +1134,7 @@ const App = {
     watch(messageCount, () => { nextTick(scheduleHighlight); });
 
     onMounted(() => { connect(); });
-    onUnmounted(() => { if (ws) ws.close(); });
+    onUnmounted(() => { if (reconnectTimer) clearTimeout(reconnectTimer); if (ws) ws.close(); });
 
     return {
       status, agentName, hostname, workDir, sessionId, error,
@@ -1158,7 +1181,7 @@ const App = {
         </div>
       </header>
 
-      <div v-if="status === 'No Session' || (status !== 'Connected' && status !== 'Connecting...' && messages.length === 0)" class="center-card">
+      <div v-if="status === 'No Session' || (status !== 'Connected' && status !== 'Connecting...' && status !== 'Reconnecting...' && messages.length === 0)" class="center-card">
         <div class="status-card">
           <p class="status">
             <span class="label">Status:</span>

package/web/style.css

@@ -191,6 +191,11 @@ body {
   background: rgba(245, 158, 11, 0.1);
 }
 
+.badge.reconnecting\.\.\. {
+  color: var(--warning);
+  background: rgba(245, 158, 11, 0.1);
+}
+
 .badge.waiting {
   color: var(--warning);
   background: rgba(245, 158, 11, 0.1);