djkato/saleor-dashboard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix pagination state after refresh (#1496) (#1515)

Browse source 
* fix pagination state after refresh

* remove unused imports

* remove unused imports

* add newline

* add generic types to hook parameters
This commit is contained in:
Michał Droń 2021-10-25 17:29:27 +02:00 committed by GitHub
parent 2eec208144
commit a466676858
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
18 changed files with 48 additions and 142 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
src/categories/views/CategoryList/CategoryList.tsx
View file

@ -5,7 +5,6 @@ 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";
@ -59,13 +58,7 @@ export const CategoryList: React.FC<CategoryListProps> = ({ params }) => {
ListViews.CATEGORY_LIST
);
usePaginationReset(
categoryListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(categoryListUrl, params, settings.rowNumber);
const intl = useIntl();

9
src/collections/views/CollectionList/CollectionList.tsx
View file

@ -6,7 +6,6 @@ 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";
@ -65,13 +64,7 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
ListViews.COLLECTION_LIST
);
usePaginationReset(
collectionListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(collectionListUrl, params, settings.rowNumber);
const [
changeFilters,

9
src/customers/views/CustomerList/CustomerList.tsx
View file

@ -5,7 +5,6 @@ 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";
@ -63,13 +62,7 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
ListViews.CUSTOMER_LIST
);
usePaginationReset(
customerListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(customerListUrl, params, settings.rowNumber);
const intl = useIntl();

9
src/discounts/views/SaleList/SaleList.tsx
View file

@ -7,7 +7,6 @@ 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";
@ -65,13 +64,7 @@ export const SaleList: React.FC<SaleListProps> = ({ params }) => {
ListViews.SALES_LIST
);
usePaginationReset(
saleListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(saleListUrl, params, settings.rowNumber);
const intl = useIntl();
const { availableChannels } = useAppChannel(false);

9
src/discounts/views/VoucherList/VoucherList.tsx
View file

@ -7,7 +7,6 @@ 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";
@ -65,13 +64,7 @@ export const VoucherList: React.FC<VoucherListProps> = ({ params }) => {
ListViews.VOUCHER_LIST
);
usePaginationReset(
voucherListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(voucherListUrl, params, settings.rowNumber);
const intl = useIntl();

33
src/hooks/usePaginationReset.ts
View file

@ -1,9 +1,36 @@
import { DEFAULT_INITIAL_PAGINATION_DATA } from "@saleor/config";
import { Pagination } from "@saleor/types";
import { useEffect } from "react";
import useNavigator from "./useNavigator";
export const usePaginationReset = (url: string, rowNumber: number) => {
export function usePaginationReset<T extends Pagination>(
urlFunc: (params: T) => string,
params: T,
rowNumber: number
) {
const navigate = useNavigator();
useEffect(() => navigate(url, { replace: true }), [rowNumber]);
};
useEffect(
() =>
navigate(
urlFunc({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
{ replace: true }
),
[rowNumber]
);
useEffect(
() =>
navigate(
urlFunc({
...params
}),
{ replace: true }
),
[params.before, params.after]
);
}

9
src/navigation/views/MenuList/MenuList.tsx
View file

@ -1,6 +1,5 @@
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";
@ -48,13 +47,7 @@ const MenuList: React.FC<MenuListProps> = ({ params }) => {
ListViews.NAVIGATION_LIST
);
usePaginationReset(
menuListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(menuListUrl, params, settings.rowNumber);
const intl = useIntl();

9
src/orders/views/OrderDraftList/OrderDraftList.tsx
View file

@ -8,7 +8,6 @@ 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";
@ -68,13 +67,7 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
ListViews.DRAFT_LIST
);
usePaginationReset(
orderDraftListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(orderDraftListUrl, params, settings.rowNumber);
const intl = useIntl();

9
src/orders/views/OrderList/OrderList.tsx
View file

@ -5,7 +5,6 @@ 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";
@ -58,13 +57,7 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
ListViews.ORDER_LIST
);
usePaginationReset(
orderListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(orderListUrl, params, settings.rowNumber);
const intl = useIntl();

9
src/pageTypes/views/PageTypeList/PageTypeList.tsx
View file

@ -5,7 +5,6 @@ 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";
@ -65,13 +64,7 @@ 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
);
usePaginationReset(pageTypeListUrl, params, settings.rowNumber);
const paginationState = createPaginationState(settings.rowNumber, params);
const queryVariables = React.useMemo(

9
src/pages/views/PageList/PageList.tsx
View file

@ -1,7 +1,6 @@
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";
@ -49,13 +48,7 @@ export const PageList: React.FC<PageListProps> = ({ params }) => {
ListViews.PAGES_LIST
);
usePaginationReset(
pageListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(pageListUrl, params, settings.rowNumber);
const intl = useIntl();

9
src/permissionGroups/views/PermissionGroupList/PermissionGroupList.tsx
View file

@ -1,4 +1,3 @@
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";
@ -46,13 +45,7 @@ export const PermissionGroupList: React.FC<PermissionGroupListProps> = ({
ListViews.STAFF_MEMBERS_LIST
);
usePaginationReset(
permissionGroupListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(permissionGroupListUrl, params, settings.rowNumber);
const paginationState = createPaginationState(settings.rowNumber, params);
const queryVariables = React.useMemo(

9
src/plugins/views/PluginList/PluginList.tsx
View file

@ -2,7 +2,6 @@ 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";
@ -51,13 +50,7 @@ export const PluginsList: React.FC<PluginsListProps> = ({ params }) => {
ListViews.PLUGINS_LIST
);
usePaginationReset(
pluginListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(pluginListUrl, params, settings.rowNumber);
const paginationState = createPaginationState(settings.rowNumber, params);
const queryVariables = React.useMemo(

9
src/productTypes/views/ProductTypeList/ProductTypeList.tsx
View file

@ -4,7 +4,6 @@ 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";
@ -69,13 +68,7 @@ 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
);
usePaginationReset(productTypeListUrl, params, settings.rowNumber);
const paginationState = createPaginationState(settings.rowNumber, params);
const queryVariables = React.useMemo(

8
src/products/views/ProductList/ProductList.tsx
View file

@ -96,13 +96,7 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
ListViews.PRODUCT_LIST
);
usePaginationReset(
productListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(productListUrl, params, settings.rowNumber);
const intl = useIntl();
const {

9
src/shipping/views/ShippingZonesList.tsx
View file

@ -1,7 +1,6 @@
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";
@ -56,13 +55,7 @@ export const ShippingZonesList: React.FC<ShippingZonesListProps> = ({
ListViews.SHIPPING_METHODS_LIST
);
usePaginationReset(
shippingZonesListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(shippingZonesListUrl, params, settings.rowNumber);
const intl = useIntl();

14
src/staff/views/StaffList/StaffList.tsx
View file

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

9
src/warehouses/views/WarehouseList/WarehouseList.tsx
View file

@ -4,7 +4,6 @@ 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";
@ -59,13 +58,7 @@ const WarehouseList: React.FC<WarehouseListProps> = ({ params }) => {
);
const intl = useIntl();
usePaginationReset(
warehouseListUrl({
...params,
...DEFAULT_INITIAL_PAGINATION_DATA
}),
settings.rowNumber
);
usePaginationReset(warehouseListUrl, params, settings.rowNumber);
const paginationState = createPaginationState(settings.rowNumber, params);
const queryVariables = React.useMemo(