feat: record group insert at bottom when created (#9053)

Fix #9050 

When we add a new record in a record group this one should be added at
them bottom.

packages/twenty-front/src/modules/apollo/optimistic-effect/utils/triggerCreateRecordsOptimisticEffect.ts

@@ -1,5 +1,6 @@
 import { ApolloCache, StoreObject } from '@apollo/client';
 import { isNonEmptyString } from '@sniptt/guards';
+import { Buffer } from 'buffer';
 
 import { triggerUpdateRelationsOptimisticEffect } from '@/apollo/optimistic-effect/utils/triggerUpdateRelationsOptimisticEffect';
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
@@ -75,10 +76,21 @@ export const triggerCreateRecordsOptimisticEffect = ({
           rootQueryCachedObjectRecordConnection,
         );
 
+        const rootQueryCachedPageInfo = readField<{
+          startCursor?: string;
+          endCursor?: string;
+          hasNextPage?: boolean;
+          hasPreviousPage?: boolean;
+        }>('pageInfo', rootQueryCachedObjectRecordConnection);
+
         const nextRootQueryCachedRecordEdges = rootQueryCachedRecordEdges
           ? [...rootQueryCachedRecordEdges]
           : [];
 
+        const nextQueryCachedPageInfo = isDefined(rootQueryCachedPageInfo)
+          ? { ...rootQueryCachedPageInfo }
+          : {};
+
         const hasAddedRecords = recordsToCreate
           .map((recordToCreate) => {
             if (isNonEmptyString(recordToCreate.id)) {
@@ -116,11 +128,61 @@ export const triggerCreateRecordsOptimisticEffect = ({
               );
 
               if (recordToCreateReference && !recordAlreadyInCache) {
-                nextRootQueryCachedRecordEdges.unshift({
+                const cursor = Buffer.from(
+                  JSON.stringify({
+                    position: recordToCreate.position,
+                    id: recordToCreate.id,
+                  }),
+                  'utf-8',
+                ).toString('base64');
+
+                const edge = {
                   __typename: getEdgeTypename(objectMetadataItem.nameSingular),
                   node: recordToCreateReference,
-                  cursor: '',
-                });
+                  cursor,
+                };
+
+                if (
+                  !isDefined(recordToCreate.position) ||
+                  recordToCreate.position === 'first'
+                ) {
+                  nextRootQueryCachedRecordEdges.unshift(edge);
+                  nextQueryCachedPageInfo.startCursor = cursor;
+                } else if (recordToCreate.position === 'last') {
+                  nextRootQueryCachedRecordEdges.push(edge);
+                  nextQueryCachedPageInfo.endCursor = cursor;
+                } else if (typeof recordToCreate.position === 'number') {
+                  let index = Math.round(
+                    nextRootQueryCachedRecordEdges.length *
+                      recordToCreate.position,
+                  );
+
+                  if (recordToCreate.position < 0) {
+                    index = Math.max(
+                      0,
+                      nextRootQueryCachedRecordEdges.length +
+                        Math.round(recordToCreate.position),
+                    );
+                  } else if (recordToCreate.position > 1) {
+                    index = nextRootQueryCachedRecordEdges.length;
+                  }
+
+                  index = Math.max(
+                    0,
+                    Math.min(index, nextRootQueryCachedRecordEdges.length),
+                  );
+
+                  nextRootQueryCachedRecordEdges.splice(index, 0, edge);
+
+                  if (index === 0) {
+                    nextQueryCachedPageInfo.startCursor = cursor;
+                  } else if (
+                    index ===
+                    nextRootQueryCachedRecordEdges.length - 1
+                  ) {
+                    nextQueryCachedPageInfo.endCursor = cursor;
+                  }
+                }
 
                 return true;
               }
@@ -140,6 +202,7 @@ export const triggerCreateRecordsOptimisticEffect = ({
           totalCount: isDefined(rootQueryCachedRecordTotalCount)
             ? rootQueryCachedRecordTotalCount + 1
             : undefined,
+          pageInfo: nextQueryCachedPageInfo,
         };
       },
     },