@astroanywhere/cli 0.2.1 → 0.2.2

package/dist/tui.js

@@ -1,18 +1,19 @@
 #!/usr/bin/env node
 import {
-  AstroClient
-} from "./chunk-SYY2HHOY.js";
+  AstroClient,
+  readSSEStream
+} from "./chunk-MJRAJPBU.js";
 
 // src/tui/index.tsx
 import "react";
 import { render } from "ink";
 
 // src/tui/app.tsx
-import { useMemo, useCallback as useCallback5 } from "react";
+import { useMemo as useMemo2, useCallback as useCallback5, useEffect as useEffect7 } from "react";
 
 // src/tui/components/layout/main-layout.tsx
 import "react";
-import { Box as Box12, useStdout as useStdout3 } from "ink";
+import { Box as Box13, useStdout as useStdout3 } from "ink";
 
 // src/tui/components/layout/status-bar.tsx
 import "react";
@@ -149,8 +150,16 @@ function formatCost(usd) {
   return `$${usd.toFixed(2)}`;
 }
 function truncate(str, maxLen) {
-  if (str.length <= maxLen) return str;
-  return str.slice(0, maxLen - 1) + "\u2026";
+  const clean = str.replace(/[\r\n]+/g, " ").trim();
+  if (clean.length <= maxLen) return clean;
+  return clean.slice(0, maxLen - 1) + "\u2026";
+}
+function getVisibleProjects(projects) {
+  return projects.filter((p) => p.projectType !== "playground").sort((a, b) => {
+    const ta = a.updatedAt ? new Date(a.updatedAt).getTime() : 0;
+    const tb = b.updatedAt ? new Date(b.updatedAt).getTime() : 0;
+    return tb - ta;
+  });
 }
 
 // src/tui/components/layout/status-bar.tsx
