Using undo-redo with cytoscape-edgehandles

[roddc]

I am using edgehandles to draw edges, when I added an edge and then undo, it will delete the last added or target node , I need to call ur.do('add', addedEdge) in the edgehandles's complete() to fix this problem, is this the right way to do it

[mkhoussid]

You first have to remove the edge that was created in the ehcomplete callback, and then add it with undoRedo

In React,

cyRef.current.on('ehcomplete', (event, sourceNode, targetNode, addedEles) => { // https://github.com/cytoscape/cytoscape.js-edgehandles#events
        cyRef.current.remove(addedEles[0]); // remove from cy directly

        const actions = []; // 'batch' array (I recommend doing all undo-redo action as batches)
        actions.push({
            name: 'add',
            param: {
                group: 'edges',
                data: { id: addedEles[0].id(), source: sourceNode.id(), target: targetNode.id() },
            },
        });

        urRef.current.do('batch', actions); // add back to cy via ur: https://github.com/iVis-at-Bilkent/cytoscape.js-undo-redo#default-actions-undoableredoable
    });
}, [nodes, isSelectingEdges]);