Function ToolFileEdit

web/components/tools/ToolFileEdit.tsx:41–95

({
  input,
  result,
  isError = false,
  isRunning = false,
  startedAt,
  completedAt,
}: ToolFileEditProps)

}

export function ToolFileEdit({
  input,
  result,
  isError = false,
  isRunning = false,
  startedAt,
  completedAt,
}: ToolFileEditProps) {
  const lang = getLanguageFromPath(input.file_path);

  return (
    <ToolUseBlock
      toolName="edit"
      toolInput={input}
      toolResult={result}
      isError={isError}
      isRunning={isRunning}
      startedAt={startedAt}
      completedAt={completedAt}
    >
      {/* File path header */}
      <div className="flex items-center gap-2 px-3 py-2 border-b border-surface-700/50 bg-surface-850">
        <FileIcon
          filePath={input.file_path}
          className="w-3.5 h-3.5 text-surface-400 flex-shrink-0"
        />
        <FileBreadcrumb filePath={input.file_path} />
        {input.replace_all && (
          <span className="ml-auto text-xs px-1.5 py-0.5 rounded bg-surface-700 text-surface-300">
            replace all
          </span>
        )}
      </div>

      {/* Content */}
      {isRunning ? (
        <div className="px-3 py-4 text-surface-500 text-xs animate-pulse">
          Editing…
        </div>
      ) : isError ? (
        <div className="px-3 py-3 text-red-400 text-xs font-mono whitespace-pre-wrap">
          {result}
        </div>
      ) : (
        <div className="p-3">
          <DiffView
            oldContent={input.old_string}
            newContent={input.new_string}
            lang={lang}
          />
        </div>
      )}
    </ToolUseBlock>
  );
}