feat: improve ThinkingBlock status messages and i18n

Add more descriptive loading and finished state labels for the ThinkingBlock component. The update:

- Uses new translation keys (`chat:calling_tool`, `chat:thought_and_tool_call`, etc.) for clearer tool‑call and reasoning messages.
- Handles `tool_call`, `tool_output`, and `reasoning` steps explicitly, providing a fallback when no active step is present.
- Adjusts the final label logic to use the new i18n keys and formats durations consistently.
- Adds missing locale entries for all new keys and a trailing newline to the JSON file.

These changes improve user feedback during chat interactions and make the messages easier to maintain and localize.
This commit is contained in:
Akarshan 2025-10-29 19:35:42 +05:30
parent 0a5e107d0f
commit 0c80950226
No known key found for this signature in database
GPG Key ID: D75C9634A870665F
2 changed files with 29 additions and 12 deletions

View File

@ -114,7 +114,7 @@ const ThinkingBlock = ({
<div className="mb-4 rounded-lg bg-main-view-fg/4 border border-dashed border-main-view-fg/10 p-2 flex items-center gap-3"> <div className="mb-4 rounded-lg bg-main-view-fg/4 border border-dashed border-main-view-fg/10 p-2 flex items-center gap-3">
<Loader className="size-4 animate-spin text-main-view-fg/60" /> <Loader className="size-4 animate-spin text-main-view-fg/60" />
<span className="font-medium text-main-view-fg/80"> <span className="font-medium text-main-view-fg/80">
{t('thinking')}... {t('thinking')}
</span> </span>
</div> </div>
</div> </div>
@ -253,26 +253,36 @@ const ThinkingBlock = ({
const timeInSeconds = formatDuration(duration ?? 0) const timeInSeconds = formatDuration(duration ?? 0)
if (loading) { if (loading) {
// Check if the active step is a tool call // Logic for streaming (loading) state:
if (activeStep?.type === 'tool_call' || hasToolCalls) { if (activeStep) {
return 'Calling tool...' if (
} else { activeStep.type === 'tool_call' ||
return t('thinking') activeStep.type === 'tool_output'
) {
return `${t('calling_tool')}` // Use a specific translation key for tool
} else if (activeStep.type === 'reasoning') {
return `${t('chat:thinking')}` // Use the generic thinking key
}
} }
// Fallback if loading but no activeStep (isStreamingEmpty case, though handled before this memo)
return `${t('chat:thinking')}`
} }
// Logic for finalized (not loading) state:
// Build label based on what steps occurred // Build label based on what steps occurred
let label = '' let label = ''
if (hasReasoning && hasToolCalls) { if (hasReasoning && hasToolCalls) {
label = `${t('thought')}` // Use a more descriptive label when both were involved
label = t('chat:thought_and_tool_call')
} else if (hasToolCalls) { } else if (hasToolCalls) {
label = 'Tool Called' label = t('chat:tool_called')
} else { } else {
label = t('thought') label = t('chat:thought')
} }
if (timeInSeconds > 0) { if (timeInSeconds > 0) {
return `${label} ${t('for')} ${timeInSeconds} ${t('seconds')}` return `${label} ${t('chat:for')} ${timeInSeconds} ${t('chat:seconds')}`
} }
return label return label
}, [loading, duration, t, activeStep, steps]) }, [loading, duration, t, activeStep, steps])

View File

@ -8,5 +8,12 @@
}, },
"sendMessage": "Send Message", "sendMessage": "Send Message",
"newConversation": "New Conversation", "newConversation": "New Conversation",
"clearHistory": "Clear History" "clearHistory": "Clear History",
} "thought_and_tool_call": "Thought and called tools",
"tool_called": "Called tools",
"calling_tool": "Calling a tool",
"thinking": "Thinking",
"for": "for",
"seconds": "seconds"
}