From 2660fe40ddf8d62a12f5e6acbabbb8bd316ee268 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tomasz=20Szyma=C5=84ski?= <lime129@gmail.com>
Date: Tue, 3 Dec 2019 10:17:01 +0100
Subject: [PATCH 1/2] Fixed error cleanup when switching product variants

---
 src/products/views/ProductVariant.tsx | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/products/views/ProductVariant.tsx b/src/products/views/ProductVariant.tsx
index 317ec0c6b..f7f914575 100644
--- a/src/products/views/ProductVariant.tsx
+++ b/src/products/views/ProductVariant.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useState } from "react";
 import { useIntl } from "react-intl";
 
 import placeholderImg from "@assets/images/placeholder255x255.png";
@@ -43,6 +43,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
       require={["productVariant"]}
     >
       {({ data, loading }) => {
+        const [errors, setErrors] = useState([]);
         const variant = data ? data.productVariant : undefined;
         const handleBack = () => navigate(productUrl(productId));
         const handleDelete = () => {
@@ -54,8 +55,10 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
           navigate(productUrl(productId));
         };
         const handleUpdate = (data: VariantUpdate) => {
-          if (!maybe(() => data.productVariantUpdate.productErrors.length)) {
+          if (!data.productVariantUpdate.productErrors.length) {
             notify({ text: intl.formatMessage(commonMessages.savedChanges) });
+          } else {
+            setErrors(data.productVariantUpdate.productErrors);
           }
         };
 
@@ -107,12 +110,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
                 <>
                   <WindowTitle title={maybe(() => data.productVariant.name)} />
                   <ProductVariantPage
-                    errors={maybe(
-                      () =>
-                        updateVariant.opts.data.productVariantUpdate
-                          .productErrors,
-                      []
-                    )}
+                    errors={errors}
                     saveButtonBarState={formTransitionState}
                     loading={disableFormSave}
                     placeholderImage={placeholderImg}
@@ -146,6 +144,7 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
                     }}
                     onVariantClick={variantId => {
                       navigate(productVariantEditUrl(productId, variantId));
+                      setErrors([]);
                     }}
                   />
                   <ProductVariantDeleteDialog

From 3f7be053a6b58b9eb2cb5b8b54b2bba777527e87 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tomasz=20Szyma=C5=84ski?= <lime129@gmail.com>
Date: Tue, 3 Dec 2019 13:26:07 +0100
Subject: [PATCH 2/2] Added useEffect so error fix will work when browser
 history changes

---
 src/products/views/ProductVariant.tsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/products/views/ProductVariant.tsx b/src/products/views/ProductVariant.tsx
index f7f914575..5ace13fb2 100644
--- a/src/products/views/ProductVariant.tsx
+++ b/src/products/views/ProductVariant.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { useIntl } from "react-intl";
 
 import placeholderImg from "@assets/images/placeholder255x255.png";
@@ -35,6 +35,10 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
   const navigate = useNavigator();
   const notify = useNotifier();
   const intl = useIntl();
+  const [errors, setErrors] = useState([]);
+  useEffect(() => {
+    setErrors([]);
+  }, [variantId]);
 
   return (
     <TypedProductVariantQuery
@@ -43,7 +47,6 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
       require={["productVariant"]}
     >
       {({ data, loading }) => {
-        const [errors, setErrors] = useState([]);
         const variant = data ? data.productVariant : undefined;
         const handleBack = () => navigate(productUrl(productId));
         const handleDelete = () => {
@@ -144,7 +147,6 @@ export const ProductVariant: React.FC<ProductUpdateProps> = ({
                     }}
                     onVariantClick={variantId => {
                       navigate(productVariantEditUrl(productId, variantId));
-                      setErrors([]);
                     }}
                   />
                   <ProductVariantDeleteDialog