wave-code 0.0.16 → 0.0.17

package/src/components/DiffDisplay.tsx

@@ -1,30 +1,44 @@
 import React, { useMemo } from "react";
-import { Box, Text } from "ink";
+import { Box, Text, useStdout } from "ink";
+import {
+  WRITE_TOOL_NAME,
+  EDIT_TOOL_NAME,
+  MULTI_EDIT_TOOL_NAME,
+} from "wave-agent-sdk";
 import { transformToolBlockToChanges } from "../utils/toolParameterTransforms.js";
 import { diffLines, diffWords } from "diff";
-import type { ToolBlock } from "wave-agent-sdk";
 
 interface DiffDisplayProps {
-  toolBlock: ToolBlock;
+  toolName?: string;
+  parameters?: string;
+  isExpanded?: boolean;
 }
 
-export const DiffDisplay: React.FC<DiffDisplayProps> = ({ toolBlock }) => {
+export const DiffDisplay: React.FC<DiffDisplayProps> = ({
+  toolName,
+  parameters,
+  isExpanded = false,
+}) => {
+  const { stdout } = useStdout();
+  const maxHeight = useMemo(() => {
+    return Math.max(5, (stdout?.rows || 24) - 20);
+  }, [stdout?.rows]);
+
   const showDiff =
-    ["running", "end"].includes(toolBlock.stage) &&
-    toolBlock.name &&
-    ["Write", "Edit", "MultiEdit"].includes(toolBlock.name);
+    toolName &&
+    [WRITE_TOOL_NAME, EDIT_TOOL_NAME, MULTI_EDIT_TOOL_NAME].includes(toolName);
 
   // Diff detection and transformation using typed parameters
   const changes = useMemo(() => {
-    if (!showDiff || !toolBlock.name || !toolBlock.parameters) return [];
+    if (!showDiff || !toolName || !parameters) return [];
     try {
       // Use local transformation with JSON parsing and type guards
-      return transformToolBlockToChanges(toolBlock.name, toolBlock.parameters);
+      return transformToolBlockToChanges(toolName, parameters);
     } catch (error) {
       console.warn("Error transforming tool block to changes:", error);
       return [];
     }
-  }, [toolBlock.name, toolBlock.parameters, showDiff]);
+  }, [toolName, parameters, showDiff]);
 
   // Render word-level diff between two lines of text
   const renderWordLevelDiff = (
@@ -98,158 +112,162 @@ export const DiffDisplay: React.FC<DiffDisplayProps> = ({ toolBlock }) => {
     try {
       if (changes.length === 0) return null;
 
-      return (
-        <Box flexDirection="column">
-          {changes.map((change, changeIndex) => {
-            try {
-              // Get line-level diff to understand the structure
-              const lineDiffs = diffLines(
-                change.oldContent || "",
-                change.newContent || "",
-              );
+      const allElements: React.ReactNode[] = [];
+
+      changes.forEach((change, changeIndex) => {
+        try {
+          // Get line-level diff to understand the structure
+          const lineDiffs = diffLines(
+            change.oldContent || "",
+            change.newContent || "",
+          );
 
-              const diffElements: React.ReactNode[] = [];
+          const diffElements: React.ReactNode[] = [];
 
-              // Process line diffs and apply word-level diff to changed lines
-              lineDiffs.forEach((part, partIndex) => {
-                if (part.added) {
-                  const lines = part.value
-                    .split("\n")
-                    .filter((line) => line !== "");
-                  lines.forEach((line, lineIndex) => {
-                    diffElements.push(
-                      <Box
-                        key={`add-${changeIndex}-${partIndex}-${lineIndex}`}
-                        flexDirection="row"
-                      >
-                        <Text color="green">+</Text>
-                        <Text color="green">{line}</Text>
-                      </Box>,
-                    );
-                  });
-                } else if (part.removed) {
-                  const lines = part.value
-                    .split("\n")
-                    .filter((line) => line !== "");
-                  lines.forEach((line, lineIndex) => {
-                    diffElements.push(
-                      <Box
-                        key={`remove-${changeIndex}-${partIndex}-${lineIndex}`}
-                        flexDirection="row"
-                      >
-                        <Text color="red">-</Text>
-                        <Text color="red">{line}</Text>
-                      </Box>,
-                    );
-                  });
-                } else {
-                  // Context lines - show unchanged content
-                  const lines = part.value
-                    .split("\n")
-                    .filter((line) => line !== "");
-                  lines.forEach((line, lineIndex) => {
-                    diffElements.push(
-                      <Box
-                        key={`context-${changeIndex}-${partIndex}-${lineIndex}`}
-                        flexDirection="row"
-                      >
-                        <Text color="white"> </Text>
-                        <Text color="white">{line}</Text>
-                      </Box>,
-                    );
-                  });
-                }
+          // Process line diffs and apply word-level diff to changed lines
+          lineDiffs.forEach((part, partIndex) => {
+            if (part.added) {
+              const lines = part.value
+                .split("\n")
+                .filter((line) => line !== "");
+              lines.forEach((line, lineIndex) => {
+                diffElements.push(
+                  <Box
+                    key={`add-${changeIndex}-${partIndex}-${lineIndex}`}
+                    flexDirection="row"
+                  >
+                    <Text color="green">+</Text>
+                    <Text color="green">{line}</Text>
+                  </Box>,
+                );
               });
+            } else if (part.removed) {
+              const lines = part.value
+                .split("\n")
+                .filter((line) => line !== "");
+              lines.forEach((line, lineIndex) => {
+                diffElements.push(
+                  <Box
+                    key={`remove-${changeIndex}-${partIndex}-${lineIndex}`}
+                    flexDirection="row"
+                  >
+                    <Text color="red">-</Text>
+                    <Text color="red">{line}</Text>
+                  </Box>,
+                );
+              });
+            } else {
+              // Context lines - show unchanged content
+              const lines = part.value
+                .split("\n")
+                .filter((line) => line !== "");
+              lines.forEach((line, lineIndex) => {
+                diffElements.push(
+                  <Box
+                    key={`context-${changeIndex}-${partIndex}-${lineIndex}`}
+                    flexDirection="row"
+                  >
+                    <Text color="white"> </Text>
+                    <Text color="white">{line}</Text>
+                  </Box>,
+                );
+              });
+            }
+          });
 
-              // Now look for pairs of removed/added lines that can be word-diffed
-              const processedElements: React.ReactNode[] = [];
-              let i = 0;
+          // Now look for pairs of removed/added lines that can be word-diffed
+          let i = 0;
 
-              while (i < diffElements.length) {
-                const current = diffElements[i];
-                const next =
-                  i + 1 < diffElements.length ? diffElements[i + 1] : null;
+          while (i < diffElements.length) {
+            const current = diffElements[i];
+            const next =
+              i + 1 < diffElements.length ? diffElements[i + 1] : null;
 
-                // Check if we have a removed line followed by an added line
-                const currentKey = React.isValidElement(current)
-                  ? current.key
-                  : "";
-                const nextKey = React.isValidElement(next) ? next.key : "";
+            // Check if we have a removed line followed by an added line
+            const currentKey = React.isValidElement(current) ? current.key : "";
+            const nextKey = React.isValidElement(next) ? next.key : "";
 
-                const isCurrentRemoved =
-                  typeof currentKey === "string" &&
-                  currentKey.includes("remove-");
-                const isNextAdded =
-                  typeof nextKey === "string" && nextKey.includes("add-");
+            const isCurrentRemoved =
+              typeof currentKey === "string" && currentKey.includes("remove-");
+            const isNextAdded =
+              typeof nextKey === "string" && nextKey.includes("add-");
 
-                if (
-                  isCurrentRemoved &&
-                  isNextAdded &&
-                  React.isValidElement(current) &&
-                  React.isValidElement(next)
-                ) {
-                  // Extract the text content from the removed and added lines
-                  const removedText = extractTextFromElement(current);
-                  const addedText = extractTextFromElement(next);
+            if (
+              isCurrentRemoved &&
+              isNextAdded &&
+              React.isValidElement(current) &&
+              React.isValidElement(next)
+            ) {
+              // Extract the text content from the removed and added lines
+              const removedText = extractTextFromElement(current);
+              const addedText = extractTextFromElement(next);
 
-                  if (removedText && addedText) {
-                    // Apply word-level diff
-                    const { removedParts, addedParts } = renderWordLevelDiff(
-                      removedText,
-                      addedText,
-                      `word-${changeIndex}-${i}`,
-                    );
+              if (removedText && addedText) {
+                // Apply word-level diff
+                const { removedParts, addedParts } = renderWordLevelDiff(
+                  removedText,
+                  addedText,
+                  `word-${changeIndex}-${i}`,
+                );
 
-                    processedElements.push(
-                      <Box
-                        key={`word-diff-removed-${changeIndex}-${i}`}
-                        flexDirection="row"
-                      >
-                        <Text color="red">-</Text>
-                        {removedParts}
-                      </Box>,
-                    );
-                    processedElements.push(
-                      <Box
-                        key={`word-diff-added-${changeIndex}-${i}`}
-                        flexDirection="row"
-                      >
-                        <Text color="green">+</Text>
-                        {addedParts}
-                      </Box>,
-                    );
+                allElements.push(
+                  <Box
+                    key={`word-diff-removed-${changeIndex}-${i}`}
+                    flexDirection="row"
+                  >
+                    <Text color="red">-</Text>
+                    {removedParts}
+                  </Box>,
+                );
+                allElements.push(
+                  <Box
+                    key={`word-diff-added-${changeIndex}-${i}`}
+                    flexDirection="row"
+                  >
+                    <Text color="green">+</Text>
+                    {addedParts}
+                  </Box>,
+                );
 
-                    i += 2; // Skip the next element since we processed it
-                  } else {
-                    // Fallback to original elements
-                    processedElements.push(current);
-                    i += 1;
-                  }
-                } else {
-                  processedElements.push(current);
-                  i += 1;
-                }
+                i += 2; // Skip the next element since we processed it
+              } else {
+                // Fallback to original elements
+                allElements.push(current);
+                i += 1;
               }
-
-              return (
-                <Box key={changeIndex} flexDirection="column">
-                  {processedElements}
-                </Box>
-              );
-            } catch (error) {
-              console.warn(
-                `Error rendering diff for change ${changeIndex}:`,
-                error,
-              );
-              // Fallback to simple display
-              return (
-                <Box key={changeIndex} flexDirection="column">
-                  <Text color="red">-{change.oldContent || ""}</Text>
-                  <Text color="green">+{change.newContent || ""}</Text>
-                </Box>
-              );
+            } else {
+              allElements.push(current);
+              i += 1;
             }
-          })}
+          }
+        } catch (error) {
+          console.warn(
+            `Error rendering diff for change ${changeIndex}:`,
+            error,
+          );
+          // Fallback to simple display
+          allElements.push(
+            <Box key={`fallback-${changeIndex}`} flexDirection="column">
+              <Text color="red">-{change.oldContent || ""}</Text>
+              <Text color="green">+{change.newContent || ""}</Text>
+            </Box>,
+          );
+        }
+      });
+
+      const isTruncated = !isExpanded && allElements.length > maxHeight;
+      const displayElements = isTruncated
+        ? allElements.slice(0, maxHeight - 1)
+        : allElements;
+
+      return (
+        <Box flexDirection="column">
+          {displayElements}
+          {isTruncated && (
+            <Text color="yellow" dimColor>
+              ... (truncated {allElements.length - (maxHeight - 1)} more lines)
+            </Text>
+          )}
         </Box>
       );
     } catch (error) {

package/src/components/FileSelector.tsx

@@ -49,8 +49,10 @@ export const FileSelector: React.FC<FileSelectorProps> = ({
         flexDirection="column"
         borderStyle="single"
         borderColor="yellow"
-        padding={1}
-        marginBottom={1}
+        borderBottom={false}
+        borderLeft={false}
+        borderRight={false}
+        paddingTop={1}
       >
         <Text color="yellow">📁 No files found for "{searchQuery}"</Text>
         <Text dimColor>Press Escape to cancel</Text>
@@ -86,8 +88,10 @@ export const FileSelector: React.FC<FileSelectorProps> = ({
       flexDirection="column"
       borderStyle="single"
       borderColor="cyan"
-      padding={1}
-      marginBottom={1}
+      borderBottom={false}
+      borderLeft={false}
+      borderRight={false}
+      paddingTop={1}
     >
       <Text color="cyan" bold>
         📁 Select File/Directory{" "}

package/src/components/InputBox.tsx

@@ -103,6 +103,7 @@ export const InputBox: React.FC<InputBoxProps> = ({
     setUserInputHistory,
     // Complex handlers combining multiple operations
     handleBashHistoryExecuteAndSend,
+    handleBashHistoryDelete,
     // Main handler
     handleInput,
     // Manager ready state
@@ -188,6 +189,7 @@ export const InputBox: React.FC<InputBoxProps> = ({
           workdir={currentWorkdir}
           onSelect={handleBashHistorySelect}
           onExecute={handleBashHistoryExecuteAndSend}
+          onDelete={handleBashHistoryDelete}
           onCancel={handleCancelBashHistorySelect}
         />
       )}
@@ -214,7 +216,12 @@ export const InputBox: React.FC<InputBoxProps> = ({
       )}
       {showBashManager || showMcpManager || (
         <Box flexDirection="column">
-          <Box borderStyle="single" borderColor="gray" paddingX={1}>
+          <Box
+            borderStyle="single"
+            borderColor="gray"
+            borderLeft={false}
+            borderRight={false}
+          >
             <Text color={isPlaceholder ? "gray" : "white"}>
               {shouldShowCursor ? (
                 <>
@@ -229,10 +236,13 @@ export const InputBox: React.FC<InputBoxProps> = ({
               )}
             </Text>
           </Box>
-          <Box paddingX={1}>
+          <Box paddingRight={1}>
             <Text color="gray">
-              Mode: <Text color="cyan">{permissionMode}</Text> (Shift+Tab to
-              cycle)
+              Mode:{" "}
+              <Text color={permissionMode === "plan" ? "yellow" : "cyan"}>
+                {permissionMode}
+              </Text>{" "}
+              (Shift+Tab to cycle)
             </Text>
           </Box>
         </Box>

package/src/components/McpManager.tsx

@@ -144,9 +144,11 @@ export const McpManager: React.FC<McpManagerProps> = ({
         flexDirection="column"
         borderStyle="single"
         borderColor="cyan"
-        padding={1}
+        borderBottom={false}
+        borderLeft={false}
+        borderRight={false}
+        paddingTop={1}
         gap={1}
-        marginBottom={1}
       >
         <Box>
           <Text color="cyan" bold>
@@ -247,8 +249,10 @@ export const McpManager: React.FC<McpManagerProps> = ({
         flexDirection="column"
         borderStyle="single"
         borderColor="cyan"
-        padding={1}
-        marginBottom={1}
+        borderBottom={false}
+        borderLeft={false}
+        borderRight={false}
+        paddingTop={1}
       >
         <Text color="cyan" bold>
           Manage MCP servers
@@ -267,9 +271,11 @@ export const McpManager: React.FC<McpManagerProps> = ({
       flexDirection="column"
       borderStyle="single"
       borderColor="cyan"
-      padding={1}
+      borderBottom={false}
+      borderLeft={false}
+      borderRight={false}
+      paddingTop={1}
       gap={1}
-      marginBottom={1}
     >
       <Box>
         <Text color="cyan" bold>

package/src/components/MemoryTypeSelector.tsx

@@ -55,9 +55,11 @@ export const MemoryTypeSelector: React.FC<MemoryTypeSelectorProps> = ({
       flexDirection="column"
       borderStyle="single"
       borderColor="green"
-      padding={1}
+      borderBottom={false}
+      borderLeft={false}
+      borderRight={false}
+      paddingTop={1}
       gap={1}
-      marginBottom={1}
     >
       <Box>
         <Text color="green" bold>

package/src/components/MessageList.tsx

@@ -52,7 +52,7 @@ export const MessageList = React.memo(
         : [];
 
     return (
-      <Box flexDirection="column" paddingX={1} gap={1}>
+      <Box flexDirection="column" gap={1}>
         {/* Show omitted message count when limiting */}
         {omittedCount > 0 && (
           <Box>

package/src/components/PlanDisplay.tsx

@@ -0,0 +1,46 @@
+import React, { useMemo } from "react";
+import { Box, Text, useStdout } from "ink";
+import { Markdown } from "./Markdown.js";
+
+interface PlanDisplayProps {
+  plan: string;
+  isExpanded?: boolean;
+}
+
+export const PlanDisplay: React.FC<PlanDisplayProps> = ({
+  plan,
+  isExpanded = false,
+}) => {
+  const { stdout } = useStdout();
+  const maxHeight = useMemo(() => {
+    // Similar to DiffDisplay.tsx maxHeight calculation
+    return Math.max(5, (stdout?.rows || 24) - 20);
+  }, [stdout?.rows]);
+
+  const lines = useMemo(() => plan.split("\n"), [plan]);
+  const isOverflowing = !isExpanded && lines.length > maxHeight;
+
+  return (
+    <Box flexDirection="column" marginTop={1}>
+      <Box paddingLeft={2} borderLeft borderColor="cyan" flexDirection="column">
+        <Text color="cyan" bold>
+          Plan Content:
+        </Text>
+        <Box
+          flexDirection="column"
+          height={isOverflowing ? maxHeight : undefined}
+          overflow="hidden"
+        >
+          <Markdown>{plan}</Markdown>
+        </Box>
+        {isOverflowing && (
+          <Box marginTop={1}>
+            <Text color="yellow" dimColor>
+              ... (plan truncated, {lines.length} lines total)
+            </Text>
+          </Box>
+        )}
+      </Box>
+    </Box>
+  );
+};

package/src/components/ToolResultDisplay.tsx

@@ -135,8 +135,10 @@ export const ToolResultDisplay: React.FC<ToolResultDisplayProps> = ({
         </Box>
       )}
 
-      {/* Diff display - handled by DiffDisplay component */}
-      <DiffDisplay toolBlock={block} />
+      {/* Diff display - only show after tool execution completes */}
+      {stage === "end" && (
+        <DiffDisplay toolName={name} parameters={parameters} />
+      )}
     </Box>
   );
 };

package/src/contexts/useChat.tsx

@@ -93,11 +93,13 @@ export const useChat = () => {
 export interface ChatProviderProps {
   children: React.ReactNode;
   bypassPermissions?: boolean;
+  pluginDirs?: string[];
 }
 
 export const ChatProvider: React.FC<ChatProviderProps> = ({
   children,
   bypassPermissions,
+  pluginDirs,
 }) => {
   const { restoreSessionId, continueLastSession } = useAppConfig();
 
@@ -260,6 +262,7 @@ export const ChatProvider: React.FC<ChatProviderProps> = ({
           permissionMode: bypassPermissions ? "bypassPermissions" : undefined,
           canUseTool: permissionCallback,
           stream: false, // 关闭流式模式
+          plugins: pluginDirs?.map((path) => ({ type: "local", path })),
         });
 
         agentRef.current = agent;
@@ -292,6 +295,7 @@ export const ChatProvider: React.FC<ChatProviderProps> = ({
     continueLastSession,
     bypassPermissions,
     showConfirmation,
+    pluginDirs,
   ]);
 
   // Cleanup on unmount

package/src/hooks/useInputManager.ts

@@ -324,6 +324,13 @@ export const useInputManager = (
     managerRef.current?.handleBashHistoryExecuteAndSend(command);
   }, []);
 
+  const handleBashHistoryDelete = useCallback(
+    (command: string, workdir?: string) => {
+      managerRef.current?.handleBashHistoryDelete(command, workdir);
+    },
+    [],
+  );
+
   return {
     // State
     inputText,
@@ -445,6 +452,7 @@ export const useInputManager = (
 
     // Complex handlers combining multiple operations
     handleBashHistoryExecuteAndSend,
+    handleBashHistoryDelete,
 
     // Main input handler
     handleInput: useCallback(