Performance improvement to dev xp (#9294)

The DX is not great when you need to do a lot of database
resets/command.

Should we disable Typescript validation to speed things up? With this
and caching database:reset takes 1min instead of 2 on my machine.


See also: https://github.com/typeorm/typeorm/issues/4136

And #9291 / #9293

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsListEmptyStateCard.tsx

@@ -1,6 +1,8 @@
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
 import { useTriggerApisOAuth } from '@/settings/accounts/hooks/useTriggerApiOAuth';
 import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
 import styled from '@emotion/styled';
+import { useRecoilValue } from 'recoil';
 import {
   Button,
   Card,
@@ -9,8 +11,7 @@ import {
   IconGoogle,
   IconMicrosoft,
 } from 'twenty-ui';
-import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
-import { useRecoilValue } from 'recoil';
+import { FeatureFlagKey } from '~/generated/graphql';
 
 const StyledHeader = styled(CardHeader)`
   align-items: center;
@@ -34,7 +35,7 @@ export const SettingsAccountsListEmptyStateCard = ({
   const { triggerApisOAuth } = useTriggerApisOAuth();
   const currentWorkspace = useRecoilValue(currentWorkspaceState);
   const isMicrosoftSyncEnabled = useIsFeatureEnabled(
-    'IS_MICROSOFT_SYNC_ENABLED',
+    FeatureFlagKey.IsMicrosoftSyncEnabled,
   );
 
   return (

packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx

@@ -41,6 +41,7 @@ import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
 import styled from '@emotion/styled';
 import { AnimatePresence, motion } from 'framer-motion';
 import { matchPath, resolvePath, useLocation } from 'react-router-dom';
+import { FeatureFlagKey } from '~/generated/graphql';
 
 type SettingsNavigationItem = {
   label: string;
@@ -80,10 +81,14 @@ export const SettingsNavigationDrawerItems = () => {
 
   const billing = useRecoilValue(billingState);
   const isFunctionSettingsEnabled = useIsFeatureEnabled(
-    'IS_FUNCTION_SETTINGS_ENABLED',
+    FeatureFlagKey.IsFunctionSettingsEnabled,
+  );
+  const isFreeAccessEnabled = useIsFeatureEnabled(
+    FeatureFlagKey.IsFreeAccessEnabled,
+  );
+  const isCRMMigrationEnabled = useIsFeatureEnabled(
+    FeatureFlagKey.IsCrmMigrationEnabled,
   );
-  const isFreeAccessEnabled = useIsFeatureEnabled('IS_FREE_ACCESS_ENABLED');
-  const isCRMMigrationEnabled = useIsFeatureEnabled('IS_CRM_MIGRATION_ENABLED');
   const isBillingPageEnabled =
     billing?.isBillingEnabled && !isFreeAccessEnabled;
 

packages/twenty-front/src/modules/settings/integrations/hooks/useIsSettingsIntegrationEnabled.ts

@@ -1,13 +1,14 @@
 import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
+import { FeatureFlagKey } from '~/generated/graphql';
 
-const getFeatureKey = (databaseKey: string) => {
+const getFeatureKey = (databaseKey: string): FeatureFlagKey | null => {
   switch (databaseKey) {
     case 'airtable':
-      return 'IS_AIRTABLE_INTEGRATION_ENABLED';
+      return FeatureFlagKey.IsAirtableIntegrationEnabled;
     case 'postgresql':
-      return 'IS_POSTGRESQL_INTEGRATION_ENABLED';
+      return FeatureFlagKey.IsPostgreSqlIntegrationEnabled;
     case 'stripe':
-      return 'IS_STRIPE_INTEGRATION_ENABLED';
+      return FeatureFlagKey.IsStripeIntegrationEnabled;
     default:
       return null;
   }

packages/twenty-front/src/modules/settings/integrations/hooks/useSettingsIntegrationCategories.ts

@@ -5,25 +5,26 @@ import { SETTINGS_INTEGRATION_ZAPIER_CATEGORY } from '@/settings/integrations/co
 import { SettingsIntegrationCategory } from '@/settings/integrations/types/SettingsIntegrationCategory';
 import { getSettingsIntegrationAll } from '@/settings/integrations/utils/getSettingsIntegrationAll';
 import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
+import { FeatureFlagKey } from '~/generated/graphql';
 
 export const useSettingsIntegrationCategories =
   (): SettingsIntegrationCategory[] => {
     const isAirtableIntegrationEnabled = useIsFeatureEnabled(
-      'IS_AIRTABLE_INTEGRATION_ENABLED',
+      FeatureFlagKey.IsAirtableIntegrationEnabled,
     );
     const isAirtableIntegrationActive = !!MOCK_REMOTE_DATABASES.find(
       ({ name }) => name === 'airtable',
     )?.isActive;
 
     const isPostgresqlIntegrationEnabled = useIsFeatureEnabled(
-      'IS_POSTGRESQL_INTEGRATION_ENABLED',
+      FeatureFlagKey.IsPostgreSqlIntegrationEnabled,
     );
     const isPostgresqlIntegrationActive = !!MOCK_REMOTE_DATABASES.find(
       ({ name }) => name === 'postgresql',
     )?.isActive;
 
     const isStripeIntegrationEnabled = useIsFeatureEnabled(
-      'IS_STRIPE_INTEGRATION_ENABLED',
+      FeatureFlagKey.IsStripeIntegrationEnabled,
     );
     const isStripeIntegrationActive = !!MOCK_REMOTE_DATABASES.find(
       ({ name }) => name === 'stripe',