agentgui 1.0.555 → 1.0.557

package/database.js

@@ -676,8 +676,17 @@ export const queries = {
   },
 
   getResumableConversations() {
+    // Get conversations with active/pending sessions that can be resumed
+    // Include conversations regardless of isStreaming flag - check database for actual active sessions
     const stmt = prep(
-      "SELECT id, title, claudeSessionId, agentId, agentType, workingDirectory, model, subAgent FROM conversations WHERE isStreaming = 1 AND claudeSessionId IS NOT NULL AND claudeSessionId != ''"
+      `SELECT DISTINCT c.id, c.title, c.claudeSessionId, c.agentId, c.agentType, c.workingDirectory, c.model, c.subAgent
+       FROM conversations c
+       WHERE c.claudeSessionId IS NOT NULL AND c.claudeSessionId != ''
+       AND EXISTS (
+         SELECT 1 FROM sessions s
+         WHERE s.conversationId = c.id
+         AND s.status IN ('active', 'pending', 'interrupted')
+       )`
     );
     return stmt.all();
   },

package/package.json

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

package/static/js/client.js

@@ -2474,7 +2474,8 @@ class AgentGUIClient {
       if (this.ui.messageInput) {
         this.ui.messageInput.value = '';
         this.ui.messageInput.style.height = 'auto';
-        this.ui.messageInput.disabled = false;
+        // Note: prompt disabled state will be set immutably based on shouldResumeStreaming
+        // after conversation data loads, don't set here
       }
 
       if (this.ui.stopButton) this.ui.stopButton.classList.remove('visible');
@@ -2637,26 +2638,34 @@ class AgentGUIClient {
 
             const blocksEl = messageDiv.querySelector('.message-blocks');
             const blockFrag = document.createDocumentFragment();
+            const toolResultBlocks = new Map();
+
             sessionChunkList.forEach(chunk => {
               if (!chunk.block?.type) return;
               if (chunk.block.type === 'tool_result') {
-                const lastInFrag = blockFrag.lastElementChild;
-                if (lastInFrag?.classList?.contains('block-tool-use')) {
-                  lastInFrag.classList.remove('has-success', 'has-error');
-                  lastInFrag.classList.add(chunk.block.is_error ? 'has-error' : 'has-success');
-                  const parentIsOpen = lastInFrag.hasAttribute('open');
-                  const contextWithParent = { ...chunk, parentIsOpen };
-                  const element = this.renderer.renderBlock(chunk.block, contextWithParent, blockFrag);
-                  if (element) { lastInFrag.appendChild(element); }
-                  return;
-                }
+                toolResultBlocks.set(chunk.id, chunk);
+                return;
               }
-              const element = this.renderer.renderBlock(chunk.block, chunk, blockFrag);
+              const element = this.renderer.renderBlockHeader(chunk.block, chunk);
               if (!element) return;
               blockFrag.appendChild(element);
             });
+
             blocksEl.appendChild(blockFrag);
 
+            toolResultBlocks.forEach((chunk, chunkId) => {
+              const lastBlock = blocksEl.lastElementChild;
+              if (lastBlock?.classList?.contains('block-type-tool_use')) {
+                lastBlock.classList.remove('has-success', 'has-error');
+                lastBlock.classList.add(chunk.block.is_error ? 'has-error' : 'has-success');
+                const contextWithParent = { ...chunk, parentIsOpen: lastBlock.hasAttribute('open') };
+                const element = this.renderer.renderBlock(chunk.block, contextWithParent);
+                if (element && element !== blockFrag.lastElementChild) {
+                  lastBlock.appendChild(element);
+                }
+              }
+            });
+
             if (isCurrentActiveSession) {
               const indicatorDiv = document.createElement('div');
               indicatorDiv.className = 'streaming-indicator';
@@ -2717,6 +2726,13 @@ class AgentGUIClient {
           this.chunkPollState.lastFetchTimestamp = lastChunkTime;
           this.startChunkPolling(conversationId);
           this.disableControls();
+          // IMMUTABLE STATE: Prompt is disabled during active streaming, do NOT enable
+          if (this.ui.messageInput) this.ui.messageInput.disabled = true;
+        } else {
+          // IMMUTABLE STATE: Prompt is enabled when NOT streaming (only disabled on WebSocket disconnect)
+          if (this.ui.messageInput && this.wsManager.isConnected) {
+            this.ui.messageInput.disabled = false;
+          }
         }
 
         this.restoreScrollPosition(conversationId);

package/static/js/streaming-renderer.js

@@ -2154,6 +2154,59 @@ class StreamingRenderer {
     }
   }
 
+  /**
+   * Render block header with lazy-loading placeholder for body
+   * Returns a <details> element with just the summary, body content deferred
+   */
+  renderBlockHeader(block, context = {}) {
+    if (!block || !block.type) return null;
+
+    const typeLabel = block.type.charAt(0).toUpperCase() + block.type.slice(1).replace(/_/g, ' ');
+    const summary = document.createElement('summary');
+    summary.style.cursor = 'pointer';
+    summary.style.userSelect = 'none';
+    summary.className = 'block-header-summary';
+
+    let summaryText = typeLabel;
+    if (block.type === 'code' && block.language) {
+      summaryText += ` (${block.language})`;
+    } else if (block.type === 'bash' && block.source) {
+      summaryText += ` - ${block.source}`;
+    } else if (block.type === 'tool_use' && block.name) {
+      summaryText += ` - ${block.name}`;
+    } else if (block.type === 'text' && block.text) {
+      const preview = block.text.substring(0, 60).replace(/\n/g, ' ');
+      summaryText = preview + (block.text.length > 60 ? '...' : '');
+    }
+
+    summary.textContent = summaryText;
+
+    const details = document.createElement('details');
+    details.className = `block-type-${block.type}`;
+    details.setAttribute('data-block-type', block.type);
+    details.setAttribute('data-lazy-load', 'pending');
+    details.appendChild(summary);
+
+    // Attach lazy loader on first open
+    details.addEventListener('toggle', async (e) => {
+      if (details.open && details.getAttribute('data-lazy-load') === 'pending') {
+        details.setAttribute('data-lazy-load', 'loading');
+        try {
+          const body = this.renderBlock(block, context);
+          if (body && body !== summary) {
+            details.appendChild(body);
+          }
+          details.setAttribute('data-lazy-load', 'loaded');
+        } catch (err) {
+          console.error('Failed to lazy-load block:', err);
+          details.setAttribute('data-lazy-load', 'failed');
+        }
+      }
+    }, { once: false });
+
+    return details;
+  }
+
   /**
    * Cleanup resources
    */