loom-agent 1.2.0

package/src/tui/tool-display.ts

@@ -0,0 +1,176 @@
+// Data-driven tool display registry — opencode's model, in one place: every
+// tool's chat presentation (icon, pending label, spinner, done label, block
+// rendering, diff/todo behavior) lives HERE as data. The chat renderer never
+// checks tool names; it looks up the display for each tool and falls back to
+// the GenericTool defaults (⚙, "Writing command...", "# {name} {args}" block)
+// for anything it has never seen — MCP servers, custom tools, future tools.
+// That is the agent's freedom: any tool it calls shows up in the chat.
+import { prettyToolName, prettyToolArgs } from "./toolname.ts";
+
+export interface ToolDisplay {
+  icon: string;
+  pending: string;
+  // opencode passes spinner=true for exactly read/task/execute; every other
+  // tool shows the quiet "~ pending" text while it runs.
+  spinner?: boolean;
+  // The "done" row label, summarised from the call's args.
+  label: (inp: any) => string;
+  // Tools that swap their row for a BLOCK once the result is back (opencode's
+  // BlockTool components): bash → "$ cmd" with the output, unknown tools →
+  // "# {name} {args}" with the output. title builds the block header from the
+  // tool part; maxLines caps the output preview (bash 10, generic 3).
+  block?: { title: (t: any) => string; maxLines?: number };
+  // A finished write/edit renders its diff inline instead of the row.
+  diff?: boolean;
+  // A done todowrite collapses into the "# Todos" block.
+  todos?: boolean;
+  // Done/error rows use ✓/✗ (task/execute), not the plain icon.
+  check?: boolean;
+  // The row is suppressed while the message's subagent panel is up (task).
+  subagent?: boolean;
+  // Tools that STREAM their output live while running (bash): the chat shows a
+  // growing, collapsible terminal block instead of the quiet pending row.
+  live?: boolean;
+  // How the loop captures what changed for this tool's diff: "file" snapshots
+  // the path before/after, "bash" diffs the tree around the command.
+  diffs?: "file" | "bash" | null;
+}
+
+// Null-prototype object: names like "constructor"/"toString" must NOT resolve
+// to inherited Object.prototype members — they fall back to the generic entry.
+const TOOL_DISPLAY: Record<string, ToolDisplay> = Object.assign(Object.create(null), {
+  bash: {
+    icon: "$",
+    pending: "Writing command...",
+    label: (i) => String(i?.command || "command"),
+    block: { title: (t) => "$ " + (t.label || t.name), maxLines: 10 },
+    diffs: "bash",
+    live: true,
+  },
+  read: {
+    icon: "\u2192",
+    pending: "Reading file...",
+    spinner: true,
+    label: (i) => "Read " + (i?.filePath || "file"),
+    diffs: null,
+  },
+  write: {
+    icon: "\u2190",
+    pending: "Preparing write...",
+    label: (i) => "Write " + (i?.filePath || "file"),
+    diff: true,
+    diffs: "file",
+  },
+  edit: {
+    icon: "\u2190",
+    pending: "Preparing edit...",
+    label: (i) => "Edit " + (i?.filePath || "file"),
+    diff: true,
+    diffs: "file",
+  },
+  glob: {
+    icon: "\u2731",
+    pending: "Finding files...",
+    label: (i) => "Glob \u0022" + String(i?.pattern || "") + "\u0022",
+    diffs: null,
+  },
+  grep: {
+    icon: "\u2731",
+    pending: "Searching content...",
+    label: (i) => "Grep \u0022" + String(i?.pattern || "") + "\u0022",
+    diffs: null,
+  },
+  webfetch: {
+    icon: "%",
+    pending: "Fetching from the web...",
+    label: (i) => "WebFetch " + (i?.url || "url"),
+    diffs: null,
+  },
+  websearch: {
+    icon: "\u25C8",
+    pending: "Searching web...",
+    label: (i) => "WebSearch \u0022" + String(i?.query || "") + "\u0022",
+    diffs: null,
+  },
+  todowrite: {
+    icon: "\u2699",
+    pending: "Updating todos...",
+    label: () => "Todos",
+    todos: true,
+    diffs: null,
+  },
+  task: {
+    icon: "\u2502",
+    pending: "Delegating...",
+    spinner: true,
+    check: true,
+    subagent: true,
+    label: () => "Task",
+    diffs: null,
+  },
+  execute: {
+    icon: "\u2502",
+    pending: "Delegating...",
+    spinner: true,
+    check: true,
+    label: () => "Execute",
+    diffs: null,
+  },
+  skill: {
+    icon: "\u2192",
+    pending: "Loading skill...",
+    label: (i) => "Skill \u0022" + String(i?.name || "") + "\u0022",
+    diffs: null,
+  },
+  ask: {
+    icon: "\u2192",
+    pending: "Asking...",
+    label: () => "Ask",
+    diffs: null,
+  },
+  question: {
+    icon: "\u2192",
+    pending: "Asking...",
+    label: () => "Ask",
+    diffs: null,
+  },
+});
+
+// The GenericTool fallback (opencode): ANY unregistered tool renders with the
+// ⚙ icon, "Writing command..." pending, "{name} {args}" label, and an output
+// block once it returns something. No registry entry required.
+function genericDisplay(name: string): ToolDisplay {
+  return {
+    icon: "\u2699",
+    pending: "Writing command...",
+    label: (i) => {
+      const a = prettyToolArgs(i, 60);
+      return name + (a ? " " + a : "");
+    },
+    block: { title: (t) => "# " + (t.label || t.name), maxLines: 3 },
+    diffs: null,
+  };
+}
+
+export function toolDisplay(name: string): ToolDisplay {
+  return Object.prototype.hasOwnProperty.call(TOOL_DISPLAY, name)
+    ? TOOL_DISPLAY[name]
+    : genericDisplay(prettyToolName(name));
+}
+
+// Compatibility helpers (App stamps parts with these at call time).
+export function toolIcon(name: string): string {
+  return toolDisplay(name).icon;
+}
+export function toolPending(name: string): string {
+  return toolDisplay(name).pending;
+}
+export function toolSpinner(name: string): boolean {
+  return !!toolDisplay(name).spinner;
+}
+export function toolLabel(name: string, inp: unknown): string {
+  return toolDisplay(name).label((inp || {}) as any);
+}
+export function toolIsGeneric(name: string): boolean {
+  return !Object.prototype.hasOwnProperty.call(TOOL_DISPLAY, name);
+}

