Fix types

src/components/CompanyAddressInput/CompanyAddressInput.tsx

@@ -10,7 +10,7 @@ import CompanyAddressForm, {
 } from "./CompanyAddressForm";
 
 interface CompanyAddressInputProps extends CompanyAddressFormProps {
-  className: string;
+  className?: string;
   header: string;
 }
 

src/products/fixtures.ts

@@ -1,4 +1,5 @@
 import { AttributeInputTypeEnum } from "@saleor/types/globalTypes";
+import { warehouseList } from "@saleor/warehouses/fixtures";
 import { content } from "../storybook/stories/components/RichTextEditor";
 import { ProductDetails_product } from "./types/ProductDetails";
 import { ProductList_products_edges_node } from "./types/ProductList";
@@ -262,6 +263,20 @@ export const product: (
       quantity: 12,
       quantityAllocated: 1,
       sku: "87192-94370",
+      stock: [
+        {
+          __typename: "Stock",
+          id: "1",
+          quantity: 1,
+          warehouse: warehouseList[0]
+        },
+        {
+          __typename: "Stock",
+          id: "2",
+          quantity: 4,
+          warehouse: warehouseList[1]
+        }
+      ],
       stockQuantity: 48
     },
     {
@@ -285,6 +300,14 @@ export const product: (
       quantity: 12,
       quantityAllocated: 1,
       sku: "69055-15190",
+      stock: [
+        {
+          __typename: "Stock",
+          id: "1",
+          quantity: 13,
+          warehouse: warehouseList[0]
+        }
+      ],
       stockQuantity: 14
     }
   ]
@@ -1230,7 +1253,19 @@ export const variant = (placeholderImage: string): ProductVariant => ({
   },
   quantity: 19,
   quantityAllocated: 12,
-  sku: "1230959124123"
+  sku: "1230959124123",
+  stock: [
+    {
+      __typename: "Stock",
+      id: "1",
+      quantity: 1
+    },
+    {
+      __typename: "Stock",
+      id: "2",
+      quantity: 4
+    }
+  ]
 });
 export const variantImages = (placeholderImage: string) =>
   variant(placeholderImage).images;

src/shipping/components/ShippingZoneInfo/ShippingZoneInfo.tsx

@@ -9,10 +9,9 @@ import { commonMessages } from "@saleor/intl";
 import { getFormErrors } from "@saleor/utils/errors";
 import getShippingErrorMessage from "@saleor/utils/errors/shipping";
 import { ShippingErrorFragment } from "@saleor/shipping/types/ShippingErrorFragment";
-import { FormData } from "../ShippingZoneDetailsPage";
 
 export interface ShippingZoneInfoProps {
-  data: FormData;
+  data: Record<"name", string>;
   disabled: boolean;
   errors: ShippingErrorFragment[];
   onChange: (event: React.ChangeEvent<any>) => void;
@@ -42,7 +41,7 @@ const ShippingZoneInfo: React.FC<ShippingZoneInfoProps> = ({
           label={intl.formatMessage({
             defaultMessage: "Shipping Zone Name"
           })}
-          name={"name" as keyof FormData}
+          name="name"
           value={data.name}
           onChange={onChange}
         />

src/shipping/fixtures.ts

@@ -1,3 +1,4 @@
+import { warehouseList } from "@saleor/warehouses/fixtures";
 import { ShippingMethodTypeEnum } from "../types/globalTypes";
 import { ShippingZoneDetailsFragment } from "./types/ShippingZoneDetailsFragment";
 import { ShippingZoneFragment } from "./types/ShippingZoneFragment";
@@ -1644,5 +1645,6 @@ export const shippingZone: ShippingZoneDetailsFragment = {
       },
       type: ShippingMethodTypeEnum.PRICE
     }
-  ]
+  ],
+  warehouses: warehouseList
 };

src/shipping/views/ShippingZoneCreate.tsx

@@ -5,45 +5,41 @@ import useNavigator from "@saleor/hooks/useNavigator";
 import useNotifier from "@saleor/hooks/useNotifier";
 import useShop from "@saleor/hooks/useShop";
 import { commonMessages } from "@saleor/intl";
