@sleep2agi/agent-network-dashboard 0.4.6-preview.13 → 0.4.6-preview.130

package/scripts/topo-pressure-pin-test.mjs

@@ -0,0 +1,119 @@
+/* Round 60 verification: each pressure-bar segment toggles a sticky
+ * status filter. Click "working" → all non-working nodes dim, working
+ * ones stay. Click again → release. Pin and the R55 legend hover feed
+ * the same node-opacity branch via `activeStatus = hoveredStatus ??
+ * pinnedStatus`, so hover transiently overrides without nuking the pin.
+ *
+ * Sessions:
+ *   wkr   — working
+ *   idl1  — idle
+ *   idl2  — idle
+ *   off   — offline
+ */
+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: 1400, 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');
+    localStorage.setItem('anet-topo-layout', 'ring');
+    sessionStorage.setItem('anet_v3_auth', '1');
+  } catch {}
+});
+
+const fresh = new Date(Date.now() - 60 * 1000).toISOString();
+const stale = new Date(Date.now() - 30 * 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 sessions = [
+    { alias: 'wkr',  status: 'working', network_id: nid, project_dir: null, created_at: fresh, updated_at: fresh, last_seen_at: fresh },
+    { alias: 'idl1', status: 'idle',    network_id: nid, project_dir: null, created_at: fresh, updated_at: fresh, last_seen_at: fresh },
+    { alias: 'idl2', status: 'idle',    network_id: nid, project_dir: null, created_at: fresh, updated_at: fresh, last_seen_at: fresh },
+    { alias: 'off',  status: 'offline', network_id: nid, project_dir: null, created_at: stale, updated_at: stale, last_seen_at: stale },
+  ];
+  await route.fulfill({ response: r, json: { ...b, sessions } });
+});
+await ctx.route('**/api/hub/messages*', (route) => route.fulfill({ json: { messages: [] } }));
+await ctx.route('**/api/hub/tasks*', (route) => route.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 === 4, { timeout: 30000 });
+await page.waitForTimeout(500);
+
+const opacities = () => page.evaluate(() => {
+  const o = {};
+  for (const a of ['wkr', 'idl1', 'idl2', 'off']) {
+    const g = document.querySelector(`g[data-node="${a}"]`);
+    o[a] = g ? +(g.style.opacity || '1') : null;
+  }
+  return o;
+});
+
+const before = await opacities();
+
+const bright = (v) => v != null && v >= 0.55;
+const dim    = (v) => v != null && v < 0.4;
+
+// Click the WORKING segment.
+const workingSeg = page.locator('[data-pressure-seg="working"]').first();
+const workingExists = await workingSeg.count() > 0;
+if (!workingExists) { console.log('❌ pressure segment[working] not found'); process.exit(1); }
+await workingSeg.click({ force: true });
+await page.waitForTimeout(250);
+const afterPin = await opacities();
+
+// Pin should persist past mouse moving away.
+await page.mouse.move(10, 10);
+await page.waitForTimeout(250);
+const afterMouseMove = await opacities();
+
+// Click again to release. R79 added hover-affordances on the working
+// + online chips, so the click locator's mouse path can light a
+// transient hoveredStatus en route to the pressure segment. Mouse-move
+// to a neutral spot after the release click so we observe pin-only
+// state (same gotcha R61's test documented inline).
+await workingSeg.click({ force: true });
+await page.mouse.move(10, 10);
+await page.waitForTimeout(250);
+const afterRelease = await opacities();
+
+// Repeat for offline segment.
+const offlineSeg = page.locator('[data-pressure-seg="offline"]').first();
+await offlineSeg.click({ force: true });
+await page.mouse.move(10, 10);
+await page.waitForTimeout(250);
+const afterOfflinePin = await opacities();
+await offlineSeg.click({ force: true });
+await page.mouse.move(10, 10);
+await page.waitForTimeout(250);
+const afterOfflineRelease = await opacities();
+
+await browser.close();
+
+const results = {
+  before_baseline:           bright(before.wkr) && bright(before.idl1),
+  working_pinKeepsWorking:   bright(afterPin.wkr),
+  working_pinDimsIdle:       dim(afterPin.idl1) && dim(afterPin.idl2),
+  working_pinDimsOffline:    dim(afterPin.off),
+  working_pinSurvivesMouse:  bright(afterMouseMove.wkr) && dim(afterMouseMove.idl1),
+  working_releaseRestoresAll: bright(afterRelease.wkr) && bright(afterRelease.idl1),
+  offline_pinKeepsOffline:   bright(afterOfflinePin.off),   // base offline 0.6 reads as bright (>=0.55)
+  offline_pinDimsOnline:     dim(afterOfflinePin.wkr) && dim(afterOfflinePin.idl1),
+  offline_releaseRestoresAll: bright(afterOfflineRelease.wkr),
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} pressure pin:`, JSON.stringify(results),
+  `\n  before=`, before,
+  `\n  afterPin=`, afterPin,
+  `\n  afterMouseMove=`, afterMouseMove,
+  `\n  afterRelease=`, afterRelease,
+  `\n  afterOfflinePin=`, afterOfflinePin,
+  `\n  afterOfflineRelease=`, afterOfflineRelease);
+process.exit(ok ? 0 : 1);

package/scripts/topo-pressure-seg-tooltip-test.mjs

@@ -0,0 +1,98 @@
+/* Round 102 verification: pressure-bar segment tooltips list the
+ * aliases that fall into that status bucket. Closes the last "how
+ * many but not which" gap in the chip-row surfaces. Composes with
+ * the existing R83 hover preview (canvas dims still answer it
+ * visually too) — this adds a screen-reader-friendly textual
+ * channel for the same info.
+ *
+ * Fleet: 2 working + 2 idle + 1 offline. Verify each segment's
+ * title contains the matching aliases + action hint; data-pressure-
+ * seg-aliases attr carries the full CSV.
+ */
+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: 1400, 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');
+    sessionStorage.removeItem('anet-topo-pinned-status');
+  } catch {}
+});
+
+const fresh   = new Date(Date.now() - 60 * 1000).toISOString();
+const stale10 = new Date(Date.now() - 10 * 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, ts) => ({
+    alias, status, model: 'claude-opus-4', runtime: 'cli-claude-code',
+    network_id: nid, project_dir: null,
+    created_at: ts, updated_at: ts, last_seen_at: ts,
+  });
+  await route.fulfill({ response: r, json: { ...b, sessions: [
+    mk('wkr1', 'working', fresh),
+    mk('wkr2', 'working', fresh),
+    mk('idl1', 'idle',    fresh),
+    mk('idl2', 'idle',    fresh),
+    mk('off1', 'offline', stale10),
+  ] } });
+});
+await ctx.route('**/api/hub/messages*', (route) => route.fulfill({ json: { messages: [] } }));
+await ctx.route('**/api/hub/tasks*', (route) => route.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 === 5, { timeout: 30000 });
+await page.waitForTimeout(400);
+
+const read = (key) => page.evaluate((k) => {
+  const el = document.querySelector(`[data-pressure-seg="${k}"]`);
+  if (!el) return null;
+  return {
+    title:   el.getAttribute('title') || '',
+    aliases: el.getAttribute('data-pressure-seg-aliases') || '',
+  };
+}, key);
+
+const working = await read('working');
+const idle    = await read('idle');
+const offline = await read('offline');
+
+// Pin working — action hint should flip in the title.
+await page.locator('[data-pressure-seg="working"]').click();
+await page.waitForTimeout(250);
+const workingPinned = await read('working');
+
+await browser.close();
+
+const sameSet = (csv, expected) => {
+  const got = new Set(csv.split(',').filter(Boolean));
+  const exp = new Set(expected);
+  return got.size === exp.size && [...exp].every(x => got.has(x));
+};
+
+const results = {
+  working_aliasesMatch:   sameSet(working?.aliases || '', ['wkr1', 'wkr2']),
+  working_titleListsThem: /wkr1.*wkr2|wkr2.*wkr1/.test(working?.title || ''),
+  working_titleClickHint: /click to highlight/.test(working?.title || ''),
+  working_titleStatusN:   /^2 working/m.test(working?.title || ''),
+  idle_aliasesMatch:      sameSet(idle?.aliases || '', ['idl1', 'idl2']),
+  idle_titleListsThem:    /idl1.*idl2|idl2.*idl1/.test(idle?.title || ''),
+  offline_aliasesMatch:   sameSet(offline?.aliases || '', ['off1']),
+  offline_titleListsThem: /off1/.test(offline?.title || ''),
+  workingPin_aliasesStable: sameSet(workingPinned?.aliases || '', ['wkr1', 'wkr2']),
+  workingPin_hintFlipped:   /click to release filter/.test(workingPinned?.title || ''),
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} pressure-seg tooltip:`, JSON.stringify(results),
+  `\n  working:`,        working,
+  `\n  idle:`,           idle,
+  `\n  offline:`,        offline,
+  `\n  workingPinned:`,  workingPinned);
+process.exit(ok ? 0 : 1);

