xyflow / xyflow

React Flow | Svelte Flow - Powerful open source libraries for building node-based UIs with React (https://reactflow.dev) or Svelte (https://svelteflow.dev). Ready out-of-the-box and infinitely customizable.
https://xyflow.com
MIT License
21.54k stars 1.43k forks source link

Having multiple edges pointing to one single handle, makes it hard for the user to update an edge from a handle to another #4181

Closed zakaria-imzilen closed 1 month ago

zakaria-imzilen commented 1 month ago

Describe the Bug

Considering having 3 nodes, 2 of them have 2 edges pointing to the 3rd node on one single handle, Changing the 2 edge handles is impossible by selecting and dragging it to another handle.

In this example below (image), if I'd like to change the top edge from pointing out to the "Delivery and Customer Support" node to another one, I'd like to select the edge between them and then try to drag its end to another node. This approach doesn't always work.

There's some other logic behind that I don't understand.

Screenshot 2024-04-18 at 12 33 56

Your Example Website or App

https://flowsiti.ai

Steps to Reproduce the Bug or Issue

1- Click on Start Here 2- Click on the "First Process" button 3- Drag and drop a handle to create an adjacent node (Repeat 2 times) to end up with the same image I attached 3- Now try to change one of the edges target handle.

Expected behavior

As a user, I expect when selecting an edge to be able to move it anywhere else.

Screenshots or Videos

Screenshot 2024-04-18 at 12 42 31

Platform

Additional context

No response