Flow can now be built from a starting node or from an end node

src/frontend/src/CustomNodes/GenericNode/index.tsx

@@ -509,7 +509,7 @@ export default function GenericNode({
                         if (buildStatus === BuildStatus.BUILDING || isBuilding)
                           return;
                         setValidationStatus(null);
-                        buildFlow({ nodeId: data.id });
+                        buildFlow({ stopNodeId: data.id });
                       }}
                       className="generic-node-status-position flex items-center justify-center"
                     >

src/frontend/src/components/IOview/index.tsx

@@ -70,7 +70,10 @@ export default function IOView({ children, open, setOpen }): JSX.Element {
     setLockChat(true);
     setChatValue("");
     for (let i = 0; i < count; i++) {
-      await buildFlow({ input_value: chatValue }).catch((err) => {
+      await buildFlow({
+        input_value: chatValue,
+        startNodeId: chatInput?.id,
+      }).catch((err) => {
         console.error(err);
         setLockChat(false);
       });
@@ -273,7 +276,7 @@ export default function IOView({ children, open, setOpen }): JSX.Element {
             )}
 
             {haveChat ? (
-              <div className="flex h-full flex-grow min-w-96">
+              <div className="flex h-full min-w-96 flex-grow">
                 {selectedViewField && (
                   <div
                     className={cn(

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

@@ -856,13 +856,16 @@ export async function requestLogout() {
 
 export async function getVerticesOrder(
   flowId: string,
-  nodeId?: string | null
+  startNodeId?: string | null,
+  stopNodeId?: string | null
 ): Promise<AxiosResponse<VerticesOrderTypeAPI>> {
   // nodeId is optional and is a query parameter
   // if nodeId is not provided, the API will return all vertices
   const config = {};
-  if (nodeId) {
-    config["params"] = { stop_component_id: nodeId };
+  if (stopNodeId) {
+    config["params"] = { stop_component_id: stopNodeId };
+  } else if (startNodeId) {
+    config["params"] = { start_component_id: startNodeId };
   }
   return await api.get(`${BASE_URL_API}build/${flowId}/vertices`, config);
 }

src/frontend/src/stores/flowStore.ts

@@ -416,10 +416,12 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
     });
   },
   buildFlow: async ({
-    nodeId,
+    startNodeId,
+    stopNodeId,
     input_value,
   }: {
-    nodeId?: string;
+    startNodeId?: string;
+    stopNodeId?: string;
     input_value?: string;
   }) => {
     get().setIsBuilding(true);
@@ -480,11 +482,13 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
     await buildVertices({
       input_value,
       flowId: currentFlow!.id,
-      nodeId,
+      startNodeId,
+      stopNodeId,
       onGetOrderSuccess: () => {
         setNoticeData({ title: "Running components" });
       },
       onBuildComplete: () => {
+        const nodeId = startNodeId || stopNodeId;
         if (nodeId) {
           setSuccessData({
             title: `${

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

@@ -90,10 +90,13 @@ export type FlowStoreType = {
   onConnect: (connection: Connection) => void;
   unselectAll: () => void;
   buildFlow: ({
-    nodeId,
+    startNodeId,
+    stopNodeId,
     input_value,
   }: {
     nodeId?: string;
+    startNodeId?: string;
+    stopNodeId?: string;
     input_value?: string;
   }) => Promise<void>;
   getFlow: () => { nodes: Node[]; edges: Edge[]; viewport: Viewport };

src/frontend/src/utils/buildUtils.ts

@@ -8,7 +8,8 @@ import { VertexBuildTypeAPI } from "../types/api";
 type BuildVerticesParams = {
   flowId: string; // Assuming FlowType is the type for your flow
   input_value?: any; // Replace any with the actual type if it's not any
-  nodeId?: string | null; // Assuming nodeId is of type string, and it's optional
+  startNodeId?: string | null; // Assuming nodeId is of type string, and it's optional
+  stopNodeId?: string | null; // Assuming nodeId is of type string, and it's optional
   onGetOrderSuccess?: () => void;
   onBuildUpdate?: (
     data: VertexBuildTypeAPI,
@@ -43,7 +44,8 @@ function getInactiveVertexData(vertexId: string): VertexBuildTypeAPI {
 
 export async function updateVerticesOrder(
   flowId: string,
-  nodeId: string | null
+  startNodeId?: string | null,
+  stopNodeId?: string | null
 ): Promise<{
   verticesLayers: string[][];
   verticesIds: string[];
@@ -53,7 +55,7 @@ export async function updateVerticesOrder(
     const setErrorData = useAlertStore.getState().setErrorData;
     let orderResponse;
     try {
-      orderResponse = await getVerticesOrder(flowId, nodeId);
+      orderResponse = await getVerticesOrder(flowId, startNodeId, stopNodeId);
     } catch (error: any) {
       console.log(error);
       setErrorData({
@@ -95,7 +97,8 @@ export async function updateVerticesOrder(
 export async function buildVertices({
   flowId,
   input_value,
-  nodeId = null,
+  startNodeId,
+  stopNodeId,
   onGetOrderSuccess,
   onBuildUpdate,
   onBuildComplete,
@@ -104,9 +107,13 @@ export async function buildVertices({
   validateNodes,
 }: BuildVerticesParams) {
   let verticesBuild = useFlowStore.getState().verticesBuild;
-
-  if (!verticesBuild || nodeId) {
-    verticesBuild = await updateVerticesOrder(flowId, nodeId);
+  // if startNodeId and stopNodeId are provided
+  // something is wrong
+  if (startNodeId && stopNodeId) {
+    return;
+  }
+  if (!verticesBuild || startNodeId || stopNodeId) {
+    verticesBuild = await updateVerticesOrder(flowId, startNodeId, stopNodeId);
   }
 
   const verticesIds = verticesBuild?.verticesIds!;