npm - groove-dev - Versions diffs - 0.27.59 → 0.27.60 - Mend

groove-dev 0.27.59 → 0.27.60

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

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

@@ -6,12 +6,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-BycOlqLx.js"></script>
+    <script type="module" crossorigin src="/assets/index-DcnRqlqB.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-BrfCzrxJ.css">
+    <link rel="stylesheet" crossorigin href="/assets/index-DD6taBMp.css">
   </head>
   <body>
     <div id="root"></div>

package/node_modules/@groove-dev/gui/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@groove-dev/gui",
-  "version": "0.27.59",
+  "version": "0.27.60",
   "description": "GROOVE GUI — visual agent control plane",
   "license": "FSL-1.1-Apache-2.0",
   "type": "module",

package/node_modules/@groove-dev/gui/src/components/network/activity-chart.jsx ADDED Viewed

@@ -0,0 +1,245 @@
+// FSL-1.1-Apache-2.0 — see LICENSE
+import { useRef, useEffect, useState, useCallback, useMemo, memo } from 'react';
+import { useGrooveStore } from '../../stores/groove';
+import { HEX, hexAlpha } from '../../lib/theme-hex';
+import { Badge } from '../ui/badge';
+function shortAddr(addr) {
+  if (!addr || typeof addr !== 'string') return '—';
+  if (addr.length < 14) return addr;
+  return `${addr.slice(0, 6)}…${addr.slice(-4)}`;
+}
+export const ActivityChart = memo(function ActivityChart() {
+  const snapshots = useGrooveStore((s) => s.networkSnapshots);
+  const nodes = useGrooveStore((s) => s.networkStatus.nodes || []);
+  const ownNodeId = useGrooveStore((s) => s.networkNode.nodeId);
+  const containerRef = useRef(null);
+  const canvasRef = useRef(null);
+  const [size, setSize] = useState({ width: 0, height: 0 });
+  const [hover, setHover] = useState(null);
+  const { width, height } = size;
+  const pad = { top: 28, right: 12, bottom: 8, left: 12 };
+  const w = Math.max(width - pad.left - pad.right, 0);
+  const h = Math.max(height - pad.top - pad.bottom, 0);
+  const chartData = useMemo(() => {
+    if (!snapshots || snapshots.length < 2) return [];
+    return snapshots;
+  }, [snapshots]);
+  useEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const observer = new ResizeObserver((entries) => {
+      const { width: cw, height: ch } = entries[0].contentRect;
+      if (cw > 0 && ch > 0) setSize({ width: Math.floor(cw), height: Math.floor(ch) });
+    });
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, []);
+  const onMouseMove = useCallback((e) => {
+    const canvas = canvasRef.current;
+    if (!canvas || !chartData.length || w <= 0) return;
+    const rect = canvas.getBoundingClientRect();
+    const x = e.clientX - rect.left - pad.left;
+    if (x < 0 || x > w) { setHover(null); return; }
+    const index = Math.round((x / w) * (chartData.length - 1));
+    setHover({ x: pad.left + (index / Math.max(chartData.length - 1, 1)) * w, index });
+  }, [chartData, w, pad.left]);
+  const onMouseLeave = useCallback(() => setHover(null), []);
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas || !chartData.length || width <= 0 || height <= 0 || w <= 0 || h <= 0) return;
+    const ctx = canvas.getContext('2d');
+    const dpr = window.devicePixelRatio || 1;
+    canvas.width = width * dpr;
+    canvas.height = height * dpr;
+    ctx.scale(dpr, dpr);
+    ctx.clearRect(0, 0, width, height);
+    const globalSessions = chartData.map((d) => d.globalSessions);
+    const mySessions = chartData.map((d) => d.mySessions);
+    const maxVal = Math.max(...globalSessions, ...mySessions, 1);
+    const xAt = (i) => pad.left + (i / Math.max(chartData.length - 1, 1)) * w;
+    const yAt = (v) => pad.top + h - (v / maxVal) * h;
+    // Horizontal grid lines
+    ctx.setLineDash([2, 4]);
+    ctx.strokeStyle = hexAlpha(HEX.text4, 0.2);
+    ctx.lineWidth = 1;
+    for (let i = 1; i <= 3; i++) {
+      const y = pad.top + (h / 4) * i;
+      ctx.beginPath();
+      ctx.moveTo(pad.left, y);
+      ctx.lineTo(pad.left + w, y);
+      ctx.stroke();
+    }
+    ctx.setLineDash([]);
+    // Y-axis labels
+    ctx.font = "9px 'JetBrains Mono Variable', monospace";
+    ctx.textAlign = 'left';
+    ctx.fillStyle = hexAlpha(HEX.text3, 0.5);
+    ctx.fillText(String(maxVal), pad.left + 4, pad.top + 10);
+    ctx.fillText(String(Math.round(maxVal / 2)), pad.left + 4, pad.top + h / 2 + 4);
+    // Network line — gradient fill
+    ctx.beginPath();
+    ctx.moveTo(pad.left, pad.top + h);
+    for (let i = 0; i < chartData.length; i++) {
+      ctx.lineTo(xAt(i), yAt(globalSessions[i]));
+    }
+    ctx.lineTo(xAt(chartData.length - 1), pad.top + h);
+    ctx.closePath();
+    const grad = ctx.createLinearGradient(0, pad.top, 0, pad.top + h);
+    grad.addColorStop(0, hexAlpha(HEX.purple, 0.2));
+    grad.addColorStop(0.7, hexAlpha(HEX.purple, 0.04));
+    grad.addColorStop(1, hexAlpha(HEX.purple, 0));
+    ctx.fillStyle = grad;
+    ctx.fill();
+    // Network line — stroke
+    ctx.beginPath();
+    ctx.strokeStyle = HEX.purple;
+    ctx.lineWidth = 1.5;
+    ctx.lineJoin = 'round';
+    for (let i = 0; i < chartData.length; i++) {
+      const x = xAt(i);
+      const y = yAt(globalSessions[i]);
+      i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);
+    }
+    ctx.stroke();
+    // Your Node line — stroke only
+    ctx.beginPath();
+    ctx.strokeStyle = HEX.accent;
+    ctx.lineWidth = 1.5;
+    ctx.lineJoin = 'round';
+    for (let i = 0; i < chartData.length; i++) {
+      const x = xAt(i);
+      const y = yAt(mySessions[i]);
+      i === 0 ? ctx.moveTo(x, y) : ctx.lineTo(x, y);
+    }
+    ctx.stroke();
+    // Inline legend (top-right)
+    ctx.font = "9px 'Inter Variable', sans-serif";
+    ctx.textAlign = 'right';
+    let rx = width - pad.right - 4;
+    const ly = 14;
+    ctx.fillStyle = HEX.accent;
+    ctx.fillText('Your Node', rx, ly);
+    rx -= ctx.measureText('Your Node').width + 4;
+    ctx.beginPath(); ctx.arc(rx, ly - 3, 2.5, 0, Math.PI * 2); ctx.fill();
+    rx -= 14;
+    ctx.fillStyle = HEX.purple;
+    ctx.fillText('Network', rx, ly);
+    rx -= ctx.measureText('Network').width + 4;
+    ctx.beginPath(); ctx.arc(rx, ly - 3, 2.5, 0, Math.PI * 2); ctx.fill();
+    // Hover
+    if (hover && hover.index >= 0 && hover.index < chartData.length) {
+      const hx = hover.x;
+      const d = chartData[hover.index];
+      // Crosshair
+      ctx.beginPath();
+      ctx.moveTo(hx, pad.top);
+      ctx.lineTo(hx, pad.top + h);
+      ctx.strokeStyle = hexAlpha(HEX.text1, 0.15);
+      ctx.lineWidth = 1;
+      ctx.stroke();
+      // Dots
+      ctx.beginPath(); ctx.arc(hx, yAt(d.globalSessions), 3, 0, Math.PI * 2);
+      ctx.fillStyle = HEX.purple; ctx.fill();
+      ctx.beginPath(); ctx.arc(hx, yAt(d.mySessions), 3, 0, Math.PI * 2);
+      ctx.fillStyle = HEX.accent; ctx.fill();
+      // Tooltip
+      const lines = [
+        { label: 'Network', value: String(d.globalSessions), color: HEX.purple },
+        { label: 'Your Node', value: String(d.mySessions), color: HEX.accent },
+        { label: 'Nodes', value: String(d.nodeCount), color: HEX.text2 },
+      ];
+      const tooltipW = 104;
+      const tooltipH = lines.length * 16 + 12;
+      let tx = hx + 12;
+      if (tx + tooltipW > width - 8) tx = hx - tooltipW - 12;
+      const ty = Math.max(pad.top, yAt(d.globalSessions) - tooltipH / 2);
+      ctx.fillStyle = hexAlpha(HEX.surface0, 0.92);
+      ctx.beginPath(); ctx.roundRect(tx, ty, tooltipW, tooltipH, 4); ctx.fill();
+      ctx.strokeStyle = hexAlpha(HEX.text4, 0.2);
+      ctx.lineWidth = 1; ctx.stroke();
+      ctx.textAlign = 'left';
+      lines.forEach((line, i) => {
+        const rowY = ty + 14 + i * 16;
+        ctx.beginPath(); ctx.arc(tx + 8, rowY - 3, 2, 0, Math.PI * 2);
+        ctx.fillStyle = line.color; ctx.fill();
+        ctx.font = "8px 'Inter Variable', sans-serif";
+        ctx.fillStyle = HEX.text3; ctx.fillText(line.label, tx + 14, rowY);
+        ctx.font = "9px 'JetBrains Mono Variable', monospace";
+        ctx.fillStyle = HEX.text0; ctx.textAlign = 'right';
+        ctx.fillText(line.value, tx + tooltipW - 8, rowY);
+        ctx.textAlign = 'left';
+      });
+    }
+  }, [chartData, width, height, hover, w, h, pad]);
+  const activeNodes = nodes.filter((n) => n.status === 'active');
+  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">Network Activity</span>
+        <span className="text-2xs font-mono text-text-3 tabular-nums">{activeNodes.length} nodes</span>
+      </div>
+      <div className="relative flex-1 min-h-0">
+        {chartData.length < 2 ? (
+          <div className="absolute inset-0 flex items-center justify-center">
+            <span className="text-xs font-mono text-text-3">Collecting network data…</span>
+          </div>
+        ) : (
+          <div ref={containerRef} className="absolute inset-0">
+            {width > 0 && height > 0 && (
+              <canvas
+                ref={canvasRef}
+                style={{ width, height }}
+                className="block cursor-crosshair"
+                onMouseMove={onMouseMove}
+                onMouseLeave={onMouseLeave}
+              />
+            )}
+          </div>
+        )}
+      </div>
+      <div className="px-3 py-1.5 border-t border-border-subtle flex items-center gap-2 flex-shrink-0 font-mono text-2xs" style={{ background: hexAlpha(HEX.accent, 0.04) }}>
+        <span className="text-text-3">{activeNodes.length} node{activeNodes.length !== 1 ? 's' : ''} online</span>
+        {activeNodes.map((n) => {
+          const id = n.node_id || n.nodeId || '';
+          const isSelf = ownNodeId && id === ownNodeId;
+          const layers = Array.isArray(n.layers) ? `${n.layers[0]}-${n.layers[1]}` : '';
+          return (
+            <span key={id} className={isSelf ? 'text-accent' : 'text-text-2'}>
+              {shortAddr(id)}{isSelf ? ' (You' : '('}{layers ? ` · ${layers}` : ''})
+            </span>
+          );
+        })}
+      </div>
+    </div>
+  );
+});

