wave-code 1.2.0 → 1.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wave-code",
-  "version": "1.2.0",
+  "version": "1.4.0",
   "description": "CLI-based code assistant powered by AI, built with React and Ink",
   "repository": {
     "type": "git",
@@ -28,9 +28,12 @@
     "README.md"
   ],
   "dependencies": {
-    "@vscode/ripgrep": "^1.18.0"
+    "@vscode/ripgrep": "^1.18.0",
+    "qrcode": "^1.5.4",
+    "sharp": "^0.35.4"
   },
   "devDependencies": {
+    "@types/qrcode": "^1.5.6",
     "@types/react": "^19.1.8",
     "@types/semver": "^7.7.1",
     "@types/yargs": "^17.0.0",
@@ -56,7 +59,7 @@
     "wrap-ansi": "^10.0.0",
     "yargs": "^17.7.2",
     "zod": "^3.23.8",
-    "wave-agent-sdk": "1.2.0"
+    "wave-agent-sdk": "1.4.0"
   },
   "engines": {
     "node": ">=22"

package/src/cli.tsx

@@ -1,5 +1,6 @@
 import React from "react";
 import { render } from "ink";
+import { ensureRuntimeDeps } from "wave-agent-sdk";
 import { App } from "./components/App.js";
 import { cleanupLogs } from "./utils/logger.js";
 import { removeWorktree } from "./utils/worktree.js";
@@ -11,6 +12,14 @@ export interface CliOptions extends BaseAppProps {
 }
 
 export async function startCli(options: CliOptions): Promise<void> {
+  // Install the on-demand runtime dependencies (image codec + ripgrep) before
+  // the UI comes up. Waiting is the point: pasting an image or running a search
+  // a second later must not race a download. Costs ~16ms once they are
+  // installed (marker hit), ~6MB/20MB worth of time on the first run of a
+  // host-bundled CLI. A failed download only degrades the affected tool — never
+  // throws.
+  await ensureRuntimeDeps();
+
   const {
     restoreSessionId,
     continueLastSession,

package/src/commands/plugin/install.ts

@@ -8,17 +8,16 @@ export async function installPluginCommand(argv: {
   const pluginCore = new PluginCore(workdir);
 
   try {
-    const installed = await pluginCore.installPlugin(argv.plugin);
+    // When no scope is given, default to user scope (matches Claude Code).
+    const scope = argv.scope ?? "user";
+    const installed = await pluginCore.installPlugin(argv.plugin, scope);
     console.log(
       `Successfully installed plugin: ${installed.name} v${installed.version} from ${installed.marketplace}`,
     );
     console.log(`Cache path: ${installed.cachePath}`);
-
-    // When no scope is given, default to user scope (matches Claude Code).
-    const scope = argv.scope ?? "user";
-    const pluginId = `${installed.name}@${installed.marketplace}`;
-    await pluginCore.enablePlugin(pluginId, scope);
-    console.log(`Plugin ${pluginId} enabled in ${scope} scope`);
+    console.log(
+      `Plugin ${installed.name}@${installed.marketplace} enabled in ${scope} scope`,
+    );
 
     process.exit(0);
   } catch (error) {

package/src/commands/plugin/uninstall.ts

@@ -1,13 +1,19 @@
-import { PluginCore } from "wave-agent-sdk";
+import { PluginCore, Scope } from "wave-agent-sdk";
 
-export async function uninstallPluginCommand(argv: { plugin: string }) {
+export async function uninstallPluginCommand(argv: {
+  plugin: string;
+  scope?: Scope;
+}) {
   const workdir = process.cwd();
   const pluginCore = new PluginCore(workdir);
 
   try {
-    await pluginCore.uninstallPlugin(argv.plugin);
-    console.log(`Successfully uninstalled plugin: ${argv.plugin}`);
-    console.log(`Cleaned up plugin configuration from all scopes`);
+    // Only the given scope is uninstalled (spec plugin A-015). Without --scope
+    // the core picks the scope the plugin is enabled in for this directory.
+    const scope = await pluginCore.uninstallPlugin(argv.plugin, argv.scope);
+    console.log(
+      `Successfully uninstalled plugin: ${argv.plugin} (scope: ${scope})`,
+    );
     process.exit(0);
   } catch (error) {
     const message = error instanceof Error ? error.message : String(error);

package/src/commands/update.ts

@@ -1,32 +1,70 @@
 import { spawn, spawnSync } from "child_process";
-import https from "https";
 import chalk from "chalk";
 import { isUpdateAvailable } from "../utils/version.js";
 import { readNearestPackageJson } from "../utils/readPackageJson.js";
 
 const currentVersion = readNearestPackageJson().version;
 
-async function getLatestVersion(): Promise<string> {
-  return new Promise((resolve, reject) => {
-    https
-      .get("https://registry.npmjs.org/wave-code/latest", (res) => {
-        let data = "";
-        res.on("data", (chunk) => {
-          data += chunk;
-        });
-        res.on("end", () => {
-          try {
-            const json = JSON.parse(data);
-            resolve(json.version);
-          } catch {
-            reject(new Error("Failed to parse npm registry response"));
-          }
-        });
-      })
-      .on("error", (err) => {
-        reject(err);
-      });
+/** npm registry mirror for China users (the CLI downloads its runtime deps from the same one). */
+const REGISTRY_MIRROR = "https://registry.npmmirror.com";
+/** Official registry — the fallback when the mirror is unreachable. */
+const REGISTRY_OFFICIAL = "https://registry.npmjs.org";
+/** Cap each registry request so a hanging one cannot stall the fallback. */
+const REGISTRY_TIMEOUT_MS = 5000;
+
+interface LatestVersion {
+  version: string;
+  /** The registry that answered — the install reuses it (see getLatestVersion). */
+  registry: string;
+}
+
+async function fetchLatestVersion(registry: string): Promise<string> {
+  const response = await fetch(`${registry}/wave-code/latest`, {
+    signal: AbortSignal.timeout(REGISTRY_TIMEOUT_MS),
   });
+  if (!response.ok) {
+    throw new Error(
+      `HTTP ${response.status} fetching ${registry}/wave-code/latest`,
+    );
+  }
+  const json = (await response.json()) as { version?: string };
+  if (!json.version) {
+    throw new Error(`No version in the response from ${registry}`);
+  }
+  return json.version;
+}
+
+/**
+ * The mirror answers first so the check is fast in CN; the official registry is
+ * a silent fallback so an unreachable mirror never blocks the check.
+ *
+ * The install reuses whichever registry answered: a machine that can only reach
+ * the official registry would fail the install for the very reason the check
+ * fell back.
+ */
+async function getLatestVersion(): Promise<LatestVersion> {
+  try {
+    return {
+      version: await fetchLatestVersion(REGISTRY_MIRROR),
+      registry: REGISTRY_MIRROR,
+    };
+  } catch (mirrorError) {
+    try {
+      return {
+        version: await fetchLatestVersion(REGISTRY_OFFICIAL),
+        registry: REGISTRY_OFFICIAL,
+      };
+    } catch (officialError) {
+      throw new Error(
+        `Could not reach ${REGISTRY_MIRROR} (${errorText(mirrorError)}) ` +
+          `or ${REGISTRY_OFFICIAL} (${errorText(officialError)})`,
+      );
+    }
+  }
+}
+
+function errorText(error: unknown): string {
+  return error instanceof Error ? error.message : String(error);
 }
 
 function detectPackageManager(): "npm" | "pnpm" | "yarn" {
@@ -53,7 +91,7 @@ export async function updateCommand() {
   console.log(chalk.dim(`Current version: ${currentVersion}`));
 
   try {
-    const latestVersion = await getLatestVersion();
+    const { version: latestVersion, registry } = await getLatestVersion();
     console.log(chalk.dim(`Latest version: ${latestVersion}`));
 
     if (!isUpdateAvailable(currentVersion, latestVersion)) {
@@ -79,6 +117,8 @@ export async function updateCommand() {
       updateCmd = "npm";
       args = ["install", "-g", "wave-code@latest"];
     }
+    // Appended once so every package manager (including a future branch) gets it.
+    args.push(`--registry=${registry}`);
 
     console.log(chalk.blue(`Updating WAVE Code using ${packageManager}...`));
     console.log(chalk.dim(`Running: ${updateCmd} ${args.join(" ")}`));

package/src/components/BackgroundTaskManager.tsx

@@ -6,6 +6,10 @@ import {
   backgroundTaskManagerReducer,
   type BackgroundTaskManagerState,
 } from "../reducers/backgroundTaskManagerReducer.js";
+import WorkflowRunDetail, {
+  formatDuration,
+  formatTime,
+} from "./WorkflowRunDetail.js";
 
 export interface BackgroundTaskManagerProps {
   onCancel: () => void;
@@ -14,8 +18,12 @@ export interface BackgroundTaskManagerProps {
 export const BackgroundTaskManager: React.FC<BackgroundTaskManagerProps> = ({
   onCancel,
 }) => {
-  const { backgroundTasks, getBackgroundTaskOutput, stopBackgroundTask } =
-    useChat();
+  const {
+    backgroundTasks,
+    workflowRuns,
+    getBackgroundTaskOutput,
+    stopBackgroundTask,
+  } = useChat();
   const MAX_VISIBLE_ITEMS = 3;
 
   const [state, dispatch] = useReducer(backgroundTaskManagerReducer, {
@@ -71,18 +79,6 @@ export const BackgroundTaskManager: React.FC<BackgroundTaskManagerProps> = ({
     }
   }, [viewMode, detailTaskId, getBackgroundTaskOutput]);
 
-  const formatDuration = (ms: number): string => {
-    if (ms < 1000) return `${ms}ms`;
-    if (ms < 60000) return `${Math.round(ms / 1000)}s`;
-    const minutes = Math.floor(ms / 60000);
-    const seconds = Math.round((ms % 60000) / 1000);
-    return `${minutes}m ${seconds}s`;
-  };
-
-  const formatTime = (timestamp: number): string => {
-    return new Date(timestamp).toLocaleTimeString();
-  };
-
   // Calculate visible window
   const startIndex = Math.max(
     0,
@@ -104,6 +100,15 @@ export const BackgroundTaskManager: React.FC<BackgroundTaskManagerProps> = ({
       return null;
     }
 
+    // A workflow background task's id IS its run id, so a workflow task can show
+    // real progress instead of the (always empty) text output: the same run
+    // fields `/workflows` shows, via the same component. Absent run (e.g. the
+    // session was cleared) falls back to the plain task detail below.
+    const selectedRun =
+      task.type === "workflow"
+        ? (workflowRuns.find((r) => r.runId === task.id) ?? null)
+        : null;
+
     return (
       <Box
         flexDirection="column"
@@ -134,53 +139,70 @@ export const BackgroundTaskManager: React.FC<BackgroundTaskManagerProps> = ({
               </Text>
             </Box>
           )}
-          <Box>
-            <Text>
-              <Text color="blue">Status:</Text> {task.status}
-              {task.exitCode !== undefined && ` (exit code: ${task.exitCode})`}
-            </Text>
-          </Box>
-          <Box>
-            <Text>
-              <Text color="blue">Started:</Text> {formatTime(task.startTime)}
-              {task.runtime !== undefined && (
+          {/* With the run block below, the task's own status and start time
+              would repeat it — the run is the authority on how far the
+              workflow got. The header keeps only what identifies the task. */}
+          {!selectedRun && (
+            <>
+              <Box>
                 <Text>
-                  {" "}
-                  | <Text color="blue">Runtime:</Text>{" "}
-                  {formatDuration(task.runtime)}
+                  <Text color="blue">Status:</Text> {task.status}
+                  {task.exitCode !== undefined &&
+                    ` (exit code: ${task.exitCode})`}
+                </Text>
+              </Box>
+              <Box>
+                <Text>
+                  <Text color="blue">Started:</Text>{" "}
+                  {formatTime(task.startTime)}
+                  {task.runtime !== undefined && (
+                    <Text>
+                      {" "}
+                      | <Text color="blue">Runtime:</Text>{" "}
+                      {formatDuration(task.runtime)}
+                    </Text>
+                  )}
                 </Text>
+              </Box>
+              {task.outputPath && (
+                <Box>
+                  <Text>
+                    <Text color="blue">Log File:</Text> {task.outputPath}
+                  </Text>
+                </Box>
               )}
-            </Text>
-          </Box>
-          {task.outputPath && (
-            <Box>
-              <Text>
-                <Text color="blue">Log File:</Text> {task.outputPath}
-              </Text>
-            </Box>
+            </>
           )}
         </Box>
 
-        {detailOutput.stdout && (
-          <Box flexDirection="column" marginTop={1}>
-            <Text color="green" bold>
-              OUTPUT (last 10 lines):
-            </Text>
-            <Box borderStyle="single" borderColor="green" padding={1}>
-              <Text>{getLastLines(detailOutput.stdout, 10)}</Text>
-            </Box>
-          </Box>
-        )}
+        {selectedRun ? (
+          <WorkflowRunDetail run={selectedRun} />
+        ) : (
+          <>
+            {detailOutput.stdout && (
+              <Box flexDirection="column" marginTop={1}>
+                <Text color="green" bold>
+                  OUTPUT (last 10 lines):
+                </Text>
+                <Box borderStyle="single" borderColor="green" padding={1}>
+                  <Text>{getLastLines(detailOutput.stdout, 10)}</Text>
+                </Box>
+              </Box>
+            )}
 
-        {detailOutput.stderr && (
-          <Box flexDirection="column" marginTop={1}>
-            <Text color="red" bold>
-              ERRORS:
-            </Text>
-            <Box borderStyle="single" borderColor="red" padding={1}>
-              <Text color="red">{getLastLines(detailOutput.stderr, 10)}</Text>
-            </Box>
-          </Box>
+            {detailOutput.stderr && (
+              <Box flexDirection="column" marginTop={1}>
+                <Text color="red" bold>
+                  ERRORS:
+                </Text>
+                <Box borderStyle="single" borderColor="red" padding={1}>
+                  <Text color="red">
+                    {getLastLines(detailOutput.stderr, 10)}
+                  </Text>
+                </Box>
+              </Box>
+            )}
+          </>
         )}
 
         <Box marginTop={1}>

package/src/components/ChatInterface.tsx

@@ -132,6 +132,7 @@ export const ChatInterface: React.FC = () => {
             toolInput={confirmingTool!.input}
             suggestedPrefix={confirmingTool!.suggestedPrefix}
             hidePersistentOption={confirmingTool!.hidePersistentOption}
+            outsideSafeZoneDirectory={confirmingTool!.outsideSafeZoneDirectory}
             permissionMode={confirmingTool!.permissionMode}
             isExpanded={isExpanded}
             onDecision={handleConfirmationDecision}

package/src/components/ConfirmationDetails.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import { Box, Text, useInput } from "ink";
+import { Box, Text, useInput, useStdout } from "ink";
 import {
   BASH_TOOL_NAME,
   EDIT_TOOL_NAME,
@@ -10,6 +10,8 @@ import {
   ARTIFACT_TOOL_NAME,
 } from "wave-agent-sdk";
 import { buildDiffLinesFromParams } from "./DiffDisplay.js";
+import { renderMarkdownToAnsi } from "./Markdown.js";
+import { ScrolledContent } from "./ScrolledContent.js";
 import { highlightToAnsi } from "../utils/highlightUtils.js";
 
 // Helper function to generate descriptive action text
@@ -35,7 +37,24 @@ const getActionDescription = (
     case ASK_USER_QUESTION_TOOL_NAME:
       return "Answer questions to clarify intent";
     case ARTIFACT_TOOL_NAME:
-      return `Publish file: ${toolInput.file_path || "unknown file"}`;
+      switch (toolInput.action) {
+        case "list":
+          return `List artifacts (scope: ${toolInput.scope || "mine"})`;
+        case "upload_asset":
+          return `Upload asset: ${toolInput.file_path || "unknown file"}`;
+        case "list_assets":
+          return `List assets of artifact: ${toolInput.url || "unknown artifact"}`;
+        case "read_asset":
+          return `Read asset: ${toolInput.asset_id || "unknown asset"}`;
+        case "delete_asset":
+          return `Delete asset: ${toolInput.asset_id || "unknown asset"}`;
+        case "copy_from":
+          return `Copy assets into artifact: ${toolInput.url || "unknown artifact"}`;
+        case "read":
+          return `Read artifact: ${toolInput.url || "unknown artifact"}`;
+        default:
+          return `Publish file: ${toolInput.file_path || "unknown file"}`;
+      }
     default:
       return "Execute operation";
   }
@@ -68,6 +87,11 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
     (toolInput?.startLineNumber as number | undefined) ??
     (toolName === WRITE_TOOL_NAME ? 1 : undefined);
 
+  // Terminal width is needed to render the plan's Markdown (table column widths
+  // are computed from it), matching <Markdown>'s own default.
+  const { stdout } = useStdout();
+  const columns = stdout?.columns ?? 80;
+
   const headerRows = 2 + (warning ? 1 : 0);
 
   // Number of content rows rendered at once. The header stays fixed above the
@@ -117,12 +141,17 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
     toolName === EXIT_PLAN_MODE_TOOL_NAME &&
     !!planContent;
 
+  // The plan is Markdown (the agent writes it to a .md file), so it is rendered
+  // with the same renderer as assistant messages and then linearized into rows
+  // for the row-slicing scroll above — same treatment as the JSON/diff rows.
   const planLines = showPlan
-    ? planContent!.split("\n").map((line, index) => (
-        <Box key={`plan-${index}`}>
-          <Text>{line || " "}</Text>
-        </Box>
-      ))
+    ? renderMarkdownToAnsi(planContent!, columns)
+        .split("\n")
+        .map((line, index) => (
+          <Box key={`plan-${index}`}>
+            <Text>{line || " "}</Text>
+          </Box>
+        ))
     : [];
 
   const contentLines: React.ReactNode[] = [
@@ -130,9 +159,11 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
     ...jsonLines,
     ...planLines,
   ];
-  const totalLines = contentLines.length;
-  const maxScroll = Math.max(0, totalLines - visibleCount);
 
+  // Rows really occupied by the content (wrapped rows included), measured after
+  // layout by <ScrolledContent> — see that component for why it is measured
+  // instead of counted from the row array.
+  const [contentRows, setContentRows] = useState(0);
   const [scrollOffset, setScrollOffset] = useState(0);
 
   // Reset scrolling when a new confirmation appears.
@@ -140,6 +171,8 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
     setScrollOffset(0);
   }, [toolName, toolInput, planContent]);
 
+  const maxScroll = Math.max(0, contentRows - visibleCount);
+
   const halfPage = Math.max(1, Math.ceil(visibleCount / 2));
   useInput((input, key) => {
     if (key.pageUp) {
@@ -159,12 +192,8 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
   });
 
   const clampedOffset = Math.min(scrollOffset, maxScroll);
-  const visibleLines = contentLines.slice(
-    clampedOffset,
-    clampedOffset + visibleCount,
-  );
   const hasMoreAbove = clampedOffset > 0;
-  const hasMoreBelow = clampedOffset + visibleCount < totalLines;
+  const hasMoreBelow = clampedOffset + visibleCount < contentRows;
 
   return (
     <Box
@@ -195,11 +224,17 @@ export const ConfirmationDetails: React.FC<ConfirmationDetailsProps> = ({
           </Text>
         </Box>
       )}
-      {visibleLines}
+      <ScrolledContent
+        visibleRows={visibleCount}
+        scrollOffset={clampedOffset}
+        onMeasuredRows={setContentRows}
+      >
+        {contentLines}
+      </ScrolledContent>
       {hasMoreBelow && (
         <Box>
           <Text color="gray" dimColor>
-            ↓ {totalLines - clampedOffset - visibleCount} more
+            ↓ {contentRows - clampedOffset - visibleCount} more
           </Text>
         </Box>
       )}

package/src/components/ConfirmationSelector.tsx

@@ -7,8 +7,10 @@ import type {
 } from "wave-agent-sdk";
 import {
   BASH_TOOL_NAME,
+  EDIT_TOOL_NAME,
   EXIT_PLAN_MODE_TOOL_NAME,
   ENTER_PLAN_MODE_TOOL_NAME,
+  WRITE_TOOL_NAME,
   ASK_USER_QUESTION_TOOL_NAME,
 } from "wave-agent-sdk";
 import { confirmationReducer } from "../reducers/confirmationReducer.js";
@@ -24,11 +26,19 @@ const getHeaderColor = (header: string) => {
   return colors[Math.abs(hash) % colors.length];
 };
 
+/** Last path segment of a directory path (handles both `/` and `\` separators). */
+const lastPathSegment = (dirPath: string): string => {
+  const segments = dirPath.split(/[\\/]/).filter(Boolean);
+  return segments[segments.length - 1] ?? dirPath;
+};
+
 export interface ConfirmationSelectorProps {
   toolName: string;
   toolInput?: Record<string, unknown>;
   suggestedPrefix?: string;
   hidePersistentOption?: boolean;
+  /** Directory holding an out-of-Safe-Zone Write/Edit target, when the host reports one. */
+  outsideSafeZoneDirectory?: string;
   permissionMode?: PermissionMode;
   isExpanded?: boolean;
   onDecision: (decision: PermissionDecision) => void;
@@ -40,6 +50,7 @@ export const ConfirmationSelector: React.FC<ConfirmationSelectorProps> = ({
   toolInput,
   suggestedPrefix,
   hidePersistentOption,
+  outsideSafeZoneDirectory,
   permissionMode,
   isExpanded = false,
   onDecision,
@@ -104,6 +115,15 @@ export const ConfirmationSelector: React.FC<ConfirmationSelectorProps> = ({
     return "Yes, and auto-accept edits";
   };
 
+  // Only Write/Edit can be out of the Safe Zone, and the host only reports the
+  // directory for such requests.
+  const showAddDirectoryOption =
+    (toolName === EDIT_TOOL_NAME || toolName === WRITE_TOOL_NAME) &&
+    !!outsideSafeZoneDirectory;
+  const addDirectoryOptionText = `Yes, and allow all edits in ${lastPathSegment(
+    outsideSafeZoneDirectory ?? "",
+  )}/ this session`;
+
   const pasteDetectorRef = useRef(createBracketedPasteDetector());
 
   useInput((input, key) => {
@@ -140,6 +160,7 @@ export const ConfirmationSelector: React.FC<ConfirmationSelectorProps> = ({
         toolInput,
         suggestedPrefix,
         hidePersistentOption,
+        outsideSafeZoneDirectory,
         permissionMode,
       });
     }
@@ -248,6 +269,24 @@ export const ConfirmationSelector: React.FC<ConfirmationSelectorProps> = ({
                   : "Yes, proceed"}
               </Text>
             </Box>
+            {showAddDirectoryOption && (
+              <Box key="add-directory-option">
+                <Text
+                  color={
+                    state.selectedOption === "addDirectory" ? "black" : "white"
+                  }
+                  backgroundColor={
+                    state.selectedOption === "addDirectory"
+                      ? "yellow"
+                      : undefined
+                  }
+                  bold={state.selectedOption === "addDirectory"}
+                >
+                  {state.selectedOption === "addDirectory" ? "> " : "  "}
+                  {addDirectoryOptionText}
+                </Text>
+              </Box>
+            )}
             {!hidePersistentOption && (
               <Box key="auto-option">
                 <Text