From 1c9ac97f876a82c6ce3b18e30ffdeea79ccd4481 Mon Sep 17 00:00:00 2001
From: Guilhem <guilhemlemouel@gmail.com>
Date: Wed, 25 Feb 2026 15:48:09 +0000
Subject: [PATCH] fix: correct asset node x offset inside loops and branches
 (#8093)

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../src/lib/components/graph/FlowGraphV2.svelte  |  2 +-
 .../graph/renderers/nodes/AssetNode.svelte       | 16 +++++++++-------
 2 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/frontend/src/lib/components/graph/FlowGraphV2.svelte b/frontend/src/lib/components/graph/FlowGraphV2.svelte
index 0ad3ca837d..f0c89e523b 100644
--- a/frontend/src/lib/components/graph/FlowGraphV2.svelte
+++ b/frontend/src/lib/components/graph/FlowGraphV2.svelte
@@ -585,7 +585,7 @@
 		let assetNodesResult = $showAssets
 			? computeAssetNodes(
 					newNodes.map((n) => ({
-						data: { assets: n.data?.assets as AssetWithAltAccessType[] },
+						data: { assets: n.data?.assets as AssetWithAltAccessType[], offset: n.data?.offset as number },
 						id: n.id,
 						position: n.position
 					}))
diff --git a/frontend/src/lib/components/graph/renderers/nodes/AssetNode.svelte b/frontend/src/lib/components/graph/renderers/nodes/AssetNode.svelte
index 7b144a3fb6..8d33b6d1e2 100644
--- a/frontend/src/lib/components/graph/renderers/nodes/AssetNode.svelte
+++ b/frontend/src/lib/components/graph/renderers/nodes/AssetNode.svelte
@@ -11,7 +11,7 @@
 	let computeAssetNodesCache: [NodeDep[], ReturnType<typeof computeAssetNodes>] | undefined
 
 	type NodeDep = {
-		data: object & { assets?: AssetWithAltAccessType[] | undefined }
+		data: object & { assets?: AssetWithAltAccessType[] | undefined; offset?: number }
 		id: string
 		position: { x: number; y: number }
 	}
@@ -78,13 +78,14 @@
 					width: inputAssetWidth,
 					position: {
 						x:
-							displayedInputAssets.length === 1
+							(node.data.offset ?? 0) +
+							(displayedInputAssets.length === 1
 								? (NODE.width - inputAssetWidth) / 2 - 10 // Ensure we see the edge
 								: (inputAssetWidth + inputAssetXGap) * (i - displayedInputAssets.length / 2) +
 									(NODE.width + inputAssetXGap) / 2 +
 									(overflowedInputAssets.length
 										? (-ASSETS_OVERFLOWED_NODE_WIDTH - inputAssetXGap) / 2
-										: 0),
+										: 0)),
 						y: READ_ASSET_Y_OFFSET
 					},
 					selectable: false
@@ -115,13 +116,14 @@
 					width: outputAssetWidth,
 					position: {
 						x:
-							displayedOutputAssets.length === 1
+							(node.data.offset ?? 0) +
+							(displayedOutputAssets.length === 1
 								? (NODE.width - outputAssetWidth) / 2 - 10 // Ensure we see the edge
 								: (outputAssetWidth + outputAssetXGap) * (i - displayedOutputAssets.length / 2) +
 									(NODE.width + outputAssetXGap) / 2 +
 									(overflowedOutputAssets.length
 										? (-ASSETS_OVERFLOWED_NODE_WIDTH - outputAssetXGap) / 2
-										: 0),
+										: 0)),
 						y: WRITE_ASSET_Y_OFFSET
 					},
 					selectable: false
@@ -155,7 +157,7 @@
 					parentId: node.id,
 					width: ASSETS_OVERFLOWED_NODE_WIDTH,
 					position: {
-						x: MAX_ASSET_ROW_WIDTH - ASSETS_OVERFLOWED_NODE_WIDTH - 14,
+						x: (node.data.offset ?? 0) + MAX_ASSET_ROW_WIDTH - ASSETS_OVERFLOWED_NODE_WIDTH - 14,
 						y: READ_ASSET_Y_OFFSET
 					}
 				} satisfies Node & AssetsOverflowedN)
@@ -174,7 +176,7 @@
 					parentId: node.id,
 					width: ASSETS_OVERFLOWED_NODE_WIDTH,
 					position: {
-						x: MAX_ASSET_ROW_WIDTH - ASSETS_OVERFLOWED_NODE_WIDTH - 14,
+						x: (node.data.offset ?? 0) + MAX_ASSET_ROW_WIDTH - ASSETS_OVERFLOWED_NODE_WIDTH - 14,
 						y: WRITE_ASSET_Y_OFFSET
 					}
 				} satisfies Node & AssetsOverflowedN)