Use generic handlers

This commit is contained in:
dominik-zeglen 2020-01-09 14:45:22 +01:00
parent a7304dabb0
commit be649e32ea
10 changed files with 120 additions and 301 deletions

View file

@ -23,9 +23,8 @@ import { ListViews } from "@saleor/types";
import { getSortParams } from "@saleor/utils/sort"; import { getSortParams } from "@saleor/utils/sort";
import createSortHandler from "@saleor/utils/handlers/sortHandler"; import createSortHandler from "@saleor/utils/handlers/sortHandler";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { IFilter } from "@saleor/components/Filter";
import { getFilterQueryParams } from "@saleor/utils/filters";
import useShop from "@saleor/hooks/useShop"; import useShop from "@saleor/hooks/useShop";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import CollectionListPage from "../../components/CollectionListPage/CollectionListPage"; import CollectionListPage from "../../components/CollectionListPage/CollectionListPage";
import { import {
TypedCollectionBulkDelete, TypedCollectionBulkDelete,
@ -48,7 +47,6 @@ import {
getFilterTabs, getFilterTabs,
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
CollectionFilterKeys,
getFilterQueryParam, getFilterQueryParam,
getFilterOpts getFilterOpts
} from "./filter"; } from "./filter";
@ -94,37 +92,17 @@ export const CollectionList: React.FC<CollectionListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<CollectionFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
collectionListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: collectionListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
collectionListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
collectionListUrl({
...params,
activeTab: undefined,
query
})
);
};
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
CollectionListUrlDialog, CollectionListUrlDialog,

View file

@ -22,9 +22,8 @@ import { ListViews } from "@saleor/types";
import { getSortParams } from "@saleor/utils/sort"; import { getSortParams } from "@saleor/utils/sort";
import createSortHandler from "@saleor/utils/handlers/sortHandler"; import createSortHandler from "@saleor/utils/handlers/sortHandler";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { IFilter } from "@saleor/components/Filter";
import { getFilterQueryParams } from "@saleor/utils/filters";
import useShop from "@saleor/hooks/useShop"; import useShop from "@saleor/hooks/useShop";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import CustomerListPage from "../../components/CustomerListPage"; import CustomerListPage from "../../components/CustomerListPage";
import { TypedBulkRemoveCustomers } from "../../mutations"; import { TypedBulkRemoveCustomers } from "../../mutations";
import { useCustomerListQuery } from "../../queries"; import { useCustomerListQuery } from "../../queries";
@ -43,7 +42,6 @@ import {
getFilterTabs, getFilterTabs,
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
CustomerFilterKeys,
getFilterQueryParam, getFilterQueryParam,
getFilterOpts getFilterOpts
} from "./filter"; } from "./filter";
@ -89,37 +87,17 @@ export const CustomerList: React.FC<CustomerListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<CustomerFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
customerListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: customerListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
customerListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
customerListUrl({
...params,
activeTab: undefined,
query
})
);
};
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
CustomerListUrlDialog, CustomerListUrlDialog,

View file

@ -24,8 +24,7 @@ import { ListViews } from "@saleor/types";
import { getSortParams } from "@saleor/utils/sort"; import { getSortParams } from "@saleor/utils/sort";
import createSortHandler from "@saleor/utils/handlers/sortHandler"; import createSortHandler from "@saleor/utils/handlers/sortHandler";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { IFilter } from "@saleor/components/Filter"; import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import { getFilterQueryParams } from "@saleor/utils/filters";
import SaleListPage from "../../components/SaleListPage"; import SaleListPage from "../../components/SaleListPage";
import { TypedSaleBulkDelete } from "../../mutations"; import { TypedSaleBulkDelete } from "../../mutations";
import { useSaleListQuery } from "../../queries"; import { useSaleListQuery } from "../../queries";
@ -44,7 +43,6 @@ import {
getFilterTabs, getFilterTabs,
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
SaleFilterKeys,
getFilterQueryParam, getFilterQueryParam,
getFilterOpts getFilterOpts
} from "./filter"; } from "./filter";
@ -90,37 +88,17 @@ export const SaleList: React.FC<SaleListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<SaleFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
saleListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: saleListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
saleListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
saleListUrl({
...params,
activeTab: undefined,
query
})
);
};
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
SaleListUrlDialog, SaleListUrlDialog,

View file

@ -26,6 +26,7 @@ import createSortHandler from "@saleor/utils/handlers/sortHandler";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { getFilterQueryParams } from "@saleor/utils/filters"; import { getFilterQueryParams } from "@saleor/utils/filters";
import { IFilter } from "@saleor/components/Filter"; import { IFilter } from "@saleor/components/Filter";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import VoucherListPage from "../../components/VoucherListPage"; import VoucherListPage from "../../components/VoucherListPage";
import { TypedVoucherBulkDelete } from "../../mutations"; import { TypedVoucherBulkDelete } from "../../mutations";
import { useVoucherListQuery } from "../../queries"; import { useVoucherListQuery } from "../../queries";
@ -90,37 +91,17 @@ export const VoucherList: React.FC<VoucherListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<VoucherFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
voucherListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: voucherListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
voucherListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
voucherListUrl({
...params,
activeTab: undefined,
query
})
);
};
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
VoucherListUrlDialog, VoucherListUrlDialog,