package/src/tui/toolname.ts

@@ -0,0 +1,60 @@
+// Generic tool-name/arg formatting shared by the chat and the tool log.
+// Per-tool display data (icons, pending labels, spinners, blocks) lives in
+// tool-display.ts — this module only knows how to FORMAT, never which tool
+// is which.
+
+// mcp__memory__read_graph → memory.read_graph  ·  todowrite → todowrite
+export function prettyToolName(name: unknown): string {
+  let n = String(name || "");
+  if (n.indexOf("mcp__") === 0) {
+    const idx = n.indexOf("__", 5);
+    if (idx > 0) n = n.slice(5, idx) + "." + n.slice(idx + 2);
+    else n = n.slice(5);
+  }
+  return n;
+}
+
+// Credential-like keys are redacted (case-insensitive): token, apiKey/api_key,
+// password, authorization, secret. The underscore filter already drops
+// "_"-prefixed keys; values here must never leak into the chat or log.
+const SECRET_KEY_RX = /(^|[_-])(token|api_?key|password|authorization|secret)([_-]|$)/i;
+
+// Compact args for display (opencode's `input()` helper): only primitive
+// values, "key=value" pairs in brackets, capped length. Drops the "_"-prefixed
+// secret-ish keys and nested objects.
+export function prettyToolArgs(inp: unknown, maxLen = 48): string {
+  if (!inp || typeof inp !== "object") return "";
+  const parts: string[] = [];
+  for (const [k, v] of Object.entries(inp as Record<string, unknown>)) {
+    if (k.startsWith("_")) continue;
+    if (typeof v !== "string" && typeof v !== "number" && typeof v !== "boolean") continue;
+    if (SECRET_KEY_RX.test(k)) { parts.push(k + "=[redacted]"); continue; }
+    let s = String(v);
+    if (s.length > 24) s = s.slice(0, 23) + "\u2026";
+    parts.push(k + "=" + s);
+  }
+  if (!parts.length) return "";
+  let s = "[" + parts.join(", ") + "]";
+  if (s.length > maxLen) s = s.slice(0, maxLen - 1) + "\u2026";
+  return s;
+}
+
+// Tool results arrive with terminal escape codes; strip them before the
+// output block renders them (opencode strips ANSI on display too).
+export function stripAnsi(s: string): string {
+  return String(s)
+    .replace(/\u001b\[[0-9;?]*[ -\/]*[@-~]/g, "")
+    .replace(/\u001b\][^\u0007]*(\u0007|\u001b\\)/g, "");
+}
+
+// The full lookup row: "⚡ memory.read_graph {"query":"x"}".
+export function formatToolCall(name: unknown, inp: unknown): string {
+  const a = prettyToolArgs(inp);
+  return "⚡ " + prettyToolName(name) + (a ? " " + a : "");
+}
+
+// And the append-only tool log line (same content, for the log box).
+export function formatToolLogLine(name: unknown, inp: unknown): string {
+  const a = prettyToolArgs(inp, 60);
+  return prettyToolName(name) + (a ? " " + a : "");
+}

