diff --git a/apps/studio/components/interfaces/Auth/AuthProvidersForm/FormField.tsx b/apps/studio/components/interfaces/Auth/AuthProvidersForm/FormField.tsx index b923356c29c..2da5f06e915 100644 --- a/apps/studio/components/interfaces/Auth/AuthProvidersForm/FormField.tsx +++ b/apps/studio/components/interfaces/Auth/AuthProvidersForm/FormField.tsx @@ -1,6 +1,7 @@ import { format } from 'date-fns' import { CalendarIcon, ExternalLink } from 'lucide-react' -import { type Control } from 'react-hook-form' +import { useEffect } from 'react' +import { useFormContext, type Control } from 'react-hook-form' import ReactMarkdown from 'react-markdown' import { Button, @@ -53,6 +54,7 @@ const FormField = ({ disabled: disabledProp, readOnly, }: FormFieldProps) => { + const { setValue } = useFormContext() const { description: originalDescription } = properties let description = originalDescription @@ -79,6 +81,12 @@ const FormField = ({ disabled: properties.show == null, }) + useEffect(() => { + if (properties.show?.key != null && !showValue && fieldValue !== '') { + setValue(name, '', { shouldDirty: true }) + } + }, [fieldValue, name, properties.show?.key, setValue, showValue]) + if (properties.show) { if (properties.show.matches) { if (!properties.show.matches.includes(showValue)) { @@ -341,7 +349,7 @@ const FormField = ({ > diff --git a/apps/studio/components/interfaces/Auth/AuthProvidersForm/ProviderForm.tsx b/apps/studio/components/interfaces/Auth/AuthProvidersForm/ProviderForm.tsx index c4602505546..5fc691fac28 100644 --- a/apps/studio/components/interfaces/Auth/AuthProvidersForm/ProviderForm.tsx +++ b/apps/studio/components/interfaces/Auth/AuthProvidersForm/ProviderForm.tsx @@ -165,7 +165,7 @@ export const ProviderForm = ({ config, provider, isActive }: ProviderFormProps) const form = useForm({ defaultValues: INITIAL_VALUES, resolver: zodResolver(provider.validationSchema), - shouldUnregister: true, + shouldUnregister: false, }) useEffect(() => {