agentgui 1.0.211 → 1.0.212

package/database.js

@@ -1120,6 +1120,24 @@ export const queries = {
     });
   },
 
+  getChunksSinceSeq(sessionId, sinceSeq) {
+    const stmt = prep(
+      `SELECT id, sessionId, conversationId, sequence, type, data, created_at
+       FROM chunks WHERE sessionId = ? AND sequence > ? ORDER BY sequence ASC`
+    );
+    const rows = stmt.all(sessionId, sinceSeq);
+    return rows.map(row => {
+      try {
+        return {
+          ...row,
+          data: typeof row.data === 'string' ? JSON.parse(row.data) : row.data
+        };
+      } catch (e) {
+        return row;
+      }
+    });
+  },
+
   deleteSessionChunks(sessionId) {
     const stmt = prep('DELETE FROM chunks WHERE sessionId = ?');
     const result = stmt.run(sessionId);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentgui",
-  "version": "1.0.211",
+  "version": "1.0.212",
   "description": "Multi-agent ACP client with real-time communication",
   "type": "module",
   "main": "server.js",

package/server.js

@@ -941,9 +941,15 @@ const server = http.createServer(async (req, res) => {
       if (!sess) { sendJSON(req, res, 404, { error: 'Session not found' }); return; }
 
       const url = new URL(req.url, 'http://localhost');
+      const sinceSeq = parseInt(url.searchParams.get('sinceSeq') || '-1');
       const since = parseInt(url.searchParams.get('since') || '0');
 
-      const chunks = queries.getChunksSince(sessionId, since);
+      let chunks;
+      if (sinceSeq >= 0) {
+        chunks = queries.getChunksSinceSeq(sessionId, sinceSeq);
+      } else {
+        chunks = queries.getChunksSince(sessionId, since);
+      }
             sendJSON(req, res, 200, { ok: true, chunks });
       return;
     }
@@ -1711,6 +1717,7 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
           conversationId,
           block: systemBlock,
           blockIndex: allBlocks.length,
+          seq: currentSequence,
           timestamp: Date.now()
         });
       } else if (parsed.type === 'assistant' && parsed.message?.content) {
@@ -1726,6 +1733,7 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
             conversationId,
             block,
             blockIndex: allBlocks.length - 1,
+            seq: currentSequence,
             timestamp: Date.now()
           });
 
@@ -1752,6 +1760,7 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
               conversationId,
               block: toolResultBlock,
               blockIndex: allBlocks.length,
+              seq: currentSequence,
               timestamp: Date.now()
             });
           }
@@ -1777,6 +1786,7 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
           block: resultBlock,
           blockIndex: allBlocks.length,
           isResult: true,
+          seq: currentSequence,
           timestamp: Date.now()
         });
 
@@ -1827,6 +1837,7 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
       sessionId,
       conversationId,
       eventCount,
+      seq: currentSequence,
       timestamp: Date.now()
     });
 
@@ -2066,9 +2077,13 @@ wss.on('connection', (ws, req) => {
           }));
         } else if (data.type === 'set_voice') {
           ws.ttsVoiceId = data.voiceId || 'default';
+        } else if (data.type === 'latency_report') {
+          ws.latencyTier = data.quality || 'good';
+          ws.latencyAvg = data.avg || 0;
         } else if (data.type === 'ping') {
           ws.send(JSON.stringify({
             type: 'pong',
+            requestId: data.requestId,
             timestamp: Date.now()
           }));
         }
