Pass Billing Checkout var in url to bypass credit card (#9283)

packages/twenty-front/src/modules/auth/sign-in-up/hooks/__tests__/useSignInWithGoogle.test.ts

@@ -1,7 +1,9 @@
-import { renderHook } from '@testing-library/react';
-import { useParams, useSearchParams } from 'react-router-dom';
 import { useAuth } from '@/auth/hooks/useAuth';
 import { useSignInWithGoogle } from '@/auth/sign-in-up/hooks/useSignInWithGoogle';
+import { renderHook } from '@testing-library/react';
+import { useParams, useSearchParams } from 'react-router-dom';
+import { BillingPlanKey, SubscriptionInterval } from '~/generated/graphql';
+import { getJestMetadataAndApolloMocksWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksWrapper';
 
 jest.mock('react-router-dom', () => ({
   useParams: jest.fn(),
@@ -13,10 +15,24 @@ jest.mock('@/auth/hooks/useAuth', () => ({
 }));
 
 describe('useSignInWithGoogle', () => {
+  const mockBillingCheckoutSession = {
+    plan: BillingPlanKey.Pro,
+    interval: SubscriptionInterval.Month,
+    requirePaymentMethod: true,
+    skipPlanPage: false,
+  };
+
+  const Wrapper = getJestMetadataAndApolloMocksWrapper({
+    apolloMocks: [],
+  });
+
   it('should call signInWithGoogle with correct params', () => {
     const signInWithGoogleMock = jest.fn();
     const mockUseParams = { workspaceInviteHash: 'testHash' };
-    const mockSearchParams = new URLSearchParams('inviteToken=testToken');
+
+    const mockSearchParams = new URLSearchParams(
+      'inviteToken=testToken&billingCheckoutSessionState={"plan":"Pro","interval":"Month","requirePaymentMethod":true,"skipPlanPage":false}',
+    );
 
     (useParams as jest.Mock).mockReturnValue(mockUseParams);
     (useSearchParams as jest.Mock).mockReturnValue([mockSearchParams]);
@@ -24,12 +40,15 @@ describe('useSignInWithGoogle', () => {
       signInWithGoogle: signInWithGoogleMock,
     });
 
-    const { result } = renderHook(() => useSignInWithGoogle());
+    const { result } = renderHook(() => useSignInWithGoogle(), {
+      wrapper: Wrapper,
+    });
     result.current.signInWithGoogle();
 
     expect(signInWithGoogleMock).toHaveBeenCalledWith({
       workspaceInviteHash: 'testHash',
       workspacePersonalInviteToken: 'testToken',
+      billingCheckoutSession: mockBillingCheckoutSession,
     });
   });
 
@@ -44,12 +63,15 @@ describe('useSignInWithGoogle', () => {
       signInWithGoogle: signInWithGoogleMock,
     });
 
-    const { result } = renderHook(() => useSignInWithGoogle());
+    const { result } = renderHook(() => useSignInWithGoogle(), {
+      wrapper: Wrapper,
+    });
     result.current.signInWithGoogle();
 
     expect(signInWithGoogleMock).toHaveBeenCalledWith({
       workspaceInviteHash: 'testHash',
       workspacePersonalInviteToken: undefined,
+      billingCheckoutSession: mockBillingCheckoutSession,
     });
   });
 });

packages/twenty-front/src/modules/auth/sign-in-up/hooks/__tests__/useSignInWithMicrosoft.test.ts

@@ -1,7 +1,8 @@
-import { renderHook } from '@testing-library/react';
-import { useParams, useSearchParams } from 'react-router-dom';
 import { useAuth } from '@/auth/hooks/useAuth';
 import { useSignInWithMicrosoft } from '@/auth/sign-in-up/hooks/useSignInWithMicrosoft';
+import { renderHook } from '@testing-library/react';
+import { useParams, useSearchParams } from 'react-router-dom';
+import { getJestMetadataAndApolloMocksWrapper } from '~/testing/jest/getJestMetadataAndApolloMocksWrapper';
 
 jest.mock('react-router-dom', () => ({
   useParams: jest.fn(),
@@ -13,6 +14,17 @@ jest.mock('@/auth/hooks/useAuth', () => ({
 }));
 
 describe('useSignInWithMicrosoft', () => {
+  const Wrapper = getJestMetadataAndApolloMocksWrapper({
+    apolloMocks: [],
+  });
+
+  const mockBillingCheckoutSession = {
+    plan: 'PRO',
+    interval: 'Month',
+    requirePaymentMethod: true,
+    skipPlanPage: false,
+  };
+
   it('should call signInWithMicrosoft with the correct parameters', () => {
     const workspaceInviteHashMock = 'testHash';
     const inviteTokenMock = 'testToken';
@@ -28,12 +40,15 @@ describe('useSignInWithMicrosoft', () => {
       signInWithMicrosoft: signInWithMicrosoftMock,
     });
 
-    const { result } = renderHook(() => useSignInWithMicrosoft());
+    const { result } = renderHook(() => useSignInWithMicrosoft(), {
+      wrapper: Wrapper,
+    });
     result.current.signInWithMicrosoft();
 
     expect(signInWithMicrosoftMock).toHaveBeenCalledWith({
       workspaceInviteHash: workspaceInviteHashMock,
       workspacePersonalInviteToken: inviteTokenMock,
+      billingCheckoutSession: mockBillingCheckoutSession,
     });
   });
 
@@ -49,10 +64,13 @@ describe('useSignInWithMicrosoft', () => {
       signInWithMicrosoft: signInWithMicrosoftMock,
     });
 
-    const { result } = renderHook(() => useSignInWithMicrosoft());
+    const { result } = renderHook(() => useSignInWithMicrosoft(), {
+      wrapper: Wrapper,
+    });
     result.current.signInWithMicrosoft();
 
     expect(signInWithMicrosoftMock).toHaveBeenCalledWith({
+      billingCheckoutSession: mockBillingCheckoutSession,
       workspaceInviteHash: workspaceInviteHashMock,
       workspacePersonalInviteToken: undefined,
     });

packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInWithGoogle.ts

@@ -1,15 +1,27 @@
 import { useParams, useSearchParams } from 'react-router-dom';
 
 import { useAuth } from '@/auth/hooks/useAuth';
+import { BillingCheckoutSession } from '@/auth/types/billingCheckoutSession.type';
 
 export const useSignInWithGoogle = () => {
   const workspaceInviteHash = useParams().workspaceInviteHash;
   const [searchParams] = useSearchParams();
   const workspacePersonalInviteToken =
     searchParams.get('inviteToken') ?? undefined;
+  const billingCheckoutSession = {
+    plan: 'PRO',
+    interval: 'Month',
+    requirePaymentMethod: true,
+    skipPlanPage: false,
+  } as BillingCheckoutSession;
+
   const { signInWithGoogle } = useAuth();
   return {
     signInWithGoogle: () =>
-      signInWithGoogle({ workspaceInviteHash, workspacePersonalInviteToken }),
+      signInWithGoogle({
+        workspaceInviteHash,
+        workspacePersonalInviteToken,
+        billingCheckoutSession,
+      }),
   };
 };

packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInWithMicrosoft.ts

@@ -1,18 +1,23 @@
 import { useParams, useSearchParams } from 'react-router-dom';
 
 import { useAuth } from '@/auth/hooks/useAuth';
+import { billingCheckoutSessionState } from '@/auth/states/billingCheckoutSessionState';
+import { useRecoilValue } from 'recoil';
 
 export const useSignInWithMicrosoft = () => {
   const workspaceInviteHash = useParams().workspaceInviteHash;
   const [searchParams] = useSearchParams();
   const workspacePersonalInviteToken =
     searchParams.get('inviteToken') ?? undefined;
+  const billingCheckoutSession = useRecoilValue(billingCheckoutSessionState);
+
   const { signInWithMicrosoft } = useAuth();
   return {
     signInWithMicrosoft: () =>
       signInWithMicrosoft({
         workspaceInviteHash,
         workspacePersonalInviteToken,
+        billingCheckoutSession,
       }),
   };
 };