Refactor buildUtils to handle activated vertices

src/frontend/src/stores/flowStore.ts

@@ -223,12 +223,10 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
       selection.nodes.some((node) => node.data.type === "ChatInput") &&
       checkChatInput(get().nodes)
     ) {
-      useAlertStore
+      useAlertStore.getState().setErrorData({
-        .getState()
+        title: "Error pasting components",
-        .setErrorData({
+        list: ["You can only have one ChatInput component in the flow"],
-          title: "Error pasting components",
+      });
-          list: ["You can only have one ChatInput component in the flow"],
-        });
       return;
     }
     let minimumX = Infinity;
@@ -451,6 +449,9 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
       if (vertexBuildData && vertexBuildData.inactivated_vertices) {
         get().removeFromVerticesBuild(vertexBuildData.inactivated_vertices);
       }
+      if (vertexBuildData && vertexBuildData.activated_vertices) {
+        get().addToVerticesBuild(vertexBuildData.activated_vertices);
+      }
       get().addDataToFlowPool(
         { ...vertexBuildData, buildId },
         vertexBuildData.id
@@ -507,6 +508,16 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
     set({ verticesBuild: vertices });
   },
   verticesBuild: null,
+  addToVerticesBuild: (vertices: string[]) => {
+    const verticesBuild = get().verticesBuild;
+    if (!verticesBuild) return;
+    set({
+      verticesBuild: {
+        ...verticesBuild,
+        verticesIds: [...verticesBuild.verticesIds, ...vertices],
+      },
+    });
+  },
   removeFromVerticesBuild: (vertices: string[]) => {
     const verticesBuild = get().verticesBuild;
     if (!verticesBuild) return;

src/frontend/src/types/api/index.ts

@@ -141,6 +141,7 @@ export type VerticesOrderTypeAPI = {
 export type VertexBuildTypeAPI = {
   id: string;
   inactivated_vertices: Array<string> | null;
+  activated_vertices: Array<string> | null;
   valid: boolean;
   params: string;
   data: VertexDataTypeAPI;

src/frontend/src/types/zustand/flow/index.ts

@@ -105,6 +105,7 @@ export type FlowStoreType = {
       runId: string;
     } | null
   ) => void;
+  addToVerticesBuild: (vertices: string[]) => void;
   removeFromVerticesBuild: (vertices: string[]) => void;
   verticesBuild: {
     verticesIds: string[];

src/frontend/src/utils/buildUtils.ts

@@ -32,6 +32,7 @@ function getInactiveVertexData(vertexId: string): VertexBuildTypeAPI {
     data: inactiveData,
     params: "Inactive",
     inactivated_vertices: null,
+    activated_vertices: null,
     valid: false,
     timestamp: new Date().toISOString(),
   };
@@ -110,7 +111,7 @@ export async function buildVertices({
   if (!verticesBuild || nodeId) {
     verticesBuild = await updateVerticesOrder(flowId, nodeId);
   }
-  const verticesIds = verticesBuild?.verticesIds!;
+  let verticesIds = verticesBuild?.verticesIds!;
   const verticesLayers = verticesBuild?.verticesLayers!;
   const verticesOrder = verticesBuild?.verticesOrder!;
   const runId = verticesBuild?.runId!;
@@ -128,26 +129,75 @@ export async function buildVertices({
 
   useFlowStore.getState().updateBuildStatus(verticesIds, BuildStatus.TO_BUILD);
   useFlowStore.getState().setIsBuilding(true);
+  let dynamicVerticesLayers: Array<Array<string>> = [...verticesLayers];
+
+  const handleBuildUpdate = (data: VertexBuildTypeAPI, status: BuildStatus) => {
+    // Handle activated vertices
+    console.log("handleBuildUpdate", data, status);
+    if (data.activated_vertices && data.activated_vertices.length > 0) {
+      // Logic to determine the correct placement for activated vertices in dynamicVerticesLayers
+      // For simplicity, this example adds them to the next layer
+      // const nextLayerIndex = i + 1; i doesnt exist in this scope
+      // we don't want to add the activated vertices to the last layer
+      // because these vertices should be built right away
+      const thisVertexLayer = dynamicVerticesLayers.findIndex((layer) =>
+        layer.includes(data.id)
+      );
+      const nextLayerIndex = thisVertexLayer + 1;
+      console.log("nextLayerIndex", nextLayerIndex);
+      console.log("dynamicVerticesLayers", dynamicVerticesLayers);
+      if (dynamicVerticesLayers[nextLayerIndex]) {
+        // If the next layer exists, add the activated vertices to it
+        // dynamicVerticesLayers[nextLayerIndex] = dynamicVerticesLayers[
+        //   nextLayerIndex
+        // ].concat(data.activated_vertices);
+        // instead of adding them all at once, add them one by one
+        // add one per layer and if the next layer doesn't exist, create it
+
+        for (const vertex of data.activated_vertices) {
+          console.log("vertex", vertex);
+          if (dynamicVerticesLayers[nextLayerIndex].includes(vertex)) {
+            continue;
+          } else if (dynamicVerticesLayers[nextLayerIndex].length > 0) {
+            dynamicVerticesLayers[nextLayerIndex].push(vertex);
+          } else {
+            dynamicVerticesLayers[nextLayerIndex] = [vertex];
+          }
+          console.log("dynamicVerticesLayers", dynamicVerticesLayers);
+        }
+      } else {
+        dynamicVerticesLayers.push(data.activated_vertices);
+        console.log(dynamicVerticesLayers);
+      }
+    }
+    if (onBuildUpdate) onBuildUpdate(data, status, runId);
+  };
 
   // Set each vertex state to building
   const buildResults: Array<boolean> = [];
-  for (const layer of verticesLayers) {
+  for (let i = 0; i < dynamicVerticesLayers.length; i++) {
+    console.log(dynamicVerticesLayers);
+    const layer = dynamicVerticesLayers[i];
     if (onBuildStart) onBuildStart(layer);
     for (const id of layer) {
       // Check if id is in the list of inactive nodes
-      if (!verticesIds.includes(id) && onBuildUpdate) {
+      // useFlowStore because it gets updated constantly
+      if (
+        !useFlowStore.getState().verticesBuild?.verticesIds.includes(id) &&
+        onBuildUpdate
+      ) {
         // If it is, skip building and set the state to inactive
+        console.log("inactive", id);
         onBuildUpdate(getInactiveVertexData(id), BuildStatus.INACTIVE, runId);
         buildResults.push(false);
         continue;
       }
+
       await buildVertex({
         flowId,
         id,
         input_value,
-        onBuildUpdate: (data: VertexBuildTypeAPI, status: BuildStatus) => {
+        onBuildUpdate: handleBuildUpdate,
-          if (onBuildUpdate) onBuildUpdate(data, status, runId);
-        },
         onBuildError,
         verticesIds,
         buildResults,