UI: add update service

pkgs/clan-app/ui/src/routes/Service/Service.tsx

@@ -21,21 +21,32 @@ export const Service = (props: RouteSectionProps) => {
     ctx.setWorldMode("service");
   });
 
-  const handleSubmit: SubmitServiceHandler = async (instance, action) => {
+  const handleClose = () => {
-    console.log("Service submitted", instance, action);
+    console.log("Service closed, navigating back");
+    navigate(buildClanPath(ctx.clanURI), { replace: true });
+    ctx.setWorldMode("select");
+  };
 
-    if (action !== "create") {
+  const handleSubmit: SubmitServiceHandler = async (instance, action) => {
-      console.warn("Updating service instances is not supported yet");
+    let call;
-      return;
+    if (action === "update") {
+      call = client.fetch("set_service_instance", {
+        flake: {
+          identifier: ctx.clanURI,
+        },
+        instance_ref: instance.name,
+        roles: instance.roles,
+      });
+    } else {
+      call = client.fetch("create_service_instance", {
+        flake: {
+          identifier: ctx.clanURI,
+        },
+        module_ref: instance.module,
+        roles: instance.roles,
+      });
     }
 
-    const call = client.fetch("create_service_instance", {
-      flake: {
-        identifier: ctx.clanURI,
-      },
-      module_ref: instance.module,
-      roles: instance.roles,
-    });
     const result = await call.result;
 
     if (result.status === "error") {
@@ -46,13 +57,7 @@ export const Service = (props: RouteSectionProps) => {
       queryKey: clanKey(ctx.clanURI),
     });
 
-    ctx.setWorldMode("select");
+    handleClose();
-  };
-
-  const handleClose = () => {
-    console.log("Service closed, navigating back");
-    navigate(buildClanPath(ctx.clanURI), { replace: true });
-    ctx.setWorldMode("select");
   };
 
   return <ServiceWorkflow handleSubmit={handleSubmit} onClose={handleClose} />;

pkgs/clan-app/ui/src/workflows/Service/Service.tsx

@@ -129,19 +129,21 @@ const ConfigureService = () => {
         // Wait for all queries to be ready
         if (!instances || !machines) return;
         const instance = instances[routerProps.id || routerProps.name];
+        // Init once
+        if (!store.roles) {
+          set("roles", {});
+          if (!instance) {
+            set("action", "create");
+            return;
+          }
 
-        set("roles", {});
+          for (const role of Object.keys(instance.roles || {})) {
-        if (!instance) {
+            // Get Role members
-          set("action", "create");
+            const roleMembers = getRoleMembers(instance, machines, role);
-          return;
+            set("roles", role, roleMembers);
+          }
+          set("action", "update");
         }
-
-        for (const role of Object.keys(instance.roles || {})) {
-          // Get Role members
-          const roleMembers = getRoleMembers(instance, machines, role);
-          set("roles", role, roleMembers);
-        }
-        set("action", "update");
       },
     ),
   );
@@ -360,7 +362,10 @@ const ConfigureRole = () => {
     if (!store.roles) {
       set("roles", {});
     }
-    set("roles", (r) => ({ ...r, [store.currentRole as string]: members() }));
+    set("roles", (r) => ({
+      ...r,
+      [store.currentRole as string]: members(),
+    }));
     stepper.setActiveStep("view:members");
   };