Migrate field widgets to backend (#18808)

- Renamed FieldConfiguration's layout field to fieldDisplayMode as it
caused issues with the layout field of BarChartConfiguration
- Create relation Field widgets for standard objects

---------

Co-authored-by: Charles Bochet <charles@twenty.com>

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/constants/standard-page-layout-tabs.template.ts

@@ -1,10 +1,10 @@
 import {
   PageLayoutTabLayoutMode,
+  type GridPosition,
   type PageLayoutWidgetCanvasPosition,
   type PageLayoutWidgetConditionalDisplay,
   type PageLayoutWidgetGridPosition,
   type PageLayoutWidgetVerticalListPosition,
-  type GridPosition,
 } from 'twenty-shared/types';
 
 import { WidgetType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-type.enum';
@@ -67,6 +67,18 @@ export const VERTICAL_LIST_LAYOUT_POSITIONS = {
     layoutMode: PageLayoutTabLayoutMode.VERTICAL_LIST,
     index: 0,
   },
+  SECOND: {
+    layoutMode: PageLayoutTabLayoutMode.VERTICAL_LIST,
+    index: 1,
+  },
+  THIRD: {
+    layoutMode: PageLayoutTabLayoutMode.VERTICAL_LIST,
+    index: 2,
+  },
+  FOURTH: {
+    layoutMode: PageLayoutTabLayoutMode.VERTICAL_LIST,
+    index: 3,
+  },
 } as const satisfies Record<string, PageLayoutWidgetVerticalListPosition>;
 
 export const CANVAS_LAYOUT_POSITIONS = {

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/utils/__tests__/__snapshots__/get-standard-page-layout-metadata-related-entity-ids.util.spec.ts.snap

@@ -6,58 +6,67 @@ exports[`getStandardPageLayoutMetadataRelatedEntityIds should return standard pa
     "id": "00000000-0000-0000-0000-000000000011",
     "tabs": {
       "calendar": {
-        "id": "00000000-0000-0000-0000-000000000024",
+        "id": "00000000-0000-0000-0000-000000000027",
         "widgets": {
           "calendar": {
-            "id": "00000000-0000-0000-0000-000000000025",
+            "id": "00000000-0000-0000-0000-000000000028",
           },
         },
       },
       "emails": {
-        "id": "00000000-0000-0000-0000-000000000022",
+        "id": "00000000-0000-0000-0000-000000000025",
         "widgets": {
           "emails": {
-            "id": "00000000-0000-0000-0000-000000000023",
+            "id": "00000000-0000-0000-0000-000000000026",
           },
         },
       },
       "files": {
-        "id": "00000000-0000-0000-0000-000000000020",
+        "id": "00000000-0000-0000-0000-000000000023",
         "widgets": {
           "files": {
-            "id": "00000000-0000-0000-0000-000000000021",
+            "id": "00000000-0000-0000-0000-000000000024",
           },
         },
       },
       "home": {
         "id": "00000000-0000-0000-0000-000000000012",
         "widgets": {
+          "accountOwner": {
+            "id": "00000000-0000-0000-0000-000000000015",
+          },
           "fields": {
             "id": "00000000-0000-0000-0000-000000000013",
           },
+          "opportunities": {
+            "id": "00000000-0000-0000-0000-000000000016",
+          },
+          "people": {
+            "id": "00000000-0000-0000-0000-000000000014",
+          },
         },
       },
       "notes": {
-        "id": "00000000-0000-0000-0000-000000000018",
+        "id": "00000000-0000-0000-0000-000000000021",
         "widgets": {
           "notes": {
-            "id": "00000000-0000-0000-0000-000000000019",
+            "id": "00000000-0000-0000-0000-000000000022",
           },
         },
       },
       "tasks": {
-        "id": "00000000-0000-0000-0000-000000000016",
+        "id": "00000000-0000-0000-0000-000000000019",
         "widgets": {
           "tasks": {
-            "id": "00000000-0000-0000-0000-000000000017",
+            "id": "00000000-0000-0000-0000-000000000020",
           },
         },
       },
       "timeline": {
-        "id": "00000000-0000-0000-0000-000000000014",
+        "id": "00000000-0000-0000-0000-000000000017",
         "widgets": {
           "timeline": {
-            "id": "00000000-0000-0000-0000-000000000015",
+            "id": "00000000-0000-0000-0000-000000000018",
           },
         },
       },
@@ -98,257 +107,275 @@ exports[`getStandardPageLayoutMetadataRelatedEntityIds should return standard pa
     },
   },
   "noteRecordPage": {
-    "id": "00000000-0000-0000-0000-000000000056",
+    "id": "00000000-0000-0000-0000-000000000064",
     "tabs": {
       "files": {
-        "id": "00000000-0000-0000-0000-000000000064",
+        "id": "00000000-0000-0000-0000-000000000072",
         "widgets": {
           "files": {
-            "id": "00000000-0000-0000-0000-000000000065",
+            "id": "00000000-0000-0000-0000-000000000073",
           },
         },
       },
       "home": {
-        "id": "00000000-0000-0000-0000-000000000057",
+        "id": "00000000-0000-0000-0000-000000000065",
         "widgets": {
           "fields": {
-            "id": "00000000-0000-0000-0000-000000000058",
+            "id": "00000000-0000-0000-0000-000000000066",
           },
           "noteRichText": {
-            "id": "00000000-0000-0000-0000-000000000059",
+            "id": "00000000-0000-0000-0000-000000000067",
           },
         },
       },
       "note": {
-        "id": "00000000-0000-0000-0000-000000000060",
+        "id": "00000000-0000-0000-0000-000000000068",
         "widgets": {
           "noteRichText": {
-            "id": "00000000-0000-0000-0000-000000000061",
+            "id": "00000000-0000-0000-0000-000000000069",
           },
         },
       },
       "timeline": {
-        "id": "00000000-0000-0000-0000-000000000062",
+        "id": "00000000-0000-0000-0000-000000000070",
         "widgets": {
           "timeline": {
-            "id": "00000000-0000-0000-0000-000000000063",
+            "id": "00000000-0000-0000-0000-000000000071",
           },
         },
       },
     },
   },
   "opportunityRecordPage": {
-    "id": "00000000-0000-0000-0000-000000000041",
+    "id": "00000000-0000-0000-0000-000000000046",
     "tabs": {
       "calendar": {
-        "id": "00000000-0000-0000-0000-000000000054",
+        "id": "00000000-0000-0000-0000-000000000062",
         "widgets": {
           "calendar": {
-            "id": "00000000-0000-0000-0000-000000000055",
+            "id": "00000000-0000-0000-0000-000000000063",
           },
         },
       },
       "emails": {
-        "id": "00000000-0000-0000-0000-000000000052",
+        "id": "00000000-0000-0000-0000-000000000060",
         "widgets": {
           "emails": {
-            "id": "00000000-0000-0000-0000-000000000053",
+            "id": "00000000-0000-0000-0000-000000000061",
           },
         },
       },
       "files": {
-        "id": "00000000-0000-0000-0000-000000000050",
+        "id": "00000000-0000-0000-0000-000000000058",
         "widgets": {
           "files": {
-            "id": "00000000-0000-0000-0000-000000000051",
+            "id": "00000000-0000-0000-0000-000000000059",
           },
         },
       },
       "home": {
-        "id": "00000000-0000-0000-0000-000000000042",
+        "id": "00000000-0000-0000-0000-000000000047",
         "widgets": {
-          "fields": {
-            "id": "00000000-0000-0000-0000-000000000043",
+          "company": {
+            "id": "00000000-0000-0000-0000-000000000050",
           },
-        },
-      },
-      "notes": {
-        "id": "00000000-0000-0000-0000-000000000048",
-        "widgets": {
-          "notes": {
+          "fields": {
+            "id": "00000000-0000-0000-0000-000000000048",
+          },
+          "owner": {
+            "id": "00000000-0000-0000-0000-000000000051",
+          },
+          "pointOfContact": {
             "id": "00000000-0000-0000-0000-000000000049",
           },
         },
       },
+      "notes": {
+        "id": "00000000-0000-0000-0000-000000000056",
+        "widgets": {
+          "notes": {
+            "id": "00000000-0000-0000-0000-000000000057",
+          },
+        },
+      },
       "tasks": {
-        "id": "00000000-0000-0000-0000-000000000046",
+        "id": "00000000-0000-0000-0000-000000000054",
         "widgets": {
           "tasks": {
-            "id": "00000000-0000-0000-0000-000000000047",
+            "id": "00000000-0000-0000-0000-000000000055",
           },
         },
       },
       "timeline": {
-        "id": "00000000-0000-0000-0000-000000000044",
+        "id": "00000000-0000-0000-0000-000000000052",
         "widgets": {
           "timeline": {
-            "id": "00000000-0000-0000-0000-000000000045",
+            "id": "00000000-0000-0000-0000-000000000053",
           },
         },
       },
     },
   },
   "personRecordPage": {
-    "id": "00000000-0000-0000-0000-000000000026",
+    "id": "00000000-0000-0000-0000-000000000029",
     "tabs": {
       "calendar": {
-        "id": "00000000-0000-0000-0000-000000000039",
+        "id": "00000000-0000-0000-0000-000000000044",
         "widgets": {
           "calendar": {
-            "id": "00000000-0000-0000-0000-000000000040",
+            "id": "00000000-0000-0000-0000-000000000045",
           },
         },
       },
       "emails": {
-        "id": "00000000-0000-0000-0000-000000000037",
+        "id": "00000000-0000-0000-0000-000000000042",
         "widgets": {
           "emails": {
-            "id": "00000000-0000-0000-0000-000000000038",
+            "id": "00000000-0000-0000-0000-000000000043",
           },
         },
       },
       "files": {
-        "id": "00000000-0000-0000-0000-000000000035",
+        "id": "00000000-0000-0000-0000-000000000040",
         "widgets": {
           "files": {
-            "id": "00000000-0000-0000-0000-000000000036",
+            "id": "00000000-0000-0000-0000-000000000041",
           },
         },
       },
       "home": {
-        "id": "00000000-0000-0000-0000-000000000027",
+        "id": "00000000-0000-0000-0000-000000000030",
         "widgets": {
+          "company": {
+            "id": "00000000-0000-0000-0000-000000000032",
+          },
           "fields": {
-            "id": "00000000-0000-0000-0000-000000000028",
+            "id": "00000000-0000-0000-0000-000000000031",
+          },
+          "pointOfContactForOpportunities": {
+            "id": "00000000-0000-0000-0000-000000000033",
           },
         },
       },
       "notes": {
-        "id": "00000000-0000-0000-0000-000000000033",
+        "id": "00000000-0000-0000-0000-000000000038",
         "widgets": {
           "notes": {
-            "id": "00000000-0000-0000-0000-000000000034",
+            "id": "00000000-0000-0000-0000-000000000039",
           },
         },
       },
       "tasks": {
-        "id": "00000000-0000-0000-0000-000000000031",
+        "id": "00000000-0000-0000-0000-000000000036",
         "widgets": {
           "tasks": {
-            "id": "00000000-0000-0000-0000-000000000032",
+            "id": "00000000-0000-0000-0000-000000000037",
           },
         },
       },
       "timeline": {
-        "id": "00000000-0000-0000-0000-000000000029",
+        "id": "00000000-0000-0000-0000-000000000034",
         "widgets": {
           "timeline": {
-            "id": "00000000-0000-0000-0000-000000000030",
+            "id": "00000000-0000-0000-0000-000000000035",
           },
         },
       },
     },
   },
   "taskRecordPage": {
-    "id": "00000000-0000-0000-0000-000000000066",
+    "id": "00000000-0000-0000-0000-000000000074",
     "tabs": {
       "files": {
-        "id": "00000000-0000-0000-0000-000000000074",
+        "id": "00000000-0000-0000-0000-000000000083",
         "widgets": {
           "files": {
-            "id": "00000000-0000-0000-0000-000000000075",
+            "id": "00000000-0000-0000-0000-000000000084",
           },
         },
       },
       "home": {
-        "id": "00000000-0000-0000-0000-000000000067",
+        "id": "00000000-0000-0000-0000-000000000075",
         "widgets": {
+          "assignee": {
+            "id": "00000000-0000-0000-0000-000000000078",
+          },
           "fields": {
-            "id": "00000000-0000-0000-0000-000000000068",
+            "id": "00000000-0000-0000-0000-000000000076",
           },
           "taskRichText": {
-            "id": "00000000-0000-0000-0000-000000000069",
+            "id": "00000000-0000-0000-0000-000000000077",
           },
         },
       },
       "note": {
-        "id": "00000000-0000-0000-0000-000000000070",
+        "id": "00000000-0000-0000-0000-000000000079",
         "widgets": {
           "taskRichText": {
-            "id": "00000000-0000-0000-0000-000000000071",
+            "id": "00000000-0000-0000-0000-000000000080",
           },
         },
       },
       "timeline": {
-        "id": "00000000-0000-0000-0000-000000000072",
+        "id": "00000000-0000-0000-0000-000000000081",
         "widgets": {
           "timeline": {
-            "id": "00000000-0000-0000-0000-000000000073",
+            "id": "00000000-0000-0000-0000-000000000082",
           },
         },
       },
     },
   },
   "workflowRecordPage": {
-    "id": "00000000-0000-0000-0000-000000000076",
+    "id": "00000000-0000-0000-0000-000000000085",
     "tabs": {
       "flow": {
-        "id": "00000000-0000-0000-0000-000000000077",
+        "id": "00000000-0000-0000-0000-000000000086",
         "widgets": {
           "workflow": {
-            "id": "00000000-0000-0000-0000-000000000078",
+            "id": "00000000-0000-0000-0000-000000000087",
           },
         },
       },
     },
   },
   "workflowRunRecordPage": {
-    "id": "00000000-0000-0000-0000-000000000084",
+    "id": "00000000-0000-0000-0000-000000000093",
     "tabs": {
       "flow": {
-        "id": "00000000-0000-0000-0000-000000000087",
+        "id": "00000000-0000-0000-0000-000000000096",
         "widgets": {
           "workflowRun": {
-            "id": "00000000-0000-0000-0000-000000000088",
+            "id": "00000000-0000-0000-0000-000000000097",
           },
         },
       },
       "home": {
-        "id": "00000000-0000-0000-0000-000000000085",
+        "id": "00000000-0000-0000-0000-000000000094",
         "widgets": {
           "fields": {
-            "id": "00000000-0000-0000-0000-000000000086",
+            "id": "00000000-0000-0000-0000-000000000095",
           },
         },
       },
     },
   },
   "workflowVersionRecordPage": {
-    "id": "00000000-0000-0000-0000-000000000079",
+    "id": "00000000-0000-0000-0000-000000000088",
     "tabs": {
       "flow": {
-        "id": "00000000-0000-0000-0000-000000000082",
+        "id": "00000000-0000-0000-0000-000000000091",
         "widgets": {
           "workflowVersion": {
-            "id": "00000000-0000-0000-0000-000000000083",
+            "id": "00000000-0000-0000-0000-000000000092",
           },
         },
       },
       "home": {
-        "id": "00000000-0000-0000-0000-000000000080",
+        "id": "00000000-0000-0000-0000-000000000089",
         "widgets": {
           "fields": {
-            "id": "00000000-0000-0000-0000-000000000081",
+            "id": "00000000-0000-0000-0000-000000000090",
           },
         },
       },

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/utils/page-layout-config/standard-company-page-layout.config.ts

@@ -1,8 +1,11 @@
 import { STANDARD_OBJECTS } from 'twenty-shared/metadata';
 
+import { WidgetType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-type.enum';
 import { PageLayoutType } from 'src/engine/metadata-modules/page-layout/enums/page-layout-type.enum';
 import {
+  GRID_POSITIONS,
   TAB_PROPS,
+  VERTICAL_LIST_LAYOUT_POSITIONS,
   WIDGET_PROPS,
 } from 'src/engine/workspace-manager/twenty-standard-application/constants/standard-page-layout-tabs.template';
 import {
@@ -19,6 +22,33 @@ const COMPANY_PAGE_TABS = {
         universalIdentifier: '20202020-ac01-4001-8001-c0aba11c0111',
         ...WIDGET_PROPS.fields,
       },
+      people: {
+        universalIdentifier: '20202020-ac01-4001-8001-c0aba11c0112',
+        title: 'People',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.SECOND,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.company.fields.people.universalIdentifier,
+      },
+      accountOwner: {
+        universalIdentifier: '20202020-ac01-4001-8001-c0aba11c0113',
+        title: 'Account Owner',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.THIRD,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.company.fields.accountOwner.universalIdentifier,
+      },
+      opportunities: {
+        universalIdentifier: '20202020-ac01-4001-8001-c0aba11c0114',
+        title: 'Opportunities',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.FOURTH,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.company.fields.opportunities.universalIdentifier,
+      },
     },
   },
   timeline: {

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/utils/page-layout-config/standard-opportunity-page-layout.config.ts

@@ -1,8 +1,11 @@
 import { STANDARD_OBJECTS } from 'twenty-shared/metadata';
 
+import { WidgetType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-type.enum';
 import { PageLayoutType } from 'src/engine/metadata-modules/page-layout/enums/page-layout-type.enum';
 import {
+  GRID_POSITIONS,
   TAB_PROPS,
+  VERTICAL_LIST_LAYOUT_POSITIONS,
   WIDGET_PROPS,
 } from 'src/engine/workspace-manager/twenty-standard-application/constants/standard-page-layout-tabs.template';
 import {
@@ -19,6 +22,34 @@ const OPPORTUNITY_PAGE_TABS = {
         universalIdentifier: '20202020-ac03-4003-8003-0aa0b1ca1311',
         ...WIDGET_PROPS.fields,
       },
+      pointOfContact: {
+        universalIdentifier: '20202020-ac03-4003-8003-0aa0b1ca1312',
+        title: 'Point of Contact',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.SECOND,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.opportunity.fields.pointOfContact
+            .universalIdentifier,
+      },
+      company: {
+        universalIdentifier: '20202020-ac03-4003-8003-0aa0b1ca1313',
+        title: 'Company',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.THIRD,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.opportunity.fields.company.universalIdentifier,
+      },
+      owner: {
+        universalIdentifier: '20202020-ac03-4003-8003-0aa0b1ca1314',
+        title: 'Owner',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.FOURTH,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.opportunity.fields.owner.universalIdentifier,
+      },
     },
   },
   timeline: {

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/utils/page-layout-config/standard-page-layout-config.type.ts

@@ -1,8 +1,8 @@
 import {
+  type GridPosition,
   type PageLayoutTabLayoutMode,
   type PageLayoutWidgetConditionalDisplay,
   type PageLayoutWidgetPosition,
-  type GridPosition,
 } from 'twenty-shared/types';
 
 import { type WidgetType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-type.enum';
@@ -15,6 +15,7 @@ export type StandardPageLayoutWidgetConfig = {
   gridPosition?: GridPosition;
   position?: PageLayoutWidgetPosition;
   conditionalDisplay?: PageLayoutWidgetConditionalDisplay | null;
+  fieldUniversalIdentifier?: string;
 };
 
 export type StandardPageLayoutTabConfig = {
@@ -42,6 +43,7 @@ export type StandardRecordPageWidgetConfig = {
   gridPosition: GridPosition;
   position?: PageLayoutWidgetPosition;
   conditionalDisplay?: PageLayoutWidgetConditionalDisplay | null;
+  fieldUniversalIdentifier?: string;
 };
 
 export type StandardRecordPageTabConfig = {

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/utils/page-layout-config/standard-person-page-layout.config.ts

@@ -1,8 +1,11 @@
 import { STANDARD_OBJECTS } from 'twenty-shared/metadata';
 
+import { WidgetType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-type.enum';
 import { PageLayoutType } from 'src/engine/metadata-modules/page-layout/enums/page-layout-type.enum';
 import {
+  GRID_POSITIONS,
   TAB_PROPS,
+  VERTICAL_LIST_LAYOUT_POSITIONS,
   WIDGET_PROPS,
 } from 'src/engine/workspace-manager/twenty-standard-application/constants/standard-page-layout-tabs.template';
 import {
@@ -19,6 +22,25 @@ const PERSON_PAGE_TABS = {
         universalIdentifier: '20202020-ac02-4002-8002-ae0a1ea11211',
         ...WIDGET_PROPS.fields,
       },
+      company: {
+        universalIdentifier: '20202020-ac02-4002-8002-ae0a1ea11212',
+        title: 'Company',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.SECOND,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.person.fields.company.universalIdentifier,
+      },
+      pointOfContactForOpportunities: {
+        universalIdentifier: '20202020-ac02-4002-8002-ae0a1ea11213',
+        title: 'Opportunities',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.THIRD,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.person.fields.pointOfContactForOpportunities
+            .universalIdentifier,
+      },
     },
   },
   timeline: {

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/utils/page-layout-config/standard-task-page-layout.config.ts

@@ -1,10 +1,13 @@
 import { STANDARD_OBJECTS } from 'twenty-shared/metadata';
 
+import { WidgetType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-type.enum';
 import { PageLayoutType } from 'src/engine/metadata-modules/page-layout/enums/page-layout-type.enum';
 import {
   CONDITIONAL_DISPLAY_DEVICE_DESKTOP,
   CONDITIONAL_DISPLAY_DEVICE_MOBILE,
+  GRID_POSITIONS,
   TAB_PROPS,
+  VERTICAL_LIST_LAYOUT_POSITIONS,
   WIDGET_PROPS,
 } from 'src/engine/workspace-manager/twenty-standard-application/constants/standard-page-layout-tabs.template';
 import {
@@ -29,6 +32,15 @@ const TASK_PAGE_TABS = {
         position: { layoutMode: TAB_PROPS.home.layoutMode, index: 1 },
         conditionalDisplay: CONDITIONAL_DISPLAY_DEVICE_MOBILE,
       },
+      assignee: {
+        universalIdentifier: '20202020-ac05-4005-8005-ba5ca11a5513',
+        title: 'Assignee',
+        type: WidgetType.FIELD,
+        gridPosition: GRID_POSITIONS.FULL_WIDTH,
+        position: VERTICAL_LIST_LAYOUT_POSITIONS.THIRD,
+        fieldUniversalIdentifier:
+          STANDARD_OBJECTS.task.fields.assignee.universalIdentifier,
+      },
     },
   },
   note: {

packages/twenty-server/src/engine/workspace-manager/twenty-standard-application/utils/page-layout-widget/build-standard-flat-page-layout-widget-metadata-maps.util.ts

@@ -5,6 +5,7 @@ import { createEmptyFlatEntityMaps } from 'src/engine/metadata-modules/flat-enti
 import { type FlatEntityMaps } from 'src/engine/metadata-modules/flat-entity/types/flat-entity-maps.type';
 import { addFlatEntityToFlatEntityMapsOrThrow } from 'src/engine/metadata-modules/flat-entity/utils/add-flat-entity-to-flat-entity-maps-or-throw.util';
 import { type FlatPageLayoutWidget } from 'src/engine/metadata-modules/flat-page-layout-widget/types/flat-page-layout-widget.type';
+import { FieldDisplayMode } from 'src/engine/metadata-modules/page-layout-widget/enums/field-display-mode.enum';
 import { WidgetConfigurationType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-configuration-type.type';
 import { WidgetType } from 'src/engine/metadata-modules/page-layout-widget/enums/widget-type.enum';
 import { type AllPageLayoutWidgetConfiguration } from 'src/engine/metadata-modules/page-layout-widget/types/all-page-layout-widget-configuration.type';
@@ -77,10 +78,12 @@ const buildRecordPageWidgetConfigurations = ({
   widgetType,
   layoutObjectName,
   standardObjectMetadataRelatedEntityIds,
+  fieldUniversalIdentifier,
 }: {
   widgetType: WidgetType;
   layoutObjectName: AllStandardObjectName | null;
   standardObjectMetadataRelatedEntityIds: BuildStandardFlatPageLayoutWidgetMetadataMapsArgs['standardObjectMetadataRelatedEntityIds'];
+  fieldUniversalIdentifier?: string;
 }): {
   configuration: AllPageLayoutWidgetConfiguration;
   universalConfiguration: CreateStandardPageLayoutWidgetContext['universalConfiguration'];
@@ -92,6 +95,18 @@ const buildRecordPageWidgetConfigurations = ({
     });
   }
 
+  if (
+    widgetType === WidgetType.FIELD &&
+    isDefined(layoutObjectName) &&
+    isDefined(fieldUniversalIdentifier)
+  ) {
+    return buildFieldWidgetConfiguration({
+      objectName: layoutObjectName,
+      standardObjectMetadataRelatedEntityIds,
+      fieldUniversalIdentifier,
+    });
+  }
+
   const configurationType = WIDGET_TYPE_TO_CONFIGURATION_TYPE[widgetType];
 
   if (!configurationType) {
@@ -175,6 +190,47 @@ const buildFieldsWidgetConfiguration = ({
   };
 };
 
+const buildFieldWidgetConfiguration = ({
+  objectName,
+  standardObjectMetadataRelatedEntityIds,
+  fieldUniversalIdentifier,
+}: {
+  objectName: AllStandardObjectName;
+  standardObjectMetadataRelatedEntityIds: BuildStandardFlatPageLayoutWidgetMetadataMapsArgs['standardObjectMetadataRelatedEntityIds'];
+  fieldUniversalIdentifier: string;
+}): {
+  configuration: AllPageLayoutWidgetConfiguration;
+  universalConfiguration: CreateStandardPageLayoutWidgetContext['universalConfiguration'];
+} => {
+  const fields = standardObjectMetadataRelatedEntityIds[objectName]
+    .fields as Record<string, { id: string }>;
+
+  const fieldName = Object.keys(STANDARD_OBJECTS[objectName].fields).find(
+    (name) =>
+      (
+        STANDARD_OBJECTS[objectName].fields as Record<
+          string,
+          { universalIdentifier: string }
+        >
+      )[name]?.universalIdentifier === fieldUniversalIdentifier,
+  );
+
+  const fieldMetadataId = fieldName ? (fields[fieldName]?.id ?? null) : null;
+
+  return {
+    configuration: {
+      configurationType: WidgetConfigurationType.FIELD,
+      fieldMetadataId: fieldMetadataId ?? fieldUniversalIdentifier,
+      fieldDisplayMode: FieldDisplayMode.CARD,
+    },
+    universalConfiguration: {
+      configurationType: WidgetConfigurationType.FIELD,
+      fieldMetadataId: fieldUniversalIdentifier,
+      fieldDisplayMode: FieldDisplayMode.CARD,
+    },
+  };
+};
+
 const computeRecordPageWidgets = ({
   now,
   workspaceId,
@@ -225,6 +281,7 @@ const computeRecordPageWidgets = ({
             widgetType: widget.type,
             layoutObjectName,
             standardObjectMetadataRelatedEntityIds,
+            fieldUniversalIdentifier: widget.fieldUniversalIdentifier,
           });
 
         allWidgets.push(

packages/twenty-server/src/engine/workspace-manager/workspace-migration/workspace-migration-runner/action-handlers/page-layout-widget/services/utils/from-universal-configuration-to-flat-page-layout-widget-configuration.util.ts

@@ -311,8 +311,19 @@ export const fromUniversalConfigurationToFlatPageLayoutWidgetConfiguration = ({
       };
     }
 
+    case WidgetConfigurationType.FIELD: {
+      const { fieldMetadataId: fieldMetadataUniversalIdentifier, ...rest } =
+        universalConfiguration;
+
+      const fieldMetadataId = resolveFieldMetadataIdOrThrow({
+        fieldMetadataUniversalIdentifier,
+        flatFieldMetadataMaps,
+      });
+
+      return { ...rest, fieldMetadataId };
+    }
+
     case WidgetConfigurationType.VIEW:
-    case WidgetConfigurationType.FIELD:
     case WidgetConfigurationType.TIMELINE:
     case WidgetConfigurationType.TASKS:
     case WidgetConfigurationType.NOTES: