React-sortable-tree: Issue Deleting Node

[robhadfield]

Hi guys - got a little issue I'm hoping you can help with.

If I create a tree from scratch (using Add/Remove Node helpers) the deletion of a node works fine but I'm now loading in an array of data and, although it loads fine and most functions work, deleting a node throws an error.

Error, rowData and function below, hope you can help :)

Error:
Uncaught Error: No node found at the given path.

Here's the function I'm using:

    const newTreeData = removeNodeAtPath({
        treeData: treeData,
        path: path,   // You can use path from here
        getNodeKey: ({node: TreeNode, treeIndex: number}) => {
            return number;
        },
        ignoreCollapsed: false,
    });

Here is the rowData at that point:
{ "node": { "id": 67, "title": "Writing - vocabulary, grammar and punctuation", "order": 1 }, "parentNode": { "id": 13, "title": "All Writing Aspects", "order": 1, "children": [ { "id": 63, "title": "Writing - composition", "order": 1 }, { "id": 64, "title": "Writing - transcription - handwriting", "order": 1 }, { "id": 65, "title": "Writing - transcription - handwriting and presentation", "order": 1 }, { "id": 66, "title": "Writing - transcription - spelling", "order": 1 }, { "id": 67, "title": "Writing - vocabulary, grammar and punctuation", "order": 1 } ], "expanded": true }, "path": [ 14, 15, 20 ], "lowerSiblingCounts": [ 0, 0, 0 ], "treeIndex": 20, "isSearchMatch": false, "isSearchFocus": false }

[michaelwalloschke]

I can confirm the issue with removeNodeFromPath.
It only happens with pre-built treeData, no problems if you add your nodes programmatically with insertNode etc.

[fritz-c]

Sorry for the delayed response. I couldn't figure out what the issue was at first glance, but I reproduced it in my own environment, and realized the issue was that you're combining the use of treeIndex to identify your nodes in getNodeKey with ignoreCollapsed = false in your removeNodeAtPath call. treeIndexes are based on the location within the visible nodes, so you should be able to fix it by setting ignoreCollapsed = true (or just leaving it unset, as true is the default).

The ideal solution, since I see you have id properties on your objects, would be to set a getNodeKey as follows, on both the SortableTree props and in your util method calls:

const getNodeKey = ({ node: { id } }) => id;

In that case, removeNodeAtPath would work with ignoreCollapsed set either way (though the node would need to be visible if it was set to true).

[deepakkadarivel]

Check the solution here.
https://github.com/frontend-collective/react-sortable-tree/issues/80#issuecomment-514211018