u-foo 2.3.31 → 2.4.0

package/src/app/chat/multiWindow/index.js

@@ -0,0 +1,268 @@
+const { calculatePaneLayout } = require("./paneLayout");
+const { createPaneManager } = require("./paneManager");
+const { createRenderer } = require("./renderer");
+
+function createMultiWindowController(options = {}) {
+  const {
+    processStdout = process.stdout,
+    getRows = () => process.stdout.rows || 24,
+    getCols = () => process.stdout.columns || 80,
+    getInjectSockPath = () => "",
+    getActiveAgents = () => [],
+    getAgentPaneOptions = () => ({}),
+    getChatLogLines = () => [],
+    getStatusText = () => "",
+    getPromptPrefix = () => "› ",
+    getCurrentDraft = () => "",
+    getCursorPos = () => 0,
+    getCompletions = () => ({ items: [], index: -1, windowStart: 0, pageSize: 8 }),
+    getAgentLabel = (id) => id,
+    getInternalPaneInfo = () => ({}),
+    getDashboardLines = () => [],
+    getTerminalFocused = () => false,
+    freezeScreen = () => {},
+    restoreTerminal = () => {},
+    onExit = () => {},
+    onFocusAgent = () => {},
+    onInternalSubmit = () => {},
+  } = options;
+
+  let active = false;
+  let renderThrottleTimer = null;
+  let dirtyPanes = new Set();
+  let lastCompletionPopup = null;
+  const renderer = createRenderer({ write: (d) => processStdout.write(d) });
+  const paneManager = createPaneManager({
+    getInjectSockPath,
+    onInternalSubmit,
+    onPaneOutput: (agentId) => {
+      if (!active) return;
+      if (getTerminalFocused()) {
+        renderSinglePane(agentId);
+      } else {
+        dirtyPanes.add(agentId);
+        if (!renderThrottleTimer) {
+          renderThrottleTimer = setTimeout(() => {
+            renderThrottleTimer = null;
+            const panes = [...dirtyPanes];
+            dirtyPanes.clear();
+            for (const id of panes) renderSinglePane(id);
+          }, 200);
+        }
+      }
+    },
+  });
+
+  function enter() {
+    const agents = getActiveAgents();
+    if (agents.length === 0) return false;
+    if (active) return false;
+    active = true;
+    freezeScreen(true);
+    renderer.hideCursor();
+    renderer.clear();
+    syncAgents();
+    renderAll();
+    return true;
+  }
+
+  function exit() {
+    if (!active) return;
+    active = false;
+    if (renderThrottleTimer) {
+      clearTimeout(renderThrottleTimer);
+      renderThrottleTimer = null;
+      dirtyPanes.clear();
+    }
+    paneManager.disconnectAll();
+    renderer.showCursor();
+    restoreTerminal();
+    freezeScreen(false);
+    onExit();
+  }
+
+  function syncAgents() {
+    const agents = getActiveAgents();
+    const current = new Set(paneManager.getAgentIds());
+    const layout = calculatePaneLayout(getCols(), getRows(), agents.length);
+
+    for (let i = 0; i < agents.length; i++) {
+      const id = agents[i];
+      const pane = layout.agentPanes[i];
+      if (!pane) continue;
+      const innerW = Math.max(1, pane.width - 2);
+      const innerH = Math.max(1, pane.height - 2);
+      if (!current.has(id)) {
+        paneManager.addAgent(id, innerW, innerH, getAgentPaneOptions(id) || {});
+      } else {
+        paneManager.sendResize(id, innerW, innerH);
+      }
+    }
+    for (const id of current) {
+      if (!agents.includes(id)) {
+        paneManager.removeAgent(id);
+      }
+    }
+  }
+
+  function renderSinglePane(agentId) {
+    if (!active) return;
+    try {
+      const agents = paneManager.getAgentIds();
+      const layout = calculatePaneLayout(getCols(), getRows(), agents.length);
+      const idx = agents.indexOf(agentId);
+      if (idx < 0 || !layout.agentPanes[idx]) return;
+      const pane = paneManager.getPane(agentId);
+      if (!pane) return;
+      const isFocused = getTerminalFocused() && agentId === paneManager.getFocused();
+      if (pane.mode === "internal" && typeof renderer.renderInternalPane === "function") {
+        renderer.renderInternalPane(pane.vt, layout.agentPanes[idx], isFocused, {
+          label: getAgentLabel(agentId),
+          ...(getInternalPaneInfo(agentId) || {}),
+          input: pane.internalInput || "",
+          cursor: pane.internalCursor || 0,
+        });
+      } else {
+        renderer.renderPane(pane.vt, layout.agentPanes[idx], isFocused, getAgentLabel(agentId));
+      }
+    } catch {
+      // swallow render errors to prevent crash
+    }
+  }
+
+  function renderAll() {
+    if (!active) return;
+    try {
+      const agents = paneManager.getAgentIds();
+      const layout = calculatePaneLayout(getCols(), getRows(), agents.length);
+      const cols = getCols();
+
+      renderer.renderChatLog(layout.chatPane, getChatLogLines());
+
+      const focused = getTerminalFocused() ? paneManager.getFocused() : null;
+      for (let i = 0; i < agents.length; i++) {
+        const pane = paneManager.getPane(agents[i]);
+        if (!pane || !layout.agentPanes[i]) continue;
+        if (pane.mode === "internal" && typeof renderer.renderInternalPane === "function") {
+          renderer.renderInternalPane(pane.vt, layout.agentPanes[i], agents[i] === focused, {
+            label: getAgentLabel(agents[i]),
+            ...(getInternalPaneInfo(agents[i]) || {}),
+            input: pane.internalInput || "",
+            cursor: pane.internalCursor || 0,
+          });
+        } else {
+          renderer.renderPane(pane.vt, layout.agentPanes[i], agents[i] === focused, getAgentLabel(agents[i]));
+        }
+      }
+
+      const chatFocused = !getTerminalFocused();
+      if (layout.separatorPane) {
+        renderer.renderSeparator(layout.separatorPane, chatFocused);
+      }
+      if (layout.statusPane) {
+        renderer.renderStatusLine(layout.statusPane, getStatusText());
+      }
+      if (layout.inputPane) {
+        renderer.renderInputPrompt(layout.inputPane, getPromptPrefix(), getCurrentDraft(), getCursorPos());
+      }
+      if (layout.inputSepPane) {
+        renderer.renderSeparator(layout.inputSepPane, chatFocused);
+      }
+      if (layout.dashboardPane) {
+        const lines = getDashboardLines();
+        renderer.renderDashboard(layout.dashboardPane, lines);
+      }
+
+      const cmp = getCompletions();
+      let nextCompletionPopup = null;
+      if (lastCompletionPopup && typeof renderer.clearRows === "function") {
+        renderer.clearRows(
+          lastCompletionPopup.top,
+          lastCompletionPopup.height,
+          lastCompletionPopup.width,
+          lastCompletionPopup.left || 0
+        );
+      }
+      if (cmp && Array.isArray(cmp.items) && cmp.items.length > 0 && layout.inputPane) {
+        const start = Math.min(cmp.windowStart || 0, Math.max(0, cmp.items.length - (cmp.pageSize || 8)));
+        const end = Math.min(cmp.items.length, start + (cmp.pageSize || 8));
+        const visible = cmp.items.slice(start, end);
+        const popupTop = layout.inputPane.top - visible.length - 1;
+        if (popupTop >= 0) {
+          nextCompletionPopup = { top: popupTop, left: 0, width: cols, height: visible.length + 1 };
+          renderer.renderSeparator({ top: popupTop, left: 0, width: cols });
+          for (let i = 0; i < visible.length; i++) {
+            const idx = start + i;
+            const selected = idx === cmp.index;
+            const label = visible[i].label || "";
+            const desc = visible[i].description || "";
+            const line = selected
+              ? `\x1b[7;36m${label}\x1b[0m  \x1b[90m${desc}\x1b[0m`
+              : `\x1b[90m${label}  ${desc}\x1b[0m`;
+            const pad = Math.max(0, cols - renderer.visibleLength(line));
+            renderer.write(renderer.moveTo(popupTop + 1 + i, 0) + line + " ".repeat(pad) + "\x1b[0m");
+          }
+        }
+      }
+      lastCompletionPopup = nextCompletionPopup;
+    } catch {
+      // swallow render errors to prevent crash
+    }
+  }
+
+  function handleKey(key) {
+    if (!active) return false;
+
+    if (key.name === "c" && key.ctrl) {
+      return false;
+    }
+
+    if (key.name === "w" && key.ctrl) {
+      paneManager.cycleFocus();
+      renderAll();
+      return true;
+    }
+
+    if (key.name === "q" && key.ctrl) {
+      exit();
+      return true;
+    }
+
+    return false;
+  }
+
+  function focusAgent(agentId) {
+    if (!active) return;
+    const agents = paneManager.getAgentIds();
+    if (!agents.includes(agentId)) return;
+    paneManager.setFocused(agentId);
+    onFocusAgent(agentId);
+    renderAll();
+  }
+
+  function handleResize() {
+    if (!active) return;
+    syncAgents();
+    renderer.clear();
+    renderAll();
+  }
+
+  function isActive() { return active; }
+
+  return {
+    enter,
+    exit,
+    isActive,
+    handleKey,
+    handleResize,
+    syncAgents,
+    renderAll,
+    focusAgent,
+    sendInput: (data) => paneManager.sendInput(data),
+    writeToPane: (agentId, data) => paneManager.writeToPane(agentId, data),
+    getFocused: () => paneManager.getFocused(),
+    getAgentIds: () => paneManager.getAgentIds(),
+  };
+}
+
+module.exports = { createMultiWindowController };

