diff --git a/src/components/CompanyAddressInput/CompanyAddressInput.tsx b/src/components/CompanyAddressInput/CompanyAddressInput.tsx index a064b4c25..87ecaf788 100644 --- a/src/components/CompanyAddressInput/CompanyAddressInput.tsx +++ b/src/components/CompanyAddressInput/CompanyAddressInput.tsx @@ -10,7 +10,7 @@ import CompanyAddressForm, { } from "./CompanyAddressForm"; interface CompanyAddressInputProps extends CompanyAddressFormProps { - className: string; + className?: string; header: string; } diff --git a/src/products/fixtures.ts b/src/products/fixtures.ts index 5f019f4dc..34355ff65 100644 --- a/src/products/fixtures.ts +++ b/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; diff --git a/src/shipping/components/ShippingZoneInfo/ShippingZoneInfo.tsx b/src/shipping/components/ShippingZoneInfo/ShippingZoneInfo.tsx index 0ad8e0d08..6aeacf402 100644 --- a/src/shipping/components/ShippingZoneInfo/ShippingZoneInfo.tsx +++ b/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) => void; @@ -42,7 +41,7 @@ const ShippingZoneInfo: React.FC = ({ label={intl.formatMessage({ defaultMessage: "Shipping Zone Name" })} - name={"name" as keyof FormData} + name="name" value={data.name} onChange={onChange} /> diff --git a/src/shipping/fixtures.ts b/src/shipping/fixtures.ts index cefe56d87..c05e6d2da 100644 --- a/src/shipping/fixtures.ts +++ b/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 }; diff --git a/src/shipping/views/ShippingZoneCreate.tsx b/src/shipping/views/ShippingZoneCreate.tsx index bf063090d..95928cc08 100644 --- a/src/shipping/views/ShippingZoneCreate.tsx +++ b/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 ( - - {(createShippingZone, createShippingZoneOpts) => ( - shop.countries, [])} - disabled={createShippingZoneOpts.loading} - errors={createShippingZoneOpts.data?.shippingZoneCreate.errors || []} - onBack={() => navigate(shippingZonesListUrl())} - onSubmit={formData => - createShippingZone({ - variables: { - input: formData - } - }) + navigate(shippingZonesListUrl())} + onSubmit={formData => + createShippingZone({ + variables: { + input: formData } - saveButtonBarState={createShippingZoneOpts.status} - /> - )} - + }) + } + saveButtonBarState={createShippingZoneOpts.status} + /> ); }; export default ShippingZoneCreate; diff --git a/src/shipping/views/ShippingZoneDetails/ShippingZoneOperations.tsx b/src/shipping/views/ShippingZoneDetails/ShippingZoneOperations.tsx deleted file mode 100644 index cbf7db83b..000000000 --- a/src/shipping/views/ShippingZoneDetails/ShippingZoneOperations.tsx +++ /dev/null @@ -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 = ({ - children, - onShippingRateCreate, - onShippingRateDelete, - onShippingRateUpdate, - onShippingZoneDelete, - onShippingZoneUpdate -}) => ( - - {(...shippingRateCreate) => ( - - {(...shippingRateDelete) => ( - - {(...shippingRateUpdate) => ( - - {(...shippingZoneDelete) => ( - - {(...shippingZoneUpdate) => - children({ - shippingRateCreate: getMutationProviderData( - ...shippingRateCreate - ), - shippingRateDelete: getMutationProviderData( - ...shippingRateDelete - ), - shippingRateUpdate: getMutationProviderData( - ...shippingRateUpdate - ), - shippingZoneDelete: getMutationProviderData( - ...shippingZoneDelete - ), - shippingZoneUpdate: getMutationProviderData( - ...shippingZoneUpdate - ) - }) - } - - )} - - )} - - )} - - )} - -); -ShippingZoneOperations.displayName = "ShippingZoneOperations"; -export default ShippingZoneOperations; diff --git a/src/storybook/stories/shipping/ShippingZoneDetailsPage.tsx b/src/storybook/stories/shipping/ShippingZoneDetailsPage.tsx index 0bfc95c76..d510de60f 100644 --- a/src/storybook/stories/shipping/ShippingZoneDetailsPage.tsx +++ b/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)