LibreChat/client/src/components/Chat/Messages/Content/Parts/OpenAIImageGen/ProgressText.tsx
Danny Avila ff9d89540c
🎯 feat: Render Tool Intent as the Live Tool-Call Label (#14536)
* 🎯 feat: Render Tool Intent as the Live Tool-Call Label

The tool_intents capability injects a model-authored `intent` sentence as
the FIRST key of a tool call's args, and the SDK's coding tools carry it
natively — but no client component ever read it, so cards kept showing
their generic labels ("Running command") while the intent streamed by
unused.

A shared useToolCallIntent hook extracts the intent from streaming args
via parseJsonField's partial-JSON fallback, so the label renders from the
first delta — before any other arg exists — and keeps updating as it
streams. When present, the intent replaces the generic in-progress label
and persists as the settled label (completion is a UI state, not a tense
change, matching the SDK's applyOutcome design). Cancelled, error, and
background states keep their existing precedence.

Wired into BashCall, ExecuteCode, the generic ToolCall (MCP, actions,
plugin tools), ReadFileCall, SkillCall, and FileAuthoringCall. Non-string
`intent` business params are ignored. SubagentCall keeps its verb+name
header design for a follow-up.

* 🎯 fix: Harden Intent Label Extraction per Review

Gate the label on intent being the FIRST args key (the label contract's
first-position rule), so a tool's own business param named intent — e.g. a
CRM's {"q":"acme","intent":"billing_inquiry"} — no longer renders as the
status label. Bound the label to a single 256-char line before it reaches
ProgressText's nowrap layout, mirroring the SDK's outcome-label cap.

Decode the full JSON escape set in parseJsonField's streaming fallback
(\t \r \b \f \/ and \uXXXX with surrogate pairs) so a partial label renders
exactly as its settled JSON.parse form; stream-edge incompletions (dangling
escape, partial \uXX, split surrogate) are held back rather than shown.

Wire web_search into the intent label: Part.tsx now passes toolCall.args
and the WebSearch card prefers the intent for its progress and completed
texts — it carries intent natively but never received args at all.

* 🎯 fix: Round-2 Review — Stable Live Region, Split Low Surrogates, Specialized Cards

Keep the aria-live region on its stable generic value while the intent
streams: an atomic polite region re-announces the whole growing sentence
on every delta otherwise. The settled intent is still announced once via
the finished text.

Hold back a decoded high surrogate while its low-surrogate escape is
still streaming (\ud83d\u, \ud83d\ude0), not only when the high half ends
the value exactly; a complete following escape composes the pair on the
next iteration, and a lone surrogate followed by ordinary text stays
emitted, matching JSON.parse.

Thread args into the specialized cards for explicitly opted-in tools:
RetrievalCall (file_search) and the image-gen cards (image_gen_oai,
image_edit_oai, gemini_image_gen) now resolve the intent for their
progress and settled labels, with the image phase texts as fallback.

* 🎯 fix: Round-3 Review — Live-Region Settled Announcements & Remaining Cards

Announce the settled intent once through the aria-live regions of
RetrievalCall, the image-gen card, and WebSearch, while each region keeps
a stable generic value during streaming (WebSearch was still piping the
growing intent into its atomic region on every delta).

Pass object-valued args through Part.tsx to the image-gen card instead of
coercing them to '' — persisted/completed calls carry object args, so the
first-key intent was invisible on reload.

Guard complete serialized args against non-string intents: parseJsonField's
JSON branch would coerce {"intent":{...}} into "[object Object]"; the hook
now type-checks the parsed field, matching the object-args path.

Wire the subagent card: the SDK-native subagent intent now leads its
header, without overriding error or cancellation framing.

* 🎯 fix: Round-4 Review — Constant-Cost Extraction, Final-Search Settling, Safe Truncation

Replace the hook's JSON.parse-per-delta with a single anchored regex over
a bounded 2 KB head window: the first-position contract lets one match do
the business-param gating and the value capture (complete or streaming),
so per-delta cost stays constant while a large code/content argument
streams behind the label. A non-string first-key intent never matches the
opening quote, keeping the round-3 guard without parsing.

Settle a web search that is the message's final part once submission ends:
`complete` previously required !isLast permanently, so the last-part case
shimmered forever and never announced its settled intent.

Back the truncation cut off a high surrogate so a bounded multilingual
label never ends in a replacement glyph before the ellipsis.

* 🎯 fix: Round-5 Review — Keep Terminal Lone Surrogates in Settled Values

Thread value completeness from the extractor into the escape decoder: a
captured closing quote means the value is settled, so the stream-edge
hold-backs (partial \uXX, high-surrogate deferral) no longer apply and a
value genuinely ending in a lone high surrogate keeps its final code
unit, matching JSON.parse and the object-args rendering. Streaming
callers keep the hold-back behavior unchanged.
2026-07-30 21:31:51 -04:00

93 lines
2.2 KiB
TypeScript

import { AGENT_STYLE_TOOLS } from '.';
import { useLocalize } from '~/hooks';
import { cn } from '~/utils';
export default function ProgressText({
progress,
error,
toolName = '',
intent,
}: {
progress: number;
error?: boolean;
toolName?: string;
/** Model-authored label; wins over the phase texts (error state excepted). */
intent?: string;
}) {
const localize = useLocalize();
const getText = () => {
if (error) {
return localize('com_ui_image_gen_failed');
}
if (intent != null) {
return intent;
}
if (toolName === 'image_edit_oai') {
if (progress >= 1) {
return localize('com_ui_image_edited');
}
if (progress >= 0.7) {
return localize('com_ui_final_touch');
}
if (progress >= 0.5) {
return localize('com_ui_adding_details');
}
if (progress >= 0.3) {
return localize('com_ui_edit_editing_image');
}
return localize('com_ui_getting_started');
}
if (toolName === 'gemini_image_gen') {
if (progress >= 1) {
return localize('com_ui_image_created');
}
if (progress >= 0.7) {
return localize('com_ui_final_touch');
}
if (progress >= 0.5) {
return localize('com_ui_adding_details');
}
if (progress >= 0.3) {
return localize('com_ui_creating_image');
}
return localize('com_ui_getting_started');
}
if (AGENT_STYLE_TOOLS.has(toolName)) {
if (progress >= 1) {
return localize('com_ui_image_created');
}
if (progress >= 0.7) {
return localize('com_ui_final_touch');
}
if (progress >= 0.5) {
return localize('com_ui_adding_details');
}
if (progress >= 0.3) {
return localize('com_ui_creating_image');
}
return localize('com_ui_getting_started');
}
if (progress >= 1) {
return localize('com_ui_image_created');
}
return localize('com_ui_generating_image');
};
const text = getText();
return (
<span
className={cn(
'progress-text-content tool-status-text whitespace-nowrap font-medium',
progress < 1 && 'shimmer',
)}
>
{text}
</span>
);
}