☑️ Refacto "Select All/Unselect all" on indexes

packages/twenty-front/src/modules/object-record/hooks/__tests__/useDeleteManyRecords.test.tsx

@@ -49,7 +49,7 @@ describe('useDeleteManyRecords', () => {
     await act(async () => {
       const res = await result.current.deleteManyRecords(people);
       expect(res).toBeDefined();
-      expect(res).toHaveProperty('id');
+      expect(res[0]).toHaveProperty('id');
     });
 
     expect(mocks[0].result).toHaveBeenCalled();

packages/twenty-front/src/modules/object-record/hooks/useCreateManyRecords.ts

@@ -1,4 +1,8 @@
-import { useApolloClient } from '@apollo/client';
+import {
+  FetchResult,
+  InternalRefetchQueriesInclude,
+  useApolloClient,
+} from '@apollo/client';
 import { v4 } from 'uuid';
 
 import { triggerCreateRecordsOptimisticEffect } from '@/apollo/optimistic-effect/utils/triggerCreateRecordsOptimisticEffect';
@@ -18,6 +22,10 @@ type useCreateManyRecordsProps = {
   objectNameSingular: string;
   recordGqlFields?: RecordGqlOperationGqlRecordFields;
   skipPostOptmisticEffect?: boolean;
+  refetchQueries?:
+    | InternalRefetchQueriesInclude
+    | ((result: FetchResult<any>) => InternalRefetchQueriesInclude)
+    | undefined;
 };
 
 export const useCreateManyRecords = <
@@ -26,6 +34,7 @@ export const useCreateManyRecords = <
   objectNameSingular,
   recordGqlFields,
   skipPostOptmisticEffect = false,
+  refetchQueries,
 }: useCreateManyRecordsProps) => {
   const apolloClient = useApolloClient();
 
@@ -107,6 +116,7 @@ export const useCreateManyRecords = <
           objectMetadataItems,
         });
       },
+      refetchQueries,
     });
 
     return createdObjects.data?.[mutationResponseField] ?? [];

packages/twenty-front/src/modules/object-record/hooks/useDeleteManyRecords.ts

@@ -18,6 +18,16 @@ type DeleteManyRecordsOptions = {
   skipOptimisticEffect?: boolean;
 };
 
