@decentnetwork/beagle 0.1.0

package/dist/server.js

@@ -0,0 +1,1187 @@
+//
+// Friend UI — a tiny local web page for managing a peer's friends:
+//   1. display the friend list (name / status / userid)
+//   2. display incoming friend-requests, with Accept / Reject
+//   3. add a friend by address
+//
+// It's a thin frontend over the daemon's existing IPC ops (diag,
+// friends-pending, friends-accept, friends-reject, friend-request) — no new
+// daemon logic. Started with `agentnet ui`; point a browser at the printed URL.
+//
+// Note: requests only QUEUE for manual Accept/Reject when the daemon runs with
+// `friends.autoAccept = false`. With auto-accept on, the pending list stays
+// empty because the daemon accepts immediately.
+//
+import http from "node:http";
+import net from "node:net";
+import { existsSync, readFileSync, writeFileSync, statSync, createReadStream } from "node:fs";
+import { fileURLToPath } from "node:url";
+import { dirname, join } from "node:path";
+import yaml from "js-yaml";
+import { DEFAULT_EXITS } from "./exits.js";
+// Directory holding the built desktop UI bundle (index.html, app.js, vendor/).
+// scripts/build-ui.mjs emits it next to this compiled module at dist/ui/desktop/.
+const DESKTOP_DIR = join(dirname(fileURLToPath(import.meta.url)), "desktop");
+// Exit reachability probe: the CONNECT-proxy port every exit runs, and how long
+// to wait before calling an exit unreachable. Kept short so the network panel
+// (which probes all exits on each poll) stays responsive over a lossy mesh.
+const EXIT_PROBE_PORT = 8888;
+const EXIT_PROBE_TIMEOUT_MS = 2000;
+/** True only when the request came from the local machine. Used to gate the
+ *  "Sign in with Decent" routes so binding the UI to a LAN IP can't expose
+ *  identity signing to other hosts. The popup always runs in the local user's
+ *  browser, so it connects over the loopback interface. */
+function isLocalRequest(req) {
+    const a = req.socket.remoteAddress ?? "";
+    return a === "127.0.0.1" || a === "::1" || a === "::ffff:127.0.0.1";
+}
+/**
+ * Reveal a file in the OS file manager (Finder / Explorer / Nautilus), so the
+ * user can play, share, AirDrop, copy or delete it with native tools instead
+ * of re-downloading — the file is already on disk under downloadsDir.
+ *
+ * Two things make this fiddly:
+ *  - The daemon usually runs as ROOT (started via sudo). A GUI command run as
+ *    root either opens in root's own (invisible) session or is refused. On
+ *    macOS the fix is `launchctl asuser <uid>` to hop into the logged-in
+ *    user's Aqua session; elsewhere we drop to `SUDO_USER` with `sudo -u`.
+ *  - WSL has no Linux file manager but can drive Windows Explorer via the
+ *    translated \\wsl$ path.
+ *
+ * Best-effort: returns {ok:false, error} rather than throwing so the caller
+ * can surface a message. `filePath` MUST already be validated as inside
+ * downloadsDir by the caller.
+ */
+async function revealInFileManager(filePath) {
+    const { spawn } = await import("node:child_process");
+    const run = (cmd, args) => new Promise((resolve) => {
+        let child;
+        try {
+            child = spawn(cmd, args, { stdio: "ignore", detached: true });
+        }
+        catch (e) {
+            resolve({ ok: false, error: `${cmd}: ${e.message}` });
+            return;
+        }
+        child.on("error", (e) => resolve({ ok: false, error: `${cmd}: ${e.message}` }));
+        // Windows Explorer returns exit code 1 even on success, so treat spawn
+        // without an 'error' event as success rather than gating on the code.
+        child.unref();
+        setTimeout(() => resolve({ ok: true }), 150);
+    });
+    const asRoot = typeof process.getuid === "function" && process.getuid() === 0;
+    const sudoUser = process.env.SUDO_USER;
+    const sudoUid = process.env.SUDO_UID;
+    if (process.platform === "darwin") {
+        // Run `open -R` inside the login user's GUI session when we're root.
+        if (asRoot && sudoUid) {
+            return run("launchctl", ["asuser", sudoUid, "open", "-R", filePath]);
+        }
+        return run("open", ["-R", filePath]);
+    }
+    if (process.platform === "win32") {
+        return run("explorer.exe", [`/select,${filePath}`]);
+    }
+    // Linux (incl. WSL). WSL: drive Windows Explorer with the \\wsl$ UNC path.
+    const isWsl = existsSync("/proc/version") &&
+        (await import("node:fs/promises")).readFile("/proc/version", "utf-8").then((v) => v.toLowerCase().includes("microsoft"), () => false);
+    if (await isWsl) {
+        let winPath = filePath;
+        try {
+            const { execFileSync } = await import("node:child_process");
+            winPath = execFileSync("wslpath", ["-w", filePath], { encoding: "utf-8" }).trim() || filePath;
+        }
+        catch {
+            // wslpath missing — fall through with the raw path
+        }
+        return run("explorer.exe", [`/select,${winPath}`]);
+    }
+    // A headless server has no file manager; xdg-open on the parent folder is the
+    // best we can do where a desktop exists. Drop privileges to the login user.
+    const dir = filePath.slice(0, filePath.lastIndexOf("/")) || "/";
+    if (asRoot && sudoUser)
+        return run("sudo", ["-u", sudoUser, "xdg-open", dir]);
+    return run("xdg-open", [dir]);
+}
+/** Validate and normalize a website origin (scheme://host[:port], no path).
+ *  Returns the canonical origin string or null if malformed. Only http/https
+ *  are accepted. */
+function validateOrigin(raw) {
+    if (typeof raw !== "string" || raw.length === 0 || raw.length > 256)
+        return null;
+    try {
+        const u = new URL(raw);
+        if (u.protocol !== "http:" && u.protocol !== "https:")
+            return null;
+        // u.origin drops any path/query/hash and lowercases the host.
+        if (u.origin === "null" || !u.origin)
+            return null;
+        return u.origin;
+    }
+    catch {
+        return null;
+    }
+}
+// The "Sign in with Decent" consent popup. Self-contained (no external assets),
+// dark theme matching the desktop UI. Reads origin+nonce from its own query,
+// shows the requesting site and this node's identity, and on Approve calls the
+// local /api/connect-approve to sign, then postMessages the result to the
+// opener at the exact requesting origin. Mandatory explicit consent — never
+// returns identity without an Approve click.
+const CONNECT_PAGE = `<!doctype html>
+<html lang="en"><head><meta charset="utf-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>Sign in with Decent</title>
+<style>
+  :root{--bg:#0c0d11;--panel:#14161d;--line:#262a35;--text:#e7e9ef;--faint:#8b91a3;
+        --accent:#5b8cff;--good:#46a758;--bad:#e5604d;--mono:ui-monospace,SFMono-Regular,Menlo,monospace}
+  *{box-sizing:border-box}
+  html,body{margin:0;height:100%}
+  body{background:var(--bg);color:var(--text);font:14px/1.5 system-ui,-apple-system,Segoe UI,sans-serif;
+       display:flex;align-items:center;justify-content:center;padding:18px}
+  .card{width:100%;max-width:380px;background:var(--panel);border:1px solid var(--line);
+        border-radius:14px;padding:22px 20px}
+  .brand{font-weight:600;letter-spacing:.2px;color:var(--accent);font-size:13px;display:flex;align-items:center;gap:7px}
+  .brand .d{width:11px;height:11px;background:var(--accent);transform:rotate(45deg);border-radius:2px}
+  h1{font-size:18px;margin:14px 0 6px}
+  .sub{color:var(--faint);margin:0 0 16px}
+  .origin{color:var(--text);font-weight:600;word-break:break-all}
+  .id{background:#0e1016;border:1px solid var(--line);border-radius:10px;padding:11px 12px;margin-bottom:14px}
+  .lbl{font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--faint);margin-bottom:4px}
+  .userid{font-family:var(--mono);font-size:12.5px;color:var(--text);word-break:break-all}
+  .err{background:rgba(229,96,77,.12);border:1px solid rgba(229,96,77,.4);color:#ffb4a8;
+       border-radius:9px;padding:9px 11px;font-size:12.5px;margin-bottom:13px}
+  .row{display:flex;gap:10px;margin-top:4px}
+  .btn{flex:1;border:0;border-radius:9px;padding:11px;font-size:14px;font-weight:600;cursor:pointer}
+  .ghost{background:transparent;border:1px solid var(--line);color:var(--text)}
+  .ghost:hover{border-color:#3a4050}
+  .solid{background:var(--accent);color:#fff}
+  .solid:disabled{opacity:.45;cursor:not-allowed}
+  .note{color:var(--faint);font-size:11.5px;margin:15px 0 0;line-height:1.45}
+</style></head>
+<body>
+  <div class="card">
+    <div class="brand"><span class="d"></span>Decent</div>
+    <h1>Sign in</h1>
+    <p class="sub"><span id="origin" class="origin">…</span> wants to sign you in with your Decent identity.</p>
+    <div class="id"><div class="lbl">Your identity</div><div id="userid" class="userid">loading…</div></div>
+    <div id="err" class="err" hidden></div>
+    <div class="row">
+      <button id="deny" class="btn ghost">Deny</button>
+      <button id="approve" class="btn solid" disabled>Approve</button>
+    </div>
+    <p class="note">Approving sends the site a signature bound to that site, proving you control this identity. Your private key never leaves this device.</p>
+  </div>
+<script>
+(function(){
+  var qs=new URLSearchParams(location.search);
+  var origin=qs.get("origin")||"", nonce=qs.get("nonce")||"";
+  var oEl=document.getElementById("origin"), errEl=document.getElementById("err");
+  var approve=document.getElementById("approve"), deny=document.getElementById("deny");
+  oEl.textContent=origin||"(unknown site)";
+  function fail(m){errEl.textContent=m;errEl.hidden=false;}
+  function reply(data){ if(window.opener&&validOrigin){ window.opener.postMessage(Object.assign({type:"decent-auth",nonce:nonce},data),origin);} }
+  var validOrigin=false;
+  try{var u=new URL(origin); validOrigin=(u.protocol==="http:"||u.protocol==="https:")&&u.origin===origin;}catch(e){}
+  if(!validOrigin) fail("This sign-in request has an invalid origin and was blocked.");
+  if(nonce.length===0||nonce.length>512){ validOrigin=false; fail("This sign-in request is missing a valid nonce."); }
+  fetch("/api/state").then(function(r){return r.json();}).then(function(s){
+    var uid=(s.me&&s.me.userid)||"";
+    document.getElementById("userid").textContent=uid||"(no identity)";
+    if(uid&&validOrigin) approve.disabled=false;
+    else if(!uid) fail("No local Decent identity found — is the daemon running?");
+  }).catch(function(){ fail("Could not reach the local agentnet daemon."); });
+  deny.onclick=function(){ reply({error:"denied"}); setTimeout(function(){window.close();},60); };
+  approve.onclick=function(){
+    approve.disabled=true; approve.textContent="Signing…";
+    fetch("/api/connect-approve",{method:"POST",headers:{"content-type":"application/json"},
+      body:JSON.stringify({origin:origin,nonce:nonce})})
+      .then(function(r){return r.json();})
+      .then(function(j){ if(!j.ok) throw new Error(j.error||"sign failed");
+        reply({userid:j.userid,sig:j.sig}); setTimeout(function(){window.close();},60); })
+      .catch(function(e){ approve.disabled=false; approve.textContent="Approve"; fail("Signing failed: "+e.message); });
+  };
+})();
+</script>
+</body></html>`;
+// ---- shapes the desktop UI (src/ui/desktop) consumes (DK_* in the design) ----
+const fmtTime = (ts) => {
+    if (!ts)
+        return "";
+    const d = new Date(ts);
+    const today = new Date();
+    const sameDay = d.toDateString() === today.toDateString();
+    if (sameDay)
+        return `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
+    const days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
+    const yest = new Date(today.getTime() - 86400000);
+    if (d.toDateString() === yest.toDateString())
+        return "Yest";
+    if (today.getTime() - d.getTime() < 7 * 86400000)
+        return days[d.getDay()];
+    return `${d.getDate()} ${["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"][d.getMonth()]}`;
+};
+const viaFromTransport = (t) => t === "udp" || t === "both" ? "direct" : t === "tcp-relay" ? "relay" : null;
+export function startBeagleServer(opts) {
+    const host = opts.listenHost ?? "127.0.0.1";
+    const port = opts.listenPort ?? 8765;
+    const log = opts.log ?? ((s) => console.log(s));
+    const sendJson = (res, code, body) => {
+        res.writeHead(code, { "content-type": "application/json" });
+        res.end(JSON.stringify(body));
+    };
+    const readBody = (req) => new Promise((resolve) => {
+        let b = "";
+        req.on("data", (c) => (b += c));
+        req.on("end", () => {
+            try {
+                resolve(b ? JSON.parse(b) : {});
+            }
+            catch {
+                resolve({});
+            }
+        });
+    });
+    // Named so the IPv6 loopback listener below can share it (Node binds one
+    // listener to one address, and `localhost` is two addresses).
+    const handler = async (req, res) => {
+        try {
+            const url = (req.url || "/").split("?")[0];
+            // Desktop UI bundle (the design). Falls back to the classic page when
+            // the bundle hasn't been built (dist/ui/desktop missing).
+            const desktopIndex = join(DESKTOP_DIR, "index.html");
+            if (req.method === "GET" && (url === "/" || url === "/index.html")) {
+                if (existsSync(desktopIndex)) {
+                    // no-store: the UI bundle is rebuilt in place on every UI change, so the
+                    // browser must never serve a stale cached index/app.js (that's why UI
+                    // updates appeared to "not take" until a hard reload).
+                    res.writeHead(200, { "content-type": "text/html; charset=utf-8", "cache-control": "no-store" });
+                    res.end(readFileSync(desktopIndex));
+                    return;
+                }
+                res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+                res.end(PAGE);
+                return;
+            }
+            if (req.method === "GET" && (url === "/classic" || url === "/classic.html")) {
+                res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+                res.end(PAGE);
+                return;
+            }
+            // Static assets for the desktop bundle (app.js + vendored react UMD).
+            if (req.method === "GET" && (url === "/app.js" || url.startsWith("/vendor/"))) {
+                const rel = url === "/app.js" ? "app.js" : url.slice(1); // strip leading /
+                const file = join(DESKTOP_DIR, rel);
+                // Guard against path traversal: resolved file must stay under DESKTOP_DIR.
+                if (existsSync(file) && file.startsWith(DESKTOP_DIR)) {
+                    // app.js AND vendor/peer-webrtc.js change on every rebuild / SDK bump
+                    // → never cache them, or the browser keeps running stale call/UI code
+                    // (this silently defeated every peer-webrtc fix). Only the truly stable
+                    // vendored libs (React UMD) may cache.
+                    const headers = { "content-type": "application/javascript; charset=utf-8" };
+                    const volatile = rel === "app.js" || rel.includes("peer-webrtc");
+                    headers["cache-control"] = volatile ? "no-store" : "public, max-age=31536000";
+                    res.writeHead(200, headers);
+                    res.end(readFileSync(file));
+                    return;
+                }
+                res.writeHead(404);
+                res.end("not found");
+                return;
+            }
+            // ── Sign in with Decent ────────────────────────────────────────────
+            // A website opens http://localhost:8765/connect?origin=…&nonce=… in a
+            // popup; on Approve we sign "decent-auth\n<origin>\n<nonce>" with this
+            // node's Carrier identity and postMessage {userid,nonce,sig} back to the
+            // site, which verifies the signature against the userid. BOTH routes are
+            // LOCALHOST-ONLY: the popup always runs in the local user's browser
+            // (localhost), so binding the UI to a LAN IP must never let a remote
+            // host request signatures with this identity.
+            if (url === "/connect" || url === "/api/connect-approve") {
+                if (!isLocalRequest(req)) {
+                    res.writeHead(403, { "content-type": "text/plain" });
+                    res.end("Sign in with Decent is available only on this machine (localhost).");
+                    return;
+                }
+            }
+            if (req.method === "GET" && url === "/connect") {
+                res.writeHead(200, { "content-type": "text/html; charset=utf-8" });
+                res.end(CONNECT_PAGE);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/connect-approve") {
+                const body = await readBody(req);
+                const origin = validateOrigin(body.origin);
+                const nonce = typeof body.nonce === "string" ? body.nonce : "";
+                if (!origin) {
+                    sendJson(res, 400, { ok: false, error: "invalid origin" });
+                    return;
+                }
+                if (!nonce || nonce.length > 512) {
+                    sendJson(res, 400, { ok: false, error: "invalid nonce" });
+                    return;
+                }
+                // Bind BOTH the origin and the nonce into the signed message so a
+                // signature minted for site A can't be replayed at site B.
+                const message = `decent-auth\n${origin}\n${nonce}`;
+                const r = await opts.call({ op: "sign", text: message });
+                if (!r.ok) {
+                    sendJson(res, 502, { ok: false, error: r.error || "sign failed" });
+                    return;
+                }
+                sendJson(res, 200, {
+                    ok: true,
+                    userid: r.data?.userid ?? "",
+                    sig: r.data?.sig ?? "",
+                });
+                return;
+            }
+            // Delete file/chat messages by id (removes their on-disk files too).
+            if (req.method === "POST" && url === "/api/file-delete") {
+                const body = await readBody(req);
+                const userid = typeof body.userid === "string" ? body.userid : "";
+                const ids = Array.isArray(body.ids) ? body.ids.filter((x) => typeof x === "string") : [];
+                if (!userid || !ids.length) {
+                    sendJson(res, 400, { ok: false, error: "userid and ids required" });
+                    return;
+                }
+                const r = await opts.call({ op: "file-delete", userid, ids });
+                sendJson(res, r.ok ? 200 : 502, r.ok ? { ok: true, ...(r.data ?? {}) } : { ok: false, error: r.error });
+                return;
+            }
+            // Cancel in-flight sends by chat message id.
+            if (req.method === "POST" && url === "/api/file-cancel") {
+                const body = await readBody(req);
+                const userid = typeof body.userid === "string" ? body.userid : "";
+                const ids = Array.isArray(body.ids) ? body.ids.filter((x) => typeof x === "string") : [];
+                if (!userid || !ids.length) {
+                    sendJson(res, 400, { ok: false, error: "userid and ids required" });
+                    return;
+                }
+                const r = await opts.call({ op: "file-cancel", userid, ids });
+                sendJson(res, r.ok ? 200 : 502, r.ok ? { ok: true, ...(r.data ?? {}) } : { ok: false, error: r.error });
+                return;
+            }
+            // Retry/resume incomplete sends from the daemon's retained outbox copy.
+            if (req.method === "POST" && url === "/api/file-retry") {
+                const body = await readBody(req);
+                const userid = typeof body.userid === "string" ? body.userid : "";
+                const ids = Array.isArray(body.ids) ? body.ids.filter((x) => typeof x === "string") : [];
+                if (!userid || !ids.length) {
+                    sendJson(res, 400, { ok: false, error: "userid and ids required" });
+                    return;
+                }
+                const r = await opts.call({ op: "file-retry", userid, ids });
+                sendJson(res, r.ok ? 200 : 502, r.ok ? { ok: true, ...(r.data ?? {}) } : { ok: false, error: r.error });
+                return;
+            }
+            // ── File transfer ──────────────────────────────────────────────────
+            // Upload: the browser POSTs raw file bytes with ?userid=&name= in the
+            // query. We stream them to a temp file (no in-memory buffering of large
+            // files) and hand the daemon that path over the existing file-send IPC.
+            if (req.method === "POST" && url === "/api/file-send") {
+                const q = new URL(req.url || "", "http://x").searchParams;
+                const userid = q.get("userid") || "";
+                const rawName = q.get("name") || "file";
+                const safe = rawName.replace(/[/\\]/g, "_").slice(0, 200) || "file";
+                if (!userid) {
+                    sendJson(res, 400, { ok: false, error: "userid required" });
+                    return;
+                }
+                const os = await import("node:os");
+                const fs = await import("node:fs");
+                const fsp = await import("node:fs/promises");
+                const tmpDir = await fsp.mkdtemp(join(os.tmpdir(), "agentnet-up-"));
+                const tmpPath = join(tmpDir, safe);
+                try {
+                    await new Promise((resolve2, reject) => {
+                        const ws = fs.createWriteStream(tmpPath);
+                        req.pipe(ws);
+                        req.on("error", reject);
+                        ws.on("error", reject);
+                        ws.on("finish", () => resolve2());
+                    });
+                    const r = await opts.call({ op: "file-send", userid, path: tmpPath });
+                    if (!r.ok) {
+                        sendJson(res, 502, r);
+                        return;
+                    }
+                    sendJson(res, 200, { ok: true, ...(r.data ?? {}) });
+                }
+                catch (e) {
+                    sendJson(res, 500, { ok: false, error: e instanceof Error ? e.message : String(e) });
+                }
+                finally {
+                    await fsp.rm(tmpDir, { recursive: true, force: true }).catch(() => undefined);
+                }
+                return;
+            }
+            // Persist a file received by browser WebRTC DataChannel. Unlike the
+            // ordinary daemon filetransfer path, the bytes arrive in the browser, so
+            // the browser uploads the completed Blob here; we save it under
+            // downloads/ and ask the daemon to append a normal inbound file chip.
+            if (req.method === "POST" && url === "/api/webrtc-file-save") {
+                if (!opts.downloadsDir) {
+                    sendJson(res, 404, { ok: false, error: "downloads disabled" });
+                    return;
+                }
+                const q = new URL(req.url || "", "http://x").searchParams;
+                const userid = q.get("userid") || "";
+                const rawName = q.get("name") || "agentnet-file";
+                const safe = rawName.replace(/[/\\]/g, "_").slice(0, 200) || "agentnet-file";
+                if (!userid) {
+                    sendJson(res, 400, { ok: false, error: "userid required" });
+                    return;
+                }
+                const fs = await import("node:fs");
+                const fsp = await import("node:fs/promises");
+                await fsp.mkdir(opts.downloadsDir, { recursive: true });
+                let finalName = safe;
+                let finalPath = join(opts.downloadsDir, finalName);
+                const dot = safe.lastIndexOf(".");
+                const base = dot > 0 ? safe.slice(0, dot) : safe;
+                const ext = dot > 0 ? safe.slice(dot) : "";
+                for (let i = 1; existsSync(finalPath); i++) {
+                    finalName = `${base}-${i}${ext}`;
+                    finalPath = join(opts.downloadsDir, finalName);
+                }
+                try {
+                    await new Promise((resolve2, reject) => {
+                        const ws = fs.createWriteStream(finalPath);
+                        req.pipe(ws);
+                        req.on("error", reject);
+                        ws.on("error", reject);
+                        ws.on("finish", () => resolve2());
+                    });
+                    const st = statSync(finalPath);
+                    const r = await opts.call({ op: "file-log-local", userid, dir: "in", name: finalName, size: st.size });
+                    if (!r.ok) {
+                        sendJson(res, 502, r);
+                        return;
+                    }
+                    sendJson(res, 200, { ok: true, name: finalName, size: st.size });
+                }
+                catch (e) {
+                    sendJson(res, 500, { ok: false, error: e instanceof Error ? e.message : String(e) });
+                }
+                return;
+            }
+            // Serve a received file by name, from <configDir>/downloads. Used both for
+            // download (?dl=1 → attachment) and inline preview/playback (no dl → the
+            // right media content-type + inline disposition + HTTP Range so <video>/
+            // <audio> can seek without buffering the whole file).
+            // Reveal a received file in the OS file manager. LOCALHOST-ONLY: this
+            // opens Finder/Explorer on the machine the DAEMON runs on, so it's
+            // meaningful only for someone sitting at that machine — never honour it
+            // for a remotely-opened UI (which could otherwise pop a file manager on
+            // the host at a stranger's request).
+            if (req.method === "POST" && url === "/api/file-reveal") {
+                if (!opts.downloadsDir) {
+                    sendJson(res, 404, { ok: false, error: "downloads disabled" });
+                    return;
+                }
+                if (!isLocalRequest(req)) {
+                    sendJson(res, 403, { ok: false, error: "reveal is available only on this machine" });
+                    return;
+                }
+                const body = await readBody(req);
+                const name = (typeof body.name === "string" ? body.name : "").replace(/[/\\]/g, "");
+                const file = join(opts.downloadsDir, name);
+                if (!name || !file.startsWith(opts.downloadsDir) || !existsSync(file)) {
+                    sendJson(res, 404, { ok: false, error: "not found" });
+                    return;
+                }
+                const r = await revealInFileManager(file);
+                sendJson(res, r.ok ? 200 : 500, r);
+                return;
+            }
+            if (req.method === "GET" && url === "/api/file-download") {
+                if (!opts.downloadsDir) {
+                    res.writeHead(404);
+                    res.end("downloads disabled");
+                    return;
+                }
+                const q = new URL(req.url || "", "http://x").searchParams;
+                const name = (q.get("name") || "").replace(/[/\\]/g, "");
+                const file = join(opts.downloadsDir, name);
+                // Path-traversal guard: the resolved path must stay under downloadsDir.
+                if (!name || !file.startsWith(opts.downloadsDir) || !existsSync(file)) {
+                    res.writeHead(404);
+                    res.end("not found");
+                    return;
+                }
+                const ext = (name.split(".").pop() || "").toLowerCase();
+                const MIME = {
+                    png: "image/png", jpg: "image/jpeg", jpeg: "image/jpeg", gif: "image/gif",
+                    webp: "image/webp", svg: "image/svg+xml", heic: "image/heic", bmp: "image/bmp",
+                    mp4: "video/mp4", mov: "video/quicktime", webm: "video/webm", m4v: "video/x-m4v",
+                    mkv: "video/x-matroska", avi: "video/x-msvideo",
+                    mp3: "audio/mpeg", m4a: "audio/mp4", aac: "audio/aac", wav: "audio/wav",
+                    ogg: "audio/ogg", flac: "audio/flac", opus: "audio/opus",
+                    pdf: "application/pdf",
+                    // Text / markup / code / config → served as UTF-8 text so a plain
+                    // click opens (previews) them in the browser instead of forcing a
+                    // download. `.md` and friends are the common case here.
+                    md: "text/markdown", markdown: "text/markdown",
+                    txt: "text/plain", text: "text/plain", log: "text/plain",
+                    json: "application/json", csv: "text/csv", tsv: "text/tab-separated-values",
+                    xml: "text/xml", yaml: "text/plain", yml: "text/plain",
+                    ini: "text/plain", conf: "text/plain", cfg: "text/plain", toml: "text/plain",
+                    html: "text/html", htm: "text/html", css: "text/css",
+                    js: "text/plain", ts: "text/plain", jsx: "text/plain", tsx: "text/plain",
+                    py: "text/plain", sh: "text/plain", srt: "text/plain", vtt: "text/vtt",
+                };
+                const ctype = MIME[ext] || "application/octet-stream";
+                const isMedia = ctype.startsWith("image/") || ctype.startsWith("video/") || ctype.startsWith("audio/");
+                const isText = ctype.startsWith("text/") || ctype === "application/json" || ctype === "application/pdf";
+                // Anything we can render inline (media, text, pdf) opens on a plain GET;
+                // `?dl=1` forces a save. Binary stays attachment-only.
+                const inlineViewable = isMedia || isText;
+                const wantDownload = q.get("dl") === "1" || !inlineViewable;
+                // Text needs an explicit charset so the browser renders UTF-8 (Chinese
+                // markdown etc.) correctly rather than as mojibake.
+                const ctypeHeader = ctype.startsWith("text/") ? `${ctype}; charset=utf-8` : ctype;
+                // Content-Disposition must be ASCII — Node throws ERR_INVALID_CHAR on a
+                // non-ASCII header value (filenames from macOS contain U+202F before
+                // "PM", and others may be Chinese, etc.). Provide an ASCII-only
+                // `filename=` fallback plus the RFC 5987 `filename*=UTF-8''…` with the
+                // real (percent-encoded) name for clients that support it.
+                const asciiName = name.replace(/[^\x20-\x7e]/g, "_").replace(/"/g, "");
+                const disposition = `${wantDownload ? "attachment" : "inline"}; filename="${asciiName}"; filename*=UTF-8''${encodeURIComponent(name)}`;
+                const size = statSync(file).size;
+                const range = req.headers.range;
+                // Honour a single-range request (what browsers send for media seeking).
+                const m = range && /^bytes=(\d*)-(\d*)$/.exec(range);
+                if (m && !wantDownload) {
+                    let start = m[1] ? parseInt(m[1], 10) : 0;
+                    let end = m[2] ? parseInt(m[2], 10) : size - 1;
+                    if (Number.isNaN(start) || Number.isNaN(end) || start > end || end >= size) {
+                        res.writeHead(416, { "content-range": `bytes */${size}` });
+                        res.end();
+                        return;
+                    }
+                    res.writeHead(206, {
+                        "content-type": ctypeHeader,
+                        "content-disposition": disposition,
+                        "accept-ranges": "bytes",
+                        "content-range": `bytes ${start}-${end}/${size}`,
+                        "content-length": String(end - start + 1),
+                    });
+                    createReadStream(file, { start, end }).pipe(res);
+                    return;
+                }
+                res.writeHead(200, {
+                    "content-type": ctypeHeader,
+                    "content-disposition": disposition,
+                    "accept-ranges": "bytes",
+                    "content-length": String(size),
+                });
+                createReadStream(file).pipe(res);
+                return;
+            }
+            if (req.method === "GET" && url === "/api/state") {
+                const [diag, pending] = await Promise.all([
+                    opts.call({ op: "diag" }),
+                    opts.call({ op: "friends-pending" }),
+                ]);
+                const d = diag.ok ? (diag.data ?? {}) : {};
+                const identity = d.identity ?? {};
+                const tun = d.tun ?? {};
+                const me = {
+                    userid: identity.userid,
+                    address: identity.address,
+                    // The configured TUN address is what this host can actually route.
+                    // Prefer it over a stale init/default allocation during Dora outage.
+                    ip: tun.ip ?? d.allocatedIp,
+                    installed: !!tun.ip, // lan/TUN is up
+                };
+                const friends = d.friends ?? [];
+                const pend = pending.ok ? (pending.data?.pending ?? []) : [];
+                sendJson(res, 200, { me, friends, pending: pend });
+                return;
+            }
+            // Rich friend list (alias / status / unread / last message). Falls back
+            // to the diag-derived list on older daemons that lack the op.
+            if (req.method === "GET" && url === "/api/friends-list") {
+                const r = await opts.call({ op: "friends-list" });
+                if (r.ok) {
+                    sendJson(res, 200, r.data ?? { friends: [] });
+                    return;
+                }
+                const diag = await opts.call({ op: "diag" });
+                const friends = diag.ok ? (diag.data?.friends ?? []) : [];
+                sendJson(res, 200, { friends });
+                return;
+            }
+            // One bootstrap call for the desktop UI: composes the design's DK_*
+            // shapes (me / peers / requests / exits) from diag + friends-list +
+            // ipam + routes, so the client data layer is a single poll.
+            if (req.method === "GET" && url === "/api/desktop") {
+                const [diag, pending, flist] = await Promise.all([
+                    opts.call({ op: "diag" }),
+                    opts.call({ op: "friends-pending" }),
+                    opts.call({ op: "friends-list" }),
+                ]);
+                const d = (diag.ok ? diag.data : {}) ?? {};
+                const identity = d.identity ?? {};
+                const tun = d.tun ?? {};
+                const node = d.node ?? {};
+                const diagFriends = d.friends ?? [];
+                const ipamList = d.ipam ?? [];
+                const ipByUserid = new Map();
+                for (const p of ipamList)
+                    if (p.carrierId)
+                        ipByUserid.set(p.carrierId, p.virtualIp);
+                const sessByUserid = new Map();
+                for (const f of diagFriends) {
+                    const uid = f.carrierId || f.pubkey || "";
+                    if (uid && f.session)
+                        sessByUserid.set(uid, f.session);
+                }
+                // Is THIS node one of the official exit nodes? (so the UI can badge it).
+                const meExit = DEFAULT_EXITS.find((e) => e.userid && e.userid === identity.userid);
+                const me = {
+                    name: node.name || (identity.userid ?? "").slice(0, 8),
+                    // Handle reads as a network address: <name>@decentnetwork.
+                    handle: `${node.name || "peer"}@decentnetwork`,
+                    description: node.statusMessage ?? "",
+                    userId: identity.userid ?? "",
+                    carrier: identity.address ?? "",
+                    netKey: identity.userid ?? "",
+                    ip: tun.ip ?? d.allocatedIp ?? "",
+                    online: !!tun.ip,
+                    lanVer: opts.meExtra?.lanVer ?? "",
+                    peerVer: opts.meExtra?.peerVer ?? "",
+                    channel: opts.meExtra?.channel ?? "@next",
+                    wire: opts.meExtra?.wire ?? "163",
+                    isExit: !!meExit,
+                    exitRegion: meExit?.region ?? null,
+                };
+                const fl = (flist.ok ? (flist.data?.friends ?? []) : []);
+                const peers = fl.map((f) => {
+                    const uid = f.userid ?? "";
+                    const sess = sessByUserid.get(uid);
+                    const status = f.status;
+                    const online = status === "connected" || status === "online";
+                    const realName = typeof f.name === "string" && f.name !== uid ? f.name : undefined;
+                    const lm = f.lastMessage;
+                    return {
+                        id: uid,
+                        alias: f.alias || realName || null,
+                        userId: uid,
+                        // Shareable Carrier address so a friend can be recommended to
+                        // another friend (userid only works once already friends).
+                        address: f.address || "",
+                        online,
+                        via: online ? viaFromTransport(sess?.transport) : null,
+                        ping: null,
+                        ip: ipByUserid.get(uid) ?? "",
+                        unread: f.unread ?? 0,
+                        agent: false,
+                        lastMsg: lm ? (lm.dir === "out" ? "you: " : "") + (lm.text ?? "") : "",
+                        lastTime: fmtTime(lm?.ts),
+                        wire: "163",
+                    };
+                });
+                const pend = pending.ok ? (pending.data?.pending ?? []) : [];
+                const requests = pend.map((p, i) => ({
+                    id: p.userid || p.address || `r${i}`,
+                    carrier: p.address || p.userid || "",
+                    userid: p.userid || "",
+                    via: "lan",
+                    time: "",
+                }));
+                // Exit nodes = the AVAILABLE exits this node knows about, grouped by
+                // region. The authoritative list is the shipped DEFAULT_EXITS
+                // (config/default-exits.yaml) — every install has it, so the panel is
+                // populated out-of-the-box even on a node with no routes.yaml. Any
+                // extra exit IPs an operator added to routes.yaml are folded in too.
+                // online status: is that exit a currently-connected friend (by userid,
+                // else by its virtual ip showing up as a live peer).
+                let routes = { regions: [], default: "direct" };
+                if (existsSync(opts.routesPath)) {
+                    routes = yaml.load(readFileSync(opts.routesPath, "utf-8")) ?? routes;
+                }
+                const onlineUserids = new Set();
+                const onlineIps = new Set();
+                for (const f of diagFriends) {
+                    const uid = f.carrierId || f.pubkey || "";
+                    const s = f.session;
+                    if (uid && s && s.transport && s.transport !== "none") {
+                        onlineUserids.add(uid);
+                        const ip = ipByUserid.get(uid);
+                        if (ip)
+                            onlineIps.add(ip);
+                    }
+                }
+                const regionMeta = {
+                    china: { flag: "CN", label: "China" },
+                    japan: { flag: "JP", label: "Japan" },
+                    us: { flag: "US", label: "United States" },
+                };
+                const byRegion = new Map();
+                for (const e of DEFAULT_EXITS) {
+                    if (!e.virtual_ip)
+                        continue;
+                    const region = e.region || "other";
+                    if (!byRegion.has(region))
+                        byRegion.set(region, []);
+                    byRegion.get(region).push({
+                        ip: e.virtual_ip,
+                        host: e.name,
+                        online: onlineUserids.has(e.userid) || onlineIps.has(e.virtual_ip),
+                        reachable: false,
+                        ping: null,
+                    });
+                }
+                // Fold in any extra exit IPs from routes.yaml not already covered.
+                const knownIps = new Set(DEFAULT_EXITS.flatMap((e) => (e.virtual_ip ? [e.virtual_ip] : [])));
+                for (const r of routes.regions ?? []) {
+                    for (const ip of r.exits ?? []) {
+                        if (knownIps.has(ip))
+                            continue;
+                        knownIps.add(ip);
+                        if (!byRegion.has(r.name))
+                            byRegion.set(r.name, []);
+                        byRegion.get(r.name).push({ ip, host: ip, online: onlineIps.has(ip), reachable: false, ping: null });
+                    }
+                }
+                // REACHABILITY (data plane): presence "online" only means the peer is
+                // announcing on the DHT — it does NOT mean IP packets get through (a
+                // desynced/NAT-blocked exit shows "online" while `ping 10.86.x` times out,
+                // e.g. GFAX). Actively probe each exit's CONNECT-proxy port over the mesh:
+                // a completed TCP handshake proves the L3 path + the exit process are both
+                // live. Probed in parallel with a short timeout so the panel stays snappy.
+                const allNodes = [...byRegion.values()].flat();
+                await Promise.all(allNodes.map((n) => new Promise((done) => {
+                    const t0 = Date.now();
+                    const sock = net.connect({ host: n.ip, port: EXIT_PROBE_PORT });
+                    let settled = false;
+                    const finish = (ok) => {
+                        if (settled)
+                            return;
+                        settled = true;
+                        clearTimeout(timer);
+                        sock.destroy();
+                        n.reachable = ok;
+                        n.ping = ok ? Date.now() - t0 : null;
+                        done();
+                    };
+                    const timer = setTimeout(() => finish(false), EXIT_PROBE_TIMEOUT_MS);
+                    sock.once("connect", () => finish(true));
+                    // ECONNREFUSED means the host answered (L3 reachable) but the proxy
+                    // isn't listening — still "reachable" for triage; a timeout/no-route is
+                    // the real "can't connect".
+                    sock.once("error", (e) => finish(e.code === "ECONNREFUSED"));
+                })));
+                const exits = [...byRegion.entries()].map(([region, nodes]) => ({
+                    region,
+                    flag: regionMeta[region]?.flag ?? region.slice(0, 2).toUpperCase(),
+                    label: regionMeta[region]?.label ?? region,
+                    nodes,
+                    reachableCount: nodes.filter((n) => n.reachable).length,
+                    unreachableCount: nodes.filter((n) => !n.reachable).length,
+                }));
+                const activeExit = routes.default && routes.default !== "direct" ? routes.default : null;
+                sendJson(res, 200, { me, peers, requests, exits, activeExit });
+                return;
+            }
+            if (req.method === "GET" && url === "/api/chat-history") {
+                const peer = new URL(req.url || "/", "http://x").searchParams.get("peer") || undefined;
+                const r = await opts.call({ op: "chat-history", userid: peer });
+                sendJson(res, 200, r.ok ? (r.data ?? { chats: {} }) : { chats: {} });
+                return;
+            }
+            if (req.method === "POST" && url === "/api/chat-send") {
+                const { userid, text } = await readBody(req);
+                const r = await opts.call({ op: "chat-send", userid, text });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/chat-log-local") {
+                const { userid, dir, text } = await readBody(req);
+                const r = await opts.call({ op: "chat-log-local", userid, dir: dir === "out" ? "out" : "in", text });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/chat-mark-read") {
+                const { userid } = await readBody(req);
+                const r = await opts.call({ op: "chat-mark-read", userid });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            // WebRTC call signaling (peer-webrtc). The browser CallEngine sends
+            // RtcSignals here and long-polls call-poll for inbound ones; the daemon
+            // relays both over the Carrier "carrier" invite extension.
+            if (req.method === "POST" && url === "/api/call-signal") {
+                const { userid, data } = await readBody(req);
+                const r = await opts.call({ op: "call-signal", userid, data });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "GET" && url === "/api/call-poll") {
+                // The daemon holds this up to ~20s (long-poll). opts.call's own IPC
+                // timeout is 30s, so it returns before that; on any error, resolve
+                // empty so the browser simply re-polls.
+                try {
+                    const r = await opts.call({ op: "call-poll" });
+                    sendJson(res, 200, r.ok ? r.data ?? { signals: [] } : { signals: [] });
+                }
+                catch {
+                    sendJson(res, 200, { signals: [] });
+                }
+                return;
+            }
+            if (req.method === "POST" && url === "/api/friend-remove") {
+                const { userid } = await readBody(req);
+                const r = await opts.call({ op: "friend-remove", userid });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/friend-alias") {
+                const { userid, alias } = await readBody(req);
+                const r = await opts.call({ op: "friend-set-alias", userid, alias });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/set-profile") {
+                const { name, description } = await readBody(req);
+                const r = await opts.call({ op: "set-profile", name, description });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "GET" && url === "/api/routes") {
+                let routes = { regions: [], default: "direct" };
+                if (existsSync(opts.routesPath)) {
+                    routes = yaml.load(readFileSync(opts.routesPath, "utf-8")) ?? routes;
+                }
+                const diag = await opts.call({ op: "diag" });
+                const available = diag.ok ? (diag.data?.ipam ?? []) : [];
+                sendJson(res, 200, { routes, available });
+                return;
+            }
+            if (req.method === "GET" && url === "/api/dora") {
+                let records = [];
+                if (opts.doraRosterPath && existsSync(opts.doraRosterPath)) {
+                    const r = yaml.load(readFileSync(opts.doraRosterPath, "utf-8"));
+                    records = r?.records ?? [];
+                }
+                sendJson(res, 200, { isDora: !!opts.doraRosterPath, records });
+                return;
+            }
+            if (req.method === "POST" && url === "/api/routes") {
+                const body = await readBody(req);
+                try {
+                    const routes = JSON.parse(body.routes ?? "{}");
+                    writeFileSync(opts.routesPath, yaml.dump(routes, { lineWidth: -1 }), "utf-8");
+                    sendJson(res, 200, { ok: true });
+                }
+                catch (err) {
+                    sendJson(res, 400, { ok: false, error: err instanceof Error ? err.message : String(err) });
+                }
+                return;
+            }
+            if (req.method === "POST" && url === "/api/accept") {
+                const { userid } = await readBody(req);
+                const r = await opts.call({ op: "friends-accept", userid });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/reject") {
+                const { userid } = await readBody(req);
+                const r = await opts.call({ op: "friends-reject", userid });
+                sendJson(res, r.ok ? 200 : 400, r);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/add") {
+                const { address } = await readBody(req);
+                // A friend-request is fire-and-forget: it's delivered when the peer is
+                // online and only becomes a friend once they accept. Don't let the UI
+                // hang on the network round-trip (DHT lookup / unreachable peer) — kick
+                // the send off, but respond within a short window. A fast failure (e.g.
+                // a malformed address) still surfaces its real error; a slow send
+                // returns optimistic success and continues in the background.
+                const sent = opts
+                    .call({ op: "friend-request", address })
+                    .then((r) => ({ done: true, r }))
+                    .catch((e) => ({ done: true, r: { ok: false, error: e instanceof Error ? e.message : String(e) } }));
+                const settled = await Promise.race([
+                    sent,
+                    new Promise((r) => setTimeout(() => r({ done: false }), 2500)),
+                ]);
+                if (settled.done) {
+                    sendJson(res, settled.r.ok ? 200 : 400, settled.r);
+                }
+                else {
+                    void sent.catch(() => { }); // let it finish in the background, no unhandled rejection
+                    sendJson(res, 200, { ok: true, queued: true });
+                }
+                return;
+            }
+            res.writeHead(404);
+            res.end("not found");
+        }
+        catch (err) {
+            sendJson(res, 500, { ok: false, error: err instanceof Error ? err.message : String(err) });
+        }
+    };
+    const server = http.createServer(handler);
+    // `localhost` resolves to BOTH ::1 and 127.0.0.1. Binding only 127.0.0.1
+    // left the UI unreachable in a browser: Chrome/Safari try ::1 first and
+    // don't fall back the way curl does, so http://localhost:8765 refused the
+    // connection while 127.0.0.1:8765 served fine — and the daemon log claimed
+    // the UI was up. When the caller asked for loopback (the default), listen on
+    // BOTH families. An explicit non-loopback host is honoured as given.
+    const isLoopback = host === "127.0.0.1" || host === "localhost" || host === "::1";
+    let v6 = null;
+    // Beagle is a consumer app: a busy port must read as a sentence, not as an
+    // unhandled 'error' event and a v8 stack trace. Without this listener Node
+    // throws EADDRINUSE out of the event loop and the process dies with 20 lines
+    // of internals — which is exactly what a second `beagle` run produced.
+    server.on("error", (err) => {
+        if (err.code === "EADDRINUSE") {
+            log(`Port ${port} is already in use — Beagle may already be running.`);
+            log(`Open http://${isLoopback ? "localhost" : host}:${port} , or start this one on another port with --port <n>.`);
+            process.exit(1);
+        }
+        if (err.code === "EACCES") {
+            log(`Not allowed to bind port ${port}. Ports below 1024 need elevated privilege — pick a higher one with --port <n>.`);
+            process.exit(1);
+        }
+        log(`Could not start the web server: ${err.message}`);
+        process.exit(1);
+    });
+    server.listen(port, host === "localhost" ? "127.0.0.1" : host, () => {
+        log(`Beagle UI on http://${isLoopback ? "localhost" : host}:${port}`);
+    });
+    if (isLoopback) {
+        // Second server object on ::1: Node can't bind one listener to two
+        // specific addresses, and binding :: instead would expose the UI on every
+        // interface — the opposite of what a loopback default promises.
+        v6 = http.createServer(handler);
+        v6.on("error", (err) => {
+            // A host with IPv6 disabled gives EADDRNOTAVAIL/EAFNOSUPPORT; the IPv4
+            // listener above is already serving, so this is not fatal.
+            if (err.code !== "EADDRINUSE")
+                log(`(IPv6 loopback unavailable: ${err.code ?? err.message} — IPv4 still serving)`);
+        });
+        v6.listen(port, "::1");
+    }
+    return {
+        stop: () => {
+            server.close();
+            v6?.close();
+        },
+    };
+}
+const PAGE = `<!doctype html>
+<html lang="en"><head><meta charset="utf-8"/>
+<meta name="viewport" content="width=device-width, initial-scale=1"/>
+<title>Beagle — friends</title>
+<style>
+  :root { color-scheme: light dark; }
+  body { font: 15px/1.5 -apple-system, system-ui, sans-serif; max-width: 760px; margin: 2rem auto; padding: 0 1rem; }
+  h1 { font-size: 1.3rem; } h2 { font-size: 1rem; margin: 1.5rem 0 .5rem; color: #888; text-transform: uppercase; letter-spacing: .04em; }
+  .row { display: flex; align-items: center; gap: .75rem; padding: .55rem .7rem; border: 1px solid #8883; border-radius: 8px; margin-bottom: .4rem; }
+  .row .meta { flex: 1; min-width: 0; }
+  .row .name { font-weight: 600; }
+  .row .sub { font-size: .8rem; color: #888; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+  .dot { width: .6rem; height: .6rem; border-radius: 50%; flex: 0 0 auto; }
+  .online { background: #2ecc71; } .offline { background: #bbb; } .requested { background: #f1c40f; }
+  button { font: inherit; padding: .3rem .7rem; border-radius: 6px; border: 1px solid #8886; background: transparent; cursor: pointer; }
+  button.accept { border-color: #2ecc71; color: #2ecc71; } button.reject { border-color: #e74c3c; color: #e74c3c; }
+  button:hover { background: #8881; }
+  .add { display: flex; gap: .5rem; margin: .5rem 0 1.5rem; }
+  .add input { flex: 1; font: inherit; padding: .4rem .6rem; border-radius: 6px; border: 1px solid #8886; background: transparent; color: inherit; }
+  .empty { color: #999; font-style: italic; padding: .4rem 0; }
+  #toast { position: fixed; bottom: 1rem; left: 50%; transform: translateX(-50%); background: #333; color: #fff; padding: .5rem 1rem; border-radius: 8px; opacity: 0; transition: opacity .2s; }
+  #toast.show { opacity: 1; }
+</style></head>
+<body>
+<h1>decentlan · friends</h1>
+<div id="me" class="sub" style="margin:-.5rem 0 1rem"></div>
+
+<div class="add">
+  <input id="addr" placeholder="paste a friend's address to send a request" autocomplete="off"/>
+  <button onclick="addFriend()">Add</button>
+</div>
+
+<h2>Friend requests <span id="pcount"></span></h2>
+<div id="pending"></div>
+
+<div id="doraPanel" style="display:none">
+  <h2>Dora allocations <span id="dcount"></span></h2>
+  <div id="dora"></div>
+</div>
+
+<h2>Exit nodes <span id="ecount"></span></h2>
+<div id="exits"></div>
+<div class="add">
+  <input id="exitIp" placeholder="exit virtual IP (e.g. 10.86.1.15)" autocomplete="off" style="flex:2"/>
+  <input id="exitRegion" placeholder="region (china/japan/us)" autocomplete="off" list="regionList" style="flex:1"/>
+  <datalist id="regionList"><option>china</option><option>japan</option><option>us</option></datalist>
+  <button onclick="addExit()">Add exit</button>
+</div>
+
+<h2>Friends <span id="fcount"></span></h2>
+<div id="friends"></div>
+
+<div id="chat" style="display:none; position:fixed; inset:0; background:Canvas; padding:1.5rem 1rem; max-width:760px; margin:0 auto;">
+  <div class="row" style="border:none; padding-left:0">
+    <button onclick="closeChat()">← Back</button>
+    <div class="meta"><div class="name" id="chatName"></div><div class="sub" id="chatSub"></div></div>
+  </div>
+  <div id="chatLog" style="height:calc(100vh - 13rem); overflow-y:auto; display:flex; flex-direction:column; gap:.35rem; padding:.5rem 0;"></div>
+  <div class="add"><input id="chatInput" placeholder="message…" autocomplete="off"/><button onclick="sendChat()">Send</button></div>
+</div>
+
+<div id="toast"></div>
+<script>
+const esc = s => String(s ?? '').replace(/[&<>"]/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;'}[c]));
+const short = s => { s = String(s ?? ''); return s.length > 20 ? s.slice(0,10)+'…'+s.slice(-6) : s; };
+let toastT;
+function toast(msg){ const t=document.getElementById('toast'); t.textContent=msg; t.classList.add('show'); clearTimeout(toastT); toastT=setTimeout(()=>t.classList.remove('show'),2200); }
+
+async function api(path, body){ const r = await fetch(path, body?{method:'POST',headers:{'content-type':'application/json'},body:JSON.stringify(body)}:{}); return r.json(); }
+
+window.friendsById = {}; window.me = {};
+async function refresh(){
+  let s, fl;
+  try { [s, fl] = await Promise.all([api('/api/state'), api('/api/friends-list')]); } catch(e){ return; }
+  const pend = s.pending || [], me = s.me || {};
+  const fr = (fl && fl.friends) || s.friends || [];
+  window.me = me;
+  const idStr = me.address || me.userid || '';
+  document.getElementById('me').innerHTML =
+    (me.ip ? ('My IP: <b>' + esc(me.ip) + '</b> · ') : (me.userid ? '' : 'daemon: no identity '))
+    + (me.userid ? ('<span title="'+esc(me.userid)+'">'+esc(short(me.userid))+'</span> ') : '')
+    + (idStr ? '<button onclick="copyId()" style="padding:.1rem .5rem;font-size:.75rem">copy my address</button>' : '')
+    + (me.userid && !me.installed ? ' · <span style="color:#e67e22">lan/TUN not up</span>' : '');
+  fr.forEach(f => { window.friendsById[f.userid||f.carrierId] = f; });
+  document.getElementById('pcount').textContent = pend.length ? '('+pend.length+')' : '';
+  document.getElementById('fcount').textContent = fr.length ? '('+fr.length+')' : '';
+  document.getElementById('pending').innerHTML = pend.length ? pend.map(p => \`
+    <div class="row">
+      <div class="meta"><div class="name">\${esc(p.name || 'unnamed')}</div>
+        <div class="sub">\${esc(short(p.userid))}\${p.hello? ' · "'+esc(p.hello)+'"':''}</div></div>
+      <button class="accept" onclick="act('accept','\${esc(p.userid)}')">Accept</button>
+      <button class="reject" onclick="act('reject','\${esc(p.userid)}')">Reject</button>
+    </div>\`).join('') : '<div class="empty">No pending requests.</div>';
+  document.getElementById('friends').innerHTML = fr.length ? fr.map(f => {
+    const uid = f.userid||f.carrierId;
+    const nm = friendName(f, uid);
+    const lm = f.lastMessage;
+    const preview = lm ? ((lm.dir==='out'?'You: ':'') + lm.text) : (f.status||'offline');
+    const badge = f.unread ? '<span style="background:#e74c3c;color:#fff;border-radius:10px;padding:0 .45rem;font-size:.7rem;margin-left:.4rem">'+f.unread+'</span>' : '';
+    return \`<div class="row" style="cursor:pointer" onclick="openChat('\${esc(uid)}')" title="open chat">
+      \${avatar(uid, nm, f.status)}
+      <div class="meta"><div class="name">\${esc(nm)}\${badge}</div>
+        <div class="sub"><span class="dot \${esc(f.status||'offline')}" style="display:inline-block;vertical-align:middle"></span> \${esc(preview)}</div></div>
+      <button onclick="event.stopPropagation();editAlias('\${esc(uid)}')" title="rename" style="padding:.2rem .55rem">✎</button>
+      <button class="reject" onclick="event.stopPropagation();delFriend('\${esc(uid)}')" title="remove friend" style="padding:.2rem .55rem">×</button>
+    </div>\`;
+  }).join('') : '<div class="empty">No friends yet.</div>';
+}
+// The build default "@decentnetwork/peer" is useless (every node sends it) —
+// treat it as no-name and fall back to alias / short userid.
+function friendName(f, uid){
+  const n = f.alias || (f.name && f.name !== '@decentnetwork/peer' ? f.name : '');
+  return n || short(uid);
+}
+// Deterministic colored-initial avatar from the userid (no protocol/avatar
+// exchange needed yet — same userid always gets the same color + letter).
+function avatar(uid, nm, status){
+  const colors=['#e74c3c','#e67e22','#f39c12','#16a085','#27ae60','#2980b9','#8e44ad','#2c3e50','#d35400','#c0392b'];
+  let h=0; for(let i=0;i<String(uid).length;i++) h=(h*31+uid.charCodeAt(i))>>>0;
+  const c=colors[h%colors.length];
+  const ch=((nm||'?').trim().charAt(0)||'?').toUpperCase();
+  return '<span style="display:inline-flex;width:2rem;height:2rem;border-radius:50%;background:'+c+';color:#fff;align-items:center;justify-content:center;font-weight:700;flex:0 0 auto">'+esc(ch)+'</span>';
+}
+function copyId(){ const id=(window.me&&(window.me.address||window.me.userid))||''; if(id&&navigator.clipboard){ navigator.clipboard.writeText(id); toast('Your address copied — share it so others can add you'); } }
+async function delFriend(uid){ if(!confirm('Remove this friend and your messages with them?')) return; const r=await api('/api/friend-remove',{userid:uid}); toast(r.ok?'Removed':(r.error||'failed')); if(chatWith===uid) closeChat(); refresh(); }
+async function editAlias(uid){ const cur=(window.friendsById[uid]||{}).alias||''; const a=prompt('Local name for this friend (empty to clear):', cur); if(a===null) return; const r=await api('/api/friend-alias',{userid:uid,alias:a}); toast(r.ok?'Saved':(r.error||'failed')); refresh(); }
+async function act(kind, userid){ const r = await api('/api/'+kind, {userid}); toast(r.ok? (kind==='accept'?'Accepted':'Rejected') : (r.error||'failed')); refresh(); }
+async function addFriend(){ const a=document.getElementById('addr'); const v=a.value.trim(); if(!v) return; const r=await api('/api/add',{address:v}); toast(r.ok?'Friend-request sent':(r.error||'failed')); if(r.ok) a.value=''; refresh(); }
+document.getElementById('addr').addEventListener('keydown', e=>{ if(e.key==='Enter') addFriend(); });
+
+let chatWith = null, chatTimer = null;
+async function openChat(userid){
+  chatWith = userid;
+  const f = window.friendsById[userid] || {};
+  document.getElementById('chatName').textContent = friendName(f, userid);
+  document.getElementById('chatSub').textContent = (f.status||'') + ' · ' + short(userid);
+  document.getElementById('chat').style.display = 'block';
+  api('/api/chat-mark-read', {userid});   // clears the unread badge
+  await renderChat();
+  clearInterval(chatTimer); chatTimer = setInterval(renderChat, 2000);
+  document.getElementById('chatInput').focus();
+}
+function closeChat(){ chatWith = null; clearInterval(chatTimer); document.getElementById('chat').style.display='none'; refresh(); }
+async function renderChat(){
+  if(!chatWith) return;
+  let h; try { h = await api('/api/chat-history?peer='+encodeURIComponent(chatWith)); } catch(e){ return; }
+  const msgs = (h.chats && h.chats[chatWith]) || [];
+  const log = document.getElementById('chatLog');
+  log.innerHTML = msgs.length ? msgs.map(m => \`<div style="align-self:\${m.dir==='out'?'flex-end':'flex-start'};max-width:75%;padding:.4rem .7rem;border-radius:12px;background:\${m.dir==='out'?'#3478f6':'#8883'};color:\${m.dir==='out'?'#fff':'inherit'}">\${esc(m.text)}</div>\`).join('') : '<div class="empty">No messages yet — say hi.</div>';
+  log.scrollTop = log.scrollHeight;
+}
+async function sendChat(){
+  const i = document.getElementById('chatInput'); const t = i.value.trim();
+  if(!t || !chatWith) return;
+  i.value='';
+  const r = await api('/api/chat-send', {userid: chatWith, text: t});
+  if(!r.ok) toast(r.error||'send failed');
+  renderChat();
+}
+document.getElementById('chatInput').addEventListener('keydown', e=>{ if(e.key==='Enter') sendChat(); });
+
+// ---- Exit nodes (routes.yaml) ----
+let routesObj = { regions: [], default: 'direct' };
+async function refreshExits(){
+  let r; try { r = await api('/api/routes'); } catch(e){ return; }
+  routesObj = r.routes || { regions: [], default: 'direct' };
+  if(!Array.isArray(routesObj.regions)) routesObj.regions = [];
+  const regions = routesObj.regions;
+  const total = regions.reduce((n,rg)=>n+((rg.exits||[]).length),0);
+  document.getElementById('ecount').textContent = total ? '('+total+')' : '';
+  document.getElementById('exits').innerHTML = regions.length ? regions.map((rg)=> \`
+    <div class="row" style="flex-direction:column; align-items:stretch; gap:.3rem">
+      <div class="name">\${esc(rg.name)} \${(rg.exits||[]).length? '':'<span class="sub">(empty → direct)</span>'}</div>
+      \${(rg.exits||[]).map(ip=>\`<div class="sub" style="display:flex; gap:.5rem; align-items:center"><span style="flex:1">\${esc(ip)}</span><button class="reject" onclick="removeExit('\${esc(rg.name)}','\${esc(ip)}')">×</button></div>\`).join('')}
+    </div>\`).join('') : '<div class="empty">No routes.yaml regions — using auto-discovery.</div>';
+}
+function saveRoutes(){ return api('/api/routes', { routes: JSON.stringify(routesObj) }); }
+async function addExit(){
+  const ip=document.getElementById('exitIp').value.trim(), region=(document.getElementById('exitRegion').value.trim()||'china');
+  if(!ip) return;
+  let rg = routesObj.regions.find(x=>x.name===region);
+  if(!rg){ rg={name:region, exits:[]}; routesObj.regions.push(rg); }
+  rg.exits = rg.exits||[]; if(!rg.exits.includes(ip)) rg.exits.push(ip);
+  const r = await saveRoutes(); toast(r.ok?'Added — restart the router to apply':(r.error||'failed'));
+  document.getElementById('exitIp').value=''; refreshExits();
+}
+async function removeExit(region, ip){
+  const rg = routesObj.regions.find(x=>x.name===region); if(!rg) return;
+  rg.exits = (rg.exits||[]).filter(x=>x!==ip);
+  const r = await saveRoutes(); toast(r.ok?'Removed — restart the router to apply':(r.error||'failed')); refreshExits();
+}
+
+// ---- Dora allocations (if this node runs a dora server) ----
+async function refreshDora(){
+  let d; try { d = await api('/api/dora'); } catch(e){ return; }
+  const panel = document.getElementById('doraPanel');
+  if(!d.isDora){ panel.style.display='none'; return; }
+  panel.style.display='block';
+  const recs = d.records || [];
+  document.getElementById('dcount').textContent = '('+recs.length+')';
+  document.getElementById('dora').innerHTML = recs.length ? recs.map(r => \`
+    <div class="row">
+      <div class="meta"><div class="name">\${esc(r.name||'unnamed')} · \${esc(r.virtualIp||'')}</div>
+        <div class="sub">\${esc(short(r.userid))}</div></div>
+    </div>\`).join('') : '<div class="empty">No nodes registered yet.</div>';
+}
+
+refresh(); refreshExits(); refreshDora();
+setInterval(refresh, 3000); setInterval(refreshExits, 8000); setInterval(refreshDora, 5000);
+</script>
+</body></html>`;