From 533ad0e333301d4f990bfb49ef3e5cccc9e2fe39 Mon Sep 17 00:00:00 2001
From: Nar Cuenca <narc.ph@gmail.com>
Date: Tue, 9 Jan 2024 12:03:41 +0800
Subject: [PATCH] fix: reset button loading status when field has errors

---
 .../content-editor/src/app/views/ItemEdit/ItemEdit.js    | 6 +++++-
 .../components/ItemEditHeader/ItemEditHeaderActions.tsx  | 8 ++++++++
 .../views/ItemEdit/components/ItemEditHeader/index.tsx   | 9 +++++++--
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/apps/content-editor/src/app/views/ItemEdit/ItemEdit.js b/src/apps/content-editor/src/app/views/ItemEdit/ItemEdit.js
index c62d3dd436..06cd8d21d6 100644
--- a/src/apps/content-editor/src/app/views/ItemEdit/ItemEdit.js
+++ b/src/apps/content-editor/src/app/views/ItemEdit/ItemEdit.js
@@ -352,7 +352,11 @@ export default function ItemEdit() {
               component="section"
               sx={{ display: "flex", flexDirection: "column", height: "100%" }}
             >
-              <ItemEditHeader onSave={save} saving={saving} />
+              <ItemEditHeader
+                onSave={save}
+                saving={saving}
+                hasError={Object.keys(fieldErrors)?.length}
+              />
               <Switch>
                 <Route
                   exact
diff --git a/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/ItemEditHeaderActions.tsx b/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/ItemEditHeaderActions.tsx
index 76e0f4960f..62b4a4c6ab 100644
--- a/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/ItemEditHeaderActions.tsx
+++ b/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/ItemEditHeaderActions.tsx
@@ -55,11 +55,13 @@ const ITEM_STATES = {
 type ItemEditHeaderActionsProps = {
   saving: boolean;
   onSave: () => void;
+  hasError: boolean;
 };
 
 export const ItemEditHeaderActions = ({
   saving,
   onSave,
+  hasError,
 }: ItemEditHeaderActionsProps) => {
   const { modelZUID, itemZUID } = useParams<{
     modelZUID: string;
@@ -183,6 +185,12 @@ export const ItemEditHeaderActions = ({
     }
   }, [item, scheduleAfterSave, saving, activePublishing]);
 
+  useEffect(() => {
+    if (!saving && hasError) {
+      setPublishAfterSave(false);
+    }
+  }, [hasError, saving]);
+
   return (
     <>
       <Tooltip
diff --git a/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/index.tsx b/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/index.tsx
index 74c3112547..2387cd9ecb 100644
--- a/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/index.tsx
+++ b/src/apps/content-editor/src/app/views/ItemEdit/components/ItemEditHeader/index.tsx
@@ -77,8 +77,9 @@ export type ContentItemWithDirtyAndPublishing = ContentItem & {
 type HeaderProps = {
   saving: boolean;
   onSave: () => void;
+  hasError: boolean;
 };
-export const ItemEditHeader = ({ saving, onSave }: HeaderProps) => {
+export const ItemEditHeader = ({ saving, onSave, hasError }: HeaderProps) => {
   const { modelZUID, itemZUID } = useParams<{
     modelZUID: string;
     itemZUID: string;
@@ -164,7 +165,11 @@ export const ItemEditHeader = ({ saving, onSave }: HeaderProps) => {
                 <ContentCopyRounded fontSize="small" />
               </IconButton>
               {type !== "dataset" && <PreviewMenu />}
-              <ItemEditHeaderActions saving={saving} onSave={onSave} />
+              <ItemEditHeaderActions
+                saving={saving}
+                onSave={onSave}
+                hasError={hasError}
+              />
             </Box>
           </Box>
           <Box