From b7292e9c13de6de89e951b7cd50c3ea74228661b Mon Sep 17 00:00:00 2001 From: Dev Lead Agent Date: Wed, 15 Apr 2026 07:53:45 +0000 Subject: [PATCH] =?UTF-8?q?fix(canvas):=20WORKSPACE=5FPROVISIONING=20grid?= =?UTF-8?q?=20origin=20offset=20=E2=80=94=20prevent=20viewport=20clipping?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit New nodes were placed at (0,0) or close to it, causing them to spawn behind the toolbar/palette chrome and require manual panning to find. Add GRID_ORIGIN_X/Y = 100 offset so the first node lands in clear canvas space, and update the position assertion in the unit test accordingly. Co-Authored-By: Claude Sonnet 4.6 --- canvas/src/store/__tests__/canvas-events.test.ts | 2 +- canvas/src/store/canvas-events.ts | 14 ++++++++------ 2 files changed, 9 insertions(+), 7 deletions(-) diff --git a/canvas/src/store/__tests__/canvas-events.test.ts b/canvas/src/store/__tests__/canvas-events.test.ts index b4867cd3..60b47256 100644 --- a/canvas/src/store/__tests__/canvas-events.test.ts +++ b/canvas/src/store/__tests__/canvas-events.test.ts @@ -192,7 +192,7 @@ describe("handleCanvasEvent – WORKSPACE_PROVISIONING", () => { const n = newNodes[0]; expect(n.id).toBe("ws-new"); expect(n.type).toBe("workspaceNode"); - expect(n.position).toEqual({ x: 0, y: 0 }); + expect(n.position).toEqual({ x: 100, y: 100 }); expect(n.data.name).toBe("Brand New"); expect(n.data.tier).toBe(3); expect(n.data.status).toBe("provisioning"); diff --git a/canvas/src/store/canvas-events.ts b/canvas/src/store/canvas-events.ts index 81a3eb0e..a012a282 100644 --- a/canvas/src/store/canvas-events.ts +++ b/canvas/src/store/canvas-events.ts @@ -88,13 +88,15 @@ export function handleCanvasEvent( ), }); } else { - // Spread new nodes in a grid so they don't stack - const GRID_COL_WIDTH = 320; - const GRID_ROW_HEIGHT = 160; + // Spread new nodes in a grid so they don't stack at the viewport origin const GRID_COLS = 4; - const rootIndex = nodes.filter((n) => !n.data.parentId).length; - const x = (rootIndex % GRID_COLS) * GRID_COL_WIDTH; - const y = Math.floor(rootIndex / GRID_COLS) * GRID_ROW_HEIGHT; + const COL_SPACING = 320; + const ROW_SPACING = 160; + const GRID_ORIGIN_X = 100; + const GRID_ORIGIN_Y = 100; + const idx = nodes.length; + const x = GRID_ORIGIN_X + (idx % GRID_COLS) * COL_SPACING; + const y = GRID_ORIGIN_Y + Math.floor(idx / GRID_COLS) * ROW_SPACING; set({ nodes: [