Fixed adding

src/frontend/src/components/cardComponent/index.tsx

@@ -1,5 +1,4 @@
 import { useContext, useState } from "react";
-import { useNavigate } from "react-router-dom";
 import { alertContext } from "../../contexts/alertContext";
 import { FlowsContext } from "../../contexts/flowsContext";
 import { StoreContext } from "../../contexts/storeContext";
@@ -45,17 +44,22 @@ export default function CollectionCardComponent({
 
   const name = data.is_component ? "Component" : "Flow";
 
-  const navigate = useNavigate();
-
   function handleInstall() {
     setLoading(true);
     getComponent(data.id).then((res) => {
       const newFlow = cloneFLowWithParent(res, res.id, data.is_component);
-      addFlow(true, newFlow).then((id) => {
+      addFlow(true, newFlow)
-        setSuccessData({ title: `${name} Installed` });
+        .then((id) => {
-        setLoading(false);
+          setSuccessData({ title: `${name} Installed` });
-        if (!data.is_component) navigate("/flow/" + id);
+          setLoading(false);
-      });
+        })
+        .catch((error) => {
+          setLoading(false);
+          setErrorData({
+            title: `There was an error installing the ${name}`,
+            list: [error["response"]["data"]["detail"]],
+          });
+        });
     });
   }
 
@@ -70,26 +74,19 @@ export default function CollectionCardComponent({
       } else {
         setLikes_count((prev) => prev - 1);
       }
-      console.log(data.id);
       postLikeComponent(data.id)
         .then((response) => {
           setLoadingLike(false);
-          setLikes_count(response.likes_count);
+          setLikes_count(response.data.likes_count);
-          setLiked_by_user(response.liked_by_user);
+          setLiked_by_user(response.data.liked_by_user);
         })
         .catch((error) => {
           setLoadingLike(false);
           setLikes_count(tempNum);
           setLiked_by_user(temp);
-          if (error.response.status === 403 || error.response.status === 401) {
+
-            setValidApiKey(false);
+          setValidApiKey(false);
-          } else {
+          console.error(error);
-            console.error(error);
-            setErrorData({
-              title: `Error liking ${name}.`,
-              list: [error["response"]["data"]["detail"]],
-            });
-          }
         });
     }
   }

src/frontend/src/contexts/flowsContext.tsx

@@ -554,16 +554,17 @@ export function FlowsProvider({ children }: { children: ReactNode }) {
   };
 
   const updateEdges = (edges: Edge[]) => {
-    edges.forEach((edge) => {
+    if (edges)
-      const targetHandleObject: targetHandleType = scapeJSONParse(
+      edges.forEach((edge) => {
-        edge.targetHandle!
+        const targetHandleObject: targetHandleType = scapeJSONParse(
-      );
+          edge.targetHandle!
-      edge.className =
+        );
-        (targetHandleObject.type === "Text"
+        edge.className =
-          ? "stroke-gray-800 "
+          (targetHandleObject.type === "Text"
-          : "stroke-gray-900 ") + " stroke-connection";
+            ? "stroke-gray-800 "
-      edge.animated = targetHandleObject.type === "Text";
+            : "stroke-gray-900 ") + " stroke-connection";
-    });
+        edge.animated = targetHandleObject.type === "Text";
+      });
   };
 
   const updateNodes = (nodes: Node[], edges: Edge[]) => {

src/frontend/src/controllers/API/index.ts

@@ -789,16 +789,6 @@ export async function getStoreTags() {
   }
 }
 
-export async function postLikeComponent(componentId: string) {
+export const postLikeComponent = (componentId: string) => {
-  try {
+  return api.post(`${BASE_URL_API}store/users/likes/${componentId}`);
-    const res = await api.post(
+};
-      `${BASE_URL_API}store/users/likes/${componentId}`
-    );
-    if (res.status === 200) {
-      return res.data;
-    }
-  } catch (error) {
-    console.log("Error:", error);
-    throw error;
-  }
-}

src/frontend/src/utils/reactflowUtils.ts

@@ -163,46 +163,50 @@ export function updateIds(
 ) {
   let idsMap = {};
 
-  newFlow.nodes.forEach((node: NodeType) => {
+  if (newFlow.nodes)
-    // Generate a unique node ID
+    newFlow.nodes.forEach((node: NodeType) => {
-    let newId = getNodeId(node.data.node?.flow ? "GroupNode" : node.data.type);
+      // Generate a unique node ID
-    idsMap[node.id] = newId;
+      let newId = getNodeId(
-    node.id = newId;
+        node.data.node?.flow ? "GroupNode" : node.data.type
-    node.data.id = newId;
+      );
-    // Add the new node to the list of nodes in state
+      idsMap[node.id] = newId;
-  });
+      node.id = newId;
+      node.data.id = newId;
+      // Add the new node to the list of nodes in state
+    });
 
-  newFlow.edges.forEach((edge: Edge) => {
+  if (newFlow.edges)
-    edge.source = idsMap[edge.source];
+    newFlow.edges.forEach((edge: Edge) => {
-    edge.target = idsMap[edge.target];
+      edge.source = idsMap[edge.source];
-    const sourceHandleObject: sourceHandleType = scapeJSONParse(
+      edge.target = idsMap[edge.target];
-      edge.sourceHandle!
+      const sourceHandleObject: sourceHandleType = scapeJSONParse(
-    );
+        edge.sourceHandle!
-    edge.sourceHandle = scapedJSONStringfy({
+      );
-      ...sourceHandleObject,
+      edge.sourceHandle = scapedJSONStringfy({
-      id: edge.source,
+        ...sourceHandleObject,
+        id: edge.source,
+      });
+      if (edge.data?.sourceHandle?.id) {
+        edge.data.sourceHandle.id = edge.source;
+      }
+      const targetHandleObject: targetHandleType = scapeJSONParse(
+        edge.targetHandle!
+      );
+      edge.targetHandle = scapedJSONStringfy({
+        ...targetHandleObject,
+        id: edge.target,
+      });
+      if (edge.data?.targetHandle?.id) {
+        edge.data.targetHandle.id = edge.target;
+      }
+      edge.id =
+        "reactflow__edge-" +
+        edge.source +
+        edge.sourceHandle +
+        "-" +
+        edge.target +
+        edge.targetHandle;
     });
-    if (edge.data?.sourceHandle?.id) {
-      edge.data.sourceHandle.id = edge.source;
-    }
-    const targetHandleObject: targetHandleType = scapeJSONParse(
-      edge.targetHandle!
-    );
-    edge.targetHandle = scapedJSONStringfy({
-      ...targetHandleObject,
-      id: edge.target,
-    });
-    if (edge.data?.targetHandle?.id) {
-      edge.data.targetHandle.id = edge.target;
-    }
-    edge.id =
-      "reactflow__edge-" +
-      edge.source +
-      edge.sourceHandle +
-      "-" +
-      edge.target +
-      edge.targetHandle;
-  });
   return idsMap;
 }