@@ -2097,13 +2112,16 @@ wss.on('connection', (ws, req) => {
 const BROADCAST_TYPES = new Set([
   'message_created', 'conversation_created', 'conversation_updated',
   'conversations_updated', 'conversation_deleted', 'queue_status', 'queue_updated',
-  'streaming_start', 'streaming_complete', 'streaming_error',
   'rate_limit_hit', 'rate_limit_clear',
   'script_started', 'script_stopped', 'script_output'
 ]);
 
 const wsBatchQueues = new Map();
-const WS_BATCH_INTERVAL = 16;
+const BATCH_BY_TIER = { excellent: 16, good: 32, fair: 50, poor: 100, bad: 200 };
+
+function getBatchInterval(ws) {
+  return BATCH_BY_TIER[ws.latencyTier] || 32;
+}
 
 function flushWsBatch(ws) {
   const queue = wsBatchQueues.get(ws);
@@ -2124,7 +2142,7 @@ function sendToClient(ws, data) {
   if (!queue) { queue = { msgs: [], timer: null }; wsBatchQueues.set(ws, queue); }
   queue.msgs.push(data);
   if (!queue.timer) {
-    queue.timer = setTimeout(() => flushWsBatch(ws), WS_BATCH_INTERVAL);
+    queue.timer = setTimeout(() => flushWsBatch(ws), getBatchInterval(ws));
   }
 }
 

package/static/index.html

@@ -2213,6 +2213,85 @@
     }
 
     html.dark .event-streaming-complete { background: linear-gradient(135deg, #0a1f0f, #0f2b1a); }
+
+    @keyframes skeleton-pulse {
+      0%, 100% { opacity: 0.4; }
+      50% { opacity: 0.15; }
+    }
+    .skeleton-pulse { animation: skeleton-pulse 1.5s ease-in-out infinite; }
+    .skeleton-loading { padding: 1rem; }
+
+    .message-sending { opacity: 0.6; transition: opacity 0.3s ease; }
+    .message-send-failed { border-left: 3px solid var(--color-error); }
+
+    .connection-indicator {
+      display: inline-flex;
+      align-items: center;
+      gap: 0.375rem;
+      padding: 0.25rem 0.5rem;
+      border-radius: 1rem;
+      font-size: 0.75rem;
+      cursor: pointer;
+      transition: all 0.3s ease;
+    }
+    .connection-dot {
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+      transition: background-color 0.5s ease;
+    }
+    .connection-dot.excellent { background: #10b981; }
+    .connection-dot.good { background: #10b981; }
+    .connection-dot.fair { background: #f59e0b; }
+    .connection-dot.poor { background: #f97316; }
+    .connection-dot.bad { background: #ef4444; }
+    .connection-dot.unknown { background: #6b7280; }
+    .connection-dot.disconnected { background: #ef4444; animation: pulse 1.5s ease-in-out infinite; }
+    .connection-dot.reconnecting { background: #f59e0b; animation: pulse 1s ease-in-out infinite; }
+
+    .connection-tooltip {
+      position: absolute;
+      top: 100%;
+      right: 0;
+      margin-top: 0.5rem;
+      padding: 0.75rem;
+      background: var(--color-bg-secondary);
+      border: 1px solid var(--color-border);
+      border-radius: 0.5rem;
+      font-size: 0.75rem;
+      white-space: nowrap;
+      z-index: 100;
+      box-shadow: 0 4px 12px rgba(0,0,0,0.15);
+    }
+
+    .new-content-pill {
+      position: sticky;
+      bottom: 0.5rem;
+      left: 50%;
+      transform: translateX(-50%);
+      padding: 0.375rem 1rem;
+      background: var(--color-primary);
+      color: white;
+      border: none;
+      border-radius: 1rem;
+      font-size: 0.8rem;
+      cursor: pointer;
+      z-index: 50;
+      box-shadow: 0 2px 8px rgba(0,0,0,0.2);
+      transition: opacity 0.2s ease;
+    }
+    .new-content-pill:hover { opacity: 0.9; }
+
+    @keyframes block-appear {
+      from { opacity: 0; transform: translateY(6px); }
+      to { opacity: 1; transform: translateY(0); }
+    }
+    .streaming-blocks > * {
+      animation: block-appear 0.2s ease-out both;
+    }
+    .streaming-blocks > details.block-tool-use {
+      transition: max-height 0.3s ease;
+    }
   </style>
 </head>
 <body>