Cannot delete link on clicking.

[ToughDude]

I was refering to the example in storybook demo for deleting a link. But on clicking on "cross" button, nothing happens. Is is supposed to not be deleted or a bug? Also can there be a functionality of adding a node on click of button which is on a link. Please look into this asap as I'm in urgent need for this.

[kcvin94]

So you created your own custom Link component, adding in a X button which you want to delete the link on click, is that correct? If you are controlling your own state, all you need to do is delete that link entry on click. So something like:

const CustomLink = ({ link }) => {
  return (
    <>
      <CustomLinkSVG />
      <button
        onClick={e => {
          e.stopPropagation();
          // Can use deep clone if shallow clone gives issues
          const clonedLinks = { ...state.links };
          delete clonedLinks[link.id];
          setState({
            ...state,
            links: clonedLinks,
          });
        }}
      >
        X
      </button>
    </>
  )
}

In my own personal implementation, I also had to access the two Nodes that the Link was connected with and update some data of it too. You may need to do that as well.

And to add a Node on click of a button on a Link, you will also have to build that yourself, by adding a new generated entry with whatever data you want it to contain. Just setState it.