Workflow block spacing adjustment #2545
Conversation
Reduces the horizontal spacing between blocks from 250px to 200px (20% closer) and centralizes the new block offset constants for consistent positioning across the codebase.
|
Cursor Agent can help with this pull request. Just |
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
| */ | ||
| export const NEW_BLOCK_OFFSET = { | ||
| /** Horizontal offset from source block */ | ||
| X: 200, |
There was a problem hiding this comment.
Hằng xuất khẩu NEW_BLOCK_OFFSET:
X: 200 (offset ngang từ block nguồn)
Y: 20 (offset dọc từ block nguồn)
Khai báo với as const để giữ giá trị dạng literal/readonly.
| import { create } from 'zustand' | ||
| import { devtools } from 'zustand/middleware' | ||
| import { createLogger } from '@/lib/logs/console/logger' | ||
| import { NEW_BLOCK_OFFSET } from '@/lib/workflows/autolayout/constants' |
There was a problem hiding this comment.
Thay vì dùng 250 và 20 cố định, code giờ dùng giá trị từ một hằng số tập trung (NEW_BLOCK_OFFSET). Điều này làm cho offset khi tạo block mới có thể điều chỉnh/đồng bộ từ một nơi duy nhất (dễ bảo trì, dễ thay đổi giao diện/autolayout)
| const offsetPosition = { | ||
| x: sourceBlock.position.x + 250, | ||
| y: sourceBlock.position.y + 20, | ||
| x: sourceBlock.position.x + NEW_BLOCK_OFFSET.X, |
There was a problem hiding this comment.
Trước: vị trí mới được tính bằng các "magic numbers" cố định x: sourceBlock.position.x + 250 và y: sourceBlock.position.y + 20
Sau: các giá trị 250 và 20 được thay bằng NEW_BLOCK_OFFSET.X và NEW_BLOCK_OFFSET.Y (và bạn thấy dòng import mới: import { NEW_BLOCK_OFFSET } from '@/lib/workflows/autolayout/constants')
Summary
Adjusts the default spacing for newly added and duplicated workflow blocks, as well as auto-layout, to place them closer together. This change reduces the horizontal offset from 250px to 200px and centralizes these values in a new
NEW_BLOCK_OFFSETconstant for consistency and easier future adjustments.Type of Change
Testing
The changes were verified by running lint and type checks. Reviewers can observe the new block placement when duplicating blocks or adding new blocks to the canvas.
Checklist
Screenshots/Videos