agentgui 1.0.8 → 1.0.10

package/database.js

@@ -99,56 +99,54 @@ function migrateFromJson() {
     const content = fs.readFileSync(oldJsonPath, 'utf-8');
     const data = JSON.parse(content);
 
-    if (data.conversations) {
-      for (const id in data.conversations) {
-        const conv = data.conversations[id];
-        db.run(
-          `INSERT OR REPLACE INTO conversations (id, agentId, title, created_at, updated_at, status) VALUES (?, ?, ?, ?, ?, ?)`,
-          [conv.id, conv.agentId, conv.title || null, conv.created_at, conv.updated_at, conv.status || 'active']
-        );
+    const migrationStmt = db.transaction(() => {
+      if (data.conversations) {
+        for (const id in data.conversations) {
+          const conv = data.conversations[id];
+          db.prepare(
+            `INSERT OR REPLACE INTO conversations (id, agentId, title, created_at, updated_at, status) VALUES (?, ?, ?, ?, ?, ?)`
+          ).run(conv.id, conv.agentId, conv.title || null, conv.created_at, conv.updated_at, conv.status || 'active');
+        }
       }
-    }
 
-    if (data.messages) {
-      for (const id in data.messages) {
-        const msg = data.messages[id];
-        db.run(
-          `INSERT OR REPLACE INTO messages (id, conversationId, role, content, created_at) VALUES (?, ?, ?, ?, ?)`,
-          [msg.id, msg.conversationId, msg.role, msg.content, msg.created_at]
-        );
+      if (data.messages) {
+        for (const id in data.messages) {
+          const msg = data.messages[id];
+          db.prepare(
+            `INSERT OR REPLACE INTO messages (id, conversationId, role, content, created_at) VALUES (?, ?, ?, ?, ?)`
+          ).run(msg.id, msg.conversationId, msg.role, msg.content, msg.created_at);
+        }
       }
-    }
 
-    if (data.sessions) {
-      for (const id in data.sessions) {
-        const sess = data.sessions[id];
-        db.run(
-          `INSERT OR REPLACE INTO sessions (id, conversationId, status, started_at, completed_at, response, error) VALUES (?, ?, ?, ?, ?, ?, ?)`,
-          [sess.id, sess.conversationId, sess.status, sess.started_at, sess.completed_at || null, sess.response || null, sess.error || null]
-        );
+      if (data.sessions) {
+        for (const id in data.sessions) {
+          const sess = data.sessions[id];
+          db.prepare(
+            `INSERT OR REPLACE INTO sessions (id, conversationId, status, started_at, completed_at, response, error) VALUES (?, ?, ?, ?, ?, ?, ?)`
+          ).run(sess.id, sess.conversationId, sess.status, sess.started_at, sess.completed_at || null, sess.response || null, sess.error || null);
+        }
       }
-    }
 
-    if (data.events) {
-      for (const id in data.events) {
-        const evt = data.events[id];
-        db.run(
-          `INSERT OR REPLACE INTO events (id, type, conversationId, sessionId, data, created_at) VALUES (?, ?, ?, ?, ?, ?)`,
-          [evt.id, evt.type, evt.conversationId || null, evt.sessionId || null, JSON.stringify(evt.data), evt.created_at]
-        );
+      if (data.events) {
+        for (const id in data.events) {
+          const evt = data.events[id];
+          db.prepare(
+            `INSERT OR REPLACE INTO events (id, type, conversationId, sessionId, data, created_at) VALUES (?, ?, ?, ?, ?, ?)`
+          ).run(evt.id, evt.type, evt.conversationId || null, evt.sessionId || null, JSON.stringify(evt.data), evt.created_at);
+        }
       }
-    }
 
-    if (data.idempotencyKeys) {
-      for (const key in data.idempotencyKeys) {
-        const entry = data.idempotencyKeys[key];
-        db.run(
-          `INSERT OR REPLACE INTO idempotencyKeys (key, value, created_at, ttl) VALUES (?, ?, ?, ?)`,
-          [key, JSON.stringify(entry.value), entry.created_at, entry.ttl]
-        );
+      if (data.idempotencyKeys) {
+        for (const key in data.idempotencyKeys) {
+          const entry = data.idempotencyKeys[key];
+          db.prepare(
+            `INSERT OR REPLACE INTO idempotencyKeys (key, value, created_at, ttl) VALUES (?, ?, ?, ?)`
+          ).run(key, JSON.stringify(entry.value), entry.created_at, entry.ttl);
+        }
       }
-    }
+    });
 
+    migrationStmt();
     fs.renameSync(oldJsonPath, `${oldJsonPath}.migrated`);
     console.log('Migrated data from JSON to SQLite');
   } catch (e) {
@@ -188,8 +186,8 @@ export const queries = {
   },
 
   getAllConversations() {
-    const stmt = db.prepare('SELECT * FROM conversations ORDER BY updated_at DESC');
-    return stmt.all();
+    const stmt = db.prepare('SELECT * FROM conversations WHERE status != ? ORDER BY updated_at DESC');
+    return stmt.all('deleted');
   },
 
   updateConversation(id, data) {
@@ -221,11 +219,12 @@ export const queries = {
 
     const id = generateId('msg');
     const now = Date.now();
+    const storedContent = typeof content === 'string' ? content : JSON.stringify(content);
 
     const stmt = db.prepare(
       `INSERT INTO messages (id, conversationId, role, content, created_at) VALUES (?, ?, ?, ?, ?)`
     );
-    stmt.run(id, conversationId, role, content, now);
+    stmt.run(id, conversationId, role, storedContent, now);
 
     const updateConvStmt = db.prepare('UPDATE conversations SET updated_at = ? WHERE id = ?');
     updateConvStmt.run(now, conversationId);
@@ -294,7 +293,8 @@ export const queries = {
     if (!session) return null;
 
     const status = data.status !== undefined ? data.status : session.status;
-    const response = data.response !== undefined ? data.response : session.response;
+    const rawResponse = data.response !== undefined ? data.response : session.response;
+    const response = rawResponse && typeof rawResponse === 'object' ? JSON.stringify(rawResponse) : rawResponse;
     const error = data.error !== undefined ? data.error : session.error;
     const completed_at = data.completed_at !== undefined ? data.completed_at : session.completed_at;
 
@@ -387,22 +387,28 @@ export const queries = {
     const conv = this.getConversation(id);
     if (!conv) return false;
 
-    db.prepare('DELETE FROM events WHERE conversationId = ?').run(id);
-    db.prepare('DELETE FROM sessions WHERE conversationId = ?').run(id);
-    db.prepare('DELETE FROM messages WHERE conversationId = ?').run(id);
-    db.prepare('DELETE FROM conversations WHERE id = ?').run(id);
+    const deleteStmt = db.transaction(() => {
+      db.prepare('DELETE FROM events WHERE conversationId = ?').run(id);
+      db.prepare('DELETE FROM sessions WHERE conversationId = ?').run(id);
+      db.prepare('DELETE FROM messages WHERE conversationId = ?').run(id);
+      db.prepare('UPDATE conversations SET status = ? WHERE id = ?').run('deleted', id);
+    });
 
+    deleteStmt();
     return true;
   },
 
   cleanup() {
     const thirtyDaysAgo = Date.now() - (30 * 24 * 60 * 60 * 1000);
+    const now = Date.now();
 
-    db.prepare('DELETE FROM events WHERE created_at < ?').run(thirtyDaysAgo);
-    db.prepare('DELETE FROM sessions WHERE completed_at IS NOT NULL AND completed_at < ?').run(thirtyDaysAgo);
+    const cleanupStmt = db.transaction(() => {
+      db.prepare('DELETE FROM events WHERE created_at < ?').run(thirtyDaysAgo);
+      db.prepare('DELETE FROM sessions WHERE completed_at IS NOT NULL AND completed_at < ?').run(thirtyDaysAgo);
+      db.prepare('DELETE FROM idempotencyKeys WHERE (created_at + ttl) < ?').run(now);
+    });
 
-    const now = Date.now();
-    db.prepare('DELETE FROM idempotencyKeys WHERE (created_at + ttl) < ?').run(now);
+    cleanupStmt();
   },
 
   setIdempotencyKey(key, value) {
@@ -435,36 +441,37 @@ export const queries = {
   },
 
   discoverClaudeCodeConversations() {
-    const claudeHomeDir = path.join(os.homedir(), '.claude-code');
-    const conversationsDir = path.join(claudeHomeDir, 'conversations');
-
-    if (!fs.existsSync(conversationsDir)) {
-      return [];
-    }
+    const projectsDir = path.join(os.homedir(), '.claude', 'projects');
+    if (!fs.existsSync(projectsDir)) return [];
 
     const discovered = [];
     try {
-      const items = fs.readdirSync(conversationsDir, { withFileTypes: true });
-      for (const item of items) {
-        if (!item.isDirectory()) continue;
-
-        const metadataPath = path.join(conversationsDir, item.name, 'metadata.json');
-        const messagesPath = path.join(conversationsDir, item.name, 'messages.json');
-
-        if (!fs.existsSync(metadataPath) || !fs.existsSync(messagesPath)) continue;
+      const dirs = fs.readdirSync(projectsDir, { withFileTypes: true });
+      for (const dir of dirs) {
+        if (!dir.isDirectory()) continue;
+        const dirPath = path.join(projectsDir, dir.name);
+        const indexPath = path.join(dirPath, 'sessions-index.json');
+        if (!fs.existsSync(indexPath)) continue;
 
         try {
-          const metadata = JSON.parse(fs.readFileSync(metadataPath, 'utf-8'));
-          const messages = JSON.parse(fs.readFileSync(messagesPath, 'utf-8'));
-
-          discovered.push({
-            id: item.name,
-            metadata,
-            messages,
-            source: 'claude-code'
-          });
+          const index = JSON.parse(fs.readFileSync(indexPath, 'utf-8'));
+          const projectPath = index.originalPath || dir.name.replace(/^-/, '/').replace(/-/g, '/');
+          for (const entry of (index.entries || [])) {
+            if (!entry.sessionId || entry.messageCount === 0) continue;
+            discovered.push({
+              id: entry.sessionId,
+              jsonlPath: entry.fullPath || path.join(dirPath, `${entry.sessionId}.jsonl`),
+              title: entry.summary || entry.firstPrompt || 'Claude Code Session',
+              projectPath,
+              created: entry.created ? new Date(entry.created).getTime() : entry.fileMtime,
+              modified: entry.modified ? new Date(entry.modified).getTime() : entry.fileMtime,
+              messageCount: entry.messageCount,
+              gitBranch: entry.gitBranch,
+              source: 'claude-code'
+            });
+          }
         } catch (e) {
-          console.error(`Error reading Claude Code conversation ${item.name}:`, e.message);
+          console.error(`Error reading index ${indexPath}:`, e.message);
         }
       }
     } catch (e) {
@@ -474,39 +481,81 @@ export const queries = {
     return discovered;
   },
 
+  parseJsonlMessages(jsonlPath) {
+    if (!fs.existsSync(jsonlPath)) return [];
+    const messages = [];
+    try {
+      const lines = fs.readFileSync(jsonlPath, 'utf-8').split('\n');
+      for (const line of lines) {
+        if (!line.trim()) continue;
+        try {
+          const obj = JSON.parse(line);
+          if (obj.type === 'user' && obj.message?.content) {
+            const content = typeof obj.message.content === 'string'
+              ? obj.message.content
+              : Array.isArray(obj.message.content)
+                ? obj.message.content.filter(c => c.type === 'text').map(c => c.text).join('\n')
+                : JSON.stringify(obj.message.content);
+            if (content && !content.startsWith('[{"tool_use_id"')) {
+              messages.push({ id: obj.uuid || generateId('msg'), role: 'user', content, created_at: new Date(obj.timestamp).getTime() });
+            }
+          } else if (obj.type === 'assistant' && obj.message?.content) {
+            let text = '';
+            const content = obj.message.content;
+            if (Array.isArray(content)) {
+              for (const c of content) {
+                if (c.type === 'text' && c.text) text += c.text;
+              }
+            } else if (typeof content === 'string') {
+              text = content;
+            }
+            if (text) {
+              messages.push({ id: obj.uuid || generateId('msg'), role: 'assistant', content: text, created_at: new Date(obj.timestamp).getTime() });
+            }
+          }
+        } catch (_) {}
+      }
+    } catch (e) {
+      console.error(`Error parsing JSONL ${jsonlPath}:`, e.message);
+    }
+    return messages;
+  },
+
   importClaudeCodeConversations() {
     const discovered = this.discoverClaudeCodeConversations();
     const imported = [];
 
     for (const conv of discovered) {
       try {
-        const existingConv = db.prepare('SELECT id FROM conversations WHERE id = ?').get(conv.id);
+        const existingConv = db.prepare('SELECT id, status FROM conversations WHERE id = ?').get(conv.id);
         if (existingConv) {
-          imported.push({ id: conv.id, status: 'skipped', reason: 'Already imported' });
+          imported.push({ id: conv.id, status: 'skipped', reason: existingConv.status === 'deleted' ? 'deleted' : 'exists' });
           continue;
         }
 
-        const title = conv.metadata?.title || 'Claude Code Conversation';
-        const createdAt = conv.metadata?.created_at || Date.now();
-        const updatedAt = conv.metadata?.updated_at || Date.now();
-
-        db.prepare(
-          `INSERT INTO conversations (id, agentId, title, created_at, updated_at, status) VALUES (?, ?, ?, ?, ?, ?)`
-        ).run(conv.id, 'claude-code', title, createdAt, updatedAt, 'active');
-
-        for (const msg of (conv.messages || [])) {
-          try {
-            db.prepare(
-              `INSERT INTO messages (id, conversationId, role, content, created_at) VALUES (?, ?, ?, ?, ?)`
-            ).run(msg.id || generateId('msg'), conv.id, msg.role || 'user', msg.content || '', msg.created_at || Date.now());
-          } catch (e) {
-            console.error(`Error importing message in conversation ${conv.id}:`, e.message);
+        const projectName = conv.projectPath ? path.basename(conv.projectPath) : '';
+        const title = conv.title || 'Claude Code Session';
+        const displayTitle = projectName ? `[${projectName}] ${title}` : title;
+
+        const messages = this.parseJsonlMessages(conv.jsonlPath);
+
+        const importStmt = db.transaction(() => {
+          db.prepare(
+            `INSERT INTO conversations (id, agentId, title, created_at, updated_at, status) VALUES (?, ?, ?, ?, ?, ?)`
+          ).run(conv.id, 'claude-code', displayTitle, conv.created, conv.modified, 'active');
+
+          for (const msg of messages) {
+            try {
+              db.prepare(
+                `INSERT INTO messages (id, conversationId, role, content, created_at) VALUES (?, ?, ?, ?, ?)`
+              ).run(msg.id, conv.id, msg.role, msg.content, msg.created_at);
+            } catch (_) {}
           }
-        }
+        });
 
-        imported.push({ id: conv.id, status: 'imported', title });
+        importStmt();
+        imported.push({ id: conv.id, status: 'imported', title: displayTitle, messages: messages.length });
       } catch (e) {
-        console.error(`Error importing Claude Code conversation ${conv.id}:`, e.message);
         imported.push({ id: conv.id, status: 'error', error: e.message });
       }
     }

package/package.json

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

package/server.js

@@ -330,7 +330,7 @@ async function processMessage(conversationId, messageId, sessionId, content, age
     const result = await conn.sendPrompt(content);
     conn.onUpdate = null;
 
-    const responseText = fullText || (result?.stopReason ? `Completed: ${result.stopReason}` : 'No response.');
+    const responseText = fullText || result?.result || (result?.stopReason ? `Completed: ${result.stopReason}` : 'No response.');
     const messageContent = blocks.length > 0 ? { text: responseText, blocks } : responseText;
 
     const assistantMessage = queries.createMessage(conversationId, 'assistant', messageContent);

package/static/app.js

@@ -454,6 +454,25 @@ class GMGUIApp {
     this.renderAgentCards();
   }
 
+  groupConsecutiveMessages(messages) {
+    if (!messages.length) return [];
+    const grouped = [];
+    let current = { ...messages[0], content: typeof messages[0].content === 'string' ? messages[0].content : messages[0].content };
+    for (let i = 1; i < messages.length; i++) {
+      const msg = messages[i];
+      if (msg.role === current.role && msg.role === 'assistant') {
+        const curText = typeof current.content === 'string' ? current.content : (current.content?.text || '');
+        const msgText = typeof msg.content === 'string' ? msg.content : (msg.content?.text || '');
+        current = { ...current, content: curText + '\n\n' + msgText };
+      } else {
+        grouped.push(current);
+        current = { ...msg };
+      }
+    }
+    grouped.push(current);
+    return grouped;
+  }
+
   async displayConversation(id) {
     this.currentConversation = id;
     const conv = this.conversations.get(id);
@@ -479,7 +498,8 @@ class GMGUIApp {
       `;
       this.renderAgentCards();
     } else {
-      messages.forEach(msg => this.addMessageToDisplay(msg));
+      const grouped = this.groupConsecutiveMessages(messages);
+      grouped.forEach(msg => this.addMessageToDisplay(msg));
 
       if (this.settings.autoScroll) {
         div.scrollTop = div.scrollHeight;
@@ -490,43 +510,75 @@ class GMGUIApp {
   }
 
 
+  sanitizeHtml(raw) {
+    const tmp = document.createElement('div');
+    tmp.innerHTML = raw;
+    tmp.querySelectorAll('script,iframe,object,embed,form,meta,link').forEach(el => el.remove());
+    tmp.querySelectorAll('*').forEach(el => {
+      for (const attr of Array.from(el.attributes)) {
+        if (attr.name.startsWith('on')) el.removeAttribute(attr.name);
+        if (attr.name === 'href' && attr.value.trim().toLowerCase().startsWith('javascript:')) el.removeAttribute(attr.name);
+      }
+    });
+    return tmp.innerHTML;
+  }
+
+  looksLikeHtml(text) {
+    const trimmed = text.trim();
+    if (/^<[a-z][\s\S]*>/i.test(trimmed)) return true;
+    if (/<\/(div|span|p|table|ul|ol|h[1-6]|section|article|header|footer|nav|main|aside|details|summary|figure|figcaption|blockquote|pre|code|a|strong|em|img|br|hr)>/i.test(trimmed)) return true;
+    const tagCount = (trimmed.match(/<[a-z][^>]*>/gi) || []).length;
+    if (tagCount >= 3) return true;
+    return false;
+  }
+
   parseAndRenderContent(content) {
     const elements = [];
-    if (typeof content === 'string') {
-      const htmlCodeBlockRegex = /```html\n([\s\S]*?)\n```/g;
-      let lastIndex = 0;
-      let match;
-
-      while ((match = htmlCodeBlockRegex.exec(content)) !== null) {
-        if (match.index > lastIndex) {
-          const textBefore = content.substring(lastIndex, match.index);
-          if (textBefore.trim()) {
-            const bubble = document.createElement('div');
-            bubble.className = 'message-bubble';
-            bubble.textContent = textBefore;
-            elements.push(bubble);
-          }
-        }
+    if (typeof content !== 'string') return null;
 
-        const htmlContent = match[1];
-        const htmlEl = this.createHtmlBlock({ html: htmlContent });
-        elements.push(htmlEl);
-        lastIndex = htmlCodeBlockRegex.lastIndex;
-      }
+    const htmlCodeBlockRegex = /```html\n([\s\S]*?)\n```/g;
+    let lastIndex = 0;
+    let match;
 
-      if (lastIndex < content.length) {
-        const textAfter = content.substring(lastIndex);
-        if (textAfter.trim()) {
-          const bubble = document.createElement('div');
-          bubble.className = 'message-bubble';
-          bubble.textContent = textAfter;
-          elements.push(bubble);
+    while ((match = htmlCodeBlockRegex.exec(content)) !== null) {
+      if (match.index > lastIndex) {
+        const textBefore = content.substring(lastIndex, match.index);
+        if (textBefore.trim()) {
+          elements.push(this.renderTextOrHtml(textBefore));
         }
       }
+      elements.push(this.createSandboxedHtml(match[1]));
+      lastIndex = htmlCodeBlockRegex.lastIndex;
+    }
+
+    if (lastIndex < content.length) {
+      const remaining = content.substring(lastIndex);
+      if (remaining.trim()) {
+        elements.push(this.renderTextOrHtml(remaining));
+      }
+    }
 
-      return elements.length > 0 ? elements : null;
+    return elements.length > 0 ? elements : null;
+  }
+
+  renderTextOrHtml(text) {
+    if (this.looksLikeHtml(text)) {
+      return this.createSandboxedHtml(text);
     }
-    return null;
+    const bubble = document.createElement('div');
+    bubble.className = 'message-bubble';
+    bubble.textContent = text;
+    return bubble;
+  }
+
+  createSandboxedHtml(rawHtml) {
+    const wrap = document.createElement('div');
+    wrap.className = 'html-block rendered-html';
+    const content = document.createElement('div');
+    content.className = 'html-content';
+    content.innerHTML = this.sanitizeHtml(rawHtml);
+    wrap.appendChild(content);
+    return wrap;
   }
 
   addMessageToDisplay(msg) {
@@ -624,7 +676,8 @@ class GMGUIApp {
     const conv = this.conversations.get(this.currentConversation);
 
     const idempotencyKey = `msg-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-    this.addMessageToDisplay({ role: 'user', content: message });
+    const tempId = `pending-${idempotencyKey}`;
+    this.addMessageToDisplay({ role: 'user', content: message, id: tempId });
     input.value = '';
     this.updateSendButtonState();
 
@@ -646,6 +699,8 @@ class GMGUIApp {
         return;
       }
       const data = await res.json();
+      const optimisticEl = document.querySelector(`[data-message-id="${tempId}"]`);
+      if (optimisticEl) optimisticEl.dataset.messageId = data.message.id;
       this.idempotencyKeys.set(idempotencyKey, data.session.id);
       this.startPollingMessages(this.currentConversation);
     } catch (e) {
@@ -665,8 +720,12 @@ class GMGUIApp {
     if (this.pollingInterval) clearInterval(this.pollingInterval);
 
     let pollCount = 0;
-    const maxNoResponsePolls = 60; // Stop polling after 60 polls with no change
-    let lastMessageCount = 0;
+    const maxNoResponsePolls = 60;
+    let lastKnownIds = new Set(
+      Array.from(document.querySelectorAll('#chatMessages [data-message-id]'))
+        .map(el => el.dataset.messageId)
+        .filter(id => id && !id.startsWith('pending-'))
+    );
 
     this.pollingInterval = setInterval(async () => {
       try {
@@ -674,17 +733,19 @@ class GMGUIApp {
         const data = await res.json();
         const messages = data.messages || [];
 
-        // If we got new messages, render them
-        if (messages.length > lastMessageCount) {
-          const newMessages = messages.slice(lastMessageCount);
-          newMessages.forEach(msg => {
+        let added = false;
+        messages.forEach(msg => {
+          if (msg.id && !lastKnownIds.has(msg.id)) {
             const existingEl = document.querySelector(`[data-message-id="${msg.id}"]`);
             if (!existingEl) {
               this.addMessageToDisplay(msg);
+              added = true;
             }
-          });
-          lastMessageCount = messages.length;
-          pollCount = 0; // Reset counter when we get activity
+            lastKnownIds.add(msg.id);
+          }
+        });
+        if (added) {
+          pollCount = 0;
 
           if (this.settings.autoScroll) {
             const div = document.getElementById('chatMessages');
@@ -775,7 +836,7 @@ class GMGUIApp {
 
   createHtmlBlock(event) {
     const wrap = document.createElement('div');
-    wrap.className = 'html-block';
+    wrap.className = 'html-block rendered-html';
     if (event.id) wrap.id = `html-${event.id}`;
     if (event.title) {
       const header = document.createElement('div');
@@ -785,7 +846,7 @@ class GMGUIApp {
     }
     const content = document.createElement('div');
     content.className = 'html-content';
-    content.innerHTML = event.html;
+    content.innerHTML = this.sanitizeHtml(event.html);
     wrap.appendChild(content);
     return wrap;
   }
@@ -812,22 +873,22 @@ class GMGUIApp {
 
   updateSendButtonState() {
     const input = document.getElementById('messageInput');
-    const btn = document.getElementById('sendBtn');
-    if (btn) btn.disabled = !input || !input.value.trim();
+    const sendBtn = document.getElementById('sendBtn');
+    if (sendBtn) sendBtn.disabled = !input || !input.value.trim();
   }
 
   openFolderBrowser() {
-    const modal = document.getElementById('folderBrowserModal');
-    if (!modal) return;
+    const dlgModal = document.getElementById('folderBrowserModal');
+    if (!dlgModal) return;
     const pathInput = document.getElementById('folderPath');
     pathInput.value = '~/';
     this.loadFolderContents(this.expandHome('~/'));
-    modal.classList.add('active');
+    dlgModal.classList.add('active');
   }
 
   closeFolderBrowser() {
-    const modal = document.getElementById('folderBrowserModal');
-    if (modal) modal.classList.remove('active');
+    const dlgModal = document.getElementById('folderBrowserModal');
+    if (dlgModal) dlgModal.classList.remove('active');
   }
 
   async loadFolderContents(folderPath) {
@@ -895,13 +956,13 @@ function escapeHtml(text) {
 }
 
 function showNewChatModal() {
-  const modal = document.getElementById('newChatModal');
-  if (modal) modal.classList.add('active');
+  const dlgModal = document.getElementById('newChatModal');
+  if (dlgModal) dlgModal.classList.add('active');
 }
 
 function closeNewChatModal() {
-  const modal = document.getElementById('newChatModal');
-  if (modal) modal.classList.remove('active');
+  const dlgModal = document.getElementById('newChatModal');
+  if (dlgModal) dlgModal.classList.remove('active');
 }
 
 function createChatInWorkspace() {