agentgui 1.0.514 → 1.0.516

package/CLAUDE.md

@@ -91,6 +91,30 @@ All routes are prefixed with `BASE_URL` (default `/gm`).
 - `POST /api/tools/update` - Batch update all tools with available updates
 - `POST /api/tools/refresh-all` - Refresh all tool statuses from package manager
 
+## Tool Update System
+
+Tool updates are managed through a complete pipeline:
+
+**Update Flow:**
+1. Frontend (`static/js/tools-manager.js`) initiates POST to `/api/tools/{id}/update`
+2. Server (`server.js` lines 1904-1961 for individual, 1973-2003 for batch) spawns bunx process
+3. Tool manager (`lib/tool-manager.js` lines 400-432) executes `bunx <package>` and detects new version
+4. Version is saved to database: `queries.updateToolStatus(toolId, { version, status: 'installed' })`
+5. WebSocket broadcasts `tool_update_complete` with version and status data
+6. Frontend updates UI and removes tool from `operationInProgress` set
+
+**Critical Detail:** When updating tools in batch (`/api/tools/update`), the version parameter MUST be included in the database update call (line 1986 in server.js). This ensures database persistence across page reloads.
+
+**Version Detection Sources** (`lib/tool-manager.js` lines 26-87):
+- Claude Code: `~/.claude/plugins/{pluginId}/plugin.json`
+- OpenCode: `~/.config/opencode/agents/{pluginId}/plugin.json`
+- Gemini CLI: `~/.gemini/extensions/{pluginId}/plugin.json`
+- Kilo: `~/.config/kilo/agents/{pluginId}/plugin.json`
+
+**Database Schema** (`database.js` lines 168-199):
+- Table: `tool_installations` (toolId, version, status, installed_at, error_message)
+- Table: `tool_install_history` (action, status, error_message for audit trail)
+
 ## Tool Detection System
 
 The system auto-detects installed AI coding tools via `bunx` package resolution:
@@ -99,7 +123,13 @@ The system auto-detects installed AI coding tools via `bunx` package resolution:
 - **Kilo**: `@kilocode/cli` package (id: gm-kilo)
 - **Claude Code**: `@anthropic-ai/claude-code` package (id: gm-cc)
 
-Tool package names are configured in `lib/tool-manager.js` TOOLS array (lines 6-11). Detection happens by spawning `bunx <package> --version` to check if tools are installed. Response from `/api/tools` includes: id, name, pkg, installed, status (one of: installed|needs_update|not_installed), isUpToDate, upgradeNeeded, hasUpdate. Frontend displays tools in UI and updates based on installation status.
+Tool configuration in `lib/tool-manager.js` TOOLS array includes id, name, pkg, and pluginId. Each tool has a different plugin folder name than its npm package name:
+- Claude Code: pkg='@anthropic-ai/claude-code', pluginId='gm' (stored at ~/.claude/plugins/gm/)
+- Gemini CLI: pkg='@google/gemini-cli', pluginId='gm' (stored at ~/.gemini/extensions/gm/)
+- Kilo: pkg='@kilocode/cli', pluginId='@kilocode/cli' (stored at ~/.config/kilo/agents/@kilocode/cli/)
+- OpenCode: pkg='opencode-ai', pluginId='opencode-ai' (stored at ~/.config/opencode/agents/opencode-ai/)
+
+Detection happens by spawning `bunx <package> --version` to check if tools are installed. Version detection uses pluginId to find the correct plugin.json file. Response from `/api/tools` includes: id, name, pkg, installed, status (one of: installed|needs_update|not_installed), isUpToDate, upgradeNeeded, hasUpdate. Frontend displays tools in UI and updates based on installation status.
 
 ### Tool Installation and Update UI Flow
 
@@ -162,3 +192,76 @@ Speech models (~470MB total) are downloaded automatically on server startup. No
 
 ### Cache Location
 Models are stored at `~/.gmgui/models/` (whisper in `onnx-community/whisper-base/`, TTS in `tts/`).
