From 355c38f8102cde289a1c4645e32b38094f867db9 Mon Sep 17 00:00:00 2001
From: sam hoang <samhv.ict@gmail.com>
Date: Fri, 13 Jun 2025 19:13:55 +0700
Subject: [PATCH] feat(ui): sync BatchDiffApproval styling with
 BatchFilePermission

- Add unified container with border and rounded corners
- Remove individual item margins for consistent spacing
- Align visual design between batch approval components
---
 .../src/components/chat/BatchDiffApproval.tsx | 34 ++++++++++---------
 1 file changed, 18 insertions(+), 16 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
-
-				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>
-				)
-			})}
+			<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}`}>
+							<CodeAccordian
+								path={file.path}
+								code={combinedDiff}
+								language="diff"
+								isExpanded={expandedFiles[file.path] || false}
+								onToggleExpand={() => handleToggleExpand(file.path)}
+							/>
+						</div>
+					)
+				})}
+			</div>
 		</div>
 	)
 })