fix(ux): improve interaction feedback and fix pre-tool text rendering
Trigger auto deployment for soc-langgraph / build-and-deploy (push) Failing after 17s
Deploy LangGraph UI to Azure Static Web Apps / build-and-deploy (push) Failing after 44s

- Show pre-tool plainTextContent above ToolCallStatus (was silently
  dropped when hasThinking=false but plainText exists with tool_calls)
- Pre-tool thinking bubble gets proper bg-muted bubble styling and
  isStreaming=false (thinking is complete once tool calls start)
- handleRegenerate now sets concurrentStatus="generating" for
  consistent status bar feedback on regenerate
- Remove dead setConcurrentStatus prop from ChatInput interface/usage

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
gongzhiyong
2026-04-15 01:51:28 +08:00
co-authored by Claude Sonnet 4.6
parent 60d131c5d0
commit b27424e3a0
3 changed files with 4 additions and 5 deletions
-1
View File
@@ -15,7 +15,6 @@ interface ChatInputProps {
sourceLabel: string | null; sourceLabel: string | null;
setSourceLabel: (v: string | null) => void; setSourceLabel: (v: string | null) => void;
concurrentStatus: "idle" | "generating" | "stopping" | "cancelling"; concurrentStatus: "idle" | "generating" | "stopping" | "cancelling";
setConcurrentStatus: (s: "idle" | "generating" | "stopping" | "cancelling") => void;
onSubmit: (e: React.FormEvent) => void; onSubmit: (e: React.FormEvent) => void;
onStop: () => void; onStop: () => void;
onPaste: (e: React.ClipboardEvent) => void; onPaste: (e: React.ClipboardEvent) => void;
+3 -3
View File
@@ -305,9 +305,9 @@ export function ChatMessages({
return ( return (
<div key={message.id ?? idx} className="flex flex-col gap-3"> <div key={message.id ?? idx} className="flex flex-col gap-3">
{hasThinking && hasToolCalls && ( {hasToolCalls && (plainTextContent || hasThinking) && (
<div className="max-w-[85%]"> <div className="max-w-[85%] rounded-2xl rounded-bl-sm bg-muted text-foreground px-4 py-2.5 text-sm">
<MessageBubble content={bubbleContent} role="ai" isStreaming={thread.isLoading && isLastAi} /> <MessageBubble content={bubbleContent} role="ai" isStreaming={false} />
</div> </div>
)} )}
+1 -1
View File
@@ -275,6 +275,7 @@ function App() {
const lastHuman = humanMsgs[humanMsgs.length - 1]; const lastHuman = humanMsgs[humanMsgs.length - 1];
if (!lastHuman || thread.isLoading) return; if (!lastHuman || thread.isLoading) return;
setConcurrentStatus("generating");
const enabledTools = const enabledTools =
activeTools.size > 0 activeTools.size > 0
? TOOL_GROUPS.filter((g) => activeTools.has(g.key)).flatMap((g) => [...g.tools]) ? TOOL_GROUPS.filter((g) => activeTools.has(g.key)).flatMap((g) => [...g.tools])
@@ -450,7 +451,6 @@ function App() {
sourceLabel={sourceLabel} sourceLabel={sourceLabel}
setSourceLabel={setSourceLabel} setSourceLabel={setSourceLabel}
concurrentStatus={concurrentStatus} concurrentStatus={concurrentStatus}
setConcurrentStatus={setConcurrentStatus}
onSubmit={handleSubmit} onSubmit={handleSubmit}
onStop={handleStop} onStop={handleStop}
onPaste={handlePaste} onPaste={handlePaste}