Test revert crm integration (#6321)

PR to test revert integration in production

packages/twenty-front/src/App.tsx

@@ -55,6 +55,7 @@ import { SettingsAccounts } from '~/pages/settings/accounts/SettingsAccounts';
 import { SettingsAccountsCalendars } from '~/pages/settings/accounts/SettingsAccountsCalendars';
 import { SettingsAccountsEmails } from '~/pages/settings/accounts/SettingsAccountsEmails';
 import { SettingsNewAccount } from '~/pages/settings/accounts/SettingsNewAccount';
+import { SettingsCRMMigration } from '~/pages/settings/crm-migration/SettingsCRMMigration';
 import { SettingsNewObject } from '~/pages/settings/data-model/SettingsNewObject';
 import { SettingsObjectDetail } from '~/pages/settings/data-model/SettingsObjectDetail';
 import { SettingsObjectEdit } from '~/pages/settings/data-model/SettingsObjectEdit';
@@ -81,6 +82,7 @@ import { SettingsWorkspace } from '~/pages/settings/SettingsWorkspace';
 import { SettingsWorkspaceMembers } from '~/pages/settings/SettingsWorkspaceMembers';
 import { Tasks } from '~/pages/tasks/Tasks';
 import { getPageTitleFromPath } from '~/utils/title-utils';
+import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
 
 const ProvidersThatNeedRouterContext = () => {
   const { pathname } = useLocation();
@@ -125,7 +127,10 @@ const ProvidersThatNeedRouterContext = () => {
   );
 };
 
-const createRouter = (isBillingEnabled?: boolean) =>
+const createRouter = (
+  isBillingEnabled?: boolean,
+  isCRMMigrationEnabled?: boolean,
+) =>
   createBrowserRouter(
     createRoutesFromElements(
       <Route
@@ -222,6 +227,12 @@ const createRouter = (isBillingEnabled?: boolean) =>
                   path={SettingsPath.Developers}
                   element={<SettingsDevelopers />}
                 />
+                {isCRMMigrationEnabled && (
+                  <Route
+                    path={SettingsPath.CRMMigration}
+                    element={<SettingsCRMMigration />}
+                  />
+                )}
                 <Route
                   path={AppPath.DevelopersCatchAll}
                   element={
@@ -292,6 +303,11 @@ const createRouter = (isBillingEnabled?: boolean) =>
 
 export const App = () => {
   const billing = useRecoilValue(billingState);
+  const isCRMMigrationEnabled = useIsFeatureEnabled('IS_CRM_MIGRATION_ENABLED');
 
-  return <RouterProvider router={createRouter(billing?.isBillingEnabled)} />;
+  return (
+    <RouterProvider
+      router={createRouter(billing?.isBillingEnabled, isCRMMigrationEnabled)}
+    />
+  );
 };

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

@@ -23,11 +23,13 @@ import { NavigationDrawerItem } from '@/ui/navigation/navigation-drawer/componen
 import { NavigationDrawerItemGroup } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerItemGroup';
 import { NavigationDrawerSection } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSection';
 import { NavigationDrawerSectionTitle } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerSectionTitle';
+import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
 
 export const SettingsNavigationDrawerItems = () => {
   const { signOut } = useAuth();
 
   const billing = useRecoilValue(billingState);
+  const isCRMMigrationEnabled = useIsFeatureEnabled('IS_CRM_MIGRATION_ENABLED');
 
   return (
     <>
@@ -102,6 +104,13 @@ export const SettingsNavigationDrawerItems = () => {
           path={SettingsPath.Integrations}
           Icon={IconApps}
         />
+        {isCRMMigrationEnabled && (
+          <SettingsNavigationDrawerItem
+            label="CRM Migration"
+            path={SettingsPath.CRMMigration}
+            Icon={IconCode}
+          />
+        )}
       </NavigationDrawerSection>
 
       <NavigationDrawerSection>

packages/twenty-front/src/modules/types/SettingsPath.ts

@@ -18,6 +18,7 @@ export enum SettingsPath {
   NewObject = 'objects/new',
   WorkspaceMembersPage = 'workspace-members',
   Workspace = 'workspace',
+  CRMMigration = 'crm-migration',
   Developers = 'developers',
   DevelopersNewApiKey = 'api-keys/new',
   DevelopersApiKeyDetail = 'api-keys/:apiKeyId',

packages/twenty-front/src/modules/workspace/types/FeatureFlagKey.ts

@@ -5,4 +5,5 @@ export type FeatureFlagKey =
   | 'IS_AIRTABLE_INTEGRATION_ENABLED'
   | 'IS_POSTGRESQL_INTEGRATION_ENABLED'
   | 'IS_STRIPE_INTEGRATION_ENABLED'
-  | 'IS_COPILOT_ENABLED';
+  | 'IS_COPILOT_ENABLED'
+  | 'IS_CRM_MIGRATION_ENABLED';

packages/twenty-front/src/pages/settings/crm-migration/SettingsCRMMigration.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+// @ts-expect-error external library has a typing issue
+import { RevertConnect } from '@revertdotdev/revert-react';
+import { IconSettings } from 'twenty-ui';
+
+import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
+import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
+import { SettingsReadDocumentationButton } from '@/settings/developers/components/SettingsReadDocumentationButton';
+import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
+import { Section } from '@/ui/layout/section/components/Section';
+import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { useRecoilValue } from 'recoil';
+import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
+
+const REVERT_PUBLIC_KEY = 'pk_live_a87fee8c-28c7-494f-99a3-996ff89f9918';
+
+export const SettingsCRMMigration = () => {
+  const currentWorkspace = useRecoilValue(currentWorkspaceState);
+  return (
+    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+      <SettingsPageContainer>
+        <SettingsHeaderContainer>
+          <Breadcrumb links={[{ children: 'Migrate' }]} />
+          <SettingsReadDocumentationButton />
+        </SettingsHeaderContainer>
+        <Section>
+          <RevertConnect
+            config={{
+              revertToken: REVERT_PUBLIC_KEY,
+              tenantId: currentWorkspace?.id,
+            }}
+          />
+        </Section>
+      </SettingsPageContainer>
+    </SubMenuTopBarContainer>
+  );
+};

packages/twenty-server/package.json

@@ -21,6 +21,7 @@
     "@nestjs/devtools-integration": "^0.1.6",
     "@nestjs/graphql": "patch:@nestjs/graphql@12.1.1#./patches/@nestjs+graphql+12.1.1.patch",
     "@ptc-org/nestjs-query-graphql": "patch:@ptc-org/nestjs-query-graphql@4.2.0#./patches/@ptc-org+nestjs-query-graphql+4.2.0.patch",
+    "@revertdotdev/revert-react": "^0.0.21",
     "cache-manager": "^5.4.0",
     "cache-manager-redis-yet": "^4.1.2",
     "class-validator": "patch:class-validator@0.14.0#./patches/class-validator+0.14.0.patch",

yarn.lock

@@ -12528,6 +12528,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@revertdotdev/revert-react@npm:^0.0.21":
+  version: 0.0.21
+  resolution: "@revertdotdev/revert-react@npm:0.0.21"
+  peerDependencies:
+    react: ">=16.x"
+    react-dom: ">=16.x"
+  checksum: bd97830487754511e544514e2cec8ca845005ce3a52a0ba7764038fd1d1e39834b3235b5c7e51366dbda4e928f37600ad6ae72df2f4d359e6f17f66db656fec4
+  languageName: node
+  linkType: hard
+
 "@rollup/pluginutils@npm:^4.1.2":
   version: 4.2.1
   resolution: "@rollup/pluginutils@npm:4.2.1"
@@ -49091,6 +49101,7 @@ __metadata:
     "@nestjs/graphql": "patch:@nestjs/graphql@12.1.1#./patches/@nestjs+graphql+12.1.1.patch"
     "@nx/js": "npm:18.3.3"
     "@ptc-org/nestjs-query-graphql": "patch:@ptc-org/nestjs-query-graphql@4.2.0#./patches/@ptc-org+nestjs-query-graphql+4.2.0.patch"
+    "@revertdotdev/revert-react": "npm:^0.0.21"
     "@types/lodash.differencewith": "npm:^4.5.9"
     "@types/lodash.isempty": "npm:^4.4.7"
     "@types/lodash.isequal": "npm:^4.5.8"