+const chunkArray = <T>(array: T[], chunkSize: number): T[][] =>
+  array.reduce<T[][]>((acc, item, index) => {
+    const chunkIndex = Math.floor(index / chunkSize);
+    if (!acc[chunkIndex]) {
+      acc[chunkIndex] = [];
+    }
+    acc[chunkIndex].push(item);
+    return acc;
+  }, []);
+
 export const useDeleteManyRecords = ({
   objectNameSingular,
 }: useDeleteOneRecordProps) => {
@@ -41,7 +51,7 @@ export const useDeleteManyRecords = ({
     objectMetadataItem.namePlural,
   );
 
-  const deleteManyRecords = async (
+  const deleteRecordsWithIds = async (
     idsToDelete: string[],
     options?: DeleteManyRecordsOptions,
   ) => {
@@ -81,5 +91,16 @@ export const useDeleteManyRecords = ({
     return deletedRecords.data?.[mutationResponseField] ?? null;
   };
 
+  const deleteManyRecords = async (
+    idsToDelete: string[],
+    options?: DeleteManyRecordsOptions,
+    chunkSize = 30,
+  ) => {
+    const chunkedIds = chunkArray(idsToDelete, chunkSize);
+    return Promise.all(
+      chunkedIds.map((ids) => deleteRecordsWithIds(ids, options)),
+    );
+  };
+
   return { deleteManyRecords };
 };

packages/twenty-front/src/modules/object-record/hooks/useFindManyRecords.ts

@@ -1,43 +1,23 @@
-import { useCallback, useMemo } from 'react';
 import { useQuery, WatchQueryFetchPolicy } from '@apollo/client';
-import { isNonEmptyArray } from '@apollo/client/utilities';
-import { isNonEmptyString } from '@sniptt/guards';
-import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil';
+import { useRecoilValue } from 'recoil';
 
 import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
-import { isAggregationEnabled } from '@/object-metadata/utils/isAggregationEnabled';
 import { getRecordsFromRecordConnection } from '@/object-record/cache/utils/getRecordsFromRecordConnection';
 import { RecordGqlConnection } from '@/object-record/graphql/types/RecordGqlConnection';
-import { RecordGqlEdge } from '@/object-record/graphql/types/RecordGqlEdge';
 import { RecordGqlOperationFindManyResult } from '@/object-record/graphql/types/RecordGqlOperationFindManyResult';
 import { RecordGqlOperationGqlRecordFields } from '@/object-record/graphql/types/RecordGqlOperationGqlRecordFields';
 import { RecordGqlOperationVariables } from '@/object-record/graphql/types/RecordGqlOperationVariables';
 import { useFindManyRecordsQuery } from '@/object-record/hooks/useFindManyRecordsQuery';
 import { ObjectRecord } from '@/object-record/types/ObjectRecord';
-import { filterUniqueRecordEdgesByCursor } from '@/object-record/utils/filterUniqueRecordEdgesByCursor';
+import { useFindManyRecordsState } from '@/object-record/utils/useFindManyRecordsUtils';
 import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
 import { isDefined } from '~/utils/isDefined';
 import { logError } from '~/utils/logError';
-import { capitalize } from '~/utils/string/capitalize';
 
-import { cursorFamilyState } from '../states/cursorFamilyState';
-import { hasNextPageFamilyState } from '../states/hasNextPageFamilyState';
-import { isFetchingMoreRecordsFamilyState } from '../states/isFetchingMoreRecordsFamilyState';
-
-export const useFindManyRecords = <T extends ObjectRecord = ObjectRecord>({
-  objectNameSingular,
-  filter,
-  orderBy,
-  limit,
-  onCompleted,
-  onError,
-  skip,
-  recordGqlFields,
-  fetchPolicy,
-}: ObjectMetadataItemIdentifier &
+export type UseFindManyRecordsParams<T> = ObjectMetadataItemIdentifier &
   RecordGqlOperationVariables & {
     onCompleted?: (
       records: T[],
@@ -50,37 +30,29 @@ export const useFindManyRecords = <T extends ObjectRecord = ObjectRecord>({
     skip?: boolean;
     recordGqlFields?: RecordGqlOperationGqlRecordFields;
     fetchPolicy?: WatchQueryFetchPolicy;
-  }) => {
-  const findManyQueryStateIdentifier =
-    objectNameSingular +
-    JSON.stringify(filter) +
-    JSON.stringify(orderBy) +
-    limit;
-
-  const [lastCursor, setLastCursor] = useRecoilState(
-    cursorFamilyState(findManyQueryStateIdentifier),
-  );
-
-  const [hasNextPage, setHasNextPage] = useRecoilState(
-    hasNextPageFamilyState(findManyQueryStateIdentifier),
-  );
-
-  const setIsFetchingMoreObjects = useSetRecoilState(
-    isFetchingMoreRecordsFamilyState(findManyQueryStateIdentifier),
-  );
+  };
 
+export const useFindManyRecords = <T extends ObjectRecord = ObjectRecord>({
+  objectNameSingular,
+  filter,
+  orderBy,
+  limit,
+  onCompleted,
+  skip,
+  recordGqlFields,
+  fetchPolicy,
+  onError,
+}: UseFindManyRecordsParams<T>) => {
+  const { enqueueSnackBar } = useSnackBar();
+  const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
   const { objectMetadataItem } = useObjectMetadataItem({
     objectNameSingular,
   });
-
   const { findManyRecordsQuery } = useFindManyRecordsQuery({
     objectNameSingular,
     recordGqlFields,
   });
 
-  const { enqueueSnackBar } = useSnackBar();
-  const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
-
   const { data, loading, error, fetchMore } =
     useQuery<RecordGqlOperationFindManyResult>(findManyRecordsQuery, {
       skip: skip || !objectMetadataItem || !currentWorkspaceMember,
@@ -126,111 +98,25 @@ export const useFindManyRecords = <T extends ObjectRecord = ObjectRecord>({
       },
     });
 
-  const fetchMoreRecords = useCallback(async () => {
-    // Remote objects does not support hasNextPage. We cannot rely on it to fetch more records.
-    if (hasNextPage || (!isAggregationEnabled(objectMetadataItem) && !error)) {
-      setIsFetchingMoreObjects(true);
-
-      try {
-        await fetchMore({
-          variables: {
-            filter,
-            orderBy,
-            lastCursor: isNonEmptyString(lastCursor) ? lastCursor : undefined,
-          },
-          updateQuery: (prev, { fetchMoreResult }) => {
-            const previousEdges = prev?.[objectMetadataItem.namePlural]?.edges;
-            const nextEdges =
-              fetchMoreResult?.[objectMetadataItem.namePlural]?.edges;
-
-            let newEdges: RecordGqlEdge[] = previousEdges ?? [];
-
-            if (isNonEmptyArray(nextEdges)) {
-              newEdges = filterUniqueRecordEdgesByCursor([
-                ...newEdges,
-                ...(fetchMoreResult?.[objectMetadataItem.namePlural]?.edges ??
-                  []),
-              ]);
-            }
-
-            const pageInfo =
-              fetchMoreResult?.[objectMetadataItem.namePlural]?.pageInfo;
-
-            if (isDefined(data?.[objectMetadataItem.namePlural])) {
-              setLastCursor(pageInfo.endCursor ?? '');
-              setHasNextPage(pageInfo.hasNextPage ?? false);
-            }
-
-            const records = getRecordsFromRecordConnection({
-              recordConnection: {
-                edges: newEdges,
-                pageInfo,
-              },
-            }) as T[];
-
-            onCompleted?.(records, {
-              pageInfo,
-              totalCount:
-                fetchMoreResult?.[objectMetadataItem.namePlural]?.totalCount,
-            });
-
-            return Object.assign({}, prev, {
-              [objectMetadataItem.namePlural]: {
-                __typename: `${capitalize(
-                  objectMetadataItem.nameSingular,
-                )}Connection`,
-                edges: newEdges,
-                pageInfo:
-                  fetchMoreResult?.[objectMetadataItem.namePlural].pageInfo,
-                totalCount:
-                  fetchMoreResult?.[objectMetadataItem.namePlural].totalCount,
-              },
-            } as RecordGqlOperationFindManyResult);
-          },
-        });
-      } catch (error) {
-        logError(
-          `fetchMoreObjects for "${objectMetadataItem.namePlural}" error : ` +
-            error,
-        );
-        enqueueSnackBar(
-          `Error during fetchMoreObjects for "${objectMetadataItem.namePlural}", ${error}`,
-          {
-            variant: SnackBarVariant.Error,
-          },
-        );
-      } finally {
-        setIsFetchingMoreObjects(false);
-      }
-    }
-  }, [
+  const {
+    findManyQueryStateIdentifier,
+    setLastCursor,
+    setHasNextPage,
+    fetchMoreRecords,
+    totalCount,
+    records,
     hasNextPage,
-    objectMetadataItem,
-    error,
-    setIsFetchingMoreObjects,
-    fetchMore,
+  } = useFindManyRecordsState<T>({
+    objectNameSingular,
     filter,
     orderBy,
-    lastCursor,
-    data,
+    limit,
     onCompleted,
-    setLastCursor,
-    setHasNextPage,
-    enqueueSnackBar,
-  ]);
-
-  const totalCount = data?.[objectMetadataItem.namePlural]?.totalCount;
-
-  const records = useMemo(
-    () =>
-      data?.[objectMetadataItem.namePlural]
-        ? getRecordsFromRecordConnection<T>({
-            recordConnection: data?.[objectMetadataItem.namePlural],
-          })
-        : ([] as T[]),
-
-    [data, objectMetadataItem.namePlural],
-  );
+    fetchMore,
+    data,
+    error,
+    objectMetadataItem,
+  });
 
   return {
     objectMetadataItem,