From 4a7c0436ccd790ed596d2023eeae737a0e44ce36 Mon Sep 17 00:00:00 2001 From: Jon Koops Date: Fri, 8 Apr 2022 14:37:31 +0200 Subject: [PATCH] Move React Hook Form errors to formState (#2412) --- .../components/ExecutionConfigModal.tsx | 8 ++++++-- .../components/modals/AddSubFlowModal.tsx | 7 ++++++- src/authentication/form/NameDescription.tsx | 5 ++++- src/authentication/policies/OtpPolicy.tsx | 3 +-- src/authentication/policies/PolicyRow.tsx | 6 +++++- src/client-scopes/details/ScopeForm.tsx | 13 +++++++++---- src/clients/ClientDescription.tsx | 6 +++++- src/clients/ClientSettings.tsx | 8 ++++++-- src/clients/add/GeneralSettings.tsx | 5 ++++- src/clients/authorization/ResourcesPolicySelect.tsx | 5 ++++- src/clients/authorization/ScopeDetails.tsx | 12 ++++++++---- src/clients/authorization/ScopeSelect.tsx | 6 +++++- src/clients/authorization/policy/Client.tsx | 6 +++++- src/clients/authorization/policy/ClientScope.tsx | 7 ++++++- src/clients/authorization/policy/Group.tsx | 8 +++++++- .../authorization/policy/NameDescription.tsx | 5 ++++- src/clients/authorization/policy/Regex.tsx | 5 ++++- src/clients/authorization/policy/Role.tsx | 7 ++++++- src/clients/authorization/policy/User.tsx | 6 +++++- src/clients/credentials/X509.tsx | 6 +++++- .../initial-access/CreateInitialAccessToken.tsx | 3 +-- src/components/dynamic/RoleComponent.tsx | 6 +++++- src/groups/GroupsModal.tsx | 6 +++++- src/identity-providers/add/DescriptorSettings.tsx | 6 +++++- src/identity-providers/add/DiscoverySettings.tsx | 6 +++++- src/identity-providers/add/OIDCGeneralSettings.tsx | 5 ++++- .../add/OpenIdConnectSettings.tsx | 7 ++++++- src/identity-providers/add/SamlConnectSettings.tsx | 9 +++++++-- src/identity-providers/add/SamlGeneralSettings.tsx | 6 +++++- src/identity-providers/component/ClientIdSecret.tsx | 5 ++++- .../component/DiscoveryEndpointField.tsx | 10 ++++++++-- src/realm-settings/AddMessageBundleModal.tsx | 6 +++++- src/realm-settings/AddUserEmailModal.tsx | 7 ++++++- src/realm-settings/ClientProfileForm.tsx | 3 +-- src/realm-settings/EmailTab.tsx | 2 +- src/realm-settings/NewClientPolicyForm.tsx | 5 ++++- src/realm-settings/security-defences/Time.tsx | 5 ++++- src/realm/add/NewRealmForm.tsx | 9 +++++++-- src/sessions/RevocationModal.tsx | 6 +++++- src/user/UserForm.tsx | 10 ++++++++-- src/user/UserIdPModal.tsx | 8 ++++++-- src/user/user-credentials/ResetPasswordDialog.tsx | 3 +-- 42 files changed, 208 insertions(+), 59 deletions(-) diff --git a/src/authentication/components/ExecutionConfigModal.tsx b/src/authentication/components/ExecutionConfigModal.tsx index 72b214e4ce..8d3ccc78cb 100644 --- a/src/authentication/components/ExecutionConfigModal.tsx +++ b/src/authentication/components/ExecutionConfigModal.tsx @@ -43,8 +43,12 @@ export const ExecutionConfigModal = ({ const [configDescription, setConfigDescription] = useState(); - const { register, errors, setValue, handleSubmit } = - useForm(); + const { + register, + setValue, + handleSubmit, + formState: { errors }, + } = useForm(); const setupForm = ( configDescription: AuthenticatorConfigInfoRepresentation, diff --git a/src/authentication/components/modals/AddSubFlowModal.tsx b/src/authentication/components/modals/AddSubFlowModal.tsx index bf5355b59e..5aab013279 100644 --- a/src/authentication/components/modals/AddSubFlowModal.tsx +++ b/src/authentication/components/modals/AddSubFlowModal.tsx @@ -40,7 +40,12 @@ export const AddSubFlowModal = ({ onCancel, }: AddSubFlowProps) => { const { t } = useTranslation("authentication"); - const { register, control, errors, handleSubmit } = useForm(); + const { + register, + control, + handleSubmit, + formState: { errors }, + } = useForm(); const [open, setOpen] = useState(false); const [openProvider, setOpenProvider] = useState(false); const [formProviders, setFormProviders] = diff --git a/src/authentication/form/NameDescription.tsx b/src/authentication/form/NameDescription.tsx index 871bd99573..f42f029e56 100644 --- a/src/authentication/form/NameDescription.tsx +++ b/src/authentication/form/NameDescription.tsx @@ -12,7 +12,10 @@ import { HelpItem } from "../../components/help-enabler/HelpItem"; export const NameDescription = () => { const { t } = useTranslation("authentication"); - const { register, errors } = useFormContext(); + const { + register, + formState: { errors }, + } = useFormContext(); return ( <> diff --git a/src/authentication/policies/OtpPolicy.tsx b/src/authentication/policies/OtpPolicy.tsx index 93a27d91a6..dbf787e9eb 100644 --- a/src/authentication/policies/OtpPolicy.tsx +++ b/src/authentication/policies/OtpPolicy.tsx @@ -41,10 +41,9 @@ export const OtpPolicy = ({ realm, realmUpdated }: OtpPolicyProps) => { const { control, register, - errors, reset, handleSubmit, - formState: { isDirty }, + formState: { isDirty, errors }, } = useForm({ mode: "onChange" }); const adminClient = useAdminClient(); const { realm: realmName } = useRealm(); diff --git a/src/authentication/policies/PolicyRow.tsx b/src/authentication/policies/PolicyRow.tsx index 62e08c7b3b..8c0e123470 100644 --- a/src/authentication/policies/PolicyRow.tsx +++ b/src/authentication/policies/PolicyRow.tsx @@ -27,7 +27,11 @@ export const PolicyRow = ({ onRemove, }: PolicyRowProps) => { const { t } = useTranslation("authentication"); - const { control, register, errors } = useFormContext(); + const { + control, + register, + formState: { errors }, + } = useFormContext(); return ( { const { t } = useTranslation("client-scopes"); const { t: tc } = useTranslation("clients"); - const { register, control, handleSubmit, errors, setValue } = - useForm({ - defaultValues: { attributes: { "display.on.consent.screen": "true" } }, - }); + const { + register, + control, + handleSubmit, + setValue, + formState: { errors }, + } = useForm({ + defaultValues: { attributes: { "display.on.consent.screen": "true" } }, + }); const { realm } = useRealm(); const providers = useLoginProviders(); diff --git a/src/clients/ClientDescription.tsx b/src/clients/ClientDescription.tsx index f29d6ff680..bab57774cc 100644 --- a/src/clients/ClientDescription.tsx +++ b/src/clients/ClientDescription.tsx @@ -19,7 +19,11 @@ type ClientDescriptionProps = { export const ClientDescription = ({ protocol }: ClientDescriptionProps) => { const { t } = useTranslation("clients"); - const { register, errors, control } = useFormContext(); + const { + register, + control, + formState: { errors }, + } = useFormContext(); return ( { - const { register, control, watch, errors } = - useFormContext(); + const { + register, + control, + watch, + formState: { errors }, + } = useFormContext(); const { t } = useTranslation("clients"); const { realm } = useRealm(); diff --git a/src/clients/add/GeneralSettings.tsx b/src/clients/add/GeneralSettings.tsx index 8800d9a705..23389e90e1 100644 --- a/src/clients/add/GeneralSettings.tsx +++ b/src/clients/add/GeneralSettings.tsx @@ -16,7 +16,10 @@ import { getProtocolName } from "../utils"; export const GeneralSettings = () => { const { t } = useTranslation("clients"); - const { errors, control } = useFormContext(); + const { + control, + formState: { errors }, + } = useFormContext(); const providers = useLoginProviders(); const [open, isOpen] = useState(false); diff --git a/src/clients/authorization/ResourcesPolicySelect.tsx b/src/clients/authorization/ResourcesPolicySelect.tsx index 9ce8121bae..edaaf8250c 100644 --- a/src/clients/authorization/ResourcesPolicySelect.tsx +++ b/src/clients/authorization/ResourcesPolicySelect.tsx @@ -32,7 +32,10 @@ export const ResourcesPolicySelect = ({ const { t } = useTranslation("clients"); const adminClient = useAdminClient(); - const { control, errors } = useFormContext(); + const { + control, + formState: { errors }, + } = useFormContext(); const [items, setItems] = useState([]); const [search, setSearch] = useState(""); const [open, setOpen] = useState(false); diff --git a/src/clients/authorization/ScopeDetails.tsx b/src/clients/authorization/ScopeDetails.tsx index 594bc1ecc3..bead47a3d6 100644 --- a/src/clients/authorization/ScopeDetails.tsx +++ b/src/clients/authorization/ScopeDetails.tsx @@ -35,10 +35,14 @@ export default function ScopeDetails() { const [deleteDialog, toggleDeleteDialog] = useToggle(); const [scope, setScope] = useState(); - const { register, errors, reset, handleSubmit } = - useForm({ - mode: "onChange", - }); + const { + register, + reset, + handleSubmit, + formState: { errors }, + } = useForm({ + mode: "onChange", + }); useFetch( async () => { diff --git a/src/clients/authorization/ScopeSelect.tsx b/src/clients/authorization/ScopeSelect.tsx index beeeb5be58..1884402249 100644 --- a/src/clients/authorization/ScopeSelect.tsx +++ b/src/clients/authorization/ScopeSelect.tsx @@ -20,7 +20,11 @@ export const ScopeSelect = ({ const { t } = useTranslation("clients"); const adminClient = useAdminClient(); - const { control, errors, setValue } = useFormContext(); + const { + control, + setValue, + formState: { errors }, + } = useFormContext(); const [scopes, setScopes] = useState([]); const [search, setSearch] = useState(""); diff --git a/src/clients/authorization/policy/Client.tsx b/src/clients/authorization/policy/Client.tsx index 2508157e74..311f9652c7 100644 --- a/src/clients/authorization/policy/Client.tsx +++ b/src/clients/authorization/policy/Client.tsx @@ -15,7 +15,11 @@ import { useTranslation } from "react-i18next"; export const Client = () => { const { t } = useTranslation("clients"); - const { control, getValues, errors } = useFormContext(); + const { + control, + getValues, + formState: { errors }, + } = useFormContext(); const values: string[] | undefined = getValues("clients"); const [open, setOpen] = useState(false); diff --git a/src/clients/authorization/policy/ClientScope.tsx b/src/clients/authorization/policy/ClientScope.tsx index 61d36f51e9..4530cc64d4 100644 --- a/src/clients/authorization/policy/ClientScope.tsx +++ b/src/clients/authorization/policy/ClientScope.tsx @@ -25,7 +25,12 @@ export type RequiredIdValue = { export const ClientScope = () => { const { t } = useTranslation("clients"); - const { control, getValues, setValue, errors } = useFormContext<{ + const { + control, + getValues, + setValue, + formState: { errors }, + } = useFormContext<{ clientScopes: RequiredIdValue[]; }>(); diff --git a/src/clients/authorization/policy/Group.tsx b/src/clients/authorization/policy/Group.tsx index 9ae1fc8a38..07b2fcc9a2 100644 --- a/src/clients/authorization/policy/Group.tsx +++ b/src/clients/authorization/policy/Group.tsx @@ -24,7 +24,13 @@ export type GroupValue = { export const Group = () => { const { t } = useTranslation("clients"); - const { control, register, getValues, setValue, errors } = useFormContext<{ + const { + control, + register, + getValues, + setValue, + formState: { errors }, + } = useFormContext<{ groups?: GroupValue[]; }>(); const values = getValues("groups"); diff --git a/src/clients/authorization/policy/NameDescription.tsx b/src/clients/authorization/policy/NameDescription.tsx index 4549630bf9..6f775c8769 100644 --- a/src/clients/authorization/policy/NameDescription.tsx +++ b/src/clients/authorization/policy/NameDescription.tsx @@ -16,7 +16,10 @@ type NameDescriptionProps = { export const NameDescription = ({ prefix }: NameDescriptionProps) => { const { t } = useTranslation("clients"); - const { register, errors } = useFormContext(); + const { + register, + formState: { errors }, + } = useFormContext(); return ( <> diff --git a/src/clients/authorization/policy/Regex.tsx b/src/clients/authorization/policy/Regex.tsx index 1f4f58d676..e94d91c838 100644 --- a/src/clients/authorization/policy/Regex.tsx +++ b/src/clients/authorization/policy/Regex.tsx @@ -7,7 +7,10 @@ import { HelpItem } from "../../../components/help-enabler/HelpItem"; export const Regex = () => { const { t } = useTranslation("clients"); - const { register, errors } = useFormContext(); + const { + register, + formState: { errors }, + } = useFormContext(); return ( <> diff --git a/src/clients/authorization/policy/Role.tsx b/src/clients/authorization/policy/Role.tsx index 2d2f18d326..d33e26453e 100644 --- a/src/clients/authorization/policy/Role.tsx +++ b/src/clients/authorization/policy/Role.tsx @@ -20,7 +20,12 @@ import { AddRoleMappingModal } from "../../../components/role-mapping/AddRoleMap export const Role = () => { const { t } = useTranslation("clients"); - const { control, getValues, setValue, errors } = useFormContext<{ + const { + control, + getValues, + setValue, + formState: { errors }, + } = useFormContext<{ roles?: RequiredIdValue[]; }>(); const values = getValues("roles"); diff --git a/src/clients/authorization/policy/User.tsx b/src/clients/authorization/policy/User.tsx index 1cb4ce3db2..e5b02e6f1b 100644 --- a/src/clients/authorization/policy/User.tsx +++ b/src/clients/authorization/policy/User.tsx @@ -15,7 +15,11 @@ import { useTranslation } from "react-i18next"; export const User = () => { const { t } = useTranslation("clients"); - const { control, getValues, errors } = useFormContext(); + const { + control, + getValues, + formState: { errors }, + } = useFormContext(); const values: string[] | undefined = getValues("users"); const [open, setOpen] = useState(false); diff --git a/src/clients/credentials/X509.tsx b/src/clients/credentials/X509.tsx index 270852c04c..e47a3c2af5 100644 --- a/src/clients/credentials/X509.tsx +++ b/src/clients/credentials/X509.tsx @@ -11,7 +11,11 @@ import { HelpItem } from "../../components/help-enabler/HelpItem"; export const X509 = () => { const { t } = useTranslation("clients"); - const { register, control, errors } = useFormContext(); + const { + register, + control, + formState: { errors }, + } = useFormContext(); return ( <> { const { t } = useTranslation("identity-providers"); const { t: th } = useTranslation("identity-providers-help"); - const { register, control, errors } = useFormContext(); + const { + register, + control, + formState: { errors }, + } = useFormContext(); const [namedPolicyDropdownOpen, setNamedPolicyDropdownOpen] = useState(false); const [principalTypeDropdownOpen, setPrincipalTypeDropdownOpen] = useState(false); diff --git a/src/identity-providers/add/DiscoverySettings.tsx b/src/identity-providers/add/DiscoverySettings.tsx index 06fe22fedb..d8f2dcb8d3 100644 --- a/src/identity-providers/add/DiscoverySettings.tsx +++ b/src/identity-providers/add/DiscoverySettings.tsx @@ -19,7 +19,11 @@ type DiscoverySettingsProps = { const Fields = ({ readOnly }: DiscoverySettingsProps) => { const { t } = useTranslation("identity-providers"); - const { register, control, errors } = useFormContext(); + const { + register, + control, + formState: { errors }, + } = useFormContext(); const validateSignature = useWatch({ control: control, diff --git a/src/identity-providers/add/OIDCGeneralSettings.tsx b/src/identity-providers/add/OIDCGeneralSettings.tsx index d7d26e92ad..ac1965ab8e 100644 --- a/src/identity-providers/add/OIDCGeneralSettings.tsx +++ b/src/identity-providers/add/OIDCGeneralSettings.tsx @@ -14,7 +14,10 @@ export const OIDCGeneralSettings = ({ id }: { id: string }) => { const { t } = useTranslation("identity-providers"); const { tab } = useParams(); - const { register, errors } = useFormContext(); + const { + register, + formState: { errors }, + } = useFormContext(); return ( <> diff --git a/src/identity-providers/add/OpenIdConnectSettings.tsx b/src/identity-providers/add/OpenIdConnectSettings.tsx index 74bd8a57ac..8378805b82 100644 --- a/src/identity-providers/add/OpenIdConnectSettings.tsx +++ b/src/identity-providers/add/OpenIdConnectSettings.tsx @@ -17,7 +17,12 @@ export const OpenIdConnectSettings = () => { const adminClient = useAdminClient(); const { realm } = useRealm(); - const { setValue, errors, setError, clearErrors } = useFormContext(); + const { + setValue, + setError, + clearErrors, + formState: { errors }, + } = useFormContext(); const setupForm = (result: any) => { Object.keys(result).map((k) => setValue(`config.${k}`, result[k])); diff --git a/src/identity-providers/add/SamlConnectSettings.tsx b/src/identity-providers/add/SamlConnectSettings.tsx index 0edde418f3..b8e0a20417 100644 --- a/src/identity-providers/add/SamlConnectSettings.tsx +++ b/src/identity-providers/add/SamlConnectSettings.tsx @@ -20,8 +20,13 @@ export const SamlConnectSettings = () => { const adminClient = useAdminClient(); const { realm } = useRealm(); - const { setValue, register, errors, setError, clearErrors } = - useFormContext(); + const { + setValue, + register, + setError, + clearErrors, + formState: { errors }, + } = useFormContext(); const setupForm = (result: IdentityProviderRepresentation) => { Object.entries(result).map(([key, value]) => diff --git a/src/identity-providers/add/SamlGeneralSettings.tsx b/src/identity-providers/add/SamlGeneralSettings.tsx index 27ea5978d2..93d1b8788d 100644 --- a/src/identity-providers/add/SamlGeneralSettings.tsx +++ b/src/identity-providers/add/SamlGeneralSettings.tsx @@ -20,7 +20,11 @@ export const SamlGeneralSettings = ({ id }: { id: string }) => { const { realm } = useRealm(); const { tab } = useParams(); - const { register, errors, watch } = useFormContext(); + const { + register, + watch, + formState: { errors }, + } = useFormContext(); const alias = watch("alias"); diff --git a/src/identity-providers/component/ClientIdSecret.tsx b/src/identity-providers/component/ClientIdSecret.tsx index cc7d880d94..0db953f190 100644 --- a/src/identity-providers/component/ClientIdSecret.tsx +++ b/src/identity-providers/component/ClientIdSecret.tsx @@ -15,7 +15,10 @@ export const ClientIdSecret = ({ }) => { const { t } = useTranslation("identity-providers"); - const { register, errors } = useFormContext(); + const { + register, + formState: { errors }, + } = useFormContext(); return ( <> diff --git a/src/identity-providers/component/DiscoveryEndpointField.tsx b/src/identity-providers/component/DiscoveryEndpointField.tsx index 3c262045c9..b6afca3608 100644 --- a/src/identity-providers/component/DiscoveryEndpointField.tsx +++ b/src/identity-providers/component/DiscoveryEndpointField.tsx @@ -22,8 +22,14 @@ export const DiscoveryEndpointField = ({ const adminClient = useAdminClient(); - const { setValue, register, errors, setError, watch, clearErrors } = - useFormContext(); + const { + setValue, + register, + setError, + watch, + clearErrors, + formState: { errors }, + } = useFormContext(); const discoveryUrl = watch("discoveryEndpoint"); const [discovery, setDiscovery] = useState(true); diff --git a/src/realm-settings/AddMessageBundleModal.tsx b/src/realm-settings/AddMessageBundleModal.tsx index fd57ce88b6..d0d1a34bf8 100644 --- a/src/realm-settings/AddMessageBundleModal.tsx +++ b/src/realm-settings/AddMessageBundleModal.tsx @@ -30,7 +30,11 @@ export const AddMessageBundleModal = ({ save, }: AddMessageBundleModalProps) => { const { t } = useTranslation("realm-settings"); - const { register, errors, handleSubmit } = useForm(); + const { + register, + handleSubmit, + formState: { errors }, + } = useForm(); return ( { const { t } = useTranslation("groups"); const adminClient = useAdminClient(); const { whoAmI } = useWhoAmI(); - const { register, errors, handleSubmit, watch } = useForm({ + const { + register, + handleSubmit, + watch, + formState: { errors }, + } = useForm({ defaultValues: { email: "" }, }); diff --git a/src/realm-settings/ClientProfileForm.tsx b/src/realm-settings/ClientProfileForm.tsx index 0be180b07f..f6317666ef 100644 --- a/src/realm-settings/ClientProfileForm.tsx +++ b/src/realm-settings/ClientProfileForm.tsx @@ -54,8 +54,7 @@ export default function ClientProfileForm() { handleSubmit, setValue, register, - errors, - formState: { isDirty }, + formState: { isDirty, errors }, } = useForm({ defaultValues, mode: "onChange", diff --git a/src/realm-settings/EmailTab.tsx b/src/realm-settings/EmailTab.tsx index b1b29188ea..2d1bb63ecf 100644 --- a/src/realm-settings/EmailTab.tsx +++ b/src/realm-settings/EmailTab.tsx @@ -44,10 +44,10 @@ export const RealmSettingsEmailTab = ({ register, control, handleSubmit, - errors, watch, reset: resetForm, getValues, + formState: { errors }, } = useForm({ defaultValues: realm }); const reset = () => resetForm(realm); diff --git a/src/realm-settings/NewClientPolicyForm.tsx b/src/realm-settings/NewClientPolicyForm.tsx index 098f69de1c..9a3b68f6a0 100644 --- a/src/realm-settings/NewClientPolicyForm.tsx +++ b/src/realm-settings/NewClientPolicyForm.tsx @@ -65,7 +65,10 @@ type PolicyDetailAttributes = { export default function NewClientPolicyForm() { const { t } = useTranslation("realm-settings"); - const { errors, reset: resetForm } = useForm({ + const { + reset: resetForm, + formState: { errors }, + } = useForm({ defaultValues, }); const { realm } = useRealm(); diff --git a/src/realm-settings/security-defences/Time.tsx b/src/realm-settings/security-defences/Time.tsx index f3db420b54..69faf92e83 100644 --- a/src/realm-settings/security-defences/Time.tsx +++ b/src/realm-settings/security-defences/Time.tsx @@ -14,7 +14,10 @@ export const Time = ({ style?: CSSProperties; }) => { const { t } = useTranslation("realm-settings"); - const { control, errors } = useFormContext(); + const { + control, + formState: { errors }, + } = useFormContext(); return ( ({ mode: "onChange" }); + const { + register, + handleSubmit, + control, + setValue, + formState: { errors }, + } = useForm({ mode: "onChange" }); const handleFileChange = (obj: object) => { const defaultRealm = { id: "", realm: "", enabled: true }; diff --git a/src/sessions/RevocationModal.tsx b/src/sessions/RevocationModal.tsx index ea863627da..0cfdba6a84 100644 --- a/src/sessions/RevocationModal.tsx +++ b/src/sessions/RevocationModal.tsx @@ -37,7 +37,11 @@ export const RevocationModal = ({ const { realm: realmName } = useRealm(); const adminClient = useAdminClient(); - const { register, errors, handleSubmit } = useForm(); + const { + register, + handleSubmit, + formState: { errors }, + } = useForm(); const [realm, setRealm] = useState(); const [key, setKey] = useState(0); diff --git a/src/user/UserForm.tsx b/src/user/UserForm.tsx index 43dc98ca8f..1342d1eff7 100644 --- a/src/user/UserForm.tsx +++ b/src/user/UserForm.tsx @@ -60,8 +60,14 @@ export const UserForm = ({ const adminClient = useAdminClient(); const { addAlert, addError } = useAlerts(); - const { handleSubmit, register, errors, watch, control, reset } = - useFormContext(); + const { + handleSubmit, + register, + watch, + control, + reset, + formState: { errors }, + } = useFormContext(); const watchUsernameInput = watch("username"); const [selectedGroups, setSelectedGroups] = useState( [] diff --git a/src/user/UserIdPModal.tsx b/src/user/UserIdPModal.tsx index faf49e244f..1b62760ab9 100644 --- a/src/user/UserIdPModal.tsx +++ b/src/user/UserIdPModal.tsx @@ -35,7 +35,11 @@ export const UserIdpModal = ({ const { t } = useTranslation("users"); const adminClient = useAdminClient(); const { addAlert, addError } = useAlerts(); - const { register, errors, handleSubmit, formState } = useForm({ + const { + register, + handleSubmit, + formState: { isValid, errors }, + } = useForm({ mode: "onChange", }); @@ -71,7 +75,7 @@ export const UserIdpModal = ({ variant="primary" type="submit" form="group-form" - isDisabled={!formState.isValid} + isDisabled={!isValid} > {t("link")} , diff --git a/src/user/user-credentials/ResetPasswordDialog.tsx b/src/user/user-credentials/ResetPasswordDialog.tsx index bf066f04e9..787bbbf4cf 100644 --- a/src/user/user-credentials/ResetPasswordDialog.tsx +++ b/src/user/user-credentials/ResetPasswordDialog.tsx @@ -50,8 +50,7 @@ export const ResetPasswordDialog = ({ const { register, control, - errors, - formState: { isValid }, + formState: { isValid, errors }, watch, handleSubmit, } = useForm({