From d9073aba39acb971af3c713d0d04c79ebcc91aff Mon Sep 17 00:00:00 2001
From: anovazzi1 <otavio2204@gmail.com>
Date: Thu, 21 Sep 2023 10:56:50 -0300
Subject: [PATCH] refactor(tabsContext.tsx): rename processFlowEdges and
 processFlowNodes functions to processDataFromFlow to improve clarity and
 consistency refactor(tabsContext.tsx): remove console.log statement for old
 edges refactor(tabsContext.tsx): add comments to indicate updating edges
 colors and baseclasses in edges refactor(tabsContext.tsx): add comments to
 indicate updating baseclasses in edges refactor(tabsContext.tsx): add
 comments to indicate adding animation to text type edges
 refactor(tabsContext.tsx): update updateIds function to handle GroupNode type
 nodes refactor(reactflowUtils.ts): update updateIds function to handle
 GroupNode type nodes refactor(reactflowUtils.ts): update updateIds function
 to handle sourceHandle and targetHandle ids in edges

---
 src/frontend/src/contexts/tabsContext.tsx | 13 +++++++------
 src/frontend/src/utils/reactflowUtils.ts  |  8 +++++++-
 2 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/frontend/src/contexts/tabsContext.tsx b/src/frontend/src/contexts/tabsContext.tsx
index 0f52d160d..7a901f8af 100644
--- a/src/frontend/src/contexts/tabsContext.tsx
+++ b/src/frontend/src/contexts/tabsContext.tsx
@@ -168,8 +168,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
         if (!flow.data) {
           return;
         }
-        processFlowEdges(flow);
-        processFlowNodes(flow);
+        processDataFromFlow(flow, false);
       } catch (e) {}
     });
   }
@@ -177,10 +176,10 @@ export function TabsProvider({ children }: { children: ReactNode }) {
   function processFlowEdges(flow: FlowType) {
     if (!flow.data || !flow.data.edges) return;
     if (checkOldEdgesHandles(flow.data.edges)) {
-      console.log("old edges");
       const newEdges = updateEdgesHandleIds(flow.data);
       flow.data.edges = newEdges;
     }
+    //update edges colors
     flow.data.edges.forEach((edge) => {
       edge.className = "";
       edge.style = { stroke: "#555" };
@@ -208,6 +207,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
       if (Object.keys(template["template"]).length > 0) {
         updateDisplay_name(node, template);
         updateNodeBaseClasses(node, template);
+        //update baseclasses in edges
         updateNodeEdges(flow, node, template);
         updateNodeDescription(node, template);
         updateNodeTemplate(node, template);
@@ -523,14 +523,15 @@ export function TabsProvider({ children }: { children: ReactNode }) {
     }
   };
 
-  const processDataFromFlow = (flow: FlowType) => {
+  const processDataFromFlow = (flow: FlowType, refreshIds = true) => {
     let data = flow?.data ? flow.data : null;
     if (data) {
       processFlowEdges(flow);
       processFlowNodes(flow);
+      //add animation to text type edges
       updateEdges(data.edges);
-      updateNodes(data.nodes, data.edges);
-      updateIds(data, getNodeId); // Assuming updateIds is defined elsewhere
+      // updateNodes(data.nodes, data.edges);
+      if (refreshIds) updateIds(data, getNodeId); // Assuming updateIds is defined elsewhere
     }
 
     return data;
diff --git a/src/frontend/src/utils/reactflowUtils.ts b/src/frontend/src/utils/reactflowUtils.ts
index 0a2e3eb95..3c55432a8 100644
--- a/src/frontend/src/utils/reactflowUtils.ts
+++ b/src/frontend/src/utils/reactflowUtils.ts
@@ -163,7 +163,7 @@ export function updateIds(
 
   newFlow.nodes.forEach((node: NodeType) => {
     // Generate a unique node ID
-    let newId = getNodeId(node.data.type);
+    let newId = getNodeId(node.data.node?.flow ? "GroupNode" : node.data.type);
     idsMap[node.id] = newId;
     node.id = newId;
     node.data.id = newId;
@@ -180,6 +180,9 @@ export function updateIds(
       ...sourceHandleObject,
       id: edge.source,
     });
+    if (edge.data?.sourceHandle?.id) {
+      edge.data.sourceHandle.id = edge.source;
+    }
     const targetHandleObject: targetHandleType = scapeJSONParse(
       edge.targetHandle!
     );
@@ -187,6 +190,9 @@ export function updateIds(
       ...targetHandleObject,
       id: edge.target,
     });
+    if (edge.data?.targetHandle?.id) {
+      edge.data.targetHandle.id = edge.target;
+    }
     edge.id =
       "reactflow__edge-" +
       edge.source +