agentgui 1.0.593 → 1.0.595

package/package.json

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

package/static/index.html

@@ -3240,6 +3240,7 @@
   <script defer src="/gm/js/syntax-highlighter.js"></script>
   <script defer src="/gm/js/dialogs.js"></script>
   <script defer src="/gm/js/ui-components.js"></script>
+  <script defer src="/gm/js/state-barrier.js"></script>
    <script defer src="/gm/js/conversations.js"></script>
    <script defer src="/gm/js/terminal.js"></script>
    <script defer src="/gm/js/script-runner.js"></script>

package/static/js/client.js

@@ -491,17 +491,21 @@ class AgentGUIClient {
             this.showError('Please enter a message to steer');
             return;
           }
-          try {
-            const data = await window.wsClient.rpc('conv.steer', { id: this.state.currentConversation.id, content: message });
-            console.log('Steer response:', data);
-            if (this.ui.messageInput) {
-              this.ui.messageInput.value = '';
-              this.ui.messageInput.style.height = 'auto';
-            }
-          } catch (err) {
-            console.error('Failed to steer:', err);
-            this.showError('Failed to steer: ' + err.message);
+
+          // Capture message and clear UI immediately (no await)
+          const steerMsg = message;
+          if (this.ui.messageInput) {
+            this.ui.messageInput.value = '';
+            this.ui.messageInput.style.height = 'auto';
           }
+
+          // Fire RPC in background, don't await
+          window.wsClient.rpc('conv.steer', { id: this.state.currentConversation.id, content: steerMsg })
+            .then(data => console.log('Steer response:', data))
+            .catch(err => {
+              console.error('Failed to steer:', err);
+              this.showError('Failed to steer: ' + err.message);
+            });
         } else {
           const instructions = await window.UIDialog.prompt('Enter instructions to inject into the running agent:', '', 'Inject Instructions');
           if (!instructions) return;
@@ -584,6 +588,7 @@ class AgentGUIClient {
 
     // Listen for active conversation deletion
     window.addEventListener('conversation-deselected', () => {
+      window.ConversationState?.clear('deselected');
       this.state.currentConversation = null;
       this.state.currentSession = null;
       this.updateUrlForConversation(null);
@@ -1318,6 +1323,7 @@ class AgentGUIClient {
   }
 
   async handleAllConversationsDeleted(data) {
+    window.ConversationState?.clear('all_deleted');
     this.state.currentConversation = null;
     this.state.conversations = [];
     this.state.sessionEvents = [];
@@ -1556,6 +1562,7 @@ class AgentGUIClient {
         if (model) body.model = model;
         if (subAgent) body.subAgent = subAgent;
         const { conversation } = await window.wsClient.rpc('conv.new', body);
+        window.ConversationState?.selectConversation(conversation.id, 'conversation_created', 1);
         this.state.currentConversation = conversation;
         this.lockAgentAndModel(agentId, model);
 
@@ -1834,6 +1841,7 @@ class AgentGUIClient {
           if (model) createBody.model = model;
           if (subAgent) createBody.subAgent = subAgent;
           const { conversation: newConv } = await window.wsClient.rpc('conv.new', createBody);
+          window.ConversationState?.selectConversation(newConv.id, 'stream_recreate', 1);
           this.state.currentConversation = newConv;
           if (window.conversationManager) {
             window.conversationManager.loadConversations();
@@ -2556,6 +2564,7 @@ class AgentGUIClient {
 
       const cachedConv = this.state.conversations.find(c => c.id === conversationId);
       if (cachedConv && this.state.currentConversation?.id !== conversationId) {
+        window.ConversationState?.selectConversation(conversationId, 'cache_load', 1);
         this.state.currentConversation = cachedConv;
       }
 
@@ -2572,6 +2581,7 @@ class AgentGUIClient {
           while (cached.dom.firstChild) {
             outputEl.appendChild(cached.dom.firstChild);
           }
+          window.ConversationState?.selectConversation(conversationId, 'dom_cache_load', 1);
           this.state.currentConversation = cached.conversation;
           const cachedHasActivity = cached.conversation.messageCount > 0 || this.state.streamingConversations.has(conversationId);
           this.applyAgentAndModelSelection(cached.conversation, cachedHasActivity);
@@ -2594,6 +2604,7 @@ class AgentGUIClient {
       } catch (e) {
         if (e.code === 404) {
           console.warn('Conversation no longer exists:', conversationId);
+          window.ConversationState?.clear('conversation_not_found');
           this.state.currentConversation = null;
           if (window.conversationManager) window.conversationManager.loadConversations();
           // Resume from last successful conversation if available, or fall back to any available conversation
@@ -2613,6 +2624,7 @@ class AgentGUIClient {
       }
       const { conversation, isActivelyStreaming, latestSession, chunks: rawChunks, totalChunks, messages: allMessages } = fullData;
 
+      window.ConversationState?.selectConversation(conversationId, 'server_load', 1);
       this.state.currentConversation = conversation;
       const hasActivity = (allMessages && allMessages.length > 0) || isActivelyStreaming || latestSession || this.state.streamingConversations.has(conversationId);
       this.applyAgentAndModelSelection(conversation, hasActivity);

package/static/js/conversations.js

@@ -301,6 +301,7 @@ class ConversationManager {
       await window.wsClient.rpc('conv.del.all', {});
       console.log('[ConversationManager] Deleted all conversations');
       this._updateConversations([], 'clear_all');
+      window.ConversationState?.clear('delete_all');
       this.activeId = null;
       window.dispatchEvent(new CustomEvent('conversation-deselected'));
       this.render();
@@ -535,6 +536,11 @@ class ConversationManager {
   }
 
   select(convId) {
+    const result = window.ConversationState?.selectConversation(convId, 'user_click', 1) || { success: false };
+    if (!result.success && result.reason !== 'already_selected') {
+      console.error('[ConvMgr] activeId mutation rejected:', result.reason);
+      return;
+    }
     this.activeId = convId;
 
     document.querySelectorAll('.conversation-item').forEach(item => {
@@ -589,6 +595,7 @@ class ConversationManager {
     const newConvs = this.conversations.filter(c => c.id !== convId);
     this._updateConversations(newConvs, 'delete', { convId });
     if (wasActive) {
+      window.ConversationState?.deleteConversation(convId, 1);
       this.activeId = null;
       window.dispatchEvent(new CustomEvent('conversation-deselected'));
     }
@@ -607,6 +614,7 @@ class ConversationManager {
         this.deleteConversation(msg.conversationId);
       } else if (msg.type === 'all_conversations_deleted') {
         this._updateConversations([], 'ws_clear_all');
+        window.ConversationState?.clear('all_deleted');
         this.activeId = null;
         this.streamingConversations.clear();
         this.showEmpty('No conversations yet');

package/static/js/state-barrier.js

@@ -0,0 +1,109 @@
+/**
+ * State Barrier - Atomic state machine for conversation management
+ * Eliminates race conditions through single source of truth and version tracking
+ */
+
+class ConversationState {
+  constructor() {
+    this.current = {
+      id: null,
+      version: 0,
+      data: null,
+      timestamp: 0,
+      reason: null
+    };
+    this.history = [];
+    this.MAX_HISTORY = 50;
+  }
+
+  selectConversation(id, reason, serverVersion) {
+    if (id === this.current.id && serverVersion === this.current.version) {
+      return { success: false, reason: 'already_selected', prevState: this.current, newState: this.current };
+    }
+    const prevState = { ...this.current };
+    this.current.id = id;
+    this.current.version = serverVersion || (this.current.version + 1);
+    this.current.timestamp = Date.now();
+    this.current.reason = reason;
+    this.current.data = null;
+    this._recordHistory('selectConversation', prevState, this.current, reason);
+    return { success: true, reason: 'selected', prevState, newState: { ...this.current } };
+  }
+
+  updateConversation(id, data, serverVersion) {
+    if (id !== this.current.id) {
+      return { success: false, reason: 'version_mismatch', prevState: this.current, newState: this.current };
+    }
+    if (serverVersion && serverVersion < this.current.version) {
+      return { success: false, reason: 'stale_version', prevState: this.current, newState: this.current };
+    }
+    const prevState = { ...this.current };
+    this.current.data = { ...this.current.data, ...data };
+    this.current.version = serverVersion || (this.current.version + 1);
+    this.current.timestamp = Date.now();
+    this._recordHistory('updateConversation', prevState, this.current, 'update');
+    return { success: true, reason: 'updated', prevState, newState: { ...this.current } };
+  }
+
+  deleteConversation(id, serverVersion) {
+    if (id !== this.current.id) {
+      return { success: false, reason: 'not_current', prevState: this.current, newState: this.current };
+    }
+    const prevState = { ...this.current };
+    this.current.id = null;
+    this.current.version = 0;
+    this.current.data = null;
+    this.current.timestamp = Date.now();
+    this.current.reason = 'deleted';
+    this._recordHistory('deleteConversation', prevState, this.current, 'delete');
+    return { success: true, reason: 'deleted', prevState, newState: { ...this.current } };
+  }
+
+  clear(reason) {
+    const prevState = { ...this.current };
+    this.current.id = null;
+    this.current.version = 0;
+    this.current.data = null;
+    this.current.timestamp = Date.now();
+    this.current.reason = reason;
+    this._recordHistory('clear', prevState, this.current, reason);
+    return { success: true, reason: 'cleared', prevState, newState: { ...this.current } };
+  }
+
+  getCurrent() {
+    return { ...this.current };
+  }
+
+  getVersion() {
+    return this.current.version;
+  }
+
+  _recordHistory(operation, prevState, newState, detail) {
+    this.history.push({
+      operation,
+      prevState,
+      newState,
+      detail,
+      timestamp: Date.now()
+    });
+    if (this.history.length > this.MAX_HISTORY) {
+      this.history.shift();
+    }
+  }
+
+  getHistory() {
+    return [...this.history];
+  }
+
+  debugDump() {
+    return {
+      current: { ...this.current },
+      history: this.getHistory(),
+      timestamp: Date.now()
+    };
+  }
+}
+
+if (typeof window !== 'undefined') {
+  window.ConversationState = new ConversationState();
+}