From 528a560a25f1acca9b3cc5de1adba0946207ae60 Mon Sep 17 00:00:00 2001
From: Aleksander Grygier <aleksander.grygier@gmail.com>
Date: Mon, 12 Jan 2026 11:14:53 +0100
Subject: [PATCH] fix: Distinguish streaming vs incomplete tool calls in UI

---
 .../chat/ChatMessages/AgenticContent.svelte   | 26 ++++++++++++++-----
 .../ChatMessages/ChatMessageAssistant.svelte  |  2 +-
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/tools/server/webui/src/lib/components/app/chat/ChatMessages/AgenticContent.svelte b/tools/server/webui/src/lib/components/app/chat/ChatMessages/AgenticContent.svelte
index 46e02de460..673f3b1069 100644
--- a/tools/server/webui/src/lib/components/app/chat/ChatMessages/AgenticContent.svelte
+++ b/tools/server/webui/src/lib/components/app/chat/ChatMessages/AgenticContent.svelte
@@ -13,13 +13,14 @@
 		SyntaxHighlightedCode
 	} from '$lib/components/app';
 	import { config } from '$lib/stores/settings.svelte';
-	import { Wrench, Loader2 } from '@lucide/svelte';
+	import { Wrench, Loader2, AlertTriangle } from '@lucide/svelte';
 	import { AgenticSectionType } from '$lib/enums';
 	import { AGENTIC_TAGS, AGENTIC_REGEX } from '$lib/constants/agentic';
 	import { formatJsonPretty } from '$lib/utils/formatters';
 
 	interface Props {
 		content: string;
+		isStreaming?: boolean;
 	}
 
 	interface AgenticSection {
@@ -30,7 +31,7 @@
 		toolResult?: string;
 	}
 
-	let { content }: Props = $props();
+	let { content, isStreaming = false }: Props = $props();
 
 	const sections = $derived(parseAgenticContent(content));
 
@@ -186,19 +187,24 @@
 				<MarkdownContent content={section.content} />
 			</div>
 		{:else if section.type === AgenticSectionType.TOOL_CALL_STREAMING}
+			{@const streamingIcon = isStreaming ? Loader2 : AlertTriangle}
+			{@const streamingIconClass = isStreaming ? 'h-4 w-4 animate-spin' : 'h-4 w-4 text-yellow-500'}
+			{@const streamingSubtitle = isStreaming ? 'streaming...' : 'incomplete'}
 			<CollapsibleContentBlock
 				open={isExpanded(index, true)}
 				class="my-2"
-				icon={Loader2}
-				iconClass="h-4 w-4 animate-spin"
+				icon={streamingIcon}
+				iconClass={streamingIconClass}
 				title={section.toolName || 'Tool call'}
-				subtitle="streaming..."
+				subtitle={streamingSubtitle}
 				onToggle={() => toggleExpanded(index, true)}
 			>
 				<div class="pt-3">
 					<div class="my-3 flex items-center gap-2 text-xs text-muted-foreground">
 						<span>Arguments:</span>
-						<Loader2 class="h-3 w-3 animate-spin" />
+						{#if isStreaming}
+							<Loader2 class="h-3 w-3 animate-spin" />
+						{/if}
 					</div>
 					{#if section.toolArgs}
 						<SyntaxHighlightedCode
@@ -207,10 +213,16 @@
 							maxHeight="20rem"
 							class="text-xs"
 						/>
-					{:else}
+					{:else if isStreaming}
 						<div class="rounded bg-muted/30 p-2 text-xs text-muted-foreground italic">
 							Receiving arguments...
 						</div>
+					{:else}
+						<div
+							class="rounded bg-yellow-500/10 p-2 text-xs text-yellow-600 italic dark:text-yellow-400"
+						>
+							Response was truncated
+						</div>
 					{/if}
 				</div>
 			</CollapsibleContentBlock>
diff --git a/tools/server/webui/src/lib/components/app/chat/ChatMessages/ChatMessageAssistant.svelte b/tools/server/webui/src/lib/components/app/chat/ChatMessages/ChatMessageAssistant.svelte
index 79836a96bc..312e832d8a 100644
--- a/tools/server/webui/src/lib/components/app/chat/ChatMessages/ChatMessageAssistant.svelte
+++ b/tools/server/webui/src/lib/components/app/chat/ChatMessages/ChatMessageAssistant.svelte
@@ -183,7 +183,7 @@
 		{#if showRawOutput}
 			<pre class="raw-output">{messageContent || ''}</pre>
 		{:else if isAgenticContent}
-			<AgenticContent content={messageContent || ''} />
+			<AgenticContent content={messageContent || ''} isStreaming={isChatStreaming()} />
 		{:else}
 			<MarkdownContent content={messageContent || ''} />
 		{/if}