feat: add RecordRelationFieldCardSection (#3176)

Closes #3123

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

packages/twenty-front/src/modules/object-record/hooks/useFieldContext.tsx

@@ -11,19 +11,21 @@ import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
 import { InlineCellHotkeyScope } from '@/object-record/record-inline-cell/types/InlineCellHotkeyScope';
 
 export const useFieldContext = ({
-  objectNameSingular,
-  fieldMetadataName,
-  objectRecordId,
-  fieldPosition,
   clearable,
+  fieldMetadataName,
+  fieldPosition,
+  isLabelIdentifier = false,
+  objectNameSingular,
+  objectRecordId,
 }: {
-  objectNameSingular: string;
-  objectRecordId: string;
+  clearable?: boolean;
   fieldMetadataName: string;
   fieldPosition: number;
-  clearable?: boolean;
+  isLabelIdentifier?: boolean;
+  objectNameSingular: string;
+  objectRecordId: string;
 }) => {
-  const { objectMetadataItem } = useObjectMetadataItem({
+  const { basePathToShowPage, objectMetadataItem } = useObjectMetadataItem({
     objectNameSingular,
   });
 
@@ -52,9 +54,12 @@ export const useFieldContext = ({
           <FieldContext.Provider
             key={objectRecordId + fieldMetadataItem.id}
             value={{
+              basePathToShowPage: isLabelIdentifier
+                ? basePathToShowPage
+                : undefined,
               entityId: objectRecordId,
               recoilScopeId: objectRecordId + fieldMetadataItem.id,
-              isLabelIdentifier: false,
+              isLabelIdentifier,
               fieldDefinition: formatFieldMetadataItemAsColumnDefinition({
                 field: fieldMetadataItem,
                 position: fieldPosition,

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

@@ -7,7 +7,7 @@ export const useFindOneRecord = <
   ObjectType extends { id: string } & Record<string, any>,
 >({
   objectNameSingular,
-  objectRecordId,
+  objectRecordId = '',
   onCompleted,
   depth,
   skip,
@@ -18,9 +18,7 @@ export const useFindOneRecord = <
   depth?: number;
 }) => {
   const { objectMetadataItem, findOneRecordQuery } = useObjectMetadataItem(
-    {
-      objectNameSingular,
-    },
+    { objectNameSingular },
     depth,
   );
 
@@ -29,20 +27,12 @@ export const useFindOneRecord = <
     { objectRecordId: string }
   >(findOneRecordQuery, {
     skip: !objectMetadataItem || !objectRecordId || skip,
-    variables: {
-      objectRecordId: objectRecordId ?? '',
-    },
-    onCompleted: (data) => {
-      if (onCompleted) {
-        onCompleted(data[objectNameSingular]);
-      }
-    },
+    variables: { objectRecordId },
+    onCompleted: (data) => onCompleted?.(data[objectNameSingular]),
   });
 
-  const record = data ? data[objectNameSingular] : undefined;
-
   return {
-    record,
+    record: data?.[objectNameSingular] || undefined,
     loading,
     error,
   };

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

@@ -0,0 +1,20 @@
+import { useRecoilCallback } from 'recoil';
+
+import { entityFieldsFamilyState } from '@/object-record/field/states/entityFieldsFamilyState';
+import { isDeeplyEqual } from '~/utils/isDeeplyEqual';
+
+// TODO: refactor with scoped state later
+export const useUpsertRecordFromState = () =>
+  useRecoilCallback(
+    ({ set, snapshot }) =>
+      <T extends { id: string }>(entity: T) => {
+        const currentEntity = snapshot
+          .getLoadable(entityFieldsFamilyState(entity.id))
+          .valueOrThrow();
+
+        if (!isDeeplyEqual(currentEntity, entity)) {
+          set(entityFieldsFamilyState(entity.id), entity);
+        }
+      },
+    [],
+  );