feat: updated depends on field to adhere the specification

services/frontend/src/components/modals/docker-compose/service/General.tsx

@@ -222,14 +222,38 @@ const General = () => {
             title: "Depends on",
             fields: (index: number): TFinalFormField[] => [
               {
-                id: `dependsOn[${index}]`,
+                id: `dependsOn[${index}].serviceName`,
                 type: "text",
-                name: `dependsOn[${index}]`,
+                name: `dependsOn[${index}].serviceName`,
                 placeholder: "Service name",
-                required: false
+                required: true
+              },
+              {
+                id: `dependsOn[${index}].condition`,
+                type: "toggle",
+                name: `dependsOn[${index}].condition`,
+                label: "Condition",
+                required: true,
+                options: [
+                  {
+                    value: "service_started",
+                    text: "Service started"
+                  },
+                  {
+                    value: "service_healthy",
+                    text: "Service healthy"
+                  },
+                  {
+                    value: "service_completed_successfully",
+                    text: "Service completed successfully"
+                  }
+                ]
               }
             ],
-            newValue: ""
+            newValue: {
+              serviceName: "",
+              condition: "service_started"
+            }
           },
           {
             id: "networks",

services/frontend/src/components/modals/docker-compose/service/form-utils.ts

@@ -278,9 +278,43 @@ export const validationSchema = yup.object({
       key: yup.string().required("Key is required"),
       value: yup.string()
     })
-  )
+  ),
+  dependsOn: yup.array(
+    yup.object({
+      serviceName: yup.string().required("Service name is required"),
+      condition: yup
+        .string()
+        .oneOf(
+          [
+            "service_started",
+            "service_healthy",
+            "service_completed_successfully"
+          ],
+          "Condition should be one of: service_started, service_healthy, or service_completed_successfully."
+        )
+    })
+  ),
+  workingDir: yup.string()
 });
 
+const extractDependsOn = (object: string[] | any) => {
+  if (!object) {
+    return object;
+  }
+
+  if (Array.isArray(object)) {
+    return object.map((item) => ({
+      serviceName: item,
+      condition: "service_started"
+    }));
+  }
+
+  return Object.keys(object).map((key) => ({
+    serviceName: key,
+    condition: object[key].condition
+  }));
+};
+
 export const getInitialValues = (node?: IServiceNodeItem): IEditServiceForm => {
   if (!node) {
     return {
@@ -456,8 +490,7 @@ export const getInitialValues = (node?: IServiceNodeItem): IEditServiceForm => {
             initialValues.deploy.labels
         }
       : initialValues.deploy,
-    dependsOn:
-      (depends_on as string[]) ?? (initialValues.dependsOn as string[]),
+    dependsOn: extractDependsOn(depends_on) ?? initialValues.dependsOn,
     entrypoint: (entrypoint as string) ?? (initialValues.entrypoint as string),
     envFile: (env_file as string) ?? (initialValues.envFile as string),
     imageName,
@@ -606,7 +639,16 @@ export const getFinalValues = (
         }),
         labels: packArrayAsObject(deploy.labels, "key", "value")
       }),
-      depends_on: pruneArray(dependsOn),
+      depends_on: pruneObject(
+        Object.fromEntries(
+          dependsOn.map((item) => [
+            item.serviceName,
+            {
+              condition: item.condition
+            }
+          ])
+        )
+      ),
       entrypoint: pruneString(entrypoint),
       env_file: pruneString(envFile),
       image: pruneString(

services/frontend/src/types/index.ts

@@ -149,11 +149,15 @@ export interface IService {
   credential_spec: KeyValPair;
   depends_on:
     | string[]
-    | {
-        [key: string]: {
-          condition: string;
-        };
-      };
+    | Record<
+        string,
+        {
+          condition:
+            | "service_started"
+            | "service_healthy"
+            | "service_completed_successfully";
+        }
+      >;
   deploy?: {
     endpoint_mode?: "vip" | "dnsrr";
     labels?: string[] | Record<string, string>;
@@ -480,7 +484,13 @@ export interface IEditServiceForm {
     key: string;
     value: string;
   }[];
-  dependsOn: string[];
+  dependsOn: {
+    serviceName: string;
+    condition:
+      | "service_started"
+      | "service_healthy"
+      | "service_completed_successfully";
+  }[];
   workingDir: string;
 }