Skip to content

Fix: Improve visibility of tool calls #3252

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
AaronGoldsmith wants to merge 2 commits into from
Closed

Fix: Improve visibility of tool calls #3252

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
870bbbe
fix: simplify fallback behavior for unknown tools in ToolCallView
AaronGoldsmith Jul 4, 2025
6dd0d94
fix: extract truncate function for tool name formatting in ToolCallView
AaronGoldsmith Jul 4, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 10 additions & 21 deletions ui/desktop/src/components/ToolCallWithResponse.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -166,6 +166,11 @@ function ToolCallView({
// Only expand if there are actual results that need to be shown, not just for tool details
const isShouldExpand = toolResults.some((v) => v.isExpandToolResults);

// Helper function to truncate long values
const truncate = (str: string, maxLength: number = 50): string => {
return str.length > maxLength ? str.substring(0, maxLength) + '...' : str;
};

// Function to create a descriptive representation of what the tool is doing
const getToolDescription = () => {
const args = toolCall.arguments as Record<string, ToolCallArgumentValue>;
Expand All @@ -176,11 +181,6 @@ function ToolCallView({
return typeof value === 'string' ? value : JSON.stringify(value);
};

// Helper function to truncate long values
const truncate = (str: string, maxLength: number = 50): string => {
return str.length > maxLength ? str.substring(0, maxLength) + '...' : str;
};

// Generate descriptive text based on tool type
switch (toolName) {
case 'text_editor':
Expand Down Expand Up @@ -292,20 +292,8 @@ function ToolCallView({
return 'poking around...';

default: {
// Fallback to showing key parameters for unknown tools
const entries = Object.entries(args);
if (entries.length === 0) return null;

// For a single parameter, show key and truncated value
if (entries.length === 1) {
const [key, value] = entries[0];
const stringValue = getStringValue(value);
const truncatedValue = truncate(stringValue, 30);
return `${key}: ${truncatedValue}`;
}

// For multiple parameters, just show the keys
return entries.map(([key]) => key).join(', ');
// For unknown tools, always return null to fall back to tool name
return null;
}
}

Expand All @@ -325,8 +313,9 @@ function ToolCallView({
if (description) {
return description;
}
// Fallback to the original tool name formatting
return snakeToTitleCase(toolCall.name.substring(toolCall.name.lastIndexOf('__') + 2));
// Fallback to formatted and truncated tool name using shared truncate function
const toolName = toolCall.name.substring(toolCall.name.lastIndexOf('__') + 2);
return truncate(snakeToTitleCase(toolName));
})()}
</span>
</>
Expand Down