package/src/tui/tui-config.ts

@@ -0,0 +1,28 @@
+// Shared tui.json access (theme.ts, store.ts, keybinds.ts): one path
+// resolution honoring LOOM_CONFIG_DIR, with read-modify-write saves so
+// concurrent updates never clobber each other's fields.
+import fs from "fs";
+import os from "os";
+import path from "path";
+
+export function tuiStatePath(): string {
+  return process.env.LOOM_CONFIG_DIR
+    ? path.join(process.env.LOOM_CONFIG_DIR, "tui.json")
+    : path.join(os.homedir(), ".loom", "tui.json");
+}
+
+export function loadTuiJson(): any {
+  try {
+    const p = tuiStatePath();
+    return fs.existsSync(p) ? (JSON.parse(fs.readFileSync(p, "utf8")) || {}) : {};
+  } catch { return {}; }
+}
+
+export function saveTuiJson(patch: any): void {
+  try {
+    const p = tuiStatePath();
+    const data = Object.assign({}, loadTuiJson(), patch);
+    fs.mkdirSync(path.dirname(p), { recursive: true });
+    fs.writeFileSync(p, JSON.stringify(data, null, 2));
+  } catch {}
+}

package/src/tui-open.tsx

@@ -0,0 +1,51 @@
+#!/usr/bin/env bun
+// Loom Code — OpenTUI entry point.
+// Usage: bun run src/tui-open.tsx [prompt...]  OR  bun src/tui-open.tsx -s <session-id>
+import { render } from "@opentui/solid";
+import { App } from "./tui/App.tsx";
+import { defaultMcpInstall } from "./core/plugin-cmd.js";
+
+const args = process.argv.slice(2);
+
+if (args.includes("--version") || args.includes("-v")) {
+  console.log("loom-code v1.2.0");
+  process.exit(0);
+}
+
+if (args.includes("--help") || args.includes("-h")) {
+  console.log("loom - AI coding agent (OpenTUI edition)");
+  console.log("Usage: bun run src/tui-open.tsx [prompt...]");
+  console.log("  bun run src/tui-open.tsx            Start interactive TUI");
+  console.log("  bun run src/tui-open.tsx \"prompt\"   Start with prompt");
+  console.log("  bun run src/tui-open.tsx -s <id>    Resume session");
+  console.log("  bun run src/tui-open.tsx -p \"q\"     Print mode (one-shot)");
+  console.log("  bun run src/tui-open.tsx --auto     Auto-approve permissions");
+  process.exit(0);
+}
+
+const pIdx = args.indexOf("-p");
+const printMode = pIdx !== -1;
+const sIdx = args.indexOf("-s");
+const sessionId = sIdx !== -1 ? args[sIdx + 1] : null;
+const autoMode = args.includes("--auto") || args.includes("-a");
+const initialPrompt = args.filter((a, i) => !a.startsWith("-") && (sIdx === -1 || i !== sIdx + 1)).join(" ");
+
+defaultMcpInstall();
+
+if (printMode) {
+  const { Session } = require("./core/session.js");
+  const sess = new Session();
+  if (autoMode) sess.permissions.setAuto(true);
+  const query = args[pIdx + 1] || initialPrompt || "Hello";
+  const resp = await sess.sendUserMessage(query);
+  if (resp.type === "text") console.log(resp.content);
+  else console.error(resp.content || "(error)");
+  process.exit(resp.type === "error" ? 1 : 0);
+}
+
+render(() => <App initialPrompt={initialPrompt} resumeSession={sessionId} autoMode={autoMode} />, {
+  targetFps: 60,
+  useMouse: true,
+  autoFocus: true,
+  exitOnCtrlC: false,
+});

