@matt82198/aesop 0.1.0-beta.2 → 0.1.0-beta.4

package/ui/serve.py

@@ -1,806 +1,78 @@
 #!/usr/bin/env python3
 """
-Aesop Web Dashboard — stdlib-only local observability.
-Serves a dark-theme HTML dashboard on a configurable port (default 8770).
-No external dependencies. Auto-refresh every 3s via fetch('/data') → JSON.
-
-Configuration:
-  - AESOP_ROOT: env var pointing to aesop installation (default: $HOME/aesop)
-  - aesop.config.json: optional config file with paths and settings
-  - PORT env var: override dashboard port (default: 8770)
-  - AESOP_TRANSCRIPTS_ROOT: env var for Claude transcript directory
+Aesop Web Dashboard — stdlib-only local observability (thin entry point).
+
+Serves a dark-theme HTML dashboard on a configurable port (default 8770) with
+realtime updates via GET /events (Server-Sent Events). No external dependencies.
+
+Wave-9 split: this module is now a thin composition layer. The implementation
+lives in focused siblings, each of which reads config.* at call time so config
+values stay live across reloads:
+  - config.py      — path / env / aesop.config.json resolution (+ reload())
+  - csrf.py        — session-token generation + request validation
+  - collectors.py  — read-only data collectors, tracker CRUD, SSE snapshots
+  - agents.py      — agent transcript reading + path-safe id handling
+  - sse.py         — SSE client registry, broadcast, background collector loop
+  - render.py      — dashboard template rendering (templates/dashboard.html)
+  - handler.py     — DashboardHandler (HTTP routing/endpoints) + run_server
+
+serve.py re-exports the sibling symbols so `serve.X` keeps resolving for the
+existing test suite (which loads this file by path and pokes its module globals)
+and for `python ui/serve.py` as the unchanged entry point.
+
+Configuration, CSRF, and SSE details are documented in ui/CLAUDE.md.
 """
-import http.server
-import json
 import os
-import re
-import subprocess
 import sys