package/node_modules/@groove-dev/gui/src/components/network/compute-header.jsx CHANGED Viewed

@@ -121,7 +121,7 @@ export const ComputeHeader = memo(function ComputeHeader() {
   const loadColor = compute.avgLoad > 2.0 ? HEX.danger : compute.avgLoad > 1.0 ? HEX.warning : HEX.success;
   const activeModel = models.length > 0
     ? (typeof models[0] === 'string' ? models[0] : models[0].name)
-    : 'google/gemma-3-4b';
+    : 'Qwen/Qwen3-4B';
   const kpis = [
     { label: 'RAM', value: `${fmtMbToGb(compute.totalRamMb)} GB`, color: HEX.accent, hint: 'Total RAM across all network nodes.' },

package/node_modules/@groove-dev/gui/src/components/network/network-health.jsx CHANGED Viewed

@@ -22,7 +22,7 @@ export const NetworkHealth = memo(function NetworkHealth() {
   const node = useGrooveStore((s) => s.networkNode);
   const nodes = Array.isArray(status.nodes) ? status.nodes : [];
-  const totalLayers = status.totalLayers || 34;
+  const totalLayers = status.totalLayers || 36;
   const covered = status.coverage || 0;
   const coverage = coverageState(covered, totalLayers);
   const coveragePct = totalLayers ? Math.min(100, (covered / totalLayers) * 100) : 0;

package/node_modules/@groove-dev/gui/src/components/network/network-status.jsx CHANGED Viewed

@@ -24,7 +24,7 @@ function coverageState(covered, total) {
 function KpiTile({ icon: Icon, label, value, sub }) {
   return (
-    <div className="rounded-lg border border-border bg-surface-1 px-3 py-2.5 flex items-center gap-2.5 min-w-0">
+    <div className="rounded-sm border border-border bg-surface-1 px-3 py-2.5 flex items-center gap-2.5 min-w-0">
       <div className="w-8 h-8 rounded-md bg-accent/10 text-accent flex items-center justify-center flex-shrink-0">
         <Icon size={14} />
       </div>
@@ -53,7 +53,7 @@ export function NetworkStatus() {
   return (
     <div className="flex flex-col gap-3">
       {/* Signal connection indicator */}
-      <div className="flex items-center gap-2 px-3 py-2 rounded-lg border border-border bg-surface-1">
+      <div className="flex items-center gap-2 px-3 py-2 rounded-sm border border-border bg-surface-1">
         <StatusDot status={signalReachable ? 'running' : 'crashed'} size="sm" />
         <span className="text-2xs font-sans text-text-3">Signal:</span>
         <span className="text-2xs font-mono text-text-1">signal.groovedev.ai</span>
@@ -71,7 +71,7 @@ export function NetworkStatus() {
       </div>
       {/* Coverage bar */}
-      <div className="rounded-lg border border-border bg-surface-1 px-4 py-3">
+      <div className="rounded-sm border border-border bg-surface-1 px-4 py-3">
         <div className="flex items-center justify-between mb-2">
           <span className="text-xs font-semibold text-text-1 font-sans">Layer Coverage</span>
           <Badge variant={coverage.tone}>{coverage.label}</Badge>
@@ -86,7 +86,7 @@ export function NetworkStatus() {
       </div>
       {/* Models */}
-      <div className="rounded-lg border border-border bg-surface-1 overflow-hidden">
+      <div className="rounded-sm border border-border bg-surface-1 overflow-hidden">
         <div className="px-4 py-2.5 border-b border-border-subtle">
           <span className="text-xs font-semibold text-text-1 font-sans">Models</span>
         </div>
@@ -111,7 +111,7 @@ export function NetworkStatus() {
       </div>
       {/* Nodes table */}
-      <div className="rounded-lg border border-border bg-surface-1 overflow-hidden">
+      <div className="rounded-sm border border-border bg-surface-1 overflow-hidden">
         <button
           onClick={() => setNodesOpen((v) => !v)}
           className="w-full flex items-center gap-2 px-4 py-2.5 border-b border-border-subtle cursor-pointer hover:bg-surface-2/40 transition-colors"

package/node_modules/@groove-dev/gui/src/components/network/node-details.jsx CHANGED Viewed

@@ -29,7 +29,7 @@ export function NodeDetails() {
   const events = useGrooveStore((s) => s.networkEvents);
   return (
-    <div className="flex flex-col rounded-lg border border-border bg-surface-1 overflow-hidden min-h-0">
+    <div className="flex flex-col rounded-sm border border-border bg-surface-1 overflow-hidden min-h-0">
       <div className="flex items-center gap-2 px-4 py-2.5 border-b border-border-subtle">
         <Activity size={12} className="text-text-3" />
         <span className="text-xs font-semibold text-text-1 font-sans">Node Activity</span>

package/node_modules/@groove-dev/gui/src/stores/groove.js CHANGED Viewed

@@ -104,6 +104,7 @@ export const useGrooveStore = create((set, get) => ({
   networkVersion: { installed: null, latest: null, updateAvailable: false },
   networkUpdateProgress: { updating: false, step: null, message: null, percent: 0, error: null },
   networkCompute: { totalRamMb: 0, totalVramMb: 0, totalCpuCores: 0, totalBandwidthMbps: 0, activeNodes: 0, totalNodes: 0, avgLoad: 0 },
+  networkSnapshots: [],
   // ── Marketplace Auth ───────────────────────────────────────
   marketplaceUser: null,        // { id, displayName, avatar, ... } or null
@@ -712,6 +713,24 @@ export const useGrooveStore = create((set, get) => ({
             };
           }
           set(nsUpdate);
+          // Push snapshot for activity chart
+          const wsNodes = nsData.nodes || [];
+          const wsOwnId = get().networkNode.nodeId;
+          const wsOwn = wsOwnId ? wsNodes.find((n) => (n.node_id || n.nodeId) === wsOwnId) : null;
+          const wsActive = wsNodes.filter((n) => n.status === 'active');
+          const wsSnap = {
+            t: Date.now(),
+            globalSessions: nsData.activeSessions || 0,
+            mySessions: wsOwn?.active_sessions ?? wsOwn?.sessions ?? 0,
+            nodeCount: wsActive.length,
+            avgLoad: wsActive.length > 0 ? wsActive.reduce((s, n) => s + (n.load || 0), 0) / wsActive.length : 0,
+            myLoad: wsOwn?.load ?? 0,
+          };
+          let wsSnapshots = [...get().networkSnapshots, wsSnap];
+          if (wsSnapshots.length > 100) wsSnapshots = wsSnapshots.slice(-100);
+          set({ networkSnapshots: wsSnapshots });
           break;
         }
@@ -2106,6 +2125,26 @@ export const useGrooveStore = create((set, get) => ({
         };
       }
       set(update);
+      // Push snapshot for activity chart
+      if (data) {
+        const ownId = get().networkNode.nodeId;
+        const nodes = data.nodes || [];
+        const ownNode = ownId ? nodes.find((n) => (n.node_id || n.nodeId) === ownId) : null;
+        const activeNodes = nodes.filter((n) => n.status === 'active');
+        const snap = {
+          t: Date.now(),
+          globalSessions: data.activeSessions || 0,
+          mySessions: ownNode?.active_sessions ?? ownNode?.sessions ?? 0,
+          nodeCount: activeNodes.length,
+          avgLoad: activeNodes.length > 0 ? activeNodes.reduce((s, n) => s + (n.load || 0), 0) / activeNodes.length : 0,
+          myLoad: ownNode?.load ?? 0,
+        };
+        let snapshots = [...get().networkSnapshots, snap];
+        if (snapshots.length > 100) snapshots = snapshots.slice(-100);
+        set({ networkSnapshots: snapshots });
+      }
       return data;
     } catch {
       set({ networkStatusReachable: false });

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

@@ -9,11 +9,11 @@ import { ScrollArea } from '../components/ui/scroll-area';
 import { cn } from '../lib/cn';
 import { NodeToggle } from '../components/network/node-toggle';
 import { ComputeHeader } from '../components/network/compute-header';
-import { FleetTable } from '../components/network/fleet-table';
+import { ActivityChart } from '../components/network/activity-chart';
 import { ActivityStream } from '../components/network/activity-stream';
 import { NetworkHealth } from '../components/network/network-health';
-import { HEX } from '../lib/theme-hex';
-import { Globe, Download, Check, AlertCircle, Loader2, Trash2, ArrowUpCircle } from 'lucide-react';
+import { HEX, hexAlpha } from '../lib/theme-hex';
+import { Globe, Download, Check, AlertCircle, Loader2, Trash2, ArrowUpCircle, Zap } from 'lucide-react';
 const REQUIREMENTS = [
   'Python 3.10 or higher',
@@ -312,6 +312,99 @@ function NetworkHeader() {
   );
 }
+function IdleHero() {
+  const node = useGrooveStore((s) => s.networkNode);
+  const networkStatus = useGrooveStore((s) => s.networkStatus);
+  const startNetworkNode = useGrooveStore((s) => s.startNetworkNode);
+  const [pending, setPending] = useState(false);
+  const hardware = node.hardware || {};
+  const activeNodes = (networkStatus.nodes || []).filter((n) => n.status === 'active').length;
+  const activeSessions = networkStatus.activeSessions || 0;
+  async function handleStart() {
+    setPending(true);
+    try { await startNetworkNode(); }
+    catch { /* toasted in store */ }
+    setPending(false);
+  }
+  return (
+    <div className="flex flex-col h-full">
+      <NetworkHeader />
+      <div
+        className="flex-1 flex items-center justify-center bg-surface-0"
+        style={{ background: `radial-gradient(ellipse at 50% 40%, ${hexAlpha(HEX.accent, 0.06)} 0%, transparent 70%) ${HEX.surface0}` }}
+      >
+        <div className="max-w-lg w-full px-6 flex flex-col items-center text-center">
+          <div
+            className="w-24 h-24 rounded-full flex items-center justify-center mb-6 mx-auto"
+            style={{
+              background: hexAlpha(HEX.accent, 0.08),
+              border: `1px solid ${hexAlpha(HEX.accent, 0.15)}`,
+              boxShadow: `0 0 40px ${hexAlpha(HEX.accent, 0.1)}`,
+            }}
+          >
+            <Globe size={56} className="text-accent" strokeWidth={1.25} />
+          </div>
+          <h2 className="text-xl font-semibold text-text-0 font-sans text-center">
+            Join the Groove Network
+          </h2>
+          <p className="text-sm text-text-2 font-sans text-center leading-relaxed mt-2 max-w-sm mx-auto">
+            Contribute your compute to power decentralized AI inference. Your hardware runs model shards alongside other nodes in the network.
+          </p>
+          <div className="mt-8 w-full">
+            <div className="text-2xs font-mono text-text-3 uppercase tracking-widest mb-2 text-left">Your Hardware</div>
+            <div className="grid grid-cols-3 gap-2">
+              <div className="bg-surface-1 rounded-sm border border-border-subtle px-4 py-3">
+                <div className="text-2xs font-mono text-text-4 uppercase tracking-wider">Device</div>
+                <div className="text-sm font-mono text-text-0 mt-1 truncate">{hardware.device || 'auto'}</div>
+              </div>
+              <div className="bg-surface-1 rounded-sm border border-border-subtle px-4 py-3">
+                <div className="text-2xs font-mono text-text-4 uppercase tracking-wider">Memory</div>
+                <div className="text-sm font-mono text-text-0 mt-1 truncate">{hardware.memory || '—'}</div>
+              </div>
+              <div className="bg-surface-1 rounded-sm border border-border-subtle px-4 py-3">
+                <div className="text-2xs font-mono text-text-4 uppercase tracking-wider">GPU</div>
+                <div className="text-sm font-mono text-text-0 mt-1 truncate">{hardware.gpu || 'None'}</div>
+              </div>
+            </div>
+          </div>
+          <div className="mt-6 w-full max-w-sm mx-auto">
+            <Button variant="primary" size="lg" onClick={handleStart} disabled={pending} className="w-full">
+              {pending ? (
+                <><Loader2 size={14} className="animate-spin" /> Connecting…</>
+              ) : (
+                <><Zap size={14} /> Start Contributing</>
+              )}
+            </Button>
+          </div>
+          <div className="mt-4 text-center text-2xs font-mono text-text-3">
+            {activeNodes > 0 || activeSessions > 0 ? (
+              <span>
+                <span className="text-accent">{activeNodes}</span> node{activeNodes !== 1 ? 's' : ''} online · {activeSessions} active session{activeSessions !== 1 ? 's' : ''}
+              </span>
+            ) : (
+              <span>Checking network status…</span>
+            )}
+          </div>
+          {node.nodeId && (
+            <div className="mt-6 text-center text-2xs font-mono text-text-4">
+              Node identity: {node.nodeId.length > 14 ? `${node.nodeId.slice(0, 6)}…${node.nodeId.slice(-4)}` : node.nodeId}
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}
 export default function NetworkView() {
   const fetchNetworkNodeStatus = useGrooveStore((s) => s.fetchNetworkNodeStatus);
   const fetchNetworkStatus = useGrooveStore((s) => s.fetchNetworkStatus);
@@ -341,18 +434,7 @@ export default function NetworkView() {
   }
   if (!nodeActive) {
-    return (
-      <div className="flex flex-col h-full">
-        <NetworkHeader />
-        <ScrollArea className="flex-1">
-          <div className="flex items-center justify-center min-h-full px-6 py-12">
-            <div className="w-full max-w-md">
-              <NodeToggle />
-            </div>
-          </div>
-        </ScrollArea>
-      </div>
-    );
+    return <IdleHero />;
   }
   return (
@@ -361,10 +443,10 @@ export default function NetworkView() {
       <ComputeHeader />
-      <div className="flex-1 min-h-0 flex flex-col" style={{ background: '#282c34', gap: '1px' }}>
+      <div className="flex-1 min-h-0 flex flex-col" style={{ background: HEX.surface3, gap: '1px' }}>
         <div className="min-h-0 flex-1 grid" style={{ gridTemplateColumns: '3fr 1.5fr', gap: '0 1px' }}>
           <div className="min-w-0 min-h-0 overflow-hidden bg-surface-1">
-            <FleetTable />
+            <ActivityChart />
           </div>
           <div className="min-w-0 min-h-0 overflow-hidden bg-surface-1">
             <NetworkHealth />

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "groove-dev",
-  "version": "0.27.59",
+  "version": "0.27.60",
   "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 CHANGED Viewed

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

package/packages/daemon/package.json CHANGED Viewed

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

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

@@ -4233,7 +4233,7 @@ Keep responses concise. Help them think, don't lecture them about the system the
     }
     const signalFlag = supportsSignalFlag(cfg.version) ? '--signal' : '--relay';
-    const model = cfg.model || 'google/gemma-3-4b';
+    const model = cfg.model || 'Qwen/Qwen3-4B';
     const args = [
       '-m', 'src.node.server',
       signalFlag, signal,
@@ -4484,7 +4484,7 @@ Keep responses concise. Help them think, don't lecture them about the system the
           models,
           compute: data.compute || null,
           coverage: data.covered_layers ?? primaryModel.covered_layers ?? data.coverage ?? 0,
-          totalLayers: data.total_layers ?? primaryModel.total_layers ?? data.totalLayers ?? 34,
+          totalLayers: data.total_layers ?? primaryModel.total_layers ?? data.totalLayers ?? 36,
           activeSessions: data.active_sessions ?? data.activeSessions ?? 0,
           totalNodes: data.total_nodes ?? data.totalNodes ?? (Array.isArray(data.nodes) ? data.nodes.length : 0),
         });
@@ -4529,10 +4529,10 @@ Keep responses concise. Help them think, don't lecture them about the system the
     } : null;
     res.json({
       nodes: selfNode,
-      models: ['google/gemma-3-4b'],
+      models: ['Qwen/Qwen3-4B'],
       compute: localCompute,
       coverage,
-      totalLayers: 34,
+      totalLayers: 36,
       activeSessions: node.sessions || 0,
       totalNodes: selfNode.length,
     });

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

@@ -5,7 +5,7 @@ import { readFileSync, writeFileSync, existsSync } from 'fs';
 import { resolve } from 'path';
 import { randomUUID } from 'crypto';
 import { spawn as cpSpawn } from 'child_process';
-import { getProvider, getInstalledProviders } from './providers/index.js';
+import { getProvider, getInstalledProviders, isProviderInstalled } from './providers/index.js';
 export class ConversationManager {
   constructor(daemon) {
@@ -280,10 +280,9 @@ export class ConversationManager {
     let provider = getProvider(conv.provider);
     let modelId = conv.model;
-    if (!provider || !provider.constructor.isInstalled()) {
+    if (!provider || !isProviderInstalled(conv.provider)) {
       const priority = ['claude-code', 'gemini', 'codex', 'ollama'];
-      const installed = getInstalledProviders();
-      const fallbackId = priority.find((p) => installed.some((i) => i.id === p));
+      const fallbackId = priority.find((p) => isProviderInstalled(p));
       if (!fallbackId) throw new Error('No provider available for chat');
       provider = getProvider(fallbackId);
       modelId = null;

package/packages/daemon/src/providers/groove-network.js CHANGED Viewed

@@ -79,7 +79,7 @@ export class GrooveNetworkProvider extends Provider {
   static isOneShot = true;
   static models = [
-    { id: 'google/gemma-3-4b', name: 'Gemma 3 4B (Network)', context: 8192 },
+    { id: 'Qwen/Qwen3-4B', name: 'Qwen 3 4B (Network)', context: 32768 },
   ];
   static isInstalled() {