clawcontrol 0.2.0 → 0.2.2

package/bin/clawcontrol.js

@@ -8,32 +8,96 @@ import { execFileSync } from "node:child_process";
 import { createRequire } from "node:module";
 import { fileURLToPath } from "node:url";
 import { dirname, resolve } from "node:path";
+import { readFileSync } from "node:fs";
 
 const args = process.argv.slice(2);
 
-// Handle --version and --help without needing bun
+// ── Helpers ──────────────────────────────────────────────────────────
+
+const require = createRequire(import.meta.url);
+const pkg = require("../package.json");
+const currentVersion = pkg.version;
+
+/** Compare two semver strings. Returns -1, 0, or 1. */
+function compareSemver(a, b) {
+  const pa = a.split(".").map(Number);
+  const pb = b.split(".").map(Number);
+  for (let i = 0; i < 3; i++) {
+    if (pa[i] < pb[i]) return -1;
+    if (pa[i] > pb[i]) return 1;
+  }
+  return 0;
+}
+
+/** Fetch the latest version from the npm registry. Returns version string or null. */
+async function fetchLatestVersion(timeoutMs = 3000) {
+  try {
+    const controller = new AbortController();
+    const timer = setTimeout(() => controller.abort(), timeoutMs);
+    const res = await fetch("https://registry.npmjs.org/clawcontrol/latest", {
+      signal: controller.signal,
+    });
+    clearTimeout(timer);
+    if (!res.ok) return null;
+    const data = await res.json();
+    return data.version ?? null;
+  } catch {
+    return null;
+  }
+}
+
+/** Run bun add -g clawcontrol@latest. Returns true on success. */
+function performUpdate() {
+  try {
+    execFileSync("bun", ["add", "-g", "clawcontrol@latest"], {
+      stdio: "pipe",
+    });
+    // Verify the new version by re-reading package.json from disk
+    const pkgPath = resolve(dirname(fileURLToPath(import.meta.url)), "../package.json");
+    const newPkg = JSON.parse(readFileSync(pkgPath, "utf-8"));
+    console.log(`\x1b[32m[update] Updated to v${newPkg.version}\x1b[0m`);
+    return true;
+  } catch (e) {
+    if (e.code === "ENOENT") {
+      console.error(
+        "\x1b[31m[update] Update failed: bun is not installed.\x1b[0m\n" +
+          "  Install it: curl -fsSL https://bun.sh/install | bash"
+      );
+    } else {
+      const detail = e.stderr ? e.stderr.toString().trim() : e.message;
+      console.error(`\x1b[31m[update] Update failed: ${detail}\x1b[0m`);
+    }
+    return false;
+  }
+}
+
+// ── --version ────────────────────────────────────────────────────────
+
 if (args.includes("--version") || args.includes("-v")) {
-  const require = createRequire(import.meta.url);
-  const pkg = require("../package.json");
-  console.log(`clawcontrol v${pkg.version}`);
+  console.log(`clawcontrol v${currentVersion}`);
   process.exit(0);
 }
 
