From 8a2f240719a905ea932b3bb3e3102ef713a4eb47 Mon Sep 17 00:00:00 2001 From: dominik-zeglen Date: Wed, 9 Oct 2019 12:52:51 +0200 Subject: [PATCH] Reset form state after closing it --- .../ProductVariantCreateDialog.tsx | 28 +++++++++++++------ 1 file changed, 20 insertions(+), 8 deletions(-) diff --git a/src/products/components/ProductVariantCreateDialog/ProductVariantCreateDialog.tsx b/src/products/components/ProductVariantCreateDialog/ProductVariantCreateDialog.tsx index dcb42c9db..c898e9157 100644 --- a/src/products/components/ProductVariantCreateDialog/ProductVariantCreateDialog.tsx +++ b/src/products/components/ProductVariantCreateDialog/ProductVariantCreateDialog.tsx @@ -8,6 +8,8 @@ import { makeStyles } from "@material-ui/styles"; import React from "react"; import { FormattedMessage } from "react-intl"; +import useModalDialogErrors from "@saleor/hooks/useModalDialogErrors"; +import useModalDialogOpen from "@saleor/hooks/useModalDialogOpen"; import { ProductVariantBulkCreateInput } from "../../../types/globalTypes"; import { createInitialForm, ProductVariantCreateFormData } from "./form"; import ProductVariantCreateContent, { @@ -90,6 +92,7 @@ const ProductVariantCreateDialog: React.FC< const { attributes, defaultPrice, + errors: apiErrors, open, onClose, onSubmit, @@ -125,14 +128,22 @@ const ProductVariantCreateDialog: React.FC< createInitialForm(attributes, defaultPrice) ); - React.useEffect( - () => - dispatchFormDataAction({ - data: createInitialForm(attributes, defaultPrice), - type: "reload" - }), - [attributes.length] - ); + const reloadForm = () => + dispatchFormDataAction({ + data: createInitialForm(attributes, defaultPrice), + type: "reload" + }); + + React.useEffect(reloadForm, [attributes.length]); + + useModalDialogOpen(open, { + onClose: () => { + reloadForm(); + setStep("values"); + } + }); + + const errors = useModalDialogErrors(apiErrors, open); return ( @@ -148,6 +159,7 @@ const ProductVariantCreateDialog: React.FC< attributes={attributes} data={data} dispatchFormDataAction={dispatchFormDataAction} + errors={errors} step={step} onStepClick={step => setStep(step)} />