React-sortable-tree: Cannot have two HTML5 backends at the same time.

[gmarathi-nisum-com]

Hi,

We are using react-sortable tree component where i do not need drag/drop functionlity.At the same time, we are using react-trello component which is having kanban board with drag and drop functionlity.
These two components are being used in same page.
So, we are getting Cannot have two HTML5 backends at the same time. error.

We have made canDrag={false} canDrop={false}. But Still we are facing the same issue.

Can you Please help me to remove draggablecontext from sortable tree.

[fritz-c]

From the Troubleshooting section of the readme:

react-dnd only allows for one DragDropContext at a time (see: https://github.com/gaearon/react-dnd/issues/186). To get around this, you can import the context-less tree component via SortableTreeWithoutDndContext.

// before
import SortableTree from 'react-sortable-tree';

// after
import { SortableTreeWithoutDndContext as SortableTree } from 'react-sortable-tree';

[sakhamuri92]

I am also having same above issue.I used the above approach u mentioned but the same issue i am facing is there way to remove that dragging functionality from that tree.

import { SortableTreeWithoutDndContext as SortableTree } from 'react-sortable-tree';

[sakhamuri92]

// before
import SortableTree from 'react-sortable-tree';

// after
import { SortableTreeWithoutDndContext as SortableTree } from 'react-sortable-tree';

among these two i am using the second statement only for tree and if iam providing Sortable tree like below i am getting other issues also

Eg:

Or we need to use like this.

[top1st]

import { SortableTreeWithoutDndContext as SortableTree, changeNodeAtPath } from 'react-sortable-tree';

[uptonking]

find a solution, just put DragDropContext at the top level, like wrap the parent component
see discussion here

[tejaswaroop51]

its not working at all @uptonking @sakhamuri92 @fritz-c . Tried different combinations and solutions still I am receiving same error. Really getting pissed off with this component. Thanks for making our lives hell

[shalinigr]

@top1st Were you able to resolve this issue? I'm getting the same error when I use the SortableTreeWithoutDndContext.

[wuweiweiwu]

@tejaswaroop51 Getting mad at the component and/or maintainers won't help. You have to realize that @fritz-c and I maintain this component in our free time. If you have an urgent issue, we try our best. If you are unhappy feel free to contribute/investigate/open a PR.

@shalinigr @top1st @uptonking @sakhamuri92 If you guys can post a minimal reproduction that would be most helpful. Otherwise, I will investigate when I next have time.

Also just for reference. the basic example provided on the demo site uses the tree without dnd context

[dnizetic]

It happens after a hot reload. I.e. change code, page hot reloads, then try dragging a node.

[csenn]

react-create-app [4.0.3] hot reloading seems to be causing the issue for me. For anyone else with the same issue, adding the FAST_REFRESH=false env variable seems to have solved it. https://create-react-app.dev/docs/advanced-configuration/