agentgui 1.0.130 → 1.0.131

package/database.js

@@ -280,7 +280,7 @@ export const queries = {
 
   getConversationsList() {
     const stmt = db.prepare(
-      'SELECT id, title, agentType, created_at, updated_at, messageCount, workingDirectory FROM conversations WHERE status != ? ORDER BY updated_at DESC'
+      'SELECT id, title, agentType, created_at, updated_at, messageCount, workingDirectory, isStreaming FROM conversations WHERE status != ? ORDER BY updated_at DESC'
     );
     return stmt.all('deleted');
   },

package/package.json

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

package/server.js

@@ -550,6 +550,7 @@ async function processMessageWithStreaming(conversationId, messageId, sessionId,
   const startTime = Date.now();
   activeExecutions.set(conversationId, true);
   queries.setIsStreaming(conversationId, true);
+  queries.updateSession(sessionId, { status: 'active' });
 
   try {
     debugLog(`[stream] Starting: conversationId=${conversationId}, sessionId=${sessionId}`);
@@ -886,7 +887,7 @@ function broadcastSync(event) {
       shouldSend = true;
     } else if (event.conversationId && ws.subscriptions?.has(`conv-${event.conversationId}`)) {
       shouldSend = true;
-    } else if (event.type === 'message_created' || event.type === 'conversation_created' || event.type === 'conversations_updated' || event.type === 'conversation_deleted' || event.type === 'queue_status') {
+    } else if (event.type === 'message_created' || event.type === 'conversation_created' || event.type === 'conversations_updated' || event.type === 'conversation_deleted' || event.type === 'queue_status' || event.type === 'streaming_start' || event.type === 'streaming_complete' || event.type === 'streaming_error') {
       shouldSend = true;
     }
 

package/static/index.html

@@ -161,6 +161,26 @@
 
     .conversation-item.active .conversation-item-meta { color: rgba(255,255,255,0.7); }
 
+    .conversation-streaming-badge {
+      display: inline-flex;
+      align-items: center;
+      margin-right: 0.375rem;
+      vertical-align: middle;
+    }
+
+    .streaming-dot {
+      display: inline-block;
+      width: 0.5rem;
+      height: 0.5rem;
+      border-radius: 50%;
+      background-color: var(--color-success);
+      animation: pulse 1.5s ease-in-out infinite;
+    }
+
+    .conversation-item.active .streaming-dot {
+      background-color: #fff;
+    }
+
     .conversation-item {
       display: flex;
       align-items: center;

package/static/js/client.js

@@ -344,6 +344,9 @@ class AgentGUIClient {
 
   handleWebSocketMessage(data) {
     try {
+      // Dispatch to window so other modules (conversations.js) can listen
+      window.dispatchEvent(new CustomEvent('ws-message', { detail: data }));
+
       switch (data.type) {
         case 'streaming_start':
           this.handleStreamingStart(data);
@@ -388,6 +391,15 @@ class AgentGUIClient {
 
   handleStreamingStart(data) {
     console.log('Streaming started:', data);
+
+    // If this streaming event is for a different conversation than what we are viewing,
+    // just track the state but do not modify the DOM or start polling
+    if (this.state.currentConversation?.id !== data.conversationId) {
+      console.log('Streaming started for non-active conversation:', data.conversationId);
+      this.emit('streaming:start', data);
+      return;
+    }
+
     this.state.isStreaming = true;
     this.state.currentSession = {
       id: data.sessionId,
@@ -490,8 +502,21 @@ class AgentGUIClient {
 
   handleStreamingError(data) {
     console.error('Streaming error:', data);
+
+    const conversationId = data.conversationId || this.state.currentSession?.conversationId;
+
+    // If this event is for a conversation we are NOT currently viewing, just track state
+    if (conversationId && this.state.currentConversation?.id !== conversationId) {
+      console.log('Streaming error for non-active conversation:', conversationId);
+      this.emit('streaming:error', data);
+      return;
+    }
+
     this.state.isStreaming = false;
 
+    // Stop polling for chunks
+    this.stopChunkPolling();
+
     const sessionId = data.sessionId || this.state.currentSession?.id;
     const streamingEl = document.getElementById(`streaming-${sessionId}`);
     if (streamingEl) {
@@ -507,6 +532,16 @@ class AgentGUIClient {
 
   handleStreamingComplete(data) {
     console.log('Streaming completed:', data);
+
+    const conversationId = data.conversationId || this.state.currentSession?.conversationId;
+
+    // If this event is for a conversation we are NOT currently viewing, just track state
+    if (conversationId && this.state.currentConversation?.id !== conversationId) {
+      console.log('Streaming completed for non-active conversation:', conversationId);
+      this.emit('streaming:complete', data);
+      return;
+    }
+
     this.state.isStreaming = false;
 
     // Stop polling for chunks
@@ -528,7 +563,6 @@ class AgentGUIClient {
     }
 
     // Save scroll position after streaming completes
-    const conversationId = data.conversationId || this.state.currentSession?.conversationId;
     if (conversationId) {
       this.saveScrollPosition(conversationId);
     }
@@ -1099,9 +1133,21 @@ class AgentGUIClient {
 
   async loadConversationMessages(conversationId) {
     try {
+      // Save scroll position of current conversation before switching
+      if (this.state.currentConversation?.id) {
+        this.saveScrollPosition(this.state.currentConversation.id);
+      }
+
       // Stop any existing polling when switching conversations
       this.stopChunkPolling();
 
+      // Clear streaming state from previous conversation view
+      // (the actual streaming continues on the server, we just stop tracking it on the UI side)
+      if (this.state.isStreaming && this.state.currentConversation?.id !== conversationId) {
+        this.state.isStreaming = false;
+        this.state.currentSession = null;
+      }
+
       const convResponse = await fetch(window.__BASE_URL + `/api/conversations/${conversationId}`);
       const { conversation, isActivelyStreaming, latestSession } = await convResponse.json();
       this.state.currentConversation = conversation;
@@ -1114,7 +1160,10 @@ class AgentGUIClient {
       }
 
       // Check if there's an active streaming session that needs to be resumed
-      const shouldResumeStreaming = isActivelyStreaming && latestSession && latestSession.status === 'active';
+      // isActivelyStreaming comes from the server checking both in-memory activeExecutions map
+      // AND database session status. Use it as primary signal, with session status as confirmation.
+      const shouldResumeStreaming = isActivelyStreaming && latestSession &&
+        (latestSession.status === 'active' || latestSession.status === 'pending');
 
       // Try to fetch chunks first (Wave 3 architecture)
       try {
@@ -1202,17 +1251,22 @@ class AgentGUIClient {
               startTime: latestSession.created_at
             };
 
-            // Subscribe to WebSocket updates
+            // Subscribe to WebSocket updates for BOTH conversation and session
             if (this.wsManager.isConnected) {
               this.wsManager.subscribeToSession(latestSession.id);
+              this.wsManager.sendMessage({ type: 'subscribe', conversationId });
             }
 
+            // Update URL with session ID
+            this.updateUrlForConversation(conversationId, latestSession.id);
+
             // Get the timestamp of the last chunk to start polling from
+            // Use the last chunk's created_at to avoid re-fetching already-rendered chunks
             const lastChunkTime = chunks.length > 0
               ? chunks[chunks.length - 1].created_at
-              : Date.now();
+              : 0;
 
-            // Start polling for new chunks
+            // Start polling for new chunks from where we left off
             this.chunkPollState.lastFetchTimestamp = lastChunkTime;
             this.startChunkPolling(conversationId);
 

package/static/js/conversations.js

@@ -12,6 +12,7 @@ class ConversationManager {
     this.emptyEl = document.querySelector('[data-conversation-empty]');
     this.newBtn = document.querySelector('[data-new-conversation]');
     this.sidebarEl = document.querySelector('[data-sidebar]');
+    this.streamingConversations = new Set();
 
     this.folderBrowser = {
       modal: null,
@@ -191,6 +192,14 @@ class ConversationManager {
 
       const data = await res.json();
       this.conversations = data.conversations || [];
+
+      // Seed streaming state from database isStreaming flag
+      for (const conv of this.conversations) {
+        if (conv.isStreaming === 1 || conv.isStreaming === true) {
+          this.streamingConversations.add(conv.id);
+        }
+      }
+
       this.render();
     } catch (err) {
       console.error('Failed to load conversations:', err);
@@ -225,6 +234,8 @@ class ConversationManager {
     li.dataset.convId = conv.id;
     if (conv.id === this.activeId) li.classList.add('active');
 
+    const isStreaming = conv.isStreaming === 1 || conv.isStreaming === true || this.streamingConversations?.has(conv.id);
+
     const title = conv.title || `Conversation ${conv.id.slice(0, 8)}`;
     const timestamp = conv.created_at ? new Date(conv.created_at).toLocaleDateString() : 'Unknown';
     const agent = conv.agentType || 'unknown';
@@ -232,9 +243,13 @@ class ConversationManager {
     const metaParts = [agent, timestamp];
     if (wd) metaParts.push(wd);
 
+    const streamingBadge = isStreaming
+      ? '<span class="conversation-streaming-badge" title="Streaming in progress"><span class="streaming-dot"></span></span>'
+      : '';
+
     li.innerHTML = `
       <div class="conversation-item-content">
-        <div class="conversation-item-title">${this.escapeHtml(title)}</div>
+        <div class="conversation-item-title">${streamingBadge}${this.escapeHtml(title)}</div>
         <div class="conversation-item-meta">${metaParts.join(' • ')}</div>
       </div>
       <button class="conversation-item-delete" title="Delete conversation" data-delete-conv="${conv.id}">
@@ -335,6 +350,12 @@ class ConversationManager {
         this.updateConversation(msg.conversation.id, msg.conversation);
       } else if (msg.type === 'conversation_deleted') {
         this.deleteConversation(msg.conversationId);
+      } else if (msg.type === 'streaming_start' && msg.conversationId) {
+        this.streamingConversations.add(msg.conversationId);
+        this.render();
+      } else if ((msg.type === 'streaming_complete' || msg.type === 'streaming_error') && msg.conversationId) {
+        this.streamingConversations.delete(msg.conversationId);
+        this.render();
       }
     });
   }