@sleep2agi/agent-network-dashboard 0.4.6-preview.345 → 0.4.6-preview.346

package/.next/trace-build

@@ -1 +1 @@
-[{"name":"run-turbopack","duration":7169618,"timestamp":119686219071,"id":14,"parentId":1,"tags":{},"startTime":1778927658465,"traceId":"4fd1bc6cde53e8ce"},{"name":"turbopack-build-events","duration":73,"timestamp":119686542528,"id":15,"parentId":1,"tags":{},"startTime":1778927658789,"traceId":"4fd1bc6cde53e8ce"},{"name":"run-typescript","duration":10849130,"timestamp":119693397679,"id":16,"parentId":1,"tags":{},"startTime":1778927665644,"traceId":"4fd1bc6cde53e8ce"},{"name":"static-check","duration":1124476,"timestamp":119704477253,"id":19,"parentId":1,"tags":{},"startTime":1778927676724,"traceId":"4fd1bc6cde53e8ce"},{"name":"static-generation","duration":766923,"timestamp":119705616717,"id":105,"parentId":1,"tags":{},"startTime":1778927677863,"traceId":"4fd1bc6cde53e8ce"},{"name":"telemetry-flush","duration":30882,"timestamp":119706423954,"id":114,"parentId":1,"tags":{},"startTime":1778927678670,"traceId":"4fd1bc6cde53e8ce"},{"name":"next-build","duration":20489760,"timestamp":119685965135,"id":1,"tags":{"buildMode":"default","version":"16.2.3","bundler":"turbopack","has-custom-webpack-config":"false","use-build-worker":"true"},"startTime":1778927658211,"traceId":"4fd1bc6cde53e8ce"}]
+[{"name":"run-turbopack","duration":7434216,"timestamp":120214470345,"id":14,"parentId":1,"tags":{},"startTime":1778928186717,"traceId":"04efb3bd722f9121"},{"name":"turbopack-build-events","duration":77,"timestamp":120214815235,"id":15,"parentId":1,"tags":{},"startTime":1778928187062,"traceId":"04efb3bd722f9121"},{"name":"run-typescript","duration":11026777,"timestamp":120221914825,"id":16,"parentId":1,"tags":{},"startTime":1778928194161,"traceId":"04efb3bd722f9121"},{"name":"static-check","duration":1074250,"timestamp":120233175548,"id":19,"parentId":1,"tags":{},"startTime":1778928205422,"traceId":"04efb3bd722f9121"},{"name":"static-generation","duration":697719,"timestamp":120234265215,"id":105,"parentId":1,"tags":{},"startTime":1778928206511,"traceId":"04efb3bd722f9121"},{"name":"telemetry-flush","duration":33209,"timestamp":120235008650,"id":114,"parentId":1,"tags":{},"startTime":1778928207255,"traceId":"04efb3bd722f9121"},{"name":"next-build","duration":20863334,"timestamp":120214178594,"id":1,"tags":{"buildMode":"default","version":"16.2.3","bundler":"turbopack","has-custom-webpack-config":"false","use-build-worker":"true"},"startTime":1778928186425,"traceId":"04efb3bd722f9121"}]

package/app/components/TopoGraph.tsx

@@ -3698,7 +3698,21 @@ export function TopoGraph({ sessions, sseSessions, renameSignal }: TopoGraphProp
                       tier-coloured pips alongside every other
                       theme-driven element. R230's tabular-nums
                       stays. */}
