diff --git a/web/src/app/chat/components/message-list-view.tsx b/web/src/app/chat/components/message-list-view.tsx index 6ccb5f8..5ad631d 100644 --- a/web/src/app/chat/components/message-list-view.tsx +++ b/web/src/app/chat/components/message-list-view.tsx @@ -314,11 +314,13 @@ function ThoughtBlock({ content, isStreaming, hasMainContent, + contentChunks, }: { className?: string; content: string; isStreaming?: boolean; hasMainContent?: boolean; + contentChunks?: string[]; }) { const t = useTranslations("chat.research"); const [isOpen, setIsOpen] = useState(true); @@ -336,6 +338,12 @@ function ThoughtBlock({ return null; } + // Split content into static (previous chunks) and streaming (current chunk) + const chunks = contentChunks ?? []; + const staticContent = chunks.slice(0, -1).join(""); + const streamingChunk = isStreaming && chunks.length > 0 ? (chunks[chunks.length - 1] ?? "") : ""; + const hasStreamingContent = isStreaming && streamingChunk.length > 0; + return (
@@ -399,15 +407,39 @@ function ThoughtBlock({ scrollShadow={false} autoScrollToBottom > - - {content} - + {staticContent && ( + + {staticContent} + + )} + {hasStreamingContent && ( + + {streamingChunk} + + )} + {!hasStreamingContent && ( + + {content} + + )}
@@ -473,6 +505,7 @@ function PlanCard({ content={reasoningContent} isStreaming={isThinking} hasMainContent={hasMainContent} + contentChunks={message.reasoningContentChunks} /> )} {shouldShowPlan && ( @@ -484,7 +517,7 @@ function PlanCard({ - + {`### ${ plan.title !== undefined && plan.title !== "" ? plan.title @@ -495,7 +528,7 @@ function PlanCard({
- + {plan.thought} {plan.steps && ( @@ -505,7 +538,7 @@ function PlanCard({

- + {step.title} {step.tools && step.tools.length > 0 && ( @@ -520,7 +553,7 @@ function PlanCard({ )}

- + {step.description}