kafox-cli 0.10.0 → 0.10.2

package/src/tui.js

@@ -16,7 +16,7 @@ const os = require("os");
 const path = require("path");
 const chalk = require("chalk");
 const storage = require("./storage");
-const { estimateTokens: countContextTokens, compactIfNeeded } = require("./compact");
+const { estimateTokens: countContextTokens, compactIfNeeded, trimHistory } = require("./compact");
 const { ensureSession, fetchApi } = require("./auth");
 const { runAgent } = require("./agent");
 const { THEMES, themeColors, paintLine, paintPanel, borderColor } = require("./theme");
@@ -316,8 +316,26 @@ function tableLines(header, aligns = [], body = [], width = 80, theme = "default
   return lines;
 }
 
-/** Converte Markdown simples em linhas prontas para o terminal. */
+// Cache do markdown renderizado por {texto, largura, tema}. Sem isso, cada
+// frame (inclusive a cada tecla) reparseava o markdown de TODAS as mensagens
+// da conversa, o que domina o tempo de render em chats longos.
+const MARKDOWN_CACHE = new Map();
+const MARKDOWN_CACHE_MAX = 400;
+/** Converte Markdown simples em linhas prontas para o terminal (com cache). */
 function markdownLines(text, width, theme = "default") {
+  const key = `${width}\u0000${theme}\u0000${text}`;
+  const hit = MARKDOWN_CACHE.get(key);
+  if (hit) return hit;
+  const out = markdownLinesUncached(text, width, theme);
+  if (MARKDOWN_CACHE.size >= MARKDOWN_CACHE_MAX) {
+    // Despeja o mais antigo (ordem de insercao do Map).
+    MARKDOWN_CACHE.delete(MARKDOWN_CACHE.keys().next().value);
+  }
+  MARKDOWN_CACHE.set(key, out);
+  return out;
+}
+
+function markdownLinesUncached(text, width, theme = "default") {
   const accent = accentFor(theme);
   const out = [];
   const rows = String(text).replace(/\r/g, "").split("\n");
@@ -481,6 +499,8 @@ const CONTROL_KEYS = {
   12: { name: "l", ctrl: true },
   13: { name: "return" },
   21: { name: "u", ctrl: true },
+  // Ctrl+R: atualiza saldo da conta e dos provedores externos agora.
+  18: { name: "r", ctrl: true },
   // Ctrl+Q: desiste das mensagens que estao na fila (nao cancela a atual).
   17: { name: "q", ctrl: true },
   23: { name: "w", ctrl: true },
@@ -684,6 +704,7 @@ function initialState() {
     modal: null,
     models: [],
     balance: null,
+    providerBalances: [],
     tokens: 0,
     files: [],
     mcp: { loading: false, statuses: [], tools: 0 },
@@ -754,6 +775,8 @@ function heroLines(state, width, available) {
           " envia   " +
           chalk.dim("/") +
           " menu   " +
+          chalk.dim("ctrl+r") +
+          " saldo   " +
           chalk.dim("ctrl+c") +
           " sai",
         width
@@ -1082,40 +1105,81 @@ function compactionLines(message, width, state) {
   return lines;
 }
 
-function messageLines(state, width) {
+/**
+ * Virtualizacao de mensagens.
+ *
+ * Sem isso, cada frame (inclusive a cada tecla) reconstruia linha a linha TODO
+ * o historico da conversa; em chats longos isso domina o tempo de render e
+ * trava a digitacao. Aqui cada mensagem tem suas linhas memorizadas (chaveadas
+ * por texto/largura/tema + o estado que muda o desenho) e so as mensagens que
+ * caem no viewport sao realmente remontadas.
+ */
+const MESSAGE_CACHE = new Map();
+const MESSAGE_CACHE_MAX = 600;
+
+/** Chave de cache de uma mensagem: tudo que muda o desenho dela. */
+function messageCacheKey(message, width, state) {
+  const streaming = state.streaming;
+  const extra =
+    message.role === "tool"
+      ? `${message.status || ""}\u0001${message.duration || ""}\u0001${state.toolCompact ? 1 : 0}`
+      : message.role === "thinking"
+        ? `${message.done ? 1 : 0}`
+        : "";
+  return `${width}\u0000${state.theme}\u0000${message.role}\u0000${extra}\u0000${message.text}`;
+}
+
+/** Linhas de UMA mensagem (com cache). */
+function messageBlock(message, width, state) {
+  const key = messageCacheKey(message, width, state);
+  const hit = MESSAGE_CACHE.get(key);
+  if (hit) return hit;
+  const out = messageBlockUncached(message, width, state);
+  if (MESSAGE_CACHE.size >= MESSAGE_CACHE_MAX) {
+    MESSAGE_CACHE.delete(MESSAGE_CACHE.keys().next().value);
+  }
+  MESSAGE_CACHE.set(key, out);
+  return out;
+}
+
+function messageBlockUncached(message, width, state) {
   const lines = [];
-  for (const message of state.messages) {
-    if (message.role === "user") {
-      lines.push("");
-      const body = wrap(message.text, width - 2);
-      lines.push(indent(2) + chalk.cyan("▌ ") + chalk.bold(body[0] || ""));
-      for (let index = 1; index < body.length; index += 1) {
-        lines.push(indent(4) + chalk.bold(body[index]));
-      }
-    } else if (message.role === "compaction") {
-      lines.push(...compactionLines(message, width, state));
-    } else if (message.role === "assistant") {
-      lines.push("");
-      lines.push(...markdownLines(message.text, width - 2, state.theme));
-      // Só latência: a rota usada por trás é da Kafox, não do cliente.
-      const meta = [];
-      if (message.interrupted) meta.push("interrompido");
-      if (message.ms) meta.push(`${(message.ms / 1000).toFixed(1)}s`);
-      if (meta.length) lines.push("");
-      if (meta.length) lines.push(indent(2) + chalk.dim(meta.join(" · ")));
-    } else if (message.role === "thinking") {
-      lines.push(...thinkingLines(message, width));
-    } else if (message.role === "tool") {
-      lines.push(...toolCardLines(message, width, state));
-    } else {
-      lines.push("");
-      const color = message.error ? chalk.red : message.interrupted ? chalk.yellow : chalk.dim;
-      const mark = message.interrupted ? "⏹" : "!";
-      for (const line of wrap(message.text, width - 4)) lines.push(color(indent(2) + mark + " " + line));
-    }
+  if (message.role === "user") {
+    lines.push("");
+    const body = wrap(message.text, width - 2);
+    lines.push(indent(2) + chalk.cyan("▌ ") + chalk.bold(body[0] || ""));
+    for (let index = 1; index < body.length; index += 1) {
+      lines.push(indent(4) + chalk.bold(body[index]));
+    }
+  } else if (message.role === "compaction") {
+    lines.push(...compactionLines(message, width, state));
+  } else if (message.role === "assistant") {
+    lines.push("");
+    lines.push(...markdownLines(message.text, width - 2, state.theme));
+    const meta = [];
+    if (message.interrupted) meta.push("interrompido");
+    if (message.ms) meta.push(`${(message.ms / 1000).toFixed(1)}s`);
+    if (meta.length) lines.push("");
+    if (meta.length) lines.push(indent(2) + chalk.dim(meta.join(" · ")));
+  } else if (message.role === "thinking") {
+    lines.push(...thinkingLines(message, width));
+  } else if (message.role === "tool") {
+    lines.push(...toolCardLines(message, width, state));
+  } else {
+    lines.push("");
+    const color = message.error ? chalk.red : message.interrupted ? chalk.yellow : chalk.dim;
+    const mark = message.interrupted ? "⏹" : "!";
+    for (const line of wrap(message.text, width - 4)) lines.push(color(indent(2) + mark + " " + line));
   }
+  return lines;
+}
 
-  // Resposta chegando token a token (e o "thinking" do modelo, se houver).
+/**
+ * "Cauda" da conversa: bloco de streaming, indicador de "trabalhando" etc.
+ * Fica separado do historico porque muda a cada token e nao vale cachear.
+ */
+function messageTailLines(state, width) {
+  const lines = [];
   const streaming = state.streaming;
   if (streaming && (streaming.reasoning || streaming.text)) {
     if (streaming.reasoning) {
@@ -1134,7 +1198,6 @@ function messageLines(state, width) {
       lines.push(...markdownLines(streaming.text, width - 2, state.theme));
     }
   }
-
   if (state.busy && !streaming?.text) {
     lines.push("");
     lines.push(indent(2) + chalk.dim("trabalhando" + ".".repeat(state.frame % 4)));
@@ -1142,6 +1205,47 @@ function messageLines(state, width) {
   return lines;
 }
 
+/**
+ * Monta o corpo da conversa gastando o minimo: processa mensagens de tras pra
+ * frente ate cobrir o viewport pedido (ou ate acabar o historico). Fora do
+ * viewport nem tocamos no markdown. Devolve o array ja "padded" no topo para
+ * preencher a altura do terminal.
+ */
+function messageLines(state, width, budget = Infinity) {
+  const need = budget === Infinity ? Infinity : Math.max(0, budget);
+  const blocks = [];
+  let total = 0;
+
+  const tail = messageTailLines(state, width);
+  if (tail.length) {
+    blocks.push({ start: 0, lines: tail });
+    total += tail.length;
+  }
+
+  for (let index = state.messages.length - 1; index >= 0; index -= 1) {
+    const message = state.messages[index];
+    const lines = messageBlock(message, width, state);
+    blocks.push({ lines });
+    total += lines.length;
+    // Ja cobrimos o viewport (com uma folga para o padding do topo)? Paramos.
+    if (total >= need + 4) break;
+  }
+
+  const lines = [];
+  for (let index = blocks.length - 1; index >= 0; index -= 1) {
+    lines.push(...blocks[index].lines);
+  }
+  return lines;
+}
+
+function messageLinesFull(state, width) {
+  const lines = [];
+  for (const message of state.messages) lines.push(...messageBlock(message, width, state));
+  lines.push(...messageTailLines(state, width));
+  return lines;
+}
+
+
 function filteredCommands(state, commands) {
   if (state.menuDismissed) return [];
   if (!state.input.startsWith("/") || state.input.includes(" ")) return [];
@@ -1228,6 +1332,22 @@ function sidebarLines(state, width) {
   lines.push(chalk.dim(`${formatTokens(tokens)} tokens · ${messages} msg${messages === 1 ? "" : "s"}`));
   lines.push(chalk.dim(state.balance == null ? "saldo --" : `R$ ${(state.balance / 1_000_000).toFixed(2)}`));
 
+  // Saldo dos provedores externos (unlid etc.): so aparece quando o backend
+  // consegue ler. Moeda vem do provedor; "sem consulta" quando falha.
+  if (state.balanceLoading) lines.push(chalk.dim("atualizando…"));
+  for (const item of state.providerBalances || []) {
+    const label = truncate(item.label || item.id || "provider", Math.max(6, width - 12));
+    if (item.ok && item.balance != null) {
+      const money =
+        item.currency === "BRL"
+          ? `R$ ${Number(item.balance).toFixed(2)}`
+          : `${Number(item.balance).toFixed(2)} ${item.currency || "USD"}`;
+      lines.push(chalk.dim(`${label} `) + chalk.cyan(money));
+    } else {
+      lines.push(chalk.dim(`${label} `) + chalk.dim("--"));
+    }
+  }
+
   lines.push("");
   lines.push(border(state, "MCP"));
   if (state.mcp.loading) {
@@ -1408,6 +1528,29 @@ function box(state, { title, body, hint, width }) {
 
 function approvalBody(state, width) {
   const { name, args, change } = state.approval;
+
+  // Pedido de pareamento do celular: mesmo widget de opcoes, conteudo proprio.
+  if (name === "__pair__") {
+    const body = [];
+    const who = change?.device || "celular";
+    body.push(chalk.bold("Um celular quer entrar nesta conversa."));
+    body.push("");
+    if (change?.title) body.push(truncate("conversa: " + change.title, width - 4));
+    if (change?.base) body.push(chalk.dim(truncate(change.base, width - 4)));
+    body.push(chalk.dim(truncate("dispositivo: " + who, width - 4)));
+    body.push("");
+    const optionsStart = body.length;
+    const opts = state.approval.options || APPROVAL_OPTIONS;
+    for (const [index, option] of opts.entries()) {
+      const selected = index === state.approval.index;
+      const line = padRight(`${selected ? "▸ " : "  "}${option.label}`, width - 6);
+      if (selected) body.push(chalk.inverse(chalk.bold(line)));
+      else if (option.id === "deny") body.push(chalk.dim(line));
+      else body.push(line);
+    }
+    return { title: "Pareamento do celular", body, optionsStart };
+  }
+
   const meta = toolMeta(name);
   const body = [];
 
@@ -1613,7 +1756,7 @@ function buildFrame(state, cols, rows, commands = {}) {
   const bodyHeight = Math.max(0, rows - head.length - chrome.length);
   state.pageSize = Math.max(1, bodyHeight);
 
-  let body = hero ? [] : messageLines(state, inner);
+  let body = hero ? [] : messageLines(state, inner, bodyHeight + state.scroll);
   const maxScroll = Math.max(0, body.length - bodyHeight);
   state.scroll = clamp(state.scroll, 0, maxScroll);
   const end = body.length - state.scroll;
@@ -1732,19 +1875,35 @@ async function runTUI({
     renderTimer.unref?.();
   }
 
+  // Digitar/apagar dispara uma tecla por evento: render() sincrono a cada tecla
+  // reconstroi a conversa inteira e trava o input em chats longos. Este
+  // agendador curto (~60fps) mantem a resposta visual imediata e coalesce
+  // rajadas (segurar backspace/colar) num unico frame.
+  let inputTimer = null;
+  function scheduleInputRender() {
+    if (inputTimer || closed) return;
+    inputTimer = setTimeout(() => {
+      inputTimer = null;
+      render();
+    }, 16);
+    inputTimer.unref?.();
+  }
+
   const mouseMode = () => (state.mouse ? "\x1b[?1000h\x1b[?1006h" : "\x1b[?1000l\x1b[?1006l");
   const enterScreen = () =>
     write(`\x1b[?1049h\x1b[?25l\x1b[H\x1b[2J${mouseMode()}\x1b[?2004h`);
   const leaveScreen = () =>
     write("\x1b[?2004l\x1b[?1000l\x1b[?1006l\x1b[?25h\x1b[?1049l");
 
-  async function refreshAccount() {
+  async function refreshAccount({ fresh = false } = {}) {
     const token = await ensureSession();
     if (!token) return;
-    const response = await fetchApi("/api/bootstrap").catch(() => null);
+    const response = await fetchApi(`/api/bootstrap${fresh ? "?fresh=1" : ""}`).catch(() => null);
     if (!response || !response.ok) return;
     const data = await response.json().catch(() => null);
     if (data?.user) state.balance = data.user.balance_micros;
+    // Saldo (credits) dos provedores externos, ex.: unlid/uncensored.
+    state.providerBalances = Array.isArray(data?.provider_balances) ? data.provider_balances : [];
 
     if (!state.model) {
       const pricing = await fetchApi("/api/public/pricing")
@@ -1754,6 +1913,19 @@ async function runTUI({
     }
   }
 
+  /** Atalho/botão de atualizar: re-busca saldo da conta e dos provedores. */
+  async function refreshBalance() {
+    if (state.balanceLoading) return;
+    state.balanceLoading = true;
+    render();
+    try {
+      await refreshAccount({ fresh: true });
+    } finally {
+      state.balanceLoading = false;
+      render();
+    }
+  }
+
   function applyMcp() {
     state.mcp.statuses = mcp.statuses();
     state.mcp.tools = state.mcp.statuses.reduce((total, item) => total + item.tools, 0);
@@ -2420,14 +2592,14 @@ async function runTUI({
         text: "Interrompido por você (Esc).",
         interrupted: true,
       });
-      if (result.messages) state.context = result.messages;
+      if (result.messages) state.context = trimHistory(result.messages);
     } else if (result.ok) {
       const text = String(result.text || "").trim();
       // O stream ja foi commitado em finishStreaming(): so empurra aqui se for
       // texto novo (ou se nao houve streaming, ex.: resposta sem onText).
       if (text) commitFinalText(state, text, result.ms);
       state.streamedText = "";
-      if (result.messages) state.context = result.messages;
+      if (result.messages) state.context = trimHistory(result.messages);
       // Reconectou de verdade: limpa o alerta e os erros de rede pendentes.
       clearRetry();
     } else {
@@ -2510,10 +2682,15 @@ async function runTUI({
     const pending = state.approval;
     if (!pending) return;
     state.approval = null;
-    if (decision === "always") state.autoApprove = true;
-    if (decision === "always") persist();
+    // O pedido de pareamento NAO mexe no autoApprove de ferramentas: "lembrar"
+    // ali significa confiar naquele navegador, tratado por quem criou o pedido.
+    const isPair = pending.name === "__pair__";
+    if (decision === "always" && !isPair) state.autoApprove = true;
+    if (decision === "always" && !isPair) persist();
     render();
-    pending.resolve(decision !== "deny");
+    // Pareamento precisa do texto da decisao (once/always/deny); ferramentas
+    // so querem o booleano "aprovado?".
+    pending.resolve(isPair ? decision : decision !== "deny");
   }
 
   // Com captura de mouse ligada o terminal entrega a roda para a TUI, mas em
@@ -2589,11 +2766,12 @@ async function runTUI({
     state.cursor = cursor == null ? value.length : clamp(cursor, 0, value.length);
     state.menuIndex = 0;
     state.menuDismissed = false;
-    render();
+    scheduleInputRender();
   }
 
   function moveApproval(delta) {
-    const count = APPROVAL_OPTIONS.length;
+    const opts = state.approval.options || APPROVAL_OPTIONS;
+    const count = opts.length;
     state.approval.index = (state.approval.index + delta + count) % count;
     render();
   }
@@ -2610,10 +2788,11 @@ async function runTUI({
 
     // Aprovacao de ferramenta: navega e confirma.
     if (state.approval) {
+      const opts = state.approval.options || APPROVAL_OPTIONS;
       if (key.name === "up" || key.name === "down" || key.name === "tab") {
         return moveApproval(key.name === "up" ? -1 : 1);
       }
-      if (key.name === "return") return settleApproval(APPROVAL_OPTIONS[state.approval.index].id);
+      if (key.name === "return") return settleApproval(opts[state.approval.index].id);
       if (key.name === "escape") return settleApproval("deny");
       if (key.name === "a") return settleApproval("always");
       if (key.name === "y") return settleApproval("once");
@@ -2652,6 +2831,7 @@ async function runTUI({
 
     if (key.name === "f2") return toggleMouse();
     if (key.ctrl && key.name === "y") return copyLastAnswer();
+    if (key.ctrl && key.name === "r") return refreshBalance();
 
     // Modal de texto: qualquer tecla fecha — e se for texto, ele vai para o
     // input em vez de ser engolido (quem digita nao perde o que escreveu).