@sofer_agent/cli 0.3.18 → 0.3.20

package/src/tui.tsx

@@ -1,247 +0,0 @@
-import { render, useKeyboard, useTerminalDimensions } from "@opentui/solid";
-import type { SoferAgent, SoferConfig } from "@sofer_agent/core";
-import { For, createEffect, createSignal, onCleanup } from "solid-js";
-
-const SPINNER_FRAMES = ["⠋","⠙","⠹","⠸","⠼","⠴","⠦","⠧","⠇","⠏"] as const;
-const SPINNER_MS = 80;
-
-export interface TuiState {
-  rows: ReturnType<typeof createSignal<ChatLine[]>>;
-  status: ReturnType<typeof createSignal<"idle" | "thinking">>;
-  input: ReturnType<typeof createSignal<string>>;
-  info: ReturnType<typeof createSignal<TuiInfo>>;
-  spinnerFrame: ReturnType<typeof createSignal<number>>;
-  turnStartedAt: ReturnType<typeof createSignal<number | null>>;
-  activeAbort: ReturnType<typeof createSignal<AbortController | null>>;
-}
-
-export interface ChatLine {
-  role: "you" | "agent" | "system" | "error";
-  text: string;
-}
-
-export interface TuiInfo {
-  lastTurnIn: number;
-  lastTurnOut: number;
-  balance?: string;
-}
-
-function formatElapsed(startedAt: number | null): string {
-  if (!startedAt) return "";
-  const sec = Math.floor((Date.now() - startedAt) / 1000);
-  if (sec < 60) return `${sec}s`;
-  const m = Math.floor(sec / 60);
-  return `${m}m${String(sec % 60).padStart(2, "0")}s`;
-}
-
-function shortModel(model: string): string {
-  const m = model.toLowerCase();
-  if (m.includes("sonnet")) return "sonnet-4";
-  if (m.includes("haiku")) return "haiku";
-  if (m.includes("opus")) return "opus-4";
-  return model.length > 14 ? `${model.slice(0, 13)}…` : model;
-}
-
-function App(props: {
-  state: TuiState;
-  agent: SoferAgent;
-  config: SoferConfig;
-  onSubmit: (line: string, signal: AbortSignal) => Promise<void>;
-  onExit: () => void;
-}) {
-  const { state, agent, config } = props;
-  const dims = useTerminalDimensions();
-
-  const [rows] = state.rows;
-  const [status] = state.status;
-  const [input, setInput] = state.input;
-  const [info] = state.info;
-  const [spinnerFrame, setSpinnerFrame] = state.spinnerFrame;
-  const [turnStartedAt] = state.turnStartedAt;
-  const [, setActiveAbort] = state.activeAbort;
-  const [activeAbort] = state.activeAbort;
-
-  createEffect(() => {
-    if (status() !== "thinking") { setSpinnerFrame(0); return; }
-    const id = setInterval(
-      () => setSpinnerFrame((f) => (f + 1) % SPINNER_FRAMES.length),
-      SPINNER_MS,
-    );
-    onCleanup(() => clearInterval(id));
-  });
-
-  useKeyboard((evt) => {
-    if (evt.ctrl && evt.name === "c") { evt.preventDefault(); props.onExit(); return; }
-
-    if (evt.name === "escape") {
-      const ab = activeAbort();
-      if (ab && !ab.signal.aborted) ab.abort();
-      return;
-    }
-
-    if (status() === "thinking") return;
-
-    if (evt.name === "return") {
-      const text = input().trim();
-      if (!text) return;
-      if (text === "/exit" || text === "/quit") { props.onExit(); return; }
-      const ctrl = new AbortController();
-      setActiveAbort(ctrl);
-      state.rows[1](prev => [...prev, { role: "you", text }]);
-      setInput("");
-      state.status[1]("thinking");
-      state.turnStartedAt[1](Date.now());
-      props.onSubmit(text, ctrl.signal).finally(() => {
-        state.status[1]("idle");
-        state.turnStartedAt[1](null);
-        setActiveAbort(null);
-      });
-      return;
-    }
-
-    if (evt.name === "backspace" || evt.name === "delete") {
-      setInput((p) => p.slice(0, -1));
-      return;
-    }
-
-    if (evt.sequence && !evt.ctrl && !evt.meta && !evt.option) {
-      setInput((p) => p + evt.sequence);
-    }
-  });
-
-  const sidebarW = Math.min(30, Math.floor(dims().width * 0.22));
-  const chatW = dims().width - sidebarW;
-  const addr = () => `${agent.address.slice(0, 6)}…${agent.address.slice(-4)}`;
-
-  return (
-    <box flexDirection="row" width={dims().width} height={dims().height}>
-      {/* Chat area */}
-      <box flexDirection="column" width={chatW} height={dims().height}>
-        <scrollbox
-          flexGrow={1}
-          flexShrink={1}
-          stickyScroll
-          stickyStart="bottom"
-          contentOptions={{ flexDirection: "column", paddingLeft: 1, paddingRight: 1, paddingTop: 1, paddingBottom: 1 }}
-        >
-          <For each={rows()}>
-            {(line) => {
-              const color = line.role === "you" ? "#67e8f9"
-                : line.role === "agent" ? "#86efac"
-                : line.role === "error" ? "#fca5a5"
-                : "#9ca3af";
-              const label = line.role === "you" ? "you"
-                : line.role === "agent" ? agent.name.toLowerCase().slice(0, 5)
-                : line.role === "error" ? "err"
-                : "sys";
-              return (
-                <box flexDirection="row">
-                  <text fg={color} flexShrink={0}>{`  ${label.padEnd(5)}  `}</text>
-                  <text wrapMode="word" flexGrow={1} fg="#e5e7eb">
-                    {line.text}
-                  </text>
-                </box>
-              );
-            }}
-          </For>
-        </scrollbox>
-
-        <box flexDirection="row" flexShrink={0} paddingLeft={3} paddingRight={2} marginTop={1}>
-          <text fg="#67e8f9" flexGrow={1}>
-            {(() => {
-              if (status() !== "thinking") return " ";
-              const frame = SPINNER_FRAMES[spinnerFrame()];
-              const elapsed = formatElapsed(turnStartedAt());
-              return elapsed
-                ? `${frame} thinking… ${elapsed} (esc to interrupt)`
-                : `${frame} thinking… (esc to interrupt)`;
-            })()}
-          </text>
-        </box>
-
-        <box
-          flexDirection="row"
-          flexShrink={0}
-          minHeight={3}
-          maxHeight={8}
-          borderStyle="rounded"
-          borderColor="#374151"
-          paddingLeft={1} paddingRight={1}
-          marginLeft={2} marginRight={2}
-        >
-          <text fg="#67e8f9" flexShrink={0}>{"› "}</text>
-          <text wrapMode="word" flexGrow={1} fg="#e5e7eb">
-            {`${input()}${status() === "idle" ? "▋" : ""}`}
-          </text>
-        </box>
-
-        <box flexDirection="row" flexShrink={0} paddingLeft={2} paddingRight={2}>
-          <text fg="#9ca3af">
-            {[
-              addr(),
-              config.network,
-              shortModel(config.brain.model),
-              info().balance ? `${info().balance} SUI` : null,
-              `in ${agent.usage.tokens.inputTokens} out ${agent.usage.tokens.outputTokens} $${agent.usage.costUsd.toFixed(4)}`,
-              "/exit",
-            ].filter(Boolean).join("  ·  ")}
-          </text>
-        </box>
-      </box>
-
-      {/* Sidebar */}
-      <box
-        flexDirection="column"
-        width={sidebarW}
-        borderStyle="single"
-        borderColor="#374151"
-        paddingLeft={2} paddingRight={1}
-      >
-        <text fg="#86efac">{agent.name}</text>
-        <text fg="#9ca3af">{addr()}</text>
-        <text>{" "}</text>
-        <text fg="#6b7280">{"─".repeat(sidebarW - 4)}</text>
-        <text fg="#9ca3af">{`network  ${config.network}`}</text>
-        <text fg="#9ca3af">{`model    ${shortModel(config.brain.model)}`}</text>
-        {info().balance ? <text fg="#fbbf24">{`balance  ${info().balance} SUI`}</text> : null}
-        <text>{" "}</text>
-        <text fg="#6b7280">{"─".repeat(sidebarW - 4)}</text>
-        <text fg="#9ca3af">{`last  in ${info().lastTurnIn}  out ${info().lastTurnOut}`}</text>
-        <text fg="#9ca3af">{`total in ${agent.usage.tokens.inputTokens}`}</text>
-        <text fg="#9ca3af">{`      out ${agent.usage.tokens.outputTokens}`}</text>
-        <text fg="#fbbf24">{`      $${agent.usage.costUsd.toFixed(6)}`}</text>
-      </box>
-    </box>
-  );
-}
-
-export function createTuiState(): TuiState {
-  return {
-    rows: createSignal<ChatLine[]>([]),
-    status: createSignal<"idle" | "thinking">("idle"),
-    input: createSignal(""),
-    info: createSignal<TuiInfo>({ lastTurnIn: 0, lastTurnOut: 0 }),
-    spinnerFrame: createSignal(0),
-    turnStartedAt: createSignal<number | null>(null),
-    activeAbort: createSignal<AbortController | null>(null),
-  };
-}
-
-export async function runTui(
-  state: TuiState,
-  agent: SoferAgent,
-  config: SoferConfig,
-  onSubmit: (line: string, signal: AbortSignal) => Promise<void>,
-): Promise<void> {
-  return new Promise<void>((resolve) => {
-    render(() => (
-      <App
-        state={state}
-        agent={agent}
-        config={config}
-        onSubmit={onSubmit}
-        onExit={resolve}
-      />
-    ));
-  });
-}