npm - groove-dev - Versions diffs - 0.25.2 → 0.25.4 - Mend

groove-dev 0.25.2 → 0.25.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (15) hide show

package/node_modules/@groove-dev/gui/dist/index.html CHANGED Viewed

@@ -5,12 +5,12 @@
     <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-DjEycx1f.js"></script>
+    <script type="module" crossorigin src="/assets/index-DtW5ej1k.js"></script>
     <link rel="modulepreload" crossorigin href="/assets/vendor-C0HXlhrU.js">
     <link rel="modulepreload" crossorigin href="/assets/reactflow-BQPfi37R.js">
     <link rel="modulepreload" crossorigin href="/assets/codemirror-BBL3i_JW.js">
     <link rel="modulepreload" crossorigin href="/assets/xterm--7_ns2zW.js">
-    <link rel="stylesheet" crossorigin href="/assets/index-CX6VBcgs.css">
+    <link rel="stylesheet" crossorigin href="/assets/index-B8gbMMHj.css">
   </head>
   <body>
     <div id="root"></div>

package/node_modules/@groove-dev/gui/src/components/dashboard/intel-panel.jsx CHANGED Viewed

@@ -1,7 +1,6 @@
 // FSL-1.1-Apache-2.0 — see LICENSE
 import { memo } from 'react';
 import { Tabs, TabsList, TabsTrigger, TabsContent } from '../ui/tabs';
-import { ScrollArea } from '../ui/scroll-area';
 import { fmtNum, fmtPct, timeAgo } from '../../lib/format';
 import { cn } from '../../lib/cn';
 import { HEX } from '../../lib/theme-hex';
@@ -55,53 +54,40 @@ function RotationTab({ tokens, rotation }) {
   const hypothetical = totalUsed + totalSaved;
   return (
-    <ScrollArea className="flex-1">
-      <div className="p-3 space-y-4">
-        {/* Big numbers */}
-        <div className="flex gap-4">
-          <div>
-            <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-0.5">Rotations</div>
-            <div className="text-xl font-mono font-semibold text-text-0 tabular-nums leading-none">
-              {rotation?.totalRotations || 0}
-            </div>
-          </div>
-          <div>
-            <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-0.5">Saved</div>
-            <div className="text-xl font-mono font-semibold text-success tabular-nums leading-none">
-              {fmtNum(totalSaved)}
-            </div>
-            {hypothetical > 0 && (
-              <div className="text-2xs font-mono text-text-3 mt-0.5">
-                {fmtPct((totalSaved / hypothetical) * 100)} of total
-              </div>
-            )}
-          </div>
+    <div className="p-3 space-y-4">
+      <div className="flex gap-4">
+        <div>
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-0.5">Rotations</div>
+          <div className="text-xl font-mono font-semibold text-text-0 tabular-nums leading-none">{rotation?.totalRotations || 0}</div>
         </div>
-        {/* Savings breakdown */}
-        <div className="space-y-2">
-          <SavingsBar label="Rotation" value={savings.fromRotation || 0} total={hypothetical} color={HEX.accent} />
-          <SavingsBar label="Conflict prevention" value={savings.fromConflictPrevention || 0} total={hypothetical} color={HEX.purple} />
-          <SavingsBar label="Cold-start skip" value={savings.fromColdStartSkip || 0} total={hypothetical} color={HEX.info} />
+        <div>
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-0.5">Saved</div>
+          <div className="text-xl font-mono font-semibold text-success tabular-nums leading-none">{fmtNum(totalSaved)}</div>
+          {hypothetical > 0 && (
+            <div className="text-2xs font-mono text-text-3 mt-0.5">{fmtPct((totalSaved / hypothetical) * 100)} of total</div>
+          )}
         </div>
-        {/* Rotation history */}
-        {rotation?.history?.length > 0 && (
-          <div>
-            <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-1.5">Recent</div>
-            <div className="space-y-1">
-              {rotation.history.slice(-8).reverse().map((r, i) => (
-                <div key={i} className="flex items-center gap-2 text-xs font-mono px-2 py-1 bg-surface-0 rounded">
-                  <span className="text-text-1 font-medium capitalize truncate flex-1">{r.agentName || r.role}</span>
-                  <span className="text-text-3 tabular-nums">{fmtPct((r.contextUsage || 0) * 100)}</span>
-                  <span className="text-text-4">{timeAgo(r.timestamp)}</span>
-                </div>
-              ))}
-            </div>
-          </div>
-        )}
       </div>
-    </ScrollArea>
+      <div className="space-y-2">
+        <SavingsBar label="Rotation" value={savings.fromRotation || 0} total={hypothetical} color={HEX.accent} />
+        <SavingsBar label="Conflict prevention" value={savings.fromConflictPrevention || 0} total={hypothetical} color={HEX.purple} />
+        <SavingsBar label="Cold-start skip" value={savings.fromColdStartSkip || 0} total={hypothetical} color={HEX.info} />
+      </div>
+      {rotation?.history?.length > 0 && (
+        <div>
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-1.5">Recent</div>
+          <div className="space-y-1">
+            {rotation.history.slice(-8).reverse().map((r, i) => (
+              <div key={i} className="flex items-center gap-2 text-xs font-mono px-2 py-1 bg-surface-0 rounded">
+                <span className="text-text-1 font-medium capitalize truncate flex-1">{r.agentName || r.role}</span>
+                <span className="text-text-3 tabular-nums">{fmtPct((r.contextUsage || 0) * 100)}</span>
+                <span className="text-text-4">{timeAgo(r.timestamp)}</span>
+              </div>
+            ))}
+          </div>
+        </div>
+      )}
+    </div>
   );
 }
