groove-dev 0.27.161 → 0.27.163

package/node_modules/@groove-dev/gui/src/components/fleet/fleet-sidebar.jsx

@@ -0,0 +1,216 @@
+// FSL-1.1-Apache-2.0 — see LICENSE
+import { useRef, useCallback, useMemo, useState } from 'react';
+import { Search, X, ChevronRight, Plus, Trash2 } from 'lucide-react';
+import { useGrooveStore } from '../../stores/groove';
+import { cn } from '../../lib/cn';
+import { FleetAgentRow } from './fleet-agent-row';
+
+function teamStatusDot(agents) {
+  if (agents.some((a) => a.status === 'crashed')) return 'bg-danger';
+  if (agents.some((a) => a.status === 'running' || a.status === 'starting')) return 'bg-accent';
+  if (agents.some((a) => a.status === 'completed')) return 'bg-info';
+  return 'bg-text-4';
+}
+
+export function FleetSidebar({ width }) {
+  const teams = useGrooveStore((s) => s.teams);
+  const agents = useGrooveStore((s) => s.agents);
+  const search = useGrooveStore((s) => s.fleetSearch);
+  const setSearch = useGrooveStore((s) => s.fleetSetSearch);
+  const collapsed = useGrooveStore((s) => s.fleetSidebarCollapsed);
+  const toggleCollapsed = useGrooveStore((s) => s.fleetToggleTeamCollapsed);
+  const setSidebarWidth = useGrooveStore((s) => s.fleetSetSidebarWidth);
+  const deleteTeam = useGrooveStore((s) => s.deleteTeam);
+  const openDetail = useGrooveStore((s) => s.openDetail);
+
+  const [confirmDeleteTeam, setConfirmDeleteTeam] = useState(null);
+
+  const dragging = useRef(false);
+  const startX = useRef(0);
+  const startW = useRef(0);
+
+  const onMouseDown = useCallback((e) => {
+    e.preventDefault();
+    dragging.current = true;
+    startX.current = e.clientX;
+    startW.current = width;
+
+    function onMouseMove(ev) {
+      if (!dragging.current) return;
+      const delta = ev.clientX - startX.current;
+      setSidebarWidth(startW.current + delta);
+    }
+
+    function onMouseUp() {
+      dragging.current = false;
+      document.removeEventListener('mousemove', onMouseMove);
+      document.removeEventListener('mouseup', onMouseUp);
+    }
+
+    document.addEventListener('mousemove', onMouseMove);
+    document.addEventListener('mouseup', onMouseUp);
+  }, [width, setSidebarWidth]);
+
+  const agentsByTeam = useMemo(() => {
+    const map = {};
+    for (const a of agents) {
+      if (!a.teamId) continue;
+      if (!map[a.teamId]) map[a.teamId] = [];
+      map[a.teamId].push(a);
+    }
+    return map;
+  }, [agents]);
+
+  const lowerSearch = search.toLowerCase();
+  const filteredTeams = useMemo(() => {
+    if (!lowerSearch) return teams;
+    return teams.filter((t) => {
+      if (t.name?.toLowerCase().includes(lowerSearch)) return true;
+      const ta = agentsByTeam[t.id] || [];
+      return ta.some((a) =>
+        a.name?.toLowerCase().includes(lowerSearch) ||
+        a.role?.toLowerCase().includes(lowerSearch)
+      );
+    });
+  }, [teams, agentsByTeam, lowerSearch]);
+
+  const filteredAgentsForTeam = useCallback((teamId) => {
+    const ta = agentsByTeam[teamId] || [];
+    if (!lowerSearch) return ta;
+    return ta.filter((a) =>
+      a.name?.toLowerCase().includes(lowerSearch) ||
+      a.role?.toLowerCase().includes(lowerSearch)
+    );
+  }, [agentsByTeam, lowerSearch]);
+
+  function handleDeleteTeam(e, teamId) {
+    e.stopPropagation();
+    if (confirmDeleteTeam === teamId) {
+      deleteTeam(teamId);
+      setConfirmDeleteTeam(null);
+    } else {
+      setConfirmDeleteTeam(teamId);
+      setTimeout(() => setConfirmDeleteTeam(null), 3000);
+    }
+  }
+
+  function handleSpawnToTeam(e, teamId) {
+    e.stopPropagation();
+    openDetail({ type: 'spawn', presetTeamId: teamId });
+  }
+
+  return (
+    <div
+      className="flex-shrink-0 flex flex-col bg-surface-1 border-r border-border relative h-full"
+      style={{ width }}
+    >
+      {/* Search */}
+      <div className="px-2.5 pt-2.5 pb-2 flex-shrink-0">
+        <div className="relative">
+          <Search size={14} className="absolute left-2 top-1/2 -translate-y-1/2 text-text-4" />
+          <input
+            type="text"
+            value={search}
+            onChange={(e) => setSearch(e.target.value)}
+            placeholder="Search agents..."
+            className="w-full h-7 pl-7 pr-7 text-xs bg-surface-3 rounded border border-border-subtle text-text-0 placeholder:text-text-4 focus:outline-none focus:border-text-4/40 font-sans"
+          />
+          {search && (
+            <button
+              onClick={() => setSearch('')}
+              className="absolute right-1.5 top-1/2 -translate-y-1/2 p-0.5 rounded text-text-4 hover:text-text-1 cursor-pointer"
+            >
+              <X size={14} />
+            </button>
+          )}
+        </div>
+      </div>
+
+      {/* Team list */}
+      <div className="flex-1 overflow-y-auto min-h-0 px-1">
+        {filteredTeams.map((team) => {
+          const teamAgents = filteredAgentsForTeam(team.id);
+          const allTeamAgents = agentsByTeam[team.id] || [];
+          const isCollapsed = collapsed[team.id];
+          const isConfirming = confirmDeleteTeam === team.id;
+
+          return (
+            <div key={team.id} className="mb-0.5">
+              {/* Team header */}
+              <div className={cn(
+                'w-full flex items-center gap-1 px-2 py-1.5 rounded-md hover:bg-surface-2 transition-colors group',
+                isConfirming && 'bg-danger/10 hover:bg-danger/20',
+              )}>
+                <button
+                  onClick={() => toggleCollapsed(team.id)}
+                  className="flex items-center gap-1.5 flex-1 min-w-0 cursor-pointer"
+                >
+                  <ChevronRight
+                    size={14}
+                    className={cn(
+                      'text-text-4 transition-transform flex-shrink-0',
+                      !isCollapsed && 'rotate-90',
+                    )}
+                  />
+                  <span className={cn(
+                    'text-xs font-medium font-sans truncate text-left',
+                    isConfirming ? 'text-danger' : 'text-text-1',
+                  )}>
+                    {isConfirming ? 'Click again to delete' : team.name}
+                  </span>
+                </button>
+
+                {/* Hover actions + meta — stacked in same space */}
+                <div className="flex items-center gap-0.5 flex-shrink-0">
+                  <button
+                    onClick={(e) => handleSpawnToTeam(e, team.id)}
+                    className="opacity-0 group-hover:opacity-100 p-0.5 rounded text-text-4 hover:text-accent transition-opacity cursor-pointer"
+                    title="Spawn agent to team"
+                  >
+                    <Plus size={14} />
+                  </button>
+                  <button
+                    onClick={(e) => handleDeleteTeam(e, team.id)}
+                    className={cn(
+                      'opacity-0 group-hover:opacity-100 p-0.5 rounded transition-opacity cursor-pointer',
+                      isConfirming ? 'text-danger' : 'text-text-4 hover:text-danger',
+                    )}
+                    title="Delete team"
+                  >
+                    <Trash2 size={12} />
+                  </button>
+                  <span className="group-hover:opacity-0 text-2xs text-text-4 font-mono transition-opacity">
+                    {allTeamAgents.length}
+                  </span>
+                  <span className={cn('w-1.5 h-1.5 rounded-full flex-shrink-0', teamStatusDot(allTeamAgents))} />
+                </div>
+              </div>
+
+              {/* Agent rows */}
+              {!isCollapsed && teamAgents.length > 0 && (
+                <div className="ml-3 pl-1">
+                  {teamAgents.map((agent) => (
+                    <FleetAgentRow key={agent.id} agent={agent} />
+                  ))}
+                </div>
+              )}
+            </div>
+          );
+        })}
+
+        {filteredTeams.length === 0 && (
+          <div className="flex flex-col items-center justify-center py-8 text-center px-4">
+            <Search size={16} className="text-text-4 mb-2" />
+            <p className="text-xs text-text-3 font-sans">No matching agents</p>
+          </div>
+        )}
+      </div>
+
+      {/* Resize handle */}
+      <div
+        className="absolute right-0 top-0 bottom-0 w-1 cursor-col-resize hover:bg-accent/30 transition-colors z-10"
+        onMouseDown={onMouseDown}
+      />
+    </div>
+  );
+}

