onConnect is burried in NodeGraphEditor
Hi,
I like your software and tried to use it. I introduced a drag and drop feature. Just a frame with a folder -tree. The files in the folder-tree may be dragged into the NodeEditor and appear as nodes immediately. This works fine, but I tried to add the edges as soon as they are connected between the nodes, I expected it will be possible to accumulate the nodes and edges step by step and eventually save the json structure of nodes and edges in the backend. I ran into trouble because onConnect is never triggered. Eventually I found out it is hardcoded onConnect=useSocketConnect() in NodeGraphEditor. So I never get anything in my components. Is there anything you provided to store the edges as well in a structure or to get some event from the hook onConnect?
I can add nodes, but I can not add edges.
const TheNodeEditor = () => {
const [nodes, setNodes] = useState([
{ id: "1", type: "workflow", position: { x: 50, y: 50 }, data: {} },
{ id: "2", type: "workflow", position: { x: 400, y: 100 }, data: {} }
]);
const [edges, setEdges] = useState([
{ id: "e1", source: "1", target: "2", sourceHandle: "source", targetHandle: "drain" }
]);
const onNodeDragStop = (event, node) => {
setNodes((prevNodes) => prevNodes.map((n) => {
if (n.id === node.id) {
return { ...n, position: { x: node.position.x, y: node.position.y } };
}
return n;
}));
};
. . . onNodeDragStop={onNodeDragStop} works, but onConnect={onConnect} does not.
Any clue.
Thank you for your help in advance.
Greetings from Munich
Peter