package/scripts/topo-pulse-rate-test.mjs

@@ -0,0 +1,71 @@
+/* Round 24 verification: working-node pulse duration tiers by sse:N.
+ *   sse 0-1 → 1.2s    (calm)
+ *   sse 2-3 → 0.9s    (active)
+ *   sse ≥ 4 → 0.7s    (busy)
+ * Inject sse counts via mocked /api/hub/health → sse_sessions map. */
+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: 1280, height: 900 } });
+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');
+    localStorage.setItem('anet-topo-layout', 'grid');
+    sessionStorage.setItem('anet_v3_auth', '1');
+  } catch {}
+});
+const fresh = new Date(Date.now() - 60 * 1000).toISOString();
+// Three working sessions with different sse counts. Use a known network_id
+// so the `${nid}:${alias}` sse-map key works (the page's grouped lookup).
+const NID = 'net_test';
+await ctx.route('**/api/hub/status*', async (route) => {
+  await route.fulfill({ json: {
+    ok: true,
+    sessions: ['calm', 'active', 'busy'].map(alias => ({
+      alias, status: 'working', network_id: NID, project_dir: null,
+      created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+    })),
+  } });
+});
+await ctx.route('**/api/hub/health*', async (route) => {
+  await route.fulfill({ json: {
+    ok: true,
+    version: '0.8.0-test',
+    sse_sessions: {
+      [`${NID}:calm`]: 1,
+      [`${NID}:active`]: 2,
+      [`${NID}:busy`]: 4,
+    },
+  } });
+});
+await ctx.route('**/api/hub/tasks*', (route) => route.fulfill({ json: { tasks: [] } }));
+const page = await ctx.newPage();
+await page.goto('http://127.0.0.1:3000/', { waitUntil: 'domcontentloaded' });
+await page.waitForFunction(() => {
+  const svg = document.querySelector('svg[viewBox="0 0 1000 680"]');
+  return !!svg && svg.querySelectorAll('g[data-node]').length === 3;
+}, { timeout: 30000 }).catch(() => {});
+await page.waitForTimeout(600);
+
+const durOf = alias => page.$eval(
+  `g[data-node="${alias}"] circle[data-pulse-dur]`,
+  el => el.getAttribute('data-pulse-dur'),
+).catch(() => null);
+
+const calm = await durOf('calm');
+const active = await durOf('active');
+const busy = await durOf('busy');
+
+await browser.close();
+const results = {
+  calmIs1_2s: calm === '1.2s',
+  activeIs0_9s: active === '0.9s',
+  busyIs0_7s: busy === '0.7s',
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} pulse rate:`, JSON.stringify(results), `calm=${calm} active=${active} busy=${busy}`);
+process.exit(ok ? 0 : 1);

package/scripts/topo-recent-panel-count-test.mjs

@@ -0,0 +1,72 @@
+/* Round 96 verification: the recent-signal panel header count now
+ * reads "X flows" off flowLinks.length (matching the deduped rows
+ * below), not "X msgs" off the raw messages.length. Pre-R96 a
+ * fleet with 10 messages aggregating to 3 unique pairs read
+ * "10 msgs" above only 3 rendered rows — read as broken.
+ *
+ * Mock 5 messages between 2 distinct pairs: alpha↔beta gets 4
+ * msgs (4 separate exchanges, dedupes to 1 flow), gamma→delta
+ * gets 1 msg (1 flow). Total = 5 msgs, 2 flows. Header should
+ * show "2 flows", panel renders 2 rows.
+ */
+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: 1400, 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'); } 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) => ({
+    alias, status: 'idle', model: 'claude-opus-4', runtime: 'cli-claude-code',
+    network_id: nid, project_dir: null,
+    created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+  });
+  await route.fulfill({ response: r, json: { ...b, sessions: [mk('alpha'), mk('beta'), mk('gamma'), mk('delta')] } });
+});
+
+const now = Date.now();
+const mkMsg = (id, from_alias, to_alias, content, ageMs) => ({
+  id, from_alias, to_alias, content, network_id: 'default',
+  created_at: new Date(now - ageMs).toISOString(),
+});
+// 5 messages → 2 flow pairs (alpha→beta × 4, gamma→delta × 1).
+await ctx.route('**/api/hub/messages*', (route) => route.fulfill({ json: { messages: [
+  mkMsg('m1', 'alpha', 'beta',  'ping-1', 60 * 1000),
+  mkMsg('m2', 'alpha', 'beta',  'ping-2', 50 * 1000),
+  mkMsg('m3', 'alpha', 'beta',  'ping-3', 40 * 1000),
+  mkMsg('m4', 'alpha', 'beta',  'ping-4', 30 * 1000),
+  mkMsg('m5', 'gamma', 'delta', 'hello',  20 * 1000),
+] } }));
+await ctx.route('**/api/hub/tasks*', (route) => route.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 === 4, { timeout: 30000 });
+await page.waitForSelector('[data-recent-panel-count]', { timeout: 10000 });
+await page.waitForTimeout(400);
+
+const headerCount  = await page.locator('[data-recent-panel-count]').textContent();
+const renderedRows = await page.locator('[data-recent-row]').count();
+
+await browser.close();
+
+const results = {
+  header_saysFlowsNotMsgs:  /\bflows\b/.test(headerCount || ''),
+  header_count2:            /^2 flows/.test(headerCount || ''),
+  rows_match_header:        renderedRows === 2,
+  no_msgs_word:             !/\bmsgs?\b/.test(headerCount || ''),
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} recent-panel count:`, JSON.stringify(results),
+  `\n  header=`,     JSON.stringify(headerCount),
+  `\n  rows=`,       renderedRows);
+process.exit(ok ? 0 : 1);

