From 1f3d3be072630515cd79b9f56985bcd07ad93121 Mon Sep 17 00:00:00 2001
From: dominik-zeglen <flesz3@o2.pl>
Date: Tue, 15 Oct 2019 15:20:36 +0200
Subject: [PATCH] Fix types

---
 .../ProductOrganization.tsx                   |  1 +
 .../ProductUpdatePage/ProductUpdatePage.tsx   |  8 ++++-
 .../views/ProductUpdate/ProductUpdate.tsx     | 30 +++++++++++++++++--
 .../stories/products/ProductCreatePage.tsx    | 14 +++++++--
 .../stories/products/ProductUpdatePage.tsx    |  4 ++-
 5 files changed, 50 insertions(+), 7 deletions(-)

diff --git a/src/products/components/ProductOrganization/ProductOrganization.tsx b/src/products/components/ProductOrganization/ProductOrganization.tsx
index 705ec8af7..c52a85bf1 100644
--- a/src/products/components/ProductOrganization/ProductOrganization.tsx
+++ b/src/products/components/ProductOrganization/ProductOrganization.tsx
@@ -188,6 +188,7 @@ const ProductOrganization = withStyles(styles, { name: "ProductOrganization" })(
             onChange={onCollectionChange}
             fetchChoices={fetchCollections}
             data-tc="collections"
+            {...fetchMoreCollections}
           />
         </CardContent>
       </Card>
diff --git a/src/products/components/ProductUpdatePage/ProductUpdatePage.tsx b/src/products/components/ProductUpdatePage/ProductUpdatePage.tsx
index 4604a0116..0859c6d4a 100644
--- a/src/products/components/ProductUpdatePage/ProductUpdatePage.tsx
+++ b/src/products/components/ProductUpdatePage/ProductUpdatePage.tsx
@@ -19,7 +19,7 @@ import useFormset from "@saleor/hooks/useFormset";
 import useStateFromProps from "@saleor/hooks/useStateFromProps";
 import { sectionNames } from "@saleor/intl";
 import { maybe } from "@saleor/misc";
-import { ListActions, UserError } from "@saleor/types";
+import { FetchMoreProps, ListActions, UserError } from "@saleor/types";
 import createMultiAutocompleteSelectHandler from "@saleor/utils/handlers/multiAutocompleteSelectChangeHandler";
 import createSingleAutocompleteSelectHandler from "@saleor/utils/handlers/singleAutocompleteSelectChangeHandler";
 import {
@@ -53,6 +53,8 @@ export interface ProductUpdatePageProps extends ListActions {
   collections: SearchCollections_search_edges_node[];
   categories: SearchCategories_search_edges_node[];
   disabled: boolean;
+  fetchMoreCategories: FetchMoreProps;
+  fetchMoreCollections: FetchMoreProps;
   variants: ProductDetails_product_variants[];
   images: ProductDetails_product_images[];
   product: ProductDetails_product;
@@ -86,6 +88,8 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
   errors: userErrors,
   fetchCategories,
   fetchCollections,
+  fetchMoreCategories,
+  fetchMoreCollections,
   images,
   header,
   placeholderImage,
@@ -285,6 +289,8 @@ export const ProductUpdatePage: React.FC<ProductUpdatePageProps> = ({
                     errors={errors}
                     fetchCategories={fetchCategories}
                     fetchCollections={fetchCollections}
+                    fetchMoreCategories={fetchMoreCategories}
+                    fetchMoreCollections={fetchMoreCollections}
                     productType={maybe(() => product.productType)}
                     onCategoryChange={handleCategorySelect}
                     onCollectionChange={handleCollectionSelect}
diff --git a/src/products/views/ProductUpdate/ProductUpdate.tsx b/src/products/views/ProductUpdate/ProductUpdate.tsx
index 6889dc023..360acbd12 100644
--- a/src/products/views/ProductUpdate/ProductUpdate.tsx
+++ b/src/products/views/ProductUpdate/ProductUpdate.tsx
@@ -68,9 +68,17 @@ export const ProductUpdate: React.StatelessComponent<ProductUpdateProps> = ({
 
   return (
     <SearchCategories variables={DEFAULT_INITIAL_SEARCH_DATA}>
-      {({ search: searchCategories, result: searchCategoriesOpts }) => (
+      {({
+        loadMore: loadMoreCategories,
+        search: searchCategories,
+        result: searchCategoriesOpts
+      }) => (
         <SearchCollections variables={DEFAULT_INITIAL_SEARCH_DATA}>
-          {({ search: searchCollections, result: searchCollectionsOpts }) => (
+          {({
+            loadMore: loadMoreCollections,
+            search: searchCollections,
+            result: searchCollectionsOpts
+          }) => (
             <TypedProductDetailsQuery
               displayLoader
               require={["product"]}
@@ -295,6 +303,24 @@ export const ProductUpdate: React.StatelessComponent<ProductUpdateProps> = ({
                             selected={listElements.length}
                             toggle={toggle}
                             toggleAll={toggleAll}
+                            fetchMoreCategories={{
+                              hasMore: maybe(
+                                () =>
+                                  searchCategoriesOpts.data.search.pageInfo
+                                    .hasNextPage
+                              ),
+                              loading: searchCategoriesOpts.loading,
+                              onFetchMore: loadMoreCategories
+                            }}
+                            fetchMoreCollections={{
+                              hasMore: maybe(
+                                () =>
+                                  searchCollectionsOpts.data.search.pageInfo
+                                    .hasNextPage
+                              ),
+                              loading: searchCollectionsOpts.loading,
+                              onFetchMore: loadMoreCollections
+                            }}
                           />
                           <ActionDialog
                             open={params.action === "remove"}
diff --git a/src/storybook/stories/products/ProductCreatePage.tsx b/src/storybook/stories/products/ProductCreatePage.tsx
index 09a70dda9..1c968c390 100644
--- a/src/storybook/stories/products/ProductCreatePage.tsx
+++ b/src/storybook/stories/products/ProductCreatePage.tsx
@@ -1,15 +1,14 @@
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { fetchMoreProps } from "@saleor/fixtures";
 import ProductCreatePage, {
   ProductCreatePageSubmitData
 } from "../../../products/components/ProductCreatePage";
-
-import { formError } from "../../misc";
-
 import { product as productFixture } from "../../../products/fixtures";
 import { productTypes } from "../../../productTypes/fixtures";
 import Decorator from "../../Decorator";
+import { formError } from "../../misc";
 
 const product = productFixture("");
 
@@ -25,6 +24,9 @@ storiesOf("Views / Products / Create product", module)
       fetchCategories={() => undefined}
       fetchCollections={() => undefined}
       fetchProductTypes={() => undefined}
+      fetchMoreCategories={fetchMoreProps}
+      fetchMoreCollections={fetchMoreProps}
+      fetchMoreProductTypes={fetchMoreProps}
       productTypes={productTypes}
       categories={[product.category]}
       onBack={() => undefined}
@@ -42,6 +44,9 @@ storiesOf("Views / Products / Create product", module)
       fetchCategories={() => undefined}
       fetchCollections={() => undefined}
       fetchProductTypes={() => undefined}
+      fetchMoreCategories={fetchMoreProps}
+      fetchMoreCollections={fetchMoreProps}
+      fetchMoreProductTypes={fetchMoreProps}
       productTypes={productTypes}
       categories={[product.category]}
       onBack={() => undefined}
@@ -61,6 +66,9 @@ storiesOf("Views / Products / Create product", module)
       fetchCategories={() => undefined}
       fetchCollections={() => undefined}
       fetchProductTypes={() => undefined}
+      fetchMoreCategories={fetchMoreProps}
+      fetchMoreCollections={fetchMoreProps}
+      fetchMoreProductTypes={fetchMoreProps}
       productTypes={productTypes}
       categories={[product.category]}
       onBack={() => undefined}
diff --git a/src/storybook/stories/products/ProductUpdatePage.tsx b/src/storybook/stories/products/ProductUpdatePage.tsx
index a0d34b83c..84c5b0952 100644
--- a/src/storybook/stories/products/ProductUpdatePage.tsx
+++ b/src/storybook/stories/products/ProductUpdatePage.tsx
@@ -3,7 +3,7 @@ import React from "react";
 
 import placeholderImage from "@assets/images/placeholder255x255.png";
 import { collections } from "@saleor/collections/fixtures";
-import { listActionsProps } from "@saleor/fixtures";
+import { fetchMoreProps, listActionsProps } from "@saleor/fixtures";
 import ProductUpdatePage, {
   ProductUpdatePageProps
 } from "@saleor/products/components/ProductUpdatePage";
@@ -20,6 +20,8 @@ const props: ProductUpdatePageProps = {
   errors: [],
   fetchCategories: () => undefined,
   fetchCollections: () => undefined,
+  fetchMoreCategories: fetchMoreProps,
+  fetchMoreCollections: fetchMoreProps,
   header: product.name,
   images: product.images,
   onBack: () => undefined,