groove-dev 0.27.164 → 0.27.166

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-CkCFf4Fl.js"></script>
+    <script type="module" crossorigin src="/assets/index-B_kpnfOu.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.164",
+  "version": "0.27.166",
   "description": "GROOVE GUI — visual agent control plane",
   "license": "FSL-1.1-Apache-2.0",
   "type": "module",

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) {
@@ -93,6 +94,25 @@ function TerminalInstance({ tabId, visible, registerKill, onSelectionChange }) {
 
         if (msg.type === 'terminal:spawned' && msg.requestId === requestId && !termIdRef.current) {
           termIdRef.current = msg.id;
+          setTimeout(() => {
+            try { fitRef.current?.fit(); } catch {}
+            const c = term.cols, r = term.rows;
+            if (c > 1 && r > 1 && termIdRef.current) {
+              const w = useGrooveStore.getState().ws;
+              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);
         } else if (msg.type === 'terminal:output' && msg.id === termIdRef.current) {
           term.write(msg.data);
         } else if (msg.type === 'terminal:exit' && msg.id === termIdRef.current) {
@@ -114,26 +134,50 @@ function TerminalInstance({ tabId, visible, registerKill, onSelectionChange }) {
       term.onResize(({ cols, rows }) => {
         if (cols === lastSizeRef.current.cols && rows === lastSizeRef.current.rows) return;
         if (cols < 2 || rows < 2) return;
-        lastSizeRef.current = { cols, rows };
         const ws = useGrooveStore.getState().ws;
         if (ws?.readyState === WebSocket.OPEN && termIdRef.current) {
+          lastSizeRef.current = { cols, rows };
           ws.send(JSON.stringify({ type: 'terminal:resize', id: termIdRef.current, rows, cols }));
         }
       });
     }
 
+    let hasSpawned = false;
+    function tryInitSpawn() {
+      if (hasSpawned) return;
+      if (term.cols >= 10 && term.rows >= 2) {
+        hasSpawned = true;
+        trySpawn();
+      }
+    }
+
     requestAnimationFrame(() => {
       try { fitAddon.fit(); } catch {}
-      trySpawn();
+      requestAnimationFrame(() => {
+        try { fitAddon.fit(); } catch {}
+        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);
@@ -149,6 +193,16 @@ function TerminalInstance({ tabId, visible, registerKill, onSelectionChange }) {
     if (visible && fitRef.current) {
       requestAnimationFrame(() => {
         try { fitRef.current.fit(); } catch {}
+        if (termRef.current && termIdRef.current) {
+          const c = termRef.current.cols, r = termRef.current.rows;
+          if (c > 1 && r > 1) {
+            const ws = useGrooveStore.getState().ws;
+            if (ws?.readyState === WebSocket.OPEN) {
+              ws.send(JSON.stringify({ type: 'terminal:resize', id: termIdRef.current, rows: r, cols: c }));
+              lastSizeRef.current = { cols: c, rows: r };
+            }
+          }
+        }
       });
     }
   }, [visible]);

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,8 +199,10 @@ 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;
+          if (removed.length > 0) {
+            if (st.detailPanel?.type === 'agent' && removed.includes(st.detailPanel.agentId)) {
+              updates.detailPanel = null;
+            }
           }
           set(updates);
           break;
@@ -527,8 +529,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;
         }