View file

@ -21,9 +21,8 @@ import { ListViews } from "@saleor/types";
import createSortHandler from "@saleor/utils/handlers/sortHandler"; import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { getSortParams } from "@saleor/utils/sort"; import { getSortParams } from "@saleor/utils/sort";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { getFilterQueryParams } from "@saleor/utils/filters";
import { IFilter } from "@saleor/components/Filter";
import useShop from "@saleor/hooks/useShop"; import useShop from "@saleor/hooks/useShop";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import OrderDraftListPage from "../../components/OrderDraftListPage"; import OrderDraftListPage from "../../components/OrderDraftListPage";
import { import {
TypedOrderDraftBulkCancelMutation, TypedOrderDraftBulkCancelMutation,
@ -46,7 +45,6 @@ import {
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
getFilterQueryParam, getFilterQueryParam,
OrderDraftFilterKeys,
getFilterOpts getFilterOpts
} from "./filter"; } from "./filter";
import { getSortQueryVariables } from "./sort"; import { getSortQueryVariables } from "./sort";
@ -90,37 +88,17 @@ export const OrderDraftList: React.FC<OrderDraftListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<OrderDraftFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
orderDraftListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: orderDraftListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
orderDraftListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
orderDraftListUrl({
...params,
activeTab: undefined,
query
})
);
};
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
OrderDraftListUrlDialog, OrderDraftListUrlDialog,

View file

@ -19,8 +19,7 @@ import { ListViews } from "@saleor/types";
import createSortHandler from "@saleor/utils/handlers/sortHandler"; import createSortHandler from "@saleor/utils/handlers/sortHandler";
import { getSortParams } from "@saleor/utils/sort"; import { getSortParams } from "@saleor/utils/sort";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { IFilter } from "@saleor/components/Filter"; import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import { getFilterQueryParams } from "@saleor/utils/filters";
import OrderBulkCancelDialog from "../../components/OrderBulkCancelDialog"; import OrderBulkCancelDialog from "../../components/OrderBulkCancelDialog";
import OrderListPage from "../../components/OrderListPage/OrderListPage"; import OrderListPage from "../../components/OrderListPage/OrderListPage";
import { import {
@ -44,7 +43,6 @@ import {
getFilterOpts, getFilterOpts,
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
OrderFilterKeys,
getFilterQueryParam getFilterQueryParam
} from "./filters"; } from "./filters";
import { getSortQueryVariables } from "./sort"; import { getSortQueryVariables } from "./sort";
@ -88,37 +86,17 @@ export const OrderList: React.FC<OrderListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<OrderFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
orderListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: orderListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
orderListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
orderListUrl({
...params,
activeTab: undefined,
query
})
);
};
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
OrderListUrlDialog, OrderListUrlDialog,

View file

@ -21,9 +21,8 @@ import { ListViews } from "@saleor/types";
import { getSortParams } from "@saleor/utils/sort"; import { getSortParams } from "@saleor/utils/sort";
import createSortHandler from "@saleor/utils/handlers/sortHandler"; import createSortHandler from "@saleor/utils/handlers/sortHandler";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { IFilter } from "@saleor/components/Filter";
import { getFilterQueryParams } from "@saleor/utils/filters";
import useShop from "@saleor/hooks/useShop"; import useShop from "@saleor/hooks/useShop";
import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import { configurationMenuUrl } from "../../../configuration"; import { configurationMenuUrl } from "../../../configuration";
import { maybe } from "../../../misc"; import { maybe } from "../../../misc";
import ProductTypeListPage from "../../components/ProductTypeListPage"; import ProductTypeListPage from "../../components/ProductTypeListPage";
@ -44,7 +43,6 @@ import {
getFilterTabs, getFilterTabs,
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
ProductTypeFilterKeys,
getFilterQueryParam, getFilterQueryParam,
getFilterOpts getFilterOpts
} from "./filter"; } from "./filter";
@ -88,37 +86,17 @@ export const ProductTypeList: React.FC<ProductTypeListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<ProductTypeFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
productTypeListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: productTypeListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
productTypeListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
productTypeListUrl({
...params,
activeTab: undefined,
query
})
);
};
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
ProductTypeListUrlDialog, ProductTypeListUrlDialog,

View file