package/node_modules/@groove-dev/gui/src/components/layout/activity-bar.jsx

@@ -1,5 +1,5 @@
 // FSL-1.1-Apache-2.0 — see LICENSE
-import { Network, Code2, ChartSpline, Puzzle, Users, Box, FlaskConical, Newspaper, Settings, Globe, MessageCircle, BookOpen } from 'lucide-react';
+import { Network, Code2, ChartSpline, Puzzle, Users, Box, FlaskConical, Newspaper, Settings, Globe, MessageCircle, BookOpen, LayoutList } from 'lucide-react';
 import { cn } from '../../lib/cn';
 import { Tooltip } from '../ui/tooltip';
 import { useGrooveStore } from '../../stores/groove';
@@ -7,6 +7,7 @@ import { isElectron, getPlatform } from '../../lib/electron';
 
 const BASE_NAV_ITEMS = [
   { id: 'agents',      icon: Network,       label: 'Agents' },
+  { id: 'fleet',       icon: LayoutList,    label: 'Fleet' },
   { id: 'chat',        icon: MessageCircle, label: 'Chat' },
   { id: 'editor',      icon: Code2,         label: 'Editor' },
   { id: 'dashboard',   icon: ChartSpline,   label: 'Dashboard' },

package/node_modules/@groove-dev/gui/src/stores/slices/agents-slice.js

@@ -188,6 +188,10 @@ export const createAgentsSlice = (set, get) => ({
       if (get().labAssistantAgentId === id) {
         localStorage.setItem('groove:labAssistantAgentId', newAgent.id);
         set({ labAssistantAgentId: newAgent.id });
+      } else if (get().activeView === 'fleet') {
+        const sel = get().fleetSelectedAgents;
+        const pane = sel[1] === id ? 1 : 0;
+        get().fleetSelectAgent(newAgent.id, pane);
       } else {
         get().selectAgent(newAgent.id);
       }

package/node_modules/@groove-dev/gui/src/stores/slices/ui-slice.js

@@ -25,6 +25,14 @@ export const createUiSlice = (set, get) => ({
   // ── Toasts ────────────────────────────────────────────────
   toasts: [],
 
+  // ── Fleet View ─────────────────────────────────────────────
+  fleetSelectedAgents: [null, null],
+  fleetSplitMode: false,
+  fleetSidebarWidth: Number(localStorage.getItem('groove:fleetSidebarWidth')) || 240,
+  fleetSidebarCollapsed: {},
+  fleetSearch: '',
+  fleetUnreadMap: {},
+
   // ── Version / Auto-Update ──────────────────────────────────
   version: null,
   updateReady: null,
@@ -33,7 +41,34 @@ export const createUiSlice = (set, get) => ({
 
   // ── Navigation ────────────────────────────────────────────
 
-  setActiveView(view) { set({ activeView: view }); },
+  setActiveView(view) {
+    const prev = get().activeView;
+    const updates = { activeView: view };
+    if (prev === 'fleet' && view !== 'fleet') {
+      const sel = get().fleetSelectedAgents;
+      const primaryId = sel[0] || sel[1];
+      if (primaryId) {
+        const tid = get().activeTeamId;
+        const panel = { type: 'agent', agentId: primaryId };
+        updates.detailPanel = panel;
+        updates.teamDetailPanels = { ...get().teamDetailPanels, [tid]: panel };
+      }
+    }
+    if (view === 'fleet' && prev !== 'fleet') {
+      const dp = get().detailPanel;
+      const sel = get().fleetSelectedAgents;
+      if (!sel[0] && !sel[1] && dp?.type === 'agent' && dp.agentId) {
+        updates.fleetSelectedAgents = [dp.agentId, null];
+      }
+      const tid = get().activeTeamId;
+      updates.detailPanel = null;
+      updates.teamDetailPanels = { ...get().teamDetailPanels, [tid]: null };
+      const allCollapsed = {};
+      for (const t of get().teams) allCollapsed[t.id] = true;
+      updates.fleetSidebarCollapsed = allCollapsed;
+    }
+    set(updates);
+  },
 
   openDetail(descriptor) {
     const tid = get().activeTeamId;
@@ -73,6 +108,41 @@ export const createUiSlice = (set, get) => ({
     persistJSON('groove:expandedNodes', expanded);
   },
 
+  // ── Fleet View ────────────────────────────────────────────
+
+  fleetSelectAgent(agentId, pane = 0) {
+    const selected = [...get().fleetSelectedAgents];
+    selected[pane] = agentId;
+    const updates = { fleetSelectedAgents: selected };
+    if (pane === 1 && agentId !== null && !get().fleetSplitMode) {
+      updates.fleetSplitMode = true;
+    }
+    if (pane === 1 && agentId === null) {
+      updates.fleetSplitMode = false;
+    }
+    set(updates);
+  },
+  fleetToggleSplit() {
+    const next = !get().fleetSplitMode;
+    const selected = [...get().fleetSelectedAgents];
+    if (!next) selected[1] = null;
+    set({ fleetSplitMode: next, fleetSelectedAgents: selected });
+  },
+  fleetSetSidebarWidth(width) {
+    const w = Math.max(180, Math.min(400, width));
+    set({ fleetSidebarWidth: w });
+    localStorage.setItem('groove:fleetSidebarWidth', String(w));
+  },
+  fleetToggleTeamCollapsed(teamId) {
+    const collapsed = { ...get().fleetSidebarCollapsed };
+    collapsed[teamId] = !collapsed[teamId];
+    set({ fleetSidebarCollapsed: collapsed });
+  },
+  fleetSetSearch(text) { set({ fleetSearch: text }); },
+  fleetMarkRead(agentId) {
+    set((s) => ({ fleetUnreadMap: { ...s.fleetUnreadMap, [agentId]: Date.now() } }));
+  },
+
   // ── Toasts ────────────────────────────────────────────────
 
   addToast(type, message, detail, action, options = {}) {

package/node_modules/@groove-dev/gui/src/views/fleet.jsx

@@ -0,0 +1,15 @@
+// FSL-1.1-Apache-2.0 — see LICENSE
+import { FleetSidebar } from '../components/fleet/fleet-sidebar';
+import { FleetContent } from '../components/fleet/fleet-content';
+import { useGrooveStore } from '../stores/groove';
+
+export default function FleetView() {
+  const sidebarWidth = useGrooveStore((s) => s.fleetSidebarWidth);
+
+  return (
+    <div className="flex h-full min-h-0">
+      <FleetSidebar width={sidebarWidth} />
+      <FleetContent />
+    </div>
+  );
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "groove-dev",
-  "version": "0.27.161",
+  "version": "0.27.163",
   "description": "Open-source agent orchestration layer — the AI company OS. Local model agent engine (GGUF/Ollama/llama-server), HuggingFace model browser, MCP integrations (Slack, Gmail, Stripe, 15+), agent scheduling (cron), business roles (CMO, CFO, EA). GUI dashboard, multi-agent coordination, zero cold-start, infinite sessions. Works with Claude Code, Codex, Gemini CLI, Ollama, any local model.",
   "license": "FSL-1.1-Apache-2.0",
   "author": "Groove Dev <hello@groovedev.ai> (https://groovedev.ai)",

package/packages/cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@groove-dev/cli",
-  "version": "0.27.161",
+  "version": "0.27.163",
   "description": "GROOVE CLI — manage AI coding agents from your terminal",
   "license": "FSL-1.1-Apache-2.0",
   "type": "module",

package/packages/daemon/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@groove-dev/daemon",
-  "version": "0.27.161",
+  "version": "0.27.163",
   "description": "GROOVE daemon — agent orchestration engine",
   "license": "FSL-1.1-Apache-2.0",
   "type": "module",

package/packages/daemon/src/gateways/manager.js

@@ -874,6 +874,7 @@ export class GatewayManager {
               teamId: defaultTeamId,
             })),
           });
+          this.daemon.processes._persistPendingPhase2();
         }
       }
 

package/packages/daemon/src/index.js

@@ -588,6 +588,9 @@ export class Daemon {
       console.log(`  ${resumableIds.size} agent-loop session(s) marked as resumable`);
     }
 
+    // Restore pending phase 2 groups from disk
+    this.processes.loadPendingPhase2();
+
     // Migrate old agents without teamId to default team
     this.teams.migrateAgents();