From 9dfe7e118db91a2b28cf9a2f015cfd3af0ea836a Mon Sep 17 00:00:00 2001
From: KJ7LNW <93454819+KJ7LNW@users.noreply.github.com>
Date: Thu, 8 May 2025 19:49:04 -0700
Subject: [PATCH] fix: show properly formatted multi-line commands in preview
 (#3368)

Co-authored-by: Eric Wheeler <roo-code@z.ewheeler.org>
---
 webview-ui/src/components/chat/CommandExecution.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/webview-ui/src/components/chat/CommandExecution.tsx b/webview-ui/src/components/chat/CommandExecution.tsx
index 005484c36d..8e648f26cc 100644
--- a/webview-ui/src/components/chat/CommandExecution.tsx
+++ b/webview-ui/src/components/chat/CommandExecution.tsx
@@ -12,6 +12,7 @@ import { vscode } from "@src/utils/vscode"
 import { useExtensionState } from "@src/context/ExtensionStateContext"
 import { cn } from "@src/lib/utils"
 import { Button } from "@src/components/ui"
+import CodeBlock from "../common/CodeBlock"
 
 interface CommandExecutionProps {
 	executionId: string
@@ -86,8 +87,8 @@ export const CommandExecution = ({ executionId, text }: CommandExecutionProps) =
 
 	return (
 		<div className="w-full bg-vscode-editor-background border border-vscode-border rounded-xs p-2">
+			<CodeBlock source={command} language="shell" />
 			<div className="flex flex-row items-center justify-between gap-2 px-1">
-				<Line className="text-sm whitespace-nowrap overflow-hidden text-ellipsis">{command}</Line>
 				<div className="flex flex-row items-center gap-1">
 					{status?.status === "started" && (
 						<div className="flex flex-row items-center gap-2 font-mono text-xs">