package/scripts/topo-recent-row-hover-test.mjs

@@ -0,0 +1,122 @@
+/* Round 56 verification: hovering a recent-signal panel row sets
+ * hoveredEdgeKey to that link, which fires the R50 edge-focus +
+ * R49 endpoint-highlight ladders against the canvas.
+ *
+ * Sessions: alpha, beta, gamma, delta, epsilon, zeta (all idle).
+ * Messages create three deduped flow links in this order:
+ *   alpha → beta
+ *   gamma → delta
+ *   epsilon → zeta
+ * Hover the FIRST recent-signal row (alpha→beta):
+ *   - alpha→beta visible edge: opacity boosts ≥1.5× baseline (R50)
+ *   - other edges (γ→δ, ε→ζ): opacity dims < 0.6× baseline
+ *   - alpha + beta nodes: stay bright (≥0.55) — endpoint highlight (R49)
+ *   - gamma/delta/epsilon/zeta nodes: dim (<0.4)
+ * Release → all restore.
+ */
+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: 1400, 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');
+    localStorage.setItem('anet-topo-layout', 'ring');
+    sessionStorage.setItem('anet_v3_auth', '1');
+  } 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 sessions = ['alpha', 'beta', 'gamma', 'delta', 'epsilon', 'zeta'].map(a => ({
+    alias: a, status: 'idle', network_id: nid, project_dir: null,
+    created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+  }));
+  await route.fulfill({ response: r, json: { ...b, sessions } });
+});
+const now = new Date().toISOString();
+await ctx.route('**/api/hub/messages*', (route) => route.fulfill({ json: { messages: [
+  { from_alias: 'alpha',   to_alias: 'beta',  content: 'm', created_at: now },
+  { from_alias: 'gamma',   to_alias: 'delta', content: 'm', created_at: now },
+  { from_alias: 'epsilon', to_alias: 'zeta',  content: 'm', created_at: now },
+] } }));
+await ctx.route('**/api/hub/tasks*', (route) => route.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 === 6, { timeout: 30000 });
+await page.waitForTimeout(600);
+
+const readState = () => page.evaluate(() => {
+  const svg = document.querySelector('svg[viewBox="0 0 1000 680"]');
+  const edges = {};
+  for (const g of svg.querySelectorAll(':scope > g > g')) {
+    const t = g.querySelector('path[data-edge-hitbox] title');
+    if (!t) continue;
+    const route = (t.textContent || '').split('\n')[0];
+    const base = [...g.querySelectorAll(':scope > path')].find(
+      p => !p.hasAttribute('data-edge-hitbox') && p.hasAttribute('marker-end')
+    );
+    if (base) edges[route] = +base.getAttribute('opacity');
+  }
+  const nodes = {};
+  for (const a of ['alpha', 'beta', 'gamma', 'delta', 'epsilon', 'zeta']) {
+    const n = document.querySelector(`g[data-node="${a}"]`);
+    nodes[a] = n ? +(n.style.opacity || '1') : null;
+  }
+  return { edges, nodes };
+});
+
+const before = await readState();
+
+// Hover the first recent-signal row — its key is "alpha->beta".
+const rowRect = await page.evaluate(() => {
+  const g = document.querySelector('g[data-recent-row="alpha->beta"]');
+  if (!g) return null;
+  const r = g.getBoundingClientRect();
+  return { x: r.x + r.width / 2, y: r.y + r.height / 2 };
+});
+if (!rowRect) { console.log('❌ recent-signal row alpha->beta not found'); process.exit(1); }
+await page.mouse.move(10, 10);
+await page.mouse.move(rowRect.x, rowRect.y);
+await page.waitForTimeout(350);
+const during = await readState();
+
+await page.mouse.move(10, 10);
+await page.waitForTimeout(350);
+const after = await readState();
+
+await browser.close();
+
+const baseEdgeOp = before.edges['alpha → beta'];
+const eAB = during.edges['alpha → beta'];
+const eGD = during.edges['gamma → delta'];
+const eEZ = during.edges['epsilon → zeta'];
+
+const bright = (v) => v != null && v >= 0.55;
+const dim = (v) => v != null && v < 0.4;
+const results = {
+  baselineEqual: Math.abs(before.edges['alpha → beta'] - before.edges['gamma → delta']) < 0.001
+              && Math.abs(before.edges['alpha → beta'] - before.edges['epsilon → zeta']) < 0.001,
+  hoverBrightensTargetEdge: eAB > baseEdgeOp * 1.5,
+  hoverDimsOtherEdges: eGD < baseEdgeOp * 0.6 && eEZ < baseEdgeOp * 0.6,
+  endpointsStayBright: bright(during.nodes.alpha) && bright(during.nodes.beta),
+  nonEndpointsDim: dim(during.nodes.gamma) && dim(during.nodes.delta)
+                && dim(during.nodes.epsilon) && dim(during.nodes.zeta),
+  releaseRestoresEdges: Math.abs(after.edges['alpha → beta'] - baseEdgeOp) < 0.05
+                     && Math.abs(after.edges['gamma → delta'] - baseEdgeOp) < 0.05,
+  releaseRestoresNodes: bright(after.nodes.alpha) && bright(after.nodes.gamma) && bright(after.nodes.epsilon),
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} recent-row hover:`, JSON.stringify(results),
+  `\n  baseline α→β=${baseEdgeOp}`,
+  `\n  during α→β=${eAB} γ→δ=${eGD} ε→ζ=${eEZ}`,
+  `\n  during nodes=`, during.nodes,
+  `\n  after  edges=`, after.edges);
+process.exit(ok ? 0 : 1);

package/scripts/topo-recent-row-pin-test.mjs

@@ -0,0 +1,126 @@
+/* Round 116 verification: recent-signal row click pins the edge.
+ * R56 made hover transient; R116 makes click sticky — survives
+ * mouseleave, releases on second click or Esc. activeEdgeKey =
+ * hoveredEdgeKey ?? pinnedEdgeKey, so hover-while-pinned previews
+ * another edge transiently and mouseleave falls back to the pin.
+ *
+ * Drives 2 flow rows. Click row 0 → row's aria-pressed=true,
+ * data-recent-row-pinned=true, the edge stays bright after mouseleave
+ * (non-endpoints stay dim, endpoint ring stays). Click row 0 again
+ * → release. Pin row 0, hover row 1 → row-1 preview wins; leave →
+ * row-0 pin restores. Esc clears.
+ */
+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: 1400, 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'); } 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) => ({
+    alias, status: 'idle', model: 'claude-opus-4', runtime: 'cli-claude-code',
+    network_id: nid, project_dir: null,
+    created_at: fresh, updated_at: fresh, last_seen_at: fresh,
+  });
+  await route.fulfill({ response: r, json: { ...b, sessions: [mk('alpha'), mk('beta'), mk('gamma'), mk('delta')] } });
+});
+
+const now = Date.now();
+const mkMsg = (id, from_alias, to_alias, ageMs) => ({
+  id, from_alias, to_alias, content: 'hi', network_id: 'default',
+  created_at: new Date(now - ageMs).toISOString(),
+});
+await ctx.route('**/api/hub/messages*', (route) => route.fulfill({ json: { messages: [
+  mkMsg('m1', 'alpha', 'beta',  30 * 1000),
+  mkMsg('m2', 'gamma', 'delta', 60 * 1000),
+] } }));
+await ctx.route('**/api/hub/tasks*', (route) => route.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 === 4, { timeout: 30000 });
+await page.waitForSelector('[data-recent-row]', { timeout: 10000 });
+await page.waitForTimeout(400);
+
+const rowState = (key) => page.evaluate((k) => {
+  const g = document.querySelector(`[data-recent-row="${k}"]`);
+  return {
+    pinned: g?.getAttribute('data-recent-row-pinned') || '',
+    aria:   g?.getAttribute('aria-pressed') || '',
+  };
+}, key);
+const endpointRingFor = (alias) => page.evaluate((a) => {
+  const g = document.querySelector(`g[data-node="${a}"]`);
+  return !!g?.querySelector('[data-edge-endpoint-ring]');
+}, alias);
+
+const before = await rowState('alpha->beta');
+
+// Click row 0 → pin.
+await page.locator('[data-recent-row="alpha->beta"]').click();
+await page.mouse.move(10, 10);
+await page.waitForTimeout(300);
+const afterPin       = await rowState('alpha->beta');
+const alphaRingPin   = await endpointRingFor('alpha');
+const betaRingPin    = await endpointRingFor('beta');
+const gammaRingPin   = await endpointRingFor('gamma');
+
+// Click again → release.
+await page.locator('[data-recent-row="alpha->beta"]').click();
+await page.mouse.move(10, 10);
+await page.waitForTimeout(300);
+const afterRelease     = await rowState('alpha->beta');
+const alphaRingRelease = await endpointRingFor('alpha');
+
+// Pin row 0 again, hover row 1 — preview wins.
+await page.locator('[data-recent-row="alpha->beta"]').click();
+await page.mouse.move(10, 10);
+await page.waitForTimeout(200);
+await page.locator('[data-recent-row="gamma->delta"]').hover();
+await page.waitForTimeout(300);
+const alphaWhileHoverGamma = await endpointRingFor('alpha');
+const gammaWhileHover      = await endpointRingFor('gamma');
+
+// Leave gamma row — row-0 pin restores.
+await page.mouse.move(10, 10);
+await page.waitForTimeout(300);
+const alphaAfterLeave = await endpointRingFor('alpha');
+const gammaAfterLeave = await endpointRingFor('gamma');
+
+// Esc clears.
+await page.keyboard.press('Escape');
+await page.waitForTimeout(300);
+const afterEsc       = await rowState('alpha->beta');
+const alphaAfterEsc  = await endpointRingFor('alpha');
+
+await browser.close();
+
+const results = {
+  before_notPinned:         before.pinned === 'false' && before.aria === 'false',
+  pin_attrTrue:             afterPin.pinned === 'true' && afterPin.aria === 'true',
+  pin_endpointsLit:         alphaRingPin === true && betaRingPin === true,
+  pin_nonEndpointDark:      gammaRingPin === false,
+  releaseAfterReclick:      afterRelease.pinned === 'false' && alphaRingRelease === false,
+  hoverPreview_gammaLit:    gammaWhileHover === true,
+  hoverPreview_alphaDark:   alphaWhileHoverGamma === false,
+  leave_pinRestored:        alphaAfterLeave === true && gammaAfterLeave === false,
+  esc_clearsPin:            afterEsc.pinned === 'false' && alphaAfterEsc === false,
+};
+const ok = Object.values(results).every(Boolean);
+console.log(`${ok ? '✅' : '❌'} recent-row pin:`, JSON.stringify(results),
+  `\n  afterPin=`,     afterPin,
+  `\n  rings@pin: alpha=`, alphaRingPin, ' beta=', betaRingPin, ' gamma=', gammaRingPin,
+  `\n  afterRelease=`, afterRelease,
+  `\n  hoverPreview: alpha=`, alphaWhileHoverGamma, ' gamma=', gammaWhileHover,
+  `\n  afterLeave: alpha=`, alphaAfterLeave, ' gamma=', gammaAfterLeave,
+  `\n  afterEsc=`,     afterEsc);
+process.exit(ok ? 0 : 1);