Merge pull request #245 from edewit/issue-230

TextArea is child of controller

src/clients/ClientSettings.tsx

@@ -87,7 +87,7 @@ export const ClientSettings = ({ form, save }: ClientSettingsProps) => {
             hasNoPaddingTop
           >
             <Controller
-              name="alwaysDisplayInConsole"
+              name="attributes.display_on_consent_screen"
               defaultValue={false}
               control={form.control}
               render={({ onChange, value }) => (
@@ -107,7 +107,7 @@ export const ClientSettings = ({ form, save }: ClientSettingsProps) => {
           >
             <TextArea
               id="kc-consent-screen-text"
-              name="consentText"
+              name="attributes.consent_screen_text"
               ref={form.register}
             />
           </FormGroup>

src/components/form-access/FormAccess.tsx

@@ -86,6 +86,7 @@ export const FormAccess = ({
             children,
           } as any);
         }
+
         return cloneElement(
           child,
           child.type === FormGroup ||

src/realm-roles/RealmRoleForm.tsx

@@ -16,12 +16,7 @@ import {
   ValidatedOptions,
 } from "@patternfly/react-core";
 import { useTranslation } from "react-i18next";
-import {
-  Controller,
-  SubmitHandler,
-  useForm,
-  UseFormMethods,
-} from "react-hook-form";
+import { SubmitHandler, useForm, UseFormMethods } from "react-hook-form";
 
 import RoleRepresentation from "keycloak-admin/lib/defs/roleRepresentation";
 import { FormAccess } from "../components/form-access/FormAccess";
@@ -63,25 +58,31 @@ const RoleForm = ({ form, save, editMode }: RoleFormType) => {
           isReadOnly={editMode}
         />
       </FormGroup>
-      <FormGroup label={t("description")} fieldId="kc-description">
-        <Controller
+      <FormGroup
+        label={t("description")}
+        fieldId="kc-description"
+        validated={
+          form.errors.description
+            ? ValidatedOptions.error
+            : ValidatedOptions.default
+        }
+        helperTextInvalid={form.errors.description?.message}
+      >
+        <TextArea
           name="description"
-          defaultValue=""
-          control={form.control}
-          rules={{ maxLength: 255 }}
-          render={({ onChange, value }) => (
-            <TextArea
-              type="text"
-              validated={
-                form.errors.description
-                  ? ValidatedOptions.error
-                  : ValidatedOptions.default
-              }
-              id="kc-role-description"
-              value={value}
-              onChange={onChange}
-            />
-          )}
+          ref={form.register({
+            maxLength: {
+              value: 255,
+              message: t("common:maxLength", { length: 255 }),
+            },
+          })}
+          type="text"
+          validated={
+            form.errors.description
+              ? ValidatedOptions.error
+              : ValidatedOptions.default
+          }
+          id="kc-role-description"
         />
       </FormGroup>
       <ActionGroup>