Skip to content

fix: resolve node handle misalignment during live edits#363

Closed
jainarjav80-sys wants to merge 3 commits into
ioflux-org:mainfrom
jainarjav80-sys:fix-handle-misalignment
Closed

fix: resolve node handle misalignment during live edits#363
jainarjav80-sys wants to merge 3 commits into
ioflux-org:mainfrom
jainarjav80-sys:fix-handle-misalignment

Conversation

@jainarjav80-sys

@jainarjav80-sys jainarjav80-sys commented Jul 8, 2026

Copy link
Copy Markdown

Summary

This PR resolves an issue where React Flow connection lines (edges) become visually misaligned when a node's internal dimensions or row positions change dynamically during live schema editing.

What kind of change does this PR introduce

Bug fix

Issue Number

Closes #338

Screenshots/Video

before :
image

after :
image

Does this PR introduce a breaking change?

No. This is a targeted UI fix to ensure React Flow recalculates node internals correctly.

If relevant, did you update the documentation?

No documentation updates were necessary.

@jainarjav80-sys

Copy link
Copy Markdown
Author

Hey @AgniveshChaubey & @jagpreetrahi, could you please review this PR whenever have some time

@github-actions

Copy link
Copy Markdown
Contributor

Preview Deployed!

Item Status
Latest Deploy Visit Preview
Environment Preview (PR-363)
Action View Logs

Last updated at 2026-07-10T18:12:35Z

Comment thread src/components/CustomReactFlowNode.tsx Outdated
updateNodeInternals(id);
}, 0);
return () => clearTimeout(timer);
}, [handleOffsets, id, updateNodeInternals]);

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It doesn't look like this solution is working. I can still see the same issue when editing schema. Please make sure to test your solution properly locally.

@jainarjav80-sys

Copy link
Copy Markdown
Author

@AgniveshChaubey Good catch! The issue was that getBoundingClientRect() was scaling incorrectly when the graph was zoomed in/out. I've pushed a fix that uses offsetTop for true unscaled coordinates and a ResizeObserver to reliably catch all layout shifts. The missing changeset has also been added!

@jainarjav80-sys jainarjav80-sys closed this by deleting the head repository Jul 14, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Fix Handle Mis-alignment

2 participants