joonecli 0.1.1 → 0.2.0

package/src/ui/components/StatusBar.tsx

@@ -1,138 +0,0 @@
-import React from "react";
-import { Box, Text } from "ink";
-
-interface StatusBarProps {
-  /** Current tokens used in the context window (estimated). */
-  contextTokens?: number;
-  /** Maximum context window size for the model. */
-  maxContextTokens?: number;
-  /** Total tokens consumed across all LLM calls (prompt + completion). */
-  totalTokens?: number;
-  /** Cache hit rate (0–1). */
-  cacheHitRate?: number;
-  /** Elapsed session time. */
-  elapsed?: string;
-  /** Total tool calls executed. */
-  toolCalls?: number;
-  /** Number of LLM turns. */
-  turns?: number;
-  /** Estimated cost in USD. */
-  cost?: number;
-}
-
-/**
- * Renders a visual capacity bar for the context window.
- *
- * Example: ▓▓▓▓▓▓▓▓░░░░░░░  52%
- */
-function ContextBar({
-  used,
-  max,
-  width = 16,
-}: {
-  used: number;
-  max: number;
-  width?: number;
-}) {
-  const ratio = max > 0 ? Math.min(used / max, 1) : 0;
-  const filled = Math.round(ratio * width);
-  const empty = width - filled;
-  const pct = Math.round(ratio * 100);
-
-  // Color: green < 60%, yellow 60-80%, red > 80%
-  const barColor = ratio < 0.6 ? "green" : ratio < 0.8 ? "yellow" : "red";
-
-  return (
-    <Text>
-      <Text color={barColor}>{"▓".repeat(filled)}</Text>
-      <Text dimColor>{"░".repeat(empty)}</Text>
-      <Text> </Text>
-      <Text color={barColor}>{pct}%</Text>
-    </Text>
-  );
-}
-
-/**
- * Formats a token count for display (e.g., 3241 → "3.2K", 128000 → "128K").
- */
-function formatTokens(n: number): string {
-  if (n >= 1_000_000) return `${(n / 1_000_000).toFixed(1)}M`;
-  if (n >= 1_000) return `${(n / 1_000).toFixed(1)}K`;
-  return `${n}`;
-}
-
-export const StatusBar: React.FC<StatusBarProps> = ({
-  contextTokens = 0,
-  maxContextTokens = 200_000,
-  totalTokens = 0,
-  cacheHitRate,
-  elapsed = "0s",
-  toolCalls = 0,
-  turns = 0,
-  cost,
-}) => {
-  return (
-    <Box
-      flexDirection="column"
-      borderStyle="single"
-      borderColor="gray"
-      paddingX={1}
-    >
-      {/* Row 1: Context Window */}
-      <Box justifyContent="space-between">
-        <Box>
-          <Text dimColor>ctx </Text>
-          <ContextBar used={contextTokens} max={maxContextTokens} />
-          <Text dimColor>
-            {" "}
-            {formatTokens(contextTokens)}/{formatTokens(maxContextTokens)}
-          </Text>
-        </Box>
-        {cacheHitRate !== undefined && (
-          <Text>
-            <Text dimColor>cache </Text>
-            <Text
-              color={
-                cacheHitRate > 0.8
-                  ? "green"
-                  : cacheHitRate > 0.5
-                    ? "yellow"
-                    : "red"
-              }
-            >
-              {(cacheHitRate * 100).toFixed(0)}%
-            </Text>
-          </Text>
-        )}
-      </Box>
-
-      {/* Row 2: Session Metrics */}
-      <Box justifyContent="space-between">
-        <Text>
-          <Text dimColor>tokens </Text>
-          <Text color="white">{formatTokens(totalTokens)}</Text>
-        </Text>
-        <Text>
-          <Text dimColor>turns </Text>
-          <Text color="white">{turns}</Text>
-        </Text>
-        <Text>
-          <Text dimColor>tools </Text>
-          <Text color="white">{toolCalls}</Text>
-        </Text>
-        {cost !== undefined && cost > 0 && (
-          <Text>
-            <Text dimColor>cost </Text>
-            <Text color="white">
-              ${cost < 0.01 ? cost.toFixed(4) : cost.toFixed(2)}
-            </Text>
-          </Text>
-        )}
-        <Text>
-          <Text dimColor>elapsed </Text>
-          <Text color="white">{elapsed}</Text>
-        </Text>
-      </Box>
-    </Box>
-  );
-};

package/src/ui/components/StreamingText.tsx

