Code editor crashes due to multiple context providers from react-dnd in react-mosaic: "Cannot have two MultiBackends at the same time"

I have no idea how to reproduce this, but I do see this is a dependency. Hopefully @balintbrews can tie the code to the exception and determine steps to reproduce?

This is the one error that's been hunting me, because I don't know what causes it and how to reproduce. I've seen it occasionally, but I never had time to dig into it. All I know is that it comes from react-mosaic. Any ideas, @hooroomoo?

I don't have the exact steps to reproduce, but I may have an understanding of why this error occurs.

react-mosaic uses react-dnd for its drag & drop functionality. The Mosaic component wraps its logic in the DndProvider from react-dnd. I believe the problem we're seeing is that when we switch between routes, that context provider sometimes can't fully unmount itself before the new provider starts mounting itself on the new route. The solution is to decouple DndProvider from where we use the Mosaic component. Luckily, react-mosaic exports MosaicWithoutDragDropContext for us to do that.

So I'm adding react-dnd, rdndmb-html5-to-touch, and react-dnd-multi-backend as explicit dependencies — they were already indirectly added by react-mosaic — and wrapping everything in the context provider in App.tsx, so we can replace our use of the Mosaic component with MosaicWithoutDragDropContext. The provider then remains stable while switching between routes.

I developed this assumption based on https://github.com/nomcopter/react-mosaic/issues/162.

This is all just theory, as I don't have a way to reproduce the error. Let's thoroughly test that the new context provider doesn't cause issues with our other drag & drop library, dnd kit, which also wraps most of the component tree in a context provider. Yes, ideally we would only use one, but this was so far an implementation detail of react-mosaic, and we already heavily based our content preview canvas interactions heavily on dnd kit.

For future consideration, I opened #3520994: Move away from react-mosaic for the code editor UI.

I pulled this down and tried to reproduce the error by switching the routes consecutively but couldn't.

@balintbrews theory is very solid and the code is well commented so I think it makes sense to get this in and see if it solves the issue on 0.x since there are no exact steps to reproduce it.