[DataGrid] Rename rowsScroll event to scrollPositionChange (#6957)

mui · Nov 24, 2022 · a6c96b3 · a6c96b3
1 parent b673ec1
commit a6c96b3
Show file tree

Hide file tree

Showing 8 changed files with 19 additions and 19 deletions.
diff --git a/docs/data/data-grid/events/events.json b/docs/data/data-grid/events/events.json
@@ -359,13 +359,6 @@
     "params": "GridRowSelectionCheckboxParams",
     "event": "MuiEvent<React.ChangeEvent<HTMLElement>>"
   },
-  {
-    "projects": ["x-data-grid", "x-data-grid-pro", "x-data-grid-premium"],
-    "name": "rowsScroll",
-    "description": "Fired during the scroll of the grid viewport.",
-    "params": "GridScrollParams",
-    "event": "MuiEvent<React.UIEvent | MuiBaseEvent>"
-  },
   {
     "projects": ["x-data-grid-pro", "x-data-grid-premium"],
     "name": "rowsScrollEnd",
@@ -374,6 +367,13 @@
     "event": "MuiEvent<{}>",
     "componentProp": "onRowsScrollEnd"
   },
+  {
+    "projects": ["x-data-grid", "x-data-grid-pro", "x-data-grid-premium"],
+    "name": "scrollPositionChange",
+    "description": "Fired during the scroll of the grid viewport.",
+    "params": "GridScrollParams",
+    "event": "MuiEvent<React.UIEvent | MuiBaseEvent>"
+  },
   {
     "projects": ["x-data-grid", "x-data-grid-pro", "x-data-grid-premium"],
     "name": "sortModelChange",

diff --git a/docs/data/migration/migration-data-grid-v5/migration-data-grid-v5.md b/docs/data/migration/migration-data-grid-v5/migration-data-grid-v5.md
@@ -61,6 +61,7 @@ The minimum supported Node.js version has been changed from 12.0.0 to 14.0.0, si
 ### Events
 
 - The `selectionChange` event was renamed to `rowSelectionChange`.
+- The `rowsScroll` event was renamed to `scrollPositionChange`.
 - The `columnVisibilityChange` event was removed. Use `columnVisibilityModelChange` instead.
 - The `cellNavigationKeyDown` event was removed. Use `cellKeyDown` and check the key provided in the event argument.
 - The `columnHeaderNavigationKeyDown` event was removed. Use `columnHeaderKeyDown` and check the key provided in the event argument.

diff --git a/packages/grid/x-data-grid-pro/src/hooks/features/infiniteLoader/useGridInfiniteLoader.ts b/packages/grid/x-data-grid-pro/src/hooks/features/infiniteLoader/useGridInfiniteLoader.ts
@@ -71,13 +71,13 @@ export const useGridInfiniteLoader = (
     ],
   );
 
-  const handleGridScroll = React.useCallback<GridEventListener<'rowsScroll'>>(
+  const handleGridScroll = React.useCallback<GridEventListener<'scrollPositionChange'>>(
     ({ left, top }) => {
       handleRowsScrollEnd({ left, top });
     },
     [handleRowsScrollEnd],
   );
 
-  useGridApiEventHandler(apiRef, 'rowsScroll', handleGridScroll);
+  useGridApiEventHandler(apiRef, 'scrollPositionChange', handleGridScroll);
   useGridApiOptionHandler(apiRef, 'rowsScrollEnd', props.onRowsScrollEnd);
 };
