Add jump icon for newly created files (#5738)

* feat: add jump icon for newly created files

- Add jump icon to newFileCreated tool case in ChatRow.tsx
- Matches existing pattern from readFile case for consistent UX
- Allows users to quickly open newly created files
- Fixes issue #5736

* fix: remove duplicate file path display in newFileCreated case

- Removed redundant ToolUseBlock that was showing file path twice
- Added onJumpToFile prop to CodeAccordian component to support jump icon
- Jump icon now appears in CodeAccordian header for newFileCreated files
- Maintains consistent UX with existing file operations while avoiding duplication

Fixes feedback from @daniel-lxs about duplicate elements being shown

* fix: address PR feedback for jump icon on new files

- Fix openFile message to use correct path format with './' prefix
- Remove duplicate chevron icon when jump icon is present
- Add aria-label for accessibility
- Fix styling: use mr-1 to match progressStatus icon
- Remove redundant margin style from jump icon

---------

Co-authored-by: Roo Code <roo@roocode.com>
Co-authored-by: Roo Code <roomote@roocode.com>
Co-authored-by: Daniel Riccio <ricciodaniel98@gmail.com>
This commit is contained in:
roomote[bot] 2025-07-22 13:26:32 -04:00 committed by GitHub
parent 984d368f7a
commit 5629199d51
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 15 additions and 1 deletions

View file

@ -533,6 +533,7 @@ export const ChatRowContent = ({
isLoading={message.partial}
isExpanded={isExpanded}
onToggleExpand={handleToggleExpand}
onJumpToFile={() => vscode.postMessage({ type: "openFile", text: "./" + tool.path })}
/>
</>
)

View file

@ -17,6 +17,7 @@ interface CodeAccordianProps {
isFeedback?: boolean
onToggleExpand: () => void
header?: string
onJumpToFile?: () => void
}
const CodeAccordian = ({
@ -29,6 +30,7 @@ const CodeAccordian = ({
isFeedback,
onToggleExpand,
header,
onJumpToFile,
}: CodeAccordianProps) => {
const inferredLanguage = useMemo(() => language ?? (path ? getLanguageFromPath(path) : "txt"), [path, language])
const source = useMemo(() => code.trim(), [code])
@ -68,7 +70,18 @@ const CodeAccordian = ({
</span>
</>
)}
<span className={`codicon codicon-chevron-${isExpanded ? "up" : "down"}`}></span>
{onJumpToFile && path && (
<span
className="codicon codicon-link-external mr-1"
style={{ fontSize: 13.5 }}
onClick={(e) => {
e.stopPropagation()
onJumpToFile()
}}
aria-label={`Open file: ${path}`}
/>
)}
{!onJumpToFile && <span className={`codicon codicon-chevron-${isExpanded ? "up" : "down"}`}></span>}
</ToolUseBlockHeader>
)}
{(!hasHeader || isExpanded) && (