frontend-collective / frontend-collective/react-sortable-tree

Error: Cannot add to children defined by a function

Open
#278 2 comments 0 reactions 0 assignees View on GitHub
bug
Dominant language
JavaScript
Stars
5k
Forks
914
PR merge metrics
No merged PRs in 30d

Description

Tried to keep the demo as simple as possible.
https://codesandbox.io/s/2oko3wl8v0

Scenario:
Try to drag a node under another node which has a lazy loader function as value children property.

Result:
It throws error stated below:
```
Cannot add to children defined by a function
addNodeAtDepthAndIndex
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:553:63
addNodeAtDepthAndIndex/newChildren<
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:621:33
addNodeAtDepthAndIndex
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:619:64
addNodeAtDepthAndIndex/newChildren<
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:621:33
addNodeAtDepthAndIndex
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:619:64
insertNode
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:676:32
memoizedInsertNode
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:1199:37
value
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:1468:201
hover
https://2oko3wl8v0.codesandbox.io/node_modules/react-sortable-tree/dist/main.js:2652:81
hover
https://2oko3wl8v0.codesandbox.io/node_modules/react-dnd/lib/createTargetFactory.js:71:5
hover
https://2oko3wl8v0.codesandbox.io/node_modules/dnd-core/lib/actions/dragDrop.js:139:3
bindActionCreator/<
https://2oko3wl8v0.codesandbox.io/node_modules/dnd-core/lib/DragDropManager.js:92:19
handleTopDragOver
https://2oko3wl8v0.codesandbox.io/node_modules/react-dnd-html5-backend/lib/HTML5Backend.js:563:4
```

Expectation:
Its fine with me if I cannot drag under a node which has lazy loader function as children. As we can control the drop operation by passing **canDrop** as prop, I tried to see the output when the issue occurs. But it seems the error gets thrown before **canDrop** is called.

But is there any way to stop the dragging under that specific node?

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.