oh-aicoding-tool 0.1.0 → 0.1.1

package/README.md

@@ -23,9 +23,10 @@ npx oh-aicoding-tool langfuse setup
 npx oh-aicoding-tool report install opencode --email user@company.com
 ```
 
-Running `npx oh-aicoding-tool` with no subcommand opens a guided menu. Choose
-Langfuse tracing or the issue report plugin; the report path asks for the
-install target and guides company email configuration before installing.
+Running `npx oh-aicoding-tool` with no subcommand opens a highlighted TUI.
+Use arrow keys to move, `Space` to select one or more tools, and `Enter` to
+continue. The report path also supports multi-select install targets and guides
+company email configuration before installing.
 
 ## Commands
 

package/bin/cli.js

@@ -1,10 +1,60 @@
 #!/usr/bin/env node
 import path from "node:path";
+import readline from "node:readline";
 import { spawnSync } from "node:child_process";
 import { createInterface } from "node:readline/promises";
 import { fileURLToPath } from "node:url";
 
 const rootDir = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
+const langfuseCli = path.join(rootDir, "bin", "langfuse-cli.js");
+const reportCli = path.join(rootDir, "opencode-ohai-report", "bin", "cli.js");
+
+const colorEnabled = process.stdout.isTTY && process.env.NO_COLOR !== "1";
+const ansi = (code) => (colorEnabled ? `\x1b[${code}m` : "");
+const rgb = (r, g, b) => (colorEnabled ? `\x1b[38;2;${r};${g};${b}m` : "");
+const bg = (r, g, b) => (colorEnabled ? `\x1b[48;2;${r};${g};${b}m` : "");
+const t = {
+  reset: ansi(0),
+  bold: ansi(1),
+  dim: ansi(2),
+  cyan: rgb(92, 214, 255),
+  teal: rgb(92, 232, 188),
+  blue: rgb(132, 167, 255),
+  gold: rgb(245, 202, 116),
+  red: rgb(255, 117, 117),
+  muted: rgb(140, 151, 166),
+  panel: rgb(75, 86, 105),
+  selectedBg: bg(31, 53, 68),
+  selectedFg: rgb(218, 250, 255),
+};
+
+function paint(value, ...styles) {
+  if (!colorEnabled) return String(value);
+  return `${styles.join("")}${value}${t.reset}`;
+}
+
+function terminalWidth() {
+  return Math.max(72, Math.min(process.stdout.columns || 88, 104));
+}
+
+function clearScreen() {
+  if (process.stdout.isTTY) process.stdout.write("\x1b[2J\x1b[H");
+}
+
+function rule(width = terminalWidth()) {
+  return paint("-".repeat(width), t.panel);
+}
+
+function renderHeader(subtitle = "Interactive setup") {
+  clearScreen();
+  console.log("");
+  console.log(`${paint("oh-aicoding-tool", t.bold, t.teal)} ${paint(subtitle, t.cyan)}`);
+  console.log(rule());
+  console.log(
+    `${paint("Space", t.gold)} toggle  ${paint("Enter", t.gold)} continue  ` +
+      `${paint("Up/Down", t.gold)} move  ${paint("q", t.gold)} exit`
+  );
+}
 
 function runNodeScript(script, args) {
   const result = spawnSync(process.execPath, [script, ...args], {
@@ -18,7 +68,7 @@ function printHelp() {
   console.log("oh-aicoding-tool");
   console.log("");
   console.log("Usage:");
-  console.log("  oh-aicoding-tool                         Open the installer menu");
+  console.log("  oh-aicoding-tool                         Open the interactive TUI");
   console.log("  oh-aicoding-tool langfuse [setup|check] [target]");
   console.log("  oh-aicoding-tool report install opencode [--email user@company.com]");
   console.log("  oh-aicoding-tool report install claude");
@@ -35,13 +85,70 @@ function emailIsValid(value) {
   return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(String(value || "").trim());
 }
 
-async function askChoice(rl, title, choices) {
+function renderChoiceScreen(title, choices, index, subtitle) {
+  renderHeader(subtitle);
   console.log("");
-  console.log(title);
-  choices.forEach((choice, index) => {
-    console.log(`  ${index + 1}. ${choice.label}`);
-    if (choice.description) console.log(`     ${choice.description}`);
+  console.log(paint(title, t.bold, t.blue));
+  console.log("");
+  choices.forEach((choice, idx) => {
+    const focused = idx === index;
+    const cursor = focused ? paint(">", t.teal, t.bold) : " ";
+    const label = focused
+      ? paint(` ${choice.label} `, t.bold, t.selectedFg, t.selectedBg)
+      : paint(choice.label, t.bold);
+    console.log(` ${cursor} ${paint(`[${idx + 1}]`, focused ? t.selectedFg : t.muted)} ${label}`);
+    if (choice.description) {
+      console.log(`      ${paint(choice.description, focused ? t.blue : t.muted)}`);
+    }
+    if (idx < choices.length - 1) console.log("");
   });
+}
+
+async function askChoice(rl, title, choices, subtitle = "Interactive setup") {
+  if (process.stdin.isTTY && process.stdout.isTTY) {
+    rl.pause();
+    return await new Promise((resolve) => {
+      let index = 0;
+      const stdin = process.stdin;
+
+      function cleanup(value) {
+        stdin.off("keypress", onKeypress);
+        if (stdin.isTTY) stdin.setRawMode(false);
+        stdin.pause();
+        rl.resume();
+        clearScreen();
+        resolve(value);
+      }
+
+      function onKeypress(_, key = {}) {
+        if (key.ctrl && key.name === "c") return cleanup("exit");
+        if (key.name === "q" || key.name === "escape") return cleanup("exit");
+        if (key.name === "up") {
+          index = (index - 1 + choices.length) % choices.length;
+          renderChoiceScreen(title, choices, index, subtitle);
+          return;
+        }
+        if (key.name === "down") {
+          index = (index + 1) % choices.length;
+          renderChoiceScreen(title, choices, index, subtitle);
+          return;
+        }
+        if (key.name === "return" || key.name === "enter") return cleanup(choices[index].value);
+        const number = Number.parseInt(key.sequence, 10);
+        if (Number.isInteger(number) && choices[number - 1]) return cleanup(choices[number - 1].value);
+      }
+
+      readline.emitKeypressEvents(stdin);
+      if (stdin.isTTY) stdin.setRawMode(true);
+      stdin.on("keypress", onKeypress);
+      stdin.resume();
+      renderChoiceScreen(title, choices, index, subtitle);
+    });
+  }
+
+  console.log("");
+  console.log(title);
+  choices.forEach((choice, index) => console.log(`  ${index + 1}. ${choice.label}`));
   while (true) {
     const answer = (await rl.question("> ")).trim().toLowerCase();
     const index = Number.parseInt(answer, 10) - 1;
@@ -52,78 +159,188 @@ async function askChoice(rl, title, choices) {
   }
 }
 
-const langfuseCli = path.join(rootDir, "bin", "langfuse-cli.js");
-const reportCli = path.join(rootDir, "opencode-ohai-report", "bin", "cli.js");
+function renderMultiChoiceScreen(title, choices, index, selected, subtitle) {
+  renderHeader(subtitle);
+  console.log("");
+  console.log(paint(title, t.bold, t.blue));
+  console.log("");
+  choices.forEach((choice, idx) => {
+    const focused = idx === index;
+    const checked = selected.has(choice.value);
+    const box = checked ? paint("[x]", t.teal, t.bold) : paint("[ ]", t.muted);
+    const cursor = focused ? paint(">", t.teal, t.bold) : " ";
+    const label = focused
+      ? paint(` ${choice.label} `, t.bold, t.selectedFg, t.selectedBg)
+      : paint(choice.label, t.bold);
+    console.log(` ${cursor} ${box} ${label}`);
+    if (choice.description) {
+      console.log(`      ${paint(choice.description, focused ? t.blue : t.muted)}`);
+    }
+    if (idx < choices.length - 1) console.log("");
+  });
+}
+
+async function askMultiChoice(rl, title, choices, subtitle = "Interactive setup") {
+  if (process.stdin.isTTY && process.stdout.isTTY) {
+    rl.pause();
+    return await new Promise((resolve) => {
+      let index = 0;
+      const selected = new Set(choices.filter((choice) => choice.selected).map((choice) => choice.value));
+      const stdin = process.stdin;
+
+      function cleanup(value) {
+        stdin.off("keypress", onKeypress);
+        if (stdin.isTTY) stdin.setRawMode(false);
+        stdin.pause();
+        rl.resume();
+        clearScreen();
+        resolve(value);
+      }
+
+      function toggle() {
+        const value = choices[index].value;
+        if (selected.has(value)) selected.delete(value);
+        else selected.add(value);
+        renderMultiChoiceScreen(title, choices, index, selected, subtitle);
+      }
+
+      function onKeypress(_, key = {}) {
+        if (key.ctrl && key.name === "c") return cleanup([]);
+        if (key.name === "q" || key.name === "escape") return cleanup([]);
+        if (key.name === "up") {
+          index = (index - 1 + choices.length) % choices.length;
+          renderMultiChoiceScreen(title, choices, index, selected, subtitle);
+          return;
+        }
+        if (key.name === "down") {
+          index = (index + 1) % choices.length;
+          renderMultiChoiceScreen(title, choices, index, selected, subtitle);
+          return;
+        }
+        if (key.name === "space") return toggle();
+        if (key.name === "return" || key.name === "enter") return cleanup([...selected]);
+        const number = Number.parseInt(key.sequence, 10);
+        if (Number.isInteger(number) && choices[number - 1]) {
+          index = number - 1;
+          toggle();
+        }
+      }
+
+      readline.emitKeypressEvents(stdin);
+      if (stdin.isTTY) stdin.setRawMode(true);
+      stdin.on("keypress", onKeypress);
+      stdin.resume();
+      renderMultiChoiceScreen(title, choices, index, selected, subtitle);
+    });
+  }
+
+  console.log("");
+  console.log(title);
+  choices.forEach((choice, index) => console.log(`  ${index + 1}. ${choice.label}`));
+  const answer = await rl.question("Select numbers separated by comma > ");
+  return answer
+    .split(/[, ]+/)
+    .map((item) => Number.parseInt(item, 10) - 1)
+    .filter((index) => Number.isInteger(index) && choices[index])
+    .map((index) => choices[index].value);
+}
 
 async function askEmail(rl) {
   const envEmail = process.env.OHAI_INSTALL_USER_EMAIL || "";
   const hint = emailIsValid(envEmail) ? ` [${envEmail}]` : "";
+  renderHeader("Issue report setup");
+  console.log("");
+  console.log(paint("Company email", t.bold, t.blue));
+  console.log(paint("Used as the stable user identity in issue reports.", t.muted));
+  console.log(paint("Press Enter to skip email setup for now.", t.muted));
   console.log("");
-  console.log("Company email is used as the user identity in issue reports.");
-  console.log("Press Enter to skip email setup for now.");
   while (true) {
-    const answer = (await rl.question(`Company email${hint}: `)).trim();
+    const answer = (await rl.question(`${paint("Email", t.cyan)}${paint(hint, t.muted)} > `)).trim();
     const value = answer || (emailIsValid(envEmail) ? envEmail.trim() : "");
     if (!value) return "";
     if (emailIsValid(value)) return value;
-    console.log("Invalid email. Example: name@company.com");
+    console.log(paint("Invalid email. Example: name@company.com", t.red));
   }
 }
 
-async function runReportInstallMenu(rl) {
-  const target = await askChoice(rl, "Install issue report plugin for:", [
-    { label: "OpenCode", value: "opencode", description: "Install /report-ai-issue and the OpenCode plugin." },
-    { label: "Claude Code", value: "claude", description: "Install the command and optional hook integration." },
-    { label: "Both", value: "both", description: "Install OpenCode and Claude Code integrations together." },
-    { label: "Back", value: "back" },
-  ]);
-  if (target === "back") return 0;
-  const email = await askEmail(rl);
-  const args = ["install", target];
-  if (email) args.push("--email", email);
-  else args.push("--skip-email");
-  rl.close();
-  return runNodeScript(reportCli, args);
-}
-
-async function runMainMenu() {
-  if (!process.stdin.isTTY) {
-    printHelp();
-    return 0;
-  }
-  const rl = createInterface({ input: process.stdin, output: process.stdout });
-  try {
-    console.log("");
-    console.log("oh-aicoding-tool");
-    const action = await askChoice(rl, "What would you like to install or configure?", [
+async function collectInstallPlan(rl) {
+  const tools = await askMultiChoice(
+    rl,
+    "Select tools to install or configure",
+    [
       {
         label: "Langfuse tracing",
         value: "langfuse",
+        selected: true,
         description: "Configure tracing for Claude Code, OpenCode, or Codex.",
       },
       {
         label: "Issue report plugin",
         value: "report",
-        description: "Install oh-ai-report and configure company email.",
+        selected: true,
+        description: "Install /report-ai-issue and configure company email.",
       },
-      { label: "Check Langfuse configuration", value: "check-langfuse" },
-      { label: "Check report plugin", value: "check-report" },
-      { label: "Exit", value: "exit" },
-    ]);
-    if (action === "langfuse") {
-      rl.close();
-      return runNodeScript(langfuseCli, ["setup"]);
+    ],
+    "Install menu"
+  );
+
+  if (!tools.length) return { tools: [], reportTarget: "", email: "" };
+
+  let reportTarget = "";
+  let email = "";
+  if (tools.includes("report")) {
+    const targets = await askMultiChoice(
+      rl,
+      "Select issue report install targets",
+      [
+        {
+          label: "OpenCode",
+          value: "opencode",
+          selected: true,
+          description: "Install the OpenCode plugin and /report-ai-issue command.",
+        },
+        {
+          label: "Claude Code",
+          value: "claude",
+          selected: false,
+          description: "Install the command and optional hook integration.",
+        },
+      ],
+      "Issue report setup"
+    );
+    if (!targets.length) {
+      const withoutReport = tools.filter((item) => item !== "report");
+      return { tools: withoutReport, reportTarget: "", email: "" };
     }
-    if (action === "report") return await runReportInstallMenu(rl);
-    if (action === "check-langfuse") {
-      rl.close();
-      return runNodeScript(langfuseCli, ["check"]);
+    reportTarget = targets.length === 2 ? "both" : targets[0];
+    email = await askEmail(rl);
+  }
+
+  return { tools, reportTarget, email };
+}
+
+async function runInteractiveInstall() {
+  if (!process.stdin.isTTY) {
+    printHelp();
+    return 0;
+  }
+
+  const rl = createInterface({ input: process.stdin, output: process.stdout });
+  try {
+    const plan = await collectInstallPlan(rl);
+    rl.close();
+
+    let code = 0;
+    if (plan.tools.includes("langfuse")) {
+      code ||= runNodeScript(langfuseCli, ["setup"]);
     }
-    if (action === "check-report") {
-      rl.close();
-      return runNodeScript(reportCli, ["doctor"]);
+    if (plan.tools.includes("report") && plan.reportTarget) {
+      const args = ["install", plan.reportTarget];
+      if (plan.email) args.push("--email", plan.email);
+      else args.push("--skip-email");
+      code ||= runNodeScript(reportCli, args);
     }
-    return 0;
+    return code;
   } finally {
     rl.close();
   }
@@ -138,7 +355,7 @@ async function main() {
     return 0;
   }
 
-  if (!cmd) return await runMainMenu();
+  if (!cmd) return await runInteractiveInstall();
 
   if (cmd === "langfuse" || cmd === "trace" || cmd === "tracing") {
     return runNodeScript(langfuseCli, rest);
@@ -161,6 +378,6 @@ async function main() {
 main()
   .then((code) => process.exit(code))
   .catch((err) => {
-    console.error(err?.message || String(err));
+    console.error(paint(err?.message || String(err), t.red));
     process.exit(1);
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oh-aicoding-tool",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "private": false,
   "type": "module",
   "description": "Configure AI coding tools with Langfuse tracing and install the oh-ai-report issue feedback plugin.",