+
+## Tool Update Process Fix
+
+### Issue
+Tool update/install operations would complete successfully but the version display in the UI would not update to reflect the new version.
+
+### Root Cause
+The WebSocket broadcast event for tool update/install completion was missing the `version` field. The server was sending only the `freshStatus` object (which contains `installedVersion`), but not including the extracted `version` field from the tool-manager result.
+
+Frontend expected: `data.data.version`
+Backend was sending: only `data.data.installedVersion`
+
+### Solution
+Updated WebSocket broadcasts in `server.js`:
+- Line 1883: Install endpoint now includes `version` in broadcast data
+- Line 1942: Update endpoint now includes `version` in broadcast data
+- Line 1987: Legacy install endpoint now saves `version` to database
+
+The broadcasts now include both the immediately-detected `version` field and the comprehensive `freshStatus` object, ensuring the frontend has complete information to update the UI correctly.
+
+### Testing
+After update/install completes:
+1. WebSocket event `tool_update_complete` or `tool_install_complete` is broadcast
+2. Frontend receives complete data with `version`, `installedVersion`, `isUpToDate`, etc.
+3. UI version display updates to show new version
+4. Status reverts to "Installed" or "Up-to-date" accordingly
+
+## Tool Update Testing & Diagnostics
+
+A comprehensive diagnostic page is available at `http://localhost:3000/gm/tool-update-test.html` (`static/tool-update-test.html`) with 7 interactive test sections:
+
+1. **API Connection Test** - Verifies server HTTP connectivity
+2. **Get Tools Status** - Lists all tools with their current status, versions, and update availability
+3. **WebSocket Connection Test** - Tests real-time event streaming (ping/pong)
+4. **Single Tool Update Test** - Triggers update for a specific tool and monitors completion
+5. **Event Stream Monitoring** - Watches all WebSocket events in real-time
+6. **Database Status** - Checks database accessibility and tool persistence
+7. **System Info** - Displays environment and configuration details
+
+### Batch Update Fix (Critical)
+
+**Issue:** When updating all tools via `/api/tools/update` endpoint, tool versions were not persisted to the database because the `version` parameter was missing from the `updateToolStatus` call.
+
+**Location:** `server.js` line 1986 in the batch update handler (`/api/tools/update`)
+
+**Fix Applied:**
+```javascript
+// BEFORE (missing version):
+queries.updateToolStatus(toolId, { status: 'installed', installed_at: Date.now() });
+
+// AFTER (version preserved):
+const version = result.version || null;
+queries.updateToolStatus(toolId, { status: 'installed', version, installed_at: Date.now() });
+```
+
+**Impact:** Ensures tool versions are correctly saved after batch updates, enabling the UI to display accurate version information and update status across page reloads.
+
+### Testing Tool Updates
+
+**Manual Steps:**
+1. Open `http://localhost:3000/gm/tool-update-test.html`
+2. Click "Get Tools List" and note current versions
+3. Click "Start Update" for a tool (e.g., gm-cc)
+4. Monitor WebSocket events - you should see `tool_update_progress` and `tool_update_complete`
+5. Click "Check Status" to verify version was saved to database
+6. Reload the page - versions should persist
+
+**Expected Outcomes:**
+- Individual tool update: version saved ✓
+- Batch tool update: version saved for all tools ✓
+- Database persists across page reload ✓
+- Frontend shows "Up-to-date" or "Update available" ✓
+- Tool install history records the action ✓

package/package.json

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

package/server.js

