feat: tool call status icon for search and replace UI

[RomneyDa]

Description

• Shows red X if search and replace fails, and green checkmark if it is completed
• Clicking opens virtual file with output, just like other tool call UIs
• Also tweaks spacing a bit

Generating args:

Pending acceptance:

Succeeded Failed (clicking opens output in virtual file):

Failed (clicking opens error in virtual file):

---

Summary by cubic

Added status icons to the search and replace tool call UI to show success or failure, and made the output clickable to open a virtual file.

• UI Improvements
  • Shows a green checkmark for completed calls and a red X for failed ones.
  • Clicking the icon opens the output in a virtual file.
  • Adjusted spacing for better layout.

[github-actions]

Code Review Summary

✅ Strengths

• Consistent UI/UX: The changes provide a consistent way to display tool call status icons across code blocks, improving visual feedback for users
• Reusable Components: Good use of existing utilities like getStatusIcon and renderContextItems from shared modules
• Type Safety: Proper TypeScript typing throughout with optional props and appropriate prop drilling
• Interactive Features: Nice addition of click handler to view tool call output in a virtual file when available
• Styling Consistency: Maintains consistent padding and layout patterns across components

⚠️ Issues Found

Low

• Unused Props in EditFile: The output and status props are passed to EditFile component but never used within the component itself
• Padding Inconsistency: The PR introduces some padding changes that may affect existing layouts (e.g., changing from px-4 py-1 to just py-1 wrapper)

💡 Suggestions

• Prop Cleanup: Consider removing the unused output and status props from EditFile component since they're not being utilized
• Error Handling: The click handler for showing virtual files could benefit from error handling in case renderContextItems throws
• Component Documentation: Consider adding JSDoc comments for the new showToolCallStatusIcon prop to explain when it should be enabled
• Testing: The PR would benefit from unit tests for the new tool call status icon functionality, especially the conditional rendering logic

🚀 Overall Assessment

APPROVE

This is a well-implemented feature that enhances the user experience by providing visual feedback for tool call statuses. The code follows existing patterns, maintains type safety, and integrates cleanly with the existing codebase. The minor issues identified are not critical and can be addressed in follow-up PRs.

[cubic-dev-ai]

cubic analysis

No issues found across 7 files. Review in cubic

[Patrick-Erichsen]

Nice improvements here!

[sestinj]

🎉 This PR is included in version 1.5.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[sestinj]

🎉 This PR is included in version 1.7.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