Add stripe connection option (#5372)

- Refactor creation and edition form so it handles stripe integration
and not only postgres
- Add a hook `useIsSettingsIntegrationEnabled` to avoid checking feature
flags everywhere
- Add zod schema for stripe

<img width="250" alt="Capture d’écran 2024-05-13 à 12 41 52"
src="https://github.com/twentyhq/twenty/assets/22936103/a77e7278-5d79-4f95-bddb-ae9ddd1426eb">
<img width="250" alt="Capture d’écran 2024-05-13 à 12 41 59"
src="https://github.com/twentyhq/twenty/assets/22936103/d617dc6a-31a4-43c8-8192-dbfb7157de1c">
<img width="250" alt="Capture d’écran 2024-05-13 à 12 42 08"
src="https://github.com/twentyhq/twenty/assets/22936103/c4e2d0e4-f826-436d-89be-4d1679a27861">

---------

Co-authored-by: Thomas Trompette <thomast@twenty.com>

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

@@ -0,0 +1,21 @@
+import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
+
+const getFeatureKey = (databaseKey: string) => {
+  switch (databaseKey) {
+    case 'airtable':
+      return 'IS_AIRTABLE_INTEGRATION_ENABLED';
+    case 'postgresql':
+      return 'IS_POSTGRESQL_INTEGRATION_ENABLED';
+    case 'stripe':
+      return 'IS_STRIPE_INTEGRATION_ENABLED';
+    default:
+      return null;
+  }
+};
+
+export const useIsSettingsIntegrationEnabled = (
+  databaseKey: string,
+): boolean => {
+  const featureKey = getFeatureKey(databaseKey);
+  return useIsFeatureEnabled(featureKey);
+};

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

@@ -14,6 +14,7 @@ export const useSettingsIntegrationCategories =
     const isAirtableIntegrationActive = !!MOCK_REMOTE_DATABASES.find(
       ({ name }) => name === 'airtable',
     )?.isActive;
+
     const isPostgresqlIntegrationEnabled = useIsFeatureEnabled(
       'IS_POSTGRESQL_INTEGRATION_ENABLED',
     );
@@ -21,12 +22,21 @@ export const useSettingsIntegrationCategories =
       ({ name }) => name === 'postgresql',
     )?.isActive;
 
+    const isStripeIntegrationEnabled = useIsFeatureEnabled(
+      'IS_STRIPE_INTEGRATION_ENABLED',
+    );
+    const isStripeIntegrationActive = !!MOCK_REMOTE_DATABASES.find(
+      ({ name }) => name === 'stripe',
+    )?.isActive;
+
     return [
       getSettingsIntegrationAll({
         isAirtableIntegrationEnabled,
         isAirtableIntegrationActive,
         isPostgresqlIntegrationEnabled,
         isPostgresqlIntegrationActive,
+        isStripeIntegrationEnabled,
+        isStripeIntegrationActive,
       }),
       SETTINGS_INTEGRATION_ZAPIER_CATEGORY,
       SETTINGS_INTEGRATION_WINDMILL_CATEGORY,