ui: Agentic Content UX improvements (#25450)

* feat: Add shimmer text animation for processing state indicators

* feat: Redesign CollapsibleContentBlock component with improved UX

* feat: Add conditional setting display support with dependsOn field

* feat: Add showAgenticTurnStats setting for per-turn statistics

* feat: Update ChatMessageAgenticContent with improved UI and new features

* feat: Enhance file read tool UI/UX

* feat: Refine styling of collapsible content and code preview blocks

* feat: add terminal variant to CollapsibleContentBlock

* feat: add built-in tools UI registry

* feat: extract ChatMessageReasoningBlock and ChatMessageToolCallBlock

* refactor: simplify ChatMessageAgenticContent to use extracted blocks

* fix: correct markdown content block margin spacing

* fix: reorganize SettingsChatFields layout and reset button positioning

* fix: use direct map access in agentic store session methods

* refactor: remove reasoning preview/throttle system from CollapsibleContentBlock

* feat: add auto-scroll to reasoning block and remove showThoughtInProgress

* feat: add ChatMessageToolCallDateTime component and support for new tool types

* feat: improve auto-scroll reliability in reasoning block with RAF coalescing and MutationObserver

* feat: show MCP server favicon for tools without a built-in icon

* feat: add search-results parsing utilities and tests

* feat: add ChatMessageToolCallSearchResults component

* feat: integrate search results rendering into ChatMessageAgenticContent

* feat: display tool call input alongside output in ChatMessageToolCallBlock

* style: use muted foreground color in reasoning block content

* chore: Format

* feat: Refine reasoning block layout and make pending thoughts display configurable

* feat: Stream tool call code blocks with auto-scroll and handle partial JSON

* feat: add streaming permission gate infrastructure

* feat: wire permission gate into the agentic loop

* fix: bail out on abort and skip already-approved tool calls

* fix: clear partial tool calls on abort and savePartialResponse

* test: cover partial tool call cleanup end-to-end

* refactor: Remove streaming permission gate logic

* fix: Correct autoscroll and streaming gates for tool calls and reasoning blocks

* refactor: Chat Message Assistant componentization

* fix: Show health metadata for disabled MCP servers and promote connections on enable

* fix: Inherit global enabled state for missing MCP per-chat overrides

* refactor: Cleanup

* refactor: Split ChatMessageToolCallBlock into dedicated components

* feat: Add live streaming and auto-scroll for tool execution output

* feat: Add line numbers and change markers to file edit diffs

* chore: Formatting

* feat: Add type definitions and utilities for recommended MCP servers

* feat: Add recommended MCP servers configuration and storage key

* feat: Add McpServerCardCompact component for recommended servers

* feat: Add recommended servers section to Add New Server dialog

* feat: Update McpServerForm to support authorization requirements

* feat: Add select-none classes for text selection prevention

* feat: Add recommended MCP server icon assets

* refactor: Store dismissed MCP recommendations as a boolean flag

* feat: Render tool results as JSON or Markdown based on detected content type

* feat: UI improvement

* feat: Render search block early and update heading to show execution state

* fix: Prevent non-web-search tools from triggering the search UI block

* refactor: Cleanup

* refactor: Extract hardcoded icon size classes into shared constants

* refactor: Extract hardcoded tool result separator into a shared constant

* refactor: Tool Calls UI/logic

* refactor: Cleanup

* refactor: Cleanup

* refactor: Cleanup

tools/ui/src/lib/utils/code.ts

@@ -6,7 +6,9 @@ import {
 	AMPERSAND_REGEX,
 	LT_REGEX,
 	GT_REGEX,
-	FENCE_PATTERN
+	FENCE_PATTERN,
+	TRIM_LEADING_PADDING_REGEX,
+	TRIM_TRAILING_PADDING_REGEX
 } from '$lib/constants';
 
 export interface IncompleteCodeBlock {
@@ -15,6 +17,19 @@ export interface IncompleteCodeBlock {
 	openingIndex: number;
 }
 
+/**
+ * Strips empty lines (whitespace-only) from the start and end of code.
+ *
+ * Tool call payloads frequently arrive with surrounding whitespace from LLM
+ * formatting (`"\nfunction ...\n"`). Preserving those newlines makes hljs emit
+ * a leading/trailing empty line that `<pre>` then renders as a phantom row,
+ * pushing real content away from the box edge. The trim keeps the body intact
+ * so internal blank lines are still rendered as such.
+ */
+function trimCodePadding(code: string): string {
+	return code.replace(TRIM_LEADING_PADDING_REGEX, '').replace(TRIM_TRAILING_PADDING_REGEX, '');
+}
+
 /**
  * Highlights code using highlight.js
  * @param code - The code to highlight
@@ -24,24 +39,28 @@ export interface IncompleteCodeBlock {
 export function highlightCode(code: string, language: string): string {
 	if (!code) return '';
 
+	const trimmed = trimCodePadding(code);
+
 	try {
 		const lang = language.toLowerCase();
 		const isSupported = hljs.getLanguage(lang);
 
 		if (isSupported) {
-			return hljs.highlight(code, { language: lang }).value;
+			return hljs.highlight(trimmed, { language: lang }).value;
 		} else {
-			return hljs.highlightAuto(code).value;
+			return hljs.highlightAuto(trimmed).value;
 		}
 	} catch {
 		// Fallback to escaped plain text
-		return code
+		return trimmed
 			.replace(AMPERSAND_REGEX, '&amp;')
 			.replace(LT_REGEX, '&lt;')
 			.replace(GT_REGEX, '&gt;');
 	}
 }
 
+export { trimCodePadding };
+
 /**
  * Detects if markdown ends with an incomplete code block (opened but not closed).
  * Returns the code block info if found, null otherwise.