Add missing rowNumber dependency to update queryVariables (#1256)

* fix: add rowNumber like dependency to update queryVariables

* Add resetPagination hook and refactor

Co-authored-by: Jakub Majorek <majorek.jakub@gmail.com>
Co-authored-by: Magdalena Markusik <magdalena.markusik@mirumee.com>

src/categories/views/CategoryList/CategoryList.tsx

@@ -5,9 +5,11 @@ import DeleteFilterTabDialog from "@saleor/components/DeleteFilterTabDialog";
 import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -49,12 +51,22 @@ interface CategoryListProps {
 export const CategoryList: React.FC<CategoryListProps> = ({ params }) => {
   const navigate = useNavigator();
   const paginate = usePaginator();
+
   const { isSelected, listElements, toggle, toggleAll, reset } = useBulkActions(
     params.ids
   );
   const { updateListSettings, settings } = useListSettings(
     ListViews.CATEGORY_LIST
   );
+
+  usePaginationReset(
+    categoryListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const paginationState = createPaginationState(settings.rowNumber, params);

src/collections/views/CollectionList/CollectionList.tsx

@@ -6,10 +6,12 @@ import DeleteFilterTabDialog from "@saleor/components/DeleteFilterTabDialog";
 import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -53,6 +55,7 @@ interface CollectionListProps {
 
 export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
   const navigate = useNavigator();
+  const intl = useIntl();
   const notify = useNotifier();
   const paginate = usePaginator();
   const { isSelected, listElements, reset, toggle, toggleAll } = useBulkActions(
@@ -61,7 +64,14 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.COLLECTION_LIST
   );
-  const intl = useIntl();
+
+  usePaginationReset(
+    collectionListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
 
   const [
     changeFilters,

src/customers/views/CustomerList/CustomerList.tsx

@@ -5,10 +5,12 @@ import DeleteFilterTabDialog from "@saleor/components/DeleteFilterTabDialog";
 import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -60,6 +62,15 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.CUSTOMER_LIST
   );
+
+  usePaginationReset(
+    customerListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const paginationState = createPaginationState(settings.rowNumber, params);

src/discounts/views/SaleList/SaleList.tsx

@@ -7,10 +7,12 @@ import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
 import { WindowTitle } from "@saleor/components/WindowTitle";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -62,6 +64,15 @@ export const SaleList: React.FC<SaleListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.SALES_LIST
   );
+
+  usePaginationReset(
+    saleListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
   const { availableChannels } = useAppChannel(false);
   const selectedChannel = availableChannels.find(

src/discounts/views/VoucherList/VoucherList.tsx

@@ -7,10 +7,12 @@ import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
 import { WindowTitle } from "@saleor/components/WindowTitle";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -62,6 +64,15 @@ export const VoucherList: React.FC<VoucherListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.VOUCHER_LIST
   );
+
+  usePaginationReset(
+    voucherListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const { availableChannels } = useAppChannel(false);

src/hooks/usePaginationReset.ts

@@ -0,0 +1,9 @@
+import { useEffect } from "react";
+
+import useNavigator from "./useNavigator";
+
+export const usePaginationReset = (url: string, rowNumber: number) => {
+  const navigate = useNavigator();
+
+  useEffect(() => navigate(url, true), [rowNumber]);
+};

src/navigation/views/MenuList/MenuList.tsx

@@ -1,10 +1,12 @@
 import { Button, DialogContentText } from "@material-ui/core";
 import ActionDialog from "@saleor/components/ActionDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import { configurationMenuUrl } from "@saleor/configuration";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -45,6 +47,15 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.NAVIGATION_LIST
   );
+
+  usePaginationReset(
+    menuListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const closeModal = () =>

src/orders/views/OrderDraftList/OrderDraftList.tsx

@@ -8,10 +8,12 @@ import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
 import { useShopLimitsQuery } from "@saleor/components/Shop/query";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -65,6 +67,15 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.DRAFT_LIST
   );
+
+  usePaginationReset(
+    orderDraftListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const handleCreateOrderCreateSuccess = (data: OrderDraftCreate) => {

src/orders/views/OrderList/OrderList.tsx

@@ -5,9 +5,11 @@ import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
 import { useShopLimitsQuery } from "@saleor/components/Shop/query";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -55,6 +57,15 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.ORDER_LIST
   );
+
+  usePaginationReset(
+    orderListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const handleCreateOrderCreateSuccess = (data: OrderDraftCreate) => {

src/pageTypes/views/PageTypeList/PageTypeList.tsx

@@ -5,10 +5,12 @@ import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
 import TypeDeleteWarningDialog from "@saleor/components/TypeDeleteWarningDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -63,6 +65,14 @@ export const PageTypeList: React.FC<PageTypeListProps> = ({ params }) => {
   const intl = useIntl();
   const { settings } = useListSettings(ListViews.PAGES_LIST);
 
+  usePaginationReset(
+    pageTypeListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const paginationState = createPaginationState(settings.rowNumber, params);
   const queryVariables = React.useMemo(
     () => ({
@@ -70,7 +80,7 @@ export const PageTypeList: React.FC<PageTypeListProps> = ({ params }) => {
       filter: getFilterVariables(params),
       sort: getSortQueryVariables(params)
     }),
-    [params]
+    [params, settings.rowNumber]
   );
   const { data, loading, refetch } = usePageTypeListQuery({
     displayLoader: true,

src/pages/views/PageList/PageList.tsx

@@ -1,11 +1,13 @@
 import { Button, DialogContentText, IconButton } from "@material-ui/core";
 import DeleteIcon from "@material-ui/icons/Delete";
 import ActionDialog from "@saleor/components/ActionDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import { configurationMenuUrl } from "@saleor/configuration";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -46,6 +48,15 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings(
     ListViews.PAGES_LIST
   );
+
+  usePaginationReset(
+    pageListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const paginationState = createPaginationState(settings.rowNumber, params);

src/permissionGroups/views/PermissionGroupList/PermissionGroupList.tsx

@@ -1,8 +1,10 @@
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import { configurationMenuUrl } from "@saleor/configuration";
 import { PermissionGroupErrorFragment } from "@saleor/fragments/types/PermissionGroupErrorFragment";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -44,13 +46,21 @@ export const PermissionGroupList: React.FC<PermissionGroupListProps> = ({
     ListViews.STAFF_MEMBERS_LIST
   );
 
+  usePaginationReset(
+    permissionGroupListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const paginationState = createPaginationState(settings.rowNumber, params);
   const queryVariables = React.useMemo(
     () => ({
       ...paginationState,
       sort: getSortQueryVariables(params)
     }),
-    [params]
+    [params, settings.rowNumber]
   );
   const { data, loading, refetch } = usePermissionGroupListQuery({
     displayLoader: true,
@@ -98,6 +108,7 @@ export const PermissionGroupList: React.FC<PermissionGroupListProps> = ({
   const [permissionGroupDelete] = usePermissionGroupDelete({
     onCompleted: handleDeleteSuccess
   });
+
   return (
     <>
       <PermissionGroupListPage

src/plugins/views/PluginList/PluginList.tsx

@@ -2,10 +2,12 @@ import DeleteFilterTabDialog from "@saleor/components/DeleteFilterTabDialog";
 import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import { configurationMenuUrl } from "@saleor/configuration";
 import { useChannelsSearchWithLoadMore } from "@saleor/hooks/useChannelsSearchWithLoadMore";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -49,6 +51,14 @@ export const PluginsList: React.FC<PluginsListProps> = ({ params }) => {
     ListViews.PLUGINS_LIST
   );
 
+  usePaginationReset(
+    pluginListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const paginationState = createPaginationState(settings.rowNumber, params);
   const queryVariables = React.useMemo(
     () => ({
@@ -56,7 +66,7 @@ export const PluginsList: React.FC<PluginsListProps> = ({ params }) => {
       filter: getFilterVariables(params),
       sort: getSortQueryVariables(params)
     }),
-    [params]
+    [params, settings.rowNumber]
   );
   const { data, loading } = usePluginsListQuery({
     displayLoader: true,

src/productTypes/views/ProductTypeList/ProductTypeList.tsx

@@ -4,10 +4,12 @@ import DeleteFilterTabDialog from "@saleor/components/DeleteFilterTabDialog";
 import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -67,6 +69,14 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
   const { settings } = useListSettings(ListViews.PRODUCT_LIST);
   const intl = useIntl();
 
+  usePaginationReset(
+    productTypeListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const paginationState = createPaginationState(settings.rowNumber, params);
   const queryVariables = React.useMemo(
     () => ({
@@ -74,7 +84,7 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
       filter: getFilterVariables(params),
       sort: getSortQueryVariables(params)
     }),
-    [params]
+    [params, settings.rowNumber]
   );
   const { data, loading, refetch } = useProductTypeListQuery({
     displayLoader: true,

src/products/views/ProductList/ProductList.tsx

@@ -19,6 +19,7 @@ import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -94,6 +95,15 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
   const { updateListSettings, settings } = useListSettings<ProductListColumns>(
     ListViews.PRODUCT_LIST
   );
+
+  usePaginationReset(
+    productListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
   const {
     data: initialFilterAttributes
@@ -177,19 +187,6 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
     ProductListUrlQueryParams
   >(navigate, productListUrl, params);
 
-  // Reset pagination
-  React.useEffect(
-    () =>
-      navigate(
-        productListUrl({
-          ...params,
-          ...DEFAULT_INITIAL_PAGINATION_DATA
-        }),
-        true
-      ),
-    [settings.rowNumber]
-  );
-
   const tabs = getFilterTabs();
 
   const currentTab = getFiltersCurrentTab(params, tabs);

src/shipping/views/ShippingZonesList.tsx

@@ -1,11 +1,13 @@
 import { DialogContentText, IconButton } from "@material-ui/core";
 import DeleteIcon from "@material-ui/icons/Delete";
 import ActionDialog from "@saleor/components/ActionDialog";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import { configurationMenuUrl } from "@saleor/configuration";
 import useBulkActions from "@saleor/hooks/useBulkActions";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -53,10 +55,26 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
   const { updateListSettings, settings } = useListSettings(
     ListViews.SHIPPING_METHODS_LIST
   );
+
+  usePaginationReset(
+    shippingZonesListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const intl = useIntl();
 
   const paginationState = createPaginationState(settings.rowNumber, params);
 
+  const queryVariables = React.useMemo(
+    () => ({
+      ...paginationState
+    }),
+    [params, settings.rowNumber]
+  );
+
   const [openModal, closeModal] = createDialogActionHandlers<
     ShippingZonesListUrlDialog,
     ShippingZonesListUrlQueryParams
@@ -64,7 +82,7 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
 
   const { data, loading, refetch } = useShippingZoneList({
     displayLoader: true,
-    variables: paginationState
+    variables: queryVariables
   });
 
   const [deleteShippingZone, deleteShippingZoneOpts] = useShippingZoneDelete({
@@ -116,6 +134,7 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
     paginationState,
     params
   );
+
   return (
     <>
       <ShippingZonesListPage

src/staff/views/StaffList/StaffList.tsx

@@ -4,11 +4,16 @@ import SaveFilterTabDialog, {
   SaveFilterTabDialogFormData
 } from "@saleor/components/SaveFilterTabDialog";
 import { useShopLimitsQuery } from "@saleor/components/Shop/query";
-import { APP_MOUNT_URI, DEFAULT_INITIAL_SEARCH_DATA } from "@saleor/config";
+import {
+  APP_MOUNT_URI,
+  DEFAULT_INITIAL_PAGINATION_DATA,
+  DEFAULT_INITIAL_SEARCH_DATA
+} from "@saleor/config";
 import { configurationMenuUrl } from "@saleor/configuration";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -62,6 +67,14 @@ export const StaffList: React.FC<StaffListProps> = ({ params }) => {
   );
   const intl = useIntl();
 
+  usePaginationReset(
+    staffListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const paginationState = createPaginationState(settings.rowNumber, params);
   const queryVariables = React.useMemo(
     () => ({

src/warehouses/views/WarehouseList/WarehouseList.tsx

@@ -4,10 +4,12 @@ import SaveFilterTabDialog, {
 } from "@saleor/components/SaveFilterTabDialog";
 import { useShopLimitsQuery } from "@saleor/components/Shop/query";
 import { WindowTitle } from "@saleor/components/WindowTitle";
+import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
 import { configurationMenuUrl } from "@saleor/configuration";
 import useListSettings from "@saleor/hooks/useListSettings";
 import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
+import { usePaginationReset } from "@saleor/hooks/usePaginationReset";
 import usePaginator, {
   createPaginationState
 } from "@saleor/hooks/usePaginator";
@@ -57,6 +59,14 @@ const WarehouseList: React.FC<WarehouseListProps> = ({ params }) => {
   );
   const intl = useIntl();
 
+  usePaginationReset(
+    warehouseListUrl({
+      ...params,
+      ...DEFAULT_INITIAL_PAGINATION_DATA
+    }),
+    settings.rowNumber
+  );
+
   const paginationState = createPaginationState(settings.rowNumber, params);
   const queryVariables = React.useMemo(
     () => ({