@wrongstack/webui 0.8.4 → 0.8.6

package/dist/server/index.js

@@ -32,7 +32,7 @@ import { decryptConfigSecrets, encryptConfigSecrets } from "@wrongstack/core/sec
 import { buildProviderFactoriesFromRegistry, makeProviderFromConfig } from "@wrongstack/providers";
 import { builtinToolsPack, forgetTool, rememberTool } from "@wrongstack/tools";
 import { WebSocket, WebSocketServer } from "ws";
-import { randomBytes } from "crypto";
+import { randomBytes, timingSafeEqual } from "crypto";
 
 // ../runtime/src/container.ts
 import {
@@ -134,7 +134,475 @@ function patchConfig(config, updates) {
   return Object.freeze({ ...config, ...updates });
 }
 
+// src/server/autophase-ws-handler.ts
+import { spawnSync } from "child_process";
+import {
+  AutoPhasePlanner,
+  PhaseGraphBuilder,
+  PhaseOrchestrator,
+  PhaseStore,
+  WorktreeManager
+} from "@wrongstack/core";
+function isGitRepo(cwd) {
+  try {
+    const r = spawnSync("git", ["rev-parse", "--is-inside-work-tree"], { cwd, encoding: "utf8" });
+    return r.status === 0 && r.stdout.trim() === "true";
+  } catch {
+    return false;
+  }
+}
+var AutoPhaseWebSocketHandler = class {
+  constructor(agent, context, logger, storeDir, events, projectRoot) {
+    this.agent = agent;
+    this.context = context;
+    this.logger = logger;
+    this.events = events;
+    this.projectRoot = projectRoot;
+    this.store = new PhaseStore({ baseDir: storeDir });
+  }
+  agent;
+  context;
+  logger;
+  events;
+  projectRoot;
+  orchestrator = null;
+  graph = null;
+  store;
+  clients = /* @__PURE__ */ new Set();
+  broadcastInterval = null;
+  /** Aborts in-flight task agents when the run is stopped. */
+  abort = null;
+  /** Optional per-phase git-worktree isolation (lazily created at start). */
+  worktrees = null;
+  addClient(ws) {
+    const client = { ws, id: crypto.randomUUID() };
+    this.clients.add(client);
+    ws.on("close", () => this.clients.delete(client));
+    ws.on("error", () => this.clients.delete(client));
+    this.sendState(client);
+  }
+  async handleMessage(msg) {
+    switch (msg.type) {
+      case "autophase.start":
+        await this.handleStart(msg.payload);
+        break;
+      case "autophase.pause":
+        this.orchestrator?.pause();
+        this.broadcast({ type: "autophase.paused", payload: {} });
+        break;
+      case "autophase.resume":
+        this.orchestrator?.resume();
+        this.broadcast({ type: "autophase.resumed", payload: {} });
+        break;
+      case "autophase.stop":
+        this.abort?.abort();
+        this.orchestrator?.stop();
+        this.stopBroadcast();
+        if (this.graph) void this.store.save(this.graph);
+        this.broadcast({ type: "autophase.stopped", payload: {} });
+        break;
+      case "autophase.status":
+        this.broadcastState();
+        break;
+      case "autophase.selectPhase": {
+        const phaseId = msg.payload?.phaseId;
+        if (phaseId && this.graph) {
+          this.broadcastState(phaseId);
+        }
+        break;
+      }
+      case "autophase.taskStatus": {
+        const { taskId, status } = msg.payload;
+        await this.handleTaskStatusChange(taskId, status);
+        break;
+      }
+      case "autophase.toggleAutonomous": {
+        const autonomous = msg.payload?.autonomous ?? !this.graph?.autonomous;
+        if (this.graph) {
+          this.graph.autonomous = autonomous;
+          await this.store.save(this.graph);
+          this.broadcast({ type: "autophase.state", payload: this.buildState() });
+        }
+        break;
+      }
+      case "autophase.save": {
+        if (this.graph) {
+          await this.store.save(this.graph);
+          this.broadcast({ type: "autophase.saved", payload: { graphId: this.graph.id } });
+        }
+        break;
+      }
+      case "autophase.list": {
+        const graphs = await this.store.list();
+        this.broadcast({ type: "autophase.list", payload: { graphs } });
+        break;
+      }
+      case "autophase.load": {
+        const graphId = msg.payload?.graphId;
+        if (graphId) {
+          const graph = await this.store.load(graphId);
+          if (graph) {
+            this.graph = graph;
+            this.broadcast({ type: "autophase.state", payload: this.buildState() });
+          } else {
+            this.broadcast({ type: "autophase.error", payload: { message: `Graph not found: ${graphId}` } });
+          }
+        }
+        break;
+      }
+    }
+  }
+  async handleStart(payload) {
+    const title = payload?.goal || payload?.title || "Untitled Project";
+    const autonomous = payload?.autonomous ?? true;
+    const phases = Array.isArray(payload?.phases) ? payload.phases : await this.planPhases(title);
+    this.logger.info(`[AutoPhase] Starting: ${title}`);
+    const graph = await new PhaseGraphBuilder({ title, phases, autonomous }).build();
+    this.graph = graph;
+    this.abort = new AbortController();
+    await this.store.save(graph);
+    if (!this.worktrees && this.events && this.projectRoot && process.env["WRONGSTACK_AUTOPHASE_WORKTREES"] !== "0" && isGitRepo(this.projectRoot)) {
+      this.worktrees = new WorktreeManager({ projectRoot: this.projectRoot, events: this.events });
+    }
+    this.orchestrator = new PhaseOrchestrator({
+      graph,
+      ctx: {
+        executeTask: async (task, phaseId, env) => {
+          this.logger.info(`[AutoPhase] [${phaseId}] Executing: ${task.title}`);
+          const result = await this.executeTaskWithAgent(task, phaseId, env);
+          this.logger.info(`[AutoPhase] [${phaseId}] Completed: ${task.title}`);
+          return result;
+        },
+        onPhaseComplete: (phase) => {
+          this.logger.info(`[AutoPhase] Phase completed: ${phase.name}`);
+          void this.store.save(graph);
+          this.broadcastState();
+        },
+        onPhaseFail: (phase, error) => {
+          this.logger.error(`[AutoPhase] Phase failed: ${phase.name} \u2014 ${error.message}`);
+          void this.store.save(graph);
+          this.broadcastState();
+        }
+      },
+      worktrees: this.worktrees ?? void 0,
+      autonomous,
+      // Must stay 1: phase tasks run on the single shared context whose cwd we
+      // swap per phase, so parallel phases would race on context.cwd.
+      maxConcurrentPhases: 1,
+      // Sequential within a phase: each todo is a full-tool agent editing the
+      // phase worktree, so running two at once risks concurrent writes.
+      maxConcurrentTasks: 1
+    });
+    this.startBroadcast();
+    this.broadcastState();
+    void this.orchestrator.start().then(() => {
+      this.orchestrator?.stop();
+      void this.store.save(graph);
+      this.stopBroadcast();
+      const failed = graph.failedPhaseIds.length > 0;
+      this.broadcast(
+        failed ? { type: "autophase.failed", payload: { title } } : { type: "autophase.completed", payload: { title } }
+      );
+      this.broadcastState();
+    }).catch((err) => {
+      this.logger.error(`[AutoPhase] Aborted: ${err instanceof Error ? err.message : String(err)}`);
+      this.stopBroadcast();
+      this.broadcast({ type: "autophase.failed", payload: { title, error: String(err) } });
+    });
+  }
+  /** Generic fallback phases when the LLM planner produces nothing usable. */
+  defaultPhases() {
+    return [
+      { name: "Discovery", description: "Requirements gathering", priority: "high", estimateHours: 2, parallelizable: false },
+      { name: "Design", description: "Architecture and design", priority: "critical", estimateHours: 4, parallelizable: false },
+      { name: "Implementation", description: "Core development", priority: "critical", estimateHours: 12, parallelizable: false },
+      { name: "Testing", description: "Unit and integration tests", priority: "high", estimateHours: 6, parallelizable: true },
+      { name: "Deployment", description: "Deploy to production", priority: "medium", estimateHours: 2, parallelizable: false }
+    ];
+  }
+  /** Plan phases+todos for the goal via the LLM; fall back to defaults on failure. */
+  async planPhases(goal) {
+    try {
+      const planner = new AutoPhasePlanner({
+        goal,
+        runOnce: async (prompt) => {
+          const result = await this.agent.run(prompt, { signal: new AbortController().signal });
+          return result.status === "done" ? result.finalText ?? "" : "";
+        }
+      });
+      const { phases, parseFailed } = await planner.plan();
+      if (!parseFailed && phases.length > 0) {
+        const todos = phases.reduce((n, p) => n + (p.taskTemplates?.length ?? 0), 0);
+        this.logger.info(`[AutoPhase] Planned ${phases.length} phases / ${todos} todos for: ${goal}`);
+        return phases;
+      }
+      this.logger.info(`[AutoPhase] Planner produced no phases; using defaults for: ${goal}`);
+    } catch (err) {
+      this.logger.error(`[AutoPhase] Planning failed, using defaults: ${err instanceof Error ? err.message : String(err)}`);
+    }
+    return this.defaultPhases();
+  }
+  async executeTaskWithAgent(task, phaseId, env) {
+    const prompt = `Execute task: ${task.title}
+
+Description: ${task.description}
+Phase: ${phaseId}
+Priority: ${task.priority}
+Type: ${task.type}`;
+    const signal = this.abort?.signal ?? new AbortController().signal;
+    const prevCwd = this.context.cwd;
+    if (env?.cwd) this.context.cwd = env.cwd;
+    try {
+      return await this.agent.run(prompt, { signal });
+    } finally {
+      this.context.cwd = prevCwd;
+    }
+  }
+  async handleTaskStatusChange(taskId, status) {
+    if (!this.graph) return;
+    for (const phase of this.graph.phases.values()) {
+      const task = phase.taskGraph.nodes.get(taskId);
+      if (task) {
+        task.status = status;
+        task.updatedAt = Date.now();
+        this.broadcastState();
+        return;
+      }
+    }
+  }
+  startBroadcast() {
+    if (this.broadcastInterval) return;
+    this.broadcastInterval = setInterval(() => {
+      const progress = this.orchestrator?.getProgress();
+      if (progress) this.broadcast({ type: "autophase.progress", payload: progress });
+      this.broadcastState();
+    }, 2e3);
+  }
+  stopBroadcast() {
+    if (this.broadcastInterval) {
+      clearInterval(this.broadcastInterval);
+      this.broadcastInterval = null;
+    }
+  }
+  broadcastState(activePhaseId) {
+    if (!this.graph) return;
+    const state = this.buildState(activePhaseId);
+    this.broadcast({ type: "autophase.state", payload: state });
+  }
+  buildState(activePhaseId) {
+    if (!this.graph) {
+      return { phases: [], tasks: [], overallPercent: 0, autonomous: true, title: "" };
+    }
+    const phases = Array.from(this.graph.phases.values());
+    const currentActiveId = activePhaseId || phases.find((p) => p.status === "running")?.id || phases[0]?.id || "";
+    const activePhase = this.graph.phases.get(currentActiveId);
+    const totalTasks = phases.reduce((sum, p) => sum + p.taskGraph.nodes.size, 0);
+    const completedTasks = phases.reduce(
+      (sum, p) => sum + Array.from(p.taskGraph.nodes.values()).filter((t) => t.status === "completed").length,
+      0
+    );
+    const phaseItems = phases.map((p) => ({
+      id: p.id,
+      name: p.name,
+      description: p.description,
+      status: p.status,
+      priority: p.priority,
+      estimateHours: p.estimateHours,
+      actualDurationMs: p.actualDurationMs,
+      startedAt: p.startedAt,
+      completedAt: p.completedAt,
+      progressPercent: p.taskGraph.nodes.size > 0 ? Math.round(Array.from(p.taskGraph.nodes.values()).filter((t) => t.status === "completed").length / p.taskGraph.nodes.size * 100) : 0,
+      taskCount: p.taskGraph.nodes.size,
+      completedTasks: Array.from(p.taskGraph.nodes.values()).filter((t) => t.status === "completed").length,
+      assignedAgents: p.assignedAgents,
+      isActive: p.id === currentActiveId
+    }));
+    const taskItems = activePhase ? Array.from(activePhase.taskGraph.nodes.values()).map((t) => ({
+      id: t.id,
+      title: t.title,
+      description: t.description,
+      status: t.status,
+      priority: t.priority,
+      type: t.type,
+      estimateHours: t.estimateHours,
+      actualHours: t.actualHours,
+      assignee: t.assignee,
+      tags: t.tags || [],
+      startedAt: t.startedAt,
+      completedAt: t.completedAt
+    })) : [];
+    const completedPhases = phases.filter((p) => p.status === "completed").length;
+    return {
+      title: this.graph.title,
+      phases: phaseItems,
+      tasks: taskItems,
+      activePhaseId: currentActiveId,
+      overallPercent: phases.length > 0 ? Math.round(completedPhases / phases.length * 100) : 0,
+      autonomous: this.graph.autonomous,
+      totalTasks,
+      completedTasks
+    };
+  }
+  sendState(client) {
+    if (!this.graph) return;
+    const state = this.buildState();
+    this.send(client, { type: "autophase.state", payload: state });
+  }
+  broadcast(msg) {
+    const data = JSON.stringify(msg);
+    for (const client of this.clients) {
+      if (client.ws.readyState === 1) {
+        client.ws.send(data);
+      }
+    }
+  }
+  send(client, msg) {
+    if (client.ws.readyState === 1) {
+      client.ws.send(JSON.stringify(msg));
+    }
+  }
+};
+
+// src/server/worktree-ws-handler.ts
+var MAX_ACTIVITY = 6;
+var WorktreeWebSocketHandler = class {
+  constructor(events, logger) {
+    this.events = events;
+    this.logger = logger;
+    this.subscribe();
+  }
+  events;
+  logger;
+  clients = /* @__PURE__ */ new Set();
+  handles = /* @__PURE__ */ new Map();
+  baseBranch = "";
+  broadcastInterval = null;
+  offs = [];
+  addClient(ws) {
+    this.clients.add(ws);
+    ws.on("close", () => this.clients.delete(ws));
+    ws.on("error", () => this.clients.delete(ws));
+    this.send(ws, this.stateMessage());
+  }
+  dispose() {
+    for (const off of this.offs) off();
+    this.offs.length = 0;
+    this.stopBroadcast();
+  }
+  // ── internals ───────────────────────────────────────────────────────────
+  subscribe() {
+    const on = this.events.on.bind(this.events);
+    this.offs.push(
+      on("worktree.allocated", (p) => {
+        const e = p;
+        this.baseBranch = e.baseBranch || this.baseBranch;
+        this.upsert(e.handleId, {
+          handleId: e.handleId,
+          ownerId: e.ownerId,
+          ownerLabel: e.ownerLabel,
+          branch: e.branch,
+          baseBranch: e.baseBranch,
+          status: "active",
+          insertions: 0,
+          deletions: 0,
+          files: 0,
+          allocatedAt: Date.now(),
+          lastEventAt: Date.now(),
+          recentActivity: []
+        });
+        this.activity(e.handleId, "allocated", `branch ${e.branch}`);
+        this.ensureBroadcast();
+      }),
+      on("worktree.committed", (p) => {
+        const e = p;
+        this.patch(e.handleId, { status: "committing", insertions: e.insertions, deletions: e.deletions, files: e.files });
+        if (e.committed) this.activity(e.handleId, "committed", `+${e.insertions}/-${e.deletions} (${e.files}f)`);
+        this.broadcastState();
+      }),
+      on("worktree.merged", (p) => {
+        const e = p;
+        this.patch(e.handleId, { status: "merged" });
+        this.activity(e.handleId, "merged", `\u2192 ${e.baseBranch}`);
+        this.broadcastState();
+      }),
+      on("worktree.conflict", (p) => {
+        const e = p;
+        this.patch(e.handleId, { status: "needs-review", conflictFiles: e.conflictFiles });
+        this.activity(e.handleId, "conflict", e.conflictFiles.join(", "));
+        this.broadcastState();
+      }),
+      on("worktree.failed", (p) => {
+        const e = p;
+        this.patch(e.handleId, { status: "failed" });
+        this.activity(e.handleId, "failed", e.error);
+        this.broadcastState();
+      }),
+      on("worktree.released", (p) => {
+        const e = p;
+        if (!e.kept) this.handles.delete(e.handleId);
+        this.activity(e.handleId, "released", e.kept ? "kept for review" : "removed");
+        if (this.handles.size === 0) this.stopBroadcast();
+        else this.broadcastState();
+      })
+    );
+  }
+  upsert(id, view) {
+    this.handles.set(id, view);
+  }
+  patch(id, patch) {
+    const cur = this.handles.get(id);
+    if (!cur) return;
+    this.handles.set(id, { ...cur, ...patch, lastEventAt: Date.now() });
+  }
+  activity(id, kind, text) {
+    const cur = this.handles.get(id);
+    if (cur) {
+      const recentActivity = [...cur.recentActivity, { kind, text, at: Date.now() }].slice(-MAX_ACTIVITY);
+      this.handles.set(id, { ...cur, recentActivity });
+    }
+    this.broadcast({ type: "worktree.event", payload: { kind, handleId: id, text, at: Date.now() } });
+  }
+  stateMessage() {
+    return {
+      type: "worktree.state",
+      payload: { worktrees: [...this.handles.values()], baseBranch: this.baseBranch }
+    };
+  }
+  broadcastState() {
+    this.broadcast(this.stateMessage());
+  }
+  ensureBroadcast() {
+    this.broadcast(this.stateMessage());
+    if (this.broadcastInterval) return;
+    this.broadcastInterval = setInterval(() => this.broadcast(this.stateMessage()), 2e3);
+  }
+  stopBroadcast() {
+    this.broadcast(this.stateMessage());
+    if (this.broadcastInterval) {
+      clearInterval(this.broadcastInterval);
+      this.broadcastInterval = null;
+    }
+  }
+  broadcast(msg) {
+    const data = JSON.stringify(msg);
+    for (const ws of this.clients) {
+      try {
+        if (ws.readyState === 1) ws.send(data);
+      } catch (err) {
+        this.logger.debug?.(`worktree broadcast failed: ${err instanceof Error ? err.message : String(err)}`);
+      }
+    }
+  }
+  send(ws, msg) {
+    try {
+      if (ws.readyState === 1) ws.send(JSON.stringify(msg));
+    } catch {
+    }
+  }
+};
+
 // src/server/index.ts
+var HTML_CSP = "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; connect-src 'self' ws: wss:; img-src 'self' data:; font-src 'self' data:; object-src 'none'; base-uri 'self'; frame-ancestors 'none'; form-action 'self'";
 async function startWebUI(opts = {}) {
   const wsPort = opts.wsPort ?? 3457;
   const wsHost = opts.wsHost ?? "127.0.0.1";
@@ -336,6 +804,15 @@ async function startWebUI(opts = {}) {
     toolExecutor
   });
   console.log("[WebUI] Agent initialized");
+  const autoPhaseHandler = new AutoPhaseWebSocketHandler(
+    agent,
+    context,
+    logger,
+    wpaths.projectAutophase,
+    events,
+    projectRoot
+  );
+  const worktreeHandler = new WorktreeWebSocketHandler(events, logger);
   async function sessionStartPayload() {
     let maxContext = 0;
     let inputCost = 0;
@@ -368,12 +845,33 @@ async function startWebUI(opts = {}) {
   const wsToken = randomBytes(16).toString("hex");
   console.log(`[WebUI] WS auth token: ${wsToken.slice(0, 4)}\u2026${wsToken.slice(-4)} (masked)`);
   const isLoopback = (hostname) => hostname === "localhost" || hostname === "127.0.0.1" || hostname === "::1" || hostname === "[::1]";
+  const tokenMatches = (provided) => {
+    if (!provided) return false;
+    const a = Buffer.from(provided);
+    const b = Buffer.from(wsToken);
+    if (a.length !== b.length) return false;
+    return timingSafeEqual(a, b);
+  };
+  const hostHeaderOk = (req) => {
+    const boundToLoopback = wsHost === "127.0.0.1" || wsHost === "::1" || wsHost === "localhost";
+    if (!boundToLoopback) return true;
+    const hostHeader = (req.headers.host ?? "").trim();
+    if (!hostHeader) return false;
+    let hostname;
+    try {
+      hostname = new URL(`http://${hostHeader}`).hostname;
+    } catch {
+      return false;
+    }
+    return isLoopback(hostname);
+  };
   const verifyClient = (info) => {
     const origin = info.origin;
     const url = info.req.url ?? "";
     const tokenMatch = url.match(/[?&]token=([^&]+)/);
     const providedToken = tokenMatch ? tokenMatch[1] : void 0;
-    const tokenOk = providedToken === wsToken;
+    const tokenOk = tokenMatches(providedToken);
+    if (!hostHeaderOk(info.req)) return false;
     if (!origin) {
       const remoteIp = info.req.socket.remoteAddress ?? "";
       const isRemoteLoopback = remoteIp === "127.0.0.1" || remoteIp === "::1";
@@ -383,18 +881,24 @@ async function startWebUI(opts = {}) {
     try {
       const { hostname } = new URL(origin);
       if (isLoopback(hostname)) return true;
-      if (wsHost === "0.0.0.0") return tokenOk;
       return tokenOk;
     } catch {
       return false;
     }
   };
+  const WS_MAX_PAYLOAD = 8 * 1024 * 1024;
   const wssPrimary = new WebSocketServer({
     port: wsPort,
     host: wsHost,
-    verifyClient
+    verifyClient,
+    maxPayload: WS_MAX_PAYLOAD
   });
-  const wssSecondary = wsHost === "127.0.0.1" ? new WebSocketServer({ port: wsPort, host: "::1", verifyClient }) : null;
+  const wssSecondary = wsHost === "127.0.0.1" ? new WebSocketServer({
+    port: wsPort,
+    host: "::1",
+    verifyClient,
+    maxPayload: WS_MAX_PAYLOAD
+  }) : null;
   const clients = /* @__PURE__ */ new Map();
   const RATE_LIMIT_MESSAGES = 60;
   const RATE_LIMIT_WINDOW_MS = 6e4;
@@ -529,6 +1033,8 @@ async function startWebUI(opts = {}) {
     void sessionStartPayload().then((payload) => {
       send(ws, { type: "session.start", payload });
     });
+    autoPhaseHandler.addClient(ws);
+    worktreeHandler.addClient(ws);
     ws.on("message", async (data) => {
       if (!checkRateLimit(ws)) {
         send(ws, {
@@ -1341,6 +1847,12 @@ async function startWebUI(opts = {}) {
         });
         break;
       }
+      default:
+        if (msg.type.startsWith("autophase.")) {
+          await autoPhaseHandler.handleMessage(msg);
+        } else {
+          send(ws, { type: "error", payload: { phase: "handleMessage", message: `Unknown message type: ${msg.type}` } });
+        }
     }
   }
   async function loadSavedProviders() {
@@ -1537,10 +2049,7 @@ async function startWebUI(opts = {}) {
       res.setHeader("Referrer-Policy", "strict-origin-when-cross-origin");
       if (ext === ".html") {
         res.setHeader("Cache-Control", "no-cache");
-        res.setHeader(
-          "Content-Security-Policy",
-          "default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; connect-src 'self' ws: wss:; img-src 'self' data:; font-src 'self' data:"
-        );
+        res.setHeader("Content-Security-Policy", HTML_CSP);
       }
       const fileContent = await fs2.readFile(resolvedPath);
       res.writeHead(200);
@@ -1552,7 +2061,11 @@ async function startWebUI(opts = {}) {
           res.writeHead(200, {
             "Content-Type": "text/html",
             "X-Content-Type-Options": "nosniff",
-            "X-Frame-Options": "DENY"
+            "X-Frame-Options": "DENY",
+            "Referrer-Policy": "strict-origin-when-cross-origin",
+            // SPA fallback previously shipped no CSP — apply the same policy as
+            // the direct .html branch so deep-linked routes aren't unprotected.
+            "Content-Security-Policy": HTML_CSP
           });
           res.end(fileContent);
         } catch {