From 32dda2fcd1f28e94d55aa5e5d6401da0c6973441 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Mon, 10 Jun 2024 14:09:29 -0300
Subject: [PATCH] Fixed submit submitting baseModal, fixed state problem on
 Edit Node Modal when closing and opening

---
 src/frontend/src/modals/baseModal/index.tsx   |  4 +-
 .../src/modals/editNodeModal/index.tsx        | 39 ++++++++++---------
 2 files changed, 23 insertions(+), 20 deletions(-)

diff --git a/src/frontend/src/modals/baseModal/index.tsx b/src/frontend/src/modals/baseModal/index.tsx
index 8c9386d79..3ee7788af 100644
--- a/src/frontend/src/modals/baseModal/index.tsx
+++ b/src/frontend/src/modals/baseModal/index.tsx
@@ -86,6 +86,7 @@ const Footer: React.FC<{
     loading?: boolean;
     disabled?: boolean;
     dataTestId?: string;
+    onClick?: () => void;
   };
 }> = ({ children, submit }) => {
   return (
@@ -101,7 +102,8 @@ const Footer: React.FC<{
             </DialogClose>
             <Button
               data-testid={submit.dataTestId}
-              type="submit"
+              type={submit.onClick ? "button" : "submit"}
+              onClick={submit.onClick}
               loading={submit.loading}
             >
               {submit.icon && submit.icon}
diff --git a/src/frontend/src/modals/editNodeModal/index.tsx b/src/frontend/src/modals/editNodeModal/index.tsx
index 79224b718..47ecb4291 100644
--- a/src/frontend/src/modals/editNodeModal/index.tsx
+++ b/src/frontend/src/modals/editNodeModal/index.tsx
@@ -8,6 +8,7 @@ import { NodeDataType } from "../../types/flow";
 import BaseModal from "../baseModal";
 import useColumnDefs from "./hooks/use-column-defs";
 import useRowData from "./hooks/use-row-data";
+import { cloneDeep } from "lodash";
 
 const EditNodeModal = forwardRef(
   (
@@ -26,7 +27,7 @@ const EditNodeModal = forwardRef(
     },
     ref,
   ) => {
-    const myData = useRef(data);
+    const myData = useRef(cloneDeep(data));
 
     const setNode = useFlowStore((state) => state.setNode);
 
@@ -36,6 +37,7 @@ const EditNodeModal = forwardRef(
     }
 
     const handleOnNewValue = (newValue: any, name) => {
+      console.log(newValue);
       myData.current.node!.template[name].value = newValue;
     };
 
@@ -52,7 +54,7 @@ const EditNodeModal = forwardRef(
 
     useEffect(() => {
       if (gridApi && open) {
-        myData.current = data;
+        myData.current = cloneDeep(data);
         gridApi.refreshCells();
       }
     }, [gridApi, open]);
@@ -64,22 +66,7 @@ const EditNodeModal = forwardRef(
     //    }, []);
 
     return (
-      <BaseModal
-        key={data.id}
-        size="medium-tall"
-        open={open}
-        setOpen={setOpen}
-        onSubmit={() => {
-          setNode(data.id, (old) => ({
-            ...old,
-            data: {
-              ...old.data,
-              node: myData.current.node,
-            },
-          }));
-          setOpen(false);
-        }}
-      >
+      <BaseModal key={data.id} size="medium-tall" open={open} setOpen={setOpen}>
         <BaseModal.Trigger>
           <></>
         </BaseModal.Trigger>
@@ -105,7 +92,21 @@ const EditNodeModal = forwardRef(
           </div>
         </BaseModal.Content>
 
-        <BaseModal.Footer submit={{ label: "Save Changes" }} />
+        <BaseModal.Footer
+          submit={{
+            label: "Save Changes",
+            onClick: () => {
+              setNode(data.id, (old) => ({
+                ...old,
+                data: {
+                  ...old.data,
+                  node: myData.current.node,
+                },
+              }));
+              setOpen(false);
+            },
+          }}
+        />
       </BaseModal>
     );
   },