From 3f0b999266ffd735ddf7e3e3d7f8a97bf9f48033 Mon Sep 17 00:00:00 2001
From: Lucas Oliveira <lucas.edu.oli@hotmail.com>
Date: Sun, 10 Dec 2023 01:47:53 -0300
Subject: [PATCH] added setTimeout to fix state not being updated at Prompt

---
 .../components/parameterComponent/index.tsx   | 29 +++++-----
 src/frontend/src/utils/reactflowUtils.ts      | 54 +++++++++----------
 2 files changed, 42 insertions(+), 41 deletions(-)

diff --git a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
index d11499aeb..1c9c892b4 100644
--- a/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
+++ b/src/frontend/src/CustomNodes/GenericNode/components/parameterComponent/index.tsx
@@ -179,19 +179,22 @@ export default function ParameterComponent({
     }
     renderTooltips();
     let flow = flows.find((flow) => flow.id === tabId);
-    if (reactFlowInstance && flow && flow.data) {
-      cleanEdges({
-        flow: {
-          edges: flow.data!.edges,
-          nodes: flow.data!.nodes,
-        },
-        updateEdge: (edge) => {
-          reactFlowInstance.setEdges(edge);
-          updateNodeInternals(data.id);
-        },
-      });
-      updateFlow(flow);
-    }
+    setTimeout(() => {
+      //timeout necessary because ReactFlow updates are not async
+      if (reactFlowInstance && flow && flow.data) {
+        cleanEdges({
+          flow: {
+            edges: flow.data!.edges,
+            nodes: flow.data!.nodes,
+          },
+          updateEdge: (edge) => {
+            reactFlowInstance.setEdges(edge);
+            updateNodeInternals(data.id);
+          },
+        });
+        updateFlow(flow);
+      }
+    }, 50);
   };
 
   const [errorDuplicateKey, setErrorDuplicateKey] = useState(false);
diff --git a/src/frontend/src/utils/reactflowUtils.ts b/src/frontend/src/utils/reactflowUtils.ts
index 100d0c936..c8b7120a8 100644
--- a/src/frontend/src/utils/reactflowUtils.ts
+++ b/src/frontend/src/utils/reactflowUtils.ts
@@ -41,37 +41,35 @@ export function cleanEdges({
     const targetNode = nodes.find((node) => node.id === edge.target);
     if (!sourceNode || !targetNode) {
       newEdges = newEdges.filter((edg) => edg.id !== edge.id);
+      return;
     }
     // check if the source and target handle still exists
-    if (sourceNode && targetNode) {
-      const sourceHandle = edge.sourceHandle; //right
-      const targetHandle = edge.targetHandle; //left
-      if (targetHandle) {
-        const targetHandleObject: targetHandleType =
-          scapeJSONParse(targetHandle);
-        const field = targetHandleObject.fieldName;
-        const id: targetHandleType = {
-          type: targetNode.data.node!.template[field]?.type,
-          fieldName: field,
-          id: targetNode.data.id,
-          inputTypes: targetNode.data.node!.template[field]?.input_types,
-        };
-        if (targetNode.data.node!.template[field]?.proxy) {
-          id.proxy = targetNode.data.node!.template[field]?.proxy;
-        }
-        if (scapedJSONStringfy(id) !== targetHandle) {
-          newEdges = newEdges.filter((e) => e.id !== edge.id);
-        }
+    const sourceHandle = edge.sourceHandle; //right
+    const targetHandle = edge.targetHandle; //left
+    if (targetHandle) {
+      const targetHandleObject: targetHandleType = scapeJSONParse(targetHandle);
+      const field = targetHandleObject.fieldName;
+      const id: targetHandleType = {
+        type: targetNode.data.node!.template[field]?.type,
+        fieldName: field,
+        id: targetNode.data.id,
+        inputTypes: targetNode.data.node!.template[field]?.input_types,
+      };
+      if (targetNode.data.node!.template[field]?.proxy) {
+        id.proxy = targetNode.data.node!.template[field]?.proxy;
       }
-      if (sourceHandle) {
-        const id: sourceHandleType = {
-          id: sourceNode.data.id,
-          baseClasses: sourceNode.data.node!.base_classes,
-          dataType: sourceNode.data.type,
-        };
-        if (scapedJSONStringfy(id) !== sourceHandle) {
-          newEdges = newEdges.filter((e) => e.id !== edge.id);
-        }
+      if (scapedJSONStringfy(id) !== targetHandle) {
+        newEdges = newEdges.filter((e) => e.id !== edge.id);
+      }
+    }
+    if (sourceHandle) {
+      const id: sourceHandleType = {
+        id: sourceNode.data.id,
+        baseClasses: sourceNode.data.node!.base_classes,
+        dataType: sourceNode.data.type,
+      };
+      if (scapedJSONStringfy(id) !== sourceHandle) {
+        newEdges = newEdges.filter((e) => e.id !== edge.id);
       }
     }
   });