From e9dabd4f1caf726165c3c07ecefe3d7e78cfd8ec Mon Sep 17 00:00:00 2001 From: dominik-zeglen Date: Thu, 14 Nov 2019 17:07:31 +0100 Subject: [PATCH] Fix submitting form without address --- .../CustomerCreatePage/CustomerCreatePage.tsx | 64 +++++++++++++++++-- src/customers/views/CustomerCreate.tsx | 36 +---------- 2 files changed, 61 insertions(+), 39 deletions(-) diff --git a/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx b/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx index d6572883c..00195850f 100644 --- a/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx +++ b/src/customers/components/CustomerCreatePage/CustomerCreatePage.tsx @@ -11,6 +11,7 @@ import PageHeader from "@saleor/components/PageHeader"; import SaveButtonBar from "@saleor/components/SaveButtonBar"; import useAddressValidation from "@saleor/hooks/useAddressValidation"; import { sectionNames } from "@saleor/intl"; +import { AddressInput } from "@saleor/types/globalTypes"; import createSingleAutocompleteSelectHandler from "@saleor/utils/handlers/singleAutocompleteSelectChangeHandler"; import { UserError } from "../../../types"; import { AddressTypeInput } from "../../types"; @@ -19,14 +20,18 @@ import CustomerCreateAddress from "../CustomerCreateAddress/CustomerCreateAddres import CustomerCreateDetails from "../CustomerCreateDetails"; import CustomerCreateNote from "../CustomerCreateNote/CustomerCreateNote"; -export interface CustomerCreatePageFormData extends AddressTypeInput { +export interface CustomerCreatePageFormData { customerFirstName: string; customerLastName: string; email: string; note: string; } +export interface CustomerCreatePageSubmitData + extends CustomerCreatePageFormData { + address: AddressInput; +} -const initialForm: CustomerCreatePageFormData = { +const initialForm: CustomerCreatePageFormData & AddressTypeInput = { city: "", cityArea: "", companyName: "", @@ -50,7 +55,7 @@ export interface CustomerCreatePageProps { errors: UserError[]; saveButtonBar: ConfirmButtonTransitionState; onBack: () => void; - onSubmit: (data: CustomerCreatePageFormData) => void; + onSubmit: (data: CustomerCreatePageSubmitData) => void; } const CustomerCreatePage: React.FC = ({ @@ -70,8 +75,57 @@ const CustomerCreatePage: React.FC = ({ })); const { errors: validationErrors, - submit: handleSubmit - } = useAddressValidation(onSubmit); + submit: handleSubmitWithAddress + } = useAddressValidation(formData => + onSubmit({ + address: { + city: formData.city, + cityArea: formData.cityArea, + companyName: formData.companyName, + country: formData.country, + countryArea: formData.countryArea, + firstName: formData.firstName, + lastName: formData.lastName, + phone: formData.phone, + postalCode: formData.postalCode, + streetAddress1: formData.streetAddress1, + streetAddress2: formData.streetAddress2 + }, + customerFirstName: formData.customerFirstName, + customerLastName: formData.customerLastName, + email: formData.email, + note: formData.note + }) + ); + + const handleSubmit = (formData: CustomerCreatePageFormData) => { + const areAddressInputFieldsModified = ([ + "city", + "companyName", + "country", + "countryArea", + "firstName", + "lastName", + "phone", + "postalCode", + "streetAddress1", + "streetAddress2" + ] as Array) + .map(key => formData[key]) + .some(field => field !== ""); + + if (areAddressInputFieldsModified) { + handleSubmitWithAddress(formData as any); + } else { + onSubmit({ + address: null, + customerFirstName: formData.customerFirstName, + customerLastName: formData.customerLastName, + email: formData.email, + note: formData.note + }); + } + }; return (
= () => { } onBack={() => navigate(customerListUrl())} onSubmit={formData => { - const areAddressInputFieldsModified = ([ - "city", - "companyName", - "country", - "countryArea", - "firstName", - "lastName", - "phone", - "postalCode", - "streetAddress1", - "streetAddress2" - ] as Array) - .map(key => formData[key]) - .some(field => field !== ""); - - const address = { - city: formData.city, - cityArea: formData.cityArea, - companyName: formData.companyName, - country: formData.country, - countryArea: formData.countryArea, - firstName: formData.firstName, - lastName: formData.lastName, - phone: formData.phone, - postalCode: formData.postalCode, - streetAddress1: formData.streetAddress1, - streetAddress2: formData.streetAddress2 - }; createCustomer({ variables: { input: { - defaultBillingAddress: areAddressInputFieldsModified - ? transformFormToAddress(address) - : null, - defaultShippingAddress: areAddressInputFieldsModified - ? transformFormToAddress(address) - : null, + defaultBillingAddress: formData.address, + defaultShippingAddress: formData.address, email: formData.email, firstName: formData.customerFirstName, lastName: formData.customerLastName,