diff --git a/packages/grid/x-data-grid-pro/src/tests/events.DataGridPro.test.tsx b/packages/grid/x-data-grid-pro/src/tests/events.DataGridPro.test.tsx
@@ -333,7 +333,7 @@ describe('<DataGridPro /> - Events Params', () => {
   it('publishing GRID_ROWS_SCROLL should call onRowsScrollEnd callback', () => {
     const handleRowsScrollEnd = spy();
     render(<TestEvents onRowsScrollEnd={handleRowsScrollEnd} />);
-    act(() => apiRef.current.publishEvent('rowsScroll', { left: 0, top: 3 * 52 }));
+    act(() => apiRef.current.publishEvent('scrollPositionChange', { left: 0, top: 3 * 52 }));
     expect(handleRowsScrollEnd.callCount).to.equal(1);
   });
 
@@ -351,7 +351,7 @@ describe('<DataGridPro /> - Events Params', () => {
         rowCount={50}
       />,
     );
-    act(() => apiRef.current.publishEvent('rowsScroll', { left: 0, top: 3 * 52 }));
+    act(() => apiRef.current.publishEvent('scrollPositionChange', { left: 0, top: 3 * 52 }));
     expect(handleFetchRows.callCount).to.equal(1);
   });
 

diff --git a/packages/grid/x-data-grid/src/components/GridScrollArea.tsx b/packages/grid/x-data-grid/src/components/GridScrollArea.tsx
@@ -72,7 +72,7 @@ function GridScrollAreaRaw(props: ScrollAreaProps) {
   const ownerState = { ...props, classes: rootProps.classes };
   const classes = useUtilityClasses(ownerState);
 
-  const handleScrolling = React.useCallback<GridEventListener<'rowsScroll'>>(
+  const handleScrolling = React.useCallback<GridEventListener<'scrollPositionChange'>>(
     (newScrollPosition) => {
       scrollPosition.current = newScrollPosition;
     },
@@ -115,7 +115,7 @@ function GridScrollAreaRaw(props: ScrollAreaProps) {
     setDragging((prevDragging) => !prevDragging);
   }, []);
 
-  useGridApiEventHandler(apiRef, 'rowsScroll', handleScrolling);
+  useGridApiEventHandler(apiRef, 'scrollPositionChange', handleScrolling);
   useGridApiEventHandler(apiRef, 'columnHeaderDragStart', toggleDragging);
   useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', toggleDragging);
 

diff --git a/packages/grid/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx b/packages/grid/x-data-grid/src/hooks/features/columnHeaders/useGridColumnHeaders.tsx
@@ -164,7 +164,7 @@ export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
     }
   }, [renderContext, updateInnerPosition]);
 
-  const handleScroll = React.useCallback<GridEventListener<'rowsScroll'>>(
+  const handleScroll = React.useCallback<GridEventListener<'scrollPositionChange'>>(
     ({ left, renderContext: nextRenderContext = null }, event) => {
       if (!innerRef.current) {
         return;
@@ -235,7 +235,7 @@ export const useGridColumnHeaders = (props: UseGridColumnHeadersProps) => {
   useGridApiEventHandler(apiRef, 'columnHeaderDragStart', handleColumnReorderStart);
   useGridApiEventHandler(apiRef, 'columnHeaderDragEnd', handleColumnReorderStop);
 
-  useGridApiEventHandler(apiRef, 'rowsScroll', handleScroll);
+  useGridApiEventHandler(apiRef, 'scrollPositionChange', handleScroll);
 
   // Helper for computation common between getColumnHeaders and getColumnGroupHeaders
   const getColumnsToRender = (params?: GetHeadersParams) => {

diff --git a/packages/grid/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx b/packages/grid/x-data-grid/src/hooks/features/virtualization/useGridVirtualScroller.tsx
@@ -308,7 +308,7 @@ export const useGridVirtualScroller = (props: UseGridVirtualScrollerProps) => {
 
     const { top, left } = scrollPosition.current!;
     const params = { top, left, renderContext: initialRenderContext };
-    apiRef.current.publishEvent('rowsScroll', params);
+    apiRef.current.publishEvent('scrollPositionChange', params);
   }, [apiRef, computeRenderContext, containerWidth, updateRenderContext]);
 
   const handleScroll = (event: React.UIEvent) => {
@@ -347,9 +347,8 @@ export const useGridVirtualScroller = (props: UseGridVirtualScrollerProps) => {
       bottomColumnsScrolledSincePreviousRender >= rootProps.columnThreshold ||
       prevTotalWidth.current !== columnsTotalWidth;
 
-    // TODO v6: rename event to a wider name, it's not only fired for row scrolling
     apiRef.current.publishEvent(
-      'rowsScroll',
+      'scrollPositionChange',
       {
         top: scrollTop,
         left: scrollLeft,

diff --git a/packages/grid/x-data-grid/src/models/events/gridEventLookup.ts b/packages/grid/x-data-grid/src/models/events/gridEventLookup.ts
@@ -464,7 +464,7 @@ export interface GridEventLookup
   /**
    * Fired during the scroll of the grid viewport.
    */
-  rowsScroll: { params: GridScrollParams; event: React.UIEvent | MuiBaseEvent };
+  scrollPositionChange: { params: GridScrollParams; event: React.UIEvent | MuiBaseEvent };
   /**
    * Fired when the content size used by the `GridVirtualScroller` changes.
    * @ignore - do not document.