-import { maybe } from "../../misc";
 import ShippingZoneCreatePage from "../components/ShippingZoneCreatePage";
-import { TypedCreateShippingZone } from "../mutations";
-import { CreateShippingZone } from "../types/CreateShippingZone";
+import { useShippingZoneCreate } from "../mutations";
 import { shippingZonesListUrl, shippingZoneUrl } from "../urls";
 
 const ShippingZoneCreate: React.FC<{}> = () => {
   const navigate = useNavigator();
-  const pushMessage = useNotifier();
+  const notify = useNotifier();
   const shop = useShop();
   const intl = useIntl();
 
-  const onShippingZoneCreate = (data: CreateShippingZone) => {
-    if (data.shippingZoneCreate.errors.length === 0) {
-      pushMessage({
-        text: intl.formatMessage(commonMessages.savedChanges)
-      });
-      navigate(shippingZoneUrl(data.shippingZoneCreate.shippingZone.id));
+  const [createShippingZone, createShippingZoneOpts] = useShippingZoneCreate({
+    onCompleted: data => {
+      if (data.shippingZoneCreate.errors.length === 0) {
+        notify({
+          text: intl.formatMessage(commonMessages.savedChanges)
+        });
+        navigate(shippingZoneUrl(data.shippingZoneCreate.shippingZone.id));
+      }
     }
-  };
+  });
   return (
-    <TypedCreateShippingZone onCompleted={onShippingZoneCreate}>
-      {(createShippingZone, createShippingZoneOpts) => (
-        <ShippingZoneCreatePage
-          countries={maybe(() => shop.countries, [])}
-          disabled={createShippingZoneOpts.loading}
-          errors={createShippingZoneOpts.data?.shippingZoneCreate.errors || []}
-          onBack={() => navigate(shippingZonesListUrl())}
-          onSubmit={formData =>
-            createShippingZone({
-              variables: {
-                input: formData
-              }
-            })
+    <ShippingZoneCreatePage
+      countries={shop?.countries || []}
+      disabled={createShippingZoneOpts.loading}
+      errors={createShippingZoneOpts.data?.shippingZoneCreate.errors || []}
+      onBack={() => navigate(shippingZonesListUrl())}
+      onSubmit={formData =>
+        createShippingZone({
+          variables: {
+            input: formData
           }
-          saveButtonBarState={createShippingZoneOpts.status}
-        />
-      )}
-    </TypedCreateShippingZone>
+        })
+      }
+      saveButtonBarState={createShippingZoneOpts.status}
+    />
   );
 };
 export default ShippingZoneCreate;

src/shipping/views/ShippingZoneDetails/ShippingZoneOperations.tsx

@@ -1,111 +0,0 @@
-import React from "react";
-
-import { getMutationProviderData } from "../../../misc";
-import { PartialMutationProviderOutput } from "../../../types";
-import {
-  TypedCreateShippingRate,
-  TypedDeleteShippingRate,
-  TypedDeleteShippingZone,
-  TypedUpdateShippingRate,
-  TypedUpdateShippingZone
-} from "../../mutations";
-import {
-  CreateShippingRate,
-  CreateShippingRateVariables
-} from "../../types/CreateShippingRate";
-import {
-  DeleteShippingRate,
-  DeleteShippingRateVariables
-} from "../../types/DeleteShippingRate";
-import {
-  DeleteShippingZone,
-  DeleteShippingZoneVariables
-} from "../../types/DeleteShippingZone";
-import {
-  UpdateShippingRate,
-  UpdateShippingRateVariables
-} from "../../types/UpdateShippingRate";
-import {
-  UpdateShippingZone,
-  UpdateShippingZoneVariables
-} from "../../types/UpdateShippingZone";
-
-export interface ShippingZoneOperationsOutput {
-  shippingRateCreate: PartialMutationProviderOutput<
-    CreateShippingRate,
-    CreateShippingRateVariables
-  >;
-  shippingRateDelete: PartialMutationProviderOutput<
-    DeleteShippingRate,
-    DeleteShippingRateVariables
-  >;
-  shippingRateUpdate: PartialMutationProviderOutput<
-    UpdateShippingRate,
-    UpdateShippingRateVariables
-  >;
-  shippingZoneDelete: PartialMutationProviderOutput<
-    DeleteShippingZone,
-    DeleteShippingZoneVariables
-  >;
-  shippingZoneUpdate: PartialMutationProviderOutput<
-    UpdateShippingZone,
-    UpdateShippingZoneVariables
-  >;
-}
-interface ShippingZoneOperationsProps {
-  children: (props: ShippingZoneOperationsOutput) => React.ReactNode;
-  onShippingRateCreate: (data: CreateShippingRate) => void;
-  onShippingRateDelete: (data: DeleteShippingRate) => void;
-  onShippingRateUpdate: (data: UpdateShippingRate) => void;
-  onShippingZoneDelete: (data: DeleteShippingZone) => void;
-  onShippingZoneUpdate: (data: UpdateShippingZone) => void;
-}
-
-const ShippingZoneOperations: React.FC<ShippingZoneOperationsProps> = ({
-  children,
-  onShippingRateCreate,
-  onShippingRateDelete,
-  onShippingRateUpdate,
-  onShippingZoneDelete,
-  onShippingZoneUpdate
-}) => (
-  <TypedCreateShippingRate onCompleted={onShippingRateCreate}>
-    {(...shippingRateCreate) => (
-      <TypedDeleteShippingRate onCompleted={onShippingRateDelete}>
-        {(...shippingRateDelete) => (
-          <TypedUpdateShippingRate onCompleted={onShippingRateUpdate}>
-            {(...shippingRateUpdate) => (
-              <TypedDeleteShippingZone onCompleted={onShippingZoneDelete}>
-                {(...shippingZoneDelete) => (
-                  <TypedUpdateShippingZone onCompleted={onShippingZoneUpdate}>
-                    {(...shippingZoneUpdate) =>
-                      children({
-                        shippingRateCreate: getMutationProviderData(
-                          ...shippingRateCreate
-                        ),
-                        shippingRateDelete: getMutationProviderData(
-                          ...shippingRateDelete
-                        ),
-                        shippingRateUpdate: getMutationProviderData(
-                          ...shippingRateUpdate
-                        ),
-                        shippingZoneDelete: getMutationProviderData(
-                          ...shippingZoneDelete
-                        ),
-                        shippingZoneUpdate: getMutationProviderData(
-                          ...shippingZoneUpdate
-                        )
-                      })
-                    }
-                  </TypedUpdateShippingZone>
-                )}
-              </TypedDeleteShippingZone>
-            )}
-          </TypedUpdateShippingRate>
-        )}
-      </TypedDeleteShippingRate>
-    )}
-  </TypedCreateShippingRate>
-);
-ShippingZoneOperations.displayName = "ShippingZoneOperations";
-export default ShippingZoneOperations;

src/storybook/stories/shipping/ShippingZoneDetailsPage.tsx

@@ -2,6 +2,8 @@ import { storiesOf } from "@storybook/react";
 import React from "react";
 
 import { ShippingErrorCode } from "@saleor/types/globalTypes";
+import { warehouseList } from "@saleor/warehouses/fixtures";
+import { fetchMoreProps, searchPageProps } from "@saleor/fixtures";
 import ShippingZoneDetailsPage, {
   ShippingZoneDetailsPageProps
 } from "../../../shipping/components/ShippingZoneDetailsPage";
@@ -9,6 +11,8 @@ import { shippingZone } from "../../../shipping/fixtures";
 import Decorator from "../../Decorator";
 
 const props: ShippingZoneDetailsPageProps = {
+  ...fetchMoreProps,
+  ...searchPageProps,
   disabled: false,
   errors: [],
   onBack: () => undefined,
@@ -19,10 +23,12 @@ const props: ShippingZoneDetailsPageProps = {
   onPriceRateEdit: () => undefined,
   onRateRemove: () => undefined,
   onSubmit: () => undefined,
+  onWarehouseAdd: () => undefined,
   onWeightRateAdd: () => undefined,
   onWeightRateEdit: () => undefined,
   saveButtonBarState: "default",
-  shippingZone
+  shippingZone,
+  warehouses: warehouseList
 };
 
 storiesOf("Views / Shipping / Shipping zone details", module)