From cc594aa00c90998d0c11fa27e78fa8a8062854db Mon Sep 17 00:00:00 2001
From: Erik Jan de Wit <erikjan.dewit@gmail.com>
Date: Wed, 20 Apr 2022 16:38:29 +0200
Subject: [PATCH] Added labels for loa properties (#2411)

---
 .../components/ExecutionConfigModal.tsx       | 44 +++++++------------
 src/components/dynamic/labels.ts              |  6 +++
 2 files changed, 22 insertions(+), 28 deletions(-)

diff --git a/src/authentication/components/ExecutionConfigModal.tsx b/src/authentication/components/ExecutionConfigModal.tsx
index 8d3ccc78cb..a49aee2cca 100644
--- a/src/authentication/components/ExecutionConfigModal.tsx
+++ b/src/authentication/components/ExecutionConfigModal.tsx
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { useForm } from "react-hook-form";
+import { FormProvider, useForm } from "react-hook-form";
 import {
   ActionGroup,
   AlertVariant,
@@ -22,9 +22,11 @@ import type { ExpandableExecution } from "../execution-model";
 import { useAdminClient, useFetch } from "../../context/auth/AdminClient";
 import { useAlerts } from "../../components/alert/Alerts";
 import { HelpItem } from "../../components/help-enabler/HelpItem";
+import { DynamicComponents } from "../../components/dynamic/DynamicComponents";
 
 type ExecutionConfigModalForm = {
-  [index: string]: string;
+  alias: string;
+  config: { [index: string]: string };
 };
 
 type ExecutionConfigModalProps = {
@@ -43,12 +45,13 @@ export const ExecutionConfigModal = ({
   const [configDescription, setConfigDescription] =
     useState<AuthenticatorConfigInfoRepresentation>();
 
+  const form = useForm<ExecutionConfigModalForm>();
   const {
     register,
     setValue,
     handleSubmit,
     formState: { errors },
-  } = useForm<ExecutionConfigModalForm>();
+  } = form;
 
   const setupForm = (
     configDescription: AuthenticatorConfigInfoRepresentation,
@@ -57,7 +60,7 @@ export const ExecutionConfigModal = ({
     configDescription.properties!.map(
       (property: ConfigPropertyRepresentation) => {
         setValue(
-          property.name!,
+          `config.${property.name}`,
           config?.config?.[property.name!] || property.defaultValue || ""
         );
       }
@@ -98,20 +101,20 @@ export const ExecutionConfigModal = ({
       if (config) {
         const newConfig = {
           ...config,
-          config: changedConfig,
+          config: changedConfig.config,
         };
         await adminClient.authenticationManagement.updateConfig(newConfig);
-        setConfig(newConfig);
+        setConfig({ ...newConfig.config });
       } else {
         const newConfig = {
           id: execution.id!,
           alias: changedConfig.alias,
-          config: changedConfig,
+          config: changedConfig.config,
         };
         const { id } = await adminClient.authenticationManagement.createConfig(
           newConfig
         );
-        setConfig({ ...newConfig, id });
+        setConfig({ ...newConfig.config, id, alias: newConfig.alias });
       }
       addAlert(t("configSaveSuccess"), AlertVariant.success);
       setShow(false);
@@ -166,26 +169,11 @@ export const ExecutionConfigModal = ({
                 }
               />
             </FormGroup>
-            {configDescription.properties?.map((property) => (
-              <FormGroup
-                key={property.name}
-                label={property.label}
-                fieldId={property.name!}
-                labelIcon={
-                  <HelpItem
-                    helpText={property.helpText}
-                    fieldLabelId={property.name!}
-                  />
-                }
-              >
-                <TextInput
-                  type="text"
-                  id={property.name}
-                  name={property.name}
-                  ref={register}
-                />
-              </FormGroup>
-            ))}
+            <FormProvider {...form}>
+              <DynamicComponents
+                properties={configDescription.properties || []}
+              />
+            </FormProvider>
             <ActionGroup>
               <Button data-testid="save" variant="primary" type="submit">
                 {t("common:save")}
diff --git a/src/components/dynamic/labels.ts b/src/components/dynamic/labels.ts
index 32dda35c72..cf01bf7fc4 100644
--- a/src/components/dynamic/labels.ts
+++ b/src/components/dynamic/labels.ts
@@ -7,6 +7,12 @@ export default {
     roleGroup: "Use a realm role from:",
     clientGroup: "Use a client role from:",
     selectGroup: "Select group",
+    "loa-condition-level": "Level of Authentication (LoA)",
+    "loa-condition-level.tooltip":
+      "The number value, usually 1 or bigger, which specifies level of authentication. Condition evaluates to true if user does not yet have this authentication level and this level is requested. This level of authentication will be set to the session after the subflow, where this condition is configured, is successfully finished.",
+    "loa-max-age": "Max Age",
+    "loa-max-age.tooltip":
+      "Maximum age in seconds for which this level is considered valid after successful authentication. For example if this is set to 300 and user authenticated with this level and then tries to authenticate again in less than 300 second, then this level will be automatically considered as authenticated without need of user to re-authenticate. If it is set to 0, then the authenticated level is valid just for this authentication and next authentication will always need to re-authenticate. Default value is 10 hours, which is same as default SSO session timeout and it means that level is valid until end of SSO session and user doesn't need to re-authenticate.",
     usermodel: {
       prop: {
         label: "Property",