Improve Jotai work (#18205)

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

@@ -1,10 +1,10 @@
 import { useCallback } from 'react';
 
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
-import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
 import { type FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
 import { type ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
 import { getFieldMetadataItemByIdOrThrow } from '@/object-metadata/utils/getFieldMetadataItemByIdOrThrow';
+import { useStore } from 'jotai';
 
 type GetFieldMetadataItemByIdOrThrowResult = {
   fieldMetadataItem: FieldMetadataItem;
@@ -12,16 +12,17 @@ type GetFieldMetadataItemByIdOrThrowResult = {
 };
 
 export const useGetFieldMetadataItemByIdOrThrow = () => {
+  const store = useStore();
   const getFieldMetadataItemByIdOrThrowCallback = useCallback(
     (fieldMetadataId: string): GetFieldMetadataItemByIdOrThrowResult => {
-      const objectMetadataItems = jotaiStore.get(objectMetadataItemsState.atom);
+      const objectMetadataItems = store.get(objectMetadataItemsState.atom);
 
       return getFieldMetadataItemByIdOrThrow({
         fieldMetadataId,
         objectMetadataItems,
       });
     },
-    [],
+    [store],
   );
 
   return {

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

@@ -1,13 +1,15 @@
 import { useCallback } from 'react';
 
 import { objectMetadataItemFamilySelector } from '@/object-metadata/states/objectMetadataItemFamilySelector';
-import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
 import { FieldMetadataType } from '~/generated-metadata/graphql';
 
 import { type FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+import { useStore } from 'jotai';
 
-export const useGetRelationMetadata = () =>
-  useCallback(
+export const useGetRelationMetadata = () => {
+  const store = useStore();
+
+  return useCallback(
     ({
       fieldMetadataItem,
     }: {
@@ -19,7 +21,7 @@ export const useGetRelationMetadata = () =>
 
       if (!relation) return null;
 
-      const relationObjectMetadataItem = jotaiStore.get(
+      const relationObjectMetadataItem = store.get(
         objectMetadataItemFamilySelector.selectorFamily({
           objectName: relation.targetObjectMetadata.nameSingular,
           objectNameType: 'singular',
@@ -40,5 +42,6 @@ export const useGetRelationMetadata = () =>
         relationType: relation.type,
       };
     },
-    [],
+    [store],
   );
+};

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

@@ -1,28 +1,29 @@
 import { isAppEffectRedirectEnabledState } from '@/app/states/isAppEffectRedirectEnabledState';
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
-import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
 import { useCallback } from 'react';
 import { generatedMockObjectMetadataItems } from '~/testing/utils/generatedMockObjectMetadataItems';
 import { isDeeplyEqual } from '~/utils/isDeeplyEqual';
+import { useStore } from 'jotai';
 
 export const useLoadMockedObjectMetadataItems = () => {
+  const store = useStore();
   const loadMockedObjectMetadataItems = useCallback(async () => {
     if (
       !isDeeplyEqual(
-        jotaiStore.get(objectMetadataItemsState.atom),
+        store.get(objectMetadataItemsState.atom),
         generatedMockObjectMetadataItems,
       )
     ) {
-      jotaiStore.set(
+      store.set(
         objectMetadataItemsState.atom,
         generatedMockObjectMetadataItems,
       );
     }
 
-    if (jotaiStore.get(isAppEffectRedirectEnabledState.atom) === false) {
-      jotaiStore.set(isAppEffectRedirectEnabledState.atom, true);
+    if (store.get(isAppEffectRedirectEnabledState.atom) === false) {
+      store.set(isAppEffectRedirectEnabledState.atom, true);
     }
-  }, []);
+  }, [store]);
 
   return {
     loadMockedObjectMetadataItems,

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

@@ -5,17 +5,18 @@ import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadat
 import { type ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
 import { enrichObjectMetadataItemsWithPermissions } from '@/object-metadata/utils/enrichObjectMetadataItemsWithPermissions';
 import { mapPaginatedObjectMetadataItemsToObjectMetadataItems } from '@/object-metadata/utils/mapPaginatedObjectMetadataItemsToObjectMetadataItems';
-import { jotaiStore } from '@/ui/utilities/state/jotai/jotaiStore';
 import { type FetchPolicy, useApolloClient } from '@apollo/client';
 import { useCallback } from 'react';
 import { type ObjectPermissions } from 'twenty-shared/types';
 import { isDefined } from 'twenty-shared/utils';
 import { type ObjectMetadataItemsQuery } from '~/generated-metadata/graphql';
 import { isDeeplyEqual } from '~/utils/isDeeplyEqual';
+import { useStore } from 'jotai';
 
 export const useRefreshObjectMetadataItems = (
   fetchPolicy: FetchPolicy = 'network-only',
 ) => {
+  const store = useStore();
   const client = useApolloClient();
 
   const replaceObjectMetadataItemIfDifferent = useCallback(
@@ -25,9 +26,7 @@ export const useRefreshObjectMetadataItems = (
         'readableFields' | 'updatableFields'
       >[],
     ) => {
-      const currentUserWorkspace = jotaiStore.get(
-        currentUserWorkspaceState.atom,
-      );
+      const currentUserWorkspace = store.get(currentUserWorkspaceState.atom);
 
       if (!isDefined(currentUserWorkspace)) {
         return;
@@ -52,21 +51,21 @@ export const useRefreshObjectMetadataItems = (
 
       if (
         !isDeeplyEqual(
-          jotaiStore.get(objectMetadataItemsState.atom),
+          store.get(objectMetadataItemsState.atom),
           newObjectMetadataItems,
         ) &&
         newObjectMetadataItems.length > 0
       ) {
-        jotaiStore.set(objectMetadataItemsState.atom, newObjectMetadataItems);
+        store.set(objectMetadataItemsState.atom, newObjectMetadataItems);
       }
 
-      if (jotaiStore.get(isAppEffectRedirectEnabledState.atom) === false) {
-        jotaiStore.set(isAppEffectRedirectEnabledState.atom, true);
+      if (store.get(isAppEffectRedirectEnabledState.atom) === false) {
+        store.set(isAppEffectRedirectEnabledState.atom, true);
       }
 
       return newObjectMetadataItems;
     },
-    [],
+    [store],
   );
 
   const refreshObjectMetadataItems = async () => {