How do I make an ag-grid-react Grid scroll during drag&drop?

Question

I have a ag-grid-react Grid displayed. I want to use drag&drop with it. My problem is, that I have more rows than could be displayed on one screen. So I need to scroll the Grid up or down when the drag goes over the respective borders.

I can detect when I need to scroll in the onRowDragMove handler, but how do I make the Grid actually scroll? (NB: I have the Grid on a material-ui Dialog.)

Both methods used in this sample do not work.

const handleRowDragMove = (params) => {
        console.log("handleDragMove", params);
        const {event, api: gridApi, overIndex} = params;
        const clientY = event.clientY;
        const gridElement = divRef.current;
        const gridRect = gridElement.getBoundingClientRect();
        const relativeY = clientY - gridRect.top;
        const threshold = 50;

        if (relativeY < threshold) {
            window.scrollBy(0, -10);
            } else if (relativeY > gridRect.height - threshold) {
            console.log("scroll down");
             const lastRowIndex = gridApi.getLastDisplayedRow();

            // Ensure the last row is visible
            gridApi.ensureIndexVisible(overIndex+2);
            }
        }

The Grid is created with:

    const myGridOptions = {
        rowHeight: rowHeight,
        defaultColDef: {
            enableCellChangeFlash: true
            },
        columnTypes: {
            number: {
                headerClass: "ag-right-aligned-header",
                cellClass: "ag-right-aligned-cell"
                },
            string: {}
            },
        ...gridOptions
        };

    const autoSizeStrategy = {
        type: 'fitCellContent',
        defaultMinWidth: minWidth,
        };

    useEffect(() => {
        const handleResize = () => {
            grid.current?.api.sizeColumnsToFit();
            }

        window.addEventListener('resize', handleResize);

        return () => {
            window.removeEventListener('resize', handleResize);
            }
        }, []);

return <>
        <div ref={divRef} className={theme.palette.gridTheme} style={style}>
            <AgGridReact key={gridId}
                         ref={grid}
                         domLayout={domLayout}
                         gridOptions={myGridOptions}
                         columnDefs={columnDefs}
                         rowData={rowData}
                         autoSizeStrategy={autoSizeStrategy}
                         onRowClicked={handleRowClicked}
                         onRowSelected={handleRowSelected}
                         onStateUpdated={handleStateUpdated}
                         onGridPreDestroyed={handleGridPreDestroyed}
                         onRowDragMove={handleRowDragMove}
                         animateRows
                         getLocaleText={handleGetLocaleText}
                         autoHeaderHeight
                         alwaysShowScrollbars
                         headerHeight={rowHeight}
                         groupHeaderHeight={rowHeight}
                         {...rest}/>

        </div>;