🤖 Fix tool error display and WRITE DENIED collapse

Two fixes:

1. Tool error display: GenericToolCall now properly detects and displays
   tool errors in both formats ({ error: '...' } from AI SDK and
   { success: false, error: '...' } from tool implementations). Status
   is correctly shown as 'failed' instead of 'completed' for errors.

2. WRITE DENIED collapse: FileEditToolCall now uses useEffect to collapse
   when WRITE DENIED result arrives, fixing issue where initial render
   (before result available) would expand the tool call.

Both formats are now consistently handled across all tool types.

Author: ammar-agent

src/components/tools/FileEditToolCall.tsx

@@ -102,10 +102,18 @@ export const FileEditToolCall: React.FC<FileEditToolCallProps> = ({
   const isWriteDenied = result && !result.success && result.error?.startsWith(WRITE_DENIED_PREFIX);
   const initialExpanded = !isWriteDenied;
 
-  const { expanded, toggleExpanded } = useToolExpansion(initialExpanded);
+  const { expanded, setExpanded, toggleExpanded } = useToolExpansion(initialExpanded);
   const [showRaw, setShowRaw] = React.useState(false);
   const [copied, setCopied] = React.useState(false);
 
+  // Update expanded state when result changes from undefined to WRITE DENIED
+  // This handles the case where the component renders before the result is available
+  React.useEffect(() => {
+    if (result && !result.success && result.error?.startsWith(WRITE_DENIED_PREFIX)) {
+      setExpanded(false);
+    }
+  }, [result, setExpanded]);
+
   const filePath = "file_path" in args ? args.file_path : undefined;
 
   const handleCopyPatch = async () => {

src/components/tools/GenericToolCall.tsx

@@ -33,6 +33,18 @@ export const GenericToolCall: React.FC<GenericToolCallProps> = ({
 }) => {
   const { expanded, toggleExpanded } = useToolExpansion();
 
+  // Check if result contains an error
+  // Handles two formats:
+  // 1. Tool implementation errors: { success: false, error: "..." }
+  // 2. AI SDK tool-error events: { error: "..." }
+  const hasError =
+    result &&
+    typeof result === "object" &&
+    "error" in result &&
+    typeof result.error === "string" &&
+    result.error.length > 0 &&
+    (!("success" in result) || result.success === false);
+
   const hasDetails = args !== undefined || result !== undefined;
 
   return (
@@ -52,7 +64,16 @@ export const GenericToolCall: React.FC<GenericToolCallProps> = ({
             </DetailSection>
           )}
 
-          {result !== undefined && (
+          {hasError ? (
+            <DetailSection>
+              <DetailLabel>Error</DetailLabel>
+              <div className="text-danger bg-danger-overlay border-danger rounded border-l-2 px-2 py-1.5 text-[11px]">
+                {String((result as { error: string }).error)}
+              </div>
+            </DetailSection>
+          ) : null}
+
+          {result !== undefined && !hasError && (
             <DetailSection>
               <DetailLabel>Result</DetailLabel>
               <DetailContent>{formatValue(result)}</DetailContent>

src/utils/messages/StreamingMessageAggregator.ts

@@ -673,8 +673,22 @@ export class StreamingMessageAggregator {
                 timestamp: part.timestamp ?? baseTimestamp,
               });
             } else if (isDynamicToolPart(part)) {
-              const status =
-                part.state === "output-available"
+              // Check if output contains an error
+              // Handles two formats:
+              // 1. Tool implementation errors: { success: false, error: "..." }
+              // 2. AI SDK tool-error events: { error: "..." }
+              const hasError =
+                part.state === "output-available" &&
+                part.output &&
+                typeof part.output === "object" &&
+                "error" in part.output &&
+                typeof part.output.error === "string" &&
+                part.output.error.length > 0 &&
+                (!("success" in part.output) || part.output.success === false);
+
+              const status = hasError
+                ? "failed"
+                : part.state === "output-available"
                   ? "completed"
                   : part.state === "input-available" && message.metadata?.partial
                     ? "interrupted"