From 9eb9fabee0d31da4270a689735cf9a50c2d4ad1e Mon Sep 17 00:00:00 2001
From: Sam Hoang Van <samhv.ict@gmail.com>
Date: Fri, 13 Jun 2025 20:01:47 +0700
Subject: [PATCH] feat(ui): sync BatchDiffApproval styling with
 BatchFilePermission (#4640)

---
 .../src/components/chat/BatchDiffApproval.tsx | 32 ++++++++++---------
 1 file changed, 17 insertions(+), 15 deletions(-)

diff --git a/webview-ui/src/components/chat/BatchDiffApproval.tsx b/webview-ui/src/components/chat/BatchDiffApproval.tsx
index 03f06d4106..24ad8d489d 100644
--- a/webview-ui/src/components/chat/BatchDiffApproval.tsx
+++ b/webview-ui/src/components/chat/BatchDiffApproval.tsx
@@ -33,22 +33,24 @@ export const BatchDiffApproval = memo(({ files = [], ts }: BatchDiffApprovalProp
 
 	return (
 		<div className="pt-[5px]">
-			{files.map((file) => {
-				// Combine all diffs into a single diff string for this file
-				const combinedDiff = file.diffs?.map((diff) => diff.content).join("\n\n") || file.content
+			<div className="flex flex-col gap-0 border border-border rounded-md p-1">
+				{files.map((file) => {
+					// Combine all diffs into a single diff string for this file
+					const combinedDiff = file.diffs?.map((diff) => diff.content).join("\n\n") || file.content
 
-				return (
-					<div key={`${file.path}-${ts}`} className="mb-2">
-						<CodeAccordian
-							path={file.path}
-							code={combinedDiff}
-							language="diff"
-							isExpanded={expandedFiles[file.path] || false}
-							onToggleExpand={() => handleToggleExpand(file.path)}
-						/>
-					</div>
-				)
-			})}
+					return (
+						<div key={`${file.path}-${ts}`}>
+							<CodeAccordian
+								path={file.path}
+								code={combinedDiff}
+								language="diff"
+								isExpanded={expandedFiles[file.path] || false}
+								onToggleExpand={() => handleToggleExpand(file.path)}
+							/>
+						</div>
+					)
+				})}
+			</div>
 		</div>
 	)
 })