groove-dev 0.27.165 → 0.27.168

package/packages/gui/dist/index.html

@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <link rel="icon" type="image/png" href="/favicon.png" />
     <title>Groove GUI</title>
-    <script type="module" crossorigin src="/assets/index-SZBexPhJ.js"></script>
+    <script type="module" crossorigin src="/assets/index-CSMIQsrG.js"></script>
     <link rel="modulepreload" crossorigin href="/assets/vendor-26L3JoZv.js">
     <link rel="modulepreload" crossorigin href="/assets/reactflow-DoBZjiHE.js">
     <link rel="modulepreload" crossorigin href="/assets/codemirror-BYKpdS2W.js">

package/packages/gui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@groove-dev/gui",
-  "version": "0.27.165",
+  "version": "0.27.168",
   "description": "GROOVE GUI — visual agent control plane",
   "license": "FSL-1.1-Apache-2.0",
   "type": "module",

package/packages/gui/src/components/agents/agent-panel.jsx

@@ -88,7 +88,7 @@ export function AgentPanel() {
   const agentId = detailPanel?.type === 'agent' ? detailPanel.agentId : null;
   const liveAgent = agentId ? agents.find((a) => a.id === agentId) : null;
   if (liveAgent) cachedAgentRef.current = liveAgent;
-  else if (cachedAgentRef.current && cachedAgentRef.current.id !== agentId) cachedAgentRef.current = null;
+  else if (cachedAgentRef.current && agentId && cachedAgentRef.current.id !== agentId) cachedAgentRef.current = null;
   const agent = liveAgent || cachedAgentRef.current;
   const isAlive = liveAgent?.status === 'running' || liveAgent?.status === 'starting';
 

package/packages/gui/src/components/editor/terminal.jsx

@@ -85,6 +85,7 @@ function TerminalInstance({ tabId, visible, registerKill, onSelectionChange }) {
       }
 
       const requestId = `spawn-${++spawnSeq}`;
+      const initialCols = term.cols;
       ws.send(JSON.stringify({ type: 'terminal:spawn', cols: term.cols, rows: term.rows, requestId }));
 
       function onMessage(event) {
@@ -101,6 +102,14 @@ function TerminalInstance({ tabId, visible, registerKill, onSelectionChange }) {
               if (w?.readyState === WebSocket.OPEN) {
                 w.send(JSON.stringify({ type: 'terminal:resize', id: termIdRef.current, rows: r, cols: c }));
                 lastSizeRef.current = { cols: c, rows: r };
+                if (c !== initialCols) {
+                  setTimeout(() => {
+                    term.clear();
+                    if (w.readyState === WebSocket.OPEN && termIdRef.current) {
+                      w.send(JSON.stringify({ type: 'terminal:input', id: termIdRef.current, data: '\x0c' }));
+                    }
+                  }, 80);
+                }
               }
             }
           }, 50);
@@ -133,21 +142,42 @@ function TerminalInstance({ tabId, visible, registerKill, onSelectionChange }) {
       });
     }
 
+    let hasSpawned = false;
+    function tryInitSpawn() {
+      if (hasSpawned) return;
+      if (term.cols >= 10 && term.rows >= 2) {
+        hasSpawned = true;
+        trySpawn();
+      }
+    }
+
     requestAnimationFrame(() => {
       try { fitAddon.fit(); } catch {}
       requestAnimationFrame(() => {
         try { fitAddon.fit(); } catch {}
-        trySpawn();
+        tryInitSpawn();
       });
     });
 
