groove-dev 0.22.31 → 0.24.0

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

@@ -2,10 +2,12 @@
 import { useRef, useState, useEffect } from 'react';
 import { useDashboard } from '../lib/hooks/use-dashboard';
 import { DashboardHeader } from '../components/dashboard/header-bar';
-import { KpiCard } from '../components/dashboard/kpi-card';
+import { KpiStrip } from '../components/dashboard/kpi-card';
 import { FleetPanel } from '../components/dashboard/fleet-panel';
-import { SavingsPanel } from '../components/dashboard/savings-panel';
 import { TokenChart } from '../components/dashboard/token-chart';
+import { CacheRing } from '../components/dashboard/cache-ring';
+import { RoutingChart } from '../components/dashboard/routing-chart';
+import { IntelPanel } from '../components/dashboard/intel-panel';
 import { ActivityFeed } from '../components/dashboard/activity-feed';
 import { Skeleton } from '../components/ui/skeleton';
 import { HEX } from '../lib/theme-hex';
@@ -14,45 +16,52 @@ import { BarChart3 } from 'lucide-react';
 
 function DashboardSkeleton() {
   return (
-    <div className="flex-1 flex flex-col p-4 gap-3">
-      <div className="flex gap-3">
-        {[...Array(5)].map((_, i) => (
-          <Skeleton key={i} className="h-16 flex-1 rounded-md" />
-        ))}
-      </div>
-      <div className="flex gap-3 flex-1">
-        <Skeleton className="flex-[5] rounded-md" />
-        <Skeleton className="flex-[3] rounded-md" />
-        <Skeleton className="flex-[3] rounded-md" />
-      </div>
+    <div className="flex-1 grid gap-px p-0" style={{
+      gridTemplateRows: 'auto minmax(0, 1fr) minmax(0, 1fr)',
+      gridTemplateColumns: '3fr 1.5fr 1.5fr',
+      background: '#1a1e25',
+    }}>
+      {/* KPI row */}
+      <div className="col-span-3"><Skeleton className="h-[72px] rounded-none" /></div>
+      {/* Chart row */}
+      <Skeleton className="rounded-none" />
+      <Skeleton className="rounded-none" />
+      <Skeleton className="rounded-none" />
+      {/* Intel row */}
+      <Skeleton className="rounded-none" />
+      <div className="col-span-2"><Skeleton className="h-full rounded-none" /></div>
     </div>
   );
 }
 
 export default function DashboardView() {
-  const { data, loading, agents, connected, kpiHistory, lastFetch } = useDashboard();
-  const chartContainerRef = useRef(null);
+  const {
+    data, loading, agents, connected, kpiHistory, lastFetch,
+    agentBreakdown, routing, rotation, adaptive, journalist, rotating,
+  } = useDashboard();
+
+  const chartRef = useRef(null);
   const [chartSize, setChartSize] = useState({ width: 400, height: 200 });
 
   const runningCount = agents.filter((a) => a.status === 'running').length;
 
-  // Measure chart container
+  // Measure token chart container
   useEffect(() => {
-    if (!chartContainerRef.current) return;
+    if (!chartRef.current) return;
     const observer = new ResizeObserver((entries) => {
       const { width, height } = entries[0].contentRect;
       setChartSize({ width: Math.floor(width), height: Math.floor(height) });
     });
-    observer.observe(chartContainerRef.current);
+    observer.observe(chartRef.current);
     return () => observer.disconnect();
   }, []);
 
   if (!connected) {
     return (
       <div className="w-full h-full flex items-center justify-center">
-        <div className="text-center space-y-2 text-text-4 font-sans">
-          <BarChart3 size={32} className="mx-auto" />
-          <p className="text-sm">Connecting to daemon...</p>
+        <div className="text-center space-y-2 text-[#3a3f4b] font-mono">
+          <BarChart3 size={28} className="mx-auto" />
+          <p className="text-[10px]">Connecting to daemon...</p>
         </div>
       </div>
     );
@@ -68,24 +77,38 @@ export default function DashboardView() {
   }
 
   const rawTokens = data.tokens || {};
-  // Normalize field names from API to what the dashboard expects
   const tokens = {
-    totalUsed: rawTokens.totalTokens || 0,
+    totalTokens: rawTokens.totalTokens || 0,
     totalCostUsd: rawTokens.totalCostUsd || 0,
-    totalSaved: rawTokens.savings?.total || 0,
-    cacheHitRate: rawTokens.cacheHitRate || 0,
     totalInputTokens: rawTokens.totalInputTokens || 0,
     totalOutputTokens: rawTokens.totalOutputTokens || 0,
     cacheReadTokens: rawTokens.cacheReadTokens || 0,
     cacheCreationTokens: rawTokens.cacheCreationTokens || 0,
+    cacheHitRate: rawTokens.cacheHitRate || 0,
     totalTurns: rawTokens.totalTurns || 0,
     agentCount: rawTokens.agentCount || 0,
     savings: rawTokens.savings || {},
-    perAgent: rawTokens.perAgent || [],
   };
-  const timeline = data.timeline || [];
-  const totalHypothetical = tokens.totalUsed + tokens.totalSaved;
-  const efficiency = totalHypothetical > 0 ? (tokens.totalSaved / totalHypothetical) * 100 : 0;
+
+  const totalHypothetical = tokens.totalTokens + (tokens.savings.total || 0);
+  const efficiency = totalHypothetical > 0 ? ((tokens.savings.total || 0) / totalHypothetical) * 100 : 0;
+  const ioRatio = tokens.totalOutputTokens > 0 ? (tokens.totalInputTokens / tokens.totalOutputTokens).toFixed(1) : '—';
+
+  const timeline = data.timeline || {};
+  const snapshots = timeline.snapshots || [];
+  const events = timeline.events || data.events || [];
+
+  // Build KPI definitions
+  const kpis = [
+    { label: 'Tokens Used',  value: fmtNum(tokens.totalTokens),        sparkData: kpiHistory.tokens,      color: HEX.accent },
+    { label: 'Total Cost',   value: fmtDollar(tokens.totalCostUsd),    sparkData: kpiHistory.cost,        color: HEX.warning },
+    { label: 'Tokens Saved', value: fmtNum(tokens.savings.total || 0), sparkData: kpiHistory.saved,       color: HEX.success },
+    { label: 'Efficiency',   value: fmtPct(efficiency),                sparkData: kpiHistory.efficiency,  color: HEX.purple },
+    { label: 'Cache Rate',   value: fmtPct(tokens.cacheHitRate * 100), sparkData: kpiHistory.cache,       color: HEX.info },
+    { label: 'I/O Ratio',    value: `${ioRatio}:1`,                    sparkData: kpiHistory.inputOutput, color: HEX.orange },
+    { label: 'Agents',       value: `${runningCount}/${agents.length}`, sparkData: kpiHistory.agents,      color: HEX.accent },
+    { label: 'Turns',        value: fmtNum(tokens.totalTurns),         sparkData: kpiHistory.turns,       color: HEX.text2 },
+  ];
 
   return (
     <div className="flex flex-col h-full">
@@ -96,46 +119,68 @@ export default function DashboardView() {
         totalCount={agents.length}
         uptime={data.uptime || 0}
         lastFetch={lastFetch}
+        activeTeam={data.activeTeam}
       />
 
       {/* KPI Strip */}
-      <div className="flex flex-shrink-0 border-b border-border">
-        <KpiCard label="Tokens Used" value={fmtNum(tokens.totalUsed)} sparkData={kpiHistory.tokens} color={HEX.accent} className="flex-1" />
-        <KpiCard label="Total Cost" value={fmtDollar(tokens.totalCostUsd)} sparkData={kpiHistory.cost} color={HEX.warning} className="flex-1 border-l border-border-subtle" />
-        <KpiCard label="Tokens Saved" value={fmtNum(tokens.totalSaved)} sparkData={kpiHistory.saved} color={HEX.success} className="flex-1 border-l border-border-subtle" />
-        <KpiCard label="Efficiency" value={fmtPct(efficiency)} sparkData={kpiHistory.efficiency} color={HEX.purple} className="flex-1 border-l border-border-subtle" />
-        <KpiCard label="Cache Rate" value={fmtPct(tokens.cacheHitRate)} sparkData={kpiHistory.cache} color={HEX.info} className="flex-1 border-l border-border-subtle" />
-      </div>
+      <KpiStrip kpis={kpis} />
 
       {/* Main grid */}
-      <div className="flex-1 flex min-h-0">
-        {/* Left: Token chart */}
-        <div ref={chartContainerRef} className="flex-[5] min-w-0 bg-surface-1 border-r border-border-subtle">
+      <div className="flex-1 min-h-0 grid" style={{
+        gridTemplateRows: 'minmax(0, 1fr) minmax(0, 1fr)',
+        gridTemplateColumns: '3fr 1.5fr 1.5fr',
+        background: '#1a1e25',
+        gap: '1px',
+      }}>
+        {/* R3C1: Token Flow Chart */}
+        <div ref={chartRef} className="min-w-0 min-h-0 bg-[#1e2127]">
           {chartSize.width > 0 && (
-            <TokenChart data={timeline.snapshots || timeline} width={chartSize.width} height={chartSize.height} />
+            <TokenChart data={snapshots} width={chartSize.width} height={chartSize.height} />
           )}
         </div>
 
-        {/* Center: Agent fleet */}
-        <div className="flex-[3] flex flex-col min-w-0 bg-surface-1 border-r border-border-subtle">
-          <div className="px-3 py-2 border-b border-border-subtle">
-            <span className="text-2xs font-semibold text-text-3 font-sans uppercase tracking-wider">Agent Fleet</span>
+        {/* R3C2: Cache Ring */}
+        <div className="min-w-0 min-h-0 bg-[#1e2127] flex flex-col">
+          <div className="px-3 pt-2 pb-1">
+            <span className="text-[8px] font-mono text-[#3a3f4b] uppercase tracking-widest">Cache Performance</span>
           </div>
-          <FleetPanel agents={agents} />
+          <CacheRing
+            cacheRead={tokens.cacheReadTokens}
+            cacheCreation={tokens.cacheCreationTokens}
+            totalInput={tokens.totalInputTokens}
+          />
         </div>
 
-        {/* Right: Savings */}
-        <div className="flex-[3] flex flex-col min-w-0 bg-surface-1">
-          <div className="px-3 py-2 border-b border-border-subtle">
-            <span className="text-2xs font-semibold text-text-3 font-sans uppercase tracking-wider">Savings</span>
+        {/* R3C3: Routing Chart */}
+        <div className="min-w-0 min-h-0 bg-[#1e2127] flex flex-col">
+          <div className="px-3 pt-2 pb-1">
+            <span className="text-[8px] font-mono text-[#3a3f4b] uppercase tracking-widest">Model Routing</span>
           </div>
-          <SavingsPanel data={tokens} rotation={data.rotation} routing={data.routing} adaptive={data.adaptive} />
+          <RoutingChart routing={routing} />
+        </div>
+
+        {/* R4C1: Agent Fleet */}
+        <div className="min-w-0 min-h-0 bg-[#1e2127] flex flex-col">
+          <div className="px-3 pt-2 pb-1 flex-shrink-0">
+            <span className="text-[8px] font-mono text-[#3a3f4b] uppercase tracking-widest">Agent Fleet</span>
+          </div>
+          <FleetPanel agentBreakdown={agentBreakdown} rotating={rotating} />
+        </div>
+
+        {/* R4C2-3: Intel Panel (spans 2 cols) */}
+        <div className="col-span-2 min-w-0 min-h-0 bg-[#1e2127] flex flex-col">
+          <IntelPanel
+            tokens={tokens}
+            rotation={rotation}
+            adaptive={adaptive}
+            journalist={journalist}
+          />
         </div>
       </div>
 
       {/* Activity feed */}
-      <div className="flex-shrink-0 border-t border-border bg-surface-1">
-        <ActivityFeed events={timeline.events || data.events || []} />
+      <div className="flex-shrink-0 bg-[#1e2127] border-t border-[#262a32]">
+        <ActivityFeed events={events} />
       </div>
     </div>
   );

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "groove-dev",
-  "version": "0.22.31",
+  "version": "0.24.0",
   "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/cli/src/setup.js

@@ -209,16 +209,14 @@ const PROVIDERS = [
 export async function runSetupWizard() {
   const version = getVersion();
 
-  const line = '──────────────────────────────────────';
-  const vPad = `    v${version}`;
   console.log('');
-  console.log(`  ┌${line}┐`);
-  console.log(`  │${' '.repeat(38)}│`);
-  console.log(`  │       ${chalk.bold.cyan('G R O O V E')}                │`);
-  console.log(`  │  Agent Orchestration Layer         │`);
-  console.log(`  │${' '.repeat(38)}│`);
-  console.log(`  │  ${chalk.dim(vPad)}${' '.repeat(Math.max(0, 34 - vPad.length))}│`);
-  console.log(`  └${line}┘`);
+  console.log('  ┌────────────────────────────────────────┐');
+  console.log('  │                                        │');
+  console.log('  │        ' + chalk.bold.cyan('G R O O V E') + '                     │');
+  console.log('  │   Agent Orchestration Layer            │');
+  console.log('  │                                        │');
+  console.log('  │   ' + chalk.dim(`v${version}`) + ' '.repeat(Math.max(1, 36 - version.length)) + '│');
+  console.log('  └────────────────────────────────────────┘');
   console.log('');
   console.log(chalk.dim('  First time? Let\'s get you set up in under a minute.'));
   console.log('');

package/packages/daemon/src/api.js

@@ -61,6 +61,11 @@ export function createApi(app, daemon) {
     try {
       const config = validateAgentConfig(req.body);
       config.teamId = req.body.teamId || daemon.teams.getDefault()?.id || null;
+      // Inherit team working directory if agent doesn't specify one
+      if (!config.workingDir) {
+        const team = daemon.teams.get(config.teamId);
+        if (team?.workingDir) config.workingDir = team.workingDir;
+      }
       const agent = await daemon.processes.spawn(config);
       daemon.audit.log('agent.spawn', { id: agent.id, role: agent.role, provider: agent.provider });
       res.status(201).json(agent);
@@ -257,8 +262,8 @@ export function createApi(app, daemon) {
 
   app.post('/api/teams', (req, res) => {
     try {
-      const team = daemon.teams.create(req.body.name);
-      daemon.audit.log('team.create', { id: team.id, name: team.name });
+      const team = daemon.teams.create(req.body.name, req.body.workingDir);
+      daemon.audit.log('team.create', { id: team.id, name: team.name, workingDir: team.workingDir });
       res.status(201).json(team);
     } catch (err) {
       res.status(400).json({ error: err.message });
@@ -267,8 +272,10 @@ export function createApi(app, daemon) {
 
   app.patch('/api/teams/:id', (req, res) => {
     try {
-      const team = daemon.teams.rename(req.params.id, req.body.name);
-      daemon.audit.log('team.rename', { id: team.id, name: team.name });
+      if (req.body.name) daemon.teams.rename(req.params.id, req.body.name);
+      if (req.body.workingDir !== undefined) daemon.teams.setWorkingDir(req.params.id, req.body.workingDir);
+      const team = daemon.teams.get(req.params.id);
+      daemon.audit.log('team.update', { id: team.id, name: team.name, workingDir: team.workingDir });
       res.json(team);
     } catch (err) {
       res.status(400).json({ error: err.message });
@@ -384,6 +391,82 @@ export function createApi(app, daemon) {
     }
   });
 
+  // List MD files for an agent (from its working directory + .groove)
+  app.get('/api/agents/:id/mdfiles', (req, res) => {
+    const agent = daemon.registry.get(req.params.id);
+    if (!agent) return res.status(404).json({ error: 'Agent not found' });
+
+    const dir = agent.workingDir || daemon.projectDir;
+    const files = [];
+
+    // Scan working directory for .md files (top level + .groove/)
+    try {
+      for (const entry of readdirSync(dir)) {
+        if (entry.endsWith('.md') && !entry.startsWith('.')) {
+          const fullPath = resolve(dir, entry);
+          if (statSync(fullPath).isFile()) {
+            files.push({ name: entry, path: entry, size: statSync(fullPath).size });
+          }
+        }
+      }
+      const grooveDir = resolve(dir, '.groove');
+      if (existsSync(grooveDir)) {
+        for (const entry of readdirSync(grooveDir)) {
+          if (entry.endsWith('.md')) {
+            const fullPath = resolve(grooveDir, entry);
+            if (statSync(fullPath).isFile()) {
+              files.push({ name: entry, path: `.groove/${entry}`, size: statSync(fullPath).size });
+            }
+          }
+        }
+      }
+    } catch { /* dir might not exist */ }
+
+    res.json({ files, workingDir: dir });
+  });
+
+  // Read a specific MD file for an agent
+  app.get('/api/agents/:id/mdfiles/read', (req, res) => {
+    const agent = daemon.registry.get(req.params.id);
+    if (!agent) return res.status(404).json({ error: 'Agent not found' });
+
+    const dir = agent.workingDir || daemon.projectDir;
+    const relPath = req.query.path;
+    if (!relPath || relPath.includes('..')) return res.status(400).json({ error: 'Invalid path' });
+
+    const fullPath = resolve(dir, relPath);
+    if (!fullPath.startsWith(dir)) return res.status(400).json({ error: 'Path traversal' });
+
+    try {
+      const content = readFileSync(fullPath, 'utf8');
+      res.json({ path: relPath, content });
+    } catch {
+      res.status(404).json({ error: 'File not found' });
+    }
+  });
+
+  // Save a MD file for an agent
+  app.put('/api/agents/:id/mdfiles/write', (req, res) => {
+    const agent = daemon.registry.get(req.params.id);
+    if (!agent) return res.status(404).json({ error: 'Agent not found' });
+
+    const dir = agent.workingDir || daemon.projectDir;
+    const { path: relPath, content } = req.body;
+    if (!relPath || relPath.includes('..')) return res.status(400).json({ error: 'Invalid path' });
+    if (typeof content !== 'string') return res.status(400).json({ error: 'Content required' });
+
+    const fullPath = resolve(dir, relPath);
+    if (!fullPath.startsWith(dir)) return res.status(400).json({ error: 'Path traversal' });
+
+    try {
+      writeFileSync(fullPath, content, 'utf8');
+      daemon.audit.log('mdfile.write', { agentId: agent.id, path: relPath });
+      res.json({ ok: true });
+    } catch (err) {
+      res.status(500).json({ error: err.message });
+    }
+  });
+
   // Rotation stats
   app.get('/api/rotation', (req, res) => {
     res.json({

package/packages/daemon/src/process.js

@@ -436,6 +436,7 @@ For normal file edits within your scope, proceed without review.
         for (const config of group.agents) {
           try {
             const validated = validateAgentConfig(config);
+            if (!validated.teamId) validated.teamId = this.daemon.teams.getDefault()?.id || null;
             this.spawn(validated).then((agent) => {
               this.daemon.broadcast({
                 type: 'phase2:spawned',

package/packages/daemon/src/teams.js

@@ -1,11 +1,15 @@
 // GROOVE — Teams (Live Agent Groups)
 // FSL-1.1-Apache-2.0 — see LICENSE
 
-import { readFileSync, writeFileSync, existsSync } from 'fs';
+import { readFileSync, writeFileSync, existsSync, mkdirSync, renameSync, rmSync } from 'fs';
 import { resolve } from 'path';
 import { randomUUID } from 'crypto';
 import { validateTeamName } from './validate.js';
 
+function slugify(name) {
+  return name.toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-|-$/g, '').slice(0, 64) || 'team';
+}
+
 export class Teams {
   constructor(daemon) {
     this.daemon = daemon;
@@ -34,15 +38,33 @@ export class Teams {
     if (!hasDefault) {
       const id = randomUUID().slice(0, 8);
       const team = { id, name: 'Default', isDefault: true, createdAt: new Date().toISOString() };
+      // Default team uses the project directory (no subdirectory)
+      team.workingDir = this.daemon.projectDir;
       this.teams.set(id, team);
       this._save();
     }
   }
 
+  /**
+   * Create a team with an auto-managed working directory.
+   */
   create(name) {
     validateTeamName(name);
     const id = randomUUID().slice(0, 8);
-    const team = { id, name, isDefault: false, createdAt: new Date().toISOString() };
+    const dirName = slugify(name);
+    const workingDir = resolve(this.daemon.projectDir, dirName);
+
+    // Create the directory
+    mkdirSync(workingDir, { recursive: true });
+
+    const team = {
+      id,
+      name,
+      isDefault: false,
+      workingDir,
+      createdAt: new Date().toISOString(),
+    };
+
     this.teams.set(id, team);
     this._save();
     this.daemon.broadcast({ type: 'team:created', team });
@@ -61,30 +83,80 @@ export class Teams {
     return [...this.teams.values()].find((t) => t.isDefault) || null;
   }
 
+  /**
+   * Rename a team — updates the directory name and all agent references.
+   */
   rename(id, name) {
     validateTeamName(name);
     const team = this.teams.get(id);
     if (!team) throw new Error('Team not found');
+
+    const oldName = team.name;
     team.name = name;
+
+    // Rename the directory if it was auto-managed (under projectDir)
+    if (team.workingDir && !team.isDefault) {
+      const newDirName = slugify(name);
+      const newWorkingDir = resolve(this.daemon.projectDir, newDirName);
+      const oldWorkingDir = team.workingDir;
+
+      if (oldWorkingDir !== newWorkingDir && existsSync(oldWorkingDir)) {
+        try {
+          renameSync(oldWorkingDir, newWorkingDir);
+          team.workingDir = newWorkingDir;
+
+          // Update all agents in this team with the new working directory
+          const agents = this.daemon.registry.getAll().filter((a) => a.teamId === id);
+          for (const agent of agents) {
+            if (agent.workingDir === oldWorkingDir) {
+              this.daemon.registry.update(agent.id, { workingDir: newWorkingDir });
+            }
+          }
+        } catch (err) {
+          console.log(`[Groove:Teams] Failed to rename directory: ${err.message}`);
+          // Keep old dir — name still updates
+        }
+      }
+    }
+
     this._save();
     this.daemon.broadcast({ type: 'team:updated', team });
     return team;
   }
 
+  /**
+   * Delete a team — removes directory and all contents, moves agents to default.
+   */
   delete(id) {
     const team = this.teams.get(id);
     if (!team) throw new Error('Team not found');
     if (team.isDefault) throw new Error('Cannot delete the default team');
 
-    const defaultTeam = this.getDefault();
+    // Kill any running agents in this team
     const agents = this.daemon.registry.getAll().filter((a) => a.teamId === id);
     for (const agent of agents) {
-      this.daemon.registry.update(agent.id, { teamId: defaultTeam.id });
+      if (agent.status === 'running' || agent.status === 'starting') {
+        try { this.daemon.processes.kill(agent.id); } catch { /* ignore */ }
+      }
+    }
+
+    // Remove agents from registry
+    for (const agent of agents) {
+      this.daemon.registry.remove(agent.id);
+    }
+
+    // Remove the working directory
+    if (team.workingDir && !team.isDefault && existsSync(team.workingDir)) {
+      try {
+        rmSync(team.workingDir, { recursive: true, force: true });
+      } catch (err) {
+        console.log(`[Groove:Teams] Failed to remove directory: ${err.message}`);
+      }
     }
 
     this.teams.delete(id);
     this._save();
-    this.daemon.broadcast({ type: 'team:deleted', teamId: id, movedTo: defaultTeam.id });
+    this.daemon.broadcast({ type: 'team:deleted', teamId: id });
     return true;
   }
 

package/packages/daemon/src/validate.js

@@ -84,6 +84,7 @@ export function validateAgentConfig(config) {
     provider: config.provider || 'claude-code',
     model: typeof config.model === 'string' ? config.model : null,
     workingDir: typeof config.workingDir === 'string' ? config.workingDir : undefined,
+    teamId: config.teamId || undefined,
     permission,
     skills,
     integrations,