TextArea doesn't need to be a child of controller

fixes: #230

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