@@ -160,7 +169,7 @@ var VIEW_LABELS = {
   "plan-gen": "Plan",
   projects: "Projects",
   playground: "Playground",
-  output: "Output"
+  active: "Active"
 };
 function StatusBar() {
   const connected = useTuiStore((s) => s.connected);
@@ -363,6 +372,11 @@ function renderTreeLines(roots, collapsedSet) {
 }
 
 // src/tui/stores/plan-store.ts
+function buildView(nodes, edges, collapsedNodes) {
+  const treeRoots = buildTree(nodes, edges);
+  const treeLines = renderTreeLines(treeRoots, collapsedNodes);
+  return { treeRoots, treeLines };
+}
 var usePlanStore = create4((set, get) => ({
   projectId: null,
   nodes: [],
@@ -372,11 +386,57 @@ var usePlanStore = create4((set, get) => ({
   collapsedNodes: /* @__PURE__ */ new Set(),
   loading: false,
   error: null,
+  cache: /* @__PURE__ */ new Map(),
   setPlan: (projectId, nodes, edges) => {
-    const { collapsedNodes } = get();
-    const treeRoots = buildTree(nodes, edges);
-    const treeLines = renderTreeLines(treeRoots, collapsedNodes);
-    set({ projectId, nodes, edges, treeRoots, treeLines, loading: false, error: null });
+    const { collapsedNodes, cache } = get();
+    const next = new Map(cache);
+    next.set(projectId, { nodes, edges });
+    const { treeRoots, treeLines } = buildView(nodes, edges, collapsedNodes);
+    set({ projectId, nodes, edges, treeRoots, treeLines, loading: false, error: null, cache: next });
+  },
+  setAllPlans: (allNodes, allEdges) => {
+    const { projectId, collapsedNodes } = get();
+    const next = /* @__PURE__ */ new Map();
+    const nodesByProject = /* @__PURE__ */ new Map();
+    for (const node of allNodes) {
+      const list = nodesByProject.get(node.projectId) ?? [];
+      list.push(node);
+      nodesByProject.set(node.projectId, list);
+    }
+    const nodeProjectMap = /* @__PURE__ */ new Map();
+    for (const node of allNodes) {
+      nodeProjectMap.set(node.id, node.projectId);
+    }
+    const edgesByProject = /* @__PURE__ */ new Map();
+    for (const edge of allEdges) {
+      const pid = nodeProjectMap.get(edge.source) ?? nodeProjectMap.get(edge.target);
+      if (pid) {
+        const list = edgesByProject.get(pid) ?? [];
+        list.push(edge);
+        edgesByProject.set(pid, list);
+      }
+    }
+    for (const [pid, nodes] of nodesByProject) {
+      next.set(pid, { nodes, edges: edgesByProject.get(pid) ?? [] });
+    }
+    const update = { cache: next, loading: false, error: null };
+    if (projectId && next.has(projectId)) {
+      const cached = next.get(projectId);
+      const { treeRoots, treeLines } = buildView(cached.nodes, cached.edges, collapsedNodes);
+      Object.assign(update, { nodes: cached.nodes, edges: cached.edges, treeRoots, treeLines });
+    }
+    set(update);
+  },
+  selectProject: (projectId) => {
+    const { cache, collapsedNodes, projectId: currentProjectId } = get();
+    if (projectId === currentProjectId) return;
+    const cached = cache.get(projectId);
+    if (cached) {
+      const { treeRoots, treeLines } = buildView(cached.nodes, cached.edges, collapsedNodes);
+      set({ projectId, nodes: cached.nodes, edges: cached.edges, treeRoots, treeLines, loading: false, error: null });
+    } else {
+      set({ projectId, nodes: [], edges: [], treeRoots: [], treeLines: [], loading: false, error: null });
+    }
   },
   setLoading: (loading) => set({ loading }),
   setError: (error) => set({ error, loading: false }),
@@ -392,11 +452,16 @@ var usePlanStore = create4((set, get) => ({
     set({ collapsedNodes: next, treeLines });
   },
   updateNodeStatus: (nodeId, status) => {
-    const { nodes, edges, collapsedNodes } = get();
+    const { nodes, edges, collapsedNodes, projectId, cache } = get();
     const updated = nodes.map((n) => n.id === nodeId ? { ...n, status } : n);
-    const treeRoots = buildTree(updated, edges);
-    const treeLines = renderTreeLines(treeRoots, collapsedNodes);
-    set({ nodes: updated, treeRoots, treeLines });
+    const { treeRoots, treeLines } = buildView(updated, edges, collapsedNodes);
+    if (projectId) {
+      const next = new Map(cache);
+      next.set(projectId, { nodes: updated, edges });
+      set({ nodes: updated, treeRoots, treeLines, cache: next });
+    } else {
+      set({ nodes: updated, treeRoots, treeLines });
+    }
   },
   clear: () => set({
     projectId: null,
@@ -458,12 +523,13 @@ var useExecutionStore = create6((set, get) => ({
   outputs: /* @__PURE__ */ new Map(),
   watchingId: null,
   pendingApproval: null,
-  initExecution: (executionId, nodeId) => {
+  initExecution: (executionId, nodeId, title) => {
     const { outputs } = get();
     const next = new Map(outputs);
     next.set(executionId, {
       executionId,
       nodeId,
+      title: title ?? nodeId,
       lines: [],
       status: "running",
       startedAt: (/* @__PURE__ */ new Date()).toISOString(),
@@ -471,6 +537,23 @@ var useExecutionStore = create6((set, get) => ({
     });
     set({ outputs: next });
   },
+  seedHistorical: (entries) => {
+    const { outputs } = get();
+    const next = new Map(outputs);
+    for (const entry of entries) {
+      if (next.has(entry.executionId)) continue;
+      next.set(entry.executionId, {
+        executionId: entry.executionId,
+        nodeId: entry.nodeId,
+        title: entry.title,
+        lines: [],
+        status: entry.status,
+        startedAt: entry.startedAt,
+        pendingToolCount: 0
+      });
+    }
+    set({ outputs: next });
+  },
   appendToolCall: (executionId) => {
     const { outputs } = get();
     const current = outputs.get(executionId);
@@ -543,6 +626,53 @@ var useExecutionStore = create6((set, get) => ({
   }
 }));
 
+// src/tui/stores/chat-store.ts
+import { create as create7 } from "zustand";
+var useChatStore = create7((set, get) => ({
+  messages: [],
+  sessionId: null,
+  projectId: null,
+  nodeId: null,
+  streaming: false,
+  streamBuffer: "",
+  addMessage: (role, content) => {
+    set((s) => ({
+      messages: [...s.messages, { role, content, timestamp: (/* @__PURE__ */ new Date()).toISOString() }]
+    }));
+  },
+  appendStream: (text) => {
+    set((s) => ({ streamBuffer: s.streamBuffer + text }));
+  },
+  flushStream: () => {
+    const { streamBuffer } = get();
+    if (streamBuffer.length > 0) {
+      set((s) => ({
+        messages: [...s.messages, { role: "assistant", content: streamBuffer, timestamp: (/* @__PURE__ */ new Date()).toISOString() }],
+        streamBuffer: ""
+      }));
+    }
+  },
+  setSessionId: (sessionId) => set({ sessionId }),
+  setContext: (projectId, nodeId) => set({ projectId, nodeId: nodeId ?? null }),
+  setStreaming: (streaming) => set({ streaming }),
+  clear: () => set({ messages: [], sessionId: null, streamBuffer: "", streaming: false })
+}));
+
+// src/tui/stores/session-settings-store.ts
+import { create as create8 } from "zustand";
+var useSessionSettingsStore = create8((set) => ({
+  machineId: null,
+  machineName: null,
+  workingDirectory: process.cwd(),
+  focusedField: null,
+  pickerOpen: false,
+  setMachine: (id, name) => set({ machineId: id, machineName: name }),
+  setWorkingDirectory: (workingDirectory) => set({ workingDirectory }),
+  setFocusedField: (focusedField) => set({ focusedField, pickerOpen: false }),
+  setPickerOpen: (pickerOpen) => set({ pickerOpen }),
+  init: (machineId, machineName, workingDirectory) => set({ machineId, machineName, workingDirectory })
+}));
+
 // src/tui/commands/handlers.ts
 var PALETTE_COMMANDS = [
   { name: "project list", description: "List all projects" },
@@ -562,6 +692,9 @@ var PALETTE_COMMANDS = [
   { name: "activity", description: "Show recent activity feed" },
   { name: "playground", description: "Start a playground (Cloud Code) session", usage: "playground <description>" },
   { name: "plan generate", description: "Generate a plan using AI", usage: "plan generate <description>" },
+  { name: "project chat", description: "Chat with AI about the selected project", usage: "project chat <message>" },
+  { name: "task chat", description: "Chat with AI about the selected task", usage: "task chat <message>" },
+  { name: "summarize", description: "AI-generated summary of an execution", usage: "summarize [executionId]" },
   { name: "refresh", description: "Refresh all data" },
   { name: "help", description: "Toggle keybinding reference" },
   { name: "quit", description: "Exit the TUI" }
@@ -670,44 +803,29 @@ var handlers = {
       useTuiStore.getState().setLastError("No node/project selected for dispatch");
       return;
     }
+    const machines = useMachinesStore.getState().machines;
+    const connectedMachine = machines.find((m) => m.isConnected);
+    if (!connectedMachine) {
+      useTuiStore.getState().setLastError("No connected machines. Start an agent runner first.");
+      return;
+    }
+    const execId = `exec-${Date.now()}`;
+    const planNode = usePlanStore.getState().nodes.find((n) => n.id === nodeId);
+    const title = planNode?.title ?? nodeId;
+    useExecutionStore.getState().initExecution(execId, nodeId, title);
+    useExecutionStore.getState().setWatching(execId);
+    useTuiStore.getState().focusPanel("output");
+    useExecutionStore.getState().appendLine(execId, `[progress] Dispatching task...`);
     try {
-      const response = await client.dispatchTask({ nodeId, projectId });
-      const execId = `exec-${Date.now()}`;
-      useExecutionStore.getState().initExecution(execId, nodeId);
-      useExecutionStore.getState().setWatching(execId);
-      useTuiStore.getState().focusPanel("output");
-      if (response.body) {
-        const reader = response.body.getReader();
-        const decoder = new TextDecoder();
-        let buffer = "";
-        while (true) {
-          const { done, value } = await reader.read();
-          if (done) break;
-          buffer += decoder.decode(value, { stream: true });
-          const lines = buffer.split("\n");
-          buffer = lines.pop() ?? "";
-          for (const line of lines) {
-            if (line.startsWith("data: ")) {
-              try {
-                const event = JSON.parse(line.slice(6));
-                const eventType = event.type;
-                if (eventType === "text") {
-                  useExecutionStore.getState().appendText(execId, event.content ?? "");
-                } else if (eventType === "tool_use") {
-                  useExecutionStore.getState().appendToolCall(execId, event.name ?? "");
-                } else if (eventType === "result") {
-                  useExecutionStore.getState().setStatus(execId, event.status ?? "completed");
-                } else if (eventType === "error") {
-                  useExecutionStore.getState().appendLine(execId, `[error] ${event.message}`);
-                  useExecutionStore.getState().setStatus(execId, "failure");
-                }
-              } catch {
-              }
-            }
-          }
-        }
-      }
+      const response = await client.dispatchTask({
+        nodeId,
+        projectId,
+        targetMachineId: connectedMachine.id
+      });
+      await streamSSEToExecution(response, execId, client, projectId);
     } catch (err) {
+      useExecutionStore.getState().setStatus(execId, "error");
+      useExecutionStore.getState().appendLine(execId, `[error] ${err instanceof Error ? err.message : String(err)}`);
       useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
     }
   },
@@ -796,35 +914,68 @@ var handlers = {
     }
   },
   // ── Playground ──
+  // Matches frontend: creates a new playground project, then dispatches.
+  // No project selection required — uses session settings for machine + workdir.
   playground: async (args, client) => {
     const description = args.join(" ");
     if (!description) {
       useTuiStore.getState().setLastError("Usage: playground <description>");
       return;
     }
-    const projectId = useTuiStore.getState().selectedProjectId;
-    if (!projectId) {
-      useTuiStore.getState().setLastError("No project selected. Select a project first.");
+    const settings = useSessionSettingsStore.getState();
+    if (!settings.machineId) {
+      const machines = useMachinesStore.getState().machines;
+      const localPlatform = process.platform;
+      const m = machines.find((m2) => m2.isConnected && m2.platform === localPlatform) ?? machines.find((m2) => m2.isConnected);
+      if (m) {
+        settings.init(m.id, m.name, settings.workingDirectory || process.cwd());
+      }
+    }
+    const targetMachineId = settings.machineId;
+    const targetMachineName = settings.machineName;
+    const workDir = settings.workingDirectory || process.cwd();
+    if (!targetMachineId) {
+      useTuiStore.getState().setLastError("No connected machines. Start an agent runner first.");
       return;
     }
-    const nodeId = `playground-${projectId}-${Date.now()}`;
+    const execId = `playground-${Date.now()}`;
+    const title = `Playground: ${description.slice(0, 50)}`;
+    useExecutionStore.getState().initExecution(execId, execId, title);
+    useExecutionStore.getState().setWatching(execId);
+    useTuiStore.getState().setActiveView("playground");
+    useExecutionStore.getState().appendLine(execId, `> ${description}`);
+    useExecutionStore.getState().appendLine(execId, `[progress] Creating playground session...`);
     try {
+      const projectId = crypto.randomUUID();
+      const project = await client.createProject({
+        id: projectId,
+        name: description.slice(0, 60) || "Playground Session",
+        description,
+        workingDirectory: workDir,
+        defaultMachineId: targetMachineId,
+        projectType: "playground"
+      });
+      const nodeId = `playground-${project.id}`;
+      useExecutionStore.getState().appendLine(execId, `[progress] Dispatching to ${targetMachineName ?? targetMachineId} (${workDir})...`);
       const response = await client.dispatchTask({
         nodeId,
-        projectId,
-        skipSafetyCheck: true,
+        projectId: project.id,
+        title,
         description,
-        title: `Playground: ${description.slice(0, 50)}`
+        targetMachineId,
+        workingDirectory: workDir,
+        deliveryMode: "direct",
+        skipSafetyCheck: true,
+        force: true
       });
-      useExecutionStore.getState().initExecution(nodeId, nodeId);
-      useExecutionStore.getState().setWatching(nodeId);
-      useTuiStore.getState().setActiveView("playground");
-      await streamExecution(nodeId, response);
+      await streamSSEToExecution(response, execId, client, project.id);
     } catch (err) {
+      useExecutionStore.getState().setStatus(execId, "error");
+      useExecutionStore.getState().appendLine(execId, `[error] ${err instanceof Error ? err.message : String(err)}`);
       useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
     }
   },
-  // ── Plan Generate ──
+  // ── Plan Generate (uses /api/dispatch/task SSE with isInteractivePlan) ──
   "plan generate": async (args, client) => {
     const description = args.join(" ");
     if (!description) {
@@ -836,26 +987,166 @@ var handlers = {
       useTuiStore.getState().setLastError("No project selected. Select a project first.");
       return;
     }
+    const machines = useMachinesStore.getState().machines;
+    const connectedMachine = machines.find((m) => m.isConnected);
+    if (!connectedMachine) {
+      useTuiStore.getState().setLastError("No connected machines. Start an agent runner first.");
+      return;
+    }
     const nodeId = `plan-${projectId}`;
+    const execId = `plan-${projectId}-${Date.now()}`;
+    const title = `Plan: ${description.slice(0, 50)}`;
+    useExecutionStore.getState().initExecution(execId, nodeId, title);
+    useExecutionStore.getState().setWatching(execId);
+    useTuiStore.getState().setActiveView("plan-gen");
+    useExecutionStore.getState().appendLine(execId, `[progress] Plan generation started`);
     try {
       const response = await client.dispatchTask({
         nodeId,
         projectId,
+        title: `Interactive planning: ${description.slice(0, 80)}`,
+        description,
+        targetMachineId: connectedMachine.id,
         isInteractivePlan: true,
-        description
+        verification: "human"
       });
-      useExecutionStore.getState().initExecution(nodeId, nodeId);
-      useExecutionStore.getState().setWatching(nodeId);
-      useTuiStore.getState().setActiveView("plan-gen");
-      await streamExecution(nodeId, response);
-      useExecutionStore.getState().appendLine(nodeId, "[plan] Refreshing plan...");
+      await streamSSEToExecution(response, execId, client, projectId);
+    } catch (err) {
+      useExecutionStore.getState().setStatus(execId, "error");
+      useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
+    }
+  },
+  // ── Project Chat (uses /api/agent/project-chat SSE) ──
+  "project chat": async (args, client) => {
+    const message = args.join(" ");
+    if (!message) {
+      useTuiStore.getState().setLastError("Usage: project chat <message>");
+      return;
+    }
+    const projectId = useTuiStore.getState().selectedProjectId;
+    if (!projectId) {
+      useTuiStore.getState().setLastError("No project selected");
+      return;
+    }
+    const execId = `chat-project-${projectId}-${Date.now()}`;
+    const title = `Chat: ${message.slice(0, 50)}`;
+    const sessionId = useChatStore.getState().sessionId;
+    const messages = useChatStore.getState().messages.map((m) => ({
+      role: m.role,
+      content: m.content
+    }));
+    useExecutionStore.getState().initExecution(execId, `chat-${projectId}`, title);
+    useExecutionStore.getState().setWatching(execId);
+    useExecutionStore.getState().appendLine(execId, `> ${message}`);
+    useChatStore.getState().addMessage("user", message);
+    try {
+      useChatStore.getState().setStreaming(true);
+      useChatStore.getState().setContext(projectId);
       const { nodes, edges } = await client.getPlan(projectId);
-      usePlanStore.getState().setPlan(projectId, nodes, edges);
-      useTuiStore.getState().setActiveView("dashboard");
+      const response = await client.projectChat({
+        message,
+        sessionId: sessionId ?? void 0,
+        projectId,
+        planNodes: nodes,
+        planEdges: edges,
+        messages
+      });
+      await streamSSEToExecution(response, execId, client, projectId);
+      useChatStore.getState().flushStream();
+      useChatStore.getState().setStreaming(false);
     } catch (err) {
+      useChatStore.getState().setStreaming(false);
+      useExecutionStore.getState().setStatus(execId, "error");
       useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
     }
   },
+  // ── Task Chat (uses /api/agent/task-chat SSE) ──
+  "task chat": async (args, client) => {
+    const message = args.join(" ");
+    if (!message) {
+      useTuiStore.getState().setLastError("Usage: task chat <message>");
+      return;
+    }
+    const projectId = useTuiStore.getState().selectedProjectId;
+    const nodeId = useTuiStore.getState().selectedNodeId;
+    if (!projectId || !nodeId) {
+      useTuiStore.getState().setLastError("No project/task selected");
+      return;
+    }
+    const planNode = usePlanStore.getState().nodes.find((n) => n.id === nodeId);
+    const taskTitle = planNode?.title ?? nodeId;
+    const execId = `chat-task-${nodeId}-${Date.now()}`;
+    const title = `Task Chat: ${taskTitle.slice(0, 40)}`;
+    const sessionId = useChatStore.getState().sessionId;
+    const messages = useChatStore.getState().messages.map((m) => ({
+      role: m.role,
+      content: m.content
+    }));
+    useExecutionStore.getState().initExecution(execId, `chat-${nodeId}`, title);
+    useExecutionStore.getState().setWatching(execId);
+    useExecutionStore.getState().appendLine(execId, `> ${message}`);
+    useChatStore.getState().addMessage("user", message);
+    try {
+      useChatStore.getState().setStreaming(true);
+      useChatStore.getState().setContext(projectId, nodeId);
+      const response = await client.taskChat({
+        message,
+        sessionId: sessionId ?? void 0,
+        nodeId,
+        projectId,
+        taskTitle,
+        taskDescription: planNode?.description,
+        taskOutput: planNode?.executionOutput ?? void 0,
+        branchName: planNode?.branchName ?? void 0,
+        prUrl: planNode?.prUrl ?? void 0,
+        messages
+      });
+      await streamSSEToExecution(response, execId, client, projectId);
+      useChatStore.getState().flushStream();
+      useChatStore.getState().setStreaming(false);
+    } catch (err) {
+      useChatStore.getState().setStreaming(false);
+      useExecutionStore.getState().setStatus(execId, "error");
+      useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
+    }
+  },
+  // ── Summarize ──
+  summarize: async (args, client) => {
+    const executionId = args[0] ?? useExecutionStore.getState().watchingId;
+    if (!executionId) {
+      useTuiStore.getState().setLastError("Usage: summarize [executionId]");
+      return;
+    }
+    try {
+      const result = await client.summarize({ executionId });
+      useExecutionStore.getState().appendLine(executionId, `
+--- Summary ---
+${result.summary}`);
+    } catch (err) {
+      useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
+    }
+  },
+  // ── Resume ──
+  resume: async (args) => {
+    const execId = args[0];
+    if (!execId) {
+      useTuiStore.getState().setLastError("Usage: resume <executionId>");
+      return;
+    }
+    const exec = useExecutionStore.getState().outputs.get(execId);
+    if (!exec) {
+      useTuiStore.getState().setLastError(`Session not found: ${execId}`);
+      return;
+    }
+    useExecutionStore.getState().setWatching(execId);
+    if (exec.nodeId.startsWith("playground-")) {
+      useTuiStore.getState().setActiveView("playground");
+    } else if (exec.nodeId.startsWith("plan-")) {
+      useTuiStore.getState().setActiveView("plan-gen");
+    } else {
+      useTuiStore.getState().setActiveView("active");
+    }
+  },
   // ── Help ──
   help: async () => {
     useTuiStore.getState().toggleHelp();
@@ -864,79 +1155,141 @@ var handlers = {
     useTuiStore.getState().toggleHelp();
   }
 };
-async function streamExecution(executionId, response) {
-  if (!response.body) return;
-  const reader = response.body.getReader();
-  const decoder = new TextDecoder();
-  let buffer = "";
-  while (true) {
-    const { done, value } = await reader.read();
-    if (done) break;
-    buffer += decoder.decode(value, { stream: true });
-    const lines = buffer.split("\n");
-    buffer = lines.pop() ?? "";
-    for (const line of lines) {
-      if (!line.startsWith("data: ")) continue;
-      try {
-        const event = JSON.parse(line.slice(6));
-        const eventType = event.type;
-        if (eventType === "text") {
-          useExecutionStore.getState().appendText(executionId, event.content ?? "");
-        } else if (eventType === "tool_use") {
-          useExecutionStore.getState().appendToolCall(executionId, event.name ?? "");
-        } else if (eventType === "file_change") {
-          useExecutionStore.getState().appendFileChange(
-            executionId,
-            event.path ?? "",
-            event.action ?? "modified",
-            event.linesAdded,
-            event.linesRemoved
-          );
-        } else if (eventType === "result" || eventType === "done") {
-          useExecutionStore.getState().setStatus(executionId, event.status ?? "completed");
-        } else if (eventType === "error") {
-          useExecutionStore.getState().appendLine(executionId, `[error] ${event.message}`);
-          useExecutionStore.getState().setStatus(executionId, "failure");
-        } else if (eventType === "plan_result") {
-          useExecutionStore.getState().appendLine(executionId, "[plan] Plan generated successfully");
-        } else if (eventType === "approval_request") {
-          useExecutionStore.getState().setPendingApproval({
-            requestId: event.requestId,
-            question: event.question,
-            options: event.options,
-            machineId: event.machineId,
-            taskId: event.taskId
-          });
+async function streamSSEToExecution(response, execId, client, projectId) {
+  if (!response.body) {
+    useExecutionStore.getState().setStatus(execId, "completed");
+    return;
+  }
+  await readSSEStream(response, async (event) => {
+    const type = event.type;
+    switch (type) {
+      case "init":
+        if (event.executionId) {
+          useExecutionStore.getState().appendLine(execId, `[progress] Execution started (${event.executionId})`);
         }
-      } catch {
+        break;
+      case "text": {
+        const content = event.content ?? event.text ?? "";
+        if (content) {
+          useExecutionStore.getState().appendText(execId, content);
+          useChatStore.getState().appendStream(content);
+        }
+        break;
       }
+      case "tool_use":
+        useExecutionStore.getState().appendToolCall(execId, event.toolName ?? event.name);
+        break;
+      case "tool_result":
+        break;
+      case "file_change":
+        useExecutionStore.getState().appendFileChange(
+          execId,
+          event.path,
+          event.action,
+          event.linesAdded,
+          event.linesRemoved
+        );
+        break;
+      case "progress":
+        useExecutionStore.getState().appendLine(execId, `[progress] ${event.message}`);
+        break;
+      case "session_init":
+        if (event.sessionId) {
+          useChatStore.getState().setSessionId(event.sessionId);
+        }
+        break;
+      case "plan_result":
+        useExecutionStore.getState().appendLine(execId, "[plan] Plan generated \u2014 refreshing...");
+        if (projectId) {
+          setTimeout(async () => {
+            try {
+              const { nodes, edges } = await client.getPlan(projectId);
+              usePlanStore.getState().setPlan(projectId, nodes, edges);
+            } catch {
+            }
+          }, 500);
+        }
+        break;
+      case "result":
+        useExecutionStore.getState().setStatus(execId, event.status === "success" ? "completed" : "error");
+        if (event.error) {
+          useExecutionStore.getState().appendLine(execId, `[error] ${event.error}`);
+        }
+        break;
+      case "approval_request":
+        useExecutionStore.getState().setPendingApproval({
+          requestId: event.requestId,
+          question: event.question,
+          options: event.options,
+          machineId: event.machineId,
+          taskId: event.taskId
+        });
+        break;
+      case "done":
+        useExecutionStore.getState().setStatus(execId, "completed");
+        break;
+      case "error": {
+        const msg = event.error ?? event.message ?? "Unknown error";
+        useExecutionStore.getState().appendLine(execId, `[error] ${msg}`);
+        useExecutionStore.getState().setStatus(execId, "error");
+        break;
+      }
+      case "heartbeat":
+      case "compaction":
+      case "aborted":
+        break;
     }
+  });
+  const exec = useExecutionStore.getState().outputs.get(execId);
+  if (exec?.status === "running") {
+    useExecutionStore.getState().setStatus(execId, "completed");
   }
 }
 async function refreshAll(client) {
   try {
-    const [projects, machines] = await Promise.all([
+    const [projects, machines, fullPlan] = await Promise.all([
       client.listProjects(),
-      client.listMachines()
+      client.listMachines(),
+      client.getFullPlan()
     ]);
     useProjectsStore.getState().setProjects(projects);
     useMachinesStore.getState().setMachines(machines);
     useTuiStore.getState().setMachineCount(machines.filter((m) => m.isConnected).length);
-    const projectId = useTuiStore.getState().selectedProjectId;
-    if (projectId) {
-      const { nodes, edges } = await client.getPlan(projectId);
-      usePlanStore.getState().setPlan(projectId, nodes, edges);
-    }
+    usePlanStore.getState().setAllPlans(fullPlan.nodes, fullPlan.edges);
   } catch (err) {
     useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
   }
 }
 
 // src/tui/commands/palette-filter.ts
+function getResumeCommands() {
+  const outputs = useExecutionStore.getState().outputs;
+  const entries = [];
+  for (const [id, exec] of outputs) {
+    const statusLabel = exec.status === "running" ? "\u25B6" : exec.status === "success" || exec.status === "completed" ? "\u2713" : "\xB7";
+    entries.push({
+      name: `resume ${exec.title}`,
+      description: `${statusLabel} ${exec.status} \u2014 switch to this session`,
+      usage: `resume:${id}`
+    });
+  }
+  entries.sort((a, b) => {
+    const aExec = outputs.get(a.usage.replace("resume:", ""));
+    const bExec = outputs.get(b.usage.replace("resume:", ""));
+    if (aExec?.status === "running" && bExec?.status !== "running") return -1;
+    if (bExec?.status === "running" && aExec?.status !== "running") return 1;
+    const ta = aExec?.startedAt ? new Date(aExec.startedAt).getTime() : 0;
+    const tb = bExec?.startedAt ? new Date(bExec.startedAt).getTime() : 0;
+    return tb - ta;
+  });
+  return entries;
+}
 function getFilteredPaletteCommands(query) {
-  if (!query) return PALETTE_COMMANDS;
+  const resumeCommands = getResumeCommands();
+  const allCommands = [...PALETTE_COMMANDS, ...resumeCommands];
+  if (!query) return allCommands;
   const lower = query.toLowerCase();
-  return PALETTE_COMMANDS.filter(
+  return allCommands.filter(
     (cmd) => cmd.name.toLowerCase().includes(lower) || cmd.description.toLowerCase().includes(lower)
   );
 }
@@ -948,10 +1301,11 @@ var SHORTCUTS = [
   { key: "2", label: "Plan" },
   { key: "3", label: "Projects" },
   { key: "4", label: "Playground" },
-  { key: "5", label: "Output" },
+  { key: "5", label: "Active" },
   { key: "/", label: "Search" },
   { key: "C-p", label: "Commands" },
   { key: "d", label: "Dispatch" },
+  { key: "x", label: "Stop" },
   { key: "?", label: "Help" },
   { key: "q", label: "Quit" }
 ];
@@ -1053,7 +1407,17 @@ function CommandLine({ height }) {
     ] });
   }
   if (mode === "input") {
-    return /* @__PURE__ */ jsx2(Box2, { paddingX: 1, height, children: /* @__PURE__ */ jsx2(Text2, { dimColor: true, children: "Input active \u2014 press Esc to exit" }) });
+    return /* @__PURE__ */ jsxs2(Box2, { paddingX: 1, gap: 1, height, children: [
+      /* @__PURE__ */ jsx2(Text2, { dimColor: true, children: "Input active" }),
+      /* @__PURE__ */ jsxs2(Box2, { children: [
+        /* @__PURE__ */ jsx2(Text2, { inverse: true, bold: true, children: " C-d " }),
+        /* @__PURE__ */ jsx2(Text2, { children: "Stop" })
+      ] }),
+      /* @__PURE__ */ jsxs2(Box2, { children: [
+        /* @__PURE__ */ jsx2(Text2, { inverse: true, bold: true, children: " Esc " }),
+        /* @__PURE__ */ jsx2(Text2, { children: "Exit input" })
+      ] })
+    ] });
   }
   return /* @__PURE__ */ jsx2(Box2, { paddingX: 1, gap: 1, height, children: SHORTCUTS.map(({ key, label }) => /* @__PURE__ */ jsxs2(Box2, { children: [
     /* @__PURE__ */ jsx2(Text2, { inverse: true, bold: true, children: ` ${key} ` }),
@@ -1194,7 +1558,7 @@ function SearchOverlay() {
 }
 
 // src/tui/components/panels/projects-panel.tsx
-import "react";
+import { useEffect as useEffect2, useMemo } from "react";
 import { Box as Box5, Text as Text6 } from "ink";
 
 // src/tui/components/layout/panel.tsx
@@ -1240,13 +1604,14 @@ function Spinner({ label }) {
 }
 
 // src/tui/components/panels/projects-panel.tsx
-import { Fragment, jsx as jsx5, jsxs as jsxs6 } from "react/jsx-runtime";
-function statusSymbol(status) {
-  if (status === "running") return "\u25B6";
-  if (status === "success") return "\u2713";
-  if (status === "failure" || status === "error") return "\u2717";
-  return "\xB7";
-}
+import { jsx as jsx5, jsxs as jsxs6 } from "react/jsx-runtime";
+var TERMINAL_NODE_STATUSES = /* @__PURE__ */ new Set([
+  "completed",
+  "auto_verified",
+  "awaiting_judgment",
+  "awaiting_approval",
+  "pruned"
+]);
 function ProjectsPanel({ height }) {
   const projects = useProjectsStore((s) => s.projects);
   const loading = useProjectsStore((s) => s.loading);
@@ -1255,32 +1620,63 @@ function ProjectsPanel({ height }) {
   const scrollIndex = useTuiStore((s) => s.scrollIndex.projects);
   const selectedProjectId = useTuiStore((s) => s.selectedProjectId);
   const outputs = useExecutionStore((s) => s.outputs);
+  const planNodes = usePlanStore((s) => s.nodes);
   const isFocused = focusedPanel === "projects";
   const visibleHeight = Math.max(1, height - 3);
-  const planGenEntries = [];
-  const playgroundEntries = [];
-  for (const [id, exec] of outputs) {
-    if (exec.nodeId.startsWith("plan-")) {
-      planGenEntries.push({ id, label: exec.nodeId, status: exec.status });
-    } else if (exec.nodeId.startsWith("playground-")) {
-      playgroundEntries.push({ id, label: exec.nodeId.replace(/^playground-/, "").slice(0, 30), status: exec.status });
+  const projectsWithRunning = useMemo(() => {
+    const running = /* @__PURE__ */ new Set();
+    for (const [, exec] of outputs) {
+      if (exec.status !== "running" && exec.status !== "pending" && exec.status !== "dispatched") continue;
+      const nodeId = exec.nodeId;
+      if (nodeId.startsWith("plan-")) {
+        running.add(nodeId.replace(/^plan-/, "").replace(/-\d+$/, ""));
+      } else if (nodeId.startsWith("playground-")) {
+        const parts = nodeId.replace(/^playground-/, "").split("-");
+        parts.pop();
+        running.add(parts.join("-"));
+      } else if (nodeId.startsWith("chat-")) {
+        running.add(nodeId.replace(/^chat-(project-|task-)?/, "").replace(/-\d+$/, ""));
+      } else {
+        const node = planNodes.find((n) => n.id === nodeId);
+        if (node && !TERMINAL_NODE_STATUSES.has(node.status)) {
+          running.add(node.projectId);
+        }
+      }
     }
-  }
-  const projectCount = projects.length;
-  const clampedIndex = Math.min(scrollIndex, Math.max(0, projectCount - 1));
-  const sectionLineCount = (planGenEntries.length > 0 ? 1 + planGenEntries.length : 0) + (playgroundEntries.length > 0 ? 1 + playgroundEntries.length : 0);
-  const projectVisibleHeight = Math.max(1, visibleHeight - sectionLineCount);
+    for (const node of planNodes) {
+      if ((node.status === "in_progress" || node.status === "dispatched") && !node.deletedAt) {
+        running.add(node.projectId);
+      }
+    }
+    return running;
+  }, [outputs, planNodes]);
+  const sorted = getVisibleProjects(projects);
+  const projectCount = sorted.length;
+  const maxIndex = Math.max(0, projectCount - 1);
+  const cursor = projectCount === 0 ? 0 : Math.min(Math.max(0, scrollIndex), maxIndex);
+  useEffect2(() => {
+    if (projectCount > 0 && scrollIndex !== cursor) {
+      useTuiStore.setState((s) => ({
+        scrollIndex: { ...s.scrollIndex, projects: cursor }
+      }));
+    }
+  }, [scrollIndex, cursor, projectCount]);
   let start = 0;
-  if (projectCount > projectVisibleHeight) {
-    start = Math.max(0, Math.min(clampedIndex - Math.floor(projectVisibleHeight / 2), projectCount - projectVisibleHeight));
+  if (projectCount > visibleHeight) {
+    if (cursor >= projectCount - visibleHeight) {
+      start = projectCount - visibleHeight;
+    } else {
+      start = Math.max(0, cursor - Math.floor(visibleHeight / 2));
+    }
   }
-  const visibleProjects = projects.slice(start, start + projectVisibleHeight);
+  const visibleProjects = sorted.slice(start, start + visibleHeight);
   return /* @__PURE__ */ jsx5(Panel, { title: "PROJECTS", isFocused, height, children: loading && projects.length === 0 ? /* @__PURE__ */ jsx5(Spinner, { label: "Loading projects..." }) : error ? /* @__PURE__ */ jsx5(Text6, { color: "red", children: error }) : /* @__PURE__ */ jsxs6(Box5, { flexDirection: "column", children: [
-    visibleProjects.length === 0 && planGenEntries.length === 0 && playgroundEntries.length === 0 && /* @__PURE__ */ jsx5(Text6, { dimColor: true, children: "  No projects yet" }),
+    visibleProjects.length === 0 && /* @__PURE__ */ jsx5(Text6, { dimColor: true, children: "  No projects yet" }),
     visibleProjects.map((p, i) => {
       const actualIndex = start + i;
-      const isSelected = isFocused && clampedIndex === actualIndex;
+      const isSelected = isFocused && cursor === actualIndex;
       const isActive = p.id === selectedProjectId;
+      const hasRunning = projectsWithRunning.has(p.id);
       return /* @__PURE__ */ jsxs6(Box5, { children: [
         /* @__PURE__ */ jsxs6(
           Text6,
@@ -1291,7 +1687,8 @@ function ProjectsPanel({ height }) {
             wrap: "truncate",
             children: [
               isSelected ? " > " : "   ",
-              truncate(p.name, 30)
+              hasRunning ? "\u25B6 " : "  ",
+              truncate(p.name, 28)
             ]
           }
         ),
@@ -1301,36 +1698,14 @@ function ProjectsPanel({ height }) {
         ] })
       ] }, p.id);
     }),
-    projectCount > projectVisibleHeight && /* @__PURE__ */ jsxs6(Text6, { dimColor: true, children: [
+    projectCount > visibleHeight && /* @__PURE__ */ jsxs6(Text6, { dimColor: true, children: [
       "  [",
       start + 1,
       "-",
-      Math.min(start + projectVisibleHeight, projectCount),
+      Math.min(start + visibleHeight, projectCount),
       "/",
       projectCount,
       "]"
-    ] }),
-    planGenEntries.length > 0 && /* @__PURE__ */ jsxs6(Fragment, { children: [
-      /* @__PURE__ */ jsx5(Text6, { bold: true, color: "yellow", children: " Plan Generation" }),
-      planGenEntries.map((item) => /* @__PURE__ */ jsxs6(Text6, { dimColor: true, wrap: "truncate", children: [
-        "   ",
-        statusSymbol(item.status),
-        " ",
-        truncate(item.label, 28),
-        " ",
-        item.status
-      ] }, item.id))
-    ] }),
-    playgroundEntries.length > 0 && /* @__PURE__ */ jsxs6(Fragment, { children: [
-      /* @__PURE__ */ jsx5(Text6, { bold: true, color: "green", children: " Playground" }),
-      playgroundEntries.map((item) => /* @__PURE__ */ jsxs6(Text6, { dimColor: true, wrap: "truncate", children: [
-        "   ",
-        statusSymbol(item.status),
-        " ",
-        truncate(item.label, 28),
-        " ",
-        item.status
-      ] }, item.id))
     ] })
   ] }) });
 }
@@ -1349,16 +1724,21 @@ function ScrollableList({ items, selectedIndex, height, isFocused }) {
   if (items.length === 0) {
     return /* @__PURE__ */ jsx6(Box6, { children: /* @__PURE__ */ jsx6(Text7, { dimColor: true, children: "  No items." }) });
   }
+  const cursor = Math.min(Math.max(0, selectedIndex), items.length - 1);
   const visibleHeight = Math.max(1, height - 1);
   let start = 0;
-  if (selectedIndex >= visibleHeight) {
-    start = selectedIndex - visibleHeight + 1;
+  if (items.length > visibleHeight) {
+    if (cursor >= items.length - visibleHeight) {
+      start = items.length - visibleHeight;
+    } else {
+      start = Math.max(0, cursor - Math.floor(visibleHeight / 2));
+    }
   }
   const visibleItems = items.slice(start, start + visibleHeight);
   return /* @__PURE__ */ jsxs7(Box6, { flexDirection: "column", children: [
     visibleItems.map((item, i) => {
       const actualIndex = start + i;
-      const isSelected = actualIndex === selectedIndex && isFocused;
+      const isSelected = actualIndex === cursor && isFocused;
       const prefix = isSelected ? " \u25B6 " : "   ";
       const sublabel = item.sublabel ? ` ${item.sublabel}` : "";
       const rightLabel = item.rightLabel ?? "";
@@ -1477,10 +1857,10 @@ function OutputPanel({ height }) {
   const isFocused = focusedPanel === "output";
   const execution = watchingId ? outputs.get(watchingId) : null;
   const visibleHeight = Math.max(1, height - 4);
-  let title = "OUTPUT";
+  let title = "PROCESS OUTPUT";
   if (execution) {
     const shortId = execution.nodeId.length > 20 ? execution.nodeId.slice(0, 8) + "\u2026" : execution.nodeId;
-    title = `OUTPUT (${shortId}) [${execution.status}]`;
+    title = `${shortId} [${execution.status}]`;
   }
   if (!execution) {
     return /* @__PURE__ */ jsx9(Panel, { title, isFocused, height, children: /* @__PURE__ */ jsx9(Text10, { dimColor: true, children: "  No active execution. Dispatch a task with 'd' or :dispatch" }) });
@@ -1515,40 +1895,6 @@ function OutputPanel({ height }) {
 import "react";
 import { Box as Box8, Text as Text11 } from "ink";
 import { TextInput } from "@inkjs/ui";
-
-// src/tui/stores/chat-store.ts
-import { create as create7 } from "zustand";
-var useChatStore = create7((set, get) => ({
-  messages: [],
-  sessionId: null,
-  projectId: null,
-  nodeId: null,
-  streaming: false,
-  streamBuffer: "",
-  addMessage: (role, content) => {
-    set((s) => ({
-      messages: [...s.messages, { role, content, timestamp: (/* @__PURE__ */ new Date()).toISOString() }]
-    }));
-  },
-  appendStream: (text) => {
-    set((s) => ({ streamBuffer: s.streamBuffer + text }));
-  },
-  flushStream: () => {
-    const { streamBuffer } = get();
-    if (streamBuffer.length > 0) {
-      set((s) => ({
-        messages: [...s.messages, { role: "assistant", content: streamBuffer, timestamp: (/* @__PURE__ */ new Date()).toISOString() }],
-        streamBuffer: ""
-      }));
-    }
-  },
-  setSessionId: (sessionId) => set({ sessionId }),
-  setContext: (projectId, nodeId) => set({ projectId, nodeId: nodeId ?? null }),
-  setStreaming: (streaming) => set({ streaming }),
-  clear: () => set({ messages: [], sessionId: null, streamBuffer: "", streaming: false })
-}));
-
-// src/tui/components/panels/chat-panel.tsx
 import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 function ChatPanel({ height }) {
   const messages = useChatStore((s) => s.messages);
@@ -1603,16 +1949,24 @@ function lineColor2(line) {
   if (line.startsWith("> ")) return "cyan";
   return void 0;
 }
+function machineLabel(name, id) {
+  if (!id) return "No machine";
+  return name || id.slice(0, 12);
+}
 function SessionPanel({ height, title, sessionType, onSubmit }) {
   const watchingId = useExecutionStore((s) => s.watchingId);
   const outputs = useExecutionStore((s) => s.outputs);
   const streaming = useChatStore((s) => s.streaming);
   const mode = useTuiStore((s) => s.mode);
+  const { machineId, machineName, workingDirectory, focusedField, pickerOpen } = useSessionSettingsStore();
+  const machines = useMachinesStore((s) => s.machines);
+  const connectedMachines = machines.filter((m) => m.isConnected);
   const execution = watchingId ? outputs.get(watchingId) : null;
   const isRunning = execution?.status === "running";
+  const settingsHeight = pickerOpen ? 2 + Math.min(connectedMachines.length, 5) : 2;
   const inputHeight = 2;
-  const outputHeight = Math.max(1, height - 5 - inputHeight);
-  const isInputActive = mode === "input";
+  const outputHeight = Math.max(1, height - 5 - settingsHeight - inputHeight);
+  const isInputActive = mode === "input" && !focusedField && !pickerOpen;
   const lines = execution?.lines ?? [];
   const hasPendingTools = (execution?.pendingToolCount ?? 0) > 0;
   const start = Math.max(0, lines.length - outputHeight);
@@ -1641,6 +1995,75 @@ function SessionPanel({ height, title, sessionType, onSubmit }) {
       lines.length,
       "]"
     ] }),
+    /* @__PURE__ */ jsxs10(Box9, { flexDirection: "column", children: [
+      /* @__PURE__ */ jsxs10(Box9, { gap: 2, children: [
+        /* @__PURE__ */ jsxs10(Box9, { children: [
+          /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: "Machine: " }),
+          /* @__PURE__ */ jsxs10(
+            Text12,
+            {
+              color: focusedField === "machine" ? "cyan" : void 0,
+              bold: focusedField === "machine",
+              inverse: focusedField === "machine",
+              children: [
+                " ",
+                machineLabel(machineName, machineId),
+                " "
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs10(Box9, { children: [
+          /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: "Dir: " }),
+          /* @__PURE__ */ jsxs10(
+            Text12,
+            {
+              color: focusedField === "workdir" ? "cyan" : void 0,
+              bold: focusedField === "workdir",
+              inverse: focusedField === "workdir",
+              children: [
+                " ",
+                truncate(workingDirectory, 60),
+                " "
+              ]
+            }
+          )
+        ] }),
+        !focusedField && /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: " (\u2191 to change settings)" }),
+        focusedField && !pickerOpen && /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: " (Enter to edit, \u2193 to input)" })
+      ] }),
+      pickerOpen && focusedField === "machine" && /* @__PURE__ */ jsx11(Box9, { flexDirection: "column", marginLeft: 2, children: connectedMachines.length === 0 ? /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: "  No connected machines" }) : connectedMachines.slice(0, 5).map((m) => /* @__PURE__ */ jsxs10(
+        Text12,
+        {
+          color: m.id === machineId ? "green" : void 0,
+          children: [
+            m.id === machineId ? "\u25CF " : "  ",
+            m.name || m.id.slice(0, 12),
+            " (",
+            m.hostname,
+            ", ",
+            m.platform,
+            ")"
+          ]
+        },
+        m.id
+      )) }),
+      pickerOpen && focusedField === "workdir" && /* @__PURE__ */ jsxs10(Box9, { marginLeft: 2, children: [
+        /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: "Path: " }),
+        /* @__PURE__ */ jsx11(
+          TextInput2,
+          {
+            defaultValue: workingDirectory,
+            onSubmit: (val) => {
+              if (val.trim()) {
+                useSessionSettingsStore.getState().setWorkingDirectory(val.trim());
+              }
+              useSessionSettingsStore.getState().setPickerOpen(false);
+            }
+          }
+        )
+      ] })
+    ] }),
     /* @__PURE__ */ jsx11(Box9, { borderStyle: "single", borderColor: isInputActive ? "cyan" : "gray", paddingX: 1, children: isRunning || streaming ? /* @__PURE__ */ jsxs10(Box9, { children: [
       /* @__PURE__ */ jsx11(Spinner, {}),
       /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: " Agent is working... (press Esc to return to navigation)" })
@@ -1661,22 +2084,235 @@ function SessionPanel({ height, title, sessionType, onSubmit }) {
             }
           }
         }
-      ) : /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: "Press Enter to start typing..." })
+      ) : /* @__PURE__ */ jsx11(Text12, { dimColor: true, children: focusedField ? "Press \u2193 to return to input" : "Press Enter to start typing..." })
     ] }) })
   ] }) });
 }
 
+// src/tui/components/panels/active-list-panel.tsx
+import { useState as useState2, useEffect as useEffect3 } from "react";
+import { Box as Box10, Text as Text13, useInput as useInput2 } from "ink";
+import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+var TERMINAL_NODE_STATUSES2 = /* @__PURE__ */ new Set([
+  "completed",
+  "auto_verified",
+  "awaiting_judgment",
+  "awaiting_approval",
+  "pruned"
+]);
+function statusSymbol(status) {
+  if (status === "generating") return "\u2728";
+  if (status === "running") return "\u25B6";
+  if (status === "pending") return "\u25CB";
+  return "\xB7";
+}
+function statusColor(status) {
+  if (status === "generating") return "magenta";
+  if (status === "running") return "cyan";
+  if (status === "pending") return "yellow";
+  return "gray";
+}
+function elapsedLabel(startedAt) {
+  if (!startedAt) return "";
+  const ms = Date.now() - new Date(startedAt).getTime();
+  if (ms < 0) return "";
+  const s = Math.floor(ms / 1e3);
+  const m = Math.floor(s / 60);
+  if (m > 0) return `${m}m${(s % 60).toString().padStart(2, "0")}s`;
+  return `${s}s`;
+}
+function ActiveListPanel({ height }) {
+  const outputs = useExecutionStore((s) => s.outputs);
+  const watchingId = useExecutionStore((s) => s.watchingId);
+  const pendingApproval = useExecutionStore((s) => s.pendingApproval);
+  const mode = useTuiStore((s) => s.mode);
+  const projects = useProjectsStore((s) => s.projects);
+  const planNodes = usePlanStore((s) => s.nodes);
+  const [cursor, setCursor] = useState2(0);
+  const tasksByProject = /* @__PURE__ */ new Map();
+  for (const [id, exec] of outputs) {
+    if (exec.status !== "running" && exec.status !== "pending" && exec.status !== "dispatched") continue;
+    const isPlanSession = exec.nodeId.startsWith("plan-");
+    const isPlayground = exec.nodeId.startsWith("playground-");
+    const isChatSession = exec.nodeId.startsWith("chat-");
+    const node = isPlanSession || isPlayground || isChatSession ? void 0 : planNodes.find((n) => n.id === exec.nodeId);
+    if (node && TERMINAL_NODE_STATUSES2.has(node.status)) continue;
+    let projectId = null;
+    if (node?.projectId) {
+      projectId = node.projectId;
+    } else if (isPlanSession) {
+      projectId = exec.nodeId.replace(/^plan-/, "").replace(/-\d+$/, "");
+    } else if (isPlayground) {
+      const parts = exec.nodeId.replace(/^playground-/, "").split("-");
+      parts.pop();
+      projectId = parts.join("-");
+    } else if (isChatSession) {
+      projectId = exec.nodeId.replace(/^chat-/, "").replace(/-\d+$/, "");
+    }
+    if (!projectId) continue;
+    let title = exec.title;
+    if (!title || title === exec.nodeId) {
+      if (isPlanSession) {
+        title = "Interactive Planning";
+      } else if (isPlayground) {
+        const proj = projects.find((p) => p.id === projectId);
+        title = proj?.name ? `Playground: ${proj.name}` : "Playground Session";
+      } else {
+        title = node?.title ?? `Task ${exec.nodeId.slice(0, 8)}`;
+      }
+    }
+    const task = {
+      nodeId: exec.nodeId,
+      projectId,
+      title,
+      status: isPlanSession ? "generating" : exec.status === "running" ? "running" : "pending",
+      executionId: id,
+      startedAt: exec.startedAt
+    };
+    const list = tasksByProject.get(projectId) ?? [];
+    list.push(task);
+    tasksByProject.set(projectId, list);
+  }
+  for (const node of planNodes) {
+    if (node.status !== "in_progress" && node.status !== "dispatched") continue;
+    if (node.deletedAt) continue;
+    const alreadyCovered = Array.from(outputs.values()).some(
+      (exec) => exec.nodeId === node.id && (exec.status === "running" || exec.status === "pending" || exec.status === "dispatched")
+    );
+    if (alreadyCovered) continue;
+    const task = {
+      nodeId: node.id,
+      projectId: node.projectId,
+      title: node.title,
+      status: node.status === "in_progress" ? "running" : "pending",
+      startedAt: node.executionStartedAt
+    };
+    const list = tasksByProject.get(node.projectId) ?? [];
+    list.push(task);
+    tasksByProject.set(node.projectId, list);
+  }
+  const sortedProjects = Array.from(tasksByProject.entries()).map(([projectId, tasks]) => {
+    const project = projects.find((p) => p.id === projectId);
+    return {
+      projectId,
+      projectName: project?.name ?? `Project ${projectId.slice(0, 8)}`,
+      projectColor: project?.color,
+      tasks
+    };
+  }).sort((a, b) => b.tasks.length - a.tasks.length);
+  const rows = [];
+  for (const group of sortedProjects) {
+    rows.push({
+      type: "header",
+      label: group.projectName,
+      color: "blue",
+      taskCount: group.tasks.length
+    });
+    for (const task of group.tasks) {
+      rows.push({
+        type: "entry",
+        label: task.title,
+        executionId: task.executionId,
+        status: task.status,
+        startedAt: task.startedAt
+      });
+    }
+  }
+  const selectableIndices = rows.map((r, i) => r.type === "entry" ? i : -1).filter((i) => i >= 0);
+  useEffect3(() => {
+    if (selectableIndices.length > 0 && cursor >= selectableIndices.length) {
+      setCursor(selectableIndices.length - 1);
+    }
+  }, [selectableIndices.length, cursor]);
+  useInput2((input, key) => {
+    if (mode !== "normal") return;
+    if (key.upArrow || input === "k") {
+      setCursor((c) => Math.max(0, c - 1));
+    } else if (key.downArrow || input === "j") {
+      setCursor((c) => Math.min(selectableIndices.length - 1, c + 1));
+    } else if (key.return) {
+      const rowIdx = selectableIndices[cursor];
+      const row = rows[rowIdx];
+      if (row?.executionId) {
+        useExecutionStore.getState().setWatching(row.executionId);
+      }
+    }
+  });
+  const totalCount = selectableIndices.length;
+  const visibleHeight = Math.max(1, height - 3);
+  const cursorRowIdx = selectableIndices[cursor] ?? 0;
+  let start = 0;
+  if (rows.length > visibleHeight) {
+    if (cursorRowIdx >= rows.length - visibleHeight) {
+      start = rows.length - visibleHeight;
+    } else {
+      start = Math.max(0, cursorRowIdx - Math.floor(visibleHeight / 2));
+    }
+  }
+  const visibleRows = rows.slice(start, start + visibleHeight);
+  const titleSuffix = totalCount > 0 ? ` (${totalCount})` : "";
+  return /* @__PURE__ */ jsx12(Panel, { title: `ACTIVE${titleSuffix}`, isFocused: true, height, children: rows.length === 0 ? /* @__PURE__ */ jsx12(Text13, { dimColor: true, children: "  No active tasks" }) : /* @__PURE__ */ jsxs11(Box10, { flexDirection: "column", children: [
+    visibleRows.map((row, i) => {
+      const actualIndex = start + i;
+      if (row.type === "header") {
+        return /* @__PURE__ */ jsxs11(Text13, { bold: true, color: "blue", children: [
+          ` ${truncate(row.label, 24)} `,
+          /* @__PURE__ */ jsxs11(Text13, { dimColor: true, children: [
+            "(",
+            row.taskCount,
+            ")"
+          ] })
+        ] }, `hdr-${actualIndex}`);
+      }
+      const isCursor = actualIndex === cursorRowIdx;
+      const isWatched = row.executionId === watchingId;
+      const hasApproval = pendingApproval?.taskId === row.executionId;
+      const elapsed = elapsedLabel(row.startedAt);
+      return /* @__PURE__ */ jsxs11(Box10, { children: [
+        /* @__PURE__ */ jsxs11(
+          Text13,
+          {
+            color: hasApproval ? "yellow" : isCursor ? "cyan" : isWatched ? "green" : statusColor(row.status),
+            bold: isCursor,
+            inverse: isCursor,
+            wrap: "truncate",
+            children: [
+              isCursor ? " > " : isWatched ? " * " : "   ",
+              hasApproval ? "!" : statusSymbol(row.status),
+              " ",
+              truncate(row.label, 20)
+            ]
+          }
+        ),
+        elapsed && /* @__PURE__ */ jsxs11(Text13, { dimColor: true, children: [
+          " ",
+          elapsed
+        ] })
+      ] }, row.executionId ?? `row-${actualIndex}`);
+    }),
+    rows.length > visibleHeight && /* @__PURE__ */ jsxs11(Text13, { dimColor: true, children: [
+      "  [",
+      start + 1,
+      "-",
+      Math.min(start + visibleHeight, rows.length),
+      "/",
+      rows.length,
+      "]"
+    ] })
+  ] }) });
+}
+
 // src/tui/components/panels/detail-overlay.tsx
 import "react";
-import { Box as Box10, Text as Text13 } from "ink";
-import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Box as Box11, Text as Text14 } from "ink";
+import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
 function DetailOverlay() {
   const showDetail = useTuiStore((s) => s.showDetail);
   const detailType = useTuiStore((s) => s.detailType);
   const detailId = useTuiStore((s) => s.detailId);
   if (!showDetail || !detailType || !detailId) return null;
-  return /* @__PURE__ */ jsxs11(
-    Box10,
+  return /* @__PURE__ */ jsxs12(
+    Box11,
     {
       flexDirection: "column",
       borderStyle: "round",
@@ -1684,89 +2320,89 @@ function DetailOverlay() {
       paddingX: 2,
       paddingY: 1,
       children: [
-        detailType === "project" && /* @__PURE__ */ jsx12(ProjectDetail, { id: detailId }),
-        detailType === "node" && /* @__PURE__ */ jsx12(NodeDetail, { id: detailId }),
-        detailType === "machine" && /* @__PURE__ */ jsx12(MachineDetail, { id: detailId }),
-        /* @__PURE__ */ jsx12(Text13, { dimColor: true, children: "Press Esc to close" })
+        detailType === "project" && /* @__PURE__ */ jsx13(ProjectDetail, { id: detailId }),
+        detailType === "node" && /* @__PURE__ */ jsx13(NodeDetail, { id: detailId }),
+        detailType === "machine" && /* @__PURE__ */ jsx13(MachineDetail, { id: detailId }),
+        /* @__PURE__ */ jsx13(Text14, { dimColor: true, children: "Press Esc to close" })
       ]
     }
   );
 }
 function ProjectDetail({ id }) {
   const project = useProjectsStore((s) => s.projects.find((p) => p.id === id));
-  if (!project) return /* @__PURE__ */ jsx12(Text13, { color: "red", children: "Project not found" });
-  return /* @__PURE__ */ jsxs11(Box10, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx12(Text13, { bold: true, color: "cyan", children: project.name }),
-    /* @__PURE__ */ jsx12(Text13, { children: " " }),
-    /* @__PURE__ */ jsx12(Field, { label: "ID", value: project.id }),
-    /* @__PURE__ */ jsx12(Field, { label: "Status", value: project.status, color: getStatusColor(project.status) }),
-    /* @__PURE__ */ jsx12(Field, { label: "Description", value: project.description || "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Health", value: project.health ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Progress", value: `${project.progress}%` }),
-    /* @__PURE__ */ jsx12(Field, { label: "Working Dir", value: project.workingDirectory ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Repository", value: project.repository ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Delivery", value: project.deliveryMode ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Start Date", value: project.startDate ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Target Date", value: project.targetDate ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Created", value: formatRelativeTime(project.createdAt) }),
-    /* @__PURE__ */ jsx12(Field, { label: "Updated", value: formatRelativeTime(project.updatedAt) }),
-    /* @__PURE__ */ jsx12(Text13, { children: " " })
+  if (!project) return /* @__PURE__ */ jsx13(Text14, { color: "red", children: "Project not found" });
+  return /* @__PURE__ */ jsxs12(Box11, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx13(Text14, { bold: true, color: "cyan", children: project.name }),
+    /* @__PURE__ */ jsx13(Text14, { children: " " }),
+    /* @__PURE__ */ jsx13(Field, { label: "ID", value: project.id }),
+    /* @__PURE__ */ jsx13(Field, { label: "Status", value: project.status, color: getStatusColor(project.status) }),
+    /* @__PURE__ */ jsx13(Field, { label: "Description", value: project.description || "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Health", value: project.health ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Progress", value: `${project.progress}%` }),
+    /* @__PURE__ */ jsx13(Field, { label: "Working Dir", value: project.workingDirectory ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Repository", value: project.repository ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Delivery", value: project.deliveryMode ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Start Date", value: project.startDate ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Target Date", value: project.targetDate ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Created", value: formatRelativeTime(project.createdAt) }),
+    /* @__PURE__ */ jsx13(Field, { label: "Updated", value: formatRelativeTime(project.updatedAt) }),
+    /* @__PURE__ */ jsx13(Text14, { children: " " })
   ] });
 }
 function NodeDetail({ id }) {
   const node = usePlanStore((s) => s.nodes.find((n) => n.id === id));
-  if (!node) return /* @__PURE__ */ jsx12(Text13, { color: "red", children: "Node not found" });
-  return /* @__PURE__ */ jsxs11(Box10, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx12(Text13, { bold: true, color: "cyan", children: node.title }),
-    /* @__PURE__ */ jsx12(Text13, { children: " " }),
-    /* @__PURE__ */ jsx12(Field, { label: "ID", value: node.id }),
-    /* @__PURE__ */ jsx12(Field, { label: "Type", value: node.type }),
-    /* @__PURE__ */ jsx12(Field, { label: "Status", value: node.status, color: getStatusColor(node.status) }),
-    /* @__PURE__ */ jsx12(Field, { label: "Description", value: node.description || "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Priority", value: node.priority ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Estimate", value: node.estimate ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Start Date", value: node.startDate ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "End Date", value: node.endDate ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Due Date", value: node.dueDate ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Branch", value: node.branchName ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "PR URL", value: node.prUrl ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Execution ID", value: node.executionId ?? "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Exec Started", value: node.executionStartedAt ? formatRelativeTime(node.executionStartedAt) : "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Exec Completed", value: node.executionCompletedAt ? formatRelativeTime(node.executionCompletedAt) : "\u2014" }),
-    /* @__PURE__ */ jsx12(Text13, { children: " " })
+  if (!node) return /* @__PURE__ */ jsx13(Text14, { color: "red", children: "Node not found" });
+  return /* @__PURE__ */ jsxs12(Box11, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx13(Text14, { bold: true, color: "cyan", children: node.title }),
+    /* @__PURE__ */ jsx13(Text14, { children: " " }),
+    /* @__PURE__ */ jsx13(Field, { label: "ID", value: node.id }),
+    /* @__PURE__ */ jsx13(Field, { label: "Type", value: node.type }),
+    /* @__PURE__ */ jsx13(Field, { label: "Status", value: node.status, color: getStatusColor(node.status) }),
+    /* @__PURE__ */ jsx13(Field, { label: "Description", value: node.description || "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Priority", value: node.priority ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Estimate", value: node.estimate ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Start Date", value: node.startDate ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "End Date", value: node.endDate ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Due Date", value: node.dueDate ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Branch", value: node.branchName ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "PR URL", value: node.prUrl ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Execution ID", value: node.executionId ?? "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Exec Started", value: node.executionStartedAt ? formatRelativeTime(node.executionStartedAt) : "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Exec Completed", value: node.executionCompletedAt ? formatRelativeTime(node.executionCompletedAt) : "\u2014" }),
+    /* @__PURE__ */ jsx13(Text14, { children: " " })
   ] });
 }
 function MachineDetail({ id }) {
   const machine = useMachinesStore((s) => s.machines.find((m) => m.id === id));
-  if (!machine) return /* @__PURE__ */ jsx12(Text13, { color: "red", children: "Machine not found" });
-  return /* @__PURE__ */ jsxs11(Box10, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsx12(Text13, { bold: true, color: "cyan", children: machine.name }),
-    /* @__PURE__ */ jsx12(Text13, { children: " " }),
-    /* @__PURE__ */ jsx12(Field, { label: "ID", value: machine.id }),
-    /* @__PURE__ */ jsx12(Field, { label: "Hostname", value: machine.hostname }),
-    /* @__PURE__ */ jsx12(Field, { label: "Platform", value: machine.platform }),
-    /* @__PURE__ */ jsx12(Field, { label: "Env Type", value: machine.environmentType }),
-    /* @__PURE__ */ jsx12(Field, { label: "Connected", value: machine.isConnected ? "Yes" : "No", color: machine.isConnected ? "green" : "red" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Providers", value: machine.providers.join(", ") || "\u2014" }),
-    /* @__PURE__ */ jsx12(Field, { label: "Registered", value: formatRelativeTime(machine.registeredAt) }),
-    /* @__PURE__ */ jsx12(Field, { label: "Last Seen", value: formatRelativeTime(machine.lastSeenAt) }),
-    /* @__PURE__ */ jsx12(Text13, { children: " " })
+  if (!machine) return /* @__PURE__ */ jsx13(Text14, { color: "red", children: "Machine not found" });
+  return /* @__PURE__ */ jsxs12(Box11, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsx13(Text14, { bold: true, color: "cyan", children: machine.name }),
+    /* @__PURE__ */ jsx13(Text14, { children: " " }),
+    /* @__PURE__ */ jsx13(Field, { label: "ID", value: machine.id }),
+    /* @__PURE__ */ jsx13(Field, { label: "Hostname", value: machine.hostname }),
+    /* @__PURE__ */ jsx13(Field, { label: "Platform", value: machine.platform }),
+    /* @__PURE__ */ jsx13(Field, { label: "Env Type", value: machine.environmentType }),
+    /* @__PURE__ */ jsx13(Field, { label: "Connected", value: machine.isConnected ? "Yes" : "No", color: machine.isConnected ? "green" : "red" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Providers", value: machine.providers.join(", ") || "\u2014" }),
+    /* @__PURE__ */ jsx13(Field, { label: "Registered", value: formatRelativeTime(machine.registeredAt) }),
+    /* @__PURE__ */ jsx13(Field, { label: "Last Seen", value: formatRelativeTime(machine.lastSeenAt) }),
+    /* @__PURE__ */ jsx13(Text14, { children: " " })
   ] });
 }
 function Field({ label, value, color }) {
-  return /* @__PURE__ */ jsxs11(Box10, { children: [
-    /* @__PURE__ */ jsx12(Text13, { dimColor: true, children: label.padEnd(16) }),
-    color ? /* @__PURE__ */ jsx12(Text13, { color, children: value }) : /* @__PURE__ */ jsx12(Text13, { children: value })
+  return /* @__PURE__ */ jsxs12(Box11, { children: [
+    /* @__PURE__ */ jsx13(Text14, { dimColor: true, children: label.padEnd(16) }),
+    color ? /* @__PURE__ */ jsx13(Text14, { color, children: value }) : /* @__PURE__ */ jsx13(Text14, { children: value })
   ] });
 }
 
 // src/tui/components/shared/approval-dialog.tsx
-import { useState as useState2 } from "react";
-import { Box as Box11, Text as Text14, useInput as useInput2 } from "ink";
-import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useState as useState3 } from "react";
+import { Box as Box12, Text as Text15, useInput as useInput3 } from "ink";
+import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 function ApprovalDialog({ question, options, onSelect, onDismiss }) {
-  const [selectedIndex, setSelectedIndex] = useState2(0);
-  useInput2((input, key) => {
+  const [selectedIndex, setSelectedIndex] = useState3(0);
+  useInput3((input, key) => {
     if (key.escape) {
       onDismiss();
       return;
@@ -1786,8 +2422,8 @@ function ApprovalDialog({ question, options, onSelect, onDismiss }) {
       onSelect(num - 1);
     }
   });
-  return /* @__PURE__ */ jsxs12(
-    Box11,
+  return /* @__PURE__ */ jsxs13(
+    Box12,
     {
       flexDirection: "column",
       borderStyle: "round",
@@ -1795,16 +2431,16 @@ function ApprovalDialog({ question, options, onSelect, onDismiss }) {
       paddingX: 1,
       paddingY: 0,
       children: [
-        /* @__PURE__ */ jsx13(Text14, { color: "yellow", bold: true, children: "Approval Required" }),
-        /* @__PURE__ */ jsx13(Text14, { wrap: "wrap", children: question }),
-        /* @__PURE__ */ jsx13(Box11, { flexDirection: "column", marginTop: 1, children: options.map((opt, i) => /* @__PURE__ */ jsx13(Box11, { children: /* @__PURE__ */ jsxs12(Text14, { color: i === selectedIndex ? "cyan" : "white", children: [
+        /* @__PURE__ */ jsx14(Text15, { color: "yellow", bold: true, children: "Approval Required" }),
+        /* @__PURE__ */ jsx14(Text15, { wrap: "wrap", children: question }),
+        /* @__PURE__ */ jsx14(Box12, { flexDirection: "column", marginTop: 1, children: options.map((opt, i) => /* @__PURE__ */ jsx14(Box12, { children: /* @__PURE__ */ jsxs13(Text15, { color: i === selectedIndex ? "cyan" : "white", children: [
           i === selectedIndex ? "\u25B8 " : "  ",
           "[",
           i + 1,
           "] ",
           opt
         ] }) }, i)) }),
-        /* @__PURE__ */ jsx13(Box11, { marginTop: 1, children: /* @__PURE__ */ jsxs12(Text14, { dimColor: true, children: [
+        /* @__PURE__ */ jsx14(Box12, { marginTop: 1, children: /* @__PURE__ */ jsxs13(Text15, { dimColor: true, children: [
           "\u2191\u2193/jk navigate \u2022 Enter select \u2022 1-",
           options.length,
           " quick select \u2022 Esc dismiss"
@@ -1815,7 +2451,7 @@ function ApprovalDialog({ question, options, onSelect, onDismiss }) {
 }
 
 // src/tui/components/layout/main-layout.tsx
-import { Fragment as Fragment2, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
 function MainLayout({ onSessionMessage }) {
   const showHelp = useTuiStore((s) => s.showHelp);
   const showDetail = useTuiStore((s) => s.showDetail);
@@ -1831,20 +2467,20 @@ function MainLayout({ onSessionMessage }) {
   const bottomPanelHeight = panelOpen ? Math.floor(termHeight / 2) : 1;
   const contentHeight = termHeight - 2 - bottomPanelHeight;
   if (showHelp) {
-    return /* @__PURE__ */ jsxs13(Box12, { flexDirection: "column", width: termWidth, height: termHeight, children: [
-      /* @__PURE__ */ jsx14(StatusBar, {}),
-      /* @__PURE__ */ jsx14(HelpOverlay, {}),
-      /* @__PURE__ */ jsx14(CommandLine, { height: 1 })
+    return /* @__PURE__ */ jsxs14(Box13, { flexDirection: "column", width: termWidth, height: termHeight, children: [
+      /* @__PURE__ */ jsx15(StatusBar, {}),
+      /* @__PURE__ */ jsx15(HelpOverlay, {}),
+      /* @__PURE__ */ jsx15(CommandLine, { height: 1 })
     ] });
   }
   if (showDetail) {
-    return /* @__PURE__ */ jsxs13(Box12, { flexDirection: "column", width: termWidth, height: termHeight, children: [
-      /* @__PURE__ */ jsx14(StatusBar, {}),
-      /* @__PURE__ */ jsx14(DetailOverlay, {}),
-      /* @__PURE__ */ jsx14(CommandLine, { height: 1 })
+    return /* @__PURE__ */ jsxs14(Box13, { flexDirection: "column", width: termWidth, height: termHeight, children: [
+      /* @__PURE__ */ jsx15(StatusBar, {}),
+      /* @__PURE__ */ jsx15(DetailOverlay, {}),
+      /* @__PURE__ */ jsx15(CommandLine, { height: 1 })
     ] });
   }
-  const approvalOverlay = pendingApproval ? /* @__PURE__ */ jsx14(Box12, { position: "absolute", marginTop: 4, marginLeft: Math.floor(termWidth / 4), children: /* @__PURE__ */ jsx14(
+  const approvalOverlay = pendingApproval ? /* @__PURE__ */ jsx15(Box13, { position: "absolute", marginTop: 4, marginLeft: Math.floor(termWidth / 4), children: /* @__PURE__ */ jsx15(
     ApprovalDialog,
     {
       question: pendingApproval.question,
@@ -1860,42 +2496,45 @@ function MainLayout({ onSessionMessage }) {
   ) }) : null;
   let content;
   if (activeView === "plan-gen") {
-    content = /* @__PURE__ */ jsx14(Box12, { flexDirection: "row", height: contentHeight, children: /* @__PURE__ */ jsx14(Box12, { flexGrow: 1, children: /* @__PURE__ */ jsx14(SessionPanel, { height: contentHeight, title: "PLAN GENERATION", sessionType: "plan-generate", onSubmit: onSessionMessage }) }) });
+    content = /* @__PURE__ */ jsx15(Box13, { flexDirection: "row", height: contentHeight, children: /* @__PURE__ */ jsx15(Box13, { flexGrow: 1, children: /* @__PURE__ */ jsx15(SessionPanel, { height: contentHeight, title: "PLAN GENERATION", sessionType: "plan-generate", onSubmit: onSessionMessage }) }) });
   } else if (activeView === "projects") {
-    content = /* @__PURE__ */ jsxs13(Box12, { flexDirection: "row", height: contentHeight, children: [
-      /* @__PURE__ */ jsx14(Box12, { width: "40%", children: /* @__PURE__ */ jsx14(ProjectsPanel, { height: contentHeight }) }),
-      /* @__PURE__ */ jsx14(Box12, { flexGrow: 1, children: /* @__PURE__ */ jsx14(PlanPanel, { height: contentHeight }) })
+    content = /* @__PURE__ */ jsxs14(Box13, { flexDirection: "row", height: contentHeight, children: [
+      /* @__PURE__ */ jsx15(Box13, { width: "40%", children: /* @__PURE__ */ jsx15(ProjectsPanel, { height: contentHeight }) }),
+      /* @__PURE__ */ jsx15(Box13, { flexGrow: 1, children: /* @__PURE__ */ jsx15(PlanPanel, { height: contentHeight }) })
     ] });
   } else if (activeView === "playground") {
-    content = /* @__PURE__ */ jsx14(Box12, { flexDirection: "row", height: contentHeight, children: /* @__PURE__ */ jsx14(Box12, { flexGrow: 1, children: /* @__PURE__ */ jsx14(SessionPanel, { height: contentHeight, title: "PLAYGROUND", sessionType: "playground", onSubmit: onSessionMessage }) }) });
-  } else if (activeView === "output") {
-    content = /* @__PURE__ */ jsx14(Box12, { flexDirection: "row", height: contentHeight, children: /* @__PURE__ */ jsx14(Box12, { flexGrow: 1, children: /* @__PURE__ */ jsx14(OutputPanel, { height: contentHeight }) }) });
+    content = /* @__PURE__ */ jsx15(Box13, { flexDirection: "row", height: contentHeight, children: /* @__PURE__ */ jsx15(Box13, { flexGrow: 1, children: /* @__PURE__ */ jsx15(SessionPanel, { height: contentHeight, title: "PLAYGROUND", sessionType: "playground", onSubmit: onSessionMessage }) }) });
+  } else if (activeView === "active") {
+    content = /* @__PURE__ */ jsxs14(Box13, { flexDirection: "row", height: contentHeight, children: [
+      /* @__PURE__ */ jsx15(Box13, { width: "25%", children: /* @__PURE__ */ jsx15(ActiveListPanel, { height: contentHeight }) }),
+      /* @__PURE__ */ jsx15(Box13, { flexGrow: 1, children: /* @__PURE__ */ jsx15(OutputPanel, { height: contentHeight }) })
+    ] });
   } else {
     const topRowHeight = Math.floor(contentHeight / 2);
     const bottomRowHeight = contentHeight - topRowHeight;
-    content = /* @__PURE__ */ jsxs13(Fragment2, { children: [
-      /* @__PURE__ */ jsxs13(Box12, { flexDirection: "row", height: topRowHeight, children: [
-        /* @__PURE__ */ jsx14(Box12, { width: "30%", children: /* @__PURE__ */ jsx14(ProjectsPanel, { height: topRowHeight }) }),
-        /* @__PURE__ */ jsx14(Box12, { flexGrow: 1, children: /* @__PURE__ */ jsx14(PlanPanel, { height: topRowHeight }) })
+    content = /* @__PURE__ */ jsxs14(Fragment, { children: [
+      /* @__PURE__ */ jsxs14(Box13, { flexDirection: "row", height: topRowHeight, children: [
+        /* @__PURE__ */ jsx15(Box13, { width: "30%", children: /* @__PURE__ */ jsx15(ProjectsPanel, { height: topRowHeight }) }),
+        /* @__PURE__ */ jsx15(Box13, { flexGrow: 1, children: /* @__PURE__ */ jsx15(PlanPanel, { height: topRowHeight }) })
       ] }),
-      /* @__PURE__ */ jsxs13(Box12, { flexDirection: "row", height: bottomRowHeight, children: [
-        /* @__PURE__ */ jsx14(Box12, { width: "30%", children: /* @__PURE__ */ jsx14(MachinesPanel, { height: bottomRowHeight }) }),
-        /* @__PURE__ */ jsx14(Box12, { flexGrow: 1, children: showChat ? /* @__PURE__ */ jsx14(ChatPanel, { height: bottomRowHeight }) : /* @__PURE__ */ jsx14(OutputPanel, { height: bottomRowHeight }) })
+      /* @__PURE__ */ jsxs14(Box13, { flexDirection: "row", height: bottomRowHeight, children: [
+        /* @__PURE__ */ jsx15(Box13, { width: "30%", children: /* @__PURE__ */ jsx15(MachinesPanel, { height: bottomRowHeight }) }),
+        /* @__PURE__ */ jsx15(Box13, { flexGrow: 1, children: showChat ? /* @__PURE__ */ jsx15(ChatPanel, { height: bottomRowHeight }) : /* @__PURE__ */ jsx15(OutputPanel, { height: bottomRowHeight }) })
       ] })
     ] });
   }
-  return /* @__PURE__ */ jsxs13(Box12, { flexDirection: "column", width: termWidth, height: termHeight, children: [
-    /* @__PURE__ */ jsx14(StatusBar, {}),
+  return /* @__PURE__ */ jsxs14(Box13, { flexDirection: "column", width: termWidth, height: termHeight, children: [
+    /* @__PURE__ */ jsx15(StatusBar, {}),
     content,
-    /* @__PURE__ */ jsx14(SearchOverlay, {}),
+    /* @__PURE__ */ jsx15(SearchOverlay, {}),
     approvalOverlay,
-    /* @__PURE__ */ jsx14(CommandLine, { height: bottomPanelHeight })
+    /* @__PURE__ */ jsx15(CommandLine, { height: bottomPanelHeight })
   ] });
 }
 
 // src/tui/hooks/use-vim-mode.ts
 import { useCallback, useRef } from "react";
-import { useInput as useInput3, useApp } from "ink";
+import { useInput as useInput4, useApp } from "ink";
 
 // src/tui/lib/vim-state-machine.ts
 function initialVimState() {
@@ -1940,7 +2579,7 @@ function handleKey(state, key, ctrl, meta) {
     case "search":
       return handleSearchMode(state, key);
     case "input":
-      return handleInputMode(state, key);
+      return handleInputMode(state, key, ctrl);
   }
 }
 function handleNormalMode(state, key, ctrl, meta) {
@@ -1950,6 +2589,8 @@ function handleNormalMode(state, key, ctrl, meta) {
         return [{ ...state, mode: "palette", commandBuffer: "" }, { type: "palette" }];
       case "f":
         return [state, { type: "search" }];
+      case "d":
+        return [state, { type: "cancel" }];
       case "c":
         return [state, { type: "quit" }];
       case "r":
@@ -2012,10 +2653,12 @@ function handleNormalMode(state, key, ctrl, meta) {
     case "4":
       return [state, { type: "view", value: "playground" }];
     case "5":
-      return [state, { type: "view", value: "output" }];
+      return [state, { type: "view", value: "active" }];
     // Function-key style shortcuts (single letter, no prefix needed)
     case "d":
       return [state, { type: "dispatch" }];
+    case "x":
+      return [state, { type: "cancel" }];
     case "q":
       return [state, { type: "quit" }];
     case "?":
@@ -2077,7 +2720,10 @@ function handleSearchMode(state, key) {
   }
   return [state, { type: "none" }];
 }
-function handleInputMode(state, _) {
+function handleInputMode(state, key, ctrl) {
+  if (ctrl && key === "d") {
+    return [{ ...state, mode: "normal" }, { type: "cancel" }];
+  }
   return [state, { type: "none" }];
 }
 
@@ -2120,6 +2766,13 @@ function useVimMode(callbacks = {}) {
               store.pageDown();
               break;
           }
+          if (store.focusedPanel === "projects") {
+            const sorted = getVisibleProjects(useProjectsStore.getState().projects);
+            const idx = useTuiStore.getState().scrollIndex.projects;
+            if (sorted[idx]) {
+              useTuiStore.getState().setSelectedProject(sorted[idx].id);
+            }
+          }
           break;
         case "focus":
           if (effect.panel != null) {
@@ -2132,7 +2785,7 @@ function useVimMode(callbacks = {}) {
           break;
         case "select": {
           const view = store.activeView;
-          if (view === "playground" || view === "plan-gen" || view === "output") {
+          if (view === "playground" || view === "plan-gen" || view === "active") {
             vimState.current = { ...vimState.current, mode: "input" };
             store.setMode("input");
           } else {
@@ -2147,7 +2800,8 @@ function useVimMode(callbacks = {}) {
             const filtered = getFilteredPaletteCommands(vimState.current.commandBuffer);
             const selected = filtered[store.paletteIndex];
             if (selected) {
-              callbacks.onCommand?.(selected.name);
+              const cmd = selected.usage?.startsWith("resume:") ? selected.usage : selected.name;
+              callbacks.onCommand?.(cmd);
             }
           } else if (effect.value?.startsWith("__autocomplete__")) {
           } else if (effect.value) {
@@ -2177,7 +2831,7 @@ function useVimMode(callbacks = {}) {
           store.toggleChat();
           break;
         case "view":
-          if (effect.value === "dashboard" || effect.value === "plan-gen" || effect.value === "projects" || effect.value === "playground" || effect.value === "output") {
+          if (effect.value === "dashboard" || effect.value === "plan-gen" || effect.value === "projects" || effect.value === "playground" || effect.value === "active") {
             store.setActiveView(effect.value);
           }
           break;
@@ -2187,7 +2841,7 @@ function useVimMode(callbacks = {}) {
     },
     [store, callbacks, exit]
   );
-  useInput3((input, key) => {
+  useInput4((input, key) => {
     const searchOpen = useSearchStore.getState().isOpen;
     if (store.showHelp || store.showSearch || store.showDetail || searchOpen) {
       if (key.escape) {
@@ -2201,6 +2855,61 @@ function useVimMode(callbacks = {}) {
       }
       return;
     }
+    const isSessionView = store.activeView === "playground" || store.activeView === "plan-gen";
+    if (isSessionView && vimState.current.mode === "input") {
+      const settings = useSessionSettingsStore.getState();
+      if (key.escape) {
+        if (settings.pickerOpen) {
+          settings.setPickerOpen(false);
+          return;
+        }
+        if (settings.focusedField) {
+          settings.setFocusedField(null);
+          return;
+        }
+      }
+      if (settings.pickerOpen && settings.focusedField === "machine") {
+        const machines = useMachinesStore.getState().machines.filter((m) => m.isConnected);
+        const currentIdx = machines.findIndex((m) => m.id === settings.machineId);
+        if (key.upArrow) {
+          const newIdx = Math.max(0, currentIdx - 1);
+          if (machines[newIdx]) settings.setMachine(machines[newIdx].id, machines[newIdx].name);
+          return;
+        }
+        if (key.downArrow) {
+          const newIdx = Math.min(machines.length - 1, currentIdx + 1);
+          if (machines[newIdx]) settings.setMachine(machines[newIdx].id, machines[newIdx].name);
+          return;
+        }
+        if (key.return) {
+          settings.setPickerOpen(false);
+          return;
+        }
+        return;
+      }
+      if (settings.pickerOpen && settings.focusedField === "workdir") {
+        return;
+      }
+      if (settings.focusedField) {
+        if (key.return) {
+          settings.setPickerOpen(true);
+          return;
+        }
+        if (key.leftArrow || key.rightArrow) {
+          settings.setFocusedField(settings.focusedField === "machine" ? "workdir" : "machine");
+          return;
+        }
+        if (key.downArrow) {
+          settings.setFocusedField(null);
+          return;
+        }
+        if (key.upArrow) return;
+      }
+      if (!settings.focusedField && key.upArrow) {
+        settings.setFocusedField("machine");
+        return;
+      }
+    }
     let keyStr = input;
     if (key.escape) keyStr = "escape";
     else if (key.return) keyStr = "return";
@@ -2231,8 +2940,26 @@ function useVimMode(callbacks = {}) {
 }
 
 // src/tui/hooks/use-polling.ts
-import { useEffect as useEffect2, useCallback as useCallback2 } from "react";
-function usePolling(client, intervalMs = 3e4) {
+import { useEffect as useEffect4, useCallback as useCallback2 } from "react";
+function deriveTitle(nodeId, exec, projects, planNodes) {
+  const projectName = projects.find((p) => p.id === exec.projectId)?.name;
+  if (nodeId.startsWith("playground-")) {
+    const firstLine = exec.streamText?.split("\n").find((l) => l.trim().length > 0)?.trim();
+    if (firstLine && firstLine.length > 5) {
+      return `Playground: ${firstLine.slice(0, 50)}`;
+    }
+    return `Playground${projectName ? ` \u2014 ${projectName}` : ""}`;
+  }
+  if (nodeId.startsWith("plan-")) {
+    return `Plan${projectName ? ` \u2014 ${projectName}` : ""}`;
+  }
+  const planNode = planNodes.find((n) => n.id === nodeId);
+  if (planNode) {
+    return planNode.title;
+  }
+  return projectName ? `Task \u2014 ${projectName}` : nodeId.slice(0, 30);
+}
+function usePolling(client, intervalMs = 1e4) {
   const selectedProjectId = useTuiStore((s) => s.selectedProjectId);
   const loadProjects = useCallback2(async () => {
     useProjectsStore.getState().setLoading(true);
@@ -2252,6 +2979,13 @@ function usePolling(client, intervalMs = 3e4) {
       usePlanStore.getState().setError(err instanceof Error ? err.message : String(err));
     }
   }, [client]);
+  const loadAllPlans = useCallback2(async () => {
+    try {
+      const { nodes, edges } = await client.getFullPlan();
+      usePlanStore.getState().setAllPlans(nodes, edges);
+    } catch {
+    }
+  }, [client]);
   const loadMachines = useCallback2(async () => {
     useMachinesStore.getState().setLoading(true);
     try {
@@ -2262,6 +2996,25 @@ function usePolling(client, intervalMs = 3e4) {
       useMachinesStore.getState().setError(err instanceof Error ? err.message : String(err));
     }
   }, [client]);
+  const loadExecutions = useCallback2(async () => {
+    try {
+      const execMap = await client.getExecutions();
+      const projects = useProjectsStore.getState().projects;
+      const planNodes = usePlanStore.getState().nodes;
+      const entries = Object.values(execMap).map((e) => {
+        const nodeId = e.nodeClientId ?? e.nodeId ?? e.executionId;
+        return {
+          executionId: e.executionId,
+          nodeId,
+          title: deriveTitle(nodeId, e, projects, planNodes),
+          status: e.status,
+          startedAt: e.startedAt
+        };
+      });
+      useExecutionStore.getState().seedHistorical(entries);
+    } catch {
+    }
+  }, [client]);
   const loadUsage = useCallback2(async () => {
     try {
       const history = await client.getUsageHistory(1);
@@ -2275,29 +3028,30 @@ function usePolling(client, intervalMs = 3e4) {
     await Promise.allSettled([
       loadProjects(),
       loadMachines(),
+      loadExecutions(),
       loadUsage(),
-      ...selectedProjectId ? [loadPlan(selectedProjectId)] : []
+      loadAllPlans()
     ]);
-  }, [loadProjects, loadMachines, loadUsage, loadPlan, selectedProjectId]);
-  useEffect2(() => {
+  }, [loadProjects, loadMachines, loadExecutions, loadUsage, loadAllPlans]);
+  useEffect4(() => {
     refreshAll2();
   }, [refreshAll2]);
-  useEffect2(() => {
+  useEffect4(() => {
     if (selectedProjectId) {
-      loadPlan(selectedProjectId);
+      usePlanStore.getState().selectProject(selectedProjectId);
     } else {
       usePlanStore.getState().clear();
     }
-  }, [selectedProjectId, loadPlan]);
-  useEffect2(() => {
+  }, [selectedProjectId]);
+  useEffect4(() => {
     const timer = setInterval(refreshAll2, intervalMs);
     return () => clearInterval(timer);
   }, [refreshAll2, intervalMs]);
-  return { refreshAll: refreshAll2, loadProjects, loadPlan, loadMachines };
+  return { refreshAll: refreshAll2, loadProjects, loadPlan, loadAllPlans, loadMachines };
 }
 
 // src/tui/hooks/use-sse-stream.ts
-import { useEffect as useEffect3, useRef as useRef2 } from "react";
+import { useEffect as useEffect5, useRef as useRef2 } from "react";
 
 // src/tui/sse-client.ts
 var SSEClient = class {
@@ -2382,17 +3136,18 @@ var SSEClient = class {
 };
 
 // src/tui/hooks/use-sse-stream.ts
-function useSSEStream(client) {
+function useSSEStream(client, onReconnect) {
   const sseRef = useRef2(null);
   const setConnected = useTuiStore((s) => s.setConnected);
   const setMachineCount = useTuiStore((s) => s.setMachineCount);
   const setLastError = useTuiStore((s) => s.setLastError);
-  useEffect3(() => {
+  useEffect5(() => {
     const handler = (event) => {
       switch (event.type) {
         case "__connected":
           setConnected(true);
           setLastError(null);
+          onReconnect?.();
           break;
         case "__disconnected":
           setConnected(false);
@@ -2465,7 +3220,8 @@ function useSSEStream(client) {
         case "task:session_init": {
           const taskId = event.data.taskId;
           const nodeId = event.data.nodeId ?? taskId;
-          useExecutionStore.getState().initExecution(taskId, nodeId);
+          const title = event.data.title ?? nodeId;
+          useExecutionStore.getState().initExecution(taskId, nodeId, title);
           useExecutionStore.getState().setWatching(taskId);
           break;
         }
@@ -2509,7 +3265,7 @@ function useSSEStream(client) {
 }
 
 // src/tui/hooks/use-fuzzy-search.ts
-import { useEffect as useEffect4, useCallback as useCallback3 } from "react";
+import { useEffect as useEffect6, useCallback as useCallback3 } from "react";
 import Fuse from "fuse.js";
 var fuseInstance = null;
 function useFuzzySearch() {
@@ -2517,7 +3273,7 @@ function useFuzzySearch() {
   const nodes = usePlanStore((s) => s.nodes);
   const machines = useMachinesStore((s) => s.machines);
   const { setItems, setResults, query } = useSearchStore();
-  useEffect4(() => {
+  useEffect6(() => {
     const items = [
       ...projects.map((p) => ({
         type: "project",
@@ -2556,7 +3312,7 @@ function useFuzzySearch() {
     const results = fuseInstance.search(q, { limit: 20 });
     setResults(results.map((r) => r.item));
   }, [setResults]);
-  useEffect4(() => {
+  useEffect6(() => {
     search(query);
   }, [query, search]);
   return { search };
@@ -2606,6 +3362,19 @@ for (const key of Object.keys(handlers)) {
   trie.insert(key);
 }
 async function executeCommand(input, client) {
+  const colonIdx = input.indexOf(":");
+  if (colonIdx > 0) {
+    const prefix = input.slice(0, colonIdx);
+    const value = input.slice(colonIdx + 1);
+    if (handlers[prefix]) {
+      try {
+        await handlers[prefix]([value], client);
+      } catch (err) {
+        useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
+      }
+      return;
+    }
+  }
   const parts = input.split(/\s+/);
   if (parts.length >= 2) {
     const twoWord = `${parts[0]} ${parts[1]}`;
@@ -2653,18 +3422,28 @@ function useCommandParser(client) {
 }
 
 // src/tui/app.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function App({ serverUrl }) {
-  const client = useMemo(() => new AstroClient({ serverUrl }), [serverUrl]);
+  const client = useMemo2(() => new AstroClient({ serverUrl }), [serverUrl]);
   const { refreshAll: refreshAll2 } = usePolling(client);
-  useSSEStream(client);
+  useSSEStream(client, refreshAll2);
   useFuzzySearch();
+  const machines = useMachinesStore((s) => s.machines);
+  useEffect7(() => {
+    const settings = useSessionSettingsStore.getState();
+    if (settings.machineId) return;
+    const localPlatform = process.platform;
+    const m = machines.find((m2) => m2.isConnected && m2.platform === localPlatform) ?? machines.find((m2) => m2.isConnected);
+    if (m) {
+      settings.init(m.id, m.name, process.cwd());
+    }
+  }, [machines]);
   const { execute } = useCommandParser(client);
   const onSelect = useCallback5(() => {
     const { focusedPanel, scrollIndex } = useTuiStore.getState();
     switch (focusedPanel) {
       case "projects": {
-        const projects = useProjectsStore.getState().projects;
+        const projects = getVisibleProjects(useProjectsStore.getState().projects);
         const idx = scrollIndex.projects;
         if (projects[idx]) {
           useTuiStore.getState().setSelectedProject(projects[idx].id);
@@ -2725,70 +3504,32 @@ function App({ serverUrl }) {
     refreshAll2();
   }, [refreshAll2]);
   const onSessionMessage = useCallback5(async (message) => {
-    const { selectedProjectId, activeView } = useTuiStore.getState();
-    if (!selectedProjectId) {
-      useTuiStore.getState().setLastError("No project selected");
-      return;
-    }
+    const { selectedProjectId, activeView, selectedNodeId } = useTuiStore.getState();
     const watchingId = useExecutionStore.getState().watchingId;
-    const sessionId = useChatStore.getState().sessionId;
-    const messages = useChatStore.getState().messages.map((m) => ({
-      role: m.role,
-      content: m.content
-    }));
     if (!watchingId) {
-      if (activeView === "plan-gen") {
+      if (activeView === "playground") {
+        await execute(`playground ${message}`);
+      } else if (activeView === "plan-gen") {
+        if (!selectedProjectId) {
+          useTuiStore.getState().setLastError("No project selected for plan generation");
+          return;
+        }
         await execute(`plan generate ${message}`);
       } else {
         await execute(`playground ${message}`);
       }
       return;
     }
-    try {
-      useChatStore.getState().setStreaming(true);
-      const response = await client.projectChat({
-        message,
-        sessionId: sessionId ?? void 0,
-        projectId: selectedProjectId,
-        messages
-      });
-      if (!response.body) {
-        useChatStore.getState().setStreaming(false);
-        return;
-      }
-      const reader = response.body.getReader();
-      const decoder = new TextDecoder();
-      let buffer = "";
-      while (true) {
-        const { done, value } = await reader.read();
-        if (done) break;
-        buffer += decoder.decode(value, { stream: true });
-        const lines = buffer.split("\n");
-        buffer = lines.pop() ?? "";
-        for (const line of lines) {
-          if (!line.startsWith("data: ")) continue;
-          const data = line.slice(6);
-          if (data === "[DONE]") continue;
-          try {
-            const event = JSON.parse(data);
-            if (event.type === "text" && event.text) {
-              useChatStore.getState().appendStream(event.text);
-              useExecutionStore.getState().appendText(watchingId, event.text);
-            } else if (event.type === "session_init" && event.sessionId) {
-              useChatStore.getState().setSessionId(event.sessionId);
-            } else if (event.type === "done") {
-            }
-          } catch {
-          }
-        }
-      }
-      useChatStore.getState().flushStream();
-      useChatStore.getState().setStreaming(false);
-    } catch (err) {
-      useChatStore.getState().setStreaming(false);
-      useTuiStore.getState().setLastError(err instanceof Error ? err.message : String(err));
+    if (!selectedProjectId) {
+      useTuiStore.getState().setLastError("No project selected");
+      return;
+    }
+    if (selectedNodeId) {
+      await execute(`task chat ${message}`);
+    } else {
+      await execute(`project chat ${message}`);
     }
-  }, [client, execute]);
+  }, [execute]);
   useVimMode({
     onSelect,
     onCommand,
@@ -2797,13 +3538,13 @@ function App({ serverUrl }) {
     onCancel,
     onRefresh
   });
-  return /* @__PURE__ */ jsx15(MainLayout, { onSessionMessage });
+  return /* @__PURE__ */ jsx16(MainLayout, { onSessionMessage });
 }
 
 // src/tui/index.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 async function launchTui(serverUrl) {
-  render(/* @__PURE__ */ jsx16(App, { serverUrl }), {
+  render(/* @__PURE__ */ jsx17(App, { serverUrl }), {
     exitOnCtrlC: true
   });
 }