Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: upgrade to React Flow v12 #1173

Merged
merged 1 commit into from
Apr 24, 2024
Merged

chore: upgrade to React Flow v12 #1173

merged 1 commit into from
Apr 24, 2024

Conversation

dhess
Copy link
Member

@dhess dhess commented Apr 24, 2024

No description provided.

@dhess dhess added the Do not merge Do not merge label Apr 24, 2024
@dhess
Copy link
Member Author

dhess commented Apr 24, 2024

This appears to work, with one exception. match branch patterns are drawn in the upper-left of the flow's bounding box. For example:

Screenshot 2024-04-24 at 11 54 02 AM

It's not clear yet whether this is an upstream bug, or something that didn't port correctly.

Also, the bug described in #1148 is still present, though it's much less frequent: whereas with React Flow v11.10.4 and later it happens on the first node selection with Chrome, with this version of React Flow, it happens only rarely on any browser. I'd hoped this might be an 11.x-only bug, but it appears not.

@dhess
Copy link
Member Author

dhess commented Apr 24, 2024

Similar to React Flow v11.10.4 as noted in #1148 (comment), the bug described in #1148 is very difficult to trigger with React Flow v12 when deployed; in fact, I have not managed to trigger it yet after recreating a program that triggers it 100% (in Chrome) when running the app locally via vite in HMR mode. Therefore, I think once the match branch pattern labels are fixed, we might as well merge this PR.

This was fairly easy to do. I followed the guide posted here:

xyflow/xyflow#3764

Besides the renamed imports, the only particularly notable changes
required were:

* Replacing `unknown` type parameters with more specific types, as
React Flow now has better types; and

* changing `node.parentNode` with `node.parentId`, which fixed an
issue where Primer `match` branch labels were misplaced.

Signed-off-by: Drew Hess <[email protected]>
@dhess dhess force-pushed the dhess/reactflow-12 branch from b8cab9a to 6bbf659 Compare April 24, 2024 22:45
@dhess
Copy link
Member Author

dhess commented Apr 24, 2024

The branch label bug is now fixed. All that was required was to change node.parentNode to node.parentId as explained in the preliminary migration guide here: xyflow/xyflow#3764

@dhess dhess removed the Do not merge Do not merge label Apr 24, 2024
@dhess dhess added this pull request to the merge queue Apr 24, 2024
Merged via the queue into main with commit 4d2a578 Apr 24, 2024
33 checks passed
@dhess dhess deleted the dhess/reactflow-12 branch April 24, 2024 22:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Deploy service Deploy the backend service for this PR
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant