From 98269922f01de9b224953c3c55947551db2d5a3e Mon Sep 17 00:00:00 2001
From: sw3205933776 <3205933776@qq.com>
Date: Sat, 11 Oct 2025 11:17:34 +0800
Subject: [PATCH 1/3] fix: prevent canvas scrollbar resize from shrinking agent
 workspace

---
 src/components/WorkFlow/index.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/WorkFlow/index.tsx b/src/components/WorkFlow/index.tsx
index 9f0bdc564..ee4473fee 100644
--- a/src/components/WorkFlow/index.tsx
+++ b/src/components/WorkFlow/index.tsx
@@ -36,7 +36,7 @@ export default function Workflow({
 }: {
 	taskAssigning: Agent[];
 }) {
-	const {t} = useTranslation();
+	const { t } = useTranslation();
 	const chatStore = useChatStore();
 	const [isEditMode, setIsEditMode] = useState(false);
 	const [lastViewport, setLastViewport] = useState({ x: 0, y: 0, zoom: 1 });
@@ -245,7 +245,7 @@ export default function Workflow({
 						},
 						position: isEditMode
 							? node.position
-							: { x: index * (342+20) + 8, y: 16 },
+							: { x: index * (342 + 20) + 8, y: 16 },
 					};
 				} else {
 					return {
@@ -259,7 +259,7 @@ export default function Workflow({
 							isEditMode: isEditMode,
 							workerInfo: agent?.workerInfo,
 						},
-						position: { x: index * (342+20) + 8, y: 16 },
+						position: { x: index * (342 + 20) + 8, y: 16 },
 						type: "node",
 					};
 				}
@@ -400,6 +400,10 @@ export default function Workflow({
 					nodesDraggable={isEditMode}
 					panOnScrollMode={PanOnScrollMode.Horizontal}
 					onMove={(event, viewport) => {
+						const current = getViewport();
+						if (viewport.zoom !== current.zoom) {
+							setViewport({ ...viewport, zoom: current.zoom });
+						}
 						if (isEditMode) {
 							setLastViewport(viewport);
 						}

From 46d4250f4e70c572ff1e9bceed92c9a0f9ed23a3 Mon Sep 17 00:00:00 2001
From: sw3205933776 <3205933776@qq.com>
Date: Thu, 16 Oct 2025 14:26:09 +0800
Subject: [PATCH 2/3] update

---
 src/components/WorkFlow/index.tsx | 32 +++++++++++++++++--------------
 1 file changed, 18 insertions(+), 14 deletions(-)

diff --git a/src/components/WorkFlow/index.tsx b/src/components/WorkFlow/index.tsx
index ee4473fee..e92a873b2 100644
--- a/src/components/WorkFlow/index.tsx
+++ b/src/components/WorkFlow/index.tsx
@@ -293,6 +293,22 @@ export default function Workflow({
 		};
 	}, [getViewport, setViewport, isEditMode]);
 
+	const [isAnimating, setIsAnimating] = useState(false);
+	const moveViewport = (dx: number) => {
+		if (isAnimating) return;
+		const viewport = getViewport();
+		setIsAnimating(true);
+		setViewport(
+			{ x: viewport.x + dx, y: viewport.y, zoom: viewport.zoom },
+			{
+				duration: 500,
+			}
+		);
+		setTimeout(() => {
+			setIsAnimating(false);
+		}, 500);
+	};
+
 	const handleShare = async (taskId: string) => {
 		share(taskId);
 	};
@@ -343,12 +359,7 @@ export default function Workflow({
 							variant="ghost"
 							size="icon"
 							onClick={() => {
-								const viewport = getViewport();
-								const newX = Math.min(0, viewport.x + 200);
-								setViewport(
-									{ x: newX, y: viewport.y, zoom: viewport.zoom },
-									{ duration: 500 }
-								);
+								moveViewport(200);
 							}}
 						>
 							<ChevronLeft className="w-4 h-4 text-icon-primary" />
@@ -356,14 +367,7 @@ export default function Workflow({
 						<Button
 							variant="ghost"
 							size="icon"
-							onClick={() => {
-								const viewport = getViewport();
-								const newX = viewport.x - 200;
-								setViewport(
-									{ x: newX, y: viewport.y, zoom: viewport.zoom },
-									{ duration: 500 }
-								);
-							}}
+							onClick={() => moveViewport(-200)}
 						>
 							<ChevronRight className="w-4 h-4 text-icon-primary" />
 						</Button>

From 0eb1930593feca6e067ce41ada362430c5f199ce Mon Sep 17 00:00:00 2001
From: Wendong-Fan <w3ndong.fan@gmail.com>
Date: Mon, 20 Oct 2025 05:11:25 +0800
Subject: [PATCH 3/3] enhance: prevent canvas scrollbar resize from shrinking
 agent workspace PR490

---
 src/components/ChatBox/index.tsx  |  8 ++++----
 src/components/WorkFlow/index.tsx | 14 +++++++-------
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/components/ChatBox/index.tsx b/src/components/ChatBox/index.tsx
index 45d29ee6a..ee73bf1d6 100644
--- a/src/components/ChatBox/index.tsx
+++ b/src/components/ChatBox/index.tsx
@@ -294,10 +294,10 @@ export default function ChatBox(): JSX.Element {
 														onTyping={scrollToBottom}
 													/>
 													<div className="flex gap-2 flex-wrap">
-														{item.fileList?.map((file) => {
+														{item.fileList?.map((file, fileIndex) => {
 															return (
 																<div
-																	key={"file-" + file.name}
+																	key={`file-${item.id}-${fileIndex}-${file.name}`}
 																	onClick={() => {
 																		// set selected file
 																		chatStore.setSelectedFile(
@@ -376,10 +376,10 @@ export default function ChatBox(): JSX.Element {
 													onTyping={scrollToBottom}
 												/> */}
 												<div className="flex gap-2 flex-wrap">
-													{item.fileList?.map((file) => {
+													{item.fileList?.map((file, fileIndex) => {
 														return (
 															<div
-																key={"file-" + file.name}
+																key={`file-${item.id}-${fileIndex}-${file.name}`}
 																onClick={() => {
 																	// set selected file
 																	chatStore.setSelectedFile(
diff --git a/src/components/WorkFlow/index.tsx b/src/components/WorkFlow/index.tsx
index e92a873b2..42c013243 100644
--- a/src/components/WorkFlow/index.tsx
+++ b/src/components/WorkFlow/index.tsx
@@ -31,6 +31,8 @@ const nodeTypes: NodeTypes = {
 	node: (props: any) => <CustomNodeComponent {...props} />,
 };
 
+const VIEWPORT_ANIMATION_DURATION = 500;
+
 export default function Workflow({
 	taskAssigning,
 }: {
@@ -298,15 +300,17 @@ export default function Workflow({
 		if (isAnimating) return;
 		const viewport = getViewport();
 		setIsAnimating(true);
+		// Prevent scrolling past x=0 (too far right) when moving left
+		const newX = dx > 0 ? Math.min(0, viewport.x + dx) : viewport.x + dx;
 		setViewport(
-			{ x: viewport.x + dx, y: viewport.y, zoom: viewport.zoom },
+			{ x: newX, y: viewport.y, zoom: viewport.zoom },
 			{
-				duration: 500,
+				duration: VIEWPORT_ANIMATION_DURATION,
 			}
 		);
 		setTimeout(() => {
 			setIsAnimating(false);
-		}, 500);
+		}, VIEWPORT_ANIMATION_DURATION);
 	};
 
 	const handleShare = async (taskId: string) => {
@@ -404,10 +408,6 @@ export default function Workflow({
 					nodesDraggable={isEditMode}
 					panOnScrollMode={PanOnScrollMode.Horizontal}
 					onMove={(event, viewport) => {
-						const current = getViewport();
-						if (viewport.zoom !== current.zoom) {
-							setViewport({ ...viewport, zoom: current.zoom });
-						}
 						if (isEditMode) {
 							setLastViewport(viewport);
 						}