Fix fetch more notes

packages/twenty-front/src/modules/activities/components/CustomResolverFetchMoreLoader.tsx

@@ -6,6 +6,10 @@ type CustomResolverFetchMoreLoaderProps = {
   onLastRowVisible: (...args: any[]) => any;
 };
 
+const StyledContainer = styled.div`
+  min-height: 1px;
+`;
+
 const StyledText = styled.div`
   align-items: center;
   box-shadow: none;
@@ -21,12 +25,16 @@ export const CustomResolverFetchMoreLoader = ({
   onLastRowVisible,
 }: CustomResolverFetchMoreLoaderProps) => {
   const { ref: tbodyRef } = useInView({
-    onChange: onLastRowVisible,
+    onChange: (inView) => {
+      if (inView) {
+        onLastRowVisible();
+      }
+    },
   });
 
   return (
-    <div ref={tbodyRef}>
+    <StyledContainer ref={tbodyRef}>
       {loading && <StyledText>Loading more...</StyledText>}
-    </div>
+    </StyledContainer>
   );
 };

packages/twenty-front/src/modules/activities/graphql/operation-signatures/factories/findActivityTargetsOperationSignatureFactory.ts

@@ -1,11 +1,12 @@
-import { generateActivityTargetMorphFieldKeys } from '@/activities/utils/generateActivityTargetMorphFieldKeys';
 import { getJoinObjectNameSingular } from '@/activities/utils/getJoinObjectNameSingular';
 import { type CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { type ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { generateDepthRecordGqlFieldsFromObject } from '@/object-record/graphql/record-gql-fields/utils/generateDepthRecordGqlFieldsFromObject';
 import { type RecordGqlOperationSignatureFactory } from '@/object-record/graphql/types/RecordGqlOperationSignatureFactory';
+import { isDefined } from 'twenty-shared/utils';
 
 type FindActivityTargetsOperationSignatureFactory = {
-  objectNameSingular: CoreObjectNameSingular;
+  objectNameSingular: CoreObjectNameSingular.Note | CoreObjectNameSingular.Task;
   objectMetadataItems: ObjectMetadataItem[];
 };
 
@@ -14,14 +15,50 @@ export const findActivityTargetsOperationSignatureFactory: RecordGqlOperationSig
 > = ({
   objectNameSingular,
   objectMetadataItems,
-}: FindActivityTargetsOperationSignatureFactory) => ({
-  objectNameSingular: getJoinObjectNameSingular(objectNameSingular),
-  variables: {},
-  fields: {
-    id: true,
-    __typename: true,
-    createdAt: true,
-    updatedAt: true,
-    ...generateActivityTargetMorphFieldKeys(objectMetadataItems),
-  },
-});
+}: FindActivityTargetsOperationSignatureFactory) => {
+  const targetObjectNameSingular =
+    getJoinObjectNameSingular(objectNameSingular);
+
+  const targetObjectMetadataItem = objectMetadataItems.find(
+    (objectMetadataItem) =>
+      objectMetadataItem.nameSingular === targetObjectNameSingular,
+  );
+
+  const activityObjectMetadataItem = objectMetadataItems.find(
+    (objectMetadataItem) =>
+      objectMetadataItem.nameSingular === objectNameSingular,
+  );
+
+  if (
+    !isDefined(targetObjectMetadataItem) ||
+    !isDefined(activityObjectMetadataItem)
+  ) {
+    throw new Error(`Cannot find target or targetable object metadata item`);
+  }
+
+  const activityFieldKeys = generateDepthRecordGqlFieldsFromObject({
+    objectMetadataItems,
+    objectMetadataItem: activityObjectMetadataItem,
+    depth: 0,
+  });
+
+  return {
+    objectNameSingular: targetObjectNameSingular,
+    variables: {},
+    fields: {
+      id: true,
+      __typename: true,
+      createdAt: true,
+      updatedAt: true,
+      [objectNameSingular]: {
+        ...activityFieldKeys,
+        [targetObjectMetadataItem.namePlural]:
+          generateDepthRecordGqlFieldsFromObject({
+            objectMetadataItems,
+            objectMetadataItem: targetObjectMetadataItem,
+            depth: 1,
+          }),
+      },
+    },
+  };
+};

packages/twenty-front/src/modules/activities/hooks/__tests__/useActivities.test.tsx

@@ -15,7 +15,7 @@ jest.mock('@/object-record/hooks/useFindManyRecords', () => ({
 }));
 
 const mockActivityTarget = {
-  __typename: 'ActivityTarget',
+  __typename: 'TaskTarget',
   updatedAt: '2021-08-03T19:20:06.000Z',
   createdAt: '2021-08-03T19:20:06.000Z',
   personId: '1',
@@ -55,28 +55,21 @@ describe('useActivities', () => {
     );
     useActivityTargetsForTargetableObjectsMock.useActivityTargetsForTargetableObjects.mockReturnValue(
       {
-        activityTargets: [mockActivityTarget],
+        activityTargets: [{ ...mockActivityTarget, task: mockActivity }],
         loadingActivityTargets: false,
       },
     );
 
-    const useFindManyRecordsMock = jest.requireMock(
-      '@/object-record/hooks/useFindManyRecords',
-    );
-    useFindManyRecordsMock.useFindManyRecords.mockReturnValue({
-      records: [mockActivity],
-    });
-
     const { result } = renderHook(
       () => {
         const activities = useActivities({
           objectNameSingular: CoreObjectNameSingular.Task,
           targetableObjects: [
             { targetObjectNameSingular: 'company', id: '123' },
           ],
-          activitiesFilters: {},
-          activitiesOrderByVariables: [{}],
           skip: false,
+          limit: 10,
+          activityTargetsOrderByVariables: [{}],
         });
         return activities;
       },

packages/twenty-front/src/modules/activities/hooks/useActivities.ts

@@ -1,92 +1,84 @@
-import { isNonEmptyString } from '@sniptt/guards';
-import { useRecoilCallback } from 'recoil';
-
-import { findActivitiesOperationSignatureFactory } from '@/activities/graphql/operation-signatures/factories/findActivitiesOperationSignatureFactory';
 import { useActivityTargetsForTargetableObjects } from '@/activities/hooks/useActivityTargetsForTargetableObjects';
 import { type ActivityTargetableObject } from '@/activities/types/ActivityTargetableEntity';
 import { type Note } from '@/activities/types/Note';
+import { type NoteTarget } from '@/activities/types/NoteTarget';
 import { type Task } from '@/activities/types/Task';
-import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadataItems';
+import { type TaskTarget } from '@/activities/types/TaskTarget';
 import { type CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
+import { getRecordsFromRecordConnection } from '@/object-record/cache/utils/getRecordsFromRecordConnection';
 import { type RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
-import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
 import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState';
-import { type RecordGqlOperationFilter } from 'twenty-shared/types';
-import { sortByAscString } from '~/utils/array/sortByAscString';
+import { useRecoilCallback } from 'recoil';
+import { isDefined } from 'twenty-shared/utils';
 
 export const useActivities = <T extends Task | Note>({
   objectNameSingular,
   targetableObjects,
-  activitiesFilters,
-  activitiesOrderByVariables,
+  activityTargetsOrderByVariables,
   skip,
+  limit,
 }: {
-  objectNameSingular: CoreObjectNameSingular;
+  objectNameSingular: CoreObjectNameSingular.Note | CoreObjectNameSingular.Task;
   targetableObjects: ActivityTargetableObject[];
-  activitiesFilters: RecordGqlOperationFilter;
-  activitiesOrderByVariables: RecordGqlOperationOrderBy;
+  activityTargetsOrderByVariables: RecordGqlOperationOrderBy;
   skip?: boolean;
+  limit: number;
 }) => {
-  const { objectMetadataItems } = useObjectMetadataItems();
+  const updateActivitiesInStore = useRecoilCallback(
+    ({ set }) =>
+      (activityTargets: (TaskTarget | NoteTarget)[]) => {
+        for (const activityTarget of activityTargets) {
+          const activity = activityTarget[objectNameSingular];
+          set(recordStoreFamilyState(activity.id), activity);
+        }
+      },
+    [objectNameSingular],
+  );
 
-  const { activityTargets, loadingActivityTargets } =
-    useActivityTargetsForTargetableObjects({
-      objectNameSingular,
-      targetableObjects,
-      skip: skip,
-    });
+  const {
+    activityTargets,
+    loadingActivityTargets,
+    totalCountActivityTargets,
+    fetchMoreActivityTargets,
+    hasNextPage,
+  } = useActivityTargetsForTargetableObjects({
+    objectNameSingular,
+    targetableObjects,
+    skip: skip,
+    activityTargetsOrderByVariables,
+    onCompleted: updateActivitiesInStore,
+    limit,
+  });
 
-  const activityIds = [
-    ...new Set(
-      activityTargets
-        ? [
-            ...activityTargets
-              .map(
-                (activityTarget) =>
-                  activityTarget.taskId ?? activityTarget.noteId,
-              )
-              .filter(isNonEmptyString),
-          ].sort(sortByAscString)
-        : [],
-    ),
-  ];
+  const activities = activityTargets.map((activityTarget) => {
+    return activityTarget[objectNameSingular];
+  }) as T[];
 
-  const skipBecauseNoActivityTargetFound = activityIds.length === 0;
+  const fetchMoreActivities = async () => {
+    const result = await fetchMoreActivityTargets();
 
-  const filter: RecordGqlOperationFilter = {
-    id: {
-      in: activityIds,
-    },
-    ...activitiesFilters,
-  };
+    if (!isDefined(result?.data)) {
+      return [];
+    }
 
-  const FIND_ACTIVITIES_OPERATION_SIGNATURE =
-    findActivitiesOperationSignatureFactory({
-      objectMetadataItems,
-      objectNameSingular,
+    const activityTargets = getRecordsFromRecordConnection<
+      TaskTarget | NoteTarget
+    >({
+      recordConnection: result.data,
     });
 
-  const { records: activities, loading: loadingActivities } =
-    useFindManyRecords<Task | Note>({
-      skip: skip || loadingActivityTargets || skipBecauseNoActivityTargetFound,
-      objectNameSingular:
-        FIND_ACTIVITIES_OPERATION_SIGNATURE.objectNameSingular,
-      recordGqlFields: FIND_ACTIVITIES_OPERATION_SIGNATURE.fields,
-      filter,
-      orderBy: activitiesOrderByVariables,
-      onCompleted: useRecoilCallback(
-        ({ set }) =>
-          (activities) => {
-            for (const activity of activities) {
-              set(recordStoreFamilyState(activity.id), activity);
-            }
-          },
-        [],
-      ),
-    });
+    updateActivitiesInStore(activityTargets);
+
+    return activityTargets.map((activityTarget) => {
+      return activityTarget[objectNameSingular];
+    }) as T[];
+  };
 
   return {
     activities: activities as T[],
-    loading: loadingActivities || loadingActivityTargets,
+    loading: loadingActivityTargets,
+    totalCountActivities: totalCountActivityTargets,
+    fetchMoreActivities,
+    hasNextPage,
   };
 };

packages/twenty-front/src/modules/activities/hooks/useActivityTargetsForTargetableObjects.ts

@@ -7,21 +7,26 @@ import { type TaskTarget } from '@/activities/types/TaskTarget';
 import { getActivityTargetsFilter } from '@/activities/utils/getActivityTargetsFilter';
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
 import { type CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
+import { type RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
 import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
 
 export const useActivityTargetsForTargetableObjects = ({
   objectNameSingular,
   targetableObjects,
   skip,
   onCompleted,
+  activityTargetsOrderByVariables,
+  limit,
 }: {
-  objectNameSingular: CoreObjectNameSingular;
+  objectNameSingular: CoreObjectNameSingular.Note | CoreObjectNameSingular.Task;
   targetableObjects: Pick<
     ActivityTargetableObject,
     'id' | 'targetObjectNameSingular'
   >[];
   skip?: boolean;
   onCompleted?: (activityTargets: (TaskTarget | NoteTarget)[]) => void;
+  activityTargetsOrderByVariables: RecordGqlOperationOrderBy;
+  limit: number;
 }) => {
   const activityTargetsFilter = getActivityTargetsFilter({
     targetableObjects: targetableObjects,
@@ -38,18 +43,28 @@ export const useActivityTargetsForTargetableObjects = ({
   // TODO: We want to optimistically remove from this request
   //   If we are on a show page and we remove the current show page object corresponding activity target
   //   See also if we need to update useTimelineActivities
-  const { records: activityTargets, loading: loadingActivityTargets } =
-    useFindManyRecords<TaskTarget | NoteTarget>({
-      skip,
-      objectNameSingular:
-        FIND_ACTIVITY_TARGETS_OPERATION_SIGNATURE.objectNameSingular,
-      filter: activityTargetsFilter,
-      recordGqlFields: FIND_ACTIVITY_TARGETS_OPERATION_SIGNATURE.fields,
-      onCompleted,
-    });
+  const {
+    records: activityTargets,
+    loading: loadingActivityTargets,
+    totalCount: totalCountActivityTargets,
+    fetchMoreRecords: fetchMoreActivityTargets,
+    hasNextPage,
+  } = useFindManyRecords<TaskTarget | NoteTarget>({
+    skip,
+    objectNameSingular:
+      FIND_ACTIVITY_TARGETS_OPERATION_SIGNATURE.objectNameSingular,
+    filter: activityTargetsFilter,
+    recordGqlFields: FIND_ACTIVITY_TARGETS_OPERATION_SIGNATURE.fields,
+    onCompleted,
+    orderBy: activityTargetsOrderByVariables,
+    limit,
+  });
 
   return {
     activityTargets,
     loadingActivityTargets,
+    totalCountActivityTargets: totalCountActivityTargets ?? 0,
+    fetchMoreActivityTargets,
+    hasNextPage,
   };
 };

packages/twenty-front/src/modules/activities/inline-cell/hooks/useUpdateActivityTargetFromCell.ts

@@ -40,6 +40,7 @@ export const useUpdateActivityTargetFromCell = ({
       joinObjectNameSingular === ''
         ? activityObjectNameSingular
         : joinObjectNameSingular,
+    shouldMatchRootQueryFilter: true,
   });
 
   const { deleteOneRecord: deleteOneActivityTarget } = useDeleteOneRecord({