+// ── --help ───────────────────────────────────────────────────────────
+
 if (args.includes("--help") || args.includes("-h")) {
-  const require = createRequire(import.meta.url);
-  const pkg = require("../package.json");
   console.log(`
-clawcontrol v${pkg.version}
+clawcontrol v${currentVersion}
 ${pkg.description}
 
 Usage:
   clawcontrol            Launch the interactive TUI
   clawcontrol --help     Show this help message
   clawcontrol --version  Show the version number
+  clawcontrol --update   Update to the latest version
 
 Options:
   -h, --help     Show this help message
   -v, --version  Show the version number
+  -u, --update   Update clawcontrol to the latest version
+
+Environment:
+  CLAWCONTROL_SKIP_UPDATE=1   Skip the automatic update check on startup
 
 Documentation & source:
   https://github.com/ipenywis/clawcontrol
@@ -41,6 +105,51 @@ Documentation & source:
   process.exit(0);
 }
 
+// ── --update (manual) ────────────────────────────────────────────────
+
+if (args.includes("--update") || args.includes("-u")) {
+  console.log("\x1b[36m[update] Checking for updates...\x1b[0m");
+  const latest = await fetchLatestVersion(10000); // generous 10s timeout for manual
+  if (latest === null) {
+    console.error("\x1b[31m[update] Could not reach npm registry.\x1b[0m");
+    process.exit(1);
+  }
+  if (compareSemver(currentVersion, latest) >= 0) {
+    console.log(`\x1b[32m[update] Already up to date (v${currentVersion})\x1b[0m`);
+    process.exit(0);
+  }
+  console.log(`\x1b[36m[update] New version available: v${currentVersion} -> v${latest}\x1b[0m`);
+  console.log("\x1b[36m[update] Updating clawcontrol...\x1b[0m");
+  const ok = performUpdate();
+  process.exit(ok ? 0 : 1);
+}
+
+// ── Auto-update on startup ───────────────────────────────────────────
+
+if (process.env.CLAWCONTROL_SKIP_UPDATE !== "1") {
+  const latest = await fetchLatestVersion(3000);
+  if (latest !== null && compareSemver(currentVersion, latest) < 0) {
+    console.log(`\x1b[36m[update] New version available: v${currentVersion} -> v${latest}\x1b[0m`);
+    console.log("\x1b[36m[update] Updating clawcontrol...\x1b[0m");
+    const ok = performUpdate();
+    if (ok) {
+      console.log("\x1b[36m[update] Restarting with updated version...\x1b[0m");
+      try {
+        execFileSync(process.argv[0], process.argv.slice(1), {
+          stdio: "inherit",
+          env: { ...process.env, CLAWCONTROL_SKIP_UPDATE: "1" },
+        });
+        process.exit(0);
+      } catch (e) {
+        process.exit(e.status ?? 1);
+      }
+    }
+    // If update failed, fall through and run the current version
+  }
+}
+
+// ── Launch the TUI via bun ───────────────────────────────────────────
+
 const __dirname = dirname(fileURLToPath(import.meta.url));
 const script = resolve(__dirname, "../dist/index.js");
 

package/dist/index.js

@@ -1,14 +1,16 @@
 // src/index.tsx
 import { createRequire } from "module";
+import { release } from "os";
 import { createCliRenderer } from "@opentui/core";
 import { createRoot } from "@opentui/react";
 
 // src/App.tsx
-import { useState as useState12, useCallback as useCallback4, useRef as useRef6 } from "react";
+import { useState as useState13, useCallback as useCallback4, useRef as useRef8 } from "react";
 import { useRenderer as useRenderer2 } from "@opentui/react";
 
 // src/components/Home.tsx
-import { useState } from "react";
+import { useState, useRef } from "react";
+import { useKeyboard } from "@opentui/react";
 
 // src/theme.ts
 var palette = {
@@ -149,33 +151,61 @@ var COMMANDS = [
   { name: "/logs", description: "View deployment logs" },
   { name: "/dashboard", description: "Open OpenClaw dashboard in browser" },
   { name: "/destroy", description: "Destroy a deployment" },
+  { name: "/channels", description: "View configured channels" },
   { name: "/templates", description: "Manage deployment templates" },
   { name: "/help", description: "Show help" }
 ];
 function Home({ context }) {
   const [inputValue, setInputValue] = useState("");
   const [error, setError] = useState(null);
+  const [selectedSuggestionIndex, setSelectedSuggestionIndex] = useState(-1);
+  const viewMap = {
+    "/new": "new",
+    "/list": "list",
+    "/deploy": "deploy",
+    "/status": "status",
+    "/ssh": "ssh",
+    "/logs": "logs",
+    "/dashboard": "dashboard",
+    "/destroy": "destroy",
+    "/channels": "channels",
+    "/templates": "templates",
+    "/help": "help"
+  };
+  const filteredCommands = inputValue.length >= 2 && inputValue.startsWith("/") ? COMMANDS.filter((cmd) => cmd.name.startsWith(inputValue.toLowerCase())) : [];
+  const stateRef = useRef({ selectedSuggestionIndex, filteredCommands, inputValue });
+  stateRef.current = { selectedSuggestionIndex, filteredCommands, inputValue };
   const handleCommand = (command) => {
     const cmd = command.trim().toLowerCase();
     setError(null);
-    const viewMap = {
-      "/new": "new",
-      "/list": "list",
-      "/deploy": "deploy",
-      "/status": "status",
-      "/ssh": "ssh",
-      "/logs": "logs",
-      "/dashboard": "dashboard",
-      "/destroy": "destroy",
-      "/templates": "templates",
-      "/help": "help"
-    };
     if (viewMap[cmd]) {
       context.navigateTo(viewMap[cmd]);
     } else if (cmd.startsWith("/")) {
       setError(`Unknown command: ${cmd}. Type /help for available commands.`);
     }
   };
+  useKeyboard((key) => {
+    const s = stateRef.current;
+    if (s.filteredCommands.length === 0) return;
+    if (key.name === "down") {
+      setSelectedSuggestionIndex(
+        (prev) => prev < s.filteredCommands.length - 1 ? prev + 1 : 0
+      );
+    } else if (key.name === "up") {
+      setSelectedSuggestionIndex(
+        (prev) => prev > 0 ? prev - 1 : s.filteredCommands.length - 1
+      );
+    } else if (key.name === "tab") {
+      if (s.selectedSuggestionIndex >= 0 && s.selectedSuggestionIndex < s.filteredCommands.length) {
+        const cmd = s.filteredCommands[s.selectedSuggestionIndex].name;
+        setInputValue("");
+        setSelectedSuggestionIndex(-1);
+        handleCommand(cmd);
+      }
+    } else if (key.name === "escape") {
+      setSelectedSuggestionIndex(-1);
+    }
+  });
   return /* @__PURE__ */ jsxs("box", { flexDirection: "column", width: "100%", height: "100%", children: [
     /* @__PURE__ */ jsx(
       "scrollbox",
@@ -278,9 +308,19 @@ function Home({ context }) {
                   placeholder: "Type a command (e.g., /new)...",
                   focused: true,
                   width: "100%",
-                  onInput: (value) => setInputValue(value),
+                  onInput: (value) => {
+                    setInputValue(value);
+                    const matches = value.length >= 2 && value.startsWith("/") ? COMMANDS.filter((cmd) => cmd.name.startsWith(value.toLowerCase())) : [];
+                    setSelectedSuggestionIndex(matches.length > 0 ? 0 : -1);
+                  },
                   onSubmit: (value) => {
-                    if (typeof value === "string" && typeof value.trim === "function" && value.trim()) {
+                    const s = stateRef.current;
+                    if (s.selectedSuggestionIndex >= 0 && s.selectedSuggestionIndex < s.filteredCommands.length) {
+                      const cmd = s.filteredCommands[s.selectedSuggestionIndex].name;
+                      setInputValue("");
+                      setSelectedSuggestionIndex(-1);
+                      handleCommand(cmd);
+                    } else if (typeof value === "string" && typeof value.trim === "function" && value.trim()) {
                       handleCommand(value);
                       setInputValue("");
                     }
@@ -290,14 +330,22 @@ function Home({ context }) {
             }
           )
         }
-      )
+      ),
+      filteredCommands.length > 0 && /* @__PURE__ */ jsx("box", { flexDirection: "column", paddingLeft: 1, backgroundColor: t.bg.elevated, children: filteredCommands.map((cmd, i) => {
+        const selected = i === selectedSuggestionIndex;
+        return /* @__PURE__ */ jsxs("box", { flexDirection: "row", height: 1, overflow: "hidden", backgroundColor: selected ? t.selection.bg : t.bg.elevated, children: [
+          /* @__PURE__ */ jsx("text", { fg: selected ? t.selection.indicator : t.fg.muted, children: selected ? "> " : "  " }),
+          /* @__PURE__ */ jsx("text", { fg: selected ? t.accent : t.fg.primary, width: 14, children: cmd.name }),
+          /* @__PURE__ */ jsx("text", { fg: t.fg.secondary, children: cmd.description })
+        ] }, cmd.name);
+      }) })
     ] })
   ] });
 }
 
 // src/components/NewDeployment.tsx
-import { useState as useState2, useRef, useEffect } from "react";
-import { useKeyboard } from "@opentui/react";
+import { useState as useState2, useRef as useRef2, useEffect } from "react";
+import { useKeyboard as useKeyboard2 } from "@opentui/react";
 import { appendFileSync } from "fs";
 import { homedir as homedir3 } from "os";
 import { join as join4 } from "path";
@@ -1428,7 +1476,7 @@ function NewDeployment({ context }) {
       setSelectedSavedKeyIndex(0);
     }
   }, [step]);
-  const stateRef = useRef({
+  const stateRef = useRef2({
     name,
     provider,
     apiKey,
@@ -1558,7 +1606,7 @@ function NewDeployment({ context }) {
       setError(`Failed to ${s.editMode === "edit" ? "update" : "create"} deployment: ${err instanceof Error ? err.message : String(err)}`);
     }
   };
-  useKeyboard((key) => {
+  useKeyboard2((key) => {
     const currentState = stateRef.current;
     debugLog(`useKeyboard: key=${key.name}, step=${currentState.step}`);
     if (currentState.step === "template_choice") {
@@ -2811,8 +2859,8 @@ function NewDeployment({ context }) {
 }
 
 // src/components/ListView.tsx
-import { useState as useState3, useRef as useRef2 } from "react";
-import { useKeyboard as useKeyboard2 } from "@opentui/react";
+import { useState as useState3, useRef as useRef3 } from "react";
+import { useKeyboard as useKeyboard3 } from "@opentui/react";
 import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "@opentui/react/jsx-runtime";
 function ListView({ context }) {
   const [viewState, setViewState] = useState3("listing");
@@ -2822,9 +2870,9 @@ function ListView({ context }) {
   const [deletedName, setDeletedName] = useState3("");
   const deployments = context.deployments;
   const selectedDeployment = deployments[selectedIndex];
-  const stateRef = useRef2({ viewState, selectedIndex });
+  const stateRef = useRef3({ viewState, selectedIndex });
   stateRef.current = { viewState, selectedIndex };
-  useKeyboard2((key) => {
+  useKeyboard3((key) => {
     const current = stateRef.current;
     if (deployments.length === 0) {
       context.navigateTo("home");
@@ -3122,7 +3170,7 @@ function ListView({ context }) {
 
 // src/components/DeployView.tsx
 import { useState as useState4 } from "react";
-import { useKeyboard as useKeyboard3 } from "@opentui/react";
+import { useKeyboard as useKeyboard4 } from "@opentui/react";
 import { jsx as jsx4, jsxs as jsxs4 } from "@opentui/react/jsx-runtime";
 function DeployView({ context }) {
   const [selectedIndex, setSelectedIndex] = useState4(0);
@@ -3132,7 +3180,7 @@ function DeployView({ context }) {
   const deployed = deployments.filter((d) => d.state.status === "deployed");
   const allDeployments = [...notDeployed, ...deployed];
   const selectedDeployment = allDeployments[selectedIndex];
-  useKeyboard3((key) => {
+  useKeyboard4((key) => {
     if (allDeployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -3251,8 +3299,8 @@ function DeployView({ context }) {
 }
 
 // src/components/DeployingView.tsx
-import { useState as useState5, useEffect as useEffect2, useCallback, useRef as useRef3 } from "react";
-import { useKeyboard as useKeyboard4 } from "@opentui/react";
+import { useState as useState5, useEffect as useEffect2, useCallback, useRef as useRef4 } from "react";
+import { useKeyboard as useKeyboard5 } from "@opentui/react";
 import open from "open";
 
 // src/services/ssh.ts
@@ -4713,6 +4761,12 @@ function detectTerminal() {
       return { app: "konsole", canOpenTab: true };
     }
   }
+  if (os === "win32") {
+    if (env.WT_SESSION) {
+      return { app: "windows-terminal", canOpenTab: true };
+    }
+    return { app: "powershell", canOpenTab: false };
+  }
   if (os === "darwin") {
     return { app: "terminal.app", canOpenTab: true };
   }
@@ -4747,11 +4801,19 @@ function openTerminalWithCommand(command) {
         return openKonsole(command);
       case "xfce4-terminal":
         return openXfce4Terminal(command);
+      case "windows-terminal":
+        return openWindowsTerminal(command);
+      case "powershell":
+        return openPowerShell(command);
+      case "cmd":
+        return openCmd(command);
       default:
         if (os === "darwin") {
           return openTerminalApp(command);
         } else if (os === "linux") {
           return openLinuxFallback(command);
+        } else if (os === "win32") {
+          return openWindowsFallback(command);
         }
         return { success: false, error: `Unsupported terminal or OS: ${terminal.app}` };
     }
@@ -4947,6 +5009,9 @@ function openCursorTerminal(command) {
     }
     return openTerminalApp(command);
   }
+  if (platform() === "win32") {
+    return openWindowsFallback(command);
+  }
   return openLinuxFallback(command);
 }
 function openVSCodeTerminal(command) {
@@ -5018,6 +5083,62 @@ function openLinuxFallback(command) {
   }
   return { success: false, error: "Could not find a supported terminal emulator" };
 }
+function createTempScriptWindows(command) {
+  const scriptPath = join5(tmpdir(), `clawcontrol-${process.pid}-${Date.now()}.cmd`);
+  const content = [
+    "@echo off",
+    command,
+    `del "${scriptPath}"`,
+    ""
+  ].join("\r\n");
+  writeFileSync5(scriptPath, content);
+  return scriptPath;
+}
+function openWindowsTerminal(command) {
+  const script = createTempScriptWindows(command);
+  const proc = spawn("wt.exe", ["new-tab", "cmd", "/c", script], {
+    stdio: "ignore",
+    detached: true,
+    shell: true
+  });
+  proc.unref();
+  return { success: true };
+}
+function openPowerShell(command) {
+  const proc = spawn("powershell.exe", [
+    "-NoProfile",
+    "Start-Process",
+    "powershell",
+    "-ArgumentList",
+    `'-NoExit -Command "${command.replace(/"/g, '`"')}"'`
+  ], {
+    stdio: "ignore",
+    detached: true,
+    shell: true
+  });
+  proc.unref();
+  return { success: true };
+}
+function openCmd(command) {
+  const script = createTempScriptWindows(command);
+  const proc = spawn("cmd.exe", ["/c", "start", "cmd", "/k", script], {
+    stdio: "ignore",
+    detached: true,
+    shell: true
+  });
+  proc.unref();
+  return { success: true };
+}
+function openWindowsFallback(command) {
+  try {
+    const result = spawnSync("where", ["wt.exe"], { stdio: "pipe", timeout: 2e3 });
+    if (result.status === 0) {
+      return openWindowsTerminal(command);
+    }
+  } catch {
+  }
+  return openPowerShell(command);
+}
 function getTerminalDisplayName(app) {
   const names = {
     "terminal.app": "Terminal.app",
@@ -5033,6 +5154,9 @@ function getTerminalDisplayName(app) {
     "konsole": "Konsole",
     "xfce4-terminal": "XFCE Terminal",
     "xterm": "XTerm",
+    "windows-terminal": "Windows Terminal",
+    "powershell": "PowerShell",
+    "cmd": "Command Prompt",
     "unknown": "System Terminal"
   };
   return names[app];
@@ -5094,9 +5218,9 @@ function DeployingView({ context }) {
     setDeployState("deploying");
     addLog("Terminal session confirmed complete, continuing deployment...");
   }, [terminalResolve, addLog]);
-  const stateRef = useRef3({ deployState, terminalResolve });
+  const stateRef = useRef4({ deployState, terminalResolve });
   stateRef.current = { deployState, terminalResolve };
-  useKeyboard4((key) => {
+  useKeyboard5((key) => {
     const currentState = stateRef.current;
     if (currentState.deployState === "waiting_terminal") {
       if (key.name === "return") {
@@ -5344,7 +5468,7 @@ function DeployingView({ context }) {
 
 // src/components/StatusView.tsx
 import { useState as useState6 } from "react";
-import { useKeyboard as useKeyboard5 } from "@opentui/react";
+import { useKeyboard as useKeyboard6 } from "@opentui/react";
 import { jsx as jsx6, jsxs as jsxs6 } from "@opentui/react/jsx-runtime";
 function StatusView({ context }) {
   const [selectedIndex, setSelectedIndex] = useState6(0);
@@ -5374,7 +5498,7 @@ function StatusView({ context }) {
     setHealthStatus((prev) => new Map(prev).set(name, health));
     setChecking(null);
   };
-  useKeyboard5((key) => {
+  useKeyboard6((key) => {
     if (deployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -5528,7 +5652,7 @@ function StatusView({ context }) {
 
 // src/components/SSHView.tsx
 import { useState as useState7, useCallback as useCallback2 } from "react";
-import { useKeyboard as useKeyboard6 } from "@opentui/react";
+import { useKeyboard as useKeyboard7 } from "@opentui/react";
 import { jsx as jsx7, jsxs as jsxs7 } from "@opentui/react/jsx-runtime";
 function SSHView({ context }) {
   const [viewState, setViewState] = useState7("selecting");
@@ -5554,7 +5678,7 @@ function SSHView({ context }) {
     }
   }, []);
   const selectedDeployment = deployedDeployments[selectedIndex];
-  useKeyboard6((key) => {
+  useKeyboard7((key) => {
     if (deployedDeployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -5709,8 +5833,8 @@ function SSHView({ context }) {
 }
 
 // src/components/LogsView.tsx
-import { useState as useState8, useEffect as useEffect3, useRef as useRef4 } from "react";
-import { useKeyboard as useKeyboard7 } from "@opentui/react";
+import { useState as useState8, useEffect as useEffect3, useRef as useRef5 } from "react";
+import { useKeyboard as useKeyboard8 } from "@opentui/react";
 import { Fragment as Fragment2, jsx as jsx8, jsxs as jsxs8 } from "@opentui/react/jsx-runtime";
 function parseLogLine(line) {
   if (!line.trim()) return null;
@@ -5736,8 +5860,8 @@ function LogsView({ context }) {
   const [error, setError] = useState8(null);
   const [autoRefresh, setAutoRefresh] = useState8(false);
   const [lastFetched, setLastFetched] = useState8(null);
-  const sshRef = useRef4(null);
-  const refreshIntervalRef = useRef4(null);
+  const sshRef = useRef5(null);
+  const refreshIntervalRef = useRef5(null);
   const deployedDeployments = context.deployments.filter(
     (d) => d.state.status === "deployed" && d.state.serverIp
   );
@@ -5788,7 +5912,7 @@ function LogsView({ context }) {
     setLogs([]);
   };
   const selectedDeployment = deployedDeployments[selectedIndex];
-  useKeyboard7((key) => {
+  useKeyboard8((key) => {
     if (deployedDeployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -5947,7 +6071,7 @@ function LogsView({ context }) {
 
 // src/components/DestroyView.tsx
 import { useState as useState9 } from "react";
-import { useKeyboard as useKeyboard8 } from "@opentui/react";
+import { useKeyboard as useKeyboard9 } from "@opentui/react";
 import { jsx as jsx9, jsxs as jsxs9 } from "@opentui/react/jsx-runtime";
 function DestroyView({ context }) {
   const [viewState, setViewState] = useState9("selecting");
@@ -5998,7 +6122,7 @@ function DestroyView({ context }) {
     }
   };
   const selectedDeployment = deployments[selectedIndex];
-  useKeyboard8((key) => {
+  useKeyboard9((key) => {
     if (deployments.length === 0) {
       context.navigateTo("home");
       return;
@@ -6189,10 +6313,10 @@ function DestroyView({ context }) {
 }
 
 // src/components/HelpView.tsx
-import { useKeyboard as useKeyboard9 } from "@opentui/react";
+import { useKeyboard as useKeyboard10 } from "@opentui/react";
 import { jsx as jsx10, jsxs as jsxs10 } from "@opentui/react/jsx-runtime";
 function HelpView({ context }) {
-  useKeyboard9(() => {
+  useKeyboard10(() => {
     context.navigateTo("home");
   });
   return /* @__PURE__ */ jsxs10("box", { flexDirection: "column", width: "100%", padding: 1, children: [
@@ -6319,8 +6443,8 @@ function HelpView({ context }) {
 }
 
 // src/components/TemplatesView.tsx
-import { useState as useState10, useRef as useRef5, useEffect as useEffect4 } from "react";
-import { useKeyboard as useKeyboard10 } from "@opentui/react";
+import { useState as useState10, useRef as useRef6, useEffect as useEffect4 } from "react";
+import { useKeyboard as useKeyboard11 } from "@opentui/react";
 import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs11 } from "@opentui/react/jsx-runtime";
 var DO_DROPLET_SIZES2 = [
   { slug: "s-1vcpu-2gb", label: "1 vCPU, 2GB RAM, 50GB SSD", price: "$12/mo" },
@@ -6343,7 +6467,7 @@ function TemplatesView({ context }) {
   const [forkAiProvider, setForkAiProvider] = useState10("");
   const [forkAiProviderIndex, setForkAiProviderIndex] = useState10(0);
   const [forkModel, setForkModel] = useState10("");
-  const stateRef = useRef5({
+  const stateRef = useRef6({
     viewState,
     selectedIndex,
     selectedTemplate,
@@ -6457,7 +6581,7 @@ function TemplatesView({ context }) {
       setViewState("viewing");
     }
   };
-  useKeyboard10((key) => {
+  useKeyboard11((key) => {
     const s = stateRef.current;
     if (s.viewState === "listing") {
       if (key.name === "up") {
@@ -6866,7 +6990,7 @@ function TemplatesView({ context }) {
 
 // src/components/DashboardView.tsx
 import { useState as useState11, useCallback as useCallback3 } from "react";
-import { useKeyboard as useKeyboard11, useRenderer } from "@opentui/react";
+import { useKeyboard as useKeyboard12, useRenderer } from "@opentui/react";
 import { spawnSync as spawnSync2 } from "child_process";
 import { platform as platform2 } from "os";
 
@@ -7035,7 +7159,7 @@ function DashboardView({ context }) {
       setViewState("error");
     }
   }, []);
-  useKeyboard11((key) => {
+  useKeyboard12((key) => {
     if (viewState === "selecting") {
       if (deployedDeployments.length === 0) {
         if (key.name === "escape" || key.name === "return") {
@@ -7293,22 +7417,175 @@ function DashboardView({ context }) {
   return null;
 }
 
+// src/components/ChannelsView.tsx
+import { useState as useState12, useRef as useRef7 } from "react";
+import { useKeyboard as useKeyboard13 } from "@opentui/react";
+import { Fragment as Fragment4, jsx as jsx13, jsxs as jsxs13 } from "@opentui/react/jsx-runtime";
+function maskToken(token) {
+  if (token.length <= 10) return "****";
+  return token.slice(0, 6) + "..." + token.slice(-4);
+}
+function ChannelsView({ context }) {
+  const [viewState, setViewState] = useState12("listing");
+  const [selectedIndex, setSelectedIndex] = useState12(0);
+  const [revealed, setRevealed] = useState12(false);
+  const deployments = context.deployments;
+  const selectedDeployment = deployments[selectedIndex];
+  const stateRef = useRef7({ viewState, selectedIndex });
+  stateRef.current = { viewState, selectedIndex };
+  useKeyboard13((key) => {
+    const current = stateRef.current;
+    if (current.viewState === "listing") {
+      if (deployments.length === 0) {
+        if (key.name === "escape") {
+          context.navigateTo("home");
+        }
+        return;
+      }
+      if (key.name === "up" && current.selectedIndex > 0) {
+        setSelectedIndex(current.selectedIndex - 1);
+      } else if (key.name === "down" && current.selectedIndex < deployments.length - 1) {
+        setSelectedIndex(current.selectedIndex + 1);
+      } else if (key.name === "return") {
+        setRevealed(false);
+        setViewState("detail");
+      } else if (key.name === "escape") {
+        context.navigateTo("home");
+      }
+    } else if (current.viewState === "detail") {
+      if (key.name === "r") {
+        setRevealed((prev) => !prev);
+      } else if (key.name === "escape") {
+        setRevealed(false);
+        setViewState("listing");
+      }
+    }
+  });
+  if (deployments.length === 0) {
+    return /* @__PURE__ */ jsxs13("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs13("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx13("text", { fg: t.accent, children: "/channels" }),
+        /* @__PURE__ */ jsx13("text", { fg: t.fg.secondary, children: " - Communication Channels" })
+      ] }),
+      /* @__PURE__ */ jsxs13(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.default,
+          padding: 1,
+          children: [
+            /* @__PURE__ */ jsx13("text", { fg: t.status.warning, children: "No deployments found!" }),
+            /* @__PURE__ */ jsx13("text", { fg: t.fg.secondary, marginTop: 1, children: "Run /new to create a deployment first." })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx13("text", { fg: t.fg.muted, marginTop: 2, children: "Esc: Back" })
+    ] });
+  }
+  if (viewState === "detail" && selectedDeployment) {
+    const dep = selectedDeployment;
+    const agent = dep.config.openclawAgent;
+    return /* @__PURE__ */ jsxs13("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+      /* @__PURE__ */ jsxs13("box", { flexDirection: "row", marginBottom: 2, children: [
+        /* @__PURE__ */ jsx13("text", { fg: t.accent, children: "/channels" }),
+        /* @__PURE__ */ jsxs13("text", { fg: t.fg.secondary, children: [
+          " - ",
+          dep.config.name
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs13(
+        "box",
+        {
+          flexDirection: "column",
+          borderStyle: "single",
+          borderColor: t.border.focus,
+          padding: 1,
+          marginBottom: 1,
+          children: [
+            /* @__PURE__ */ jsx13("text", { fg: t.accent, marginBottom: 1, children: "Channel Details" }),
+            /* @__PURE__ */ jsxs13("box", { flexDirection: "row", children: [
+              /* @__PURE__ */ jsx13("text", { fg: t.fg.secondary, width: 20, children: "Deployment:" }),
+              /* @__PURE__ */ jsx13("text", { fg: t.fg.primary, children: dep.config.name })
+            ] }),
+            agent ? /* @__PURE__ */ jsxs13(Fragment4, { children: [
+              /* @__PURE__ */ jsxs13("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx13("text", { fg: t.fg.secondary, width: 20, children: "Channel:" }),
+                /* @__PURE__ */ jsx13("text", { fg: t.fg.primary, children: agent.channel })
+              ] }),
+              /* @__PURE__ */ jsxs13("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx13("text", { fg: t.fg.secondary, width: 20, children: "Bot Token:" }),
+                /* @__PURE__ */ jsx13("text", { fg: t.fg.primary, children: revealed ? agent.telegramBotToken : maskToken(agent.telegramBotToken) })
+              ] }),
+              /* @__PURE__ */ jsxs13("box", { flexDirection: "row", children: [
+                /* @__PURE__ */ jsx13("text", { fg: t.fg.secondary, width: 20, children: "Allowed Users:" }),
+                /* @__PURE__ */ jsx13("text", { fg: t.fg.primary, children: agent.telegramAllowFrom || "Any" })
+              ] })
+            ] }) : /* @__PURE__ */ jsx13("box", { flexDirection: "row", marginTop: 1, children: /* @__PURE__ */ jsx13("text", { fg: t.fg.muted, children: "No channel configured for this deployment." }) })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx13("text", { fg: t.fg.muted, marginTop: 1, children: agent ? "R: Reveal/hide secrets | Esc: Back to list" : "Esc: Back to list" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs13("box", { flexDirection: "column", width: "100%", padding: 1, children: [
+    /* @__PURE__ */ jsxs13("box", { flexDirection: "row", marginBottom: 2, children: [
+      /* @__PURE__ */ jsx13("text", { fg: t.accent, children: "/channels" }),
+      /* @__PURE__ */ jsxs13("text", { fg: t.fg.secondary, children: [
+        " - Communication Channels (",
+        deployments.length,
+        ")"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx13(
+      "box",
+      {
+        flexDirection: "column",
+        borderStyle: "single",
+        borderColor: t.border.default,
+        padding: 1,
+        children: deployments.map((dep, index) => {
+          const isSelected = index === selectedIndex;
+          const agent = dep.config.openclawAgent;
+          return /* @__PURE__ */ jsxs13(
+            "box",
+            {
+              flexDirection: "row",
+              backgroundColor: isSelected ? t.selection.bg : void 0,
+              children: [
+                /* @__PURE__ */ jsx13("text", { fg: isSelected ? t.selection.indicator : t.fg.primary, children: isSelected ? "> " : "  " }),
+                /* @__PURE__ */ jsx13("text", { fg: isSelected ? t.selection.fg : t.fg.primary, width: 22, children: dep.config.name }),
+                agent ? /* @__PURE__ */ jsxs13(Fragment4, { children: [
+                  /* @__PURE__ */ jsx13("text", { fg: isSelected ? t.fg.primary : t.fg.secondary, width: 12, children: agent.channel }),
+                  /* @__PURE__ */ jsx13("text", { fg: t.fg.muted, children: agent.telegramAllowFrom ? `users: ${agent.telegramAllowFrom}` : "" })
+                ] }) : /* @__PURE__ */ jsx13("text", { fg: t.fg.muted, children: "No channel" })
+              ]
+            },
+            dep.config.name
+          );
+        })
+      }
+    ),
+    /* @__PURE__ */ jsx13("text", { fg: t.fg.muted, marginTop: 2, children: "Up/Down: Select | Enter: Details | Esc: Back" })
+  ] });
+}
+
 // src/App.tsx
-import { jsx as jsx13 } from "@opentui/react/jsx-runtime";
-function App() {
+import { jsx as jsx14, jsxs as jsxs14 } from "@opentui/react/jsx-runtime";
+function App({ lacksTrueColor: lacksTrueColor2 }) {
   const renderer = useRenderer2();
-  const [currentView, setCurrentView] = useState12("home");
-  const [selectedDeployment, setSelectedDeployment] = useState12(null);
-  const [deployments, setDeployments] = useState12(() => {
+  const [currentView, setCurrentView] = useState13("home");
+  const [selectedDeployment, setSelectedDeployment] = useState13(null);
+  const [deployments, setDeployments] = useState13(() => {
     try {
       return getAllDeployments();
     } catch {
       return [];
     }
   });
-  const [selectedTemplate, setSelectedTemplate] = useState12(null);
-  const [editingDeployment, setEditingDeployment] = useState12(null);
-  const wasDraggingRef = useRef6(false);
+  const [selectedTemplate, setSelectedTemplate] = useState13(null);
+  const [editingDeployment, setEditingDeployment] = useState13(null);
+  const wasDraggingRef = useRef8(false);
   const handleMouseDrag = useCallback4(() => {
     wasDraggingRef.current = true;
   }, []);
@@ -7350,34 +7627,36 @@ function App() {
   const renderView = () => {
     switch (currentView) {
       case "home":
-        return /* @__PURE__ */ jsx13(Home, { context });
+        return /* @__PURE__ */ jsx14(Home, { context });
       case "new":
-        return /* @__PURE__ */ jsx13(NewDeployment, { context });
+        return /* @__PURE__ */ jsx14(NewDeployment, { context });
       case "list":
-        return /* @__PURE__ */ jsx13(ListView, { context });
+        return /* @__PURE__ */ jsx14(ListView, { context });
       case "deploy":
-        return /* @__PURE__ */ jsx13(DeployView, { context });
+        return /* @__PURE__ */ jsx14(DeployView, { context });
       case "deploying":
-        return /* @__PURE__ */ jsx13(DeployingView, { context });
+        return /* @__PURE__ */ jsx14(DeployingView, { context });
       case "status":
-        return /* @__PURE__ */ jsx13(StatusView, { context });
+        return /* @__PURE__ */ jsx14(StatusView, { context });
       case "ssh":
-        return /* @__PURE__ */ jsx13(SSHView, { context });
+        return /* @__PURE__ */ jsx14(SSHView, { context });
       case "logs":
-        return /* @__PURE__ */ jsx13(LogsView, { context });
+        return /* @__PURE__ */ jsx14(LogsView, { context });
       case "dashboard":
-        return /* @__PURE__ */ jsx13(DashboardView, { context });
+        return /* @__PURE__ */ jsx14(DashboardView, { context });
       case "destroy":
-        return /* @__PURE__ */ jsx13(DestroyView, { context });
+        return /* @__PURE__ */ jsx14(DestroyView, { context });
       case "help":
-        return /* @__PURE__ */ jsx13(HelpView, { context });
+        return /* @__PURE__ */ jsx14(HelpView, { context });
       case "templates":
-        return /* @__PURE__ */ jsx13(TemplatesView, { context });
+        return /* @__PURE__ */ jsx14(TemplatesView, { context });
+      case "channels":
+        return /* @__PURE__ */ jsx14(ChannelsView, { context });
       default:
-        return /* @__PURE__ */ jsx13(Home, { context });
+        return /* @__PURE__ */ jsx14(Home, { context });
     }
   };
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsxs14(
     "scrollbox",
     {
       width: "100%",
@@ -7398,13 +7677,29 @@ function App() {
       verticalScrollbarOptions: {
         showArrows: false
       },
-      children: renderView()
+      children: [
+        lacksTrueColor2 && /* @__PURE__ */ jsx14(
+          "box",
+          {
+            width: "100%",
+            style: {
+              paddingLeft: 1,
+              paddingRight: 1,
+              paddingTop: 0,
+              paddingBottom: 0,
+              backgroundColor: t.status.warning
+            },
+            children: /* @__PURE__ */ jsx14("text", { fg: "#000000", children: "\u26A0 Your terminal does not support true color. Colors may look wrong. For full color support, use Ghostty, iTerm2, Kitty, or WezTerm \u2014 or upgrade to macOS 26+ for Terminal.app true color support." })
+          }
+        ),
+        renderView()
+      ]
     }
   );
 }
 
 // src/index.tsx
-import { jsx as jsx14 } from "@opentui/react/jsx-runtime";
+import { jsx as jsx15 } from "@opentui/react/jsx-runtime";
 var args = process.argv.slice(2);
 if (args.includes("--version") || args.includes("-v")) {
   const require2 = createRequire(import.meta.url);
@@ -7433,11 +7728,14 @@ Documentation & source:
 `);
   process.exit(0);
 }
+var isAppleTerminal = process.env.TERM_PROGRAM === "Apple_Terminal";
+var darwinMajor = process.platform === "darwin" ? parseInt(release(), 10) : Infinity;
+var lacksTrueColor = isAppleTerminal && darwinMajor < 25;
 async function main() {
   const renderer = await createCliRenderer({
     useMouse: true
   });
   const root = createRoot(renderer);
-  root.render(/* @__PURE__ */ jsx14(App, {}));
+  root.render(/* @__PURE__ */ jsx15(App, { lacksTrueColor }));
 }
 main().catch(console.error);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clawcontrol",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "CLI tool for deploying and managing OpenClaw instances on VPS providers",
   "type": "module",
   "main": "dist/index.js",