Introduce main identifier to power RelationFieldDisplay (#2577)

* Introduce main identifier to power RelationFieldDisplay, FilterDrodown, TableFirstColumn

* Apply to RelationPicker

front/src/modules/object-metadata/hooks/useComputeDefinitionsFromFieldMetadata.ts

@@ -26,7 +26,6 @@ export const useComputeDefinitionsFromFieldMetadata = (
       formatFieldMetadataItemAsColumnDefinition({
         position: index,
         field,
-        objectMetadataItem: objectMetadataItem,
       }),
     );
 

front/src/modules/object-metadata/hooks/useMapFieldMetadataToGraphQLQuery.ts

@@ -8,7 +8,7 @@ export const useMapFieldMetadataToGraphQLQuery = () => {
 
   const mapFieldMetadataToGraphQLQuery = (
     field: FieldMetadataItem,
-    maxDepthForRelations: number = 1,
+    maxDepthForRelations: number = 2,
   ): any => {
     if (maxDepthForRelations <= 0) {
       return '';

front/src/modules/object-metadata/hooks/useObjectMainIdentifier.ts

@@ -0,0 +1,56 @@
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { MainIdentifierMapper } from '@/ui/object/field/types/MainIdentifierMapper';
+
+export const useObjectMainIdentifier = (
+  objectMetadataItem?: ObjectMetadataItem,
+) => {
+  if (!objectMetadataItem) {
+    return {
+      mainIdentifierMapper: undefined,
+      mainIdentifierFieldMetadataId: undefined,
+      basePathToShowPage: undefined,
+    };
+  }
+
+  const mainIdentifierMapper: MainIdentifierMapper = (record: any) => {
+    if (objectMetadataItem.nameSingular === 'company') {
+      return {
+        id: record.id,
+        name: record.name,
+        avatarUrl: record.avatarUrl,
+        avatarType: 'squared',
+        record: record,
+      };
+    }
+
+    if (objectMetadataItem.nameSingular === 'workspaceMember') {
+      return {
+        id: record.id,
+        name: record.name.firstName + ' ' + record.name.lastName,
+        avatarUrl: record.avatarUrl,
+        avatarType: 'rounded',
+        record: record,
+      };
+    }
+
+    return {
+      id: record.id,
+      name: record.name,
+      avatarUrl: record.avatarUrl,
+      avatarType: 'rounded',
+      record: record,
+    };
+  };
+
+  const mainIdentifierFieldMetadataId = objectMetadataItem.fields.find(
+    ({ name }) => name === 'name',
+  )?.id;
+
+  const basePathToShowPage = `/object/${objectMetadataItem.nameSingular}/`;
+
+  return {
+    mainIdentifierMapper,
+    mainIdentifierFieldMetadataId,
+    basePathToShowPage,
+  };
+};

front/src/modules/object-metadata/types/FieldMetadataItem.ts

@@ -6,12 +6,18 @@ export type FieldMetadataItem = Omit<
 > & {
   fromRelationMetadata?:
     | (Pick<Relation, 'id' | 'toFieldMetadataId' | 'relationType'> & {
-        toObjectMetadata: Pick<Relation['toObjectMetadata'], 'id'>;
+        toObjectMetadata: Pick<
+          Relation['toObjectMetadata'],
+          'id' | 'nameSingular' | 'namePlural'
+        >;
       })
     | null;
   toRelationMetadata?:
     | (Pick<Relation, 'id' | 'fromFieldMetadataId' | 'relationType'> & {
-        fromObjectMetadata: Pick<Relation['fromObjectMetadata'], 'id'>;
+        fromObjectMetadata: Pick<
+          Relation['fromObjectMetadata'],
+          'id' | 'nameSingular' | 'namePlural'
+        >;
       })
     | null;
 };

front/src/modules/object-metadata/utils/formatFieldMetadataItemAsColumnDefinition.ts

@@ -1,32 +1,68 @@
 import { parseFieldRelationType } from '@/object-metadata/utils/parseFieldRelationType';
 import { FieldMetadata } from '@/ui/object/field/types/FieldMetadata';
+import { MainIdentifierMapper } from '@/ui/object/field/types/MainIdentifierMapper';
 import { ColumnDefinition } from '@/ui/object/record-table/types/ColumnDefinition';
+import { getLogoUrlFromDomainName } from '~/utils';
 
 import { FieldMetadataItem } from '../types/FieldMetadataItem';
-import { ObjectMetadataItem } from '../types/ObjectMetadataItem';
 
 import { parseFieldType } from './parseFieldType';
 
 export const formatFieldMetadataItemAsColumnDefinition = ({
   position,
   field,
-  objectMetadataItem,
 }: {
   position: number;
   field: FieldMetadataItem;
-  objectMetadataItem: Omit<ObjectMetadataItem, 'fields'>;
-}): ColumnDefinition<FieldMetadata> => ({
-  position,
-  fieldMetadataId: field.id,
-  label: field.label,
-  size: 100,
-  type: parseFieldType(field.type),
-  metadata: {
-    fieldName: field.name,
-    placeHolder: field.label,
-  },
-  iconName: field.icon ?? 'Icon123',
-  isVisible: true,
-  basePathToShowPage: `/object/${objectMetadataItem.nameSingular}/`,
-  relationType: parseFieldRelationType(field),
-});
+}): ColumnDefinition<FieldMetadata> => {
+  const relationObjectMetadataItem =
+    field.toRelationMetadata?.fromObjectMetadata;
+
+  const mainIdentifierMapper: MainIdentifierMapper = (record: any) => {
+    if (relationObjectMetadataItem?.nameSingular === 'company') {
+      return {
+        id: record.id,
+        name: record.name,
+        avatarUrl: getLogoUrlFromDomainName(record.domainName),
+        avatarType: 'squared',
+        record: record,
+      };
+    }
+    if (relationObjectMetadataItem?.nameSingular === 'workspaceMember') {
+      return {
+        id: record.id,
+        name: record.name.firstName + ' ' + record.name.lastName,
+        avatarUrl: record.avatarUrl,
+        avatarType: 'rounded',
+        record: record,
+      };
+    }
+
+    return {
+      id: record.id,
+      name: record.name,
+      avatarUrl: record.avatarUrl,
+      avatarType: 'rounded',
+      record: record,
+    };
+  };
+
+  return {
+    position,
+    fieldMetadataId: field.id,
+    label: field.label,
+    size: 100,
+    type: parseFieldType(field.type),
+    metadata: {
+      fieldName: field.name,
+      placeHolder: field.label,
+      mainIdentifierMapper: mainIdentifierMapper,
+      relationType: parseFieldRelationType(field),
+      searchFields: ['name'],
+      objectMetadataNamePlural: relationObjectMetadataItem?.namePlural,
+      objectMetadataNameSingular: relationObjectMetadataItem?.nameSingular,
+    },
+    iconName: field.icon ?? 'Icon123',
+    isVisible: true,
+  };
+};