From 425eb040f76531a86669507707245fadb727e8ae Mon Sep 17 00:00:00 2001
From: Charles Bochet <charlesBochet@users.noreply.github.com>
Date: Wed, 11 Sep 2024 11:23:52 +0200
Subject: [PATCH] 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
---
 .../settings/data-model/SettingsObjectFieldEdit.tsx   | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx
index cd20759cbf72..cc626497ca98 100644
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx
@@ -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,