react-dnd
Material UI Data Grid - Uncaught Invariant Violation: Cannot call hover while not dragging.
Describe the bug Dragging and reordering a column header in Material UI's Data Grid component throws error in react-dnd. This only seems to occur when useDrop hook is being used.
Reproduction
Steps to reproduce the behavior:
- Go to 'codesandbox'
- Click on a column header in the MUI table and drag to reorder
- See error
Expected behavior Material UI Data Grid columns should be able to be dragged, dropped, and reordered without error.
Screenshots
Desktop (please complete the following information):
- OS: MacOS Monterey 12.5.1
- Browser: Chrome Version
- Version: 104.0.5112.79 (Official Build) (x86_64)
Additional context Add any other context about the problem here.
Got same issue, solved by adding canDrag, collect: (monitor) => ({ opacity: monitor.isDragging() ? 0 : 1, isDragging: !!monitor.getItem() })
to useDrag hook. credit: https://dev.to/danielbellmas/dragging-over-an-element-without-triggers-hover-state-1ggh
The OP's question is about MaterialUI's DataGrid component. Have you found a solution when using that?
The OP's question is about MaterialUI's DataGrid component. Have you found a solution when using that?
Was trying to use it along with debouce from lodash, remove it or any delay functions and it will work without throwing the error, z's
edit: else you will need to make your own implementation to handle it