@ -25,8 +25,7 @@ import { ProductListVariables } from "@saleor/products/types/ProductList";
import { ListViews } from "@saleor/types"; import { ListViews } from "@saleor/types";
import { getSortUrlVariables } from "@saleor/utils/sort"; import { getSortUrlVariables } from "@saleor/utils/sort";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { IFilter } from "@saleor/components/Filter"; import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import { getFilterQueryParams } from "@saleor/utils/filters";
import ProductListPage from "../../components/ProductListPage"; import ProductListPage from "../../components/ProductListPage";
import { import {
TypedProductBulkDeleteMutation, TypedProductBulkDeleteMutation,
@ -53,7 +52,6 @@ import {
getFilterTabs, getFilterTabs,
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
ProductFilterKeys,
getFilterOpts, getFilterOpts,
getFilterQueryParam getFilterQueryParam
} from "./filters"; } from "./filters";
@ -103,37 +101,17 @@ export const ProductList: React.FC<ProductListProps> = ({ params }) => {
ProductListUrlQueryParams ProductListUrlQueryParams
>(navigate, productListUrl, params); >(navigate, productListUrl, params);
const changeFilters = (filter: IFilter<ProductFilterKeys>) => { const [
reset(); changeFilters,
navigate( resetFilters,
productListUrl({ handleSearchChange
...params, ] = createFilterHandlers({
...getFilterQueryParams(filter, getFilterQueryParam), cleanupFn: reset,
activeTab: undefined createUrl: productListUrl,
}) getFilterQueryParam,
); navigate,
}; params
});
const resetFilters = () => {
reset();
navigate(
productListUrl({
asc: params.asc,
sort: params.sort
})
);
};
const handleSearchChange = (query: string) => {
reset();
navigate(
productListUrl({
...params,
activeTab: undefined,
query
})
);
};
const handleTabChange = (tab: number) => { const handleTabChange = (tab: number) => {
reset(); reset();

View file

@ -23,8 +23,7 @@ import { ListViews } from "@saleor/types";
import { getSortParams } from "@saleor/utils/sort"; import { getSortParams } from "@saleor/utils/sort";
import createSortHandler from "@saleor/utils/handlers/sortHandler"; import createSortHandler from "@saleor/utils/handlers/sortHandler";
import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers"; import createDialogActionHandlers from "@saleor/utils/handlers/dialogActionHandlers";
import { IFilter } from "@saleor/components/Filter"; import createFilterHandlers from "@saleor/utils/handlers/filterHandlers";
import { getFilterQueryParams } from "@saleor/utils/filters";
import StaffAddMemberDialog, { import StaffAddMemberDialog, {
FormData as AddStaffMemberForm FormData as AddStaffMemberForm
} from "../../components/StaffAddMemberDialog"; } from "../../components/StaffAddMemberDialog";
@ -45,7 +44,6 @@ import {
getFilterTabs, getFilterTabs,
getFilterVariables, getFilterVariables,
saveFilterTab, saveFilterTab,
StaffFilterKeys,
getFilterQueryParam, getFilterQueryParam,
getFilterOpts getFilterOpts
} from "./filter"; } from "./filter";
@ -89,31 +87,16 @@ export const StaffList: React.FC<StaffListProps> = ({ params }) => {
: 0 : 0
: parseInt(params.activeTab, 0); : parseInt(params.activeTab, 0);
const changeFilters = (filter: IFilter<StaffFilterKeys>) => const [
navigate( changeFilters,
staffListUrl({ resetFilters,
...params, handleSearchChange
...getFilterQueryParams(filter, getFilterQueryParam), ] = createFilterHandlers({
activeTab: undefined createUrl: staffListUrl,
}) getFilterQueryParam,
); navigate,
params
const resetFilters = () => });
navigate(
staffListUrl({
asc: params.asc,
sort: params.sort
})
);
const handleSearchChange = (query: string) =>
navigate(
staffListUrl({
...params,
activeTab: undefined,
query
})
);
const [openModal, closeModal] = createDialogActionHandlers< const [openModal, closeModal] = createDialogActionHandlers<
StaffListUrlDialog, StaffListUrlDialog,

View file

@ -23,12 +23,15 @@ function createFilterHandlers<
navigate: UseNavigatorResult; navigate: UseNavigatorResult;
createUrl: CreateUrl; createUrl: CreateUrl;
params: RequiredParams; params: RequiredParams;
cleanupFn: () => void; cleanupFn?: () => void;
}): CreateFilterHandlers<TFilterKeys> { }): CreateFilterHandlers<TFilterKeys> {
const { getFilterQueryParam, navigate, createUrl, params, cleanupFn } = opts; const { getFilterQueryParam, navigate, createUrl, params, cleanupFn } = opts;
const changeFilters = (filter: IFilter<TFilterKeys>) => { const changeFilters = (filter: IFilter<TFilterKeys>) => {
if (!!cleanupFn) {
cleanupFn(); cleanupFn();
}
navigate( navigate(
createUrl({ createUrl({
...params, ...params,
@ -39,7 +42,10 @@ function createFilterHandlers<
}; };
const resetFilters = () => { const resetFilters = () => {
if (!!cleanupFn) {
cleanupFn(); cleanupFn();
}
navigate( navigate(
createUrl({ createUrl({
asc: params.asc, asc: params.asc,
@ -49,7 +55,10 @@ function createFilterHandlers<
}; };
const handleSearchChange = (query: string) => { const handleSearchChange = (query: string) => {
if (!!cleanupFn) {
cleanupFn(); cleanupFn();
}
navigate( navigate(
createUrl({ createUrl({
...params, ...params,