Fix jest tests broken with apollo metadata client (#4728)

The tests were broken. It turns out that it is not easy to mock two
apolloClients as apollo only provides "MockedProvider" component to mock
apollo in tests.
MockedProvider Api does not allow us to mock on client level.

For now, I'm defaulting to the base ApolloClient in test mode to avoid
the issue

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneObjectMetadataItem.test.tsx

@@ -5,7 +5,6 @@ import { RecoilRoot } from 'recoil';
 
 import { useCreateOneObjectMetadataItem } from '@/object-metadata/hooks/useCreateOneObjectMetadataItem';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
 import {
   findManyViewsQuery,
   query,
@@ -51,9 +50,7 @@ const mocks = [
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
     <MockedProvider mocks={mocks} addTypename={false}>
-      <TestApolloMetadataClientProvider>
+      {children}
-        {children}
-      </TestApolloMetadataClientProvider>
     </MockedProvider>
   </RecoilRoot>
 );

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useCreateOneRelationMetadataItem.test.tsx

@@ -6,7 +6,6 @@ import { RecoilRoot } from 'recoil';
 import { useCreateOneRelationMetadataItem } from '@/object-metadata/hooks/useCreateOneRelationMetadataItem';
 import { RelationMetadataType } from '~/generated/graphql';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
 import {
   query,
   responseData,
@@ -30,9 +29,7 @@ const mocks = [
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
     <MockedProvider mocks={mocks} addTypename={false}>
-      <TestApolloMetadataClientProvider>
+      {children}
-        {children}
-      </TestApolloMetadataClientProvider>
     </MockedProvider>
   </RecoilRoot>
 );

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useDeleteOneObjectMetadataItem.test.tsx

@@ -5,7 +5,6 @@ import { RecoilRoot } from 'recoil';
 
 import { useDeleteOneObjectMetadataItem } from '@/object-metadata/hooks/useDeleteOneObjectMetadataItem';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
 import {
   query,
   responseData,
@@ -29,9 +28,7 @@ const mocks = [
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
     <MockedProvider mocks={mocks} addTypename={false}>
-      <TestApolloMetadataClientProvider>
+      {children}
-        {children}
-      </TestApolloMetadataClientProvider>
     </MockedProvider>
   </RecoilRoot>
 );

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useFieldMetadataItem.test.tsx

@@ -7,7 +7,6 @@ import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataIt
 import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
 import { FieldMetadataType } from '~/generated/graphql';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
 import {
   objectMetadataId,
   queries,
@@ -85,9 +84,7 @@ const mocks = [
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
     <MockedProvider mocks={mocks} addTypename={false}>
-      <TestApolloMetadataClientProvider>
+      {children}
-        {children}
-      </TestApolloMetadataClientProvider>
     </MockedProvider>
   </RecoilRoot>
 );

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useFindManyObjectMetadataItems.test.tsx

@@ -6,7 +6,6 @@ import { RecoilRoot } from 'recoil';
 import { useFindManyObjectMetadataItems } from '@/object-metadata/hooks/useFindManyObjectMetadataItems';
 import { SnackBarProviderScope } from '@/ui/feedback/snack-bar-manager/scopes/SnackBarProviderScope';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
 import {
   query,
   responseData,
@@ -30,11 +29,9 @@ const mocks = [
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
     <MockedProvider mocks={mocks} addTypename={false}>
-      <TestApolloMetadataClientProvider>
+      <SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
-        <SnackBarProviderScope snackBarManagerScopeId="snack-bar-manager">
+        {children}
-          {children}
+      </SnackBarProviderScope>
-        </SnackBarProviderScope>
-      </TestApolloMetadataClientProvider>
     </MockedProvider>
   </RecoilRoot>
 );

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useGetRelationMetadata.test.tsx

@@ -7,15 +7,9 @@ import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMe
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
 import { getObjectMetadataItemsMock } from '@/object-metadata/utils/getObjectMetadataItemsMock';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
-
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
-    <MockedProvider addTypename={false}>
+    <MockedProvider addTypename={false}>{children}</MockedProvider>
-      <TestApolloMetadataClientProvider>
-        {children}
-      </TestApolloMetadataClientProvider>
-    </MockedProvider>
   </RecoilRoot>
 );
 

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useObjectMetadataItem.test.tsx

@@ -5,15 +5,9 @@ import { RecoilRoot } from 'recoil';
 
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
-
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
-    <MockedProvider addTypename={false}>
+    <MockedProvider addTypename={false}>{children}</MockedProvider>
-      <TestApolloMetadataClientProvider>
-        {children}
-      </TestApolloMetadataClientProvider>
-    </MockedProvider>
   </RecoilRoot>
 );
 

packages/twenty-front/src/modules/object-metadata/hooks/__tests__/useObjectMetadataItemForSettings.test.tsx

@@ -12,8 +12,6 @@ import { useObjectMetadataItemForSettings } from '@/object-metadata/hooks/useObj
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
 import { getObjectMetadataItemsMock } from '@/object-metadata/utils/getObjectMetadataItemsMock';
 
-import { TestApolloMetadataClientProvider } from '../__mocks__/ApolloMetadataClientProvider';
-
 const mocks = [
   {
     request: {
@@ -31,9 +29,7 @@ const mocks = [
 const Wrapper = ({ children }: { children: ReactNode }) => (
   <RecoilRoot>
     <MockedProvider mocks={mocks} addTypename={false}>
-      <TestApolloMetadataClientProvider>
+      {children}
-        {children}
-      </TestApolloMetadataClientProvider>
     </MockedProvider>
   </RecoilRoot>
 );

packages/twenty-front/src/modules/object-metadata/hooks/useApolloMetadataClient.ts

@@ -1,9 +1,15 @@
 import { useContext } from 'react';
+import { useApolloClient } from '@apollo/client';
 
 import { ApolloMetadataClientContext } from '../context/ApolloClientMetadataContext';
 
 export const useApolloMetadataClient = () => {
   const apolloMetadataClient = useContext(ApolloMetadataClientContext);
+  const apolloClient = useApolloClient();
+
+  if (process.env.NODE_ENV === 'test') {
+    return apolloClient;
+  }
 
   return apolloMetadataClient;
 };