Use page search hook

This commit is contained in:
dominik-zeglen 2019-11-19 17:40:23 +01:00
parent b07b220b3c
commit bd7130d196
4 changed files with 249 additions and 260 deletions

View file

@ -14,13 +14,13 @@ import ConfirmButton, {
ConfirmButtonTransitionState
} from "@saleor/components/ConfirmButton";
import FormSpacer from "@saleor/components/FormSpacer";
import { SearchPages_search_edges_node } from "@saleor/containers/SearchPages/types/SearchPages";
import useModalDialogErrors from "@saleor/hooks/useModalDialogErrors";
import useModalDialogOpen from "@saleor/hooks/useModalDialogOpen";
import useStateFromProps from "@saleor/hooks/useStateFromProps";
import { buttonMessages, sectionNames } from "@saleor/intl";
import { SearchCategories_search_edges_node } from "@saleor/searches/types/SearchCategories";
import { SearchCollections_search_edges_node } from "@saleor/searches/types/SearchCollections";
import { SearchPages_search_edges_node } from "@saleor/searches/types/SearchPages";
import { UserError } from "@saleor/types";
import { getErrors, getFieldError } from "@saleor/utils/errors";
import { getMenuItemByValue, IMenu } from "@saleor/utils/menu";

View file

@ -7,10 +7,10 @@ import useNavigator from "@saleor/hooks/useNavigator";
import useNotifier from "@saleor/hooks/useNotifier";
import useCategorySearch from "@saleor/searches/useCategorySearch";
import useCollectionSearch from "@saleor/searches/useCollectionSearch";
import usePageSearch from "@saleor/searches/usePageSearch";
import { categoryUrl } from "../../../categories/urls";
import { collectionUrl } from "../../../collections/urls";
import { DEFAULT_INITIAL_SEARCH_DATA } from "../../../config";
import SearchPages from "../../../containers/SearchPages";
import { getMutationState, maybe } from "../../../misc";
import { pageUrl } from "../../../pages/urls";
import MenuDetailsPage, {
@ -65,6 +65,9 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
const collectionSearch = useCollectionSearch({
variables: DEFAULT_INITIAL_SEARCH_DATA
});
const pageSearch = usePageSearch({
variables: DEFAULT_INITIAL_SEARCH_DATA
});
const closeModal = () =>
navigate(
@ -101,8 +104,6 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
};
return (
<SearchPages variables={DEFAULT_INITIAL_SEARCH_DATA}>
{pageSearch => (
<MenuDetailsQuery displayLoader variables={{ id }}>
{({ data, loading, refetch }) => {
const handleQueryChange = (query: string) => {
@ -112,16 +113,13 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
};
const categories = maybe(
() =>
categorySearch.result.data.search.edges.map(edge => edge.node),
() => categorySearch.result.data.search.edges.map(edge => edge.node),
[]
);
const collections = maybe(
() =>
collectionSearch.result.data.search.edges.map(
edge => edge.node
),
collectionSearch.result.data.search.edges.map(edge => edge.node),
[]
);
@ -136,9 +134,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
>
{(menuDelete, menuDeleteOpts) => (
<MenuUpdateMutation
onCompleted={data =>
handleUpdate(data, notify, refetch, intl)
}
onCompleted={data => handleUpdate(data, notify, refetch, intl)}
>
{(menuUpdate, menuUpdateOpts) => {
const deleteState = getMutationState(
@ -157,9 +153,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
// This is a workaround to let know <MenuDetailsPage />
// that it should clean operation stack if mutations
// were successful
const handleSubmit = async (
data: MenuDetailsSubmitData
) => {
const handleSubmit = async (data: MenuDetailsSubmitData) => {
try {
const result = await menuUpdate({
variables: {
@ -171,8 +165,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
});
if (result) {
if (
result.data.menuItemBulkDelete.errors.length >
0 ||
result.data.menuItemBulkDelete.errors.length > 0 ||
result.data.menuItemMove.errors.length > 0 ||
result.data.menuUpdate.errors.length > 0
) {
@ -265,8 +258,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
menuItemCreateOpts.loading,
maybe(
() =>
menuItemCreateOpts.data.menuItemCreate
.errors
menuItemCreateOpts.data.menuItemCreate.errors
)
);
@ -277,8 +269,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
collections={collections}
errors={maybe(
() =>
menuItemCreateOpts.data.menuItemCreate
.errors,
menuItemCreateOpts.data.menuItemCreate.errors,
[]
)}
pages={pages}
@ -324,8 +315,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
menuItemUpdateOpts.loading,
maybe(
() =>
menuItemUpdateOpts.data.menuItemUpdate
.errors
menuItemUpdateOpts.data.menuItemUpdate.errors
)
);
@ -345,8 +335,7 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
collections={collections}
errors={maybe(
() =>
menuItemUpdateOpts.data.menuItemUpdate
.errors,
menuItemUpdateOpts.data.menuItemUpdate.errors,
[]
)}
pages={pages}
@ -376,8 +365,6 @@ const MenuDetails: React.FC<MenuDetailsProps> = ({ id, params }) => {
);
}}
</MenuDetailsQuery>
)}
</SearchPages>
);
};
MenuDetails.displayName = "MenuDetails";

View file

@ -1,7 +1,7 @@
import gql from "graphql-tag";
import makeTopLevelSearch from "@saleor/hooks/makeTopLevelSearch";
import { pageInfoFragment } from "@saleor/queries";
import TopLevelSearch from "../TopLevelSearch";
import { SearchPages, SearchPagesVariables } from "./types/SearchPages";
export const searchPages = gql`
@ -21,4 +21,6 @@ export const searchPages = gql`
}
`;
export default TopLevelSearch<SearchPages, SearchPagesVariables>(searchPages);
export default makeTopLevelSearch<SearchPages, SearchPagesVariables>(
searchPages
);