package/src/web/attach.js

@@ -0,0 +1,242 @@
+// loom attach <url> — terminal client for a running `loom web` server. Shares
+// the same sessions and state: pick an existing session (or create a new one),
+// then chat from the terminal. Streaming is plain Server-Sent Events parsed
+// from a fetch ReadableStream.
+//
+//   loom attach http://localhost:4096
+//   loom attach http://loom.local:80
+//   LOOM_SERVER_PASSWORD=... loom attach http://localhost:4096
+//   loom attach http://localhost:4096 --username me --password secret
+//
+// This is a line-mode attach (not the full OpenTUI): the SolidJS TUI runs in-
+// process and isn't rewired to a remote server yet, so terminal attach is the
+// honest v1 that actually shares state with the browser.
+'use strict';
+
+const readline = require('readline');
+
+const COLOR = {
+  reset: '\x1b[0m', bold: '\x1b[1m', dim: '\x1b[2m',
+  blue: '\x1b[34m', gray: '\x1b[90m', cyan: '\x1b[36m',
+  yellow: '\x1b[33m', red: '\x1b[31m', green: '\x1b[32m',
+};
+
+function parseArgs(argv) {
+  const out = { url: null, username: process.env.LOOM_SERVER_USERNAME || null, password: process.env.LOOM_SERVER_PASSWORD || null, sessionId: null };
+  for (let i = 0; i < argv.length; i++) {
+    const a = argv[i];
+    if (a === '--username' || a === '-u') out.username = argv[++i];
+    else if (a === '--password' || a === '-p') out.password = argv[++i];
+    else if (a === '--session' || a === '-s') out.sessionId = argv[++i];
+    else if (a === '--help' || a === '-h') out.help = true;
+    else if (!a.startsWith('-') && !out.url) out.url = a;
+  }
+  return out;
+}
+
+async function jsonFetch(client, path, options) {
+  const opts = options ? { ...options, headers: { ...(options.headers || {}), ...(client.cookie ? { Cookie: client.cookie } : {}) } }
+    : (client.cookie ? { headers: { Cookie: client.cookie } } : undefined);
+  const res = await fetch(new URL(path, client.base), opts);
+  if (res.status === 401) {
+    const err = new Error('unauthorized');
+    err.unauthorized = true;
+    throw err;
+  }
+  const ct = res.headers.get('content-type') || '';
+  const body = ct.includes('json') ? await res.json() : await res.text();
+  if (!res.ok) throw new Error(body && body.error ? body.error : res.statusText);
+  return body;
+}
+
+async function ensureAuth(client) {
+  // Try fetching /api/auth: if required and we have credentials, POST /api/auth/login.
+  let info;
+  try { info = await jsonFetch(client, '/api/auth'); } catch (e) { if (e.unauthorized) throw e; info = { required: false }; }
+  if (!info.required) { client.cookie = null; return; }
+  if (!client.username || !client.password) {
+    console.error('Server is password-protected. Pass --username and --password, or set LOOM_SERVER_USERNAME / LOOM_SERVER_PASSWORD.');
+    process.exit(2);
+  }
+  const res = await fetch(new URL('/api/auth', client.base), {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ username: client.username, password: client.password }),
+  });
+  if (!res.ok) {
+    console.error('Login failed (' + res.status + ').');
+    process.exit(2);
+  }
+  const sc = res.headers.get('set-cookie') || '';
+  const token = /(?:^|;\s*)loom_token=([^;\s]+)/.exec(sc)?.[1];
+  client.cookie = token ? 'loom_token=' + token : null;
+}
+
+function makeClient(args) {
+  if (!args.url) { console.error('Usage: loom attach <url> [--username U --password P] [--session ID]'); process.exit(2); }
+  let u;
+  try { u = new URL(args.url); } catch { console.error('Invalid URL: ' + args.url); process.exit(2); }
+  if (u.protocol !== 'http:' && u.protocol !== 'https:') { console.error('Only http/https URLs are supported.'); process.exit(2); }
+  return { base: u, cookie: null, username: args.username, password: args.password };
+}
+
+async function chooseSession(client) {
+  const { sessions } = await jsonFetch(client, '/api/sessions');
+  if (!sessions.length) {
+    console.log(COLOR.gray + '(no saved sessions — a new chat will be created)' + COLOR.reset);
+    return { id: null };
+  }
+  console.log(COLOR.bold + 'Sessions' + COLOR.reset);
+  sessions.forEach((s, i) => {
+    const when = s.createdAt ? new Date(s.createdAt).toLocaleString() : 'unknown';
+    const meta = [when, (s.messageCount || 0) + ' msgs', s.provider ? s.provider : '', s.model ? s.model : ''].filter(Boolean).join(' · ');
+    console.log('  ' + COLOR.cyan + (i + 1) + COLOR.reset + ') ' + s.id + '  ' + COLOR.gray + meta + COLOR.reset + (s.active ? ' ' + COLOR.green + '(active)' + COLOR.reset : ''));
+  });
+  console.log('  ' + COLOR.cyan + '0' + COLOR.reset + ') New chat');
+  const rl = readline.createInterface({ input: process.stdin, output: process.stdout });
+  const ans = await new Promise((resolve) => rl.question(COLOR.bold + 'Choose [0-' + sessions.length + ']: ' + COLOR.reset, (v) => { rl.close(); resolve(v.trim()); }));
+  const n = parseInt(ans, 10);
+  if (!isNaN(n) && n >= 1 && n <= sessions.length) {
+    const chosen = sessions[n - 1];
+    return { id: chosen.id, transcript: chosen };
+  }
+  return { id: null };
+}
+
+async function loadTranscript(client, id) {
+  try {
+    const { session } = await jsonFetch(client, '/api/sessions/' + id);
+    if (session && session.messages && session.messages.length) {
+      console.log(COLOR.gray + '\nTranscript (' + session.messages.length + ' messages):' + COLOR.reset);
+      for (const m of session.messages) {
+        const who = m.role === 'user' ? COLOR.blue + 'you' : COLOR.green + 'loom';
+        const content = String(m.content || '');
+        console.log('  ' + who + COLOR.reset + ': ' + content.split('\n').join('\n      '));
+      }
+      console.log('');
+    }
+  } catch (e) {
+    if (!e.unauthorized) console.error(COLOR.gray + '(could not load transcript: ' + e.message + ')' + COLOR.reset);
+  }
+}
+
+async function createSession(client) {
+  const { id } = await jsonFetch(client, '/api/sessions', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ mode: 'build' }) });
+  return id;
+}
+
+async function streamChat(client, id, text, rlState) {
+  const headers = { 'Content-Type': 'application/json' };
+  if (client.cookie) headers.Cookie = client.cookie;
+  let res;
+  try {
+    res = await fetch(new URL('/api/chat', client.base), {
+      method: 'POST', headers,
+      body: JSON.stringify({ id, message: text }),
+    });
+  } catch (e) {
+    console.error(COLOR.red + 'Network error: ' + e.message + COLOR.reset);
+    return { error: e.message };
+  }
+  if (res.status === 401) { ensureAuth(client).catch(() => {}); return { unauthorized: true }; }
+  if (!res.ok) { const body = await res.text().catch(() => ''); console.error(COLOR.red + 'Server ' + res.status + ': ' + body + COLOR.reset); return { error: body }; }
+
+  const reader = res.body.getReader();
+  const dec = new TextDecoder();
+  let buf = '';
+  let text_started = false;
+  process.stdout.write(COLOR.green + 'loom' + COLOR.reset + ': ');
+  const flushTextStart = () => { if (!text_started) { text_started = true; } };
+  const newline = () => { if (text_started) process.stdout.write('\n'); };
+  for (;;) {
+    const { value, done } = await reader.read();
+    if (done) break;
+    buf += dec.decode(value, { stream: true });
+    let idx;
+    while ((idx = buf.indexOf('\n\n')) !== -1) {
+      const raw = buf.slice(0, idx); buf = buf.slice(idx + 2);
+      const line = raw.split('\n').find((l) => l.startsWith('data: '));
+      if (!line) continue;
+      let ev; try { ev = JSON.parse(line.slice(6)); } catch { continue; }
+      switch (ev.type) {
+        case 'delta': flushTextStart(); process.stdout.write(ev.text || ''); break;
+        case 'reasoning': flushTextStart(); process.stdout.write(COLOR.gray + (ev.text || '') + COLOR.reset); break;
+        case 'tool.use':
+          newline();
+          console.log(COLOR.dim + '  ↳ tool: ' + COLOR.yellow + ev.name + COLOR.reset + COLOR.dim + ' ' + (() => { try { return JSON.stringify(ev.input); } catch { return ''; } })().slice(0, 200) + COLOR.reset);
+          break;
+        case 'tool.result':
+          newline();
+          console.log(COLOR.dim + '  ↳ result: ' + String(ev.result != null ? (typeof ev.result === 'string' ? ev.result : JSON.stringify(ev.result)) : '').slice(0, 240) + COLOR.reset);
+          break;
+        case 'request.error': newline(); console.error(COLOR.red + 'error: ' + (ev.message || '') + COLOR.reset); return { error: ev.message };
+        case 'request.completed': newline(); break;
+        case 'done': newline(); return { ok: true };
+      }
+    }
+  }
+  newline();
+  return { ok: true };
+}
+
+async function cancelCurrent(client, id) {
+  try {
+    const headers = { 'Content-Type': 'application/json' };
+    if (client.cookie) headers.Cookie = client.cookie;
+    await fetch(new URL('/api/cancel', client.base), { method: 'POST', headers, body: JSON.stringify({ id }) });
+  } catch {}
+}
+
+async function main() {
+  const args = parseArgs(process.argv.slice(2));
+  if (args.help) {
+    console.log('Usage: loom attach <url> [options]');
+    console.log('  --username, -u   Username for password-protected server');
+    console.log('  --password, -p   Password (or set LOOM_SERVER_PASSWORD)');
+    console.log('  --session, -s    Resume a specific session id without prompting');
+    process.exit(0);
+  }
+  const client = makeClient(args);
+  await ensureAuth(client);
+
+  // Try to verify the server is reachable.
+  try {
+    const { ok } = await jsonFetch(client, '/api/health');
+    if (!ok) throw new Error('health failed');
+  } catch (e) {
+    if (e.unauthorized) { /* auth handled above; ok */ }
+    else { console.error(COLOR.red + 'Cannot reach ' + client.base + ' (' + e.message + ').' + COLOR.reset); process.exit(2); }
+  }
+
+  let sessionId = args.sessionId || null;
+  if (!sessionId) {
+    const pick = await chooseSession(client);
+    sessionId = pick.id;
+    if (!sessionId) sessionId = await createSession(client);
+  }
+  console.log(COLOR.gray + 'Attached to ' + client.base + ' — session ' + sessionId + COLOR.reset);
+  if (!args.sessionId) await loadTranscript(client, sessionId);
+
+  const rl = readline.createInterface({ input: process.stdin, output: process.stdout, terminal: true });
+  let busy = false;
+  let stopping = false;
+  rl.on('SIGINT', () => {
+    if (busy) { stopping = true; cancelCurrent(client, sessionId).catch(() => {}); console.log(COLOR.gray + '\n(stopping)' + COLOR.reset); }
+    else { console.log(COLOR.gray + '\nbye.' + COLOR.reset); rl.close(); process.exit(0); }
+  });
+  const ask = () => new Promise((resolve) => rl.question(COLOR.bold + '> ' + COLOR.reset, (v) => resolve(v.trim())));
+  for (;;) {
+    let text;
+    try { text = await ask(); } catch { break; }
+    if (!text) continue;
+    if (text === '/exit' || text === ':q') { console.log(COLOR.gray + 'bye.' + COLOR.reset); break; }
+    busy = true; stopping = false;
+    console.log(COLOR.blue + 'you' + COLOR.reset + ': ' + text);
+    await streamChat(client, sessionId, text, {});
+    busy = false;
+  }
+  rl.close();
+  process.exit(0);
+}
+
+module.exports = { main };