kafox-cli 0.6.0 → 0.8.0

package/src/tui.js

@@ -23,6 +23,7 @@ const { logoLines, LOGO_WIDTH, LOGO_HEIGHT } = require("./logo");
 const { diffBlocks } = require("./diff");
 const { toolMeta, parseCommandOutput } = require("./tools");
 const { McpHub } = require("./mcp");
+const sessions = require("./sessions");
 
 const ANSI = /\x1b\[[0-9;]*m/g;
 const stripAnsi = (value) => String(value).replace(ANSI, "");
@@ -508,6 +509,9 @@ function initialState() {
     scroll: 0,
     pageSize: 10,
     mouse: true,
+    retry: null,
+    sessionId: null,
+    sessionStartedAt: null,
     model: cfg.model || null,
     theme: cfg.theme || "default",
     suspended: false,
@@ -851,7 +855,7 @@ function messageLines(state, width) {
 
   if (state.busy && !streaming?.text) {
     lines.push("");
-    lines.push(indent(2) + chalk.dim("pensando" + ".".repeat(state.frame % 4)));
+    lines.push(indent(2) + chalk.dim("trabalhando" + ".".repeat(state.frame % 4)));
   }
   return lines;
 }
@@ -962,6 +966,23 @@ function queueLines(state, width) {
   return rows;
 }
 
+function modelLine(state, width) {
+  const model = state.model || "auto";
+  // O aviso do momento tem prioridade sobre a versao: com nome de modelo longo
+  // a linha trunca e a mensagem util precisa aparecer primeiro.
+  let label = `${model} · kafox v${state.version}`;
+  if (state.escArmed) {
+    label = `${model} · Esc de novo para parar`;
+  } else if (state.retry) {
+    const left = Math.max(1, Math.ceil(((state.retry.endsAt || 0) - Date.now()) / 1000));
+    label = `${model} · reconectando em ${left}s (tentativa ${state.retry.attempt}/${state.retry.maxAttempts})`;
+  }
+  return paintPanel(
+    state.theme,
+    padRight(indent(2) + chalk.dim(truncate(label, width - 2)), width)
+  );
+}
+
 function inputBlock(state, width, { hero = false, tight = false } = {}) {
   const available = width - 4;
   const start =
@@ -975,36 +996,23 @@ function inputBlock(state, width, { hero = false, tight = false } = {}) {
   if (state.input) {
     body = prompt + shown;
   } else {
-    const placeholder = hero
-      ? "Pergunte alguma coisa... ex: \"explica esse repo\""
-      : "Pergunte alguma coisa...";
+    // Enquanto a IA trabalha os pontinhos correm; parada, a caixa fica limpa.
+    const placeholder = state.busy ? `trabalhando${".".repeat(state.frame % 4)}` : "";
     body = prompt + chalk.dim(truncate(placeholder, available));
   }
 
-  const lines = [rule(state, width), paintPanel(state.theme, padRight(body, width))];
-  let cursorRow = 1;
-
-  if (!tight) {
-    const model = state.model || "auto";
-    const status = state.escArmed
-      ? "  Esc de novo para parar a IA"
-      : state.busy
-        ? `  pensando${".".repeat(state.frame % 4)}  ·  Esc 2× para parar`
-        : state.autoApprove
-          ? "  rodando tudo"
-          : "";
-    // Com o Esc armado a versao sai de cena: o aviso precisa caber na linha.
-    const label = state.escArmed
-      ? `${model}${status}`
-      : `${model} · kafox v${state.version}${status}`;
-    lines.push(paintPanel(state.theme, padRight(indent(2) + chalk.dim(truncate(label, width - 2)), width)));
-    lines.push(rule(state, width));
-  }
+  const lines = [
+    rule(state, width),
+    paintPanel(state.theme, padRight(body, width)),
+    rule(state, width),
+  ];
 
   return {
     lines,
-    cursorRow,
+    cursorRow: 1,
     cursorCol: 4 + (state.cursor - start),
+    // O modelo fica fora da caixa de texto, logo abaixo dela.
+    footer: tight ? null : modelLine(state, width),
   };
 }
 
@@ -1132,13 +1140,20 @@ function buildOverlay(state, cols, rows) {
   } else if (state.picker) {
     const picker = state.picker;
     const themePicker = picker.kind === "theme";
-    title = themePicker ? `Tema  (${picker.index + 1}/${picker.items.length})` : "Escolha o modelo";
-    hint = "↑/↓ ou clique  ·  Enter aplica  ·  Esc cancela";
+    const chatPicker = picker.kind === "chat";
+    title = themePicker
+      ? `Tema  (${picker.index + 1}/${picker.items.length})`
+      : chatPicker
+        ? `Conversas  (${picker.index + 1}/${picker.items.length})`
+        : "Escolha o modelo";
+    hint = chatPicker
+      ? "↑/↓ ou clique  ·  Enter retoma  ·  Esc cancela"
+      : "↑/↓ ou clique  ·  Enter aplica  ·  Esc cancela";
 
     if (picker.loading) {
       body = [chalk.dim("carregando modelos...")];
     } else {
-      const height = Math.min(themePicker ? 9 : 8, picker.items.length);
+      const height = Math.min(chatPicker ? 10 : themePicker ? 9 : 8, picker.items.length);
       const start = clamp(
         picker.index - Math.floor(height / 2),
         0,
@@ -1152,10 +1167,18 @@ function buildOverlay(state, cols, rows) {
         let line;
         if (themePicker) {
           line = padRight(` ${caret} ${padRight(item.id, 15)} ` + themeSwatch(item.id), width - 4);
+        } else if (chatPicker) {
+          // Formato do seletor: "titulo do chat - 28/10", com o codigo do
+          // resume discreto na direita para quem quiser copiar.
+          const right = chalk.dim(item.id);
+          const space = width - 6;
+          const room = Math.max(12, space - visible(right) - 12);
+          const when = sessions.dayMonth(item.updatedAt);
+          const left = ` ${caret} ${truncate(item.title || item.id, room)}${when ? ` - ${when}` : ""}`;
+          const gap = Math.max(1, space - visible(left) - visible(right));
+          line = padRight(left + " ".repeat(gap) + right, width - 4);
         } else {
-          const price = `${(item.input / 1_000_000).toFixed(2)} / ${(item.output / 1_000_000).toFixed(2)} R$`;
-          const label = padRight(` ${caret} ${item.id}`, Math.max(20, width - 28));
-          line = padRight(label + price, width - 4);
+          line = padRight(` ${caret} ${item.id} `, width - 4);
         }
         body.push(real === picker.index ? chalk.inverse(line) : line);
       }
@@ -1231,7 +1254,14 @@ function buildFrame(state, cols, rows, commands = {}) {
   const input = inputBlock(state, inner, { hero, tight });
   const status = statusLines(state, inner, { bare });
   const hints = hintsLines(state, inner, { bare });
-  const chrome = [...queue, ...menu, ...input.lines, ...status, ...hints];
+  const chrome = [
+    ...queue,
+    ...menu,
+    ...input.lines,
+    ...(input.footer ? [input.footer] : []),
+    ...status,
+    ...hints,
+  ];
 
   const head = hero ? heroLines(state, inner, rows - chrome.length) : [];
 
@@ -1297,15 +1327,45 @@ async function runTUI({
   onCommand,
   interactiveCommands = new Set(),
   autoApprove = false,
+  resume = null,
 } = {}) {
   const stdin = process.stdin;
   const stdout = process.stdout;
   const state = initialState();
+
+  // resume: "pick" abre o seletor de conversas, "last" pega a mais recente e
+  // qualquer outro valor e o codigo do chat que o usuario fechou no Ctrl+C.
+  let resumeMissing = null;
+  let resumePick = false;
+  if (resume) {
+    if (resume === "pick") {
+      resumePick = true;
+    } else {
+      const id = resume === "last" || resume === true ? sessions.latest()?.id : String(resume);
+      const saved = resume === "last" || resume === true ? sessions.load(id) : sessions.find(id);
+      if (saved) {
+        state.sessionId = saved.id;
+        state.sessionStartedAt = saved.startedAt;
+        state.messages = Array.isArray(saved.messages) ? saved.messages : [];
+        state.context = Array.isArray(saved.context) ? saved.context : [];
+        if (saved.model) state.model = saved.model;
+        if (saved.theme) state.theme = saved.theme;
+        state.tokens = estimateTokens(state);
+      } else {
+        resumeMissing = String(id || resume);
+      }
+    }
+  }
+  if (!state.sessionId) {
+    state.sessionId = sessions.newId();
+    state.sessionStartedAt = new Date().toISOString();
+  }
   // `kafox --allow-all` (ou KAFOX_ALLOW_ALL=1) ja comeca sem pedir aprovacao.
   state.autoApprove = Boolean(autoApprove) || process.env.KAFOX_ALLOW_ALL === "1";
   let mcp = new McpHub({ cwd: process.cwd() });
   let spinner = null;
   let escTimer = null;
+  let saveTimer = null;
   let closed = false;
   let previousLines = [];
 
@@ -1365,6 +1425,34 @@ async function runTUI({
     render();
   }
 
+  /** Grava a conversa em ~/.kafox/chats para o --resume achar depois. */
+  function persist() {
+    if (!state.sessionId || closed) return;
+    if (saveTimer) clearTimeout(saveTimer);
+    saveTimer = setTimeout(() => {
+      saveTimer = null;
+      saveNow();
+    }, 400);
+    saveTimer.unref?.();
+  }
+
+  function saveNow() {
+    if (!state.sessionId) return null;
+    try {
+      return sessions.save({
+        id: state.sessionId,
+        cwd: process.cwd(),
+        model: state.model,
+        theme: state.theme,
+        messages: state.messages,
+        context: state.context,
+        startedAt: state.sessionStartedAt,
+      });
+    } catch {
+      return null;
+    }
+  }
+
   function render() {
     if (closed || state.suspended) return;
     const cols = Math.max(30, stdout.columns || 80);
@@ -1406,11 +1494,7 @@ async function runTUI({
     const pricing = await fetchApi("/api/public/pricing")
       .then((res) => res.json())
       .catch(() => null);
-    state.models = (pricing?.pricing || []).map((row) => ({
-      id: row.model,
-      input: row.input_micros_per_1m,
-      output: row.output_micros_per_1m,
-    }));
+    state.models = (pricing?.pricing || []).map((row) => ({ id: row.model }));
     return state.models;
   }
 
@@ -1449,6 +1533,41 @@ async function runTUI({
     render();
   }
 
+  /** Modal com as conversas salvas (setas/mouse + Enter), igual ao de modelos. */
+  function openChatPicker() {
+    const items = sessions.list();
+    if (!items.length) {
+      state.modal = {
+        title: "Conversas",
+        text: `Nenhuma conversa salva ainda.\nFicam em ${sessions.chatsDir()}.`,
+      };
+      return render();
+    }
+    state.menuDismissed = true;
+    state.picker = { kind: "chat", items, index: 0, loading: false };
+    render();
+  }
+
+  /** Troca a sessao atual pela conversa escolhida no seletor. */
+  function resumeChat(id) {
+    const saved = sessions.find(id);
+    state.picker = null;
+    if (!saved) {
+      state.modal = { title: "Resume", text: "Nao consegui abrir essa conversa." };
+      return render();
+    }
+    state.sessionId = saved.id;
+    state.sessionStartedAt = saved.startedAt;
+    state.messages = Array.isArray(saved.messages) ? saved.messages : [];
+    state.context = Array.isArray(saved.context) ? saved.context : [];
+    if (saved.model) state.model = saved.model;
+    if (saved.theme) state.theme = saved.theme;
+    state.files = [];
+    state.tokens = estimateTokens(state);
+    state.scroll = 0;
+    return render();
+  }
+
   async function openModelPicker() {
     state.menuDismissed = true;
     state.picker = { kind: "model", items: state.models, index: 0, loading: true };
@@ -1525,7 +1644,8 @@ async function runTUI({
     const name = parts[0];
     if (name === "/exit" || name === "/quit") return quit();
 
-    if (name === "/model" && !parts[1]) return openModelPicker();
+    // /models e /model sem argumento abrem o mesmo seletor navegavel.
+    if ((name === "/model" || name === "/models") && !parts[1]) return openModelPicker();
     if (name === "/theme") return openThemePicker();
     if (name === "/allow") {
       const argument = (parts[1] || "on").toLowerCase();
@@ -1665,15 +1785,17 @@ async function runTUI({
           state.streaming.reasoning += chunk;
           scheduleRender();
         },
-        onToolStart: ({ name, args, label, change, fromMcp }) => {
+        onToolStart: ({ id, name, args, label, change, fromMcp, subagent }) => {
           finishStreaming();
           state.messages.push({
             role: "tool",
             tool: {
+              id,
               name,
               args,
               label,
               change,
+              subagent,
               meta: toolMeta(name, fromMcp ? mcp : null),
               status: "running",
               startedAt: Date.now(),
@@ -1682,10 +1804,34 @@ async function runTUI({
           state.scroll = 0;
           render();
         },
-        onToolResult: ({ name, output, change, ok, skipped, summary, ms }) => {
+        onRetry: (info) => {
+          state.retry = { ...info, endsAt: Date.now() + info.delay };
+          scheduleRender();
+        },
+        onSubagentEvent: (event) => {
+          const card = [...state.messages].reverse().find((message) => {
+            if (message.role !== "tool" || !message.tool?.id) return false;
+            return message.tool.id === event.id;
+          });
+          if (!card) return;
+          const prefix = `subagente ${event.index}/${event.total}`;
+          if (event.phase === "start") card.tool.summary = `${prefix}: ${event.objective}`;
+          else if (event.phase === "tool") card.tool.summary = `${prefix}: ${event.tool} · ${event.text || ""}`;
+          else if (event.phase === "tool-done") card.tool.summary = `${prefix}: ${event.tool} ${event.ok ? "ok" : "falhou"}`;
+          else if (event.phase === "done")
+            card.tool.summary = `${prefix} ${event.ok ? "concluído" : "falhou"} em ${event.ms}ms`;
+          state.scroll = 0;
+          scheduleRender();
+        },
+        onToolResult: ({ id, name, output, change, ok, skipped, summary, ms }) => {
           const card = [...state.messages]
             .reverse()
-            .find((message) => message.role === "tool" && message.tool?.name === name && message.tool.status === "running");
+            .find(
+              (message) =>
+                message.role === "tool" &&
+                message.tool.status === "running" &&
+                (id ? message.tool.id === id : message.tool.name === name)
+            );
           if (card) {
             card.tool.status = "done";
             card.tool.ok = ok;
@@ -1742,8 +1888,10 @@ async function runTUI({
         error: true,
       });
     }
+    state.retry = null;
     state.tokens = estimateTokens(state);
     state.scroll = 0;
+    persist();
     render();
   }
 
@@ -1873,12 +2021,12 @@ async function runTUI({
     if (!state.picker) return;
     const index = overlay.hit.start + offset;
     if (!state.picker.items[index]) return;
-    state.picker.index = index;
-
-    if (state.picker.kind === "theme") {
+    state.picker.index = index;    if (state.picker.kind === "theme") {
       previewTheme(index);
       return applyTheme();
     }
+    if (state.picker.kind === "chat") return resumeChat(state.picker.items[index]?.id);
+
     return selectModel();
   }
 
@@ -1970,7 +2118,11 @@ async function runTUI({
         if (themePicker) previewTheme(picker.index);
         return render();
       }
-      if (key.name === "return") return themePicker ? applyTheme() : selectModel();
+      if (key.name === "return") {
+        if (themePicker) return applyTheme();
+        if (picker.kind === "chat") return resumeChat(picker.items[picker.index]?.id);
+        return selectModel();
+      }
       if (key.name === "escape") {
         if (themePicker) return cancelTheme();
         state.picker = null;
@@ -2077,14 +2229,27 @@ async function runTUI({
     if (spinner) clearInterval(spinner);
     if (renderTimer) clearTimeout(renderTimer);
     if (escTimer) clearTimeout(escTimer);
+    if (saveTimer) clearTimeout(saveTimer);
     stdin.removeListener("data", onData);
     stdout.removeListener("resize", onResize);
     try {
       stdin.setRawMode(false);
     } catch {}
+    // Fechou no meio da conversa: guarda e mostra como voltar para ela.
+    const hasChat = state.messages.some(
+      (message) => message.role === "user" || message.role === "assistant"
+    );
+    if (hasChat) saveNow();
     mcp.close();
     leaveScreen();
     write("\n");
+    if (hasChat) {
+      write(
+        `${chalk.cyan("  Retome esta conversa:")} ${chalk.bold(
+          `kafox --resume ${state.sessionId}`
+        )}\n\n`
+      );
+    }
     process.exit(0);
   }
 
@@ -2103,7 +2268,14 @@ async function runTUI({
   stdout.on("resize", onResize);
 
   await refreshAccount();
+  if (resumeMissing) {
+    state.modal = {
+      title: "Resume",
+      text: `Nao achei a conversa "${resumeMissing}".\nVeja as salvas em ${sessions.chatsDir()}.`,
+    };
+  }
   render();
+  if (resumePick) openChatPicker();
   connectMcp().catch(() => {});
 
   spinner = setInterval(() => {