Dynamically disable the row dragging when satisfying component state / or remove tooltip in move handler

[sunxivincent]

I need to disable the row dragging dynamically only when an internal state flag === 'some value' (defines in the component level). This state can change when a user toggles a button outside of the table.

I was trying the following ways:

1. define property enableRowOrdering= {flag !== 'some value'} , however when flag state changes, the move handler is not hiding / showing up as expected -- I guess the enableRowOrdering cannot be changed dynamically after table is created.

2. Then I tried to modify muiTableBodyRowDragHandleProps,
   muiTableBodyRowDragHandleProps={({ table }) => ({ disabled: flag === 'some value' })}, it can meet my need as I can prevent user from dragging even the "move" column displays in the table. But there is an error message showing in the console asking me to wrap a span to the tooltip. MUI: You are providing a disabled button child to the Tooltip component. A disabled element does not fire events.. I guess the table handle was wrapped with a tooltip with content 'move', and it conflicts the case when I was trying to disable the drag handle.

Then I was trying to search the doc to see if I can completely remove the tooltip. I found a similar question here: #215 and also looked at 'displayColumnDefOptions', but I cannot find an example on how to remove the tooltip by modifying mrt-row-drag

How can I solve this by either 1) allowing dynamically disable the row dragging, or 2) allowing me to remove the tooltip in the move handler. Any help or a code pointer will be appreciated.

[itshallrun]

@sunxivincent Have you found a solution to this? I also would like to hide the drag handle conditionally per row. But can't find how to do that.