wave-code 1.1.5 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wave-code",
-  "version": "1.1.5",
+  "version": "1.2.0",
   "description": "CLI-based code assistant powered by AI, built with React and Ink",
   "repository": {
     "type": "git",
@@ -56,7 +56,7 @@
     "wrap-ansi": "^10.0.0",
     "yargs": "^17.7.2",
     "zod": "^3.23.8",
-    "wave-agent-sdk": "1.1.5"
+    "wave-agent-sdk": "1.2.0"
   },
   "engines": {
     "node": ">=22"

package/src/commands/plugin/install.ts

@@ -14,11 +14,11 @@ export async function installPluginCommand(argv: {
     );
     console.log(`Cache path: ${installed.cachePath}`);
 
-    if (argv.scope) {
-      const pluginId = `${installed.name}@${installed.marketplace}`;
-      await pluginCore.enablePlugin(pluginId, argv.scope);
-      console.log(`Plugin ${pluginId} enabled in ${argv.scope} scope`);
-    }
+    // 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`);
 
     process.exit(0);
   } catch (error) {

package/src/components/ChatInterface.tsx

@@ -29,6 +29,7 @@ export const ChatInterface: React.FC = () => {
     maxInputTokens,
     slashCommands,
     hasSlashCommand,
+    hooks,
     isConfirmationVisible,
     confirmingTool,
     handleConfirmationDecision,
@@ -109,6 +110,7 @@ export const ChatInterface: React.FC = () => {
             disconnectMcpServer={disconnectMcpServer}
             slashCommands={slashCommands}
             hasSlashCommand={hasSlashCommand}
+            hooks={hooks}
             latestTotalTokens={latestTotalTokens}
             maxInputTokens={maxInputTokens}
             showLoginHint={showLoginHint}

package/src/components/HooksManager.tsx

@@ -0,0 +1,286 @@
+import React, { useEffect, useMemo, useReducer } from "react";
+import { Box, Text, useInput, useStdout } from "ink";
+import {
+  HOOK_EVENT_SUMMARIES,
+  type HookEvent,
+  type HookEventConfig,
+} from "wave-agent-sdk";
+import {
+  hooksManagerReducer,
+  type HooksManagerState,
+} from "../reducers/hooksManagerReducer.js";
+
+export interface HooksManagerProps {
+  onCancel: () => void;
+  /** Hook configs per scope (user/project/plugin settings.json + plugin set). */
+  hooks: Partial<
+    Record<"user" | "project" | "plugin", Record<string, HookEventConfig[]>>
+  >;
+}
+
+interface DisplayEntry {
+  kind: "header" | "hook" | "empty";
+  label: string;
+  sub?: string;
+  scope?: "user" | "project" | "plugin";
+  selectableIndex: number; // -1 for non-selectable rows
+  hook?: {
+    event: string;
+    matcher?: string;
+    config: HookEventConfig;
+  };
+}
+
+const SCOPE_LABELS: Record<"user" | "project" | "plugin", string> = {
+  user: "User hooks",
+  project: "Project hooks",
+  plugin: "Plugin hooks",
+};
+
+const SCOPE_ORDER: Array<"user" | "project" | "plugin"> = [
+  "user",
+  "project",
+  "plugin",
+];
+
+const initialState: HooksManagerState = {
+  selectedIndex: 0,
+  viewMode: "list",
+  pendingEffect: null,
+};
+
+/** Hook name for display: `Event:Matcher` when a matcher is present, else the
+ * event name alone. */
+function formatHookName(event: string, matcher?: string): string {
+  return matcher ? `${event}:${matcher}` : event;
+}
+
+export const HooksManager: React.FC<HooksManagerProps> = ({
+  onCancel,
+  hooks,
+}) => {
+  const [state, dispatch] = useReducer(hooksManagerReducer, initialState);
+  const { stdout } = useStdout();
+
+  // Handle pending effects
+  useEffect(() => {
+    if (!state.pendingEffect) return;
+    const effect = state.pendingEffect;
+    dispatch({ type: "CLEAR_PENDING_EFFECT" });
+    if (effect.type === "CANCEL") {
+      onCancel();
+    }
+  }, [state.pendingEffect, onCancel]);
+
+  // Flatten hooks (grouped by scope) into one navigable list. Headers and
+  // the empty-state line are non-selectable.
+  const entries = useMemo<DisplayEntry[]>(() => {
+    const result: DisplayEntry[] = [];
+    let selectableCount = 0;
+
+    result.push({ kind: "header", label: "HOOKS", selectableIndex: -1 });
+    let hookCount = 0;
+    for (const scope of SCOPE_ORDER) {
+      const scoped = hooks[scope] ?? {};
+      const rows: DisplayEntry[] = [];
+      for (const [event, configs] of Object.entries(scoped)) {
+        for (const config of configs ?? []) {
+          const matcher = config.matcher;
+          const name = formatHookName(event, matcher);
+          rows.push({
+            kind: "hook",
+            label: name,
+            sub:
+              HOOK_EVENT_SUMMARIES[event as HookEvent] ??
+              config.hooks[0]?.command,
+            scope,
+            selectableIndex: selectableCount++,
+            hook: { event, matcher, config },
+          });
+        }
+      }
+      if (rows.length === 0) continue;
+      result.push({
+        kind: "header",
+        label: SCOPE_LABELS[scope],
+        scope,
+        selectableIndex: -1,
+      });
+      result.push(...rows);
+      hookCount += rows.length;
+    }
+    if (hookCount === 0) {
+      result.push({
+        kind: "empty",
+        label: "No hooks configured",
+        selectableIndex: -1,
+      });
+    }
+
+    return result;
+  }, [hooks]);
+
+  const itemCount = entries.filter((e) => e.selectableIndex >= 0).length;
+
+  // Window slice: center the selected item within the visible area, clamping
+  // to the terminal's available rows (reusable pattern from
+  // AgentsManager/SkillsManager).
+  const availableRows = stdout?.rows ?? 24;
+  const maxVisible = Math.max(3, Math.min(15, availableRows - 12));
+  const selectedFlatIndex = entries.findIndex(
+    (e) => e.selectableIndex === state.selectedIndex,
+  );
+  const startIndex = Math.max(
+    0,
+    Math.min(
+      selectedFlatIndex - Math.floor(maxVisible / 2),
+      Math.max(0, entries.length - maxVisible),
+    ),
+  );
+  const visibleEntries = entries.slice(startIndex, startIndex + maxVisible);
+
+  useInput((input, key) => {
+    dispatch({ type: "HANDLE_KEY", input, key, itemCount });
+  });
+
+  const selectedEntry = entries.find(
+    (e) => e.selectableIndex === state.selectedIndex,
+  );
+
+  // Detail view — body renders fully expanded with no height limit, no
+  // clipping and no scrolling (aligned with AgentsManager/SkillsManager).
+  if (state.viewMode === "detail" && selectedEntry?.hook) {
+    const { event, matcher, config } = selectedEntry.hook;
+    const summary = HOOK_EVENT_SUMMARIES[event as HookEvent];
+    return (
+      <Box
+        flexDirection="column"
+        borderStyle="single"
+        borderColor="cyan"
+        borderBottom={false}
+        borderLeft={false}
+        borderRight={false}
+        paddingTop={1}
+        gap={1}
+      >
+        <Box>
+          <Text color="cyan" bold>
+            Hook: {formatHookName(event, matcher)}
+          </Text>
+        </Box>
+
+        <Box flexDirection="column" gap={1}>
+          <Box>
+            <Text wrap="wrap">
+              <Text color="blue">Event:</Text> {event}
+              {summary ? ` — ${summary}` : ""}
+            </Text>
+          </Box>
+          {matcher && (
+            <Box>
+              <Text>
+                <Text color="blue">Matcher:</Text> {matcher}
+              </Text>
+            </Box>
+          )}
+          <Box flexDirection="column" gap={0}>
+            <Text color="blue">Commands:</Text>
+            {config.hooks.map((hook, index) => (
+              <Text key={index} wrap="wrap">
+                {index + 1}. {hook.command}
+                {hook.async ? " (async)" : ""}
+                {hook.timeout ? ` (timeout ${hook.timeout}s)` : ""}
+              </Text>
+            ))}
+          </Box>
+        </Box>
+
+        <Box marginTop={1}>
+          <Text dimColor>Esc or Enter to go back</Text>
+        </Box>
+      </Box>
+    );
+  }
+
+  if (itemCount === 0) {
+    return (
+      <Box
+        flexDirection="column"
+        borderStyle="single"
+        borderColor="cyan"
+        borderBottom={false}
+        borderLeft={false}
+        borderRight={false}
+        paddingTop={1}
+      >
+        <Text color="cyan" bold>
+          Hooks
+        </Text>
+        <Text>No hooks configured</Text>
+        <Text dimColor>
+          Configure hooks in the hooks field of ~/.wave/settings.json or
+          .wave/settings.json, or ask Claude to set one up for you
+        </Text>
+        <Text dimColor>Press Escape to close</Text>
+      </Box>
+    );
+  }
+
+  return (
+    <Box
+      flexDirection="column"
+      borderStyle="single"
+      borderColor="cyan"
+      borderBottom={false}
+      borderLeft={false}
+      borderRight={false}
+      paddingTop={1}
+      gap={1}
+    >
+      <Box>
+        <Text color="cyan" bold>
+          Hooks
+        </Text>
+      </Box>
+      <Text dimColor>Select a hook to view details</Text>
+
+      <Box flexDirection="column">
+        {visibleEntries.map((entry, index) => {
+          const isSelected = entry.selectableIndex === state.selectedIndex;
+          if (entry.kind === "header") {
+            return (
+              <Text key={`${entry.kind}-${entry.label}-${index}`} dimColor bold>
+                {entry.label}
+              </Text>
+            );
+          }
+          if (entry.kind === "empty") {
+            return (
+              <Text key={`empty-${index}`} dimColor>
+                {entry.label}
+              </Text>
+            );
+          }
+          return (
+            <Text
+              key={`${entry.kind}-${entry.selectableIndex}`}
+              color={isSelected ? "black" : "white"}
+              backgroundColor={isSelected ? "cyan" : undefined}
+              wrap="truncate-end"
+            >
+              {isSelected ? "▶ " : "  "}
+              {entry.selectableIndex + 1}. {entry.label}
+              {entry.sub ? ` · ${entry.sub}` : ""}
+            </Text>
+          );
+        })}
+      </Box>
+
+      <Box marginTop={1}>
+        <Text dimColor>
+          ↑/↓ to select · Enter to view details · Esc to close
+        </Text>
+      </Box>
+    </Box>
+  );
+};

package/src/components/InputBox.tsx

@@ -8,6 +8,7 @@ import { BackgroundTaskManager } from "./BackgroundTaskManager.js";
 import { McpManager } from "./McpManager.js";
 import { AgentsManager } from "./AgentsManager.js";
 import { SkillsManager } from "./SkillsManager.js";
+import { HooksManager } from "./HooksManager.js";
 import { RewindCommand } from "./RewindCommand.js";
 import { HelpView } from "./HelpView.js";
 import { StatusCommand } from "./StatusCommand.js";
@@ -18,10 +19,15 @@ import { WorkflowManager } from "./WorkflowManager.js";
 import { StatusLine } from "./StatusLine.js";
 import { Notifications } from "./Notifications.js";
 import { BtwDisplay } from "./BtwDisplay.js";
+import { PlanView } from "./PlanView.js";
 import { useInputManager } from "../hooks/useInputManager.js";
 import { useChat } from "../contexts/useChat.js";
 
-import type { McpServerStatus, SlashCommand } from "wave-agent-sdk";
+import type {
+  McpServerStatus,
+  SlashCommand,
+  HookEventConfig,
+} from "wave-agent-sdk";
 
 export const INPUT_PLACEHOLDER_TEXT =
   "Type your message (use /help for more info)...";
@@ -49,6 +55,10 @@ export interface InputBoxProps {
   // Slash Command related properties
   slashCommands?: SlashCommand[];
   hasSlashCommand?: (commandId: string) => boolean;
+  // Hooks related properties (for /hooks overlay)
+  hooks?: Partial<
+    Record<"user" | "project" | "plugin", Record<string, HookEventConfig[]>>
+  >;
   // Token usage
   latestTotalTokens?: number;
   maxInputTokens?: number;
@@ -67,6 +77,7 @@ export const InputBox: React.FC<InputBoxProps> = ({
   disconnectMcpServer = async () => false,
   slashCommands = [],
   hasSlashCommand = () => false,
+  hooks = {},
   latestTotalTokens = 0,
   maxInputTokens = 200000,
   showLoginHint = false,
@@ -93,6 +104,9 @@ export const InputBox: React.FC<InputBoxProps> = ({
     setIsBtwActive,
     agentDefinitions,
     skills,
+    planView,
+    setPlanView,
+    handlePlanCommand,
   } = useChat();
 
   // Ref to hold setInputText so queue callbacks can access it before useInputManager returns
@@ -146,6 +160,7 @@ export const InputBox: React.FC<InputBoxProps> = ({
     showModelSelector,
     showWorkflowManager,
     showSkillsManager,
+    showHooksManager,
     setShowBackgroundTaskManager,
     setShowMcpManager,
     setShowAgentsManager,
@@ -157,6 +172,7 @@ export const InputBox: React.FC<InputBoxProps> = ({
     setShowModelSelector,
     setShowWorkflowManager,
     setShowSkillsManager,
+    setShowHooksManager,
     // Permission mode
     permissionMode,
     setPermissionMode,
@@ -180,6 +196,7 @@ export const InputBox: React.FC<InputBoxProps> = ({
     onAbortMessage: abortMessage,
     onBackgroundCurrentTask: backgroundCurrentTask,
     onPermissionModeChange: setChatPermissionMode,
+    onPlanCommand: handlePlanCommand,
     sessionId,
     workdir: workingDirectory,
     getFullMessageThread,
@@ -211,6 +228,7 @@ export const InputBox: React.FC<InputBoxProps> = ({
     // If they are active, we should skip InputBox's global input handling to avoid
     // duplicate dispatches or state update conflicts.
     if (
+      planView ||
       showRewindManager ||
       showHelp ||
       showStatusCommand ||
@@ -221,7 +239,8 @@ export const InputBox: React.FC<InputBoxProps> = ({
       showMcpManager ||
       showAgentsManager ||
       showWorkflowManager ||
-      showSkillsManager
+      showSkillsManager ||
+      showHooksManager
     ) {
       return;
     }
@@ -324,6 +343,13 @@ export const InputBox: React.FC<InputBoxProps> = ({
         />
       )}
 
+      {showHooksManager && (
+        <HooksManager
+          onCancel={() => setShowHooksManager(false)}
+          hooks={hooks}
+        />
+      )}
+
       {showWorkflowManager && (
         <WorkflowManager onCancel={() => setShowWorkflowManager(false)} />
       )}
@@ -368,56 +394,67 @@ export const InputBox: React.FC<InputBoxProps> = ({
         />
       )}
 
+      {planView && (
+        <PlanView
+          path={planView.path}
+          content={planView.content}
+          message={planView.message}
+          onCancel={() => setPlanView(null)}
+        />
+      )}
+
       {btwState.question || btwState.answer
         ? null
-        : showBackgroundTaskManager ||
-          showMcpManager ||
-          showAgentsManager ||
-          showSkillsManager ||
-          showRewindManager ||
-          showHelp ||
-          showStatusCommand ||
-          showLoginCommand ||
-          showPluginManager ||
-          showModelSelector ||
-          showWorkflowManager || (
-            <Box flexDirection="column">
-              {escClearPending && (
-                <Text color="gray">Press Esc again to clear input</Text>
-              )}
-              <Box
-                borderStyle="single"
-                borderColor="gray"
-                borderLeft={false}
-                borderRight={false}
-              >
-                <Text color={isPlaceholder ? "gray" : "white"}>
-                  {shouldShowCursor ? (
-                    <>
-                      {beforeCursor}
-                      <Text backgroundColor="white" color="black">
-                        {atCursor}
-                      </Text>
-                      {afterCursor}
-                    </>
-                  ) : (
-                    displayText
-                  )}
-                </Text>
-              </Box>
-              <Box justifyContent="space-between">
-                <StatusLine
-                  permissionMode={permissionMode}
-                  isShellCommand={isShellCommand}
-                />
-                <Notifications
-                  latestTotalTokens={latestTotalTokens}
-                  maxInputTokens={maxInputTokens}
-                  showLoginHint={showLoginHint}
-                />
+        : planView
+          ? null
+          : showBackgroundTaskManager ||
+            showMcpManager ||
+            showAgentsManager ||
+            showSkillsManager ||
+            showRewindManager ||
+            showHelp ||
+            showStatusCommand ||
+            showLoginCommand ||
+            showPluginManager ||
+            showModelSelector ||
+            showWorkflowManager || (
+              <Box flexDirection="column">
+                {escClearPending && (
+                  <Text color="gray">Press Esc again to clear input</Text>
+                )}
+                <Box
+                  borderStyle="single"
+                  borderColor="gray"
+                  borderLeft={false}
+                  borderRight={false}
+                >
+                  <Text color={isPlaceholder ? "gray" : "white"}>
+                    {shouldShowCursor ? (
+                      <>
+                        {beforeCursor}
+                        <Text backgroundColor="white" color="black">
+                          {atCursor}
+                        </Text>
+                        {afterCursor}
+                      </>
+                    ) : (
+                      displayText
+                    )}
+                  </Text>
+                </Box>
+                <Box justifyContent="space-between">
+                  <StatusLine
+                    permissionMode={permissionMode}
+                    isShellCommand={isShellCommand}
+                  />
+                  <Notifications
+                    latestTotalTokens={latestTotalTokens}
+                    maxInputTokens={maxInputTokens}
+                    showLoginHint={showLoginHint}
+                  />
+                </Box>
               </Box>
-            </Box>
-          )}
+            )}
     </Box>
   );
 };

package/src/components/MessageBlockItem.tsx

@@ -2,7 +2,6 @@ import React from "react";
 import { Box, Text } from "ink";
 import type { Message, MessageBlock } from "wave-agent-sdk";
 import { MessageSource } from "wave-agent-sdk";
-import { BangDisplay } from "./BangDisplay.js";
 import { ToolDisplay } from "./ToolDisplay.js";
 import { CompactDisplay } from "./CompactDisplay.js";
 import { ReasoningDisplay } from "./ReasoningDisplay.js";
@@ -54,10 +53,6 @@ export const MessageBlockItem = ({
         </Box>
       )}
 
-      {block.type === "bang" && (
-        <BangDisplay block={block} isExpanded={isExpanded} />
-      )}
-
       {block.type === "tool" && (
         <ToolDisplay block={block} isExpanded={isExpanded} />
       )}

package/src/components/MessageList.tsx

@@ -47,7 +47,6 @@ export const MessageList = React.memo(
         (b.stage === "running" ||
           b.stage === "streaming" ||
           b.stage === "start")) ||
-      (b.type === "bang" && b.stage === "running") ||
       (b.type === "reasoning" && b.stage === "streaming") ||
       (b.type === "text" && b.stage === "streaming");