npm - groove-dev - Versions diffs - 0.26.39 → 0.27.0 - Mend

groove-dev 0.26.39 → 0.27.0

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 (914) hide show

package/packages/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-DmKZLrXU.js"></script>
+    <script type="module" crossorigin src="/assets/index-eCrVowF0.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-BkY43sei.css">
+    <link rel="stylesheet" crossorigin href="/assets/index-DjORRpF0.css">
   </head>
   <body>
     <div id="root"></div>

package/packages/gui/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@groove-dev/gui",
-  "version": "0.22.27",
+  "version": "0.27.0",
   "description": "GROOVE GUI — visual agent control plane",
   "license": "FSL-1.1-Apache-2.0",
   "type": "module",
@@ -27,11 +27,8 @@
     "@fontsource-variable/jetbrains-mono": "^5.2.8",
     "@radix-ui/react-context-menu": "^2.2.16",
     "@radix-ui/react-dialog": "^1.1.15",
-    "@radix-ui/react-dropdown-menu": "^2.1.16",
-    "@radix-ui/react-popover": "^1.1.15",
     "@radix-ui/react-scroll-area": "^1.2.10",
     "@radix-ui/react-select": "^2.2.6",
-    "@radix-ui/react-separator": "^1.1.8",
     "@radix-ui/react-tabs": "^1.1.13",
     "@radix-ui/react-tooltip": "^1.2.8",
     "@tailwindcss/vite": "^4.2.2",

package/packages/gui/src/components/agents/spawn-wizard.jsx CHANGED Viewed

