Merge pull request #384 from ConductionNL/development

Dev to main update
ConductionNL · Jul 12, 2024 · 9c45823 · 9c45823
2 parents 9787760 + c23e85a
commit 9c45823
Show file tree

Hide file tree

Showing 12 changed files with 304 additions and 40 deletions.
diff --git a/README.md b/README.md
@@ -21,3 +21,4 @@ With docker:
 ## Work instructions
 
 1. [User management](/documentation/work-instructions/user-management.md)
+
diff --git a/pwa/package.json b/pwa/package.json
@@ -65,3 +65,4 @@
     "typescript": "^5.4.4"
   }
 }
+
diff --git a/pwa/src/templates/templateParts/actionsForm/ActionFormTemplate.tsx b/pwa/src/templates/templateParts/actionsForm/ActionFormTemplate.tsx
@@ -18,6 +18,7 @@ import { CodeEditor } from "../../../components/codeEditor/CodeEditor";
 import { translateDate } from "../../../services/dateFormat";
 import { StatusTag } from "../../../components/statusTag/StatusTag";
 import { formatDateTime } from "../../../services/dateTime";
+import { useUser } from "../../../hooks/user";
 
 export const formId: string = "action-form";
 
@@ -44,6 +45,9 @@ export const ActionFormTemplate: React.FC<ActionFormTemplateProps> = ({ action }
   const _useCronjob = useCronjob(queryClient);
   const getCronjobs = _useCronjob.getAll();
 
+  const _useUsers = useUser(queryClient);
+  const getUsers = _useUsers.getAll();
+
   const {
     register,
     handleSubmit,
@@ -81,6 +85,7 @@ export const ActionFormTemplate: React.FC<ActionFormTemplateProps> = ({ action }
       listens: data.listens?.map((listener: any) => listener.value),
       throws: data.throws?.map((_throw: any) => _throw.value),
       class: data.class.value,
+      userId: data.userId?.value ?? null,
       conditions: actionConditionsFieldValue ? JSON.parse(actionConditionsFieldValue) : [],
       configuration: {},
     };
@@ -96,7 +101,16 @@ export const ActionFormTemplate: React.FC<ActionFormTemplateProps> = ({ action }
   };
 
   const handleSetFormValues = (): void => {
-    const basicFields: string[] = ["reference", "name", "description", "priority", "async", "isLockable", "isEnabled"];
+    const basicFields: string[] = [
+      "reference",
+      "version",
+      "name",
+      "description",
+      "priority",
+      "async",
+      "isLockable",
+      "isEnabled",
+    ];
     basicFields.forEach((field) => setValue(field, action[field]));
 
     setActionConditionsFieldValue(JSON.stringify(action["conditions"], null, 2));
@@ -131,10 +145,24 @@ export const ActionFormTemplate: React.FC<ActionFormTemplateProps> = ({ action }
     }
   };
 
+  const setUserIdLabel = (user: any): string => {
+    return user.name + (" - " + user?.organization?.name);
+  };
+
   React.useEffect(() => {
     action && handleSetFormValues();
   }, [action]);
 
+  React.useEffect(() => {
+    if (!action) return;
+    if (!getUsers.isSuccess) return;
+    getUsers?.data.map((user) => {
+      if (user?.id === action?.userId) {
+        setValue("userId", { label: setUserIdLabel(user), value: user.id });
+      }
+    });
+  }, [action, getUsers.isSuccess]);
+
   return (
     <div className={styles.container}>
       <form onSubmit={handleSubmit(onSubmit)} id={formId}>
@@ -166,6 +194,19 @@ export const ActionFormTemplate: React.FC<ActionFormTemplateProps> = ({ action }
                     </FormFieldInput>
                   </FormField>
 
+                  <FormField>
+                    <FormFieldInput>
+                      <FormFieldLabel>{t("Version")}</FormFieldLabel>
+                      <InputText
+                        {...{ register, errors }}
+                        name="version"
+                        disabled={isLoading.actionForm}
+                        defaultValue={action?.version ?? "0.0.0"}
+                        ariaLabel={t("Enter version")}
+                      />
+                    </FormFieldInput>
+                  </FormField>
+
                   <FormField>
                     <FormFieldInput>
                       <FormFieldLabel>{t("Name")}</FormFieldLabel>
@@ -261,6 +302,28 @@ export const ActionFormTemplate: React.FC<ActionFormTemplateProps> = ({ action }
                     </FormFieldInput>
                   </FormField>
 
+                  <FormField>
+                    <FormFieldInput>
+                      <FormFieldLabel>{t("User ID")}</FormFieldLabel>
+
+                      {getUsers.isLoading && <Skeleton height="50px" />}
+
+                      {getUsers.isSuccess && (
+                        <SelectSingle
+                          options={getUsers.data.map((user: any) => ({
+                            label: setUserIdLabel(user),
+                            value: user.id,
+                          }))}
+                          name="userId"
+                          {...{ register, errors, control }}
+                          disabled={isLoading.actionForm}
+                          ariaLabel={t("Select an user as userId")}
+                          isClearable={true}
+                        />
+                      )}
+                    </FormFieldInput>
+                  </FormField>
+
                   <FormField>
                     <FormFieldInput>
                       <FormFieldLabel>{t("async")}</FormFieldLabel>

diff --git a/pwa/src/templates/templateParts/applicationsForm/ApplicationsFormTemplate.tsx b/pwa/src/templates/templateParts/applicationsForm/ApplicationsFormTemplate.tsx
@@ -99,6 +99,18 @@ export const ApplicationsFormTemplate: React.FC<ApplicationFormTemplateProps> =
               />
             </FormFieldInput>
           </FormField>
+          <FormField>
+            <FormFieldInput>
+              <FormFieldLabel>{t("Version")}</FormFieldLabel>
+              <InputText
+                {...{ register, errors }}
+                name="version"
+                disabled={isLoading.applicationForm}
+                defaultValue={application?.version ?? "0.0.0"}
+                ariaLabel={t("Enter version")}
+              />
+            </FormFieldInput>
+          </FormField>
 
           <FormField>
             <FormFieldInput>
@@ -124,18 +136,6 @@ export const ApplicationsFormTemplate: React.FC<ApplicationFormTemplateProps> =
               />
             </FormFieldInput>
           </FormField>
-          <FormField>
-            <FormFieldInput>
-              <FormFieldLabel>{t("Version")}</FormFieldLabel>
-              <InputText
-                {...{ register, errors }}
-                name="version"
-                disabled={isLoading.applicationForm}
-                defaultValue={application?.version ?? "0.0.0"}
-                ariaLabel={t("Enter version")}
-              />
-            </FormFieldInput>
-          </FormField>
           <FormField>
             <FormFieldInput>
               <FormFieldLabel>{t("Domains")}</FormFieldLabel>

diff --git a/pwa/src/templates/templateParts/cronjobsForm/CronjobsFormTemplate.tsx b/pwa/src/templates/templateParts/cronjobsForm/CronjobsFormTemplate.tsx
@@ -9,9 +9,10 @@ import { useCronjob } from "../../../hooks/cronjob";
 import { validateStringAsCronTab } from "../../../services/stringValidations";
 import { predefinedSubscriberEvents } from "../../../data/predefinedSubscriberEvents";
 import Skeleton from "react-loading-skeleton";
-import { SelectCreate } from "@conduction/components/lib/components/formFields/select/select";
+import { SelectCreate, SelectSingle } from "@conduction/components/lib/components/formFields/select/select";
 import { useIsLoadingContext } from "../../../context/isLoading";
 import { enrichValidation } from "../../../services/enrichReactHookFormValidation";
+import { useUser } from "../../../hooks/user";
 
 interface CronjobFormTemplateProps {
   cronjob?: any;
@@ -28,6 +29,9 @@ export const CronjobFormTemplate: React.FC<CronjobFormTemplateProps> = ({ cronjo
   const _useCronjobs = useCronjob(queryClient);
   const createOrEditCronjob = _useCronjobs.createOrEdit(cronjob?.id);
 
+  const _useUsers = useUser(queryClient);
+  const getUsers = _useUsers.getAll();
+
   const {
     register,
     handleSubmit,
@@ -48,13 +52,14 @@ export const CronjobFormTemplate: React.FC<CronjobFormTemplateProps> = ({ cronjo
     const payload = {
       ...data,
       throws: data.throws?.map((_throw: any) => _throw.value),
+      userId: data.userId?.value ?? null,
     };
 
     createOrEditCronjob.mutate({ payload, id: cronjob?.id });
   };
 
   const handleSetFormValues = (): void => {
-    const basicFields: string[] = ["name", "description", "crontab", "isEnabled"];
+    const basicFields: string[] = ["reference", "version", "name", "description", "crontab", "isEnabled"];
     basicFields.forEach((field) => setValue(field, cronjob[field]));
 
     setValue(
@@ -63,15 +68,53 @@ export const CronjobFormTemplate: React.FC<CronjobFormTemplateProps> = ({ cronjo
     );
   };
 
+  const setUserIdLabel = (user: any): string => {
+    return user.name + (" - " + user?.organization?.name);
+  };
+
   React.useEffect(() => {
     cronjob && handleSetFormValues();
   }, [cronjob]);
 
+  React.useEffect(() => {
+    if (!cronjob) return;
+    if (!getUsers.isSuccess) return;
+    getUsers?.data.map((user) => {
+      if (user?.id === cronjob?.userId) {
+        setValue("userId", { label: setUserIdLabel(user), value: user.id });
+      }
+    });
+  }, [cronjob, getUsers.isSuccess]);
+
   return (
     <div>
       <form onSubmit={handleSubmit(onSubmit)} id={formId}>
         <div className={styles.gridContainer}>
           <div className={styles.grid}>
+            <FormField>
+              <FormFieldInput>
+                <FormFieldLabel>{t("Reference")}</FormFieldLabel>
+                <InputText
+                  {...{ register, errors }}
+                  name="reference"
+                  disabled={isLoading.cronjobForm}
+                  ariaLabel={t("Enter reference")}
+                />
+              </FormFieldInput>
+            </FormField>
+
+            <FormField>
+              <FormFieldInput>
+                <FormFieldLabel>{t("Version")}</FormFieldLabel>
+                <InputText
+                  {...{ register, errors }}
+                  name="version"
+                  disabled={isLoading.cronjobForm}
+                  defaultValue={cronjob?.version ?? "0.0.0"}
+                  ariaLabel={t("Enter version")}
+                />
+              </FormFieldInput>
+            </FormField>
             <FormField>
               <FormFieldInput>
                 <FormFieldLabel>{t("Name")}</FormFieldLabel>
@@ -128,6 +171,28 @@ export const CronjobFormTemplate: React.FC<CronjobFormTemplateProps> = ({ cronjo
               </FormFieldInput>
             </FormField>
 
+            <FormField>
+              <FormFieldInput>
+                <FormFieldLabel>{t("User ID")}</FormFieldLabel>
+
+                {getUsers.isLoading && <Skeleton height="50px" />}
+
+                {getUsers.isSuccess && (
+                  <SelectSingle
+                    options={getUsers.data.map((user: any) => ({
+                      label: setUserIdLabel(user),
+                      value: user.id,
+                    }))}
+                    name="userId"
+                    {...{ register, errors, control }}
+                    disabled={isLoading.actionForm}
+                    ariaLabel={t("Select an user as userId")}
+                    isClearable={true}
+                  />
+                )}
+              </FormFieldInput>
+            </FormField>
+
             <FormField>
               <FormFieldInput>
                 <FormFieldLabel>{t("isEnabled")}</FormFieldLabel>

diff --git a/pwa/src/templates/templateParts/endpointsForm/EndpointFormTemplate.tsx b/pwa/src/templates/templateParts/endpointsForm/EndpointFormTemplate.tsx
@@ -68,7 +68,7 @@ export const EndpointFormTemplate: React.FC<EndpointFormTemplateProps> = ({ endp
   };
 
   const handleSetFormValues = (): void => {
-    const basicFields: string[] = ["name", "description", "pathRegex", "tag"];
+    const basicFields: string[] = ["reference", "version", "name", "description", "pathRegex", "tag"];
     basicFields.forEach((field) => setValue(field, endpoint[field]));
 
     setValue("path", endpoint.path && endpoint.path.join("/"));
@@ -113,6 +113,30 @@ export const EndpointFormTemplate: React.FC<EndpointFormTemplateProps> = ({ endp
     <form onSubmit={handleSubmit(onSubmit)} id={formId}>
       <div className={styles.gridContainer}>
         <div className={styles.grid}>
+          <FormField>
+            <FormFieldInput>
+              <FormFieldLabel>{t("Reference")}</FormFieldLabel>
+              <InputText
+                {...{ register, errors }}
+                name="reference"
+                disabled={isLoading.endpointForm}
+                ariaLabel={t("Enter reference")}
+              />
+            </FormFieldInput>
+          </FormField>
+
+          <FormField>
+            <FormFieldInput>
+              <FormFieldLabel>{t("Version")}</FormFieldLabel>
+              <InputText
+                {...{ register, errors }}
+                name="version"
+                disabled={isLoading.endpointForm}
+                defaultValue={endpoint?.version ?? "0.0.0"}
+                ariaLabel={t("Enter version")}
+              />
+            </FormFieldInput>
+          </FormField>
           <FormField>
             <FormFieldInput>
               <FormFieldLabel>{t("Name")}</FormFieldLabel>

diff --git a/pwa/src/templates/templateParts/mappingForm/MappingFormTemplate.tsx b/pwa/src/templates/templateParts/mappingForm/MappingFormTemplate.tsx
@@ -105,42 +105,41 @@ export const MappingFormTemplate: React.FC<MappingFormTemplateProps> = ({ mappin
         <div className={styles.grid}>
           <FormField>
             <FormFieldInput>
-              <FormFieldLabel>{t("Name")}</FormFieldLabel>
+              <FormFieldLabel>{t("Reference")}</FormFieldLabel>
               <InputText
                 {...{ register, errors }}
-                name="name"
-                validation={enrichValidation({ required: true })}
+                name="reference"
                 disabled={isLoading.mappingForm}
-                ariaLabel={t("Enter name")}
+                ariaLabel={t("Enter reference")}
               />
             </FormFieldInput>
           </FormField>
-
           <FormField>
             <FormFieldInput>
-              <FormFieldLabel>{t("Reference")}</FormFieldLabel>
+              <FormFieldLabel>{t("Version")}</FormFieldLabel>
               <InputText
                 {...{ register, errors }}
-                name="reference"
+                name="version"
                 disabled={isLoading.mappingForm}
-                ariaLabel={t("Enter reference")}
+                ariaLabel={t("Enter version")}
               />
             </FormFieldInput>
           </FormField>
           <FormField>
             <FormFieldInput>
-              <FormFieldLabel>{t("Version")}</FormFieldLabel>
+              <FormFieldLabel>{t("Name")}</FormFieldLabel>
               <InputText
                 {...{ register, errors }}
-                name="version"
+                name="name"
+                validation={enrichValidation({ required: true })}
                 disabled={isLoading.mappingForm}
-                ariaLabel={t("Enter version")}
+                ariaLabel={t("Enter name")}
               />
             </FormFieldInput>
           </FormField>
           <FormField>
             <FormFieldInput>
-              <FormFieldLabel>{t("Pass Through")}</FormFieldLabel>
+              <FormFieldLabel>{t("Pass through")}</FormFieldLabel>
               <InputCheckbox {...{ register, errors }} label="on" name="passTrough" disabled={isLoading.mappingForm} />
             </FormFieldInput>
           </FormField>

diff --git a/pwa/src/templates/templateParts/propertyForm/EditPropertyFormTemplate.tsx b/pwa/src/templates/templateParts/propertyForm/EditPropertyFormTemplate.tsx
@@ -441,6 +441,7 @@ export const EditPropertyFormTemplate: React.FC<EditPropertyFormTemplateProps> =
                         {...{ register, errors, control }}
                         name="format"
                         options={formatSelectOptions}
+                        isClearable={true}
                         disabled={loading || isImmutable}
                         ariaLabel={t("Select format")}
                       />
Original file line number	Diff line number	Diff line change
Expand Up		@@ -21,3 +21,4 @@ With docker:
		## Work instructions

		1. [User management](/documentation/work-instructions/user-management.md)