arc402-cli 0.7.5 → 0.8.0

package/src/tui/WalletConnectPairing.tsx

@@ -0,0 +1,131 @@
+import React, { useState, useEffect, useCallback } from "react";
+import { Box, Text } from "ink";
+import type { WCCallbacks } from "../walletconnect.js";
+
+export type WCStage = "connecting" | "connected" | "chain-switching" | "ready" | "error";
+
+interface WalletConnectPairingProps {
+  projectId: string;
+  chainId: number;
+  onComplete: (result: { account: string }) => void;
+  onError: (err: string) => void;
+  /** Called once the component mounts — parent passes the connect function */
+  connect: (callbacks: WCCallbacks) => Promise<{ account: string }>;
+}
+
+/**
+ * Renders WalletConnect pairing inside the Ink TUI viewport:
+ * - ASCII QR code
+ * - Deep links for MetaMask, Rainbow, Trust, etc.
+ * - Status transitions: connecting → connected → chain-switching → ready
+ */
+export function WalletConnectPairing({
+  onComplete,
+  onError,
+  connect,
+}: WalletConnectPairingProps) {
+  const [stage, setStage] = useState<WCStage>("connecting");
+  const [uri, setUri] = useState<string | null>(null);
+  const [links, setLinks] = useState<Record<string, string>>({});
+  const [account, setAccount] = useState<string | null>(null);
+  const [qrLines, setQrLines] = useState<string[]>([]);
+  const [detail, setDetail] = useState<string>("");
+
+  const handleUri = useCallback((wcUri: string, wcLinks: Record<string, string>) => {
+    setUri(wcUri);
+    setLinks(wcLinks);
+    // Generate ASCII QR
+    try {
+      // qrcode-terminal writes to stdout — capture it
+      const origWrite = process.stdout.write.bind(process.stdout);
+      const captured: string[] = [];
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (process.stdout as any).write = (chunk: string | Uint8Array) => {
+        const str = typeof chunk === "string" ? chunk : Buffer.from(chunk).toString("utf8");
+        captured.push(str);
+        return true;
+      };
+      // eslint-disable-next-line @typescript-eslint/no-var-requires
+      import("qrcode-terminal").then((qr) => {
+        qr.default.generate(wcUri, { small: true }, (code: string) => {
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          (process.stdout as any).write = origWrite;
+          setQrLines(code.split("\n"));
+        });
+      }).catch(() => {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        (process.stdout as any).write = origWrite;
+      });
+    } catch {
+      // QR rendering is best-effort
+    }
+  }, []);
+
+  const handleStatus = useCallback((status: WCStage, statusDetail?: string) => {
+    setStage(status);
+    if (statusDetail) setDetail(statusDetail);
+    if (status === "connected" && statusDetail) {
+      setAccount(statusDetail);
+    }
+  }, []);
+
+  useEffect(() => {
+    const callbacks: WCCallbacks = {
+      onUri: handleUri,
+      onStatus: handleStatus,
+    };
+    connect(callbacks)
+      .then((result) => onComplete(result))
+      .catch((err: unknown) => onError(err instanceof Error ? err.message : String(err)));
+  }, [connect, handleUri, handleStatus, onComplete, onError]);
+
+  const statusIcon = stage === "error" ? "✗" : stage === "ready" ? "✓" : "◈";
+  const statusColor = stage === "error" ? "red" : stage === "ready" ? "green" : "cyan";
+
+  const statusMessages: Record<WCStage, string> = {
+    connecting: "Waiting for wallet approval...",
+    connected: `Connected: ${account ?? ""}`,
+    "chain-switching": `Switching chain${detail ? `: ${detail}` : ""}...`,
+    ready: `Ready — ${account ?? ""}`,
+    error: detail || "Connection failed",
+  };
+
+  return (
+    <Box flexDirection="column" paddingLeft={1}>
+      <Text color="cyan" bold>WalletConnect Pairing</Text>
+      <Text> </Text>
+
+      {/* Status */}
+      <Box>
+        <Text color={statusColor}>{statusIcon} </Text>
+        <Text>{statusMessages[stage]}</Text>
+      </Box>
+      <Text> </Text>
+
+      {/* Deep links */}
+      {uri && stage === "connecting" && (
+        <>
+          <Text dimColor>Tap a link for your wallet app:</Text>
+          <Text> </Text>
+          {Object.entries(links).map(([name, link]) => (
+            <Box key={name} flexDirection="column">
+              <Text color="white">{name}:</Text>
+              <Text dimColor>{link}</Text>
+              <Text> </Text>
+            </Box>
+          ))}
+
+          {/* QR code */}
+          {qrLines.length > 0 && (
+            <>
+              <Text dimColor>Or scan QR:</Text>
+              {qrLines.map((line, i) => (
+                <Text key={i}>{line}</Text>
+              ))}
+            </>
+          )}
+        </>
+      )}
+    </Box>
+  );
+}