package/src/app/chat/multiWindow/paneLayout.js

@@ -0,0 +1,84 @@
+function calculatePaneLayout(termCols, termRows, agentCount) {
+  const bottomRows = 5;
+  const safeRows = termRows - 1;
+  const contentHeight = Math.max(1, safeRows - bottomRows);
+  const bottomTop = contentHeight;
+
+  const statusPane = { top: bottomTop, left: 0, width: termCols };
+  const separatorPane = { top: bottomTop + 1, left: 0, width: termCols };
+  const inputPane = { top: bottomTop + 2, left: 0, width: termCols };
+  const inputSepPane = { top: bottomTop + 3, left: 0, width: termCols };
+  const dashboardPane = { top: bottomTop + 4, left: 0, width: termCols };
+
+  if (agentCount <= 0) {
+    return {
+      separatorPane,
+      statusPane,
+      inputPane,
+      inputSepPane,
+      dashboardPane,
+      chatPane: { top: 0, left: 0, width: termCols, height: contentHeight },
+      agentPanes: [],
+    };
+  }
+
+  const chatWidth = Math.floor(termCols / 3);
+  const rightLeft = chatWidth + 1;
+  const rightWidth = termCols - chatWidth - 1;
+
+  const chatPane = { top: 0, left: 0, width: chatWidth, height: contentHeight };
+
+  if (rightWidth < 4 || contentHeight < 3) {
+    return {
+      separatorPane,
+      statusPane,
+      inputPane,
+      inputSepPane,
+      dashboardPane,
+      chatPane: { top: 0, left: 0, width: termCols, height: contentHeight },
+      agentPanes: [],
+    };
+  }
+
+  const agentPanes = layoutAgentPanes(rightLeft, rightWidth, contentHeight, agentCount, 0);
+  return { separatorPane, statusPane, inputPane, inputSepPane, dashboardPane, chatPane, agentPanes };
+}
+
+function layoutAgentPanes(left, width, height, count, topOffset = 0) {
+  if (count === 1) {
+    return [{ top: topOffset, left, width, height }];
+  }
+  if (count === 2) {
+    const h1 = Math.floor(height / 2);
+    return [
+      { top: topOffset, left, width, height: h1 },
+      { top: topOffset + h1, left, width, height: height - h1 },
+    ];
+  }
+
+  const rowCount = Math.ceil(count / 2);
+  const rowHeight = Math.floor(height / rowCount);
+  const panes = [];
+  let placed = 0;
+
+  for (let row = 0; row < rowCount; row++) {
+    const rowTop = topOffset + row * rowHeight;
+    const actualHeight = row === rowCount - 1 ? height - row * rowHeight : rowHeight;
+    const remaining = count - placed;
+    const isOddRow = remaining % 2 === 1 && row === 0 && count % 2 === 1;
+
+    if (isOddRow) {
+      panes.push({ top: rowTop, left, width, height: actualHeight });
+      placed++;
+    } else {
+      const halfWidth = Math.floor(width / 2);
+      panes.push({ top: rowTop, left, width: halfWidth, height: actualHeight });
+      panes.push({ top: rowTop, left: left + halfWidth + 1, width: width - halfWidth - 1, height: actualHeight });
+      placed += 2;
+    }
+  }
+
+  return panes;
+}
+
+module.exports = { calculatePaneLayout };