-                  {box.statuses.working > 0 && (
+                  {/* Round 319 / Loop: drop a tier pip when its count
+                      equals box.count — i.e. single-tier groups (all
+                      working, all idle, all offline). Pre-R319 a 4-all-
+                      idle group rendered as `P站 · 4 4i` with the "4"
+                      visually doubled; Vincent telegram 5304 flagged
+                      this as 比较难看 in a real-data screenshot
+                      (ai-insight · 6 6i, blueleap · 3 3i, P站 · 4 4i).
+                      The dropped pip's information is already conveyed
+                      by the group-box stroke colour (R68 isPinned/
+                      hover accent uses the dominant-tier hue) plus
+                      the SVG <title> tooltip listing the status
+                      breakdown. Multi-tier groups (e.g. `alpha · 3
+                      2w 1i`) render unchanged — those pips genuinely
+                      add breakdown info that the total doesn't carry. */}
+                  {box.statuses.working > 0 && box.statuses.working !== box.count && (
                     <tspan
                       dx="8"
                       fill={isLight ? '#059669' : '#22c55e'}
@@ -3709,7 +3723,7 @@ export function TopoGraph({ sessions, sseSessions, renameSignal }: TopoGraphProp
                       style={{ fontVariantNumeric: 'tabular-nums', transition: 'fill 200ms ease-out' }}
                     >{box.statuses.working}w</tspan>
                   )}
-                  {box.statuses.idle > 0 && (
+                  {box.statuses.idle > 0 && box.statuses.idle !== box.count && (
                     <tspan
                       dx="4"
                       fill={isLight ? '#0d9488' : '#2dd4bf'}
@@ -3720,7 +3734,7 @@ export function TopoGraph({ sessions, sseSessions, renameSignal }: TopoGraphProp
                       style={{ fontVariantNumeric: 'tabular-nums', transition: 'fill 200ms ease-out' }}
                     >{box.statuses.idle}i</tspan>
                   )}
-                  {box.statuses.offline > 0 && (
+                  {box.statuses.offline > 0 && box.statuses.offline !== box.count && (
                     <tspan
                       dx="4"
                       fill={isLight ? '#94a3b8' : '#6b7280'}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sleep2agi/agent-network-dashboard",
-  "version": "0.4.6-preview.345",
+  "version": "0.4.6-preview.346",
   "description": "Agent Network Dashboard — Web UI for managing AI Agent networks",
   "scripts": {
     "dev": "next dev",

package/scripts/p0-servers-drawer-screenshot.mjs

@@ -0,0 +1,99 @@
+/* v0.10.0 Hero 1+2 — ServersDrawer extension screenshot evidence for #140.
+ * Mocks the /api/hub/servers response with disk + history + agents
+ * to surface the new expandable detail view. */
+import { chromium } from 'playwright';
+import { readFileSync } from 'node:fs';
+
+const out = process.argv[2] || 'screenshots/r293-p0/servers-drawer-expanded';
+const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
+const browser = await chromium.launch({ headless: true });
+const ctx = await browser.newContext({ viewport: { width: 1600, height: 1000 }, deviceScaleFactor: 2 });
+await ctx.addCookies([{ name: 'anet_dashboard_session', value: `v3:${TOKEN}`, domain: '127.0.0.1', path: '/' }]);
+await ctx.addInitScript(() => {
+  try {
+    localStorage.setItem('anet-theme', 'cyber');
+    sessionStorage.setItem('anet_v3_auth', '1');
+    // Force drawer open + expand the first card by hostname guess.
+    localStorage.setItem('anet-servers-drawer', '1');
+    localStorage.setItem('anet-servers-drawer-expanded', JSON.stringify(['mock-1', 'mock-2']));
+  } catch {}
+});
+
+// Mock servers payload with full v0.10.0 schema.
+await ctx.route('**/api/hub/servers*', (route) => {
+  route.fulfill({
+    json: {
+      servers: [
+        {
+          hostname: 'mock-1',
+          ip: '10.0.0.10',
+          cpu_load_1min: 2.4,
+          cpu_cores: 8,
+          mem_used_gb: 18.2,
+          mem_total_gb: 32,
+          disk_used_gb: 220,
+          disk_total_gb: 500,
+          cpu_history: [25, 28, 32, 30, 35, 38, 40, 36, 33, 30],
+          mem_history: [50, 52, 55, 56, 58, 57, 59, 60, 58, 57],
+          agents: [
+            { alias: 'claude-1', runtime: 'claude-code-cli', status: 'working', progress: 0.42 },
+            { alias: 'codex-1', runtime: 'codex-sdk', status: 'working', progress: 0.18 },
+            { alias: 'intern-1', runtime: 'claude-agent-sdk', status: 'idle' },
+          ],
+          agent_count: 3,
+          status: 'online',
+        },
+        {
+          hostname: 'mock-2',
+          ip: '10.0.0.11',
+          cpu_load_1min: 7.1,
+          cpu_cores: 4,
+          mem_used_gb: 14.5,
+          mem_total_gb: 16,
+          disk_used_gb: 460,
+          disk_total_gb: 500,
+          cpu_history: [80, 88, 92, 95, 96, 94, 93, 91, 90, 89],
+          mem_history: [85, 87, 89, 91, 90, 92, 93, 91, 90, 91],
+          agents: [
+            { alias: 'minimax-busy', runtime: 'claude-code-cli', status: 'working', progress: 0.78 },
+          ],
+          agent_count: 1,
+          status: 'online',
+        },
+        {
+          hostname: 'mock-offline',
+          ip: '10.0.0.20',
+          cpu_load_1min: null,
+          cpu_cores: 0,
+          mem_used_gb: null,
+          mem_total_gb: null,
+          agent_count: 2,
+          status: 'offline',
+          note: 'last seen 12m ago',
+        },
+      ],
+    },
+  });
+});
+await ctx.route('**/api/hub/status*', (r) => r.fulfill({ json: { sessions: [], hub: { networks: [] } } }));
+await ctx.route('**/api/hub/messages*', (r) => r.fulfill({ json: { messages: [] } }));
+await ctx.route('**/api/hub/tasks*', (r) => r.fulfill({ json: { tasks: [] } }));
+
+const page = await ctx.newPage();
+await page.goto('http://127.0.0.1:3000/', { waitUntil: 'networkidle' });
+await page.waitForSelector('[data-server-card]', { timeout: 15000 });
+await page.waitForTimeout(800);
+
+// Crop to the drawer region only.
+const box = await page.evaluate(() => {
+  const aside = document.querySelector('[aria-label="Servers panel"]');
+  if (!aside) return null;
+  const r = aside.getBoundingClientRect();
+  return { x: r.x - 8, y: r.y - 8, width: r.width + 16, height: Math.min(r.height + 16, 980) };
+});
+if (box && box.width > 100) {
+  await page.screenshot({ path: `${out}.png`, clip: box });
+}
+await page.screenshot({ path: `${out}-full.png`, fullPage: false });
+console.log(`✅ wrote ${out}.png + ${out}-full.png`);
+await browser.close();

package/scripts/topo-group-pip-fadein-test.mjs

@@ -44,10 +44,14 @@ await ctx.route('**/api/hub/status*', async (route) => {
     created_at: fresh, updated_at: fresh, last_seen_at: fresh,
   });
   await route.fulfill({ response: r, json: { ...b, sessions: [
+    // R319 fixture: both groups must be multi-tier so all tier pips
+    // render. Pre-R319 beta was 2 working (single-tier) and its pip
+    // rendered fine; post-R319 a tier pip is dropped when its count
+    // equals box.count, so beta needs idle to remain multi-tier here.
     mk('alpha-1', 'working'),
     mk('alpha-2', 'idle'),
     mk('beta-1',  'working'),
-    mk('beta-2',  'working'),
+    mk('beta-2',  'idle'),
   ] } });
 });
 await ctx.route('**/api/hub/messages*', (r2) => r2.fulfill({ json: { messages: [] } }));

package/scripts/topo-group-pip-singletier-drop-test.mjs

@@ -0,0 +1,131 @@
+/* Round 319 verification: prefix-group label drops the redundant
+ * tier pip when its count equals box.count (single-tier groups).
+ *
+ * Vincent telegram 5304 (2026-05-16) flagged real-data screenshot
+ * with `ai-insight · 6 6i`, `blueleap · 3 3i`, `P站 · 4 4i` as
+ * 比较难看 — the same number was visually doubled (total chip "·N"
+ * + tier pip "Ni") whenever a group was single-tier.
+ *
+ * R319: tier pip is now conditionally rendered with both
+ *   `box.statuses.{tier} > 0` AND `box.statuses.{tier} !== box.count`
+ * so single-tier groups collapse to `· N` (no duplicated digit).
+ * Multi-tier groups keep all pips — the breakdown is genuinely
+ * additional info there.
+ *
+ * Fixture:
+ *   - alpha-1..alpha-3: all working (single-tier, count=3, working=3)
+ *   - beta-1, beta-2: working; beta-3, beta-4: idle (multi-tier)
+ *
+ * Contract:
+ *   - alpha group: no [data-group-pip="working"] tspan (dropped because
+ *     working === count)
+ *   - alpha group: still has [data-group-label-count] with value=3
+ *     (R229 total chip untouched)
+ *   - beta group: has [data-group-pip="working"] AND [data-group-pip="idle"]
+ *     (multi-tier — both pips render because neither equals count)
+ *   - beta group: [data-group-label-count-value]=4 still rendered
+ *   - R317 inactive Layout toggle gray-400 + R318 active font-medium
+ *     + R294 pulse absent all preserved.
+ */
+import { chromium } from 'playwright';
+import { readFileSync } from 'node:fs';
+
+const TOKEN = JSON.parse(readFileSync('/home/vansin/.anet/config.json', 'utf8')).token;
+const browser = await chromium.launch({ headless: true });
+const ctx = await browser.newContext({ viewport: { width: 1500, height: 1500 } });
+await ctx.addCookies([{ name: 'anet_dashboard_session', value: `v3:${TOKEN}`, domain: '127.0.0.1', path: '/' }]);
+await ctx.addInitScript(() => {
+  try {
+    localStorage.setItem('anet-theme', 'cyber');
+    sessionStorage.setItem('anet_v3_auth', '1');
+    localStorage.setItem('anet-topo-layout', 'grid');
+  } catch {}
+});
+const fresh = new Date(Date.now() - 60 * 1000).toISOString();
+await ctx.route('**/api/hub/status*', async (route) => {
+  const r = await route.fetch();
+  const b = await r.json();
+  const nid = (b.sessions || [])[0]?.network_id || 'default';
+  const mk = (alias, status) => ({
+    alias, status, model: 'claude-opus-4', runtime: 'claude-code-cli',
+    network_id: nid, project_dir: null,
+    created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+  });
+  await route.fulfill({ response: r, json: { ...b, sessions: [
+    // alpha — single-tier (all working, count=3)
+    mk('alpha-1', 'working'),
+    mk('alpha-2', 'working'),
+    mk('alpha-3', 'working'),
+    // beta — multi-tier (2 working + 2 idle, count=4)
+    mk('beta-1', 'working'),
+    mk('beta-2', 'working'),
+    mk('beta-3', 'idle'),
+    mk('beta-4', 'idle'),
+  ] } });
+});
+await ctx.route('**/api/hub/messages*', (r) => r.fulfill({ json: { messages: [] } }));
+await ctx.route('**/api/hub/tasks*', (r) => r.fulfill({ json: { tasks: [] } }));
+
+const page = await ctx.newPage();
+await page.goto('http://127.0.0.1:3000/', { waitUntil: 'domcontentloaded' });
+await page.waitForFunction(() => document.querySelectorAll('g[data-node]').length === 7, { timeout: 30000 });
+await page.waitForSelector('[data-group-label-count]', { timeout: 10000, state: 'attached' });
+await page.waitForTimeout(500);
+
+const probe = await page.evaluate(() => {
+  // Find each group's <text data-group-label> wrapper and its pip
+  // children + count tspan.
+  const labels = Array.from(document.querySelectorAll('[data-group-label]'));
+  const byGroup = {};
+  for (const label of labels) {
+    const key = label.getAttribute('data-group-label');
+    const countTspan  = label.querySelector('[data-group-label-count]');
+    const pips        = Array.from(label.querySelectorAll('[data-group-pip]'));
+    byGroup[key] = {
+      hasCountTspan: !!countTspan,
+      countValue:    countTspan?.getAttribute('data-group-label-count-value') ?? null,
+      pipTiers:      pips.map(p => p.getAttribute('data-group-pip')),
+      pipTexts:      pips.map(p => p.textContent),
+    };
+  }
+  return {
+    groups: byGroup,
+    r317InactiveLayoutCls:
+      document.querySelector('[data-topo-chrome-layout="grid"]')?.className ?? '',
+    r317ActiveLayoutCls:
+      document.querySelector('[data-topo-chrome-layout="ring"]')?.className ?? '',
+    pulseCount: document.querySelectorAll('[data-pulse-wrapper]').length,
+  };
+});
+await browser.close();
+
+// R106 cluster algorithm preserves the trailing separator in the
+// group key (e.g. alpha-1/2/3 → key 'alpha-'); match by prefix.
+const alpha = probe.groups['alpha-'] || probe.groups['alpha'] || null;
+const beta  = probe.groups['beta-']  || probe.groups['beta']  || null;
+
+const results = {
+  alpha_group_found:           alpha !== null,
+  alpha_has_count_tspan:       alpha?.hasCountTspan === true,
+  alpha_count_value_3:         alpha?.countValue === '3',
+  alpha_no_working_pip:        !alpha?.pipTiers.includes('working'),
+  alpha_no_pips_at_all:        alpha?.pipTiers.length === 0,
+  beta_group_found:            beta !== null,
+  beta_has_count_tspan:        beta?.hasCountTspan === true,
+  beta_count_value_4:          beta?.countValue === '4',
+  beta_has_working_pip:        beta?.pipTiers.includes('working'),
+  beta_has_idle_pip:           beta?.pipTiers.includes('idle'),
+  beta_no_offline_pip:         !beta?.pipTiers.includes('offline'),
+  // R317 regression — Layout toggle inactive Grid is the layout-active
+  // here (we forced grid via initScript), so check that Ring is the
+  // INACTIVE one with text-gray-400. After R318, the ACTIVE button
+  // (grid) has font-medium.
+  r317_ring_inactive_gray_400: probe.r317ActiveLayoutCls.includes('text-gray-400'),
+  r318_grid_active_font_medium: probe.r317InactiveLayoutCls.includes('font-medium'),
+  r294_pulse_absent:           probe.pulseCount === 0,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} group-pip single-tier drop:`, JSON.stringify(results),
+  '\n  alpha:', alpha,
+  '\n  beta:',  beta);
+process.exit(ok ? 0 : 1);