package/src/tui/index.tsx

@@ -1,12 +1,12 @@
 import React from "react";
 import { render } from "ink";
-import { App } from "./App";
-import fs from "fs";
-import path from "path";
-import os from "os";
+import { App } from "./App.js";
+import fs from "node:fs";
+import path from "node:path";
+import os from "node:os";
+import { createRequire } from "node:module";
 
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const pkg = require("../../package.json") as { version: string };
+const pkg = createRequire(import.meta.url)("../../package.json") as { version: string };
 
 const CONFIG_PATH = path.join(os.homedir(), ".arc402", "config.json");
 
@@ -30,8 +30,7 @@ async function getBalance(
   address: string
 ): Promise<string | undefined> {
   try {
-    // eslint-disable-next-line @typescript-eslint/no-var-requires
-    const ethersLib = require("ethers") as typeof import("ethers");
+    const ethersLib = await import("ethers");
     const provider = new ethersLib.ethers.JsonRpcProvider(rpcUrl);
     const bal = await Promise.race([
       provider.getBalance(address),

package/src/tui/useChat.ts

@@ -1,6 +1,6 @@
 import { useState, useCallback } from "react";
 import chalk from "chalk";
-import { c } from "../ui/colors";
+import { c } from "../ui/colors.js";
 
 interface UseChatResult {
   send: (message: string, onLine: (line: string) => void) => Promise<void>;

package/src/tui/useCommand.ts

@@ -1,43 +1,7 @@
 import { useState, useCallback } from "react";
-import { createProgram } from "../program";
-import { spawn } from "child_process";
+import { createProgram } from "../program.js";
 import chalk from "chalk";
-import { c } from "../ui/colors";
-
-/**
- * Commands that use interactive prompts or WalletConnect QR flows.
- * These MUST run in a child process so they can own stdin/stdout directly,
- * because Ink holds stdin in raw mode for its own input handling.
- */
-const INTERACTIVE_COMMANDS = new Set([
-  "wallet deploy",
-  "wallet set-guardian",
-  "wallet unfreeze",
-  "wallet authorize-machine-key",
-  "wallet revoke-machine-key",
-  "wallet set-passkey",
-  "wallet set-interceptor",
-  "wallet set-velocity-limit",
-  "wallet upgrade-registry",
-  "wallet execute-registry-upgrade",
-  "wallet cancel-registry-upgrade",
-  "wallet register-policy",
-  "wallet whitelist-contract",
-  "wallet governance setup",
-  "wallet policy set-limit",
-  "wallet policy set-daily-limit",
-  "wallet policy set",
-  "wallet import",
-  "config init",
-]);
-
-function isInteractiveCommand(input: string): boolean {
-  const normalized = input.trim();
-  for (const cmd of INTERACTIVE_COMMANDS) {
-    if (normalized === cmd || normalized.startsWith(cmd + " ")) return true;
-  }
-  return false;
-}
+import { c } from "../ui/colors.js";
 
 interface UseCommandResult {
   execute: (input: string, onLine: (line: string) => void) => Promise<void>;
@@ -46,13 +10,8 @@ interface UseCommandResult {
 
 /**
  * Dispatches parsed commands to the commander program.
- *
- * NON-INTERACTIVE commands: captures stdout/stderr by monkey-patching
- * process.stdout.write and routes output to the viewport.
- *
- * INTERACTIVE commands (WalletConnect, prompts): spawns a child process
- * running `arc402 <command>` with inherited stdin so that QR codes render
- * and prompts accept input. Output is captured line-by-line into the viewport.
+ * Captures stdout/stderr by monkey-patching process.stdout.write
+ * and routes all output to the viewport buffer via onLine callback.
  */
 export function useCommand(): UseCommandResult {
   const [isRunning, setIsRunning] = useState(false);
@@ -61,13 +20,89 @@ export function useCommand(): UseCommandResult {
     async (input: string, onLine: (line: string) => void): Promise<void> => {
       setIsRunning(true);
 
-      if (isInteractiveCommand(input)) {
-        await executeInteractive(input, onLine);
-      } else {
-        await executeInProcess(input, onLine);
+      // Capture stdout/stderr
+      const originalStdoutWrite = process.stdout.write.bind(process.stdout);
+      const originalStderrWrite = process.stderr.write.bind(process.stderr);
+
+      let captureBuffer = "";
+
+      const flushBuffer = (): void => {
+        if (!captureBuffer) return;
+        const lines = captureBuffer.split("\n");
+        captureBuffer = lines.pop() ?? "";
+        for (const line of lines) {
+          onLine(line);
+        }
+      };
+
+      const capturedWrite = (
+        chunk: string | Uint8Array,
+        encodingOrCb?: BufferEncoding | ((err?: Error | null) => void),
+        cb?: (err?: Error | null) => void
+      ): boolean => {
+        const str =
+          typeof chunk === "string"
+            ? chunk
+            : Buffer.from(chunk).toString("utf8");
+        captureBuffer += str;
+        flushBuffer();
+        // call callback if provided
+        const callback =
+          typeof encodingOrCb === "function" ? encodingOrCb : cb;
+        if (callback) callback();
+        return true;
+      };
+
+      // Monkey-patch (cast through unknown to bypass strict overload checking)
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (process.stdout as any).write = capturedWrite;
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      (process.stderr as any).write = capturedWrite;
+
+      try {
+        const tokens = parseTokens(input);
+        const prog = createProgram();
+        prog.exitOverride();
+        prog.configureOutput({
+          writeOut: (str: string) => process.stdout.write(str),
+          writeErr: (str: string) => process.stderr.write(str),
+        });
+
+        await prog.parseAsync(["node", "arc402", ...tokens]);
+      } catch (err) {
+        const e = err as { code?: string; message?: string };
+        if (
+          e.code === "commander.helpDisplayed" ||
+          e.code === "commander.version" ||
+          e.code === "commander.executeSubCommandAsync"
+        ) {
+          // already written or normal exit — no-op
+        } else if (e.code === "commander.unknownCommand") {
+          const tokens = parseTokens(input);
+          onLine(
+            ` ${c.failure} ${chalk.red(`Unknown command: ${chalk.white(tokens[0])}`)} `
+          );
+          onLine(chalk.dim("  Type 'help' for available commands"));
+        } else if (e.code?.startsWith("commander.")) {
+          onLine(` ${c.failure} ${chalk.red(e.message ?? String(err))}`);
+        } else {
+          onLine(` ${c.failure} ${chalk.red(e.message ?? String(err))}`);
+        }
+      } finally {
+        // Flush remaining buffer
+        if (captureBuffer.trim()) {
+          onLine(captureBuffer);
+          captureBuffer = "";
+        }
+
+        // Restore original write functions
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        (process.stdout as any).write = originalStdoutWrite;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        (process.stderr as any).write = originalStderrWrite;
+
+        setIsRunning(false);
       }
-
-      setIsRunning(false);
     },
     []
   );
@@ -75,138 +110,6 @@ export function useCommand(): UseCommandResult {
   return { execute, isRunning };
 }
 
-/**
- * Run an interactive command as a child process with inherited stdin.
- * Ink is temporarily suspended so the child can own the terminal.
- */
-async function executeInteractive(
-  input: string,
-  onLine: (line: string) => void
-): Promise<void> {
-  const tokens = parseTokens(input);
-
-  onLine(chalk.dim("  ◈ Launching interactive session..."));
-  onLine("");
-
-  return new Promise<void>((resolve) => {
-    // Spawn arc402 as a child process with full terminal access.
-    // Use stdio: 'inherit' so the child owns stdin/stdout/stderr directly.
-    // This means its output goes straight to the terminal (not captured in viewport)
-    // but that's correct — the child needs raw terminal access for QR codes, prompts, etc.
-    const child = spawn(
-      process.execPath,
-      [process.argv[1], ...tokens],
-      {
-        stdio: "inherit",
-        env: { ...process.env, ARC402_NO_TUI: "1" }, // prevent child from launching its own TUI
-        cwd: process.cwd(),
-      }
-    );
-
-    child.on("close", (code) => {
-      onLine("");
-      if (code === 0) {
-        onLine(` ${c.success} ${chalk.dim("Command completed")}`);
-      } else {
-        onLine(` ${c.failure} ${chalk.red(`Command exited with code ${code}`)}`);
-      }
-      resolve();
-    });
-
-    child.on("error", (err) => {
-      onLine(` ${c.failure} ${chalk.red(`Failed to spawn: ${err.message}`)}`);
-      resolve();
-    });
-  });
-}
-
-/**
- * Run a non-interactive command in-process with captured output.
- */
-async function executeInProcess(
-  input: string,
-  onLine: (line: string) => void
-): Promise<void> {
-  // Capture stdout/stderr
-  const originalStdoutWrite = process.stdout.write.bind(process.stdout);
-  const originalStderrWrite = process.stderr.write.bind(process.stderr);
-
-  let captureBuffer = "";
-
-  const flushBuffer = (): void => {
-    if (!captureBuffer) return;
-    const lines = captureBuffer.split("\n");
-    captureBuffer = lines.pop() ?? "";
-    for (const line of lines) {
-      onLine(line);
-    }
-  };
-
-  const capturedWrite = (
-    chunk: string | Uint8Array,
-    encodingOrCb?: BufferEncoding | ((err?: Error | null) => void),
-    cb?: (err?: Error | null) => void
-  ): boolean => {
-    const str =
-      typeof chunk === "string"
-        ? chunk
-        : Buffer.from(chunk).toString("utf8");
-    captureBuffer += str;
-    flushBuffer();
-    const callback =
-      typeof encodingOrCb === "function" ? encodingOrCb : cb;
-    if (callback) callback();
-    return true;
-  };
-
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  (process.stdout as any).write = capturedWrite;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  (process.stderr as any).write = capturedWrite;
-
-  try {
-    const tokens = parseTokens(input);
-    const prog = createProgram();
-    prog.exitOverride();
-    prog.configureOutput({
-      writeOut: (str) => process.stdout.write(str),
-      writeErr: (str) => process.stderr.write(str),
-    });
-
-    await prog.parseAsync(["node", "arc402", ...tokens]);
-  } catch (err) {
-    const e = err as { code?: string; message?: string };
-    if (
-      e.code === "commander.helpDisplayed" ||
-      e.code === "commander.version" ||
-      e.code === "commander.executeSubCommandAsync"
-    ) {
-      // already written or normal exit — no-op
-    } else if (e.code === "commander.unknownCommand") {
-      const tokens = parseTokens(input);
-      onLine(
-        ` ${c.failure} ${chalk.red(`Unknown command: ${chalk.white(tokens[0])}`)} `
-      );
-      onLine(chalk.dim("  Type 'help' for available commands"));
-    } else if (e.code?.startsWith("commander.")) {
-      onLine(` ${c.failure} ${chalk.red(e.message ?? String(err))}`);
-    } else {
-      onLine(` ${c.failure} ${chalk.red(e.message ?? String(err))}`);
-    }
-  } finally {
-    // Flush remaining buffer
-    if (captureBuffer.trim()) {
-      onLine(captureBuffer);
-      captureBuffer = "";
-    }
-
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    (process.stdout as any).write = originalStdoutWrite;
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    (process.stderr as any).write = originalStderrWrite;
-  }
-}
-
 // Shell-style tokenizer
 function parseTokens(input: string): string[] {
   const tokens: string[] = [];

package/src/ui/banner.ts

@@ -1,7 +1,7 @@
+import { createRequire } from "node:module";
 import chalk from "chalk";
 
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const _pkg = require("../../package.json") as { version: string };
+const _pkg = createRequire(import.meta.url)("../../package.json") as { version: string };
 
 const ART = `
  ██████╗ ██████╗  ██████╗      ██╗  ██╗ ██████╗ ██████╗

package/src/ui/tree.ts

@@ -1,4 +1,4 @@
-import { c } from "./colors";
+import { c } from "./colors.js";
 
 export interface TreeItem {
   label: string;

package/src/wallet-router.ts

@@ -1,6 +1,6 @@
 import { ethers } from "ethers";
-import { Arc402Config } from "./config";
-import { ARC402_WALLET_EXECUTE_ABI } from "./abis";
+import { Arc402Config } from "./config.js";
+import { ARC402_WALLET_EXECUTE_ABI } from "./abis.js";
 
 // ─── ARC402Wallet custom error decoder ─────────────────────────────────────
 

package/src/walletconnect-session.ts

@@ -1,4 +1,4 @@
-import { Arc402Config, saveConfig } from "./config";
+import { Arc402Config, saveConfig } from "./config.js";
 
 export interface WCSessionData {
   topic: string;

package/src/walletconnect.ts

@@ -3,9 +3,9 @@ import { KeyValueStorage } from "@walletconnect/keyvaluestorage";
 import qrcode from "qrcode-terminal";
 import path from "path";
 import os from "os";
-import { Arc402Config } from "./config";
-import { loadWCSession, saveWCSession, clearWCSession } from "./walletconnect-session";
-import { sendWalletConnectApprovalButton } from "./telegram-notify";
+import { Arc402Config } from "./config.js";
+import { loadWCSession, saveWCSession, clearWCSession } from "./walletconnect-session.js";
+import { sendWalletConnectApprovalButton } from "./telegram-notify.js";
 
 // Suppress unhandled rejections from stale WalletConnect sessions (known SDK issue)
 process.on("unhandledRejection", (reason: unknown) => {
@@ -54,11 +54,16 @@ function walletLinks(encodedUri: string) {
  * On fresh connect, shows deep links + QR and waits for WC approval.
  * Saves session to config after a successful fresh pairing.
  */
+export type WCCallbacks = {
+  onUri?: (uri: string, links: Record<string, string>) => void;
+  onStatus?: (status: "connecting" | "connected" | "chain-switching" | "ready" | "error", detail?: string) => void;
+};
+
 export async function connectPhoneWallet(
   projectId: string,
   chainId: number,
   config: Arc402Config,
-  opts?: { telegramOpts?: TelegramOpts; prompt?: string; hardware?: boolean }
+  opts?: { telegramOpts?: TelegramOpts; prompt?: string; hardware?: boolean; callbacks?: WCCallbacks }
 ): Promise<{ client: SignClientT; session: WCSession; account: string }> {
   const client = await makeSignClient(projectId);
 
@@ -99,8 +104,13 @@ export async function connectPhoneWallet(
 
   const encodedUri = encodeURIComponent(uri);
   const displayPrompt = opts?.prompt ?? "Connect your phone wallet";
+  const cbs = opts?.callbacks;
 
-  if (opts?.hardware) {
+  if (cbs?.onUri) {
+    // Callback mode — let the caller handle rendering (e.g. Ink TUI)
+    cbs.onUri(uri, walletLinks(encodedUri));
+    cbs.onStatus?.("connecting");
+  } else if (opts?.hardware) {
     console.log("\n─────────────────────────────────────────────────────");
     console.log("Paste this URI into Ledger Live, Trezor Suite, or any WalletConnect-compatible signer:\n");
     console.log(uri);
@@ -137,10 +147,12 @@ export async function connectPhoneWallet(
 
   const session = await approval();
   const account = session.namespaces.eip155.accounts[0].split(":")[2];
+  cbs?.onStatus?.("connected", account);
 
   // Ensure wallet is on the correct chain before sending any tx
   const hexChainId = `0x${chainId.toString(16)}`;
   const networkName = chainId === 8453 ? "Base" : chainId === 84532 ? "Base Sepolia" : `chain ${chainId}`;
+  cbs?.onStatus?.("chain-switching", networkName);
 
   // First try adding the chain (MetaMask ignores if already added)
   if (chainId === 8453) {
@@ -175,12 +187,15 @@ export async function connectPhoneWallet(
     }
   }
   if (!chainSwitched) {
+    cbs?.onStatus?.("error", `Could not auto-switch to ${networkName}`);
     console.log(`\n⚠ Could not auto-switch to ${networkName}. IMPORTANT: Switch to ${networkName} in your wallet NOW before approving the next transaction.`);
     console.log(`  Otherwise the transaction will go to Ethereum mainnet and fail.`);
     // Give user 5 seconds to read the warning and switch
     await new Promise(r => setTimeout(r, 5000));
   }
 
+  cbs?.onStatus?.("ready", account);
+
   // Persist session (WC sessions last 7 days by default)
   const expiry = Math.floor(Date.now() / 1000) + 7 * 24 * 60 * 60;
   saveWCSession(config, { topic: session.topic, expiry, account, chainId });

package/tsconfig.json

@@ -1,8 +1,11 @@
 {
   "compilerOptions": {
-    "target": "ES2020",
-    "module": "commonjs",
-    "lib": ["ES2020"],
+    "target": "ES2022",
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "lib": [
+      "ES2022"
+    ],
     "jsx": "react-jsx",
     "outDir": "./dist",
     "rootDir": "./src",
@@ -15,10 +18,16 @@
     "declarationMap": true,
     "sourceMap": true,
     "paths": {
-      "ink": ["./node_modules/ink/build/index.d.ts"],
-      "ink-text-input": ["./node_modules/ink-text-input/build/index.d.ts"]
+      "ethers": [
+        "./node_modules/ethers/lib.commonjs/index.d.ts"
+      ]
     }
   },
-  "include": ["src/**/*"],
-  "exclude": ["node_modules", "dist"]
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist"
+  ]
 }