+    const spawnFallback = setTimeout(() => {
+      if (!hasSpawned) {
+        try { fitAddon.fit(); } catch {}
+        hasSpawned = true;
+        trySpawn();
+      }
+    }, 3000);
+
     const observer = new ResizeObserver(() => {
       if (!visibleRef.current) return;
-      requestAnimationFrame(() => { try { fitAddon.fit(); } catch {} });
+      requestAnimationFrame(() => {
+        try { fitAddon.fit(); } catch {}
+        tryInitSpawn();
+      });
     });
     observer.observe(containerRef.current);
 
     return () => {
+      clearTimeout(spawnFallback);
       observer.disconnect();
       if (handlerRef.current) {
         handlerRef.current.ws.removeEventListener('message', handlerRef.current.handler);

package/packages/gui/src/components/fleet/fleet-content.jsx

@@ -5,7 +5,10 @@ import { useGrooveStore } from '../../stores/groove';
 import { FleetPane } from './fleet-pane';
 
 export function FleetContent() {
-  const selected = useGrooveStore((s) => s.fleetSelectedAgents);
+  const rawSelected = useGrooveStore((s) => s.fleetSelectedAgents);
+  const lastSelectedRef = useRef(rawSelected);
+  if (rawSelected[0] || rawSelected[1]) lastSelectedRef.current = rawSelected;
+  const selected = (rawSelected[0] || rawSelected[1]) ? rawSelected : lastSelectedRef.current;
   const splitMode = useGrooveStore((s) => s.fleetSplitMode);
   const fleetSelectAgent = useGrooveStore((s) => s.fleetSelectAgent);
 

package/packages/gui/src/components/fleet/fleet-pane.jsx

@@ -28,7 +28,12 @@ const STATUS_LABEL = {
 };
 
 export function FleetPane({ agentId, paneIndex }) {
-  const liveAgent = useGrooveStore((s) => s.agents.find((a) => a.id === agentId));
+  const effectiveId = agentId || null;
+  const lastIdRef = useRef(effectiveId);
+  if (effectiveId) lastIdRef.current = effectiveId;
+  const resolvedId = effectiveId || lastIdRef.current;
+
+  const liveAgent = useGrooveStore((s) => resolvedId ? s.agents.find((a) => a.id === resolvedId) : null);
   const fleetSelectAgent = useGrooveStore((s) => s.fleetSelectAgent);
   const fleetMarkRead = useGrooveStore((s) => s.fleetMarkRead);
 
@@ -43,15 +48,15 @@ export function FleetPane({ agentId, paneIndex }) {
   }
 
   useEffect(() => {
-    if (!liveAgent && agentId && !gone) {
-      goneTimer.current = setTimeout(() => setGone(true), 2000);
+    if (!liveAgent && resolvedId && !gone) {
+      goneTimer.current = setTimeout(() => setGone(true), 3000);
       return () => { if (goneTimer.current) clearTimeout(goneTimer.current); };
     }
-  }, [liveAgent, agentId, gone]);
+  }, [liveAgent, resolvedId, gone]);
 
   useEffect(() => {
-    if (agentId) fleetMarkRead(agentId);
-  }, [agentId, fleetMarkRead]);
+    if (effectiveId) fleetMarkRead(effectiveId);
+  }, [effectiveId, fleetMarkRead]);
 
   const agent = liveAgent || lastAgentRef.current;
 

package/packages/gui/src/stores/groove.js

@@ -199,9 +199,6 @@ export const useGrooveStore = create((set, get) => ({
           }
           for (const id of removed) delete timeline[id];
           const updates = { agents, tokenTimeline: timeline, hydrated: true };
-          if (removed.length > 0 && st.detailPanel?.type === 'agent' && removed.includes(st.detailPanel.agentId)) {
-            updates.detailPanel = null;
-          }
           set(updates);
           break;
         }
@@ -527,8 +524,15 @@ export const useGrooveStore = create((set, get) => ({
               const tid = get().activeTeamId;
               teamDetailPanels = { ...s.teamDetailPanels, [tid]: newPanel };
             }
+            let fleetSelectedAgents = s.fleetSelectedAgents;
+            if (fleetSelectedAgents[0] === oldId || fleetSelectedAgents[1] === oldId) {
+              fleetSelectedAgents = [
+                fleetSelectedAgents[0] === oldId ? newId : fleetSelectedAgents[0],
+                fleetSelectedAgents[1] === oldId ? newId : fleetSelectedAgents[1],
+              ];
+            }
             try { localStorage.setItem('groove:chatHistory', JSON.stringify(chatHistory)); } catch {}
-            return { chatHistory, tokenTimeline, activityLog, chatInputs, detailPanel, teamDetailPanels };
+            return { chatHistory, tokenTimeline, activityLog, chatInputs, detailPanel, teamDetailPanels, fleetSelectedAgents };
           });
           break;
         }

package/packages/gui/src/stores/slices/agents-slice.js

@@ -66,6 +66,15 @@ export const createAgentsSlice = (set, get) => ({
   async killAgent(id, purge = false) {
     try {
       await api.delete(`/agents/${encodeURIComponent(id)}?purge=${purge}`);
+      const dp = get().detailPanel;
+      if (dp?.type === 'agent' && dp.agentId === id) {
+        const tid = get().activeTeamId;
+        set({ detailPanel: null, teamDetailPanels: { ...get().teamDetailPanels, [tid]: null } });
+      }
+      const sel = get().fleetSelectedAgents;
+      if (sel[0] === id || sel[1] === id) {
+        set({ fleetSelectedAgents: [sel[0] === id ? null : sel[0], sel[1] === id ? null : sel[1]] });
+      }
       if (purge) {
         set((s) => {
           const chatHistory = { ...s.chatHistory };