@@ -1,48 +0,0 @@
-import React, { useState, useEffect } from "react";
-import { Text } from "ink";
-
-interface StreamingTextProps {
-  /** Array of tokens that have been received so far. */
-  tokens: string[];
-  /** Whether the stream is still active. */
-  isStreaming: boolean;
-}
-
-/**
- * StreamingText renders incoming tokens with a blinking cursor
- * while the stream is active. Once streaming stops, the cursor disappears.
- */
-export const StreamingText: React.FC<StreamingTextProps> = ({
-  tokens,
-  isStreaming,
-}) => {
-  const [cursorVisible, setCursorVisible] = useState(true);
-
-  useEffect(() => {
-    if (!isStreaming) {
-      setCursorVisible(false);
-      return;
-    }
-
-    setCursorVisible(true);
-
-    const interval = setInterval(() => {
-      setCursorVisible((v) => !v);
-    }, 500);
-
-    return () => clearInterval(interval);
-  }, [isStreaming]);
-
-  const fullText = tokens.join("");
-
-  return (
-    <Text>
-      <Text color="white">{fullText}</Text>
-      {isStreaming && (
-        <Text color="cyan" bold>
-          {cursorVisible ? "▊" : " "}
-        </Text>
-      )}
-    </Text>
-  );
-};

package/src/ui/components/ToolCallPanel.tsx

@@ -1,80 +0,0 @@
-import React from "react";
-import { Box, Text } from "ink";
-import Spinner from "ink-spinner";
-
-export type ToolCallStatus = "running" | "success" | "error";
-
-interface ToolCallPanelProps {
-  toolName: string;
-  args?: Record<string, unknown>;
-  status: ToolCallStatus;
-  result?: string;
-}
-
-/**
- * Styled panel that appears when the agent invokes a tool.
- * Shows the tool name, arguments, a spinner while executing,
- * and the result once complete.
- */
-export const ToolCallPanel: React.FC<ToolCallPanelProps> = ({
-  toolName,
-  args,
-  status,
-  result,
-}) => {
-  const borderColor =
-    status === "running" ? "yellow" : status === "success" ? "green" : "red";
-
-  const statusIcon =
-    status === "running" ? (
-      <Text color="yellow">
-        <Spinner type="dots" />
-      </Text>
-    ) : status === "success" ? (
-      <Text color="green">✓</Text>
-    ) : (
-      <Text color="red">✗</Text>
-    );
-
-  return (
-    <Box
-      flexDirection="column"
-      borderStyle="round"
-      borderColor={borderColor}
-      paddingX={1}
-      marginY={0}
-    >
-      <Box gap={1}>
-        {statusIcon}
-        <Text bold color={borderColor}>
-          {toolName}
-        </Text>
-      </Box>
-
-      {args && Object.keys(args).length > 0 && (
-        <Box marginLeft={2} flexDirection="column">
-          {Object.entries(args).map(([key, value]) => (
-            <Text key={key}>
-              <Text dimColor>{key}:</Text>{" "}
-              <Text color="white">
-                {typeof value === "string"
-                  ? value.length > 80
-                    ? value.slice(0, 77) + "..."
-                    : value
-                  : JSON.stringify(value)}
-              </Text>
-            </Text>
-          ))}
-        </Box>
-      )}
-
-      {result && (
-        <Box marginTop={0} marginLeft={2}>
-          <Text dimColor>
-            {result.length > 120 ? result.slice(0, 117) + "..." : result}
-          </Text>
-        </Box>
-      )}
-    </Box>
-  );
-};

package/tests/commands/commands.test.ts

