Fix bug favorite optimistic rendering and opportunity prefill (#2633)

* Fix bug favorite optimistic rendering and opportunity prefill

* Fixes

front/src/modules/favorites/components/Favorites.tsx

@@ -16,7 +16,6 @@ const StyledContainer = styled.div`
 `;
 
 export const Favorites = () => {
-  // This is only temporary and will be refactored once we have main identifiers
   const { favorites, handleReorderFavorite } = useFavorites({
     objectNamePlural: 'companies',
   });

front/src/modules/favorites/hooks/useFavorites.ts

@@ -2,10 +2,13 @@ import { useApolloClient } from '@apollo/client';
 import { OnDragEndResponder } from '@hello-pangea/dnd';
 import { useRecoilCallback, useRecoilState, useRecoilValue } from 'recoil';
 
+import { useOptimisticEffect } from '@/apollo/optimistic-effect/hooks/useOptimisticEffect';
+import { useOptimisticEvict } from '@/apollo/optimistic-effect/hooks/useOptimisticEvict';
 import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
 import { Favorite } from '@/favorites/types/Favorite';
 import { mapFavorites } from '@/favorites/utils/mapFavorites';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { getRecordOptimisticEffectDefinition } from '@/object-record/graphql/optimistic-effect-definition/getRecordOptimisticEffectDefinition';
 import { useFindManyObjectRecords } from '@/object-record/hooks/useFindManyObjectRecords';
 import { PaginatedObjectTypeResults } from '@/object-record/types/PaginatedObjectTypeResults';
 import { isDeeplyEqual } from '~/utils/isDeeplyEqual';
@@ -21,10 +24,20 @@ export const useFavorites = ({
 
   const [favorites, setFavorites] = useRecoilState(favoritesState);
 
-  const { updateOneMutation, createOneMutation, deleteOneMutation } =
-    useObjectMetadataItem({
-      objectNamePlural: 'favorites',
+  const {
+    updateOneMutation,
+    createOneMutation,
+    deleteOneMutation,
+    objectMetadataItem: favoriteObjectMetadataItem,
+  } = useObjectMetadataItem({
+    objectNamePlural: 'favorites',
+  });
+
+  const { registerOptimisticEffect, triggerOptimisticEffects } =
+    useOptimisticEffect({
+      objectNameSingular: 'favorite',
     });
+  const { performOptimisticEvict } = useOptimisticEvict();
 
   const { objectMetadataItem: favoriteTargetObjectMetadataItem } =
     useObjectMetadataItem({
@@ -47,8 +60,19 @@ export const useFavorites = ({
           if (!isDeeplyEqual(favorites, queriedFavorites)) {
             set(favoritesState, queriedFavorites);
           }
+
+          if (!favoriteObjectMetadataItem) {
+            return;
+          }
+
+          registerOptimisticEffect({
+            variables: { filter: {}, orderBy: {} },
+            definition: getRecordOptimisticEffectDefinition({
+              objectMetadataItem: favoriteObjectMetadataItem,
+            }),
+          });
         },
-      [],
+      [favoriteObjectMetadataItem, registerOptimisticEffect],
     ),
   });
 
@@ -57,8 +81,10 @@ export const useFavorites = ({
       async (favoriteTargetObjectId: string, additionalData?: any) => {
         const favorites = snapshot.getLoadable(favoritesState).getValue();
 
-        const targetObjectName =
-          favoriteTargetObjectMetadataItem?.nameSingular ?? '';
+        if (!favoriteTargetObjectMetadataItem) {
+          return;
+        }
+        const targetObjectName = favoriteTargetObjectMetadataItem.nameSingular;
 
         const result = await apolloClient.mutate({
           mutation: createOneMutation,
@@ -71,6 +97,8 @@ export const useFavorites = ({
           },
         });
 
+        triggerOptimisticEffects(`FavoriteEdge`, result.data[`createFavorite`]);
+
         const createdFavorite = result?.data?.createFavorite;
 
         const newFavorite = {
@@ -87,8 +115,9 @@ export const useFavorites = ({
     [
       apolloClient,
       createOneMutation,
-      currentWorkspaceMember,
-      favoriteTargetObjectMetadataItem?.nameSingular,
+      currentWorkspaceMember?.id,
+      favoriteTargetObjectMetadataItem,
+      triggerOptimisticEffects,
     ],
   );
 
@@ -136,6 +165,8 @@ export const useFavorites = ({
           },
         });
 
+        performOptimisticEvict('Favorite', 'id', idToDelete ?? '');
+
         set(
           favoritesState,
           favorites.filter((favorite: Favorite) => favorite.id !== idToDelete),

front/src/modules/object-record/components/RecordTablePage.tsx

@@ -2,6 +2,8 @@ import { useEffect } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
 import styled from '@emotion/styled';
 
+import { useOnboardingStatus } from '@/auth/hooks/useOnboardingStatus';
+import { OnboardingStatus } from '@/auth/utils/getOnboardingStatus';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
 import { IconBuildingSkyscraper } from '@/ui/display/icon';
@@ -36,13 +38,18 @@ export const RecordTablePage = () => {
       objectNamePlural,
     });
 
+  const onboardingStatus = useOnboardingStatus();
+
   const navigate = useNavigate();
 
   useEffect(() => {
-    if (objectNotFoundInMetadata) {
+    if (
+      objectNotFoundInMetadata &&
+      onboardingStatus === OnboardingStatus.Completed
+    ) {
       navigate('/');
     }
-  }, [objectNotFoundInMetadata, navigate]);
+  }, [objectNotFoundInMetadata, navigate, onboardingStatus]);
 
   const { createOneObject } = useCreateOneObjectRecord({
     objectNameSingular: objectMetadataItem?.nameSingular,

front/src/modules/views/components/ViewBarEffect.tsx

@@ -58,7 +58,10 @@ export const ViewBarEffect = () => {
             data.edges
               .map((view) => view.node)
               .find((view) => view.id === currentViewIdFromUrl) ??
-            data.edges[0].node;
+            data.edges[0]?.node ??
+            null;
+
+          if (!currentView) return;
 
           set(currentViewIdState, currentView.id);