diff --git a/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx b/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx index 2af8a3f966..108f5c5b74 100644 --- a/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx +++ b/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx @@ -202,17 +202,20 @@ describe('', () => { unmount(); }); - it('renders sticky header when scrolled', () => { + it('renders header when scrolled', () => { const toolCalls = [ createToolCall({ callId: '1', name: 'tool-1', - description: 'Description 1\n'.repeat(5), + description: + 'Description 1. This is a long description that will need to be truncated if the terminal width is small.', + resultDisplay: 'line1\nline2\nline3\nline4\nline5', }), createToolCall({ callId: '2', name: 'tool-2', - description: 'Description 2\n'.repeat(5), + description: 'Description 2', + resultDisplay: 'line1\nline2', }), ]; const { lastFrame, unmount } = renderWithProviders( diff --git a/packages/cli/src/ui/components/messages/ToolMessage.tsx b/packages/cli/src/ui/components/messages/ToolMessage.tsx index e819993f66..729a447573 100644 --- a/packages/cli/src/ui/components/messages/ToolMessage.tsx +++ b/packages/cli/src/ui/components/messages/ToolMessage.tsx @@ -322,8 +322,8 @@ const ToolInfo: React.FC = ({ } }, [emphasis]); return ( - - + + {name} {' '} diff --git a/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap b/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap index 46fa654ee8..057d6e52be 100644 --- a/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap +++ b/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap @@ -30,7 +30,7 @@ exports[` > Border Color Logic > uses yellow border when too exports[` > Confirmation Handling > shows confirmation dialog for first confirming tool only 1`] = ` "╭──────────────────────────────────────────────────────────────────────────────╮ -│ ? first-confirm A tool for testing ← │ +│ ? first-confirm A tool for testing ← │ │ │ │ Test result │ │ Confirm first tool │ @@ -50,6 +50,19 @@ exports[` > Confirmation Handling > shows confirmation dialo exports[` > Golden Snapshots > renders empty tool calls array 1`] = `""`; +exports[` > Golden Snapshots > renders header when scrolled 1`] = ` +"╭──────────────────────────────────────────────────────────────────────────────╮ +│ ✓ tool-1 Description 1. This is a long description that will need to be tr… │ +│──────────────────────────────────────────────────────────────────────────────│ +│ line5 │ █ +│ │ █ +│ ✓ tool-2 Description 2 │ █ +│ │ █ +│ line1 │ █ +│ line2 │ █ +╰──────────────────────────────────────────────────────────────────────────────╯ █" +`; + exports[` > Golden Snapshots > renders mixed tool calls including shell command 1`] = ` "╭──────────────────────────────────────────────────────────────────────────────╮ │ ✓ read_file Read a file │ @@ -98,22 +111,9 @@ exports[` > Golden Snapshots > renders single successful too ╰──────────────────────────────────────────────────────────────────────────────╯" `; -exports[` > Golden Snapshots > renders sticky header when scrolled 1`] = ` -"│ │ -│ ✓ tool-2 Description 2 │ -│ Description 2 │ -│ Description 2 │ -│ Description 2 │ ▄ -│ Description 2 │ █ -│ │ █ -│ │ █ -│ Test result │ █ -╰──────────────────────────────────────────────────────────────────────────────╯ █" -`; - exports[` > Golden Snapshots > renders tool call awaiting confirmation 1`] = ` "╭──────────────────────────────────────────────────────────────────────────────╮ -│ ? confirmation-tool This tool needs confirmation ← │ +│ ? confirmation-tool This tool needs confirmation ← │ │ │ │ Test result │ │ Are you sure you want to proceed? │ @@ -158,10 +158,7 @@ exports[` > Golden Snapshots > renders with limited terminal exports[` > Golden Snapshots > renders with narrow terminal width 1`] = ` "╭──────────────────────────────────────╮ -│ ✓ very-long-tool-name-that-might-wr │ -│ ap This is a very long │ -│ description that might cause │ -│ wrapping issues │ +│ ✓ very-long-tool-name-that-might-w… │ │ │ │ Test result │ ╰──────────────────────────────────────╯"