@@ -1,356 +0,0 @@
-import { describe, it, expect, beforeEach } from "vitest";
-import {
-  CommandRegistry,
-  levenshteinDistance,
-} from "../../src/commands/commandRegistry.js";
-import {
-  createDefaultRegistry,
-  HelpCommand,
-  ModelCommand,
-  ClearCommand,
-  CompactCommand,
-  TokensCommand,
-  StatusCommand,
-  HistoryCommand,
-  UndoCommand,
-  ExitCommand,
-} from "../../src/commands/builtinCommands.js";
-import { CommandContext } from "../../src/commands/commandRegistry.js";
-import { HumanMessage, AIMessage, SystemMessage } from "@langchain/core/messages";
-
-// ─── Test Helpers ───────────────────────────────────────────────────────────────
-
-function makeContext(overrides: Partial<CommandContext> = {}): CommandContext {
-  return {
-    config: {
-      provider: "anthropic",
-      model: "claude-sonnet-4-20250514",
-      maxTokens: 4096,
-      temperature: 0,
-      streaming: true,
-    } as any,
-    configPath: "/tmp/test-config.json",
-    harness: {} as any,
-    contextState: {
-      globalSystemInstructions: "You are a test agent.",
-      projectMemory: "Test project.",
-      sessionContext: "Test session.",
-      conversationHistory: [],
-    },
-    setContextState: () => {},
-    addSystemMessage: () => {},
-    provider: "anthropic",
-    model: "claude-sonnet-4-20250514",
-    maxTokens: 4096,
-    ...overrides,
-  };
-}
-
-// ─── Levenshtein Distance ───────────────────────────────────────────────────────
-
-describe("levenshteinDistance", () => {
-  it("returns 0 for identical strings", () => {
-    expect(levenshteinDistance("model", "model")).toBe(0);
-  });
-
-  it("returns correct distance for single edit", () => {
-    expect(levenshteinDistance("model", "modle")).toBe(2); // transposition = 2 edits
-    expect(levenshteinDistance("help", "helo")).toBe(1);
-  });
-
-  it("handles empty strings", () => {
-    expect(levenshteinDistance("", "abc")).toBe(3);
-    expect(levenshteinDistance("abc", "")).toBe(3);
-  });
-});
-
-// ─── CommandRegistry ────────────────────────────────────────────────────────────
-
-describe("CommandRegistry", () => {
-  let registry: CommandRegistry;
-
-  beforeEach(() => {
-    registry = new CommandRegistry();
-  });
-
-  it("detects slash commands", () => {
-    expect(registry.isCommand("/help")).toBe(true);
-    expect(registry.isCommand("/model gpt-4")).toBe(true);
-    expect(registry.isCommand("  /tokens")).toBe(true);
-    expect(registry.isCommand("Hello world")).toBe(false);
-    expect(registry.isCommand("")).toBe(false);
-  });
-
-  it("registers and executes a command", async () => {
-    registry.register({
-      name: "ping",
-      description: "Test command",
-      execute: async () => "pong",
-    });
-
-    const result = await registry.execute("/ping", makeContext());
-    expect(result).toBe("pong");
-  });
-
-  it("resolves aliases to primary command", async () => {
-    registry.register({
-      name: "help",
-      aliases: ["h", "?"],
-      description: "Show help",
-      execute: async () => "help text",
-    });
-
-    expect(await registry.execute("/h", makeContext())).toBe("help text");
-    expect(await registry.execute("/?", makeContext())).toBe("help text");
-  });
-
-  it("returns error with suggestions for unknown commands", async () => {
-    registry.register({
-      name: "model",
-      description: "Switch model",
-      execute: async () => "ok",
-    });
-
-    const result = await registry.execute("/modle", makeContext());
-    expect(result).toContain("Unknown command");
-    expect(result).toContain("/model");
-  });
-
-  it("parses command args correctly", async () => {
-    let receivedArgs = "";
-    registry.register({
-      name: "echo",
-      description: "Echo args",
-      execute: async (args) => {
-        receivedArgs = args;
-        return args;
-      },
-    });
-
-    await registry.execute("/echo hello world", makeContext());
-    expect(receivedArgs).toBe("hello world");
-  });
-
-  it("handles commands with no args", async () => {
-    let receivedArgs = "";
-    registry.register({
-      name: "noargs",
-      description: "No args",
-      execute: async (args) => {
-        receivedArgs = args;
-        return "ok";
-      },
-    });
-
-    await registry.execute("/noargs", makeContext());
-    expect(receivedArgs).toBe("");
-  });
-
-  it("getHelp() returns formatted text", () => {
-    registry.register({
-      name: "foo",
-      aliases: ["f"],
-      description: "Do foo",
-      execute: async () => {},
-    });
-    registry.register({
-      name: "bar",
-      description: "Do bar",
-      execute: async () => {},
-    });
-
-    const help = registry.getHelp();
-    expect(help).toContain("/foo");
-    expect(help).toContain("/f");
-    expect(help).toContain("Do foo");
-    expect(help).toContain("/bar");
-  });
-
-  it("is case-insensitive for command names", async () => {
-    registry.register({
-      name: "help",
-      description: "Help",
-      execute: async () => "ok",
-    });
-
-    expect(await registry.execute("/HELP", makeContext())).toBe("ok");
-    expect(await registry.execute("/Help", makeContext())).toBe("ok");
-  });
-});
-
-// ─── Built-in Commands ──────────────────────────────────────────────────────────
-
-describe("Built-in Commands", () => {
-  describe("/help", () => {
-    it("returns help text with all commands listed", async () => {
-      const result = await HelpCommand.execute("", makeContext());
-      expect(result).toContain("/help");
-      expect(result).toContain("/model");
-      expect(result).toContain("/clear");
-      expect(result).toContain("/tokens");
-      expect(result).toContain("/exit");
-    });
-  });
-
-  describe("/model", () => {
-    it("shows current model when no args", async () => {
-      const result = await ModelCommand.execute("", makeContext());
-      expect(result).toContain("claude-sonnet-4-20250514");
-      expect(result).toContain("anthropic");
-    });
-
-    it("advises restart when model name provided", async () => {
-      const result = await ModelCommand.execute("gpt-4o", makeContext());
-      expect(result).toContain("gpt-4o");
-      expect(result).toContain("restart");
-    });
-  });
-
-  describe("/clear", () => {
-    it("clears conversation history", async () => {
-      let capturedState: any = null;
-      const ctx = makeContext({
-        contextState: {
-          globalSystemInstructions: "test",
-          projectMemory: "test",
-          sessionContext: "test",
-          conversationHistory: [
-            new HumanMessage("hello"),
-            new AIMessage("hi"),
-          ],
-        },
-        setContextState: (s) => { capturedState = s; },
-      });
-
-      const result = await ClearCommand.execute("", ctx);
-      expect(result).toContain("2 messages");
-      expect(capturedState.conversationHistory).toHaveLength(0);
-    });
-  });
-
-  describe("/tokens", () => {
-    it("shows token usage info", async () => {
-      const result = await TokensCommand.execute("", makeContext());
-      expect(result).toContain("Token Usage");
-      expect(result).toContain("System prompt");
-      expect(result).toContain("Conversation");
-    });
-  });
-
-  describe("/status", () => {
-    it("shows session status", async () => {
-      const result = await StatusCommand.execute("", makeContext());
-      expect(result).toContain("anthropic");
-      expect(result).toContain("claude-sonnet-4-20250514");
-      expect(result).toContain("Session Status");
-    });
-  });
-
-  describe("/history", () => {
-    it("returns empty message for no history", async () => {
-      const result = await HistoryCommand.execute("", makeContext());
-      expect(result).toContain("No conversation history");
-    });
-
-    it("shows messages when history exists", async () => {
-      const ctx = makeContext({
-        contextState: {
-          globalSystemInstructions: "",
-          projectMemory: "",
-          sessionContext: "",
-          conversationHistory: [
-            new HumanMessage("Hello"),
-            new AIMessage("Hi there!"),
-          ],
-        },
-      });
-
-      const result = await HistoryCommand.execute("", ctx);
-      expect(result).toContain("2 messages");
-      expect(result).toContain("Hello");
-      expect(result).toContain("Hi there!");
-    });
-  });
-
-  describe("/undo", () => {
-    it("removes last user+agent exchange", async () => {
-      let capturedState: any = null;
-      const ctx = makeContext({
-        contextState: {
-          globalSystemInstructions: "",
-          projectMemory: "",
-          sessionContext: "",
-          conversationHistory: [
-            new HumanMessage("First"),
-            new AIMessage("Response 1"),
-            new HumanMessage("Second"),
-            new AIMessage("Response 2"),
-          ],
-        },
-        setContextState: (s) => { capturedState = s; },
-      });
-
-      const result = await UndoCommand.execute("", ctx);
-      expect(result).toContain("2 message(s)");
-      expect(capturedState.conversationHistory).toHaveLength(2);
-    });
-
-    it("returns message for empty history", async () => {
-      const result = await UndoCommand.execute("", makeContext());
-      expect(result).toContain("Nothing to undo");
-    });
-  });
-
-  describe("/exit", () => {
-    it("returns __EXIT__ signal", async () => {
-      const result = await ExitCommand.execute("", makeContext());
-      expect(result).toBe("__EXIT__");
-    });
-  });
-
-  describe("/compact", () => {
-    it("rejects when history is too short", async () => {
-      const result = await CompactCommand.execute("", makeContext({
-        contextState: {
-          globalSystemInstructions: "",
-          projectMemory: "",
-          sessionContext: "",
-          conversationHistory: [new HumanMessage("hi")],
-        },
-      }));
-      expect(result).toContain("Not enough history");
-    });
-  });
-});
-
-// ─── Default Registry ───────────────────────────────────────────────────────────
-
-describe("createDefaultRegistry", () => {
-  it("creates a registry with all built-in commands", () => {
-    const registry = createDefaultRegistry();
-    const all = registry.getAll();
-
-    const names = all.map((c) => c.name);
-    expect(names).toContain("help");
-    expect(names).toContain("model");
-    expect(names).toContain("clear");
-    expect(names).toContain("compact");
-    expect(names).toContain("tokens");
-    expect(names).toContain("status");
-    expect(names).toContain("history");
-    expect(names).toContain("undo");
-    expect(names).toContain("exit");
-  });
-
-  it("resolves aliases correctly", async () => {
-    const registry = createDefaultRegistry();
-
-    // /h → /help
-    const result = await registry.execute("/h", makeContext());
-    expect(result).toContain("/help");
-
-    // /q → /exit
-    const exitResult = await registry.execute("/q", makeContext());
-    expect(exitResult).toBe("__EXIT__");
-  });
-});