From e17cdc96989ca80728c349d1ac27af6c8a6fdc6f Mon Sep 17 00:00:00 2001
From: Waleed Latif <walif6@gmail.com>
Date: Fri, 30 May 2025 19:04:38 -0700
Subject: [PATCH] fix(formatting): fixed widths & heights for auto-formatting

---
 .../app/w/[id]/components/workflow-edge/workflow-edge.tsx | 4 +++-
 apps/sim/app/w/[id]/utils.ts                              | 8 ++++----
 apps/sim/app/w/[id]/workflow.tsx                          | 4 ++--
 3 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/apps/sim/app/w/[id]/components/workflow-edge/workflow-edge.tsx b/apps/sim/app/w/[id]/components/workflow-edge/workflow-edge.tsx
index d044dfba7b..0b87808d06 100644
--- a/apps/sim/app/w/[id]/components/workflow-edge/workflow-edge.tsx
+++ b/apps/sim/app/w/[id]/components/workflow-edge/workflow-edge.tsx
@@ -12,6 +12,8 @@ export const WorkflowEdge = ({
   data,
   style,
 }: EdgeProps) => {
+  const isHorizontal = sourcePosition === 'right' || sourcePosition === 'left'
+
   const [edgePath, labelX, labelY] = getSmoothStepPath({
     sourceX,
     sourceY,
@@ -20,7 +22,7 @@ export const WorkflowEdge = ({
     targetY,
     targetPosition,
     borderRadius: 8,
-    offset: 10,
+    offset: isHorizontal ? 30 : 20,
   })
 
   // Use the directly provided isSelected flag instead of computing it
diff --git a/apps/sim/app/w/[id]/utils.ts b/apps/sim/app/w/[id]/utils.ts
index 3d269af5a1..d2eeb965e2 100644
--- a/apps/sim/app/w/[id]/utils.ts
+++ b/apps/sim/app/w/[id]/utils.ts
@@ -721,13 +721,13 @@ export const calculateAutoLayout = (
 
         const baseSpacing = horizontalSpacing
         const widthAdjustment = Math.max(maxCurrentWidth, maxNextWidth) - 350 // 350 is standard width
-        const connectionTagSpace = 50 // Reduced from 100 - Extra space for connection tags
+        const connectionTagSpace = 100
 
         const isOrphanedLayer =
           currentLayer > maxLayer - 2 &&
           (currentLayerGroups.some((group) => group.some((nodeId) => orphanedBlocks.has(nodeId))) ||
             nextLayerGroups.some((group) => group.some((nodeId) => orphanedBlocks.has(nodeId))))
-        const orphanedSpacing = isOrphanedLayer ? 100 : 0
+        const orphanedSpacing = isOrphanedLayer ? 200 : 0
 
         return baseSpacing + widthAdjustment + connectionTagSpace + orphanedSpacing
       }
@@ -837,13 +837,13 @@ export const calculateAutoLayout = (
 
         const baseSpacing = verticalSpacing
         const heightAdjustment = Math.max(maxCurrentHeight, maxNextHeight) - 150 // 150 is standard height
-        const connectionTagSpace = 25
+        const connectionTagSpace = 50
 
         const isOrphanedLayer =
           currentLayer > maxLayer - 2 &&
           (currentLayerGroups.some((group) => group.some((nodeId) => orphanedBlocks.has(nodeId))) ||
             nextLayerGroups.some((group) => group.some((nodeId) => orphanedBlocks.has(nodeId))))
-        const orphanedSpacing = isOrphanedLayer ? 75 : 0
+        const orphanedSpacing = isOrphanedLayer ? 150 : 0
 
         return baseSpacing + heightAdjustment + connectionTagSpace + orphanedSpacing
       }
diff --git a/apps/sim/app/w/[id]/workflow.tsx b/apps/sim/app/w/[id]/workflow.tsx
index a0601613de..20d51569cd 100644
--- a/apps/sim/app/w/[id]/workflow.tsx
+++ b/apps/sim/app/w/[id]/workflow.tsx
@@ -159,13 +159,13 @@ function WorkflowContent() {
         ? {
             // Vertical handles: optimize for top-to-bottom flow
             horizontalSpacing: 400,
-            verticalSpacing: 150,
+            verticalSpacing: 300,
             startX: 200,
             startY: 200,
           }
         : {
             // Horizontal handles: optimize for left-to-right flow
-            horizontalSpacing: 300,
+            horizontalSpacing: 600,
             verticalSpacing: 200,
             startX: 150,
             startY: 300,