Fix not possible to edit options (#6979)

We have recently merged: https://github.com/twentyhq/twenty/pull/6700

However, this introduced a regression on field edition as we have
removed the type dropdown from the field edition page. This dropdown was
wrapped into a controller setting the type on the form. Without this
type, the form is considered as invalid and cannot be saved.

I'm setting the form values through useForm.

I'm unhappy with this PR for too reasons:
- usage of activeMetadataField?.icon ?? '' format because I cannot call
useForm conditionnally. This would imply splitting the component into
several components to avoid this issue
- usage of react hook form which is very hard to debug, we should remove
it from the project
This commit is contained in:
Charles Bochet 2024-09-11 11:23:52 +02:00 committed by GitHub
parent 846953b0f4
commit 425eb040f7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -25,6 +25,7 @@ import { SettingsDataModelFieldDescriptionForm } from '@/settings/data-model/fie
import { SettingsDataModelFieldIconLabelForm } from '@/settings/data-model/fields/forms/components/SettingsDataModelFieldIconLabelForm';
import { SettingsDataModelFieldSettingsFormCard } from '@/settings/data-model/fields/forms/components/SettingsDataModelFieldSettingsFormCard';
import { settingsFieldFormSchema } from '@/settings/data-model/fields/forms/validation-schemas/settingsFieldFormSchema';
import { SettingsSupportedFieldType } from '@/settings/data-model/types/SettingsSupportedFieldType';
import { AppPath } from '@/types/AppPath';
import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
@ -86,6 +87,12 @@ export const SettingsObjectFieldEdit = () => {
const formConfig = useForm<SettingsDataModelFieldEditFormValues>({
mode: 'onTouched',
resolver: zodResolver(settingsFieldFormSchema()),
values: {
icon: activeMetadataField?.icon ?? 'Icon123',
type: activeMetadataField?.type as SettingsSupportedFieldType,
label: activeMetadataField?.label ?? '',
description: activeMetadataField?.description,
},
});
useEffect(() => {
@ -94,11 +101,11 @@ export const SettingsObjectFieldEdit = () => {
}
}, [activeMetadataField, activeObjectMetadataItem, navigate]);
if (!activeObjectMetadataItem || !activeMetadataField) return null;
const { isDirty, isValid, isSubmitting } = formConfig.formState;
const canSave = isDirty && isValid && !isSubmitting;
if (!activeObjectMetadataItem || !activeMetadataField) return null;
const isLabelIdentifier = isLabelIdentifierField({
fieldMetadataItem: activeMetadataField,
objectMetadataItem: activeObjectMetadataItem,