add colors to borders when building

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

@@ -172,7 +172,15 @@ export default function GenericNode({
         className={classNames(
           selected ? "border border-ring" : "border",
           showNode ? " w-96 rounded-lg" : " w-26 h-26 rounded-full",
-          "generic-node-div"
+          "generic-node-div",
+          data?.build_status === BuildStatus.BUILDED &&
+            validationStatus &&
+            !validationStatus.valid
+            ? "border-none ring ring-red-300"
+            : "",
+          data?.build_status === BuildStatus.BUILDING
+            ? "  border-none ring"
+            : ""
         )}
       >
         {data.node?.beta && showNode && (
@@ -384,7 +392,8 @@ export default function GenericNode({
                 <div>
                   <Tooltip
                     title={
-                      isBuilding ? (
+                      isBuilding ||
+                      data?.build_status === BuildStatus.BUILDING ? (
                         <span>Building...</span>
                       ) : !validationStatus ? (
                         <span className="flex">
@@ -409,7 +418,7 @@ export default function GenericNode({
                     }
                   >
                     <div className="generic-node-status-position flex items-center justify-center">
-                      {data?.build_status === BuildStatus.TO_BUILD ? (
+                      {data?.build_status === BuildStatus.BUILDING ? (
                         <>
                           <IconComponent
                             name="Square"

src/frontend/src/stores/flowStore.ts

@@ -381,7 +381,9 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
         }
       },
       onBuildUpdate: handleBuildUpdate,
-      onBuildError: (title, list) => {
+      onBuildError: (title, list, idList) => {
+        useFlowStore.getState().updateBuildStatus(idList, BuildStatus.BUILDED);
+
         setErrorData({ list, title });
       },
       onBuildStart: (idList) => {

src/frontend/src/utils/buildUtils.ts

@@ -10,7 +10,7 @@ type BuildVerticesParams = {
   onProgressUpdate?: (progress: number) => void; // Replace number with the actual type if it's not a number
   onBuildUpdate?: (data: any) => void; // Replace any with the actual type of data
   onBuildComplete?: (allNodesValid: boolean) => void;
-  onBuildError?: (title, list) => void;
+  onBuildError?: (title, list, idList: string[]) => void;
   onBuildStart?: (idList: string[]) => void;
 };
 
@@ -62,7 +62,11 @@ export async function buildVertices({
             let data = {};
             if (!buildData.valid) {
               if (onBuildError) {
-                onBuildError("Error Building Component", [buildData.params]);
+                onBuildError(
+                  "Error Building Component",
+                  [buildData.params],
+                  verticesIds
+                );
               }
             }
             data[buildData.id] = buildData;
@@ -72,10 +76,14 @@ export async function buildVertices({
         } catch (error) {
           if (onBuildError) {
             console.log(error);
-            onBuildError("Error Building Component", [
-              (error as AxiosError<any>).response?.data?.detail ??
-                "Unknown Error",
-            ]);
+            onBuildError(
+              "Error Building Component",
+              [
+                (error as AxiosError<any>).response?.data?.detail ??
+                  "Unknown Error",
+              ],
+              verticesIds
+            );
           }
         }
       })