Fix/disable cancel button on save (#6204)

# This PR

- Fix #5675 
- Fix #6118 

Similarly to #5673 I have improved the field creation time by
re-fetching data on page redirection to the object page

<img width="1511" alt="Screenshot 2024-07-10 at 16 06 37"
src="https://github.com/twentyhq/twenty/assets/61581306/8ef8f4cb-4334-4f4c-b5d9-fea11fd5d99a">

@FellipeMTX @Bonapara

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>

packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldStep2.tsx

@@ -1,10 +1,10 @@
-import { useEffect, useState } from 'react';
-import { FormProvider, useForm } from 'react-hook-form';
-import { useNavigate, useParams } from 'react-router-dom';
 import { useApolloClient } from '@apollo/client';
 import styled from '@emotion/styled';
 import { zodResolver } from '@hookform/resolvers/zod';
 import pick from 'lodash.pick';
+import { useEffect, useState } from 'react';
+import { FormProvider, useForm } from 'react-hook-form';
+import { useNavigate, useParams } from 'react-router-dom';
 import { H2Title, IconSettings } from 'twenty-ui';
 import { z } from 'zod';
 
@@ -109,8 +109,8 @@ export const SettingsObjectNewFieldStep2 = () => {
 
   if (!activeObjectMetadataItem) return null;
 
-  const canSave =
-    formConfig.formState.isValid && !formConfig.formState.isSubmitting;
+  const { isValid, isSubmitting } = formConfig.formState;
+  const canSave = isValid && !isSubmitting;
 
   const handleSave = async (
     formValues: SettingsDataModelNewFieldFormValues,
@@ -134,26 +134,20 @@ export const SettingsObjectNewFieldStep2 = () => {
             objectMetadataId: relationFormValues.objectMetadataId,
           },
         });
-
-        // TODO: fix optimistic update logic
-        // Forcing a refetch for now but it's not ideal
-        await apolloClient.refetchQueries({
-          include: ['FindManyViews', 'CombinedFindManyRecords'],
-        });
       } else {
         await createMetadataField({
           ...formValues,
           objectMetadataId: activeObjectMetadataItem.id,
         });
-
-        // TODO: fix optimistic update logic
-        // Forcing a refetch for now but it's not ideal
-        await apolloClient.refetchQueries({
-          include: ['FindManyViews', 'CombinedFindManyRecords'],
-        });
       }
 
       navigate(`/settings/objects/${objectSlug}`);
+
+      // TODO: fix optimistic update logic
+      // Forcing a refetch for now but it's not ideal
+      await apolloClient.refetchQueries({
+        include: ['FindManyViews', 'CombinedFindManyRecords'],
+      });
     } catch (error) {
       enqueueSnackBar((error as Error).message, {
         variant: SnackBarVariant.Error,
@@ -193,6 +187,7 @@ export const SettingsObjectNewFieldStep2 = () => {
               {!activeObjectMetadataItem.isRemote && (
                 <SaveAndCancelButtons
                   isSaveDisabled={!canSave}
+                  isCancelDisabled={isSubmitting}
                   onCancel={() => navigate(`/settings/objects/${objectSlug}`)}
                   onSave={formConfig.handleSubmit(handleSave)}
                 />