@@ -122,7 +108,7 @@ function AdaptiveTab({ adaptive }) {
   }
   return (
-    <ScrollArea className="flex-1">
+    <div>
       <div className="p-3 space-y-1">
         {/* Header */}
         <div className="flex items-center gap-2 px-2 pb-1 text-2xs font-mono text-text-4 uppercase tracking-wider">
@@ -190,7 +176,7 @@ function AdaptiveTab({ adaptive }) {
           );
         })}
       </div>
-    </ScrollArea>
+    </div>
   );
 }
@@ -205,7 +191,7 @@ function JournalistTab({ journalist }) {
   }
   return (
-    <ScrollArea className="flex-1">
+    <div>
       <div className="p-3 space-y-3">
         {/* Status row */}
         <div className="flex items-center gap-3">
@@ -274,7 +260,7 @@ function JournalistTab({ journalist }) {
           </div>
         )}
       </div>
-    </ScrollArea>
+    </div>
   );
 }
@@ -297,14 +283,20 @@ const IntelPanel = memo(function IntelPanel({ tokens, rotation, adaptive, journa
         </TabsTrigger>
       </TabsList>
-      <TabsContent value="rotation" className="flex-1 min-h-0 overflow-hidden">
-        <RotationTab tokens={tokens} rotation={rotation} />
+      <TabsContent value="rotation" className="flex-1 min-h-0 relative">
+        <div className="absolute inset-0 overflow-y-auto">
+          <RotationTab tokens={tokens} rotation={rotation} />
+        </div>
       </TabsContent>
-      <TabsContent value="adaptive" className="flex-1 min-h-0 overflow-hidden">
-        <AdaptiveTab adaptive={adaptive} />
+      <TabsContent value="adaptive" className="flex-1 min-h-0 relative">
+        <div className="absolute inset-0 overflow-y-auto">
+          <AdaptiveTab adaptive={adaptive} />
+        </div>
       </TabsContent>
-      <TabsContent value="journalist" className="flex-1 min-h-0 overflow-hidden">
-        <JournalistTab journalist={journalist} />
+      <TabsContent value="journalist" className="flex-1 min-h-0 relative">
+        <div className="absolute inset-0 overflow-y-auto">
+          <JournalistTab journalist={journalist} />
+        </div>
       </TabsContent>
     </Tabs>
   );

package/node_modules/@groove-dev/gui/src/views/teams.jsx CHANGED Viewed

@@ -3,16 +3,129 @@ import { useState, useEffect } from 'react';
 import { useGrooveStore } from '../stores/groove';
 import { Tabs, TabsList, TabsTrigger, TabsContent } from '../components/ui/tabs';
 import { Button } from '../components/ui/button';
-import { Card } from '../components/ui/card';
 import { Badge } from '../components/ui/badge';
-import { ScrollArea } from '../components/ui/scroll-area';
-import { Skeleton } from '../components/ui/skeleton';
+import { StatusDot } from '../components/ui/status-dot';
 import { api } from '../lib/api';
 import { useToast } from '../lib/hooks/use-toast';
-import { timeAgo } from '../lib/format';
-import { Clock, CheckCircle, XCircle, AlertTriangle, ShieldCheck, ShieldX } from 'lucide-react';
+import { fmtNum, fmtDollar, timeAgo, fmtUptime } from '../lib/format';
+import { cn } from '../lib/cn';
+import {
+  Clock, CheckCircle, XCircle, AlertTriangle, ShieldCheck, ShieldX,
+  Users, Folder, Cpu, Trash2, Play, Pause, LayoutDashboard, ListChecks, Calendar,
+} from 'lucide-react';
-// ── Pending Approvals ──────────────────────────────────────
+// ── Team Dashboard ────────────────────────────────────────────
+function TeamsDashboard() {
+  const teams = useGrooveStore((s) => s.teams);
+  const agents = useGrooveStore((s) => s.agents);
+  const activeTeamId = useGrooveStore((s) => s.activeTeamId);
+  const deleteTeam = useGrooveStore((s) => s.deleteTeam);
+  const addToast = useGrooveStore((s) => s.addToast);
+  if (teams.length === 0) {
+    return (
+      <div className="flex-1 flex items-center justify-center">
+        <div className="text-center space-y-2">
+          <Users size={28} className="mx-auto text-text-4" />
+          <p className="text-xs font-sans text-text-3">No teams yet</p>
+          <p className="text-2xs font-sans text-text-4">Teams are created when you spawn agents or launch a planner</p>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className="flex-1 overflow-y-auto">
+      <div className="p-4 space-y-3">
+        {teams.map((team) => {
+          const teamAgents = agents.filter((a) => a.teamId === team.id);
+          const running = teamAgents.filter((a) => a.status === 'running' || a.status === 'starting');
+          const completed = teamAgents.filter((a) => a.status === 'completed');
+          const crashed = teamAgents.filter((a) => a.status === 'crashed');
+          const totalTokens = teamAgents.reduce((s, a) => s + (a.tokensUsed || 0), 0);
+          const totalCost = teamAgents.reduce((s, a) => s + (a.costUsd || 0), 0);
+          const isActive = team.id === activeTeamId;
+          return (
+            <div
+              key={team.id}
+              className={cn(
+                'rounded-md border bg-surface-1 overflow-hidden transition-colors',
+                isActive ? 'border-accent/30' : 'border-border-subtle',
+              )}
+            >
+              {/* Header */}
+              <div className="px-4 py-3 flex items-center gap-3">
+                <div className="flex-1 min-w-0">
+                  <div className="flex items-center gap-2">
+                    <span className="text-sm font-semibold text-text-0 font-sans">{team.name}</span>
+                    {isActive && <Badge variant="accent" className="text-2xs">Active</Badge>}
+                  </div>
+                  {team.workingDir && (
+                    <div className="flex items-center gap-1 mt-0.5">
+                      <Folder size={10} className="text-text-4" />
+                      <span className="text-2xs font-mono text-text-3 truncate">{team.workingDir}</span>
+                    </div>
+                  )}
+                </div>
+                <button
+                  onClick={() => {
+                    if (teamAgents.some((a) => a.status === 'running')) {
+                      addToast('error', 'Stop running agents first');
+                      return;
+                    }
+                    deleteTeam(team.id);
+                  }}
+                  className="p-1.5 text-text-4 hover:text-danger rounded transition-colors cursor-pointer"
+                  title="Delete team"
+                >
+                  <Trash2 size={13} />
+                </button>
+              </div>
+              {/* Stats row */}
+              <div className="px-4 py-2.5 border-t border-border-subtle bg-surface-0 flex items-center gap-4">
+                <Stat label="Agents" value={teamAgents.length} />
+                <Stat label="Running" value={running.length} color={running.length > 0 ? 'text-success' : undefined} />
+                <Stat label="Done" value={completed.length} />
+                <Stat label="Crashed" value={crashed.length} color={crashed.length > 0 ? 'text-danger' : undefined} />
+                <div className="flex-1" />
+                <Stat label="Tokens" value={fmtNum(totalTokens)} />
+                {totalCost > 0 && <Stat label="Cost" value={fmtDollar(totalCost)} />}
+              </div>
+              {/* Agent list */}
+              {teamAgents.length > 0 && (
+                <div className="border-t border-border-subtle">
+                  {teamAgents.map((a) => (
+                    <div key={a.id} className="flex items-center gap-2 px-4 py-1.5 border-b border-border-subtle last:border-b-0">
+                      <StatusDot status={a.status} size="sm" />
+                      <span className="text-xs font-semibold text-text-0 font-sans truncate">{a.name}</span>
+                      <span className="text-2xs font-mono text-text-3 uppercase">{a.role}</span>
+                      <div className="flex-1" />
+                      <span className="text-2xs font-mono text-text-2 tabular-nums">{fmtNum(a.tokensUsed || 0)}</span>
+                    </div>
+                  ))}
+                </div>
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </div>
+  );
+}
+function Stat({ label, value, color }) {
+  return (
+    <div className="text-center">
+      <div className={cn('text-xs font-mono tabular-nums', color || 'text-text-1')}>{value}</div>
+      <div className="text-2xs font-mono text-text-4 uppercase tracking-wider">{label}</div>
+    </div>
+  );
+}
+// ── Approvals ─────────────────────────────────────────────────
 function PendingApprovals() {
   const pending = useGrooveStore((s) => s.pendingApprovals);
   const approveRequest = useGrooveStore((s) => s.approveRequest);
@@ -23,24 +136,24 @@ function PendingApprovals() {
   return (
     <div className="px-4 pt-4 space-y-2">
       <div className="flex items-center gap-2 mb-1">
-        <AlertTriangle size={13} className="text-warning" />
-        <span className="text-xs font-semibold text-warning font-sans">Pending Approval ({pending.length})</span>
+        <AlertTriangle size={12} className="text-warning" />
+        <span className="text-2xs font-mono text-warning uppercase tracking-wider">Pending ({pending.length})</span>
       </div>
       {pending.map((item) => (
-        <div key={item.id} className="flex items-center gap-3 px-3 py-2.5 rounded-md bg-warning/5 border border-warning/20">
+        <div key={item.id} className="flex items-center gap-3 px-3 py-2 rounded-md bg-warning/5 border border-warning/20">
           <div className="flex-1 min-w-0">
             <div className="text-xs text-text-0 font-sans font-medium truncate">
               {item.agentName}: {item.action?.description || item.action?.type || 'action'}
             </div>
-            {item.action?.filePath && <div className="text-2xs text-text-3 font-mono truncate mt-0.5">{item.action.filePath}</div>}
-            <div className="text-2xs text-text-4 font-sans mt-0.5">{timeAgo(item.requestedAt)}</div>
+            {item.action?.filePath && <div className="text-2xs font-mono text-text-3 truncate mt-0.5">{item.action.filePath}</div>}
+            <div className="text-2xs text-text-4 font-mono mt-0.5">{timeAgo(item.requestedAt)}</div>
           </div>
           <div className="flex gap-1.5 flex-shrink-0">
             <Button variant="primary" size="sm" onClick={() => approveRequest(item.id)} className="h-7 px-2.5 gap-1 text-2xs">
-              <ShieldCheck size={11} /> Approve
+              <ShieldCheck size={10} /> Approve
             </Button>
             <Button variant="danger" size="sm" onClick={() => rejectRequest(item.id)} className="h-7 px-2.5 gap-1 text-2xs">
-              <ShieldX size={11} /> Reject
+              <ShieldX size={10} /> Reject
             </Button>
           </div>
         </div>
@@ -49,7 +162,6 @@ function PendingApprovals() {
   );
 }
-// ── Resolved Approvals / History ───────────────────────────
 function ApprovalsTab() {
   const resolved = useGrooveStore((s) => s.resolvedApprovals);
   const [pmHistory, setPmHistory] = useState([]);
@@ -69,7 +181,6 @@ function ApprovalsTab() {
     setLoading(false);
   }
-  // Merge PM history with real-time resolved approvals, dedup by id
   const seen = new Set();
   const allHistory = [...resolved, ...pmHistory].filter((item) => {
     const key = item.id || `${item.agentName}-${item.timestamp}`;
@@ -78,45 +189,49 @@ function ApprovalsTab() {
     return true;
   });
-  if (loading && allHistory.length === 0) {
-    return <div className="p-4 space-y-2">{[...Array(4)].map((_, i) => <Skeleton key={i} className="h-12 rounded-md" />)}</div>;
-  }
   return (
-    <ScrollArea className="flex-1">
+    <div className="flex-1 overflow-y-auto">
       <PendingApprovals />
-      <div className="p-4 space-y-2">
-        {allHistory.length === 0 && (
-          <div className="text-center py-12 text-text-4 font-sans">
-            <CheckCircle size={32} className="mx-auto mb-2" />
-            <p className="text-sm">No approval history</p>
-            <p className="text-2xs text-text-4 mt-1">Approvals appear when agents use "Agent Approve" permission mode</p>
+      <div className="p-4 space-y-1.5">
+        {loading && allHistory.length === 0 && (
+          <div className="text-center py-12 text-text-4 font-mono text-xs">Loading...</div>
+        )}
+        {!loading && allHistory.length === 0 && (
+          <div className="text-center py-12">
+            <CheckCircle size={24} className="mx-auto mb-2 text-text-4" />
+            <p className="text-xs font-sans text-text-3">No approval history</p>
+            <p className="text-2xs text-text-4 font-sans mt-1">Approvals appear when agents use Auto permission mode</p>
           </div>
         )}
-        {allHistory.map((item, i) => (
-          <div key={item.id || i} className="flex items-center gap-3 px-3 py-2 rounded-md bg-surface-1 border border-border-subtle">
-            {(item.status === 'approved' || item.verdict === 'approved') ? (
-              <CheckCircle size={14} className="text-success flex-shrink-0" />
-            ) : (
-              <XCircle size={14} className="text-danger flex-shrink-0" />
-            )}
-            <div className="flex-1 min-w-0">
-              <div className="text-xs text-text-0 font-sans truncate">
-                {item.agentName}: {item.action?.description || item.action || 'action'}
+        {allHistory.map((item, i) => {
+          const approved = item.status === 'approved' || item.verdict === 'approved';
+          return (
+            <div key={item.id || i} className="flex items-center gap-2.5 px-3 py-2 rounded-md bg-surface-0 border border-border-subtle">
+              {approved ? (
+                <CheckCircle size={12} className="text-success flex-shrink-0" />
+              ) : (
+                <XCircle size={12} className="text-danger flex-shrink-0" />
+              )}
+              <div className="flex-1 min-w-0">
+                <div className="text-xs text-text-1 font-sans truncate">
+                  <span className="font-medium text-text-0">{item.agentName}</span>
+                  <span className="text-text-3 mx-1">·</span>
+                  <span>{item.action?.description || item.action || 'action'}</span>
+                </div>
+                {item.reason && <div className="text-2xs text-text-3 font-sans truncate mt-0.5">{item.reason}</div>}
               </div>
-              {item.reason && <div className="text-2xs text-text-3 font-sans truncate">{item.reason}</div>}
+              <span className="text-2xs font-mono text-text-4 flex-shrink-0">
+                {timeAgo(item.resolvedAt || item.timestamp)}
+              </span>
             </div>
-            <span className="text-2xs text-text-4 font-sans flex-shrink-0">
-              {timeAgo(item.resolvedAt || item.timestamp)}
-            </span>
-          </div>
-        ))}
+          );
+        })}
       </div>
-    </ScrollArea>
+    </div>
   );
 }
-// ── Schedules Tab ──────────────────────────────────────────
+// ── Schedules ─────────────────────────────────────────────────
 function SchedulesTab() {
   const [schedules, setSchedules] = useState([]);
   const [loading, setLoading] = useState(true);
@@ -145,58 +260,93 @@ function SchedulesTab() {
     }
   }
-  if (loading) {
-    return <div className="p-4 space-y-2">{[...Array(3)].map((_, i) => <Skeleton key={i} className="h-16 rounded-md" />)}</div>;
-  }
   return (
-    <ScrollArea className="flex-1">
+    <div className="flex-1 overflow-y-auto">
       <div className="p-4 space-y-2">
-        {schedules.length === 0 && (
-          <div className="text-center py-12 text-text-4 font-sans">
-            <Clock size={32} className="mx-auto mb-2" />
-            <p className="text-sm">No schedules configured</p>
+        {loading && schedules.length === 0 && (
+          <div className="text-center py-12 text-text-4 font-mono text-xs">Loading...</div>
+        )}
+        {!loading && schedules.length === 0 && (
+          <div className="text-center py-12">
+            <Calendar size={24} className="mx-auto mb-2 text-text-4" />
+            <p className="text-xs font-sans text-text-3">No schedules configured</p>
+            <p className="text-2xs text-text-4 font-sans mt-1">Use the CLI to create agent schedules</p>
           </div>
         )}
         {schedules.map((s) => (
-          <Card key={s.id} className="p-3">
-            <div className="flex items-center gap-3">
+          <div key={s.id} className="rounded-md border border-border-subtle bg-surface-0 overflow-hidden">
+            <div className="flex items-center gap-3 px-4 py-3">
               <div className="flex-1 min-w-0">
                 <div className="flex items-center gap-2">
-                  <span className="text-sm font-semibold text-text-0 font-sans">{s.name}</span>
-                  <Badge variant={s.enabled ? 'success' : 'default'}>{s.enabled ? 'Active' : 'Paused'}</Badge>
+                  <span className="text-xs font-semibold text-text-0 font-sans">{s.name}</span>
+                  <Badge variant={s.enabled ? 'success' : 'default'} className="text-2xs">
+                    {s.enabled ? 'Active' : 'Paused'}
+                  </Badge>
+                </div>
+                <div className="flex items-center gap-2 mt-1">
+                  <span className="text-2xs font-mono text-text-2">{s.cron}</span>
+                  <span className="text-2xs text-text-4">·</span>
+                  <span className="text-2xs font-mono text-text-3 uppercase">{s.role}</span>
+                  {s.teamId && (
+                    <>
+                      <span className="text-2xs text-text-4">·</span>
+                      <span className="text-2xs font-sans text-text-3">{s.teamName || s.teamId}</span>
+                    </>
+                  )}
                 </div>
-                <div className="text-2xs text-text-3 font-mono mt-0.5">{s.cron} · {s.role}</div>
+                {s.prompt && (
+                  <div className="text-2xs font-sans text-text-4 mt-1 truncate">{s.prompt}</div>
+                )}
               </div>
               <Button
-                variant="ghost"
+                variant="secondary"
                 size="sm"
                 onClick={() => toggleSchedule(s.id, s.enabled)}
+                className="h-7 px-2.5 gap-1 text-2xs"
               >
-                {s.enabled ? 'Pause' : 'Enable'}
+                {s.enabled ? <><Pause size={10} /> Pause</> : <><Play size={10} /> Enable</>}
               </Button>
             </div>
-          </Card>
+            {s.lastRunAt && (
+              <div className="px-4 py-1.5 border-t border-border-subtle bg-surface-1 text-2xs font-mono text-text-4">
+                Last run: {timeAgo(s.lastRunAt)}
+                {s.nextRunAt && <span className="ml-3">Next: {timeAgo(s.nextRunAt)}</span>}
+              </div>
+            )}
+          </div>
         ))}
       </div>
-    </ScrollArea>
+    </div>
   );
 }
-// ── Main View ────────────────────────────────��─────────────
+// ── Main View ─────────────────────────────────────────────────
 export default function TeamsView() {
   return (
-    <Tabs defaultValue="approvals" className="flex flex-col h-full">
+    <Tabs defaultValue="dashboard" className="flex flex-col h-full">
       <div className="px-4 pt-3 bg-surface-1 border-b border-border">
         <div className="flex items-center gap-4 mb-0">
-          <h2 className="text-base font-semibold text-text-0 font-sans">Management</h2>
+          <h2 className="text-xs font-semibold text-text-0 font-sans tracking-wide uppercase">Management</h2>
         </div>
         <TabsList className="border-b-0">
-          <TabsTrigger value="approvals">Approvals</TabsTrigger>
-          <TabsTrigger value="schedules">Schedules</TabsTrigger>
+          <TabsTrigger value="dashboard" className="inline-flex items-center gap-1.5">
+            <LayoutDashboard size={12} />
+            Teams
+          </TabsTrigger>
+          <TabsTrigger value="approvals" className="inline-flex items-center gap-1.5">
+            <ListChecks size={12} />
+            Approvals
+          </TabsTrigger>
+          <TabsTrigger value="schedules" className="inline-flex items-center gap-1.5">
+            <Calendar size={12} />
+            Schedules
+          </TabsTrigger>
         </TabsList>
       </div>
+      <TabsContent value="dashboard" className="flex-1 min-h-0">
+        <TeamsDashboard />
+      </TabsContent>
       <TabsContent value="approvals" className="flex-1 min-h-0">
         <ApprovalsTab />
       </TabsContent>

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "groove-dev",
-  "version": "0.25.2",
+  "version": "0.25.4",
   "description": "Open-source agent orchestration layer — the AI company OS. 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.",
   "license": "FSL-1.1-Apache-2.0",
   "author": "Groove Dev <hello@groovedev.ai> (https://groovedev.ai)",

package/packages/daemon/src/skills.js CHANGED Viewed

@@ -264,7 +264,12 @@ export class SkillStore {
    * Downloads content from live API, falls back to contentUrl, then local plugins.
    */
   async install(skillId) {
-    const entry = this.registry.find((s) => s.id === skillId);
+    let entry = this.registry.find((s) => s.id === skillId);
+    // Registry may be stale — refresh and retry lookup
+    if (!entry) {
+      await this._refreshRegistry();
+      entry = this.registry.find((s) => s.id === skillId);
+    }
     if (!entry) throw new Error(`Skill not found: ${skillId}`);
     if (this._isInstalled(skillId)) throw new Error(`Skill already installed: ${skillId}`);