Fix issue #254, focus cell fully visible (#256)

mui · Sep 10, 2020 · cde8cee · cde8cee
1 parent ebb3c3e
commit cde8cee
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/packages/grid/x-grid-modules/src/hooks/virtualization/useVirtualColumns.ts b/packages/grid/x-grid-modules/src/hooks/virtualization/useVirtualColumns.ts
@@ -65,7 +65,7 @@ export const useVirtualColumns = (
       const lastCol = getColumnFromScroll(lastScrollLeftRef.current + windowWidth);
 
       const visibleColumns = apiRef.current.getVisibleColumns();
-      const firstColIndex = visibleColumns.findIndex((col) => col.field === firstCol?.field);
+      const firstColIndex = visibleColumns.findIndex((col) => col.field === firstCol?.field) + 1;
       const lastColIndex = visibleColumns.findIndex((col) => col.field === lastCol?.field) - 1; // We ensure the last col is completely visible
 
       return colIndex >= firstColIndex && colIndex <= lastColIndex;

diff --git a/packages/grid/x-grid-modules/src/hooks/virtualization/useVirtualRows.ts b/packages/grid/x-grid-modules/src/hooks/virtualization/useVirtualRows.ts
@@ -241,10 +241,15 @@ export const useVirtualRows = (
             containerPropsRef.current!.windowSizes.width;
         } else {
           scrollLeft =
-            meta.positions[params.colIndex + 1] - containerPropsRef.current!.windowSizes.width;
+            meta.positions[params.colIndex + 1] -
+            containerPropsRef.current!.windowSizes.width +
+            (containerPropsRef.current!.hasScrollY ? containerPropsRef.current!.scrollBarSize : 0);
+          logger.debug(`Scrolling to the right, scrollLeft: ${scrollLeft}`);
+        }
+        if (rzScrollRef.current.left > scrollLeft) {
+          scrollLeft = meta.positions[params.colIndex];
+          logger.debug(`Scrolling to the left, scrollLeft: ${scrollLeft}`);
         }
-        scrollLeft =
-          rzScrollRef.current.left > scrollLeft ? meta.positions[params.colIndex] : scrollLeft;
       }
 
       let scrollTop;
@@ -276,13 +281,14 @@ export const useVirtualRows = (
 
   const scroll = React.useCallback(
     (params: Partial<ScrollParams>) => {
-      logger.debug(`Scrolling to left: ${params.left} top: ${params.top}`);
       if (windowRef.current && params.left != null && colRef.current) {
         colRef.current.scrollLeft = params.left;
         windowRef.current.scrollLeft = params.left;
+        logger.debug(`Scrolling left: ${params.left}`);
       }
       if (windowRef.current && params.top != null) {
         windowRef.current.scrollTop = params.top;
+        logger.debug(`Scrolling top: ${params.top}`);
       }
       updateViewport();
     },