package/src/app/chat/multiWindow/paneManager.js

@@ -0,0 +1,299 @@
+const fs = require("fs");
+const net = require("net");
+const { PTY_SOCKET_MESSAGE_TYPES, PTY_SOCKET_SUBSCRIBE_MODES } = require("../../../runtime/contracts/ptySocketContract");
+const { createVirtualTerminal } = require("./virtualTerminal");
+
+function createPaneManager(options = {}) {
+  const {
+    getInjectSockPath = () => "",
+    onPaneOutput = () => {},
+    onInternalSubmit = () => {},
+  } = options;
+
+  const panes = new Map();
+  let focusedAgent = null;
+
+  function addAgent(agentId, cols, rows, options = {}) {
+    if (panes.has(agentId)) return;
+    const vt = createVirtualTerminal(cols, rows);
+    const mode = options.mode === "internal" ? "internal" : "socket";
+    const pane = {
+      agentId,
+      mode,
+      vt,
+      outputClient: null,
+      inputClient: null,
+      buffer: "",
+      internalInput: "",
+      internalCursor: 0,
+    };
+    panes.set(agentId, pane);
+    if (mode === "internal") {
+      const initialOutput = Array.isArray(options.initialLines)
+        ? options.initialLines.join("\r\n")
+        : String(options.initialOutput || "");
+      if (initialOutput) pane.vt.write(`${initialOutput}\r\n`);
+      onPaneOutput(pane.agentId);
+    } else {
+      connectOutput(pane);
+    }
+    if (!focusedAgent) focusedAgent = agentId;
+  }
+
+  function removeAgent(agentId) {
+    const pane = panes.get(agentId);
+    if (!pane) return;
+    disconnect(pane);
+    panes.delete(agentId);
+    if (focusedAgent === agentId) {
+      const keys = [...panes.keys()];
+      focusedAgent = keys.length > 0 ? keys[0] : null;
+    }
+  }
+
+  function connectOutput(pane) {
+    const sockPath = getInjectSockPath(pane.agentId);
+    if (!sockPath || !fs.existsSync(sockPath)) {
+      pane.vt.write("\x1b[33m[waiting]\x1b[0m inject.sock not found\r\n");
+      onPaneOutput(pane.agentId);
+      return;
+    }
+
+    try {
+      const client = net.createConnection(sockPath, () => {
+        const { cols, rows } = pane.vt.getScreen();
+        client.write(JSON.stringify({
+          type: PTY_SOCKET_MESSAGE_TYPES.RESIZE,
+          cols,
+          rows,
+        }) + "\n");
+        client.write(JSON.stringify({
+          type: PTY_SOCKET_MESSAGE_TYPES.SUBSCRIBE,
+          mode: PTY_SOCKET_SUBSCRIBE_MODES.FULL,
+        }) + "\n");
+      });
+
+      client.on("data", (data) => {
+        pane.buffer += data.toString("utf8");
+        const lines = pane.buffer.split("\n");
+        pane.buffer = lines.pop() || "";
+        for (const line of lines) {
+          if (!line.trim()) continue;
+          try {
+            const msg = JSON.parse(line);
+            if (msg.type === PTY_SOCKET_MESSAGE_TYPES.OUTPUT) {
+              if (msg.data) {
+                pane.vt.write(msg.data);
+                onPaneOutput(pane.agentId);
+              }
+            } else if (msg.type === PTY_SOCKET_MESSAGE_TYPES.REPLAY) {
+              if (msg.data) {
+                pane.vt.write(msg.data);
+                onPaneOutput(pane.agentId);
+              }
+            } else if (msg.type === PTY_SOCKET_MESSAGE_TYPES.SNAPSHOT) {
+              if (msg.data) {
+                pane.vt.write(msg.data);
+                onPaneOutput(pane.agentId);
+              }
+            }
+          } catch {
+            // ignore malformed messages or render errors
+          }
+        }
+      });
+
+      client.on("error", (err) => {
+        pane.outputClient = null;
+        pane.vt.write(`\r\n\x1b[31m[connection error]\x1b[0m ${err && err.message ? err.message : "socket error"}\r\n`);
+        onPaneOutput(pane.agentId);
+      });
+      client.on("close", () => {
+        pane.outputClient = null;
+        pane.vt.write("\r\n\x1b[33m[disconnected]\x1b[0m\r\n");
+        onPaneOutput(pane.agentId);
+      });
+      pane.outputClient = client;
+    } catch (err) {
+      pane.vt.write(`\x1b[31m[connection error]\x1b[0m ${err && err.message ? err.message : "connection failed"}\r\n`);
+      onPaneOutput(pane.agentId);
+    }
+  }
+
+  function disconnect(pane) {
+    if (pane.outputClient) {
+      try {
+        pane.outputClient.removeAllListeners();
+        pane.outputClient.destroy();
+      } catch {}
+      pane.outputClient = null;
+    }
+    if (pane.inputClient) {
+      try {
+        pane.inputClient.removeAllListeners();
+        pane.inputClient.destroy();
+      } catch {}
+      pane.inputClient = null;
+    }
+  }
+
+  function sendInput(data) {
+    if (!focusedAgent) return;
+    const pane = panes.get(focusedAgent);
+    if (!pane) return;
+    if (pane.mode === "internal") {
+      handleInternalInput(pane, data);
+      return;
+    }
+    const sockPath = getInjectSockPath(pane.agentId);
+    if (!sockPath) return;
+
+    if (!pane.inputClient || pane.inputClient.destroyed) {
+      try {
+        const client = net.createConnection(sockPath);
+        pane.inputClient = client;
+        client.on("error", () => { pane.inputClient = null; });
+        client.on("close", () => { pane.inputClient = null; });
+        client.once("connect", () => {
+          try {
+            client.write(JSON.stringify({
+              type: PTY_SOCKET_MESSAGE_TYPES.RAW,
+              data,
+            }) + "\n");
+          } catch {}
+        });
+      } catch { return; }
+      return;
+    }
+
+    try {
+      pane.inputClient.write(JSON.stringify({
+        type: PTY_SOCKET_MESSAGE_TYPES.RAW,
+        data,
+      }) + "\n");
+    } catch {
+      pane.inputClient = null;
+    }
+  }
+
+  function previousInputBoundary(text = "", cursor = 0) {
+    const source = String(text || "");
+    const target = Math.max(0, Math.min(source.length, cursor));
+    let previous = 0;
+    for (const char of Array.from(source)) {
+      const next = previous + char.length;
+      if (next >= target) break;
+      previous = next;
+    }
+    return previous;
+  }
+
+  function handleInternalInput(pane, data) {
+    const raw = String(data || "");
+    if (!raw) return;
+    if (raw === "\r" || raw === "\n") {
+      const message = String(pane.internalInput || "").trim();
+      pane.internalInput = "";
+      pane.internalCursor = 0;
+      if (message) {
+        pane.vt.write(`\r\n> ${message.replace(/\r?\n/g, "\r\n  ")}\r\n`);
+        try { onInternalSubmit(pane.agentId, message); } catch {}
+      }
+      onPaneOutput(pane.agentId);
+      return;
+    }
+    if (raw === "\x7f" || raw === "\b" || raw === "\x08") {
+      if (pane.internalCursor > 0) {
+        const start = previousInputBoundary(pane.internalInput, pane.internalCursor);
+        pane.internalInput = pane.internalInput.slice(0, start) + pane.internalInput.slice(pane.internalCursor);
+        pane.internalCursor = start;
+        onPaneOutput(pane.agentId);
+      }
+      return;
+    }
+    if (raw === "\x1b[D") {
+      pane.internalCursor = previousInputBoundary(pane.internalInput, pane.internalCursor);
+      onPaneOutput(pane.agentId);
+      return;
+    }
+    if (raw === "\x1b[C") {
+      const tail = pane.internalInput.slice(pane.internalCursor);
+      const nextChar = Array.from(tail)[0] || "";
+      pane.internalCursor = Math.min(pane.internalInput.length, pane.internalCursor + nextChar.length);
+      onPaneOutput(pane.agentId);
+      return;
+    }
+    if (raw === "\x1b[A" || raw === "\x1b[B" || raw === "\t" || raw === "\x1b") return;
+
+    const clean = raw.replace(/\r\n/g, "\n").replace(/\r/g, "\n").replace(/[\x00-\x08\x0b-\x0c\x0e-\x1f\x7f]/g, "");
+    if (!clean) return;
+    pane.internalInput = pane.internalInput.slice(0, pane.internalCursor) + clean + pane.internalInput.slice(pane.internalCursor);
+    pane.internalCursor += clean.length;
+    onPaneOutput(pane.agentId);
+  }
+
+  function sendResize(agentId, cols, rows) {
+    const pane = panes.get(agentId);
+    if (!pane) return;
+    pane.vt.resize(cols, rows);
+    if (pane.mode === "internal") return;
+    const sockPath = getInjectSockPath(pane.agentId);
+    if ((!pane.outputClient || pane.outputClient.destroyed) && sockPath && fs.existsSync(sockPath)) {
+      connectOutput(pane);
+      return;
+    }
+    if (pane.outputClient && !pane.outputClient.destroyed) {
+      try {
+        pane.outputClient.write(JSON.stringify({
+          type: PTY_SOCKET_MESSAGE_TYPES.RESIZE,
+          cols,
+          rows,
+        }) + "\n");
+      } catch {}
+    }
+  }
+
+  function cycleFocus() {
+    const keys = [...panes.keys()];
+    if (keys.length === 0) return;
+    const idx = keys.indexOf(focusedAgent);
+    focusedAgent = keys[(idx + 1) % keys.length];
+    return focusedAgent;
+  }
+
+  function getFocused() { return focusedAgent; }
+  function setFocused(agentId) { if (panes.has(agentId)) focusedAgent = agentId; }
+  function getPane(agentId) { return panes.get(agentId) || null; }
+  function getAllPanes() { return [...panes.values()]; }
+  function getAgentIds() { return [...panes.keys()]; }
+  function writeToPane(agentId, data) {
+    const pane = panes.get(agentId);
+    if (!pane) return false;
+    pane.vt.write(data);
+    onPaneOutput(pane.agentId);
+    return true;
+  }
+
+  function disconnectAll() {
+    for (const pane of panes.values()) disconnect(pane);
+    panes.clear();
+    focusedAgent = null;
+  }
+
+  return {
+    addAgent,
+    removeAgent,
+    sendInput,
+    sendResize,
+    cycleFocus,
+    getFocused,
+    setFocused,
+    getPane,
+    getAllPanes,
+    getAgentIds,
+    writeToPane,
+    disconnectAll,
+  };
+}
+
+module.exports = { createPaneManager };