diff --git a/src/user/UserForm.tsx b/src/user/UserForm.tsx index 07fb997612..55327626a3 100644 --- a/src/user/UserForm.tsx +++ b/src/user/UserForm.tsx @@ -21,7 +21,10 @@ export type UserFormProps = { save: (user: UserRepresentation) => void; }; -export const UserForm = ({ form, save }: UserFormProps) => { +export const UserForm = ({ + form: { handleSubmit, register, errors, watch, control }, + save, +}: UserFormProps) => { const { t } = useTranslation("users"); const { realm } = useRealm(); @@ -32,6 +35,8 @@ export const UserForm = ({ form, save }: UserFormProps) => { const [selected, setSelected] = useState([]); const history = useHistory(); + const watchUsernameInput = watch("username"); + const requiredUserActionsOptions = [ {t("configureOTP")} @@ -58,7 +63,7 @@ export const UserForm = ({ form, save }: UserFormProps) => { return ( @@ -66,24 +71,25 @@ export const UserForm = ({ form, save }: UserFormProps) => { label={t("username")} fieldId="kc-username" isRequired - validated={form.errors.username ? "error" : "default"} + validated={errors.username ? "error" : "default"} helperTextInvalid={t("common:required")} > + { ( { { { ( { { name="required-user-actions" defaultValue={["0"]} typeAheadAriaLabel="Select an action" - control={form.control} + control={control} render={() => (