@@ -1880,7 +1880,7 @@ const server = http.createServer(async (req, res) => {
           queries.updateToolStatus(toolId, { status: 'installed', version, installed_at: Date.now() });
           const freshStatus = await toolManager.checkToolStatusAsync(toolId);
           console.log(`[TOOLS-API] Fresh status after install for ${toolId}:`, JSON.stringify(freshStatus));
-          broadcastSync({ type: 'tool_install_complete', toolId, data: { success: true, ...freshStatus } });
+          broadcastSync({ type: 'tool_install_complete', toolId, data: { success: true, version, ...freshStatus } });
           queries.addToolInstallHistory(toolId, 'install', 'success', null);
         } else {
           console.error(`[TOOLS-API] Install failed for ${toolId}:`, result.error);
@@ -1939,7 +1939,7 @@ const server = http.createServer(async (req, res) => {
           queries.updateToolStatus(toolId, { status: 'installed', version, installed_at: Date.now() });
           const freshStatus = await toolManager.checkToolStatusAsync(toolId);
           console.log(`[TOOLS-API] Fresh status after update for ${toolId}:`, JSON.stringify(freshStatus));
-          broadcastSync({ type: 'tool_update_complete', toolId, data: { success: true, ...freshStatus } });
+          broadcastSync({ type: 'tool_update_complete', toolId, data: { success: true, version, ...freshStatus } });
           queries.addToolInstallHistory(toolId, 'update', 'success', null);
         } else {
           console.error(`[TOOLS-API] Update failed for ${toolId}:`, result.error);
@@ -1970,133 +1970,43 @@ const server = http.createServer(async (req, res) => {
       return;
     }
 
-
-    // Handle POST /api/tools/{toolId}/install - individual tool install
-    const installMatch = pathOnly.match(/^\/api\/tools\/([^\/]+)\/install$/);
-    if (installMatch && req.method === 'POST') {
-      const toolId = installMatch[1];
-      sendJSON(req, res, 200, { installing: true, toolId });
-      setImmediate(async () => {
-        try {
-          const result = await toolManager.install(toolId, (msg) => {
-            if (wsOptimizer && wsOptimizer.broadcast) {
-              wsOptimizer.broadcast({ type: 'tool_install_progress', toolId, data: msg });
-            }
-          });
-          if (result.success) {
-            queries.updateToolStatus(toolId, { status: 'installed', installed_at: Date.now() });
-            queries.addToolInstallHistory(toolId, 'install', 'success', null);
-            const freshStatus = await toolManager.checkToolStatusAsync(toolId);
-            if (wsOptimizer && wsOptimizer.broadcast) {
-              wsOptimizer.broadcast({ type: 'tool_install_complete', toolId, data: { ...result, ...freshStatus } });
-            }
-          } else {
-            queries.updateToolStatus(toolId, { status: 'failed', error_message: result.error });
-            queries.addToolInstallHistory(toolId, 'install', 'failed', result.error);
-            if (wsOptimizer && wsOptimizer.broadcast) {
-              wsOptimizer.broadcast({ type: 'tool_install_failed', toolId, data: result });
-            }
-          }
-        } catch (err) {
-          queries.updateToolStatus(toolId, { status: 'failed', error_message: err.message });
-          queries.addToolInstallHistory(toolId, 'install', 'failed', err.message);
-          if (wsOptimizer && wsOptimizer.broadcast) {
-            wsOptimizer.broadcast({ type: 'tool_install_failed', toolId, data: { success: false, error: err.message } });
-          }
-        }
-      });
-      return;
-    }
-
-    // Handle POST /api/tools/{toolId}/update - individual tool update
-    const updateMatch = pathOnly.match(/^\/api\/tools\/([^\/]+)\/update$/);
-    if (updateMatch && req.method === 'POST') {
-      const toolId = updateMatch[1];
-      sendJSON(req, res, 200, { updating: true, toolId });
-      setImmediate(async () => {
-        try {
-          const result = await toolManager.update(toolId, (msg) => {
-            if (wsOptimizer && wsOptimizer.broadcast) {
-              wsOptimizer.broadcast({ type: 'tool_update_progress', toolId, data: msg });
-            }
-          });
-          if (result.success) {
-            queries.updateToolStatus(toolId, { status: 'installed', installed_at: Date.now() });
-            queries.addToolInstallHistory(toolId, 'update', 'success', null);
-            const freshStatus = await toolManager.checkToolStatusAsync(toolId);
-            if (wsOptimizer && wsOptimizer.broadcast) {
-              wsOptimizer.broadcast({ type: 'tool_update_complete', toolId, data: { ...result, ...freshStatus } });
-            }
-          } else {
-            queries.updateToolStatus(toolId, { status: 'failed', error_message: result.error });
-            queries.addToolInstallHistory(toolId, 'update', 'failed', result.error);
-            if (wsOptimizer && wsOptimizer.broadcast) {
-              wsOptimizer.broadcast({ type: 'tool_update_failed', toolId, data: result });
-            }
-          }
-        } catch (err) {
-          queries.updateToolStatus(toolId, { status: 'failed', error_message: err.message });
-          queries.addToolInstallHistory(toolId, 'update', 'failed', err.message);
-          if (wsOptimizer && wsOptimizer.broadcast) {
-            wsOptimizer.broadcast({ type: 'tool_update_failed', toolId, data: { success: false, error: err.message } });
-          }
-        }
-      });
-      return;
-    }
-
     if (pathOnly === '/api/tools/update' && req.method === 'POST') {
       sendJSON(req, res, 200, { updating: true, toolCount: 4 });
-      if (wsOptimizer && wsOptimizer.broadcast) {
-        wsOptimizer.broadcast({ type: 'tools_update_started', tools: ['gm-cc', 'gm-oc', 'gm-gc', 'gm-kilo'] });
-      }
+      broadcastSync({ type: 'tools_update_started', tools: ['gm-cc', 'gm-oc', 'gm-gc', 'gm-kilo'] });
       setImmediate(async () => {
         const toolIds = ['gm-cc', 'gm-oc', 'gm-gc', 'gm-kilo'];
         const results = {};
         for (const toolId of toolIds) {
           try {
             const result = await toolManager.update(toolId, (msg) => {
-              if (wsOptimizer && wsOptimizer.broadcast) {
-                wsOptimizer.broadcast({ type: 'tool_update_progress', toolId, data: msg });
-              }
+              broadcastSync({ type: 'tool_update_progress', toolId, data: msg });
             });
             results[toolId] = result;
             if (result.success) {
-              queries.updateToolStatus(toolId, { status: 'installed', installed_at: Date.now() });
+              const version = result.version || null;
+              queries.updateToolStatus(toolId, { status: 'installed', version, installed_at: Date.now() });
               queries.addToolInstallHistory(toolId, 'update', 'success', null);
               const freshStatus = await toolManager.checkToolStatusAsync(toolId);
-              if (wsOptimizer && wsOptimizer.broadcast) {
-                wsOptimizer.broadcast({ type: 'tool_update_complete', toolId, data: { ...result, ...freshStatus } });
-              }
+              broadcastSync({ type: 'tool_update_complete', toolId, data: { ...result, ...freshStatus } });
             } else {
               queries.updateToolStatus(toolId, { status: 'failed', error_message: result.error });
               queries.addToolInstallHistory(toolId, 'update', 'failed', result.error);
-              if (wsOptimizer && wsOptimizer.broadcast) {
-                wsOptimizer.broadcast({ type: 'tool_update_failed', toolId, data: result });
-              }
+              broadcastSync({ type: 'tool_update_failed', toolId, data: result });
             }
           } catch (err) {
-            const error = err.message || 'Unknown error';
-            results[toolId] = { success: false, error };
-            queries.updateToolStatus(toolId, { status: 'failed', error_message: error });
-            queries.addToolInstallHistory(toolId, 'update', 'failed', error);
-            if (wsOptimizer && wsOptimizer.broadcast) {
-              wsOptimizer.broadcast({ type: 'tool_update_failed', toolId, data: { error } });
-            }
+            queries.updateToolStatus(toolId, { status: 'failed', error_message: err.message });
+            queries.addToolInstallHistory(toolId, 'update', 'failed', err.message);
+            broadcastSync({ type: 'tool_update_failed', toolId, data: { success: false, error: err.message } });
           }
         }
-        if (wsOptimizer && wsOptimizer.broadcast) {
-          wsOptimizer.broadcast({ type: 'tools_update_complete', data: results });
-        }
+        broadcastSync({ type: 'tools_update_complete', data: results });
       });
       return;
     }
 
     if (pathOnly === '/api/tools/refresh-all' && req.method === 'POST') {
       sendJSON(req, res, 200, { refreshing: true, toolCount: 4 });
-      if (wsOptimizer && wsOptimizer.broadcast) {
-        wsOptimizer.broadcast({ type: 'tools_refresh_started' });
-      }
+      broadcastSync({ type: 'tools_refresh_started' });
       setImmediate(async () => {
         const tools = toolManager.getAllTools();
         for (const tool of tools) {
@@ -2112,9 +2022,7 @@ const server = http.createServer(async (req, res) => {
             }
           }
         }
-        if (wsOptimizer && wsOptimizer.broadcast) {
-          wsOptimizer.broadcast({ type: 'tools_refresh_complete', data: tools });
-        }
+        broadcastSync({ type: 'tools_refresh_complete', data: tools });
       });
       return;
     }

package/static/index.html

@@ -856,6 +856,14 @@
       display: none;
     }
 
+    .cli-selector {
+      display: inline-block;
+    }
+
+    .sub-agent-selector {
+      display: inline-block;
+    }
+
     .message-textarea {
       flex: 1;
       padding: 0.625rem 0.875rem;
@@ -1087,9 +1095,9 @@
       .message { max-width: 95%; }
       .messages-wrapper { padding: 0.375rem 0.5rem; }
       .input-section { padding: 0.5rem; padding-bottom: calc(0.5rem + env(safe-area-inset-bottom)); }
-      .cli-selector { display: none; }
-      .sub-agent-selector { display: none; }
-      .model-selector { display: none; }
+      .cli-selector { display: none !important; }
+      .sub-agent-selector { display: none !important; }
+      .model-selector { display: none !important; }
     }
 
     /* ===== SCROLLBAR STYLING ===== */