From 1921979035d5aca57f907eacfe48ce1c8bac4fc7 Mon Sep 17 00:00:00 2001
From: jlandowner <jlandowner8@gmail.com>
Date: Tue, 2 Jul 2024 00:24:57 +0900
Subject: [PATCH] UserAddonForm: Add validation that required addons are
 enabled

---
 .../src/views/organisms/UserActionDialog.tsx  | 49 ++++++++++++++-----
 .../organisms/UserAddonsChangeDialog.tsx      | 49 ++++++++++++++-----
 2 files changed, 74 insertions(+), 24 deletions(-)

diff --git a/web/dashboard-ui/src/views/organisms/UserActionDialog.tsx b/web/dashboard-ui/src/views/organisms/UserActionDialog.tsx
index abaad209..50e441a2 100644
--- a/web/dashboard-ui/src/views/organisms/UserActionDialog.tsx
+++ b/web/dashboard-ui/src/views/organisms/UserActionDialog.tsx
@@ -289,6 +289,7 @@ export const UserCreateConfirmDialog: React.VFC<{
       title="Create?"
       user={user}
       defaultOpenUserAddon={true}
+      onClose={onClose}
       actions={
         <DialogActions>
           <Button onClick={onClose} color="primary">
@@ -404,19 +405,43 @@ export const UserCreateDialog: React.VFC<{ onClose: () => void }> = ({
       <form
         onSubmit={handleSubmit((inp: Inputs) => {
           console.log(inp);
-          const userAddons = inp.addons
-            .filter((v) => v.enable || v.template.isDefaultUserAddon)
-            .map((inpAddon) => {
-              const vars: { [key: string]: string } = {};
-              inpAddon.vars.forEach((v, i) => {
-                vars[inpAddon.template.requiredVars?.[i].varName!] = v;
-              });
-              return {
-                template: inpAddon.template.name,
-                vars: vars,
-                clusterScoped: inpAddon.template.isClusterScope,
-              };
+
+          const enabled = inp.addons.filter(
+            (v) => v.enable || v.template.isDefaultUserAddon
+          );
+
+          // check required addons are enabled
+          for (const hasDeps of enabled.filter(
+            (v) => v.template.requiredUseraddons.length > 0
+          )) {
+            for (const req of hasDeps.template.requiredUseraddons) {
+              if (enabled.findIndex((v) => v.template.name === req) < 0) {
+                setError(
+                  `addons.${inp.addons.findIndex(
+                    (v) => v.template.name === hasDeps.template.name
+                  )}.enable`,
+                  {
+                    message: `Required: ${hasDeps.template.requiredUseraddons.join(
+                      ", "
+                    )}`,
+                  }
+                );
+                return;
+              }
+            }
+          }
+
+          const userAddons = enabled.map((inpAddon) => {
+            const vars: { [key: string]: string } = {};
+            inpAddon.vars.forEach((v, i) => {
+              vars[inpAddon.template.requiredVars?.[i].varName!] = v;
             });
+            return {
+              template: inpAddon.template.name,
+              vars: vars,
+              clusterScoped: inpAddon.template.isClusterScope,
+            };
+          });
           const protoUserAddons = userAddons.map((ua) => new UserAddon(ua));
           console.log("protoUserAddons", protoUserAddons);
 
diff --git a/web/dashboard-ui/src/views/organisms/UserAddonsChangeDialog.tsx b/web/dashboard-ui/src/views/organisms/UserAddonsChangeDialog.tsx
index 4dd2540d..9f35dbcc 100644
--- a/web/dashboard-ui/src/views/organisms/UserAddonsChangeDialog.tsx
+++ b/web/dashboard-ui/src/views/organisms/UserAddonsChangeDialog.tsx
@@ -51,6 +51,7 @@ export const UserAddonChangeDialog: React.FC<{
     watch,
     control,
     formState: { errors },
+    setError,
   } = useForm<Inputs>({
     defaultValues: {},
   });
@@ -84,19 +85,43 @@ export const UserAddonChangeDialog: React.FC<{
       <form
         onSubmit={handleSubmit(async (inp: Inputs) => {
           console.log(inp);
-          const userAddons = inp.addons
-            .filter((v) => v.enable || v.template.isDefaultUserAddon)
-            .map((inpAddon) => {
-              const vars: { [key: string]: string } = {};
-              inpAddon.vars.forEach((v, i) => {
-                vars[inpAddon.template.requiredVars?.[i].varName!] = v;
-              });
-              return {
-                template: inpAddon.template.name,
-                vars: vars,
-                clusterScoped: inpAddon.template.isClusterScope,
-              };
+
+          const enabled = inp.addons.filter(
+            (v) => v.enable || v.template.isDefaultUserAddon
+          );
+
+          // check required addons are enabled
+          for (const hasDeps of enabled.filter(
+            (v) => v.template.requiredUseraddons.length > 0
+          )) {
+            for (const req of hasDeps.template.requiredUseraddons) {
+              if (enabled.findIndex((v) => v.template.name === req) < 0) {
+                setError(
+                  `addons.${inp.addons.findIndex(
+                    (v) => v.template.name === hasDeps.template.name
+                  )}.enable`,
+                  {
+                    message: `Required: ${hasDeps.template.requiredUseraddons.join(
+                      ", "
+                    )}`,
+                  }
+                );
+                return;
+              }
+            }
+          }
+
+          const userAddons = enabled.map((inpAddon) => {
+            const vars: { [key: string]: string } = {};
+            inpAddon.vars.forEach((v, i) => {
+              vars[inpAddon.template.requiredVars?.[i].varName!] = v;
             });
+            return {
+              template: inpAddon.template.name,
+              vars: vars,
+              clusterScoped: inpAddon.template.isClusterScope,
+            };
+          });
           const protoUserAddons = userAddons.map((ua) => new UserAddon(ua));
           console.log("protoUserAddons", protoUserAddons);