@songsid/agend 0.0.4 → 0.0.6

package/dist/general-knowledge/skills.md

@@ -175,3 +175,98 @@ templates:        # Reusable fleet deployment templates
 - `describe_instance("<name>")` — shows status, last activity, description
 - `tmux capture-pane -t agend:<name> -p | tail -20` — see actual CLI screen
 - Look for `X% !>` prompt = idle, `Thinking...` = busy, `error` = needs attention
+
+## 10. Safe Update & Restart
+
+**Update AgEnD to latest version:**
+```bash
+agend update              # update to latest
+agend update --version 0.0.6  # pin specific version
+```
+
+The `agend update` command automatically:
+- Detects if sudo is needed (switches to nvm if so)
+- Installs new version
+- Verifies installation succeeded
+- Updates service file (ExecStart path)
+- Restarts fleet
+
+**Manual restart (if update isn't needed):**
+```bash
+agend fleet restart       # graceful restart (SIGUSR2) — keeps sessions, reloads config
+agend fleet stop && agend fleet start  # full restart — new code takes effect
+```
+
+**NEVER do:**
+- `kill -9` on the fleet process (corrupts state)
+- Edit fleet.yaml while fleet is restarting
+- Run `agend update` while another update is in progress
+
+## 11. Model Names by Backend
+
+Models are specified in fleet.yaml `defaults.model` or per-instance `model` field.
+
+| Backend | Model Names | Default |
+|---------|-------------|---------|
+| **kiro-cli** | `claude-sonnet-4-20250514`, `claude-opus-4-20250514`, `claude-haiku-3-20250307` | auto (latest) |
+| **claude-code** | `sonnet`, `opus`, `haiku`, `opusplan`, `best`, `sonnet[1m]`, `opus[1m]` | sonnet |
+| **gemini-cli** | `gemini-2.5-pro`, `gemini-2.5-flash` | auto |
+| **codex** | `gpt-4o`, `o3`, `o4-mini` | gpt-4o |
+| **opencode** | depends on provider config | — |
+
+**Important:** kiro-cli uses FULL model IDs (e.g. `claude-sonnet-4-20250514`), NOT short names like `sonnet`. Claude Code uses short names. Don't mix them up.
+
+Example fleet.yaml:
+```yaml
+defaults:
+  backend: kiro-cli
+  model: claude-sonnet-4-20250514
+
+instances:
+  heavy-task:
+    model: claude-opus-4-20250514
+```
+
+## 12. Config Validation
+
+**Before editing fleet.yaml or classicBot.yaml, always validate after:**
+
+```bash
+# Validate fleet.yaml syntax
+agend fleet start --dry-run 2>&1 | head -5
+# Or simply:
+node -e "const yaml = require('js-yaml'); const fs = require('fs'); yaml.load(fs.readFileSync('$HOME/.agend/fleet.yaml', 'utf-8')); console.log('✓ valid YAML')"
+```
+
+**Common fleet.yaml mistakes:**
+- Missing `channel.mode` field → error on start
+- Wrong indentation (YAML is indent-sensitive)
+- `topic_id` as string vs number (both work, but be consistent)
+- `backend` typo (valid: `claude-code`, `gemini-cli`, `codex`, `opencode`, `kiro-cli`)
+- `model` using wrong format for the backend
+
+**classicBot.yaml validation:**
+```bash
+node -e "const yaml = require('js-yaml'); const fs = require('fs'); yaml.load(fs.readFileSync('$HOME/.agend/classicBot.yaml', 'utf-8')); console.log('✓ valid YAML')"
+```
+
+**Common classicBot.yaml mistakes:**
+- `allowed_guilds` values must be strings (Discord IDs are too large for YAML integers)
+- Channel IDs as keys must be quoted strings
+- Missing `defaults` section (optional but recommended)
+
+**After editing config:**
+```bash
+agend reload              # hot-reload (SIGHUP) — adds/removes instances without restart
+agend fleet restart       # if channel/defaults changed — needs full restart
+```
+
+## 13. What NOT to Do (Dangerous Operations)
+
+- **Don't delete `~/.agend/fleet.yaml`** while fleet is running
+- **Don't delete `~/.agend/fleet.pid`** manually — use `agend fleet stop`
+- **Don't kill tmux server** (`tmux kill-server`) — kills all agent sessions
+- **Don't edit instance output.log** — it's actively written by the daemon
+- **Don't run two fleet processes** on the same AGEND_HOME — port/socket conflicts
+- **Don't change `channel.group_id`** without re-creating all topics — routing breaks
+- **Don't remove an instance from fleet.yaml** that has active work — stop it first

package/dist/logger.d.ts

@@ -1,6 +1,4 @@
 import pino from "pino";
-/** Truncate log to tail when it exceeds MAX_LOG_SIZE (no rotation/backup files) */
-export declare function truncateLogIfNeeded(logPath: string): void;
 /** Rotate a log file: foo.log → foo.log.1 → foo.log.2 → foo.log.3 (deleted) */
 export declare function rotateLogIfNeeded(logPath: string, maxSize?: number, maxFiles?: number): void;
 export declare function createLogger(level?: string): pino.Logger<never, boolean>;

package/dist/logger.js

@@ -1,25 +1,11 @@
 import pino from "pino";
 import { join } from "node:path";
-import { mkdirSync, statSync, readFileSync, writeFileSync, renameSync, unlinkSync, existsSync } from "node:fs";
+import { mkdirSync, statSync, existsSync, renameSync, unlinkSync, writeFileSync } from "node:fs";
 import { getAgendHome } from "./paths.js";
 const DATA_DIR = getAgendHome();
 const LOG_FILE = join(DATA_DIR, "daemon.log");
 const MAX_LOG_SIZE = 10 * 1024 * 1024; // 10 MB
-const TRUNCATE_TO = 5 * 1024 * 1024; // keep last 5 MB
 const ROTATE_MAX_FILES = 3;
-/** Truncate log to tail when it exceeds MAX_LOG_SIZE (no rotation/backup files) */
-export function truncateLogIfNeeded(logPath) {
-    try {
-        const stat = statSync(logPath);
-        if (stat.size < MAX_LOG_SIZE)
-            return;
-        const buf = readFileSync(logPath);
-        const tail = buf.subarray(buf.length - TRUNCATE_TO);
-        const nl = tail.indexOf(0x0a);
-        writeFileSync(logPath, nl >= 0 ? tail.subarray(nl + 1) : tail);
-    }
-    catch { /* file may not exist yet */ }
-}
 /** Rotate a log file: foo.log → foo.log.1 → foo.log.2 → foo.log.3 (deleted) */
 export function rotateLogIfNeeded(logPath, maxSize = MAX_LOG_SIZE, maxFiles = ROTATE_MAX_FILES) {
     try {
@@ -52,7 +38,7 @@ export function rotateLogIfNeeded(logPath, maxSize = MAX_LOG_SIZE, maxFiles = RO
 }
 export function createLogger(level = "info") {
     mkdirSync(DATA_DIR, { recursive: true });
-    truncateLogIfNeeded(LOG_FILE);
+    rotateLogIfNeeded(LOG_FILE);
     return pino({
         level,
         transport: {

package/dist/logger.js.map

@@ -1 +1 @@
-{"version":3,"file":"logger.js","sourceRoot":"","sources":["../src/logger.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"logger.js","sourceRoot":"","sources":["../src/logger.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACjG,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAC;AAE1C,MAAM,QAAQ,GAAG,YAAY,EAAE,CAAC;AAChC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;AAC9C,MAAM,YAAY,GAAG,EAAE,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC,QAAQ;AAC/C,MAAM,gBAAgB,GAAG,CAAC,CAAC;AAE3B,+EAA+E;AAC/E,MAAM,UAAU,iBAAiB,CAAC,OAAe,EAAE,OAAO,GAAG,YAAY,EAAE,QAAQ,GAAG,gBAAgB;IACpG,IAAI,CAAC;QACH,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC;YAAE,OAAO;QACjC,MAAM,IAAI,GAAG,QAAQ,CAAC,OAAO,CAAC,CAAC;QAC/B,IAAI,IAAI,CAAC,IAAI,GAAG,OAAO;YAAE,OAAO;QAEhC,+BAA+B;QAC/B,KAAK,IAAI,CAAC,GAAG,QAAQ,EAAE,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;YACnC,MAAM,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC;YACtD,MAAM,GAAG,GAAG,GAAG,OAAO,IAAI,CAAC,EAAE,CAAC;YAC9B,IAAI,CAAC,KAAK,QAAQ,EAAE,CAAC;gBAAC,IAAI,CAAC;oBAAC,UAAU,CAAC,GAAG,CAAC,CAAC;gBAAC,CAAC;gBAAC,MAAM,CAAC,CAAA,CAAC;YAAC,CAAC;YACzD,IAAI,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;gBAAC,IAAI,CAAC;oBAAC,UAAU,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;gBAAC,CAAC;gBAAC,MAAM,CAAC,CAAA,CAAC;YAAC,CAAC;QACjE,CAAC;QACD,uBAAuB;QACvB,aAAa,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC;IAC7B,CAAC;IAAC,MAAM,CAAC,CAAC,iBAAiB,CAAC,CAAC;AAC/B,CAAC;AAED,MAAM,UAAU,YAAY,CAAC,QAAgB,MAAM;IACjD,SAAS,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;IACzC,iBAAiB,CAAC,QAAQ,CAAC,CAAC;IAC5B,OAAO,IAAI,CAAC;QACV,KAAK;QACL,SAAS,EAAE;YACT,OAAO,EAAE;gBACP;oBACE,MAAM,EAAE,aAAa;oBACrB,OAAO,EAAE;wBACP,WAAW,EAAE,CAAC;wBACd,QAAQ,EAAE,IAAI;wBACd,aAAa,EAAE,cAAc;wBAC7B,MAAM,EAAE,cAAc;qBACvB;oBACD,KAAK;iBACN;gBACD;oBACE,MAAM,EAAE,aAAa;oBACrB,OAAO,EAAE;wBACP,WAAW,EAAE,QAAQ;wBACrB,QAAQ,EAAE,KAAK;wBACf,aAAa,EAAE,cAAc;wBAC7B,MAAM,EAAE,cAAc;qBACvB;oBACD,KAAK;iBACN;aACF;SACF;KACF,CAAC,CAAC;AACL,CAAC"}

package/package.json

@@ -1,11 +1,9 @@
 {
   "name": "@songsid/agend",
-  "version": "0.0.4",
-  "description": "Multi-agent fleet daemon \u2014 run any coding CLI (Claude, Gemini, Codex, OpenCode) from Telegram",
+  "version": "0.0.6",
+  "description": "Multi-agent fleet daemon — run any coding CLI (Claude, Gemini, Codex, OpenCode) from Telegram",
   "type": "module",
-  "workspaces": [
-    "plugins/*"
-  ],
+  "workspaces": ["plugins/*"],
   "bin": {
     "agend": "./dist/cli.js",
     "agend-agent": "./dist/agent-cli.js"

package/dist/fleet-dashboard-html.d.ts

@@ -1,6 +0,0 @@
-/**
- * Activity / fleet dashboard HTML served by the daemon's health server.
- * Pure constant — extracted from fleet-manager.ts to keep that module under
- * a manageable size (P4.1).
- */
-export declare const ACTIVITY_VIEWER_HTML = "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n<title>AgEnD Activity Viewer</title>\n<script src=\"https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js\"></script>\n<style>\n  * { margin: 0; padding: 0; box-sizing: border-box; }\n  body { background: #0d1117; color: #c9d1d9; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', monospace; }\n  .header { padding: 16px 24px; border-bottom: 1px solid #21262d; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }\n  .header h1 { font-size: 18px; color: #58a6ff; font-weight: 600; }\n  .controls { display: flex; gap: 8px; align-items: center; }\n  .controls select, .controls button { background: #21262d; color: #c9d1d9; border: 1px solid #30363d; border-radius: 6px; padding: 4px 10px; font-size: 13px; cursor: pointer; }\n  .controls button.active { background: #1f6feb; border-color: #1f6feb; color: #fff; }\n  .controls button:hover { border-color: #58a6ff; }\n  .speed-group { display: flex; gap: 2px; }\n  .speed-group button { border-radius: 0; }\n  .speed-group button:first-child { border-radius: 6px 0 0 6px; }\n  .speed-group button:last-child { border-radius: 0 6px 6px 0; }\n  .status { font-size: 12px; color: #8b949e; margin-left: auto; }\n  #diagram { padding: 24px; overflow-x: auto; }\n  #diagram .mermaid { background: transparent; }\n  #diagram svg { max-width: 100%; }\n  .feed { padding: 12px 24px; max-height: 300px; overflow-y: auto; border-top: 1px solid #21262d; font-size: 13px; line-height: 1.8; }\n  .feed-line { opacity: 0.6; }\n  .feed-line.visible { opacity: 1; }\n  .feed-line .time { color: #8b949e; }\n  .feed-line .msg { color: #58a6ff; }\n  .feed-line .tool { color: #d29922; }\n  .feed-line .task { color: #3fb950; }\n  /* Agent Board */\n  .board { padding: 16px 24px; display: flex; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid #21262d; }\n  .card { background: #161b22; border: 1px solid #30363d; border-radius: 8px; padding: 12px 14px; min-width: 200px; flex: 1; max-width: 280px; transition: border-color 0.3s; }\n  .card.flash { border-color: #58a6ff; }\n  .card-header { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }\n  .card-header .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }\n  .card-header .dot.running { background: #3fb950; }\n  .card-header .dot.stopped { background: #8b949e; }\n  .card-header .dot.crashed { background: #f85149; }\n  .card-header .name { font-weight: 600; font-size: 14px; }\n  .card-row { font-size: 12px; color: #8b949e; line-height: 1.6; }\n  .card-row span { color: #c9d1d9; }\n  .card-task { font-size: 12px; color: #d29922; margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }\n  .board-empty { font-size: 13px; color: #8b949e; padding: 8px 0; }\n  .section-label { font-size: 11px; color: #484f58; text-transform: uppercase; letter-spacing: 1px; padding: 10px 24px 0; }\n  .tabs { display: flex; gap: 0; padding: 0 24px; border-bottom: 1px solid #21262d; }\n  .tab { padding: 8px 16px; font-size: 13px; color: #8b949e; cursor: pointer; border: none; border-bottom: 2px solid transparent; background: none; }\n  .tab.active { color: #58a6ff; border-bottom-color: #58a6ff; }\n  .tab:hover { color: #c9d1d9; }\n  .view { display: none; }\n  .view.active { display: block; }\n  #graphCanvas { width: 100%; background: #0d1117; display: block; }\n</style>\n</head>\n<body>\n<div class=\"header\">\n  <h1>AgEnD Activity</h1>\n  <div class=\"controls\">\n    <select id=\"range\">\n      <option value=\"1h\">1h</option>\n      <option value=\"2h\" selected>2h</option>\n      <option value=\"4h\">4h</option>\n      <option value=\"8h\">8h</option>\n      <option value=\"24h\">24h</option>\n    </select>\n    <button id=\"btnLoad\">Load</button>\n    <button id=\"btnPlay\">\u25B6 Play</button>\n    <button id=\"btnPause\" style=\"display:none\">\u23F8 Pause</button>\n    <div class=\"speed-group\">\n      <button class=\"speed\" data-speed=\"1\">1x</button>\n      <button class=\"speed active\" data-speed=\"2\">2x</button>\n      <button class=\"speed\" data-speed=\"5\">5x</button>\n      <button class=\"speed\" data-speed=\"10\">10x</button>\n    </div>\n  </div>\n  <div class=\"status\" id=\"status\">Ready</div>\n</div>\n<div class=\"section-label\">Agents</div>\n<div class=\"board\" id=\"board\"><div class=\"board-empty\">Loading...</div></div>\n<div class=\"tabs\">\n  <button class=\"tab active\" data-view=\"graph\">Network Graph</button>\n  <button class=\"tab\" data-view=\"seq\">Sequence Diagram</button>\n</div>\n<div id=\"viewGraph\" class=\"view active\"><canvas id=\"graphCanvas\" height=\"400\"></canvas></div>\n<div id=\"viewSeq\" class=\"view\"><div id=\"diagram\"><div class=\"mermaid\" id=\"mermaidEl\"></div></div></div>\n<div class=\"feed\" id=\"feed\"></div>\n\n<script>\nmermaid.initialize({ startOnLoad: false, theme: 'dark', sequence: { mirrorActors: false, messageAlign: 'left' } });\n\nlet rows = [];\nlet speed = 2;\nlet playing = false;\nlet playTimeout = null;\nlet visibleCount = 0;\n\ndocument.querySelectorAll('.speed').forEach(btn => {\n  btn.addEventListener('click', () => {\n    document.querySelectorAll('.speed').forEach(b => b.classList.remove('active'));\n    btn.classList.add('active');\n    speed = parseInt(btn.dataset.speed);\n  });\n});\n\ndocument.getElementById('btnLoad').addEventListener('click', load);\ndocument.getElementById('btnPlay').addEventListener('click', startReplay);\ndocument.getElementById('btnPause').addEventListener('click', pauseReplay);\n\nasync function load() {\n  const range = document.getElementById('range').value;\n  document.getElementById('status').textContent = 'Loading...';\n  try {\n    const resp = await fetch('/api/activity?since=' + range + '&limit=500');\n    rows = await resp.json();\n    document.getElementById('status').textContent = rows.length + ' events loaded';\n    visibleCount = rows.length;\n    renderFull();\n  } catch (e) {\n    document.getElementById('status').textContent = 'Error: ' + e.message;\n  }\n}\n\nfunction buildMermaid(entries) {\n  const participants = new Set();\n  entries.forEach(r => { participants.add(r.sender); if (r.receiver) participants.add(r.receiver); });\n  const aliases = new Map();\n  let idx = 0;\n  participants.forEach(p => {\n    const a = p.length > 12 ? String.fromCharCode(65 + idx++) : p;\n    aliases.set(p, a);\n  });\n\n  let lines = ['sequenceDiagram'];\n  aliases.forEach((a, p) => lines.push('    participant ' + a + ' as ' + p));\n\n  entries.forEach(r => {\n    const s = aliases.get(r.sender) || r.sender;\n    const summary = (r.summary || '').replace(/\"/g, \"'\").slice(0, 80);\n    if (r.event === 'tool_call') {\n      lines.push('    Note over ' + s + ': \uD83D\uDD27 ' + summary);\n    } else if (r.receiver) {\n      const recv = aliases.get(r.receiver) || r.receiver;\n      lines.push('    ' + s + '->>' + recv + ': ' + summary);\n    } else {\n      lines.push('    Note over ' + s + ': ' + summary);\n    }\n  });\n  return lines.join('\\n');\n}\n\nasync function renderDiagram(entries) {\n  const code = buildMermaid(entries);\n  const el = document.getElementById('mermaidEl');\n  el.removeAttribute('data-processed');\n  el.innerHTML = code;\n  try { await mermaid.run({ nodes: [el] }); } catch {}\n}\n\nfunction renderFeed(count) {\n  const feed = document.getElementById('feed');\n  feed.innerHTML = '';\n  rows.forEach((r, i) => {\n    const vis = i < count;\n    const time = (r.timestamp || '').replace('T', ' ').slice(11, 19);\n    const icon = r.event === 'message' ? '\uD83D\uDCAC' : r.event === 'tool_call' ? '\uD83D\uDD27' : '\uD83D\uDCCB';\n    const cls = r.event === 'tool_call' ? 'tool' : r.event === 'task_update' ? 'task' : 'msg';\n    const arrow = r.receiver ? r.sender + ' \u2192 ' + r.receiver : r.sender;\n    const line = document.createElement('div');\n    line.className = 'feed-line' + (vis ? ' visible' : '');\n    line.innerHTML = '<span class=\"time\">' + time + '</span> ' + icon + ' <span class=\"' + cls + '\">' + arrow + ': ' + (r.summary || '') + '</span>';\n    feed.appendChild(line);\n  });\n  if (count > 0) feed.lastElementChild?.scrollIntoView({ behavior: 'smooth' });\n}\n\nfunction renderFull() {\n  visibleCount = rows.length;\n  renderDiagram(rows);\n  renderFeed(rows.length);\n}\n\nfunction startReplay() {\n  playing = true;\n  visibleCount = 0;\n  document.getElementById('btnPlay').style.display = 'none';\n  document.getElementById('btnPause').style.display = '';\n  stepReplay();\n}\n\nfunction pauseReplay() {\n  playing = false;\n  if (playTimeout) clearTimeout(playTimeout);\n  document.getElementById('btnPlay').style.display = '';\n  document.getElementById('btnPause').style.display = 'none';\n}\n\nfunction stepReplay() {\n  if (!playing || visibleCount >= rows.length) {\n    pauseReplay();\n    document.getElementById('status').textContent = 'Replay complete';\n    return;\n  }\n  visibleCount++;\n  const visible = rows.slice(0, visibleCount);\n  renderDiagram(visible);\n  renderFeed(visibleCount);\n  document.getElementById('status').textContent = visibleCount + '/' + rows.length;\n\n  // Calculate delay from real timestamps\n  let delayMs = 500;\n  if (visibleCount < rows.length) {\n    const curr = new Date(rows[visibleCount - 1].timestamp).getTime();\n    const next = new Date(rows[visibleCount].timestamp).getTime();\n    delayMs = Math.max(100, Math.min(3000, (next - curr) / speed));\n  }\n  playTimeout = setTimeout(stepReplay, delayMs);\n}\n\n// \u2500\u2500 Tab switching \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\ndocument.querySelectorAll('.tab').forEach(tab => {\n  tab.addEventListener('click', () => {\n    document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));\n    document.querySelectorAll('.view').forEach(v => v.classList.remove('active'));\n    tab.classList.add('active');\n    document.getElementById('view' + (tab.dataset.view === 'graph' ? 'Graph' : 'Seq')).classList.add('active');\n    if (tab.dataset.view === 'graph') resizeCanvas();\n  });\n});\n\n// \u2500\u2500 Network Graph \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\nconst canvas = document.getElementById('graphCanvas');\nconst ctx2d = canvas.getContext('2d');\nlet graphNodes = [];     // {name, x, y, color, isGeneral}\nlet graphEdges = new Map(); // \"a->b\" \u2192 {from, to}\nlet pulses = [];         // {fromX, fromY, toX, toY, progress, color}\n\nfunction resizeCanvas() {\n  canvas.width = canvas.parentElement.offsetWidth;\n  canvas.height = 400;\n  layoutNodes();\n}\n\nfunction layoutNodes() {\n  if (graphNodes.length === 0) return;\n  const cx = canvas.width / 2;\n  const cy = canvas.height / 2;\n  const radius = Math.min(cx, cy) - 60;\n  // Find general (center)\n  const general = graphNodes.find(n => n.isGeneral);\n  const others = graphNodes.filter(n => !n.isGeneral);\n  if (general) { general.x = cx; general.y = cy; }\n  others.forEach((n, i) => {\n    const angle = (2 * Math.PI * i / others.length) - Math.PI / 2;\n    n.x = cx + radius * Math.cos(angle);\n    n.y = cy + radius * Math.sin(angle);\n  });\n}\n\nfunction updateGraphFromFleet(data) {\n  const names = new Set();\n  data.instances.forEach(inst => names.add(inst.name));\n  // Add user node if activity mentions it\n  rows.forEach(r => { names.add(r.sender); if (r.receiver) names.add(r.receiver); });\n  // Rebuild nodes (preserve positions if same set)\n  const oldMap = new Map(graphNodes.map(n => [n.name, n]));\n  graphNodes = [...names].map(name => {\n    const old = oldMap.get(name);\n    const inst = data.instances.find(i => i.name === name);\n    const color = !inst ? '#8b949e' : inst.status === 'running' ? '#3fb950' : inst.status === 'crashed' ? '#f85149' : '#484f58';\n    return { name, x: old?.x ?? 0, y: old?.y ?? 0, color, isGeneral: inst?.general_topic ?? false };\n  });\n  layoutNodes();\n  // Build edges from activity\n  graphEdges.clear();\n  rows.forEach(r => {\n    if (r.receiver && r.event === 'message') {\n      const key = r.sender + '->' + r.receiver;\n      graphEdges.set(key, { from: r.sender, to: r.receiver });\n    }\n  });\n}\n\nfunction spawnPulse(sender, receiver, event) {\n  const from = graphNodes.find(n => n.name === sender);\n  const to = graphNodes.find(n => n.name === (receiver || sender));\n  if (!from || !to) return;\n  const colors = { message: '#58a6ff', tool_call: '#d29922', task_update: '#3fb950' };\n  pulses.push({ fromX: from.x, fromY: from.y, toX: to.x, toY: to.y, progress: 0, color: colors[event] || '#58a6ff' });\n}\n\nfunction drawGraph() {\n  if (!ctx2d) return;\n  ctx2d.clearRect(0, 0, canvas.width, canvas.height);\n  // Draw edges\n  ctx2d.strokeStyle = '#21262d';\n  ctx2d.lineWidth = 1;\n  graphEdges.forEach(e => {\n    const from = graphNodes.find(n => n.name === e.from);\n    const to = graphNodes.find(n => n.name === e.to);\n    if (from && to) {\n      ctx2d.beginPath();\n      ctx2d.moveTo(from.x, from.y);\n      ctx2d.lineTo(to.x, to.y);\n      ctx2d.stroke();\n    }\n  });\n  // Draw pulses\n  pulses = pulses.filter(p => p.progress <= 1);\n  pulses.forEach(p => {\n    p.progress += 0.02;\n    const x = p.fromX + (p.toX - p.fromX) * p.progress;\n    const y = p.fromY + (p.toY - p.fromY) * p.progress;\n    ctx2d.beginPath();\n    ctx2d.arc(x, y, 5, 0, Math.PI * 2);\n    ctx2d.fillStyle = p.color;\n    ctx2d.shadowColor = p.color;\n    ctx2d.shadowBlur = 12;\n    ctx2d.fill();\n    ctx2d.shadowBlur = 0;\n  });\n  // Draw nodes\n  graphNodes.forEach(n => {\n    // Glow\n    ctx2d.beginPath();\n    ctx2d.arc(n.x, n.y, n.isGeneral ? 28 : 22, 0, Math.PI * 2);\n    ctx2d.fillStyle = n.color + '22';\n    ctx2d.fill();\n    // Circle\n    ctx2d.beginPath();\n    ctx2d.arc(n.x, n.y, n.isGeneral ? 24 : 18, 0, Math.PI * 2);\n    ctx2d.fillStyle = '#161b22';\n    ctx2d.strokeStyle = n.color;\n    ctx2d.lineWidth = 2;\n    ctx2d.fill();\n    ctx2d.stroke();\n    // Label\n    ctx2d.fillStyle = '#c9d1d9';\n    ctx2d.font = (n.isGeneral ? '12' : '11') + 'px -apple-system, monospace';\n    ctx2d.textAlign = 'center';\n    ctx2d.fillText(n.name.length > 14 ? n.name.slice(0, 12) + '..' : n.name, n.x, n.y + (n.isGeneral ? 38 : 32));\n  });\n  requestAnimationFrame(drawGraph);\n}\n\n// Hook into replay: spawn pulses when stepping\nconst origStep = stepReplay;\nstepReplay = function() {\n  const prevCount = visibleCount;\n  origStep();\n  if (visibleCount > prevCount && visibleCount <= rows.length) {\n    const r = rows[visibleCount - 1];\n    spawnPulse(r.sender, r.receiver, r.event);\n  }\n};\n\n// Hook into full load: spawn pulses for all visible events on load\nconst origRenderFull = renderFull;\nrenderFull = function() {\n  origRenderFull();\n  // Update graph nodes from fleet data (if available)\n  fetch('/api/fleet').then(r => r.json()).then(data => {\n    updateGraphFromFleet(data);\n  }).catch(() => {\n    // Fallback: build nodes from activity only\n    const names = new Set();\n    rows.forEach(r => { names.add(r.sender); if (r.receiver) names.add(r.receiver); });\n    graphNodes = [...names].map(n => ({ name: n, x: 0, y: 0, color: '#8b949e', isGeneral: n === 'general' }));\n    layoutNodes();\n  });\n};\n\nresizeCanvas();\nwindow.addEventListener('resize', resizeCanvas);\nrequestAnimationFrame(drawGraph);\n\n// \u2500\u2500 Agent Board \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n\nlet prevBoard = '';\n\nasync function loadBoard() {\n  try {\n    const resp = await fetch('/api/fleet');\n    const data = await resp.json();\n    renderBoard(data);\n  } catch {}\n}\n\nfunction renderBoard(data) {\n  const board = document.getElementById('board');\n  const cards = data.instances.map(inst => {\n    const statusDot = inst.status === 'running' ? 'running' : inst.status === 'crashed' ? 'crashed' : 'stopped';\n    const icon = inst.status === 'running' ? '\uD83D\uDFE2' : inst.status === 'crashed' ? '\uD83D\uDD34' : '\u26AA';\n    const role = inst.general_topic ? 'coordinator' : inst.description || 'worker';\n    const costStr = '$' + (inst.costCents / 100).toFixed(2);\n    const lastMs = inst.lastActivity;\n    let lastStr = '\u2014';\n    if (lastMs) {\n      const ago = Math.floor((Date.now() - lastMs) / 1000);\n      lastStr = ago < 60 ? ago + 's ago' : ago < 3600 ? Math.floor(ago/60) + 'm ago' : Math.floor(ago/3600) + 'h ago';\n    }\n    const ipc = inst.ipc ? '\u2713' : '\u2717';\n    const rl = inst.rateLimits ? ' \u00B7 5h:' + inst.rateLimits.five_hour_pct + '%' : '';\n    const taskLine = inst.currentTask\n      ? '<div class=\"card-task\">\uD83D\uDCCC ' + inst.currentTask + '</div>'\n      : '<div class=\"card-task\" style=\"color:#484f58\">(idle)</div>';\n    return '<div class=\"card\" data-name=\"' + inst.name + '\">' +\n      '<div class=\"card-header\"><div class=\"dot ' + statusDot + '\"></div><div class=\"name\">' + inst.name + '</div></div>' +\n      '<div class=\"card-row\">' + role.slice(0, 30) + '</div>' +\n      '<div class=\"card-row\">Backend: <span>' + inst.backend + '</span> \u00B7 Tools: <span>' + inst.tool_set + '</span></div>' +\n      '<div class=\"card-row\">IPC: <span>' + ipc + '</span> \u00B7 Cost: <span>' + costStr + '</span>' + rl + '</div>' +\n      '<div class=\"card-row\">Last: <span>' + lastStr + '</span></div>' +\n      taskLine +\n      '</div>';\n  });\n\n  const newHtml = cards.join('');\n  if (newHtml !== prevBoard) {\n    board.innerHTML = newHtml;\n    // Flash changed cards\n    board.querySelectorAll('.card').forEach(c => {\n      c.classList.add('flash');\n      setTimeout(() => c.classList.remove('flash'), 1000);\n    });\n    prevBoard = newHtml;\n  }\n}\n\n// Auto-refresh board every 10s\nsetInterval(loadBoard, 10000);\n\n// Auto-load on page open\nloadBoard();\nload();\n</script>\n</body>\n</html>";

package/dist/fleet-dashboard-html.js

@@ -1,443 +0,0 @@
-/**
- * Activity / fleet dashboard HTML served by the daemon's health server.
- * Pure constant — extracted from fleet-manager.ts to keep that module under
- * a manageable size (P4.1).
- */
-export const ACTIVITY_VIEWER_HTML = `<!DOCTYPE html>
-<html lang="en">
-<head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>AgEnD Activity Viewer</title>
-<script src="https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js"></script>
-<style>
-  * { margin: 0; padding: 0; box-sizing: border-box; }
-  body { background: #0d1117; color: #c9d1d9; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', monospace; }
-  .header { padding: 16px 24px; border-bottom: 1px solid #21262d; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
-  .header h1 { font-size: 18px; color: #58a6ff; font-weight: 600; }
-  .controls { display: flex; gap: 8px; align-items: center; }
-  .controls select, .controls button { background: #21262d; color: #c9d1d9; border: 1px solid #30363d; border-radius: 6px; padding: 4px 10px; font-size: 13px; cursor: pointer; }
-  .controls button.active { background: #1f6feb; border-color: #1f6feb; color: #fff; }
-  .controls button:hover { border-color: #58a6ff; }
-  .speed-group { display: flex; gap: 2px; }
-  .speed-group button { border-radius: 0; }
-  .speed-group button:first-child { border-radius: 6px 0 0 6px; }
-  .speed-group button:last-child { border-radius: 0 6px 6px 0; }
-  .status { font-size: 12px; color: #8b949e; margin-left: auto; }
-  #diagram { padding: 24px; overflow-x: auto; }
-  #diagram .mermaid { background: transparent; }
-  #diagram svg { max-width: 100%; }
-  .feed { padding: 12px 24px; max-height: 300px; overflow-y: auto; border-top: 1px solid #21262d; font-size: 13px; line-height: 1.8; }
-  .feed-line { opacity: 0.6; }
-  .feed-line.visible { opacity: 1; }
-  .feed-line .time { color: #8b949e; }
-  .feed-line .msg { color: #58a6ff; }
-  .feed-line .tool { color: #d29922; }
-  .feed-line .task { color: #3fb950; }
-  /* Agent Board */
-  .board { padding: 16px 24px; display: flex; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid #21262d; }
-  .card { background: #161b22; border: 1px solid #30363d; border-radius: 8px; padding: 12px 14px; min-width: 200px; flex: 1; max-width: 280px; transition: border-color 0.3s; }
-  .card.flash { border-color: #58a6ff; }
-  .card-header { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
-  .card-header .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
-  .card-header .dot.running { background: #3fb950; }
-  .card-header .dot.stopped { background: #8b949e; }
-  .card-header .dot.crashed { background: #f85149; }
-  .card-header .name { font-weight: 600; font-size: 14px; }
-  .card-row { font-size: 12px; color: #8b949e; line-height: 1.6; }
-  .card-row span { color: #c9d1d9; }
-  .card-task { font-size: 12px; color: #d29922; margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-  .board-empty { font-size: 13px; color: #8b949e; padding: 8px 0; }
-  .section-label { font-size: 11px; color: #484f58; text-transform: uppercase; letter-spacing: 1px; padding: 10px 24px 0; }
-  .tabs { display: flex; gap: 0; padding: 0 24px; border-bottom: 1px solid #21262d; }
-  .tab { padding: 8px 16px; font-size: 13px; color: #8b949e; cursor: pointer; border: none; border-bottom: 2px solid transparent; background: none; }
-  .tab.active { color: #58a6ff; border-bottom-color: #58a6ff; }
-  .tab:hover { color: #c9d1d9; }
-  .view { display: none; }
-  .view.active { display: block; }
-  #graphCanvas { width: 100%; background: #0d1117; display: block; }
-</style>
-</head>
-<body>
-<div class="header">
-  <h1>AgEnD Activity</h1>
-  <div class="controls">
-    <select id="range">
-      <option value="1h">1h</option>
-      <option value="2h" selected>2h</option>
-      <option value="4h">4h</option>
-      <option value="8h">8h</option>
-      <option value="24h">24h</option>
-    </select>
-    <button id="btnLoad">Load</button>
-    <button id="btnPlay">▶ Play</button>
-    <button id="btnPause" style="display:none">⏸ Pause</button>
-    <div class="speed-group">
-      <button class="speed" data-speed="1">1x</button>
-      <button class="speed active" data-speed="2">2x</button>
-      <button class="speed" data-speed="5">5x</button>
-      <button class="speed" data-speed="10">10x</button>
-    </div>
-  </div>
-  <div class="status" id="status">Ready</div>
-</div>
-<div class="section-label">Agents</div>
-<div class="board" id="board"><div class="board-empty">Loading...</div></div>
-<div class="tabs">
-  <button class="tab active" data-view="graph">Network Graph</button>
-  <button class="tab" data-view="seq">Sequence Diagram</button>
-</div>
-<div id="viewGraph" class="view active"><canvas id="graphCanvas" height="400"></canvas></div>
-<div id="viewSeq" class="view"><div id="diagram"><div class="mermaid" id="mermaidEl"></div></div></div>
-<div class="feed" id="feed"></div>
-
-<script>
-mermaid.initialize({ startOnLoad: false, theme: 'dark', sequence: { mirrorActors: false, messageAlign: 'left' } });
-
-let rows = [];
-let speed = 2;
-let playing = false;
-let playTimeout = null;
-let visibleCount = 0;
-
-document.querySelectorAll('.speed').forEach(btn => {
-  btn.addEventListener('click', () => {
-    document.querySelectorAll('.speed').forEach(b => b.classList.remove('active'));
-    btn.classList.add('active');
-    speed = parseInt(btn.dataset.speed);
-  });
-});
-
-document.getElementById('btnLoad').addEventListener('click', load);
-document.getElementById('btnPlay').addEventListener('click', startReplay);
-document.getElementById('btnPause').addEventListener('click', pauseReplay);
-
-async function load() {
-  const range = document.getElementById('range').value;
-  document.getElementById('status').textContent = 'Loading...';
-  try {
-    const resp = await fetch('/api/activity?since=' + range + '&limit=500');
-    rows = await resp.json();
-    document.getElementById('status').textContent = rows.length + ' events loaded';
-    visibleCount = rows.length;
-    renderFull();
-  } catch (e) {
-    document.getElementById('status').textContent = 'Error: ' + e.message;
-  }
-}
-
-function buildMermaid(entries) {
-  const participants = new Set();
-  entries.forEach(r => { participants.add(r.sender); if (r.receiver) participants.add(r.receiver); });
-  const aliases = new Map();
-  let idx = 0;
-  participants.forEach(p => {
-    const a = p.length > 12 ? String.fromCharCode(65 + idx++) : p;
-    aliases.set(p, a);
-  });
-
-  let lines = ['sequenceDiagram'];
-  aliases.forEach((a, p) => lines.push('    participant ' + a + ' as ' + p));
-
-  entries.forEach(r => {
-    const s = aliases.get(r.sender) || r.sender;
-    const summary = (r.summary || '').replace(/"/g, "'").slice(0, 80);
-    if (r.event === 'tool_call') {
-      lines.push('    Note over ' + s + ': 🔧 ' + summary);
-    } else if (r.receiver) {
-      const recv = aliases.get(r.receiver) || r.receiver;
-      lines.push('    ' + s + '->>' + recv + ': ' + summary);
-    } else {
-      lines.push('    Note over ' + s + ': ' + summary);
-    }
-  });
-  return lines.join('\\n');
-}
-
-async function renderDiagram(entries) {
-  const code = buildMermaid(entries);
-  const el = document.getElementById('mermaidEl');
-  el.removeAttribute('data-processed');
-  el.innerHTML = code;
-  try { await mermaid.run({ nodes: [el] }); } catch {}
-}
-
-function renderFeed(count) {
-  const feed = document.getElementById('feed');
-  feed.innerHTML = '';
-  rows.forEach((r, i) => {
-    const vis = i < count;
-    const time = (r.timestamp || '').replace('T', ' ').slice(11, 19);
-    const icon = r.event === 'message' ? '💬' : r.event === 'tool_call' ? '🔧' : '📋';
-    const cls = r.event === 'tool_call' ? 'tool' : r.event === 'task_update' ? 'task' : 'msg';
-    const arrow = r.receiver ? r.sender + ' → ' + r.receiver : r.sender;
-    const line = document.createElement('div');
-    line.className = 'feed-line' + (vis ? ' visible' : '');
-    line.innerHTML = '<span class="time">' + time + '</span> ' + icon + ' <span class="' + cls + '">' + arrow + ': ' + (r.summary || '') + '</span>';
-    feed.appendChild(line);
-  });
-  if (count > 0) feed.lastElementChild?.scrollIntoView({ behavior: 'smooth' });
-}
-
-function renderFull() {
-  visibleCount = rows.length;
-  renderDiagram(rows);
-  renderFeed(rows.length);
-}
-
-function startReplay() {
-  playing = true;
-  visibleCount = 0;
-  document.getElementById('btnPlay').style.display = 'none';
-  document.getElementById('btnPause').style.display = '';
-  stepReplay();
-}
-
-function pauseReplay() {
-  playing = false;
-  if (playTimeout) clearTimeout(playTimeout);
-  document.getElementById('btnPlay').style.display = '';
-  document.getElementById('btnPause').style.display = 'none';
-}
-
-function stepReplay() {
-  if (!playing || visibleCount >= rows.length) {
-    pauseReplay();
-    document.getElementById('status').textContent = 'Replay complete';
-    return;
-  }
-  visibleCount++;
-  const visible = rows.slice(0, visibleCount);
-  renderDiagram(visible);
-  renderFeed(visibleCount);
-  document.getElementById('status').textContent = visibleCount + '/' + rows.length;
-
-  // Calculate delay from real timestamps
-  let delayMs = 500;
-  if (visibleCount < rows.length) {
-    const curr = new Date(rows[visibleCount - 1].timestamp).getTime();
-    const next = new Date(rows[visibleCount].timestamp).getTime();
-    delayMs = Math.max(100, Math.min(3000, (next - curr) / speed));
-  }
-  playTimeout = setTimeout(stepReplay, delayMs);
-}
-
-// ── Tab switching ────────────────────────────────
-document.querySelectorAll('.tab').forEach(tab => {
-  tab.addEventListener('click', () => {
-    document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
-    document.querySelectorAll('.view').forEach(v => v.classList.remove('active'));
-    tab.classList.add('active');
-    document.getElementById('view' + (tab.dataset.view === 'graph' ? 'Graph' : 'Seq')).classList.add('active');
-    if (tab.dataset.view === 'graph') resizeCanvas();
-  });
-});
-
-// ── Network Graph ────────────────────────────────
-const canvas = document.getElementById('graphCanvas');
-const ctx2d = canvas.getContext('2d');
-let graphNodes = [];     // {name, x, y, color, isGeneral}
-let graphEdges = new Map(); // "a->b" → {from, to}
-let pulses = [];         // {fromX, fromY, toX, toY, progress, color}
-
-function resizeCanvas() {
-  canvas.width = canvas.parentElement.offsetWidth;
-  canvas.height = 400;
-  layoutNodes();
-}
-
-function layoutNodes() {
-  if (graphNodes.length === 0) return;
-  const cx = canvas.width / 2;
-  const cy = canvas.height / 2;
-  const radius = Math.min(cx, cy) - 60;
-  // Find general (center)
-  const general = graphNodes.find(n => n.isGeneral);
-  const others = graphNodes.filter(n => !n.isGeneral);
-  if (general) { general.x = cx; general.y = cy; }
-  others.forEach((n, i) => {
-    const angle = (2 * Math.PI * i / others.length) - Math.PI / 2;
-    n.x = cx + radius * Math.cos(angle);
-    n.y = cy + radius * Math.sin(angle);
-  });
-}
-
-function updateGraphFromFleet(data) {
-  const names = new Set();
-  data.instances.forEach(inst => names.add(inst.name));
-  // Add user node if activity mentions it
-  rows.forEach(r => { names.add(r.sender); if (r.receiver) names.add(r.receiver); });
-  // Rebuild nodes (preserve positions if same set)
-  const oldMap = new Map(graphNodes.map(n => [n.name, n]));
-  graphNodes = [...names].map(name => {
-    const old = oldMap.get(name);
-    const inst = data.instances.find(i => i.name === name);
-    const color = !inst ? '#8b949e' : inst.status === 'running' ? '#3fb950' : inst.status === 'crashed' ? '#f85149' : '#484f58';
-    return { name, x: old?.x ?? 0, y: old?.y ?? 0, color, isGeneral: inst?.general_topic ?? false };
-  });
-  layoutNodes();
-  // Build edges from activity
-  graphEdges.clear();
-  rows.forEach(r => {
-    if (r.receiver && r.event === 'message') {
-      const key = r.sender + '->' + r.receiver;
-      graphEdges.set(key, { from: r.sender, to: r.receiver });
-    }
-  });
-}
-
-function spawnPulse(sender, receiver, event) {
-  const from = graphNodes.find(n => n.name === sender);
-  const to = graphNodes.find(n => n.name === (receiver || sender));
-  if (!from || !to) return;
-  const colors = { message: '#58a6ff', tool_call: '#d29922', task_update: '#3fb950' };
-  pulses.push({ fromX: from.x, fromY: from.y, toX: to.x, toY: to.y, progress: 0, color: colors[event] || '#58a6ff' });
-}
-
-function drawGraph() {
-  if (!ctx2d) return;
-  ctx2d.clearRect(0, 0, canvas.width, canvas.height);
-  // Draw edges
-  ctx2d.strokeStyle = '#21262d';
-  ctx2d.lineWidth = 1;
-  graphEdges.forEach(e => {
-    const from = graphNodes.find(n => n.name === e.from);
-    const to = graphNodes.find(n => n.name === e.to);
-    if (from && to) {
-      ctx2d.beginPath();
-      ctx2d.moveTo(from.x, from.y);
-      ctx2d.lineTo(to.x, to.y);
-      ctx2d.stroke();
-    }
-  });
-  // Draw pulses
-  pulses = pulses.filter(p => p.progress <= 1);
-  pulses.forEach(p => {
-    p.progress += 0.02;
-    const x = p.fromX + (p.toX - p.fromX) * p.progress;
-    const y = p.fromY + (p.toY - p.fromY) * p.progress;
-    ctx2d.beginPath();
-    ctx2d.arc(x, y, 5, 0, Math.PI * 2);
-    ctx2d.fillStyle = p.color;
-    ctx2d.shadowColor = p.color;
-    ctx2d.shadowBlur = 12;
-    ctx2d.fill();
-    ctx2d.shadowBlur = 0;
-  });
-  // Draw nodes
-  graphNodes.forEach(n => {
-    // Glow
-    ctx2d.beginPath();
-    ctx2d.arc(n.x, n.y, n.isGeneral ? 28 : 22, 0, Math.PI * 2);
-    ctx2d.fillStyle = n.color + '22';
-    ctx2d.fill();
-    // Circle
-    ctx2d.beginPath();
-    ctx2d.arc(n.x, n.y, n.isGeneral ? 24 : 18, 0, Math.PI * 2);
-    ctx2d.fillStyle = '#161b22';
-    ctx2d.strokeStyle = n.color;
-    ctx2d.lineWidth = 2;
-    ctx2d.fill();
-    ctx2d.stroke();
-    // Label
-    ctx2d.fillStyle = '#c9d1d9';
-    ctx2d.font = (n.isGeneral ? '12' : '11') + 'px -apple-system, monospace';
-    ctx2d.textAlign = 'center';
-    ctx2d.fillText(n.name.length > 14 ? n.name.slice(0, 12) + '..' : n.name, n.x, n.y + (n.isGeneral ? 38 : 32));
-  });
-  requestAnimationFrame(drawGraph);
-}
-
-// Hook into replay: spawn pulses when stepping
-const origStep = stepReplay;
-stepReplay = function() {
-  const prevCount = visibleCount;
-  origStep();
-  if (visibleCount > prevCount && visibleCount <= rows.length) {
-    const r = rows[visibleCount - 1];
-    spawnPulse(r.sender, r.receiver, r.event);
-  }
-};
-
-// Hook into full load: spawn pulses for all visible events on load
-const origRenderFull = renderFull;
-renderFull = function() {
-  origRenderFull();
-  // Update graph nodes from fleet data (if available)
-  fetch('/api/fleet').then(r => r.json()).then(data => {
-    updateGraphFromFleet(data);
-  }).catch(() => {
-    // Fallback: build nodes from activity only
-    const names = new Set();
-    rows.forEach(r => { names.add(r.sender); if (r.receiver) names.add(r.receiver); });
-    graphNodes = [...names].map(n => ({ name: n, x: 0, y: 0, color: '#8b949e', isGeneral: n === 'general' }));
-    layoutNodes();
-  });
-};
-
-resizeCanvas();
-window.addEventListener('resize', resizeCanvas);
-requestAnimationFrame(drawGraph);
-
-// ── Agent Board ──────────────────────────────────
-
-let prevBoard = '';
-
-async function loadBoard() {
-  try {
-    const resp = await fetch('/api/fleet');
-    const data = await resp.json();
-    renderBoard(data);
-  } catch {}
-}
-
-function renderBoard(data) {
-  const board = document.getElementById('board');
-  const cards = data.instances.map(inst => {
-    const statusDot = inst.status === 'running' ? 'running' : inst.status === 'crashed' ? 'crashed' : 'stopped';
-    const icon = inst.status === 'running' ? '🟢' : inst.status === 'crashed' ? '🔴' : '⚪';
-    const role = inst.general_topic ? 'coordinator' : inst.description || 'worker';
-    const costStr = '$' + (inst.costCents / 100).toFixed(2);
-    const lastMs = inst.lastActivity;
-    let lastStr = '—';
-    if (lastMs) {
-      const ago = Math.floor((Date.now() - lastMs) / 1000);
-      lastStr = ago < 60 ? ago + 's ago' : ago < 3600 ? Math.floor(ago/60) + 'm ago' : Math.floor(ago/3600) + 'h ago';
-    }
-    const ipc = inst.ipc ? '✓' : '✗';
-    const rl = inst.rateLimits ? ' · 5h:' + inst.rateLimits.five_hour_pct + '%' : '';
-    const taskLine = inst.currentTask
-      ? '<div class="card-task">📌 ' + inst.currentTask + '</div>'
-      : '<div class="card-task" style="color:#484f58">(idle)</div>';
-    return '<div class="card" data-name="' + inst.name + '">' +
-      '<div class="card-header"><div class="dot ' + statusDot + '"></div><div class="name">' + inst.name + '</div></div>' +
-      '<div class="card-row">' + role.slice(0, 30) + '</div>' +
-      '<div class="card-row">Backend: <span>' + inst.backend + '</span> · Tools: <span>' + inst.tool_set + '</span></div>' +
-      '<div class="card-row">IPC: <span>' + ipc + '</span> · Cost: <span>' + costStr + '</span>' + rl + '</div>' +
-      '<div class="card-row">Last: <span>' + lastStr + '</span></div>' +
-      taskLine +
-      '</div>';
-  });
-
-  const newHtml = cards.join('');
-  if (newHtml !== prevBoard) {
-    board.innerHTML = newHtml;
-    // Flash changed cards
-    board.querySelectorAll('.card').forEach(c => {
-      c.classList.add('flash');
-      setTimeout(() => c.classList.remove('flash'), 1000);
-    });
-    prevBoard = newHtml;
-  }
-}
-
-// Auto-refresh board every 10s
-setInterval(loadBoard, 10000);
-
-// Auto-load on page open
-loadBoard();
-load();
-</script>
-</body>
-</html>`;
-//# sourceMappingURL=fleet-dashboard-html.js.map