-import urllib.parse
-from datetime import datetime
-from pathlib import Path
-from time import time
-
-
-# ==============================================================================
-# Configuration & Paths
-# ==============================================================================
-
-PORT = int(os.getenv("PORT", "8770"))
-
-# Determine AESOP_ROOT
-AESOP_ROOT = Path(os.getenv("AESOP_ROOT", Path.home() / "aesop"))
-
-# Try to load config file for additional settings
-CONFIG_FILE = AESOP_ROOT / "aesop.config.json"
-config = {}
-if CONFIG_FILE.exists():
-    try:
-        with open(CONFIG_FILE) as f:
-            config = json.load(f)
-    except:
-        pass
-
-# Derive paths from config or defaults
-STATE_DIR = Path(config.get("state_root", str(AESOP_ROOT / "state")))
-SCAN_DIR = Path(config.get("scan_root", str(AESOP_ROOT / "scan")))
-
-# Transcript path: configurable via env var or config
-# Default placeholder: $BRAIN_ROOT/projects/<project-name> (user fills in)
-TRANSCRIPTS_ROOT = Path(
-    os.getenv(
-        "AESOP_TRANSCRIPTS_ROOT",
-        config.get("transcripts_root", "~/.claude/projects")
-    )
-).expanduser()
-
-WATCHDOG_HEARTBEAT = STATE_DIR / ".watchdog-heartbeat"
-MONITOR_HEARTBEAT = STATE_DIR / ".monitor-heartbeat"
-REPOS_JSON = STATE_DIR / ".watchdog-repos.json"
-BACKUP_LOG = STATE_DIR / "FLEET-BACKUP.log"
-ALERTS_LOG = SCAN_DIR / "SECURITY-ALERTS.log"
-INBOX_FILE = STATE_DIR / "ui-inbox.md"
-
-
-# ==============================================================================
-# Data Collection Functions
-# ==============================================================================
-
-def get_heartbeat_status():
-    """Read daemon heartbeat age and status."""
-    try:
-        if not WATCHDOG_HEARTBEAT.exists():
-            return {"alive": "UNKNOWN", "age": -1, "threshold": 300}
-        content = WATCHDOG_HEARTBEAT.read_text().strip()
-        if not content:
-            return {"alive": "UNKNOWN", "age": -1, "threshold": 300}
-        # Parse epoch value robustly; assume seconds (standard epoch format)
-        try:
-            timestamp = int(content)
-        except ValueError:
-            # Retry once in case of race during daemon write
-            try:
-                content = WATCHDOG_HEARTBEAT.read_text().strip()
-                timestamp = int(content)
-            except:
-                return {"alive": "unknown", "age": -1, "threshold": 300}
-        # Age in seconds: now_seconds - heartbeat_seconds
-        age_seconds = int(time()) - timestamp
-        alive = "ALIVE" if age_seconds < 300 else "STALE"
-        return {"alive": alive, "age": age_seconds, "threshold": 300}
-    except:
-        return {"alive": "unknown", "age": -1, "threshold": 300}
-
-
-def get_monitor_heartbeat_status():
-    """Read orchestration monitor heartbeat age and status."""
-    try:
-        # Check both possible paths: state/.monitor-heartbeat and monitor/.monitor-heartbeat
-        monitor_hb = MONITOR_HEARTBEAT
-        if not monitor_hb.exists():
-            # Try alternate path
-            alt_path = AESOP_ROOT / "monitor" / ".monitor-heartbeat"
-            if not alt_path.exists():
-                return {"alive": "not running", "age": -1, "threshold": 3600}
-            monitor_hb = alt_path
-
-        content = monitor_hb.read_text().strip()
-        if not content:
-            return {"alive": "not running", "age": -1, "threshold": 3600}
-        # Parse epoch value robustly; assume seconds (standard epoch format)
-        try:
-            timestamp = int(content)
-        except ValueError:
-            # Retry once in case of race during monitor write
-            try:
-                content = monitor_hb.read_text().strip()
-                timestamp = int(content)
-            except:
-                return {"alive": "unknown", "age": -1, "threshold": 3600}
-        # Age in seconds: now_seconds - heartbeat_seconds
-        age_seconds = int(time()) - timestamp
-        alive = "ALIVE" if age_seconds < 3600 else "STALE"
-        return {"alive": alive, "age": age_seconds, "threshold": 3600}
-    except:
-        return {"alive": "unknown", "age": -1, "threshold": 3600}
-
-
-def get_fleet_agents():
-    """Detect running subagents by calling dash-extra.mjs --json."""
-    agents = []
-    try:
-        # Call the working detector (dash-extra.mjs) with --json flag
-        dash_extra_path = AESOP_ROOT / "dash" / "dash-extra.mjs"
-        if not dash_extra_path.exists():
-            return agents
-        result = subprocess.run(
-            ["node", str(dash_extra_path), "--json"],
-            capture_output=True,
-            text=True,
-            timeout=5
-        )
-        if result.returncode == 0 and result.stdout:
-            agents = json.loads(result.stdout.strip())
-    except (subprocess.TimeoutExpired, json.JSONDecodeError, FileNotFoundError):
-        pass
-    except Exception:
-        pass
-    return agents
-
-
-def get_main_thread_messages():
-    """Read last ~12 messages from newest session JSONL."""
-    messages = []
-    try:
-        if not TRANSCRIPTS_ROOT.exists():
-            return messages
-        # Find newest .jsonl
-        jsonl_files = sorted(
-            TRANSCRIPTS_ROOT.glob("**/*.jsonl"),
-            key=lambda p: p.stat().st_mtime,
-            reverse=True
-        )
-        if not jsonl_files:
-            return messages
-
-        newest = jsonl_files[0]
-        with open(newest, 'r', encoding='utf-8', errors='ignore') as f:
-            lines = f.readlines()
-            # Get last 30 lines to extract ~12 message turns
-            for line in lines[-30:]:
-                try:
-                    obj = json.loads(line)
-                    role = obj.get("role", "unknown")
-                    if role in ("user", "assistant"):
-                        # Extract text content
-                        content = obj.get("content", [])
-                        text = ""
-                        if isinstance(content, list):
-                            for block in content:
-                                if isinstance(block, dict) and "text" in block:
-                                    text = block["text"]
-                                    break
-                        elif isinstance(content, str):
-                            text = content
-
-                        if text:
-                            # Truncate to 200 chars and sanitize
-                            preview = text[:200].replace("\n", " ").strip()
-                            timestamp = obj.get("timestamp", "")
-                            messages.append({
-                                "role": role,
-                                "text": preview,
-                                "timestamp": timestamp
-                            })
-                except (json.JSONDecodeError, KeyError):
-                    pass
-            # Keep only last 12
-            messages = messages[-12:]
-    except:
-        pass
-    return messages
-
-
-def get_repos_status():
-    """Read repos from .watchdog-repos.json."""
-    repos = []
-    try:
-        if not REPOS_JSON.exists():
-            return repos
-        data = json.loads(REPOS_JSON.read_text())
-        if isinstance(data, list):
-            repos = data[:10]  # Limit to 10
-        elif isinstance(data, dict):
-            repos = [{"repo": k, "state": v} for k, v in data.items()][:10]
-    except:
-        pass
-    return repos
-
-
-def get_recent_events():
-    """Read last 8 lines from FLEET-BACKUP.log."""
-    events = []
-    try:
-        if not BACKUP_LOG.exists():
-            return events
-        lines = BACKUP_LOG.read_text().strip().split('\n')
-        events = [line.strip() for line in lines[-8:] if line.strip()]
-    except:
-        pass
-    return events
-
-
-def get_alerts():
-    """Read SECURITY-ALERTS.log, skip NOTE:/RESOLVED-FP, count by severity."""
-    alerts = {"count": 0, "lines": []}
-    try:
-        if not ALERTS_LOG.exists():
-            return alerts
-        lines = ALERTS_LOG.read_text().strip().split('\n')
-        unreviewed = [
-            line.strip() for line in lines
-            if line.strip()
-            and "NOTE:" not in line
-            and "RESOLVED-FP" not in line
-        ]
-        alerts["count"] = len(unreviewed)
-        alerts["lines"] = unreviewed[-5:]  # Show last 5
-    except:
-        pass
-    return alerts
-
-
-def extract_agent_dispatch_prompt(agent_id):
-    """
-    Extract dispatch prompt and metadata from agent output file.
-    Returns dict with prompt, dispatcher, model, activity times, and message count.
-    Robust: missing/invalid file -> {error: "..."}
-
-    CRITICAL: Use prefix-matching via glob, not exact match. The dashboard supplies
-    truncated agent IDs; files on disk carry full IDs (e.g., a77b995bcdb953e9c.output).
-    """
-    try:
-        # Prefix-match: search in TRANSCRIPTS_ROOT for files matching agent_id*.output
-        if not TRANSCRIPTS_ROOT.exists():
-            return {"error": f"transcripts root not found at {TRANSCRIPTS_ROOT}"}
-
-        # Glob for matching files (prefix-match handles truncated IDs)
-        matches = sorted(
-            TRANSCRIPTS_ROOT.glob(f"**/{agent_id}*.output"),
-            key=lambda p: p.stat().st_mtime, reverse=True,
-        )
-        if not matches:
-            return {"error": f"transcript not found for {agent_id}"}
-        output_file = matches[0]
-
-        dispatch_prompt = None
-        message_count = 0
-        model = None
-        parent_uuid = None
-        first_seen = None
-        last_activity = None
-
-        # Parse NDJSON (one JSON per line)
-        with open(output_file, 'r', encoding='utf-8', errors='ignore') as f:
-            lines = f.readlines()
-            message_count = len(lines)
-
-            # Get file mtime for activity time
-            stat = output_file.stat()
-            first_seen = int(stat.st_mtime)
-            last_activity = int(stat.st_mtime)
-
-            # First line should be type="user" with the dispatch prompt
-            if lines:
-                try:
-                    first_line = json.loads(lines[0])
-                    if first_line.get('type') == 'user':
-                        msg = first_line.get('message', {})
-                        dispatch_prompt = msg.get('content', '')
-                        parent_uuid = first_line.get('parentUuid')
-                except (json.JSONDecodeError, KeyError):
-                    pass
-
-            # Scan for model info in assistant messages
-            for line in lines[1:20]:  # Check first ~20 lines
-                try:
-                    obj = json.loads(line)
-                    if obj.get('type') == 'assistant' and not model:
-                        if 'model' in obj:
-                            model = obj.get('model')
-                except (json.JSONDecodeError, KeyError):
-                    pass
-
-        if not dispatch_prompt:
-            return {"error": f"no dispatch prompt found"}
-
-        # Infer dispatcher: if parentUuid is null, it's main thread; otherwise parent agent
-        dispatcher = "main thread" if parent_uuid is None else "parent agent"
-
-        return {
-            "id": agent_id,
-            "dispatch_prompt": dispatch_prompt,
-            "dispatcher": dispatcher,
-            "model": model or "unknown",
-            "message_count": message_count,
-            "first_seen": first_seen,
-            "last_activity": last_activity,
-        }
-    except Exception as e:
-        return {"error": str(e)}
-
-
-# ==============================================================================
-# HTTP Server
-# ==============================================================================
-
-class DashboardHandler(http.server.BaseHTTPRequestHandler):
-    """HTTP request handler for dashboard."""
-
-    def log_message(self, format, *args):
-        """Suppress default logging."""
-        pass
-
-    def do_GET(self):
-        """Handle GET requests."""
-        if self.path == "/":
-            self.serve_html()
-        elif self.path == "/data":
-            self.serve_data()
-        elif self.path.startswith("/agent?"):
-            self.serve_agent()
-        else:
-            self.send_error(404)
-
-    def do_POST(self):
-        """Handle POST requests."""
-        if self.path == "/submit":
-            self.handle_submit()
-        else:
-            self.send_error(404)
-
-    def serve_html(self):
-        """Serve the dashboard HTML."""
-        html = """<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Aesop Fleet Dashboard</title>
-    <style>
-        * { margin: 0; padding: 0; box-sizing: border-box; }
-        html { color-scheme: dark; }
-        body {
-            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Monospace;
-            background: #0a0a0a;
-            color: #e0e0e0;
-            padding: 16px;
-            line-height: 1.5;
-        }
-        .container { max-width: 1600px; margin: 0 auto; }
-        h1 { font-size: 20px; margin-bottom: 20px; color: #fff; }
-        h2 { font-size: 14px; margin-top: 20px; margin-bottom: 10px; color: #8ac; font-weight: bold; }
-
-        .header { display: flex; gap: 20px; margin-bottom: 20px; padding: 12px; background: #1a1a1a; border-radius: 4px; }
-        .header-item { flex: 1; }
-        .header-label { font-size: 11px; color: #666; text-transform: uppercase; margin-bottom: 4px; }
-        .header-value { font-size: 14px; color: #fff; font-weight: bold; }
-        .status-alive { color: #0a0; }
-        .status-stale { color: #f44; }
-        .status-unknown { color: #999; }
-
-        .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 20px; }
-        @media (max-width: 1200px) { .grid { grid-template-columns: 1fr; } }
-
-        .panel { background: #1a1a1a; border: 1px solid #333; border-radius: 4px; padding: 12px; }
-        .panel-title { font-size: 12px; color: #8ac; font-weight: bold; text-transform: uppercase; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
-        .panel-title-emoji { font-size: 14px; }
-
-        /* Agent row expand/collapse */
-        .agent-row { cursor: pointer; padding: 8px; margin-bottom: 4px; background: #0f0f0f; border: 1px solid #2a2a2a; border-radius: 3px; transition: all 0.2s ease; display: flex; align-items: center; gap: 8px; }
-        .agent-row:hover { background: #151515; border-color: #444; }
-        .agent-row.expanded { background: #1a1a1a; border-color: #8ac; }
-        .agent-status-icon { font-size: 12px; width: 14px; }
-        .agent-row-header { flex: 1; font-size: 12px; display: flex; gap: 12px; align-items: center; }
-        .agent-id-badge { color: #8ac; font-weight: bold; }
-        .agent-age { color: #666; font-size: 11px; }
-        .agent-preview { color: #999; font-size: 11px; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-        .agent-expand-toggle { color: #666; font-size: 11px; transition: transform 0.2s ease; }
-        .agent-row.expanded .agent-expand-toggle { transform: rotate(90deg); }
-
-        .agent-details { display: none; margin-top: 8px; padding: 12px; background: #0f0f0f; border-left: 3px solid #8ac; border-radius: 2px; max-height: 0; overflow: hidden; transition: max-height 0.3s ease; }
-        .agent-row.expanded .agent-details { display: block; max-height: 600px; }
-        .detail-row { margin-bottom: 8px; font-size: 11px; }
-        .detail-label { color: #8ac; font-weight: bold; display: inline-block; width: 100px; }
-        .detail-value { color: #ccc; word-break: break-all; }
-        .dispatch-prompt { background: #0a0a0a; border: 1px solid #333; border-radius: 2px; padding: 8px; margin-top: 6px; max-height: 300px; overflow-y: auto; font-size: 11px; color: #ccc; font-family: 'Monaco', 'Menlo', monospace; white-space: pre-wrap; word-wrap: break-word; }
-
-        .item { padding: 8px 0; font-size: 12px; border-bottom: 1px solid #2a2a2a; }
-        .item:last-child { border-bottom: none; }
-        .item-id { color: #8ac; font-weight: bold; }
-        .item-age { color: #999; margin: 0 8px; }
-        .item-status { padding: 2px 6px; border-radius: 2px; font-size: 10px; font-weight: bold; }
-        .status-running { background: #0a0; color: #000; }
-        .status-done { background: #666; color: #fff; }
-
-        .inbox-box { background: #1a1a1a; border: 1px solid #333; border-radius: 4px; padding: 12px; margin-bottom: 20px; }
-        .inbox-label { font-size: 11px; color: #666; text-transform: uppercase; margin-bottom: 8px; }
-        .inbox-input { width: 100%; padding: 8px; background: #0a0a0a; border: 1px solid #333; color: #e0e0e0; border-radius: 2px; font-size: 12px; font-family: inherit; }
-        .inbox-input:focus { outline: none; border-color: #8ac; }
-        .inbox-button { background: #8ac; color: #000; border: none; padding: 8px 16px; border-radius: 2px; margin-top: 8px; cursor: pointer; font-weight: bold; font-size: 12px; }
-        .inbox-button:hover { background: #9bd; }
-        .inbox-button:disabled { background: #555; cursor: not-allowed; }
-        .inbox-status { font-size: 11px; color: #0a0; margin-top: 4px; display: none; }
-
-        .alerts-box { background: #1a1a1a; border: 1px solid #333; border-radius: 4px; padding: 12px; }
-        .alert-line { font-size: 11px; padding: 4px 0; color: #f44; font-family: monospace; }
-        .alert-none { color: #666; }
-
-        .messages-box { background: #1a1a1a; border: 1px solid #333; border-radius: 4px; padding: 12px; max-height: 400px; overflow-y: auto; }
-        .message { padding: 8px 0; border-bottom: 1px solid #2a2a2a; font-size: 11px; }
-        .message:last-child { border-bottom: none; }
-        .message-role { color: #8ac; font-weight: bold; }
-        .message-time { color: #666; font-size: 10px; margin-left: 8px; }
-        .message-text { color: #ccc; margin-top: 4px; }
-
-        .loading { color: #666; font-style: italic; }
-        .error { color: #f44; }
-        .fade-in { animation: fadeIn 0.3s ease-in; }
-        @keyframes fadeIn { from { opacity: 0.5; } to { opacity: 1; } }
-    </style>
-</head>
-<body>
-    <div class="container">
-        <h1>Aesop Fleet Dashboard</h1>
-
-        <div class="header" id="header">
-            <div class="header-item">
-                <div class="header-label">Watchdog Status</div>
-                <div class="header-value" id="watchdog-status">
-                    <span id="watchdog-alive" class="status-unknown">—</span>
-                    <span id="watchdog-age" style="color: #999; margin-left: 8px;">—</span>
-                </div>
-            </div>
-            <div class="header-item">
-                <div class="header-label">Monitor Status</div>
-                <div class="header-value" id="monitor-status">
-                    <span id="monitor-alive" class="status-unknown">—</span>
-                    <span id="monitor-age" style="color: #999; margin-left: 8px;">—</span>
-                </div>
-            </div>
-            <div class="header-item">
-                <div class="header-label">Security Alerts</div>
-                <div class="header-value" id="alert-count" style="color: #999;">—</div>
-            </div>
-            <div class="header-item">
-                <div class="header-label">Running Agents</div>
-                <div class="header-value" id="running-count" style="color: #999;">—</div>
-            </div>
-        </div>
-
-        <div class="inbox-box">
-            <div class="inbox-label">Queue Work (Read by Orchestrator Each Turn)</div>
-            <input type="text" class="inbox-input" id="inbox-input" placeholder="Type your task here...">
-            <button class="inbox-button" id="inbox-button">Send to Inbox</button>
-            <div class="inbox-status" id="inbox-status">Queued ✓</div>
-        </div>
-
-        <div class="grid">
-            <div class="panel">
-                <div class="panel-title">
-                    <span class="panel-title-emoji">⚡</span>
-                    <span>Fleet Agents (<span id="running-agents-count">0</span> active)</span>
-                </div>
-                <div id="agents-list" class="loading">—</div>
-            </div>
-
-            <div class="panel">
-                <div class="panel-title">Repos Status</div>
-                <div id="repos-list" class="loading">—</div>
-            </div>
-        </div>
-
-        <div class="grid">
-            <div class="panel">
-                <div class="panel-title">Recent Events (Last 8)</div>
-                <div id="events-list" class="loading">—</div>
-            </div>
-
-            <div class="alerts-box">
-                <div class="panel-title">Security Alerts (Unreviewed)</div>
-                <div id="alerts-list" class="alert-none">—</div>
-            </div>
-        </div>
-
-        <div class="panel">
-            <div class="panel-title">Main-Thread Prompts (Last ~12 Messages)</div>
-            <div class="messages-box" id="messages-list" class="loading">—</div>
-        </div>
-
-        <div style="text-align: center; margin-top: 30px; color: #666; font-size: 11px;">
-            Auto-refresh every 3s · Dashboard · Click agent rows to inspect dispatches
-        </div>
-    </div>
-
-    <script>
-        let lastRefresh = 0;
-
-        function formatTimestamp(iso) {
-            if (!iso) return '';
-            const d = new Date(iso);
-            return d.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit', second: '2-digit' });
-        }
-
-        function sanitize(text) {
-            const div = document.createElement('div');
-            div.textContent = text;
-            return div.innerHTML;
-        }
-
-        async function refresh() {
-            try {
-                const response = await fetch('/data');
-                if (!response.ok) return;
-                const data = await response.json();
-
-                // Update header
-                const watchdog = data.watchdog || {};
-                const watchdogAlive = document.getElementById('watchdog-alive');
-                watchdogAlive.textContent = watchdog.alive || '—';
-                watchdogAlive.className = 'status-' + (watchdog.alive || 'unknown').toLowerCase();
-                document.getElementById('watchdog-age').textContent = watchdog.age >= 0 ? watchdog.age + 's' : '—';
-
-                const monitor = data.monitor || {};
-                const monitorAlive = document.getElementById('monitor-alive');
-                monitorAlive.textContent = monitor.alive || '—';
-                monitorAlive.className = 'status-' + (monitor.alive || 'unknown').toLowerCase();
-                document.getElementById('monitor-age').textContent = monitor.age >= 0 ? monitor.age + 's' : '—';
-
-                document.getElementById('alert-count').textContent = data.alerts?.count || 0;
-                const runningAgents = (data.agents || []).filter(a => a.status === 'running').length;
-                document.getElementById('running-count').textContent = runningAgents;
-
-                // Agents with expandable details
-                const agentsList = document.getElementById('agents-list');
-                document.getElementById('running-agents-count').textContent = (data.agents || []).length;
-                if (data.agents && data.agents.length > 0) {
-                    agentsList.innerHTML = data.agents.map(a => {
-                        const statusEmoji = a.status === 'running' ? '🟢' : a.status === 'done' ? '⚪' : '⚠️';
-                        const preview = (a.hint || '').substring(0, 60).replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
-                        return `<div class="agent-row fade-in" data-agent-id="${sanitize(a.id)}">
-                            <span class="agent-status-icon">${statusEmoji}</span>
-                            <div class="agent-row-header">
-                                <span class="agent-id-badge">${sanitize(a.id)}</span>
-                                <span class="agent-age">${a.age_s}s</span>
-                                <span class="agent-preview">${preview}</span>
-                            </div>
-                            <span class="agent-expand-toggle">▶</span>
-                            <div class="agent-details" style="display: none;"></div>
-                        </div>`;
-                    }).join('');
-                    // Attach click handlers for expansion
-                    document.querySelectorAll('.agent-row').forEach(row => {
-                        row.addEventListener('click', async function(e) {
-                            e.stopPropagation();
-                            const agentId = this.dataset.agentId;
-                            this.classList.toggle('expanded');
-                            const detailsDiv = this.querySelector('.agent-details');
-                            if (this.classList.contains('expanded') && !detailsDiv.innerHTML) {
-                                // Fetch details on first expand
-                                try {
-                                    const resp = await fetch('/agent?id=' + encodeURIComponent(agentId));
-                                    const details = await resp.json();
-                                    if (details.error) {
-                                        detailsDiv.innerHTML = `<div class="detail-row"><span class="detail-label">Error:</span> <span class="detail-value">${sanitize(details.error)}</span></div>`;
-                                    } else {
-                                        const uptime = Math.floor((Date.now() / 1000 - details.last_activity) / 60);
-                                        detailsDiv.innerHTML = `
-                                            <div class="detail-row"><span class="detail-label">Dispatcher:</span> <span class="detail-value">${sanitize(details.dispatcher)}</span></div>
-                                            <div class="detail-row"><span class="detail-label">Model:</span> <span class="detail-value">${sanitize(details.model)}</span></div>
-                                            <div class="detail-row"><span class="detail-label">Messages:</span> <span class="detail-value">${details.message_count}</span></div>
-                                            <div class="detail-row"><span class="detail-label">Prompt:</span></div>
-                                            <div class="dispatch-prompt">${sanitize(details.dispatch_prompt)}</div>
-                                        `;
-                                    }
-                                } catch (e) {
-                                    detailsDiv.innerHTML = `<div class="detail-row" style="color: #f44;">Failed to fetch details: ${sanitize(e.message)}</div>`;
-                                }
-                            }
-                        });
-                    });
-                } else {
-                    agentsList.innerHTML = '<div style="color: #666; font-size: 12px;">💤 No active agents — fleet is idle</div>';
-                }
-
-                // Repos
-                const reposList = document.getElementById('repos-list');
-                if (data.repos && data.repos.length > 0) {
-                    reposList.innerHTML = data.repos.map(r => {
-                        const repo = r.repo || Object.keys(r)[0] || 'unknown';
-                        const state = r.state || r[repo] || 'unknown';
-                        return `<div class="item"><span class="item-id">${sanitize(repo.substring(0, 30))}</span> <span style="color: #999;">${sanitize(state)}</span></div>`;
-                    }).join('');
-                } else {
-                    reposList.textContent = '(no repos)';
-                    reposList.style.color = '#666';
-                }
-
-                // Events
-                const eventsList = document.getElementById('events-list');
-                if (data.events && data.events.length > 0) {
-                    eventsList.innerHTML = data.events.map(e =>
-                        `<div class="item"><span style="color: #999; font-size: 10px;">${sanitize(e.substring(0, 80))}</span></div>`
-                    ).join('');
-                } else {
-                    eventsList.textContent = '(no recent events)';
-                    eventsList.style.color = '#666';
-                }
-
-                // Alerts
-                const alertsList = document.getElementById('alerts-list');
-                if (data.alerts && data.alerts.lines && data.alerts.lines.length > 0) {
-                    alertsList.innerHTML = data.alerts.lines.map(line =>
-                        `<div class="alert-line">${sanitize(line.substring(0, 120))}</div>`
-                    ).join('');
-                } else {
-                    alertsList.innerHTML = '<div class="alert-none">(no alerts)</div>';
-                }
-
-                // Messages
-                const messagesList = document.getElementById('messages-list');
-                if (data.messages && data.messages.length > 0) {
-                    messagesList.innerHTML = data.messages.map(m =>
-                        `<div class="message fade-in"><span class="message-role">${sanitize(m.role)}</span><span class="message-time">${formatTimestamp(m.timestamp)}</span><div class="message-text">${sanitize(m.text)}</div></div>`
-                    ).join('');
-                } else {
-                    messagesList.textContent = '(no messages)';
-                    messagesList.style.color = '#666';
-                }
-
-                lastRefresh = Date.now();
-            } catch (e) {
-                console.error('Refresh error:', e);
-            }
-        }
-
-        async function handleInboxSubmit() {
-            const input = document.getElementById('inbox-input');
-            const button = document.getElementById('inbox-button');
-            const status = document.getElementById('inbox-status');
-
-            const text = input.value.trim();
-            if (!text) return;
-
-            button.disabled = true;
-            try {
-                const response = await fetch('/submit', {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({ text })
-                });
-                if (response.ok) {
-                    input.value = '';
-                    status.style.display = 'block';
-                    setTimeout(() => { status.style.display = 'none'; }, 3000);
-                }
-            } catch (e) {
-                console.error('Submit error:', e);
-            } finally {
-                button.disabled = false;
-            }
-        }
-
-        document.getElementById('inbox-button').addEventListener('click', handleInboxSubmit);
-        document.getElementById('inbox-input').addEventListener('keypress', (e) => {
-            if (e.key === 'Enter') handleInboxSubmit();
-        });
-
-        refresh();
-        setInterval(refresh, 3000);
-    </script>
-</body>
-</html>"""
-        self.send_response(200)
-        self.send_header("Content-Type", "text/html; charset=utf-8")
-        self.send_header("Cache-Control", "no-cache, no-store, must-revalidate")
-        self.end_headers()
-        self.wfile.write(html.encode('utf-8'))
-
-    def serve_data(self):
-        """Serve dashboard data as JSON."""
-        data = {
-            "watchdog": get_heartbeat_status(),
-            "monitor": get_monitor_heartbeat_status(),
-            "agents": get_fleet_agents(),
-            "repos": get_repos_status(),
-            "events": get_recent_events(),
-            "alerts": get_alerts(),
-            "messages": get_main_thread_messages(),
-        }
-        self.send_response(200)
-        self.send_header("Content-Type", "application/json; charset=utf-8")
-        self.send_header("Cache-Control", "no-cache, no-store, must-revalidate")
-        self.end_headers()
-        self.wfile.write(json.dumps(data, default=str).encode('utf-8'))
-
-    def serve_agent(self):
-        """Serve agent dispatch prompt and metadata via GET /agent?id=<agent_id>"""
-        try:
-            # Parse query string
-            query = urllib.parse.urlparse(self.path).query
-            params = urllib.parse.parse_qs(query)
-            agent_id = params.get('id', [None])[0]
-
-            if not agent_id:
-                self.send_response(400)
-                self.send_header("Content-Type", "application/json")
-                self.end_headers()
-                self.wfile.write(json.dumps({"error": "missing id parameter"}).encode('utf-8'))
-                return
-
-            # Extract dispatch prompt and metadata
-            data = extract_agent_dispatch_prompt(agent_id)
-
-            self.send_response(200)
-            self.send_header("Content-Type", "application/json; charset=utf-8")
-            self.send_header("Cache-Control", "no-cache, no-store, must-revalidate")
-            self.end_headers()
-            self.wfile.write(json.dumps(data, default=str).encode('utf-8'))
-        except Exception as e:
-            self.send_response(500)
-            self.send_header("Content-Type", "application/json")
-            self.end_headers()
-            self.wfile.write(json.dumps({"error": str(e)}).encode('utf-8'))
-
-    def handle_submit(self):
-        """Handle /submit POST."""
-        try:
-            content_length = int(self.headers.get('Content-Length', 0))
-            if content_length > 10000:  # 10KB limit
-                self.send_error(413)
-                return
-
-            body = self.rfile.read(content_length).decode('utf-8', errors='ignore')
-            data = json.loads(body)
-            text = data.get("text", "").strip()
-
-            if not text:
-                self.send_response(400)
-                self.end_headers()
-                return
-
-            # Append to inbox
-            inbox_content = f"- [{datetime.now().isoformat()}] {text}\n"
-            if not INBOX_FILE.exists():
-                INBOX_FILE.parent.mkdir(parents=True, exist_ok=True)
-                INBOX_FILE.write_text("# UI Inbox — orchestrator reads each turn / on /power\n\n")
-
-            with open(INBOX_FILE, 'a', encoding='utf-8') as f:
-                f.write(inbox_content)
-
-            self.send_response(200)
-            self.send_header("Content-Type", "application/json")
-            self.end_headers()
-            self.wfile.write(json.dumps({"ok": True}).encode('utf-8'))
-        except Exception as e:
-            self.send_response(500)
-            self.end_headers()
-
 
