Reset the page to 0 when sorting/filtering is applied

mui · Feb 13, 2025 · 6d0252c · 6d0252c
1 parent 510a56e
commit 6d0252c
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 71 deletions.
diff --git a/...es/x-data-grid-pro/src/hooks/features/serverSideLazyLoader/useGridDataSourceLazyLoader.ts b/...es/x-data-grid-pro/src/hooks/features/serverSideLazyLoader/useGridDataSourceLazyLoader.ts
@@ -201,44 +201,6 @@ export const useGridDataSourceLazyLoader = (
     );
   }, [privateApiRef]);
 
-  const rebuildSkeletonRows = React.useCallback(() => {
-    // replace all data rows with skeleton rows.
-    const tree = privateApiRef.current.state.rows.tree;
-    const rootGroup = tree[GRID_ROOT_GROUP_ID] as GridGroupNode;
-    const rootGroupChildren = [...rootGroup.children];
-
-    for (let i = 0; i < rootGroupChildren.length; i += 1) {
-      if (tree[rootGroupChildren[i]]?.type === 'skeletonRow') {
-        continue;
-      }
-
-      const skeletonId = getSkeletonRowId(i);
-      rootGroupChildren[i] = skeletonId;
-
-      const skeletonRowNode: GridSkeletonRowNode = {
-        type: 'skeletonRow',
-        id: skeletonId,
-        parent: GRID_ROOT_GROUP_ID,
-        depth: 0,
-      };
-
-      tree[rootGroupChildren[i]] = skeletonRowNode;
-    }
-
-    tree[GRID_ROOT_GROUP_ID] = { ...rootGroup, children: rootGroupChildren };
-
-    privateApiRef.current.setState(
-      (state) => ({
-        ...state,
-        rows: {
-          ...state.rows,
-          tree,
-        },
-      }),
-      'addSkeletonRows',
-    );
-  }, [privateApiRef]);
-
   const updateLoadingTrigger = React.useCallback(
     (rowCount: number) => {
       const newLoadingTrigger =
@@ -273,12 +235,6 @@ export const useGridDataSourceLazyLoader = (
         // the rows can safely be replaced. skeleton rows will be added later
         privateApiRef.current.setRows(response.rows);
       } else {
-        // having stale rows while not having a request for the first page means that the scroll position should be maintained
-        // convert all existing data to skeleton rows to avoid duplicate keys
-        if (rowsStale.current) {
-          rebuildSkeletonRows();
-        }
-
         const filteredSortedRowIds = gridFilteredSortedRowIdsSelector(privateApiRef);
 
         const startingIndex =
@@ -304,7 +260,7 @@ export const useGridDataSourceLazyLoader = (
       );
       privateApiRef.current.requestPipeProcessorsApplication('hydrateRows');
     },
-    [privateApiRef, updateLoadingTrigger, rebuildSkeletonRows, addSkeletonRows],
+    [privateApiRef, updateLoadingTrigger, addSkeletonRows],
   );
 
   const handleRowCountChange = React.useCallback(() => {
@@ -420,31 +376,20 @@ export const useGridDataSourceLazyLoader = (
       rowsStale.current = true;
       throttledHandleRenderedRowsIntervalChange.clear();
       previousLastRowIndex.current = 0;
-      const renderContext = gridRenderContextSelector(privateApiRef);
       const paginationModel = gridPaginationModelSelector(privateApiRef);
-      const rangeParams =
-        loadingTrigger.current === LoadingTrigger.VIEWPORT
-          ? {
-              start: renderContext.firstRowIndex,
-              end: renderContext.lastRowIndex,
-            }
-          : {
-              start: 0,
-              end: paginationModel.pageSize - 1,
-            };
-
       const filterModel = gridFilterModelSelector(privateApiRef);
 
       const getRowsParams: GridGetRowsParams = {
-        ...rangeParams,
+        start: 0,
+        end: paginationModel.pageSize - 1,
         sortModel: newSortModel,
         filterModel,
       };
 
       privateApiRef.current.setLoading(true);
-      debouncedFetchRows(adjustRowParams(getRowsParams));
+      debouncedFetchRows(getRowsParams);
     },
-    [privateApiRef, adjustRowParams, debouncedFetchRows, throttledHandleRenderedRowsIntervalChange],
+    [privateApiRef, debouncedFetchRows, throttledHandleRenderedRowsIntervalChange],
   );
 
   const handleGridFilterModelChange = React.useCallback<GridEventListener<'filterModelChange'>>(

diff --git a/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationModel.ts b/packages/x-data-grid/src/hooks/features/pagination/useGridPaginationModel.ts
@@ -17,7 +17,7 @@ import {
   useGridApiMethod,
   useGridApiEventHandler,
 } from '../../utils';
-import { isDeepEqual, runIf } from '../../../utils/utils';
+import { isDeepEqual } from '../../../utils/utils';
 import { GridPipeProcessor, useGridRegisterPipeProcessor } from '../../core/pipeProcessing';
 import { gridPageCountSelector, gridPaginationModelSelector } from './gridPaginationSelector';
 import {
@@ -299,16 +299,8 @@ export const useGridPaginationModel = (
   useGridApiEventHandler(apiRef, 'viewportInnerSizeChange', handleUpdateAutoPageSize);
   useGridApiEventHandler(apiRef, 'paginationModelChange', handlePaginationModelChange);
   useGridApiEventHandler(apiRef, 'rowCountChange', handleRowCountChange);
-  useGridApiEventHandler(
-    apiRef,
-    'sortModelChange',
-    runIf(props.resetPageOnSortFilter, handleSortModelChange),
-  );
-  useGridApiEventHandler(
-    apiRef,
-    'filterModelChange',
-    runIf(props.resetPageOnSortFilter, handleFilterModelChange),
-  );
+  useGridApiEventHandler(apiRef, 'sortModelChange', handleSortModelChange);
+  useGridApiEventHandler(apiRef, 'filterModelChange', handleFilterModelChange);
 
   /**
    * EFFECTS