refactor(forms): simplify form handling and button behavior (#10441)

Removed redundant handleSave and handleSubmit props in domain settings.
Integrated form submission logic directly into form components, ensuring
consistent behavior and reducing complexity. Updated button components
to explicitly support the "type" attribute for improved accessibility
and functionality.

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
This commit is contained in:
Antoine Moreaux
2025-02-25 11:37:36 +01:00
committed by GitHub
parent bfc92fc00d
commit 7abc67c905
14 changed files with 199 additions and 167 deletions

View File

@ -107,6 +107,9 @@ export const SettingsDomain = () => {
customDomain:
customDomain && customDomain.length > 0 ? customDomain : null,
});
enqueueSnackBar(t`Custom domain updated`, {
variant: SnackBarVariant.Success,
});
},
onError: (error) => {
if (
@ -161,6 +164,10 @@ export const SettingsDomain = () => {
subdomain,
});
enqueueSnackBar(t`Subdomain updated`, {
variant: SnackBarVariant.Success,
});
redirectToWorkspaceDomain(currentUrl.toString());
},
});
@ -169,12 +176,6 @@ export const SettingsDomain = () => {
const handleSave = async () => {
const values = form.getValues();
if (!values || !form.formState.isValid || !currentWorkspace) {
return enqueueSnackBar(t`Invalid form values`, {
variant: SnackBarVariant.Error,
});
}
if (
subdomainValue === currentWorkspace?.subdomain &&
customDomainValue === currentWorkspace?.customDomain
@ -184,6 +185,12 @@ export const SettingsDomain = () => {
});
}
if (!values || !currentWorkspace) {
return enqueueSnackBar(t`Invalid form values`, {
variant: SnackBarVariant.Error,
});
}
if (
isDefined(values.subdomain) &&
values.subdomain !== currentWorkspace.subdomain
@ -197,38 +204,40 @@ export const SettingsDomain = () => {
};
return (
<SubMenuTopBarContainer
title={t`Domain`}
links={[
{
children: <Trans>Workspace</Trans>,
href: getSettingsPath(SettingsPath.Workspace),
},
{
children: <Trans>General</Trans>,
href: getSettingsPath(SettingsPath.Workspace),
},
{ children: <Trans>Domain</Trans> },
]}
actionButton={
<SaveAndCancelButtons
onCancel={() => navigate(SettingsPath.Workspace)}
onSave={form.handleSubmit(handleSave)}
/>
}
>
<SettingsPageContainer>
{/* eslint-disable-next-line react/jsx-props-no-spreading */}
<FormProvider {...form}>
<SettingsSubdomain handleSave={handleSave} />
{isCustomDomainEnabled && (
<>
<SettingsCustomDomainEffect />
<SettingsCustomDomain handleSave={handleSave} />
</>
)}
</FormProvider>
</SettingsPageContainer>
</SubMenuTopBarContainer>
<form onSubmit={form.handleSubmit(handleSave)}>
{/* eslint-disable-next-line react/jsx-props-no-spreading */}
<FormProvider {...form}>
<SubMenuTopBarContainer
title={t`Domain`}
links={[
{
children: <Trans>Workspace</Trans>,
href: getSettingsPath(SettingsPath.Workspace),
},
{
children: <Trans>General</Trans>,
href: getSettingsPath(SettingsPath.Workspace),
},
{ children: <Trans>Domain</Trans> },
]}
actionButton={
<SaveAndCancelButtons
onCancel={() => navigate(SettingsPath.Workspace)}
isSaveDisabled={form.formState.isSubmitting}
/>
}
>
<SettingsPageContainer>
<SettingsSubdomain />
{isCustomDomainEnabled && (
<>
<SettingsCustomDomainEffect />
<SettingsCustomDomain />
</>
)}
</SettingsPageContainer>
</SubMenuTopBarContainer>
</FormProvider>
</form>
);
};