-def run_server():
-    """Start the HTTP server."""
-    addr = ("127.0.0.1", PORT)
-    httpd = http.server.HTTPServer(addr, DashboardHandler)
-    print(f"Dashboard: http://localhost:{PORT}")
-    print(f"AESOP_ROOT: {AESOP_ROOT}")
-    print(f"Transcripts: {TRANSCRIPTS_ROOT}")
-    print(f"Press Ctrl-C to stop")
-    try:
-        httpd.serve_forever()
-    except KeyboardInterrupt:
-        print("\nShutdown complete.")
-        sys.exit(0)
+# Sys.path shim: add ui/ so sibling imports resolve both when this file is run
+# as `python ui/serve.py` and when it is loaded by path via importlib (tests).
+sys.path.insert(0, os.path.dirname(os.path.abspath(__file__)))
+
+import config
+config.reload()
+
+import csrf
+csrf.init()
+
+import render
+import collectors
+import agents
+import sse
+
+# Fresh collector/snapshot state per serve import (restores the per-import
+# isolation the monolith had; the sse module object is cached across re-imports).
+sse.reset_state()
+
+# Re-export sibling symbols so serve.X keeps resolving for tests + the handler.
+# For config symbols, use __getattr__ to ensure they stay live through config.reload()
+from csrf import *
+from render import render_dashboard
+from collectors import *
+from agents import *
+from sse import *
+from collectors import (_snapshot_data, _snapshot_tracker,
+                        _snapshot_orchestrator_status, drain_tracker_inbox)
+from agents import _AGENT_ID_FORBIDDEN, _transcripts_fingerprint
+from sse import (_sse_lock, _sse_clients, _latest_lock, _latest_snapshots,
+                 _collector_lock, _collector_stop_event, _maybe_emit)
+
+# HTTP handler + server entry.
+import handler
+from handler import DashboardHandler, run_server
+
+
+def __getattr__(name):
+    """Forward config symbols to the live config module so they stay current
+    through config.reload() calls. This prevents the frozen `from config import *`
+    pattern which would go stale after any reload."""
+    import config
+    if hasattr(config, name):
+        return getattr(config, name)
+    raise AttributeError(f"module 'serve' has no attribute '{name}'")
 
 
 if __name__ == "__main__":
+    print(f"Aesop Dashboard: http://127.0.0.1:{config.PORT}", flush=True)
+    print(f"Press Ctrl-C to stop", flush=True)
     run_server()