@@ -32,6 +32,24 @@ const INTEGRATION_LOGOS = {
   linear:      'https://cdn.simpleicons.org/linear/5E6AD2',
   'brave-search': 'https://cdn.simpleicons.org/brave/FB542B',
   'home-assistant': 'https://cdn.simpleicons.org/homeassistant/18BCF2',
+  sentry:      'https://cdn.simpleicons.org/sentry/362D59',
+  elevenlabs:  'https://cdn.simpleicons.org/elevenlabs/white',
+  hubspot:     'https://cdn.simpleicons.org/hubspot/FF7A59',
+  jira:        'https://cdn.simpleicons.org/jira/0052CC',
+  sendgrid:    'https://cdn.simpleicons.org/sendgrid/1A82E2',
+  resend:      'https://cdn.simpleicons.org/resend/white',
+  replicate:   'https://cdn.simpleicons.org/replicate/white',
+  vercel:      'https://cdn.simpleicons.org/vercel/white',
+  supabase:    'https://cdn.simpleicons.org/supabase/3FCF8E',
+  mixpanel:    'https://cdn.simpleicons.org/mixpanel/7856FF',
+  datadog:     'https://cdn.simpleicons.org/datadog/632CA6',
+  airtable:    'https://cdn.simpleicons.org/airtable/18BFFF',
+  zendesk:     'https://cdn.simpleicons.org/zendesk/03363D',
+  intercom:    'https://cdn.simpleicons.org/intercom/6AFDEF',
+  twilio:      'https://cdn.simpleicons.org/twilio/F22F46',
+  telnyx:      'https://cdn.simpleicons.org/telnyx/00C08B',
+  aws:         'https://cdn.simpleicons.org/amazonaws/FF9900',
+  plaid:       'https://cdn.simpleicons.org/plaid/white',
 };
 const ROLE_PRESETS = [

package/packages/gui/src/components/dashboard/cache-ring.jsx CHANGED Viewed

@@ -5,8 +5,12 @@ import { fmtNum } from '../../lib/format';
 const CacheRing = memo(function CacheRing({ cacheRead = 0, cacheCreation = 0, totalInput = 0, size = 140 }) {
   const canvasRef = useRef(null);
-  const total = cacheRead + cacheCreation + totalInput;
-  const hitRate = total > 0 ? (cacheRead / total) * 100 : 0;
+  // Cache hit rate denominator is only cacheable tokens (reads + creation).
+  // Fresh inputTokens are conversation turns that were never cache-eligible;
+  // including them falsely depresses the rate.
+  const cacheable = cacheRead + cacheCreation;
+  const total = cacheable; // used only by arc-fill and hit-rate
+  const hitRate = cacheable > 0 ? (cacheRead / cacheable) * 100 : 0;
   useEffect(() => {
     const canvas = canvasRef.current;

package/packages/gui/src/components/dashboard/intel-panel.jsx CHANGED Viewed

@@ -5,7 +5,7 @@ import { fmtNum, fmtPct, fmtDollar, timeAgo } from '../../lib/format';
 import { cn } from '../../lib/cn';
 import { HEX } from '../../lib/theme-hex';
 import { roleColor } from '../../lib/status';
-import { Activity, Brain, Radio, AlertTriangle, CheckCircle, RotateCw, HelpCircle } from 'lucide-react';
+import { Activity, Brain, Radio, AlertTriangle, CheckCircle, RotateCw, HelpCircle, BookOpen } from 'lucide-react';
 import { Tooltip } from '../ui/tooltip';
 /* ── Tiny SVG sparkline for inline use ──────────────────────── */
@@ -204,17 +204,70 @@ function HealthTab({ tokens, rotation, agentBreakdown }) {
         </div>
       )}
+      {/* Internal Overhead (GROOVE's own cost to coordinate) */}
+      {tokens?.internalOverhead?.tokens > 0 && (
+        <div>
+          <div className="flex items-center justify-between mb-2">
+            <span className="text-2xs font-mono text-text-3 uppercase tracking-wider flex items-center">
+              GROOVE Overhead
+              <InfoTip text="Tokens consumed by GROOVE's own coordination: the Journalist (synthesis), PM (approval gates), Planner, Task Negotiator, Gateway, and user Q&A. Previously invisible — now tracked for honest ROI." />
+            </span>
+            <div className="flex items-center gap-2">
+              <span className="text-2xs font-mono text-text-2 tabular-nums">
+                {fmtNum(tokens.internalOverhead.tokens)} tokens
+              </span>
+              <span className="text-2xs font-mono text-text-3 tabular-nums">
+                {fmtDollar(tokens.internalOverhead.costUsd || 0)}
+              </span>
+              {tokens.totalTokens > 0 && (
+                <span className="text-2xs font-mono font-semibold tabular-nums" style={{ color: HEX.purple }}>
+                  {Math.round((tokens.internalOverhead.tokens / tokens.totalTokens) * 100)}%
+                </span>
+              )}
+            </div>
+          </div>
+          <div className="grid grid-cols-3 gap-1.5">
+            {Object.entries(tokens.internalOverhead.components || {})
+              .sort((a, b) => (b[1].tokens || 0) - (a[1].tokens || 0))
+              .slice(0, 6)
+              .map(([id, comp]) => {
+                const label = id.replace(/^__|__$/g, '').replace(/_/g, ' ');
+                return (
+                  <div key={id} className="bg-surface-0 rounded px-2 py-1.5">
+                    <div className="text-2xs font-mono text-text-3 uppercase tracking-wider truncate">{label}</div>
+                    <div className="text-xs font-mono text-text-1 tabular-nums font-semibold">
+                      {fmtNum(comp.tokens || 0)}
+                    </div>
+                  </div>
+                );
+              })}
+          </div>
+        </div>
+      )}
       {/* Coordination savings */}
       {(tokens?.savings?.total || 0) > 0 && (
         <div>
           <div className="flex items-center justify-between mb-2">
-            <span className="text-2xs font-mono text-text-3 uppercase tracking-wider">Coordination Savings</span>
+            <span className="text-2xs font-mono text-text-3 uppercase tracking-wider flex items-center">
+              Coordination Savings
+              <InfoTip text="Tokens saved vs. uncoordinated agents. Rotation savings are estimated from context degradation (pre/post velocity measurement underway). Conflict prevention and cold-start skip use fixed-overhead models. Compare against GROOVE Overhead above for honest ROI." />
+            </span>
             <span className="text-2xs font-mono text-text-2 tabular-nums">{fmtNum(tokens.savings.total)} tokens</span>
           </div>
           <div className="space-y-2">
-            <ProgressBar label="Cold-start skip" value={tokens.savings.fromColdStartSkip || 0} total={tokens.savings.total || 1} color={HEX.info} />
-            <ProgressBar label="Rotation" value={tokens.savings.fromRotation || 0} total={tokens.savings.total || 1} color={HEX.accent} />
-            <ProgressBar label="Conflict prevention" value={tokens.savings.fromConflictPrevention || 0} total={tokens.savings.total || 1} color="#4ec9d4" />
+            <div className="space-y-1">
+              <ProgressBar label="Cold-start skip" value={tokens.savings.fromColdStartSkip || 0} total={tokens.savings.total || 1} color={HEX.info} />
+              <div className="text-2xs font-mono text-text-4 pl-2">estimated · {(tokens?.savings?.fromColdStartSkip || 0) > 0 ? 'fixed overhead per skip' : ''}</div>
+            </div>
+            <div className="space-y-1">
+              <ProgressBar label="Rotation" value={tokens.savings.fromRotation || 0} total={tokens.savings.total || 1} color={HEX.accent} />
+              <div className="text-2xs font-mono text-text-4 pl-2">estimated · velocity measurement accumulating</div>
+            </div>
+            <div className="space-y-1">
+              <ProgressBar label="Conflict prevention" value={tokens.savings.fromConflictPrevention || 0} total={tokens.savings.total || 1} color="#4ec9d4" />
+              <div className="text-2xs font-mono text-text-4 pl-2">estimated · fixed overhead per conflict</div>
+            </div>
           </div>
         </div>
       )}
@@ -227,7 +280,13 @@ function HealthTab({ tokens, rotation, agentBreakdown }) {
             {recentHistory.map((r, i) => {
               const isQuality = r.reason === 'quality_degradation';
               const isNatural = r.reason === 'natural_compaction';
-              const dotColor = isQuality ? '#e5c07b' : isNatural ? '#c678dd' : '#33afbc';
+              const isTokenLimit = r.reason === 'token_limit_exceeded';
+              const isVelocity = r.reason === 'runaway_velocity';
+              const dotColor = isTokenLimit ? '#e06c75'
+                : isVelocity ? '#ff8c42'
+                : isQuality ? '#e5c07b'
+                : isNatural ? '#c678dd'
+                : '#33afbc';
               return (
                 <div key={i} className="flex items-start gap-2.5">
                   <div className="flex flex-col items-center flex-shrink-0">
@@ -249,7 +308,25 @@ function HealthTab({ tokens, rotation, agentBreakdown }) {
                       <span className="text-xs font-mono text-text-1 font-medium capitalize truncate flex-1">
                         {r.agentName || r.role}
                       </span>
-                      {isQuality ? (
+                      {isTokenLimit ? (
+                        <span className="text-2xs font-mono font-semibold tabular-nums flex-shrink-0" style={{ color: '#e06c75' }}
+                          title={`Auto-rotated: agent burned ${r.instanceTokens?.toLocaleString()} tokens in one session`}>
+                          T:{fmtPct(((r.instanceTokens || 0) / 1_000_000) * 100).replace('%', 'M')}
+                        </span>
+                      ) : isVelocity ? (
+                        <span className="flex items-center gap-1 flex-shrink-0">
+                          <span className="text-2xs font-mono font-semibold tabular-nums" style={{ color: '#ff8c42' }}
+                            title={`Auto-rotated: runaway velocity (${r.velocity?.toLocaleString()} tokens in recent window)`}>
+                            V:{fmtPct(((r.velocity || 0) / 1_000_000) * 100).replace('%', 'M')}
+                          </span>
+                          {r.velocityDelta != null && r.velocityDelta > 0 && (
+                            <span className="text-2xs font-mono tabular-nums" style={{ color: '#4ae168' }}
+                              title={`Post-rotation velocity dropped by ${r.velocityDelta.toLocaleString()} tokens — rotation worked`}>
+                              ↓{fmtPct((r.velocityDelta / 1_000_000) * 100).replace('%', 'M')}
+                            </span>
+                          )}
+                        </span>
+                      ) : isQuality ? (
                         <span className="text-2xs font-mono font-semibold tabular-nums flex-shrink-0" style={{ color: '#e5c07b' }}>
                           Q:{r.qualityScore}
                         </span>
@@ -462,8 +539,165 @@ function JournalistTab({ journalist }) {
   );
 }
+/* ── Memory Tab (Layer 7) ───────────────────────────────────── */
+function MemoryTab({ memory }) {
+  const constraints = memory?.constraints || [];
+  const discoveries = memory?.discoveries || [];
+  const roles = memory?.roles || [];
+  const perAgent = memory?.specializations?.perAgent || {};
+  const perRole = memory?.specializations?.perProjectRole || {};
+  const agentCount = Object.keys(perAgent).length;
+  const roleCount = Object.keys(perRole).length;
+  const totalItems = constraints.length + discoveries.length + roles.length;
+  if (totalItems === 0 && agentCount === 0) {
+    return (
+      <div className="p-6 text-center text-xs font-mono text-text-3">
+        <BookOpen size={24} className="mx-auto mb-2 text-text-4" />
+        <div>No memory accumulated yet</div>
+        <div className="text-2xs text-text-4 mt-1">Constraints, handoff chains, and discoveries populate as agents work</div>
+      </div>
+    );
+  }
+  return (
+    <div className="p-3 space-y-4">
+      {/* Hero stats */}
+      <div className="grid grid-cols-4 gap-2">
+        <div className="bg-surface-0 rounded p-2.5">
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-1 flex items-center">
+            Constraints
+            <InfoTip text="Project rules discovered by agents or set by the user. Every new agent reads these on spawn to avoid rediscovering them." />
+          </div>
+          <div className="text-2xl font-mono font-bold tabular-nums leading-none" style={{ color: HEX.accent }}>
+            {constraints.length}
+          </div>
+        </div>
+        <div className="bg-surface-0 rounded p-2.5">
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-1 flex items-center">
+            Discoveries
+            <InfoTip text="Error→fix pairs successful agents have recorded. Injected into future agent context so they don't rediscover known solutions." />
+          </div>
+          <div className="text-2xl font-mono font-bold tabular-nums leading-none" style={{ color: HEX.success }}>
+            {discoveries.length}
+          </div>
+        </div>
+        <div className="bg-surface-0 rounded p-2.5">
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-1 flex items-center">
+            Handoff Chains
+            <InfoTip text="Cumulative rotation briefs per role. Agent #50 knows what agent #1 struggled with. Each role keeps its last 10 rotation briefs." />
+          </div>
+          <div className="text-2xl font-mono font-bold tabular-nums leading-none" style={{ color: HEX.purple }}>
+            {roles.length}
+          </div>
+        </div>
+        <div className="bg-surface-0 rounded p-2.5">
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-1 flex items-center">
+            Specializations
+            <InfoTip text="Per-agent quality profiles: session counts, average quality, file touches, preferred thresholds." />
+          </div>
+          <div className="text-2xl font-mono font-bold tabular-nums leading-none" style={{ color: HEX.info }}>
+            {agentCount}
+          </div>
+          {roleCount > 0 && (
+            <div className="text-2xs font-mono text-text-4 mt-0.5">across {roleCount} roles</div>
+          )}
+        </div>
+      </div>
+      {/* Constraints list */}
+      {constraints.length > 0 && (
+        <div>
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-2">Project Constraints</div>
+          <div className="space-y-1">
+            {constraints.slice(0, 10).map((c) => (
+              <div key={c.hash} className="flex items-start gap-2 bg-surface-0 rounded px-2 py-1.5">
+                <span className="text-2xs font-mono px-1.5 py-px rounded-sm bg-surface-4 text-text-3 uppercase tracking-wider flex-shrink-0 mt-0.5">
+                  {c.category}
+                </span>
+                <span className="text-xs font-mono text-text-2 leading-relaxed flex-1">{c.text}</span>
+              </div>
+            ))}
+            {constraints.length > 10 && (
+              <div className="text-2xs font-mono text-text-4 px-2">+{constraints.length - 10} more</div>
+            )}
+          </div>
+        </div>
+      )}
+      {/* Recent discoveries */}
+      {discoveries.length > 0 && (
+        <div>
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-2">Recent Discoveries</div>
+          <div className="space-y-1.5">
+            {discoveries.slice(0, 8).map((d, i) => {
+              const rc = roleColor(d.role);
+              return (
+                <div key={i} className="bg-surface-0 rounded px-2 py-1.5 space-y-1">
+                  <div className="flex items-center gap-2">
+                    <span className="text-2xs font-mono font-semibold capitalize px-1.5 py-px rounded-sm" style={{ background: rc.bg, color: rc.text }}>
+                      {d.role}
+                    </span>
+                    <span className="text-2xs font-mono text-text-4 flex-1">{timeAgo(d.ts)}</span>
+                  </div>
+                  <div className="text-xs font-mono text-text-2 leading-relaxed">
+                    <span className="text-text-4">When:</span> <span className="text-text-1">{d.trigger}</span>
+                  </div>
+                  <div className="text-xs font-mono text-text-2 leading-relaxed">
+                    <span className="text-text-4">Fix:</span> <span style={{ color: HEX.success }}>{d.fix}</span>
+                  </div>
+                </div>
+              );
+            })}
+          </div>
+        </div>
+      )}
+      {/* Handoff chain roles */}
+      {roles.length > 0 && (
+        <div>
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-2">Active Role Chains</div>
+          <div className="flex flex-wrap gap-1.5">
+            {roles.map((role) => {
+              const rc = roleColor(role);
+              return (
+                <span key={role} className="text-2xs font-mono font-semibold capitalize px-2 py-1 rounded" style={{ background: rc.bg, color: rc.text }}>
+                  {role}
+                </span>
+              );
+            })}
+          </div>
+        </div>
+      )}
+      {/* Per-role specialization summary */}
+      {roleCount > 0 && (
+        <div>
+          <div className="text-2xs font-mono text-text-3 uppercase tracking-wider mb-2">Role Quality Profiles</div>
+          <div className="space-y-1">
+            {Object.entries(perRole).map(([role, data]) => {
+              const rc = roleColor(role);
+              return (
+                <div key={role} className="flex items-center gap-2 bg-surface-0 rounded px-2 py-1.5">
+                  <span className="text-2xs font-mono font-semibold capitalize px-1.5 py-px rounded-sm" style={{ background: rc.bg, color: rc.text }}>
+                    {role}
+                  </span>
+                  <span className="text-xs font-mono text-text-3 flex-1">{data.sessionCount} sessions</span>
+                  <span className="text-xs font-mono font-semibold tabular-nums" style={{ color: qualityColor(data.avgQualityScore) }}>
+                    Q:{data.avgQualityScore}
+                  </span>
+                </div>
+              );
+            })}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
 /* ── Intel Panel (main export) ──────────────────────────────── */
-const IntelPanel = memo(function IntelPanel({ tokens, rotation, adaptive, journalist, agentBreakdown }) {
+const IntelPanel = memo(function IntelPanel({ tokens, rotation, adaptive, journalist, agentBreakdown, memory }) {
   return (
     <Tabs defaultValue="health" className="flex flex-col h-full">
       <TabsList className="flex-shrink-0 px-1">
@@ -471,6 +705,10 @@ const IntelPanel = memo(function IntelPanel({ tokens, rotation, adaptive, journa
           <Activity size={11} />
           Health
         </TabsTrigger>
+        <TabsTrigger value="memory" className="text-xs px-2.5 py-1.5 inline-flex items-center gap-1.5">
+          <BookOpen size={11} />
+          Memory
+        </TabsTrigger>
         <TabsTrigger value="adaptive" className="text-xs px-2.5 py-1.5 inline-flex items-center gap-1.5">
           <Brain size={11} />
           Adaptive
@@ -486,6 +724,11 @@ const IntelPanel = memo(function IntelPanel({ tokens, rotation, adaptive, journa
           <HealthTab tokens={tokens} rotation={rotation} agentBreakdown={agentBreakdown} />
         </div>
       </TabsContent>
+      <TabsContent value="memory" className="flex-1 min-h-0 relative">
+        <div className="absolute inset-0 overflow-y-auto">
+          <MemoryTab memory={memory} />
+        </div>
+      </TabsContent>
       <TabsContent value="adaptive" className="flex-1 min-h-0 relative">
         <div className="absolute inset-0 overflow-y-auto">
           <AdaptiveTab adaptive={adaptive} />

package/packages/gui/src/components/dashboard/team-burn-panel.jsx ADDED Viewed

@@ -0,0 +1,55 @@
+// FSL-1.1-Apache-2.0 — see LICENSE
+import { memo } from 'react';
+import { fmtNum, fmtDollar } from '../../lib/format';
+import { HEX } from '../../lib/theme-hex';
+import { ScrollArea } from '../ui/scroll-area';
+export const TeamBurnPanel = memo(function TeamBurnPanel({ teams = [] }) {
+  const totalTokens = teams.reduce((s, t) => s + (t.totalTokens || 0), 0);
+  const maxTokens = teams.reduce((m, t) => Math.max(m, t.totalTokens || 0), 0);
+  return (
+    <div className="flex flex-col h-full">
+      <div className="px-3 pt-2.5 pb-1 flex-shrink-0 flex items-center justify-between">
+        <span className="text-2xs font-mono text-text-3 uppercase tracking-widest">Team Burn</span>
+        <span className="text-2xs font-mono text-text-3">{fmtNum(totalTokens)} total</span>
+      </div>
+      <ScrollArea className="flex-1 min-h-0">
+        {teams.length === 0 ? (
+          <div className="px-3 py-6 text-center text-xs text-text-3 font-mono">No team activity yet</div>
+        ) : (
+          <div className="px-3 pb-2 space-y-1.5">
+            {teams.map((t) => {
+              const pct = maxTokens > 0 ? (t.totalTokens / maxTokens) * 100 : 0;
+              return (
+                <div key={t.teamId} className="space-y-1">
+                  <div className="flex items-center justify-between gap-2 min-w-0">
+                    <div className="flex items-center gap-1.5 min-w-0">
+                      <span className="text-xs font-semibold text-text-0 font-sans truncate">{t.teamName}</span>
+                      {t.isDefault && (
+                        <span className="text-[9px] font-mono text-text-3 uppercase tracking-wider">default</span>
+                      )}
+                      <span className="text-2xs font-mono text-text-3 flex-shrink-0">
+                        {t.agentCount} {t.agentCount === 1 ? 'agent' : 'agents'}
+                      </span>
+                    </div>
+                    <div className="flex items-center gap-2 flex-shrink-0 font-mono text-2xs">
+                      <span className="text-text-1">{fmtNum(t.totalTokens)}</span>
+                      <span className="text-text-3">{fmtDollar(t.totalCostUsd)}</span>
+                    </div>
+                  </div>
+                  <div className="h-0.5 bg-surface-2 rounded-sm overflow-hidden">
+                    <div
+                      className="h-full rounded-sm transition-all"
+                      style={{ width: `${pct}%`, background: HEX.accent }}
+                    />
+                  </div>
+                </div>
+              );
+            })}
+          </div>
+        )}
+      </ScrollArea>
+    </div>
+  );
+});

package/packages/gui/src/components/marketplace/marketplace-card.jsx CHANGED Viewed

@@ -5,7 +5,7 @@ import { Badge } from '../ui/badge';
 import { fmtNum } from '../../lib/format';
 // Well-known integration logos via CDN (simple-icons on cdn.simpleicons.org)
-const INTEGRATION_LOGOS = {
+export const INTEGRATION_LOGOS = {
   'google-workspace': 'https://cdn.simpleicons.org/google/white',
   github:      'https://cdn.simpleicons.org/github/white',
   stripe:      'https://cdn.simpleicons.org/stripe/635BFF',
@@ -21,6 +21,24 @@ const INTEGRATION_LOGOS = {
   linear:      'https://cdn.simpleicons.org/linear/5E6AD2',
   'brave-search': 'https://cdn.simpleicons.org/brave/FB542B',
   'home-assistant': 'https://cdn.simpleicons.org/homeassistant/18BCF2',
+  sentry:      'https://cdn.simpleicons.org/sentry/362D59',
+  elevenlabs:  'https://cdn.simpleicons.org/elevenlabs/white',
+  hubspot:     'https://cdn.simpleicons.org/hubspot/FF7A59',
+  jira:        'https://cdn.simpleicons.org/jira/0052CC',
+  sendgrid:    'https://cdn.simpleicons.org/sendgrid/1A82E2',
+  resend:      'https://cdn.simpleicons.org/resend/white',
+  replicate:   'https://cdn.simpleicons.org/replicate/white',
+  vercel:      'https://cdn.simpleicons.org/vercel/white',
+  supabase:    'https://cdn.simpleicons.org/supabase/3FCF8E',
+  mixpanel:    'https://cdn.simpleicons.org/mixpanel/7856FF',
+  datadog:     'https://cdn.simpleicons.org/datadog/632CA6',
+  airtable:    'https://cdn.simpleicons.org/airtable/18BFFF',
+  zendesk:     'https://cdn.simpleicons.org/zendesk/03363D',
+  intercom:    'https://cdn.simpleicons.org/intercom/6AFDEF',
+  twilio:      'https://cdn.simpleicons.org/twilio/F22F46',
+  telnyx:      'https://cdn.simpleicons.org/telnyx/00C08B',
+  aws:         'https://cdn.simpleicons.org/amazonaws/FF9900',
+  plaid:       'https://cdn.simpleicons.org/plaid/white',
 };
 function ItemIcon({ item, size = 40 }) {
@@ -64,7 +82,7 @@ function ItemIcon({ item, size = 40 }) {
   );
 }
-export function MarketplaceCard({ item, onClick, className }) {
+export function MarketplaceCard({ item, onClick, className, statusBadge }) {
   const installed = item.installed;
   return (
@@ -109,11 +127,11 @@ export function MarketplaceCard({ item, onClick, className }) {
           </span>
         )}
         <span className="flex-1" />
-        {installed && (
+        {statusBadge || (installed && (
           <Badge variant="accent" className="text-2xs">
             {item._installedCount ? `${item._installedCount} active` : 'Installed'}
           </Badge>
-        )}
+        ))}
       </div>
     </button>
   );

package/packages/gui/src/lib/format.js CHANGED Viewed

@@ -42,9 +42,3 @@ export function timeAgo(ts) {
   if (diff < 86400) return `${Math.floor(diff / 3600)}h ago`;
   return `${Math.floor(diff / 86400)}d ago`;
 }
-export function formatDuration(ms) {
-  if (!ms) return '0s';
-  const s = Math.floor(ms / 1000);
-  return fmtUptime(s);
-}

package/packages/gui/src/lib/hooks/use-dashboard.js CHANGED Viewed

@@ -8,6 +8,8 @@ export function useDashboard() {
   const agents = useGrooveStore((s) => s.agents);
   const [data, setData] = useState(null);
+  const [teamBurn, setTeamBurn] = useState([]);
+  const [memory, setMemory] = useState({ constraints: [], discoveries: [], roles: [], specializations: null });
   const [loading, setLoading] = useState(true);
   const [kpiHistory, setKpiHistory] = useState({
     tokens: [], cost: [], saved: [], efficiency: [],
@@ -21,9 +23,23 @@ export function useDashboard() {
     async function fetch() {
       try {
-        const d = await api.get('/dashboard');
+        const [d, teams, constraints, discoveries, chainRoles, specs] = await Promise.all([
+          api.get('/dashboard'),
+          api.get('/tokens/by-team').catch(() => ({ teams: [] })),
+          api.get('/memory/constraints').catch(() => ({ constraints: [] })),
+          api.get('/memory/discoveries?limit=20').catch(() => ({ discoveries: [] })),
+          api.get('/memory/handoff-chain').catch(() => ({ roles: [] })),
+          api.get('/memory/specializations').catch(() => ({ perAgent: {}, perProjectRole: {} })),
+        ]);
         if (!alive) return;
         setData(d);
+        setTeamBurn(teams?.teams || []);
+        setMemory({
+          constraints: constraints?.constraints || [],
+          discoveries: discoveries?.discoveries || [],
+          roles: chainRoles?.roles || [],
+          specializations: specs || { perAgent: {}, perProjectRole: {} },
+        });
         setLoading(false);
         lastFetch.current = Date.now();
@@ -70,5 +86,6 @@ export function useDashboard() {
     data, loading, agents, connected, kpiHistory,
     lastFetch: lastFetch.current,
     agentBreakdown, routing, rotation, adaptive, journalist, rotating,
+    teamBurn, memory,
   };
 }

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

@@ -58,8 +58,6 @@ export const useGrooveStore = create((set, get) => ({
   chatHistory: loadJSON('groove:chatHistory'),
   chatInputs: {},   // Per-agent draft input text — persists across tab switches
   tokenTimeline: {},
-  dashTelemetry: {},
-  ccChartTimeline: [],
   // ── Approvals ─────────────────────────────────────────────
   pendingApprovals: [],

package/packages/gui/src/views/dashboard.jsx CHANGED Viewed

@@ -8,6 +8,7 @@ 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 { TeamBurnPanel } from '../components/dashboard/team-burn-panel';
 import { ActivityFeed } from '../components/dashboard/activity-feed';
 import { Skeleton } from '../components/ui/skeleton';
 import { HEX } from '../lib/theme-hex';
@@ -34,7 +35,7 @@ function DashboardSkeleton() {
 export default function DashboardView() {
   const {
     data, loading, agents, connected, kpiHistory, lastFetch,
-    agentBreakdown, routing, rotation, adaptive, journalist, rotating,
+    agentBreakdown, routing, rotation, adaptive, journalist, rotating, teamBurn, memory,
   } = useDashboard();
   const teams = useGrooveStore((s) => s.teams);
@@ -72,6 +73,7 @@ export default function DashboardView() {
     totalTurns: rawTokens.totalTurns || 0,
     agentCount: rawTokens.agentCount || 0,
     savings: rawTokens.savings || {},
+    internalOverhead: rawTokens.internalOverhead || { tokens: 0, costUsd: 0, components: {} },
   };
   const ioRatio = tokens.totalOutputTokens > 0 ? (tokens.totalInputTokens / tokens.totalOutputTokens).toFixed(1) : '—';
@@ -145,15 +147,20 @@ export default function DashboardView() {
           <FleetPanel agentBreakdown={agentBreakdown} rotating={rotating} teams={teams} />
         </div>
-        <div className="col-span-2 min-w-0 min-h-0 overflow-hidden bg-surface-1 flex flex-col border-t border-l border-border">
+        <div className="min-w-0 min-h-0 overflow-hidden bg-surface-1 flex flex-col border-t border-l border-border">
           <IntelPanel
             tokens={tokens}
             rotation={rotation}
             adaptive={adaptive}
             journalist={journalist}
             agentBreakdown={agentBreakdown}
+            memory={memory}
           />
         </div>
+        <div className="min-w-0 min-h-0 overflow-hidden bg-surface-1 flex flex-col border-t border-l border-border">
+          <TeamBurnPanel teams={teamBurn} />
+        </div>
       </div>
       <div className="flex-shrink-0 bg-surface-1 border-t border-border">