[DataGrid] Fix scroll jump when holding down arrow keys (#15164)

mui · Oct 29, 2024 · 48ec9c9 · 48ec9c9
1 parent 4134497
commit 48ec9c9
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 25 deletions.
diff --git a/packages/x-data-grid/src/components/virtualization/GridVirtualScrollbar.tsx b/packages/x-data-grid/src/components/virtualization/GridVirtualScrollbar.tsx
@@ -100,6 +100,8 @@ const GridVirtualScrollbar = React.forwardRef<HTMLDivElement, GridVirtualScrollb
         return;
       }
 
+      lastPosition.current = scroller[propertyScroll];
+
       if (isLocked.current) {
         isLocked.current = false;
         return;
@@ -108,8 +110,6 @@ const GridVirtualScrollbar = React.forwardRef<HTMLDivElement, GridVirtualScrollb
 
       const value = scroller[propertyScroll] / contentSize;
       scrollbar[propertyScroll] = value * scrollbarInnerSize;
-
-      lastPosition.current = scroller[propertyScroll];
     });
 
     const onScrollbarScroll = useEventCallback(() => {

diff --git a/packages/x-data-grid/src/hooks/features/scroll/useGridScroll.ts b/packages/x-data-grid/src/hooks/features/scroll/useGridScroll.ts
@@ -60,8 +60,6 @@ export const useGridScroll = (
   const logger = useGridLogger(apiRef, 'useGridScroll');
   const colRef = apiRef.current.columnHeadersContainerRef;
   const virtualScrollerRef = apiRef.current.virtualScrollerRef!;
-  const virtualScrollbarHorizontalRef = apiRef.current.virtualScrollbarHorizontalRef!;
-  const virtualScrollbarVerticalRef = apiRef.current.virtualScrollbarVerticalRef!;
   const visibleSortedRows = useGridSelector(apiRef, gridExpandedSortedRowEntriesSelector);
 
   const scrollToIndexes = React.useCallback<GridScrollApi['scrollToIndexes']>(
@@ -156,37 +154,19 @@ export const useGridScroll = (
 
   const scroll = React.useCallback<GridScrollApi['scroll']>(
     (params: Partial<GridScrollParams>) => {
-      if (
-        virtualScrollerRef.current &&
-        virtualScrollbarHorizontalRef.current &&
-        params.left !== undefined &&
-        colRef.current
-      ) {
+      if (virtualScrollerRef.current && params.left !== undefined && colRef.current) {
         const direction = isRtl ? -1 : 1;
         colRef.current.scrollLeft = params.left;
         virtualScrollerRef.current.scrollLeft = direction * params.left;
-        virtualScrollbarHorizontalRef.current.scrollLeft = direction * params.left;
         logger.debug(`Scrolling left: ${params.left}`);
       }
-      if (
-        virtualScrollerRef.current &&
-        virtualScrollbarVerticalRef.current &&
-        params.top !== undefined
-      ) {
+      if (virtualScrollerRef.current && params.top !== undefined) {
         virtualScrollerRef.current.scrollTop = params.top;
-        virtualScrollbarVerticalRef.current.scrollTop = params.top;
         logger.debug(`Scrolling top: ${params.top}`);
       }
       logger.debug(`Scrolling, updating container, and viewport`);
     },
-    [
-      virtualScrollerRef,
-      virtualScrollbarHorizontalRef,
-      virtualScrollbarVerticalRef,
-      isRtl,
-      colRef,
-      logger,
-    ],
+    [virtualScrollerRef, isRtl, colRef, logger],
   );
 
   const getScrollPosition = React.useCallback<GridScrollApi['getScrollPosition']>(() => {