diff --git a/package.json b/package.json
index aa05f761c0f0..0b146a6bb6a8 100644
--- a/package.json
+++ b/package.json
@@ -320,7 +320,7 @@
     "msw": "^2.0.11",
     "msw-storybook-addon": "2.0.0--canary.122.b3ed3b1.0",
     "nx": "18.3.3",
-    "playwright": "^1.40.1",
+    "playwright": "^1.46.0",
     "prettier": "^3.1.1",
     "raw-loader": "^4.0.2",
     "rimraf": "^5.0.5",
@@ -369,6 +369,7 @@
       "packages/twenty-utils",
       "packages/twenty-zapier",
       "packages/twenty-website",
+      "packages/twenty-e2e-testing",
       "tools/eslint-rules"
     ]
   }
diff --git a/packages/twenty-e2e-testing/.env.example b/packages/twenty-e2e-testing/.env.example
new file mode 100644
index 000000000000..9ff92d0193a7
--- /dev/null
+++ b/packages/twenty-e2e-testing/.env.example
@@ -0,0 +1,2 @@
+# Note that provide always without trailing forward slash to have expected behaviour
+FRONTEND_BASE_URL="http://localhost:3001"
diff --git a/packages/twenty-e2e-testing/.gitignore b/packages/twenty-e2e-testing/.gitignore
new file mode 100644
index 000000000000..68c5d18f00dc
--- /dev/null
+++ b/packages/twenty-e2e-testing/.gitignore
@@ -0,0 +1,5 @@
+node_modules/
+/test-results/
+/playwright-report/
+/blob-report/
+/playwright/.cache/
diff --git a/packages/twenty-e2e-testing/README.md b/packages/twenty-e2e-testing/README.md
new file mode 100644
index 000000000000..222f1d8070db
--- /dev/null
+++ b/packages/twenty-e2e-testing/README.md
@@ -0,0 +1,37 @@
+# Twenty e2e Testing
+
+## Install
+
+Don't forget to install the browsers before launching the tests  :
+
+```
+yarn playwright install 
+```
+
+### Run end-to-end tests
+
+```
+yarn run test:e2e
+```
+
+### Start the interactive UI mode
+
+```
+yarn run test:e2e:ui
+```
+
+### Run test only on Desktop Chrome
+
+```
+yarn run test:e2e:chrome
+```
+
+### Run test in specific file
+```
+yarn run test:e2e <filename>
+```
+
+### Runs the tests in debug mode.
+```
+yarn run test:e2e:debug
+```
diff --git a/packages/twenty-e2e-testing/e2e/companies.spec.ts b/packages/twenty-e2e-testing/e2e/companies.spec.ts
new file mode 100644
index 000000000000..48485da04df6
--- /dev/null
+++ b/packages/twenty-e2e-testing/e2e/companies.spec.ts
@@ -0,0 +1,14 @@
+import { expect, test } from '@playwright/test';
+
+test.describe('visible table', () => {
+  test('table should be visible on navigation to /objects/companies', async ({
+    page,
+  }) => {
+    // Navigate to the page
+    await page.goto('/objects/companies');
+
+    // Check if the table is visible
+    const table = page.locator('table');
+    await expect(table).toBeVisible();
+  });
+});
diff --git a/packages/twenty-e2e-testing/package.json b/packages/twenty-e2e-testing/package.json
new file mode 100644
index 000000000000..6cef81f80c74
--- /dev/null
+++ b/packages/twenty-e2e-testing/package.json
@@ -0,0 +1,14 @@
+{
+  "name": "twenty-e2e-testing",
+  "devDependencies": {
+    "@playwright/test": "^1.46.0"
+  },
+  "scripts": {
+    "test:e2e:setup": "yarn playwright install",
+    "test:e2e": "yarn playwright test",
+    "test:e2e:ui": "yarn playwright test --ui",
+    "test:e2e:chrome": "yarn playwright test --project=chromium",
+    "test:e2e:debug": "yarn playwright test --debug",
+    "test:e2e:report": "yarn playwright show-report"
+  }
+}
diff --git a/packages/twenty-e2e-testing/playwright.config.ts b/packages/twenty-e2e-testing/playwright.config.ts
new file mode 100644
index 000000000000..4b4f081de794
--- /dev/null
+++ b/packages/twenty-e2e-testing/playwright.config.ts
@@ -0,0 +1,43 @@
+import { defineConfig, devices } from '@playwright/test';
+
+import { config } from 'dotenv';
+config();
+
+/**
+ * See https://playwright.dev/docs/test-configuration.
+ * See https://playwright.dev/docs/trace-viewer to Collect trace when retrying the failed test
+ */
+export default defineConfig({
+  testDir: 'e2e',
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  reporter: 'html',
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    baseURL: process.env.FRONTEND_BASE_URL ?? 'http://localhost:3001',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'] },
+    },
+
+    {
+      name: 'firefox',
+      use: { ...devices['Desktop Firefox'] },
+    },
+
+    {
+      name: 'webkit',
+      use: { ...devices['Desktop Safari'] },
+    },
+
+    {
+      name: 'Google Chrome',
+      use: { ...devices['Desktop Chrome'], channel: 'chrome' },
+    },
+  ],
+});
diff --git a/packages/twenty-front/.storybook/main.ts b/packages/twenty-front/.storybook/main.ts
index 633df49b3dae..3bd4d16b2a57 100644
--- a/packages/twenty-front/.storybook/main.ts
+++ b/packages/twenty-front/.storybook/main.ts
@@ -45,5 +45,16 @@ const config: StorybookConfig = {
     name: '@storybook/react-vite',
     options: {},
   },
+  viteFinal: async (config) => {
+    // Merge custom configuration into the default config
+    const { mergeConfig } = await import('vite');
+
+    return mergeConfig(config, {
+      // Add dependencies to pre-optimization
+      optimizeDeps: {
+        exclude: ['@tabler/icons-react'],
+      },
+    });
+  },
 };
 export default config;
diff --git a/packages/twenty-front/src/App.tsx b/packages/twenty-front/src/App.tsx
index a8eff68866fd..f3668ff0b2da 100644
--- a/packages/twenty-front/src/App.tsx
+++ b/packages/twenty-front/src/App.tsx
@@ -59,7 +59,7 @@ import { SettingsAccountsEmails } from '~/pages/settings/accounts/SettingsAccoun
 import { SettingsNewAccount } from '~/pages/settings/accounts/SettingsNewAccount';
 import { SettingsCRMMigration } from '~/pages/settings/crm-migration/SettingsCRMMigration';
 import { SettingsNewObject } from '~/pages/settings/data-model/SettingsNewObject';
-import { SettingsObjectDetail } from '~/pages/settings/data-model/SettingsObjectDetail';
+import { SettingsObjectDetailPage } from '~/pages/settings/data-model/SettingsObjectDetailPage';
 import { SettingsObjectEdit } from '~/pages/settings/data-model/SettingsObjectEdit';
 import { SettingsObjectFieldEdit } from '~/pages/settings/data-model/SettingsObjectFieldEdit';
 import { SettingsObjectNewFieldStep1 } from '~/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldStep1';
@@ -218,7 +218,7 @@ const createRouter = (
                 />
                 <Route
                   path={SettingsPath.ObjectDetail}
-                  element={<SettingsObjectDetail />}
+                  element={<SettingsObjectDetailPage />}
                 />
                 <Route
                   path={SettingsPath.ObjectEdit}
diff --git a/packages/twenty-front/src/generated-metadata/graphql.ts b/packages/twenty-front/src/generated-metadata/graphql.ts
index f3c3f0e781f2..f5e61e07afd5 100644
--- a/packages/twenty-front/src/generated-metadata/graphql.ts
+++ b/packages/twenty-front/src/generated-metadata/graphql.ts
@@ -344,9 +344,9 @@ export type FieldConnection = {
 
 /** Type of the field */
 export enum FieldMetadataType {
+  Actor = 'ACTOR',
   Address = 'ADDRESS',
   Boolean = 'BOOLEAN',
-  Actor = 'ACTOR',
   Currency = 'CURRENCY',
   Date = 'DATE',
   DateTime = 'DATE_TIME',
@@ -452,13 +452,13 @@ export type Mutation = {
   generateTransientToken: TransientToken;
   impersonate: Verify;
   renewToken: AuthTokens;
+  runWorkflowVersion: WorkflowTriggerResult;
   sendInviteLink: SendInviteLink;
   signUp: LoginToken;
   skipSyncEmailOnboardingStep: OnboardingStepSuccess;
   syncRemoteTable: RemoteTable;
   syncRemoteTableSchemaChanges: RemoteTable;
   track: Analytics;
-  triggerWorkflow: WorkflowTriggerResult;
   unsyncRemoteTable: RemoteTable;
   updateBillingSubscription: UpdateBillingEntity;
   updateOneField: Field;
@@ -610,6 +610,11 @@ export type MutationRenewTokenArgs = {
 };
 
 
+export type MutationRunWorkflowVersionArgs = {
+  input: RunWorkflowVersionInput;
+};
+
+
 export type MutationSendInviteLinkArgs = {
   emails: Array<Scalars['String']['input']>;
 };
@@ -639,11 +644,6 @@ export type MutationTrackArgs = {
 };
 
 
-export type MutationTriggerWorkflowArgs = {
-  workflowVersionId: Scalars['String']['input'];
-};
-
-
 export type MutationUnsyncRemoteTableArgs = {
   input: RemoteTableInput;
 };
@@ -1001,6 +1001,13 @@ export enum RemoteTableStatus {
   Synced = 'SYNCED'
 }
 
+export type RunWorkflowVersionInput = {
+  /** Execution result in JSON format */
+  payload?: InputMaybe<Scalars['JSON']['input']>;
+  /** Workflow version ID */
+  workflowVersionId: Scalars['String']['input'];
+};
+
 export type SendInviteLink = {
   __typename?: 'SendInviteLink';
   /** Boolean that confirms query was dispatched */
@@ -1400,6 +1407,7 @@ export type WorkspaceFeatureFlagsArgs = {
 export enum WorkspaceActivationStatus {
   Active = 'ACTIVE',
   Inactive = 'INACTIVE',
+  OngoingCreation = 'ONGOING_CREATION',
   PendingCreation = 'PENDING_CREATION'
 }
 
diff --git a/packages/twenty-front/src/generated/graphql.tsx b/packages/twenty-front/src/generated/graphql.tsx
index ce20dd81f9d7..cb973a45cf52 100644
--- a/packages/twenty-front/src/generated/graphql.tsx
+++ b/packages/twenty-front/src/generated/graphql.tsx
@@ -1,5 +1,5 @@
-import * as Apollo from '@apollo/client';
 import { gql } from '@apollo/client';
+import * as Apollo from '@apollo/client';
 export type Maybe<T> = T | null;
 export type InputMaybe<T> = Maybe<T>;
 export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
@@ -249,9 +249,9 @@ export type FieldConnection = {
 
 /** Type of the field */
 export enum FieldMetadataType {
+  Actor = 'ACTOR',
   Address = 'ADDRESS',
   Boolean = 'BOOLEAN',
-  Actor = 'ACTOR',
   Currency = 'CURRENCY',
   Date = 'DATE',
   DateTime = 'DATE_TIME',
@@ -344,11 +344,11 @@ export type Mutation = {
   generateTransientToken: TransientToken;
   impersonate: Verify;
   renewToken: AuthTokens;
+  runWorkflowVersion: WorkflowTriggerResult;
   sendInviteLink: SendInviteLink;
   signUp: LoginToken;
   skipSyncEmailOnboardingStep: OnboardingStepSuccess;
   track: Analytics;
-  triggerWorkflow: WorkflowTriggerResult;
   updateBillingSubscription: UpdateBillingEntity;
   updateOneObject: Object;
   updateOneServerlessFunction: ServerlessFunction;
@@ -457,6 +457,11 @@ export type MutationRenewTokenArgs = {
 };
 
 
+export type MutationRunWorkflowVersionArgs = {
+  input: RunWorkflowVersionInput;
+};
+
+
 export type MutationSendInviteLinkArgs = {
   emails: Array<Scalars['String']>;
 };
@@ -476,11 +481,6 @@ export type MutationTrackArgs = {
 };
 
 
-export type MutationTriggerWorkflowArgs = {
-  workflowVersionId: Scalars['String'];
-};
-
-
 export type MutationUpdateOneObjectArgs = {
   input: UpdateOneObjectInput;
 };
@@ -743,6 +743,13 @@ export enum RemoteTableStatus {
   Synced = 'SYNCED'
 }
 
+export type RunWorkflowVersionInput = {
+  /** Execution result in JSON format */
+  payload?: InputMaybe<Scalars['JSON']>;
+  /** Workflow version ID */
+  workflowVersionId: Scalars['String'];
+};
+
 export type SendInviteLink = {
   __typename?: 'SendInviteLink';
   /** Boolean that confirms query was dispatched */
@@ -1087,6 +1094,7 @@ export type WorkspaceFeatureFlagsArgs = {
 export enum WorkspaceActivationStatus {
   Active = 'ACTIVE',
   Inactive = 'INACTIVE',
+  OngoingCreation = 'ONGOING_CREATION',
   PendingCreation = 'PENDING_CREATION'
 }
 
diff --git a/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx b/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx
index 9a94373cef34..38803c9efecf 100644
--- a/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx
+++ b/packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx
@@ -17,7 +17,7 @@ const StyledItemsContainer = styled.div`
   align-items: center;
   display: flex;
   flex-direction: column;
-  gap: 12px;
+  gap: 14px;
   height: calc(100dvh - 32px);
   margin-bottom: auto;
   max-width: 204px;
diff --git a/packages/twenty-front/src/modules/activities/hooks/useOpenCreateActivityDrawer.ts b/packages/twenty-front/src/modules/activities/hooks/useOpenCreateActivityDrawer.ts
index e8fb4f36669e..74781c52cecd 100644
--- a/packages/twenty-front/src/modules/activities/hooks/useOpenCreateActivityDrawer.ts
+++ b/packages/twenty-front/src/modules/activities/hooks/useOpenCreateActivityDrawer.ts
@@ -42,6 +42,7 @@ export const useOpenCreateActivityDrawer = ({
       activityObjectNameSingular === CoreObjectNameSingular.Task
         ? CoreObjectNameSingular.TaskTarget
         : CoreObjectNameSingular.NoteTarget,
+    shouldMatchRootQueryFilter: true,
   });
 
   const setActivityTargetableEntityArray = useSetRecoilState(
diff --git a/packages/twenty-front/src/modules/activities/timelineActivities/rows/components/EventIconDynamicComponent.tsx b/packages/twenty-front/src/modules/activities/timelineActivities/rows/components/EventIconDynamicComponent.tsx
index d1b35d7f2293..ecb7bc90d51f 100644
--- a/packages/twenty-front/src/modules/activities/timelineActivities/rows/components/EventIconDynamicComponent.tsx
+++ b/packages/twenty-front/src/modules/activities/timelineActivities/rows/components/EventIconDynamicComponent.tsx
@@ -1,4 +1,4 @@
-import { IconCirclePlus, IconEditCircle, useIcons } from 'twenty-ui';
+import { IconCirclePlus, IconEditCircle, IconTrash, useIcons } from 'twenty-ui';
 
 import { TimelineActivity } from '@/activities/timelineActivities/types/TimelineActivity';
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
@@ -19,6 +19,9 @@ export const EventIconDynamicComponent = ({
   if (eventAction === 'updated') {
     return <IconEditCircle />;
   }
+  if (eventAction === 'deleted') {
+    return <IconTrash />;
+  }
 
   const IconComponent = getIcon(linkedObjectMetadataItem?.icon);
 
diff --git a/packages/twenty-front/src/modules/activities/timelineActivities/rows/main-object/components/EventRowMainObject.tsx b/packages/twenty-front/src/modules/activities/timelineActivities/rows/main-object/components/EventRowMainObject.tsx
index f2dcc69055fa..053e9217bb66 100644
--- a/packages/twenty-front/src/modules/activities/timelineActivities/rows/main-object/components/EventRowMainObject.tsx
+++ b/packages/twenty-front/src/modules/activities/timelineActivities/rows/main-object/components/EventRowMainObject.tsx
@@ -45,6 +45,17 @@ export const EventRowMainObject = ({
         />
       );
     }
+    case 'deleted': {
+      return (
+        <StyledMainContainer>
+          <StyledEventRowItemColumn>
+            {labelIdentifierValue}
+          </StyledEventRowItemColumn>
+          <StyledEventRowItemAction>was deleted by</StyledEventRowItemAction>
+          <StyledEventRowItemColumn>{authorFullName}</StyledEventRowItemColumn>
+        </StyledMainContainer>
+      );
+    }
     default:
       return null;
   }
diff --git a/packages/twenty-front/src/modules/apollo/optimistic-effect/utils/sortCachedObjectEdges.ts b/packages/twenty-front/src/modules/apollo/optimistic-effect/utils/sortCachedObjectEdges.ts
index 6f76dd66a5a8..6b762f22158a 100644
--- a/packages/twenty-front/src/modules/apollo/optimistic-effect/utils/sortCachedObjectEdges.ts
+++ b/packages/twenty-front/src/modules/apollo/optimistic-effect/utils/sortCachedObjectEdges.ts
@@ -1,9 +1,9 @@
 import { Reference, StoreObject } from '@apollo/client';
 import { ReadFieldFunction } from '@apollo/client/cache/core/types/common';
 
-import { OrderBy } from '@/object-metadata/types/OrderBy';
 import { RecordGqlRefEdge } from '@/object-record/cache/types/RecordGqlRefEdge';
 import { RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
+import { OrderBy } from '@/types/OrderBy';
 import { isDefined } from '~/utils/isDefined';
 import { sortAsc, sortDesc, sortNullsFirst, sortNullsLast } from '~/utils/sort';
 
diff --git a/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx b/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx
index 2581dd48934c..39d2437bf6f7 100644
--- a/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx
+++ b/packages/twenty-front/src/modules/information-banner/components/InformationBanner.tsx
@@ -1,6 +1,6 @@
 import { Button } from '@/ui/input/button/components/Button';
 import styled from '@emotion/styled';
-import { Banner, IconComponent } from 'twenty-ui';
+import { Banner, BannerVariant, IconComponent } from 'twenty-ui';
 
 const StyledBanner = styled(Banner)`
   position: absolute;
@@ -14,26 +14,30 @@ const StyledText = styled.div`
 
 export const InformationBanner = ({
   message,
+  variant = 'default',
   buttonTitle,
   buttonIcon,
   buttonOnClick,
 }: {
   message: string;
-  buttonTitle: string;
+  variant?: BannerVariant;
+  buttonTitle?: string;
   buttonIcon?: IconComponent;
-  buttonOnClick: () => void;
+  buttonOnClick?: () => void;
 }) => {
   return (
-    <StyledBanner>
+    <StyledBanner variant={variant}>
       <StyledText>{message}</StyledText>
-      <Button
-        variant="secondary"
-        title={buttonTitle}
-        Icon={buttonIcon}
-        size="small"
-        inverted
-        onClick={buttonOnClick}
-      />
+      {buttonTitle && buttonOnClick && (
+        <Button
+          variant="secondary"
+          title={buttonTitle}
+          Icon={buttonIcon}
+          size="small"
+          inverted
+          onClick={buttonOnClick}
+        />
+      )}
     </StyledBanner>
   );
 };
diff --git a/packages/twenty-front/src/modules/information-banner/components/deleted-record/InformationBannerDeletedRecord.tsx b/packages/twenty-front/src/modules/information-banner/components/deleted-record/InformationBannerDeletedRecord.tsx
new file mode 100644
index 000000000000..1b3eb1270f2f
--- /dev/null
+++ b/packages/twenty-front/src/modules/information-banner/components/deleted-record/InformationBannerDeletedRecord.tsx
@@ -0,0 +1,37 @@
+import { InformationBanner } from '@/information-banner/components/InformationBanner';
+import { useRestoreManyRecords } from '@/object-record/hooks/useRestoreManyRecords';
+import styled from '@emotion/styled';
+import { IconRefresh } from 'twenty-ui';
+
+const StyledInformationBannerDeletedRecord = styled.div`
+  height: 40px;
+  position: relative;
+
+  &:empty {
+    height: 0;
+  }
+`;
+
+export const InformationBannerDeletedRecord = ({
+  recordId,
+  objectNameSingular,
+}: {
+  recordId: string;
+  objectNameSingular: string;
+}) => {
+  const { restoreManyRecords } = useRestoreManyRecords({
+    objectNameSingular,
+  });
+
+  return (
+    <StyledInformationBannerDeletedRecord>
+      <InformationBanner
+        variant="danger"
+        message={`This record has been deleted`}
+        buttonTitle="Restore"
+        buttonIcon={IconRefresh}
+        buttonOnClick={() => restoreManyRecords([recordId])}
+      />
+    </StyledInformationBannerDeletedRecord>
+  );
+};
diff --git a/packages/twenty-front/src/modules/information-banner/constants/InformationBannerHeight.ts b/packages/twenty-front/src/modules/information-banner/constants/InformationBannerHeight.ts
new file mode 100644
index 000000000000..472d20303a55
--- /dev/null
+++ b/packages/twenty-front/src/modules/information-banner/constants/InformationBannerHeight.ts
@@ -0,0 +1 @@
+export const INFORMATION_BANNER_HEIGHT = '40px';
diff --git a/packages/twenty-front/src/modules/object-metadata/hooks/useGetObjectOrderByField.ts b/packages/twenty-front/src/modules/object-metadata/hooks/useGetObjectOrderByField.ts
index d656378ea2db..5a3f57972a70 100644
--- a/packages/twenty-front/src/modules/object-metadata/hooks/useGetObjectOrderByField.ts
+++ b/packages/twenty-front/src/modules/object-metadata/hooks/useGetObjectOrderByField.ts
@@ -1,7 +1,8 @@
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
-import { OrderBy } from '@/object-metadata/types/OrderBy';
+
 import { getOrderByFieldForObjectMetadataItem } from '@/object-metadata/utils/getObjectOrderByField';
 import { RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
+import { OrderBy } from '@/types/OrderBy';
 
 export const useGetObjectOrderByField = ({
   objectNameSingular,
diff --git a/packages/twenty-front/src/modules/object-metadata/utils/getObjectOrderByField.ts b/packages/twenty-front/src/modules/object-metadata/utils/getObjectOrderByField.ts
index d6367fcc47b5..35bee6877849 100644
--- a/packages/twenty-front/src/modules/object-metadata/utils/getObjectOrderByField.ts
+++ b/packages/twenty-front/src/modules/object-metadata/utils/getObjectOrderByField.ts
@@ -1,8 +1,9 @@
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
-import { OrderBy } from '@/object-metadata/types/OrderBy';
+
 import { getLabelIdentifierFieldMetadataItem } from '@/object-metadata/utils/getLabelIdentifierFieldMetadataItem';
 import { getOrderByForFieldMetadataType } from '@/object-metadata/utils/getOrderByForFieldMetadataType';
 import { RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
+import { OrderBy } from '@/types/OrderBy';
 import { isDefined } from '~/utils/isDefined';
 
 export const getOrderByFieldForObjectMetadataItem = (
diff --git a/packages/twenty-front/src/modules/object-metadata/utils/getOrderByForFieldMetadataType.ts b/packages/twenty-front/src/modules/object-metadata/utils/getOrderByForFieldMetadataType.ts
index 6fc684d409f9..0e54e820e27d 100644
--- a/packages/twenty-front/src/modules/object-metadata/utils/getOrderByForFieldMetadataType.ts
+++ b/packages/twenty-front/src/modules/object-metadata/utils/getOrderByForFieldMetadataType.ts
@@ -1,7 +1,8 @@
 import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
-import { OrderBy } from '@/object-metadata/types/OrderBy';
+
 import { RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
 import { FieldLinksValue } from '@/object-record/record-field/types/FieldMetadata';
+import { OrderBy } from '@/types/OrderBy';
 import { FieldMetadataType } from '~/generated-metadata/graphql';
 
 export const getOrderByForFieldMetadataType = (
diff --git a/packages/twenty-front/src/modules/object-record/graphql/types/RecordGqlOperationOrderBy.ts b/packages/twenty-front/src/modules/object-record/graphql/types/RecordGqlOperationOrderBy.ts
index b1180d6c6860..9c5426c99ca4 100644
--- a/packages/twenty-front/src/modules/object-record/graphql/types/RecordGqlOperationOrderBy.ts
+++ b/packages/twenty-front/src/modules/object-record/graphql/types/RecordGqlOperationOrderBy.ts
@@ -1,4 +1,4 @@
-import { OrderBy } from '@/object-metadata/types/OrderBy';
+import { OrderBy } from '@/types/OrderBy';
 
 export type RecordGqlOperationOrderBy = Array<{
   [fieldName: string]: OrderBy | { [subFieldName: string]: OrderBy };
diff --git a/packages/twenty-front/src/modules/object-record/hooks/useDeleteManyRecords.ts b/packages/twenty-front/src/modules/object-record/hooks/useDeleteManyRecords.ts
index 1d3d82f3fe60..35a65a507765 100644
--- a/packages/twenty-front/src/modules/object-record/hooks/useDeleteManyRecords.ts
+++ b/packages/twenty-front/src/modules/object-record/hooks/useDeleteManyRecords.ts
@@ -13,7 +13,7 @@ import { isDefined } from '~/utils/isDefined';
 import { sleep } from '~/utils/sleep';
 import { capitalize } from '~/utils/string/capitalize';
 
-type useDeleteOneRecordProps = {
+type useDeleteManyRecordProps = {
   objectNameSingular: string;
   refetchFindManyQuery?: boolean;
 };
@@ -25,7 +25,7 @@ type DeleteManyRecordsOptions = {
 
 export const useDeleteManyRecords = ({
   objectNameSingular,
-}: useDeleteOneRecordProps) => {
+}: useDeleteManyRecordProps) => {
   const apiConfig = useRecoilValue(apiConfigState);
 
   const mutationPageSize =
diff --git a/packages/twenty-front/src/modules/object-record/hooks/useDestroyManyRecordMutation.ts b/packages/twenty-front/src/modules/object-record/hooks/useDestroyManyRecordMutation.ts
new file mode 100644
index 000000000000..ee2e06cddc9f
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/hooks/useDestroyManyRecordMutation.ts
@@ -0,0 +1,41 @@
+import gql from 'graphql-tag';
+
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { EMPTY_MUTATION } from '@/object-record/constants/EmptyMutation';
+import { getDestroyManyRecordsMutationResponseField } from '@/object-record/utils/getDestroyManyRecordsMutationResponseField';
+import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull';
+import { capitalize } from '~/utils/string/capitalize';
+
+export const useDestroyManyRecordsMutation = ({
+  objectNameSingular,
+}: {
+  objectNameSingular: string;
+}) => {
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular,
+  });
+
+  if (isUndefinedOrNull(objectMetadataItem)) {
+    return { destroyManyRecordsMutation: EMPTY_MUTATION };
+  }
+
+  const capitalizedObjectName = capitalize(objectMetadataItem.namePlural);
+
+  const mutationResponseField = getDestroyManyRecordsMutationResponseField(
+    objectMetadataItem.namePlural,
+  );
+
+  const destroyManyRecordsMutation = gql`
+    mutation DestroyMany${capitalizedObjectName}($filter: ${capitalize(
+      objectMetadataItem.nameSingular,
+    )}FilterInput!)  {
+      ${mutationResponseField}(filter: $filter) {
+        id
+      }
+    }
+  `;
+
+  return {
+    destroyManyRecordsMutation,
+  };
+};
diff --git a/packages/twenty-front/src/modules/object-record/hooks/useDestroyManyRecords.ts b/packages/twenty-front/src/modules/object-record/hooks/useDestroyManyRecords.ts
new file mode 100644
index 000000000000..6524374c5efe
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/hooks/useDestroyManyRecords.ts
@@ -0,0 +1,115 @@
+import { useApolloClient } from '@apollo/client';
+
+import { triggerDeleteRecordsOptimisticEffect } from '@/apollo/optimistic-effect/utils/triggerDeleteRecordsOptimisticEffect';
+import { apiConfigState } from '@/client-config/states/apiConfigState';
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadataItems';
+import { useGetRecordFromCache } from '@/object-record/cache/hooks/useGetRecordFromCache';
+import { DEFAULT_MUTATION_BATCH_SIZE } from '@/object-record/constants/DefaultMutationBatchSize';
+import { useDestroyManyRecordsMutation } from '@/object-record/hooks/useDestroyManyRecordMutation';
+import { getDestroyManyRecordsMutationResponseField } from '@/object-record/utils/getDestroyManyRecordsMutationResponseField';
+import { useRecoilValue } from 'recoil';
+import { isDefined } from '~/utils/isDefined';
+import { sleep } from '~/utils/sleep';
+import { capitalize } from '~/utils/string/capitalize';
+
+type useDestroyManyRecordProps = {
+  objectNameSingular: string;
+  refetchFindManyQuery?: boolean;
+};
+
+type DestroyManyRecordsOptions = {
+  skipOptimisticEffect?: boolean;
+  delayInMsBetweenRequests?: number;
+};
+
+export const useDestroyManyRecords = ({
+  objectNameSingular,
+}: useDestroyManyRecordProps) => {
+  const apiConfig = useRecoilValue(apiConfigState);
+
+  const mutationPageSize =
+    apiConfig?.mutationMaximumAffectedRecords ?? DEFAULT_MUTATION_BATCH_SIZE;
+
+  const apolloClient = useApolloClient();
+
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular,
+  });
+
+  const getRecordFromCache = useGetRecordFromCache({
+    objectNameSingular,
+  });
+
+  const { destroyManyRecordsMutation } = useDestroyManyRecordsMutation({
+    objectNameSingular,
+  });
+
+  const { objectMetadataItems } = useObjectMetadataItems();
+
+  const mutationResponseField = getDestroyManyRecordsMutationResponseField(
+    objectMetadataItem.namePlural,
+  );
+
+  const destroyManyRecords = async (
+    idsToDestroy: string[],
+    options?: DestroyManyRecordsOptions,
+  ) => {
+    const numberOfBatches = Math.ceil(idsToDestroy.length / mutationPageSize);
+
+    const destroyedRecords = [];
+
+    for (let batchIndex = 0; batchIndex < numberOfBatches; batchIndex++) {
+      const batchIds = idsToDestroy.slice(
+        batchIndex * mutationPageSize,
+        (batchIndex + 1) * mutationPageSize,
+      );
+
+      const destroyedRecordsResponse = await apolloClient.mutate({
+        mutation: destroyManyRecordsMutation,
+        variables: {
+          filter: { id: { in: batchIds } },
+        },
+        optimisticResponse: options?.skipOptimisticEffect
+          ? undefined
+          : {
+              [mutationResponseField]: batchIds.map((idToDestroy) => ({
+                __typename: capitalize(objectNameSingular),
+                id: idToDestroy,
+              })),
+            },
+        update: options?.skipOptimisticEffect
+          ? undefined
+          : (cache, { data }) => {
+              const records = data?.[mutationResponseField];
+
+              if (!records?.length) return;
+
+              const cachedRecords = records
+                .map((record) => getRecordFromCache(record.id, cache))
+                .filter(isDefined);
+
+              triggerDeleteRecordsOptimisticEffect({
+                cache,
+                objectMetadataItem,
+                recordsToDelete: cachedRecords,
+                objectMetadataItems,
+              });
+            },
+      });
+
+      const destroyedRecordsForThisBatch =
+        destroyedRecordsResponse.data?.[mutationResponseField] ?? [];
+
+      destroyedRecords.push(...destroyedRecordsForThisBatch);
+
+      if (isDefined(options?.delayInMsBetweenRequests)) {
+        await sleep(options.delayInMsBetweenRequests);
+      }
+    }
+
+    return destroyedRecords;
+  };
+
+  return { destroyManyRecords };
+};
diff --git a/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecord.ts b/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecord.ts
index 76c9645bd850..0ddbde032ac3 100644
--- a/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecord.ts
+++ b/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecord.ts
@@ -17,11 +17,13 @@ export const useFindOneRecord = <T extends ObjectRecord = ObjectRecord>({
   recordGqlFields,
   onCompleted,
   skip,
+  withSoftDeleted = false,
 }: ObjectMetadataItemIdentifier & {
   objectRecordId: string | undefined;
   recordGqlFields?: RecordGqlOperationGqlRecordFields;
   onCompleted?: (data: T) => void;
   skip?: boolean;
+  withSoftDeleted?: boolean;
 }) => {
   const { objectMetadataItem } = useObjectMetadataItem({
     objectNameSingular,
@@ -33,6 +35,7 @@ export const useFindOneRecord = <T extends ObjectRecord = ObjectRecord>({
   const { findOneRecordQuery } = useFindOneRecordQuery({
     objectNameSingular,
     recordGqlFields: computedRecordGqlFields,
+    withSoftDeleted,
   });
 
   const { data, loading, error } = useQuery<{
diff --git a/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecordQuery.ts b/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecordQuery.ts
index 725ec05d9c3c..b67b28e52d11 100644
--- a/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecordQuery.ts
+++ b/packages/twenty-front/src/modules/object-record/hooks/useFindOneRecordQuery.ts
@@ -10,9 +10,11 @@ import { capitalize } from '~/utils/string/capitalize';
 export const useFindOneRecordQuery = ({
   objectNameSingular,
   recordGqlFields,
+  withSoftDeleted = false,
 }: {
   objectNameSingular: string;
   recordGqlFields?: RecordGqlOperationGqlRecordFields;
+  withSoftDeleted?: boolean;
 }) => {
   const { objectMetadataItem } = useObjectMetadataItem({
     objectNameSingular,
@@ -25,6 +27,16 @@ export const useFindOneRecordQuery = ({
         objectMetadataItem.nameSingular,
       )}($objectRecordId: ID!) {
         ${objectMetadataItem.nameSingular}(filter: {
+        ${
+          withSoftDeleted
+            ? `
+          or: [
+            { deletedAt: { is: NULL } },
+            { deletedAt: { is: NOT_NULL } }
+          ],
+        `
+            : ''
+        }
           id: {
             eq: $objectRecordId
           }
diff --git a/packages/twenty-front/src/modules/object-record/hooks/useRestoreManyRecords.ts b/packages/twenty-front/src/modules/object-record/hooks/useRestoreManyRecords.ts
new file mode 100644
index 000000000000..f1fb1c17c13c
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/hooks/useRestoreManyRecords.ts
@@ -0,0 +1,94 @@
+import { useApolloClient } from '@apollo/client';
+
+import { apiConfigState } from '@/client-config/states/apiConfigState';
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { DEFAULT_MUTATION_BATCH_SIZE } from '@/object-record/constants/DefaultMutationBatchSize';
+import { useRestoreManyRecordsMutation } from '@/object-record/hooks/useRestoreManyRecordsMutation';
+import { getRestoreManyRecordsMutationResponseField } from '@/object-record/utils/getRestoreManyRecordsMutationResponseField';
+import { useRecoilValue } from 'recoil';
+import { isDefined } from '~/utils/isDefined';
+import { sleep } from '~/utils/sleep';
+import { capitalize } from '~/utils/string/capitalize';
+
+type useRestoreManyRecordProps = {
+  objectNameSingular: string;
+  refetchFindManyQuery?: boolean;
+};
+
+type RestoreManyRecordsOptions = {
+  skipOptimisticEffect?: boolean;
+  delayInMsBetweenRequests?: number;
+};
+
+export const useRestoreManyRecords = ({
+  objectNameSingular,
+}: useRestoreManyRecordProps) => {
+  const apiConfig = useRecoilValue(apiConfigState);
+
+  const mutationPageSize =
+    apiConfig?.mutationMaximumAffectedRecords ?? DEFAULT_MUTATION_BATCH_SIZE;
+
+  const apolloClient = useApolloClient();
+
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular,
+  });
+
+  const { restoreManyRecordsMutation } = useRestoreManyRecordsMutation({
+    objectNameSingular,
+  });
+
+  const mutationResponseField = getRestoreManyRecordsMutationResponseField(
+    objectMetadataItem.namePlural,
+  );
+
+  const restoreManyRecords = async (
+    idsToRestore: string[],
+    options?: RestoreManyRecordsOptions,
+  ) => {
+    const numberOfBatches = Math.ceil(idsToRestore.length / mutationPageSize);
+
+    const restoredRecords = [];
+
+    for (let batchIndex = 0; batchIndex < numberOfBatches; batchIndex++) {
+      const batchIds = idsToRestore.slice(
+        batchIndex * mutationPageSize,
+        (batchIndex + 1) * mutationPageSize,
+      );
+
+      // TODO: fix optimistic effect
+      const findOneQueryName = `FindOne${capitalize(objectNameSingular)}`;
+      const findManyQueryName = `FindMany${capitalize(objectMetadataItem.namePlural)}`;
+
+      const restoredRecordsResponse = await apolloClient.mutate({
+        mutation: restoreManyRecordsMutation,
+        refetchQueries: [findOneQueryName, findManyQueryName],
+        variables: {
+          filter: { id: { in: batchIds } },
+        },
+        optimisticResponse: options?.skipOptimisticEffect
+          ? undefined
+          : {
+              [mutationResponseField]: batchIds.map((idToRestore) => ({
+                __typename: capitalize(objectNameSingular),
+                id: idToRestore,
+                deletedAt: null,
+              })),
+            },
+      });
+
+      const restoredRecordsForThisBatch =
+        restoredRecordsResponse.data?.[mutationResponseField] ?? [];
+
+      restoredRecords.push(...restoredRecordsForThisBatch);
+
+      if (isDefined(options?.delayInMsBetweenRequests)) {
+        await sleep(options.delayInMsBetweenRequests);
+      }
+    }
+
+    return restoredRecords;
+  };
+
+  return { restoreManyRecords };
+};
diff --git a/packages/twenty-front/src/modules/object-record/hooks/useRestoreManyRecordsMutation.ts b/packages/twenty-front/src/modules/object-record/hooks/useRestoreManyRecordsMutation.ts
new file mode 100644
index 000000000000..baafc3a18a0d
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/hooks/useRestoreManyRecordsMutation.ts
@@ -0,0 +1,41 @@
+import gql from 'graphql-tag';
+
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { EMPTY_MUTATION } from '@/object-record/constants/EmptyMutation';
+import { getRestoreManyRecordsMutationResponseField } from '@/object-record/utils/getRestoreManyRecordsMutationResponseField';
+import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull';
+import { capitalize } from '~/utils/string/capitalize';
+
+export const useRestoreManyRecordsMutation = ({
+  objectNameSingular,
+}: {
+  objectNameSingular: string;
+}) => {
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular,
+  });
+
+  if (isUndefinedOrNull(objectMetadataItem)) {
+    return { restoreManyRecordsMutation: EMPTY_MUTATION };
+  }
+
+  const capitalizedObjectName = capitalize(objectMetadataItem.namePlural);
+
+  const mutationResponseField = getRestoreManyRecordsMutationResponseField(
+    objectMetadataItem.namePlural,
+  );
+
+  const restoreManyRecordsMutation = gql`
+    mutation RestoreMany${capitalizedObjectName}($filter: ${capitalize(
+      objectMetadataItem.nameSingular,
+    )}FilterInput!)  {
+      ${mutationResponseField}(filter: $filter) {
+        id
+      }
+    }
+  `;
+
+  return {
+    restoreManyRecordsMutation,
+  };
+};
diff --git a/packages/twenty-front/src/modules/object-record/multiple-objects/hooks/useCombinedGetTotalCount.ts b/packages/twenty-front/src/modules/object-record/multiple-objects/hooks/useCombinedGetTotalCount.ts
new file mode 100644
index 000000000000..65dd5ba05f0f
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/multiple-objects/hooks/useCombinedGetTotalCount.ts
@@ -0,0 +1,48 @@
+import { useQuery } from '@apollo/client';
+
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { EMPTY_QUERY } from '@/object-record/constants/EmptyQuery';
+import { RecordGqlOperationSignature } from '@/object-record/graphql/types/RecordGqlOperationSignature';
+import { useGenerateCombinedFindManyRecordsQuery } from '@/object-record/multiple-objects/hooks/useGenerateCombinedFindManyRecordsQuery';
+import { MultiObjectRecordQueryResult } from '@/object-record/relation-picker/hooks/useMultiObjectRecordsQueryResultFormattedAsObjectRecordForSelectArray';
+
+export const useCombinedGetTotalCount = ({
+  objectMetadataItems,
+  skip = false,
+}: {
+  objectMetadataItems: ObjectMetadataItem[];
+  skip?: boolean;
+}) => {
+  const operationSignatures = objectMetadataItems.map(
+    (objectMetadataItem) =>
+      ({
+        objectNameSingular: objectMetadataItem.nameSingular,
+        variables: {},
+        fields: {
+          id: true,
+        },
+      }) satisfies RecordGqlOperationSignature,
+  );
+
+  const findManyQuery = useGenerateCombinedFindManyRecordsQuery({
+    operationSignatures,
+  });
+
+  const { data } = useQuery<MultiObjectRecordQueryResult>(
+    findManyQuery ?? EMPTY_QUERY,
+    {
+      skip,
+    },
+  );
+
+  const totalCountByObjectMetadataItemNamePlural = Object.fromEntries(
+    Object.entries(data ?? {}).map(([namePlural, objectRecordConnection]) => [
+      namePlural,
+      objectRecordConnection.totalCount,
+    ]),
+  );
+
+  return {
+    totalCountByObjectMetadataItemNamePlural,
+  };
+};
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/Filter.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/Filter.ts
index 862e99bed5f4..52ed99ac5531 100644
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/Filter.ts
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/Filter.ts
@@ -4,6 +4,7 @@ import { FilterDefinition } from './FilterDefinition';
 
 export type Filter = {
   id: string;
+  variant?: 'default' | 'danger';
   fieldMetadataId: string;
   value: string;
   displayValue: string;
diff --git a/packages/twenty-front/src/modules/object-record/object-sort-dropdown/utils/turnSortsIntoOrderBy.ts b/packages/twenty-front/src/modules/object-record/object-sort-dropdown/utils/turnSortsIntoOrderBy.ts
index 5a33d53991cc..b38c0bba8ddf 100644
--- a/packages/twenty-front/src/modules/object-record/object-sort-dropdown/utils/turnSortsIntoOrderBy.ts
+++ b/packages/twenty-front/src/modules/object-record/object-sort-dropdown/utils/turnSortsIntoOrderBy.ts
@@ -1,5 +1,5 @@
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
-import { OrderBy } from '@/object-metadata/types/OrderBy';
+
 import { hasPositionField } from '@/object-metadata/utils/hasPositionField';
 import { RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
 import { mapArrayToObject } from '~/utils/array/mapArrayToObject';
@@ -8,6 +8,7 @@ import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull';
 
 import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
 import { getOrderByForFieldMetadataType } from '@/object-metadata/utils/getOrderByForFieldMetadataType';
+import { OrderBy } from '@/types/OrderBy';
 import { Sort } from '../types/Sort';
 
 export const turnSortsIntoOrderBy = (
diff --git a/packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleToggleTrashColumnFilter.ts b/packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleToggleTrashColumnFilter.ts
new file mode 100644
index 000000000000..170e912d726c
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/record-index/hooks/useHandleToggleTrashColumnFilter.ts
@@ -0,0 +1,67 @@
+import { useCallback } from 'react';
+import { v4 } from 'uuid';
+
+import { useColumnDefinitionsFromFieldMetadata } from '@/object-metadata/hooks/useColumnDefinitionsFromFieldMetadata';
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { getFilterTypeFromFieldType } from '@/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions';
+import { Filter } from '@/object-record/object-filter-dropdown/types/Filter';
+import { useCombinedViewFilters } from '@/views/hooks/useCombinedViewFilters';
+import { ViewFilterOperand } from '@/views/types/ViewFilterOperand';
+import { isDefined } from '~/utils/isDefined';
+
+type UseHandleToggleTrashColumnFilterProps = {
+  objectNameSingular: string;
+  viewBarId: string;
+};
+
+export const useHandleToggleTrashColumnFilter = ({
+  viewBarId,
+  objectNameSingular,
+}: UseHandleToggleTrashColumnFilterProps) => {
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular,
+  });
+
+  const { columnDefinitions } =
+    useColumnDefinitionsFromFieldMetadata(objectMetadataItem);
+
+  const { upsertCombinedViewFilter } = useCombinedViewFilters(viewBarId);
+
+  const handleToggleTrashColumnFilter = useCallback(() => {
+    const trashFieldMetadata = objectMetadataItem.fields.find(
+      (field) => field.name === 'deletedAt',
+    );
+
+    if (!isDefined(trashFieldMetadata)) return;
+
+    const correspondingColumnDefinition = columnDefinitions.find(
+      (columnDefinition) =>
+        columnDefinition.fieldMetadataId === trashFieldMetadata.id,
+    );
+
+    if (!isDefined(correspondingColumnDefinition)) return;
+
+    const filterType = getFilterTypeFromFieldType(
+      correspondingColumnDefinition?.type,
+    );
+
+    const newFilter: Filter = {
+      id: v4(),
+      variant: 'danger',
+      fieldMetadataId: trashFieldMetadata.id,
+      operand: ViewFilterOperand.IsNotEmpty,
+      displayValue: '',
+      definition: {
+        label: 'Trash',
+        iconName: 'IconTrash',
+        fieldMetadataId: trashFieldMetadata.id,
+        type: filterType,
+      },
+      value: '',
+    };
+
+    upsertCombinedViewFilter(newFilter);
+  }, [columnDefinitions, objectMetadataItem.fields, upsertCombinedViewFilter]);
+
+  return handleToggleTrashColumnFilter;
+};
diff --git a/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx b/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx
index 29e15b03a7ac..8a2201d8192a 100644
--- a/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-index/options/components/RecordIndexOptionsDropdownContent.tsx
@@ -8,6 +8,7 @@ import {
   IconFileImport,
   IconSettings,
   IconTag,
+  IconTrash,
 } from 'twenty-ui';
 
 import { useObjectNamePluralFromSingular } from '@/object-metadata/hooks/useObjectNamePluralFromSingular';
@@ -37,6 +38,7 @@ import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
 import { ViewType } from '@/views/types/ViewType';
 import { useLocation } from 'react-router-dom';
 import { useSetRecoilState } from 'recoil';
+import { useHandleToggleTrashColumnFilter } from '@/object-record/record-index/hooks/useHandleToggleTrashColumnFilter';
 
 type RecordIndexOptionsMenu = 'fields' | 'hiddenFields';
 
@@ -88,6 +90,11 @@ export const RecordIndexOptionsDropdownContent = ({
     hiddenTableColumns,
   } = useRecordIndexOptionsForTable(recordIndexId);
 
+  const handleToggleTrashColumnFilter = useHandleToggleTrashColumnFilter({
+    objectNameSingular,
+    viewBarId: recordIndexId,
+  });
+
   const {
     visibleBoardFields,
     hiddenBoardFields,
@@ -153,6 +160,14 @@ export const RecordIndexOptionsDropdownContent = ({
             LeftIcon={IconFileExport}
             text={displayedExportProgress(progress)}
           />
+          <MenuItem
+            onClick={() => {
+              handleToggleTrashColumnFilter();
+              closeDropdown();
+            }}
+            LeftIcon={IconTrash}
+            text="Trash"
+          />
         </DropdownMenuItemsContainer>
       )}
       {currentMenu === 'fields' && (
diff --git a/packages/twenty-front/src/modules/object-record/record-show/components/RecordShowContainer.tsx b/packages/twenty-front/src/modules/object-record/record-show/components/RecordShowContainer.tsx
index ae6a92be30c0..505dfae807c5 100644
--- a/packages/twenty-front/src/modules/object-record/record-show/components/RecordShowContainer.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-show/components/RecordShowContainer.tsx
@@ -4,6 +4,7 @@ import { useRecoilState, useRecoilValue } from 'recoil';
 import { ActivityTargetsInlineCell } from '@/activities/inline-cell/components/ActivityTargetsInlineCell';
 import { Note } from '@/activities/types/Note';
 import { Task } from '@/activities/types/Task';
+import { InformationBannerDeletedRecord } from '@/information-banner/components/deleted-record/InformationBannerDeletedRecord';
 import { useLabelIdentifierFieldMetadataItem } from '@/object-metadata/hooks/useLabelIdentifierFieldMetadataItem';
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
@@ -126,7 +127,11 @@ export const RecordShowContainer = ({
     );
 
   const { inlineFieldMetadataItems, relationFieldMetadataItems } = groupBy(
-    availableFieldMetadataItems,
+    availableFieldMetadataItems.filter(
+      (fieldMetadataItem) =>
+        fieldMetadataItem.name !== 'createdAt' &&
+        fieldMetadataItem.name !== 'deletedAt',
+    ),
     (fieldMetadataItem) =>
       fieldMetadataItem.type === FieldMetadataType.Relation
         ? 'relationFieldMetadataItems'
@@ -301,25 +306,33 @@ export const RecordShowContainer = ({
   );
 
   return (
-    <ShowPageContainer>
-      <ShowPageLeftContainer forceMobile={isMobile}>
-        {!isMobile && summaryCard}
-        {!isMobile && fieldsBox}
-      </ShowPageLeftContainer>
-      <ShowPageRightContainer
-        targetableObject={{
-          id: objectRecordId,
-          targetObjectNameSingular: objectMetadataItem?.nameSingular,
-        }}
-        timeline
-        tasks
-        notes
-        emails
-        isInRightDrawer={isInRightDrawer}
-        summaryCard={isMobile ? summaryCard : <></>}
-        fieldsBox={fieldsBox}
-        loading={isPrefetchLoading || loading || recordLoading}
-      />
-    </ShowPageContainer>
+    <>
+      {recordFromStore && recordFromStore.deletedAt && (
+        <InformationBannerDeletedRecord
+          recordId={objectRecordId}
+          objectNameSingular={objectNameSingular}
+        />
+      )}
+      <ShowPageContainer>
+        <ShowPageLeftContainer forceMobile={isMobile}>
+          {!isMobile && summaryCard}
+          {!isMobile && fieldsBox}
+        </ShowPageLeftContainer>
+        <ShowPageRightContainer
+          targetableObject={{
+            id: objectRecordId,
+            targetObjectNameSingular: objectMetadataItem?.nameSingular,
+          }}
+          timeline
+          tasks
+          notes
+          emails
+          isInRightDrawer={isInRightDrawer}
+          summaryCard={isMobile ? summaryCard : <></>}
+          fieldsBox={fieldsBox}
+          loading={isPrefetchLoading || loading || recordLoading}
+        />
+      </ShowPageContainer>
+    </>
   );
 };
diff --git a/packages/twenty-front/src/modules/object-record/record-show/graphql/operations/factories/findOneRecordForShowPageOperationSignatureFactory.ts b/packages/twenty-front/src/modules/object-record/record-show/graphql/operations/factories/findOneRecordForShowPageOperationSignatureFactory.ts
index 510c1f7a5d47..f9ed0579c3ba 100644
--- a/packages/twenty-front/src/modules/object-record/record-show/graphql/operations/factories/findOneRecordForShowPageOperationSignatureFactory.ts
+++ b/packages/twenty-front/src/modules/object-record/record-show/graphql/operations/factories/findOneRecordForShowPageOperationSignatureFactory.ts
@@ -29,7 +29,7 @@ export const buildFindOneRecordForShowPageOperationSignature: RecordGqlOperation
             },
           }
         : {}),
-      ...(objectMetadataItem.nameSingular === 'Note'
+      ...(objectMetadataItem.nameSingular === CoreObjectNameSingular.Note
         ? {
             noteTargets: {
               id: true,
diff --git a/packages/twenty-front/src/modules/object-record/record-show/hooks/useRecordShowPage.ts b/packages/twenty-front/src/modules/object-record/record-show/hooks/useRecordShowPage.ts
index 667f4eac13b5..7bdaf0b4284b 100644
--- a/packages/twenty-front/src/modules/object-record/record-show/hooks/useRecordShowPage.ts
+++ b/packages/twenty-front/src/modules/object-record/record-show/hooks/useRecordShowPage.ts
@@ -50,6 +50,7 @@ export const useRecordShowPage = (
     objectRecordId,
     objectNameSingular,
     recordGqlFields: FIND_ONE_RECORD_FOR_SHOW_PAGE_OPERATION_SIGNATURE.fields,
+    withSoftDeleted: true,
   });
 
   useEffect(() => {
diff --git a/packages/twenty-front/src/modules/object-record/select/hooks/useRecordsForSelect.ts b/packages/twenty-front/src/modules/object-record/select/hooks/useRecordsForSelect.ts
index cd759451c529..905d4fd8f138 100644
--- a/packages/twenty-front/src/modules/object-record/select/hooks/useRecordsForSelect.ts
+++ b/packages/twenty-front/src/modules/object-record/select/hooks/useRecordsForSelect.ts
@@ -2,13 +2,14 @@ import { isNonEmptyString } from '@sniptt/guards';
 
 import { useGetObjectOrderByField } from '@/object-metadata/hooks/useGetObjectOrderByField';
 import { useMapToObjectRecordIdentifier } from '@/object-metadata/hooks/useMapToObjectRecordIdentifier';
-import { OrderBy } from '@/object-metadata/types/OrderBy';
+
 import { DEFAULT_SEARCH_REQUEST_LIMIT } from '@/object-record/constants/DefaultSearchRequestLimit';
 import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
 import { SelectableRecord } from '@/object-record/select/types/SelectableRecord';
 import { getObjectFilterFields } from '@/object-record/select/utils/getObjectFilterFields';
 import { makeAndFilterVariables } from '@/object-record/utils/makeAndFilterVariables';
 import { makeOrFilterVariables } from '@/object-record/utils/makeOrFilterVariables';
+import { OrderBy } from '@/types/OrderBy';
 
 export const useRecordsForSelect = ({
   searchFilterText,
diff --git a/packages/twenty-front/src/modules/object-record/utils/getDestroyManyRecordsMutationResponseField.ts b/packages/twenty-front/src/modules/object-record/utils/getDestroyManyRecordsMutationResponseField.ts
new file mode 100644
index 000000000000..04f102f30754
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/utils/getDestroyManyRecordsMutationResponseField.ts
@@ -0,0 +1,5 @@
+import { capitalize } from '~/utils/string/capitalize';
+
+export const getDestroyManyRecordsMutationResponseField = (
+  objectNamePlural: string,
+) => `destroy${capitalize(objectNamePlural)}`;
diff --git a/packages/twenty-front/src/modules/object-record/utils/getRestoreManyRecordsMutationResponseField.ts b/packages/twenty-front/src/modules/object-record/utils/getRestoreManyRecordsMutationResponseField.ts
new file mode 100644
index 000000000000..ac375b79e1f0
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/utils/getRestoreManyRecordsMutationResponseField.ts
@@ -0,0 +1,5 @@
+import { capitalize } from '~/utils/string/capitalize';
+
+export const getRestoreManyRecordsMutationResponseField = (
+  objectNamePlural: string,
+) => `restore${capitalize(objectNamePlural)}`;
diff --git a/packages/twenty-front/src/modules/search/hooks/useFilteredSearchEntityQuery.ts b/packages/twenty-front/src/modules/search/hooks/useFilteredSearchEntityQuery.ts
index d50f4bee0604..06ba43f92e60 100644
--- a/packages/twenty-front/src/modules/search/hooks/useFilteredSearchEntityQuery.ts
+++ b/packages/twenty-front/src/modules/search/hooks/useFilteredSearchEntityQuery.ts
@@ -1,7 +1,6 @@
 import { isNonEmptyString } from '@sniptt/guards';
 
 import { useMapToObjectRecordIdentifier } from '@/object-metadata/hooks/useMapToObjectRecordIdentifier';
-import { OrderBy } from '@/object-metadata/types/OrderBy';
 import { DEFAULT_SEARCH_REQUEST_LIMIT } from '@/object-record/constants/DefaultSearchRequestLimit';
 import { RecordGqlOperationFilter } from '@/object-record/graphql/types/RecordGqlOperationFilter';
 import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
@@ -10,6 +9,7 @@ import { EntityForSelect } from '@/object-record/relation-picker/types/EntityFor
 import { ObjectRecord } from '@/object-record/types/ObjectRecord';
 import { makeAndFilterVariables } from '@/object-record/utils/makeAndFilterVariables';
 import { makeOrFilterVariables } from '@/object-record/utils/makeOrFilterVariables';
+import { OrderBy } from '@/types/OrderBy';
 import { generateILikeFiltersForCompositeFields } from '~/utils/array/generateILikeFiltersForCompositeFields';
 import { isDefined } from '~/utils/isDefined';
 
diff --git a/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx b/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx
index c87f636a66d5..f68981a195e6 100644
--- a/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx
+++ b/packages/twenty-front/src/modules/settings/components/SettingsNavigationDrawerItems.tsx
@@ -7,13 +7,13 @@ import {
   IconColorSwatch,
   IconCurrencyDollar,
   IconDoorEnter,
+  IconFunction,
   IconHierarchy2,
   IconMail,
   IconRocket,
   IconSettings,
   IconUserCircle,
   IconUsers,
-  IconFunction,
 } from 'twenty-ui';
 
 import { useAuth } from '@/auth/hooks/useAuth';
@@ -49,7 +49,6 @@ export const SettingsNavigationDrawerItems = () => {
           path={SettingsPath.Appearance}
           Icon={IconColorSwatch}
         />
-
         <NavigationDrawerItemGroup>
           <SettingsNavigationDrawerItem
             label="Accounts"
diff --git a/packages/twenty-front/src/modules/settings/components/SettingsPageContainer.tsx b/packages/twenty-front/src/modules/settings/components/SettingsPageContainer.tsx
index c49ff35df80d..d25c530762c6 100644
--- a/packages/twenty-front/src/modules/settings/components/SettingsPageContainer.tsx
+++ b/packages/twenty-front/src/modules/settings/components/SettingsPageContainer.tsx
@@ -1,9 +1,12 @@
 import styled from '@emotion/styled';
+import { ReactNode } from 'react';
 
 import { OBJECT_SETTINGS_WIDTH } from '@/settings/data-model/constants/ObjectSettings';
 import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
 import { isDefined } from '~/utils/isDefined';
 
+import { ScrollWrapper } from '@/ui/utilities/scroll/components/ScrollWrapper';
+
 const StyledSettingsPageContainer = styled.div<{ width?: number }>`
   display: flex;
   flex-direction: column;
@@ -21,4 +24,17 @@ const StyledSettingsPageContainer = styled.div<{ width?: number }>`
   }};
 `;
 
-export { StyledSettingsPageContainer as SettingsPageContainer };
+const StyledScrollWrapper = styled(ScrollWrapper)`
+  background-color: ${({ theme }) => theme.background.secondary};
+  border-radius: ${({ theme }) => theme.border.radius.md};
+`;
+
+export const SettingsPageContainer = ({
+  children,
+}: {
+  children: ReactNode;
+}) => (
+  <StyledScrollWrapper>
+    <StyledSettingsPageContainer>{children}</StyledSettingsPageContainer>
+  </StyledScrollWrapper>
+);
diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx
index f564892e05d2..92c7afecba9e 100644
--- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx
@@ -1,28 +1,36 @@
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
-import { ReactNode, useMemo } from 'react';
-import { Nullable, useIcons } from 'twenty-ui';
+import { useMemo } from 'react';
+import { IconMinus, IconPlus, isDefined, useIcons } from 'twenty-ui';
 
 import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMetadata';
 import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
 import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug';
-import { FieldIdentifierType } from '@/settings/data-model/types/FieldIdentifierType';
 import { isFieldTypeSupportedInSettings } from '@/settings/data-model/utils/isFieldTypeSupportedInSettings';
 import { TableCell } from '@/ui/layout/table/components/TableCell';
 import { TableRow } from '@/ui/layout/table/components/TableRow';
 
 import { RELATION_TYPES } from '../../constants/RelationTypes';
 
+import { LABEL_IDENTIFIER_FIELD_METADATA_TYPES } from '@/object-metadata/constants/LabelIdentifierFieldMetadataTypes';
+import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataItem';
+import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem';
+import { getFieldSlug } from '@/object-metadata/utils/getFieldSlug';
+import { isLabelIdentifierField } from '@/object-metadata/utils/isLabelIdentifierField';
+import { SettingsObjectFieldActiveActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown';
+import { SettingsObjectFieldInactiveActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown';
+import { settingsObjectFieldsFamilyState } from '@/settings/data-model/object-details/states/settingsObjectFieldsFamilyState';
+import { LightIconButton } from '@/ui/input/button/components/LightIconButton';
+import { useNavigate } from 'react-router-dom';
+import { useRecoilState } from 'recoil';
 import { RelationMetadataType } from '~/generated-metadata/graphql';
+import { SettingsObjectDetailTableItem } from '~/pages/settings/data-model/types/SettingsObjectDetailTableItem';
 import { SettingsObjectFieldDataType } from './SettingsObjectFieldDataType';
 
 type SettingsObjectFieldItemTableRowProps = {
-  ActionIcon: ReactNode;
-  fieldMetadataItem: FieldMetadataItem;
-  identifierType?: Nullable<FieldIdentifierType>;
-  variant?: 'field-type' | 'identifier';
-  isRemoteObjectField?: boolean;
-  to?: string;
+  settingsObjectDetailTableItem: SettingsObjectDetailTableItem;
+  status: 'active' | 'disabled';
+  mode: 'view' | 'new-field';
 };
 
 export const StyledObjectFieldTableRow = styled(TableRow)`
@@ -40,13 +48,19 @@ const StyledIconTableCell = styled(TableCell)`
 `;
 
 export const SettingsObjectFieldItemTableRow = ({
-  ActionIcon,
-  fieldMetadataItem,
-  identifierType,
-  variant = 'field-type',
-  isRemoteObjectField,
-  to,
+  settingsObjectDetailTableItem,
+  mode,
+  status,
 }: SettingsObjectFieldItemTableRowProps) => {
+  const { fieldMetadataItem, identifierType, objectMetadataItem } =
+    settingsObjectDetailTableItem;
+
+  const isRemoteObjectField = objectMetadataItem.isRemote;
+
+  const variant = objectMetadataItem.isCustom ? 'identifier' : 'field-type';
+
+  const navigate = useNavigate();
+
   const theme = useTheme();
   const { getIcon } = useIcons();
   const Icon = getIcon(fieldMetadataItem.icon);
@@ -62,31 +76,94 @@ export const SettingsObjectFieldItemTableRow = ({
   const fieldType = fieldMetadataItem.type;
   const isFieldTypeSupported = isFieldTypeSupportedInSettings(fieldType);
 
-  if (!isFieldTypeSupported) return null;
-
   const RelationIcon = relationType
     ? RELATION_TYPES[relationType].Icon
     : undefined;
 
+  const isLabelIdentifier = isLabelIdentifierField({
+    fieldMetadataItem,
+    objectMetadataItem,
+  });
+
+  const canToggleField = !isLabelIdentifier;
+
+  const canBeSetAsLabelIdentifier =
+    objectMetadataItem.isCustom &&
+    !isLabelIdentifier &&
+    LABEL_IDENTIFIER_FIELD_METADATA_TYPES.includes(fieldMetadataItem.type);
+
+  const linkToNavigate = `./${getFieldSlug(fieldMetadataItem)}`;
+
+  const {
+    activateMetadataField,
+    deactivateMetadataField,
+    deleteMetadataField,
+  } = useFieldMetadataItem();
+
+  const handleDisableField = (activeFieldMetadatItem: FieldMetadataItem) => {
+    deactivateMetadataField(activeFieldMetadatItem);
+  };
+
+  const { updateOneObjectMetadataItem } = useUpdateOneObjectMetadataItem();
+
+  const handleSetLabelIdentifierField = (
+    activeFieldMetadatItem: FieldMetadataItem,
+  ) =>
+    updateOneObjectMetadataItem({
+      idToUpdate: objectMetadataItem.id,
+      updatePayload: {
+        labelIdentifierFieldMetadataId: activeFieldMetadatItem.id,
+      },
+    });
+
+  const [, setActiveSettingsObjectFields] = useRecoilState(
+    settingsObjectFieldsFamilyState({
+      objectMetadataItemId: objectMetadataItem.id,
+    }),
+  );
+
+  const handleToggleField = () => {
+    setActiveSettingsObjectFields((previousFields) => {
+      const newFields = isDefined(previousFields)
+        ? previousFields?.map((field) =>
+            field.id === fieldMetadataItem.id
+              ? { ...field, isActive: !field.isActive }
+              : field,
+          )
+        : null;
+
+      return newFields;
+    });
+  };
+
+  const typeLabel =
+    variant === 'field-type'
+      ? isRemoteObjectField
+        ? 'Remote'
+        : fieldMetadataItem.isCustom
+          ? 'Custom'
+          : 'Standard'
+      : variant === 'identifier'
+        ? isDefined(identifierType)
+          ? identifierType === 'label'
+            ? 'Record text'
+            : 'Record image'
+          : ''
+        : '';
+
+  if (!isFieldTypeSupported) return null;
+
   return (
-    <StyledObjectFieldTableRow to={to}>
+    <StyledObjectFieldTableRow
+      to={mode === 'view' ? linkToNavigate : undefined}
+    >
       <StyledNameTableCell>
         {!!Icon && (
           <Icon size={theme.icon.size.md} stroke={theme.icon.stroke.sm} />
         )}
         {fieldMetadataItem.label}
       </StyledNameTableCell>
-      <TableCell>
-        {variant === 'field-type' &&
-          (isRemoteObjectField
-            ? 'Remote'
-            : fieldMetadataItem.isCustom
-              ? 'Custom'
-              : 'Standard')}
-        {variant === 'identifier' &&
-          !!identifierType &&
-          (identifierType === 'label' ? 'Record text' : 'Record image')}
-      </TableCell>
+      <TableCell>{typeLabel}</TableCell>
       <TableCell>
         <SettingsObjectFieldDataType
           Icon={RelationIcon}
@@ -105,7 +182,48 @@ export const SettingsObjectFieldItemTableRow = ({
           value={fieldType}
         />
       </TableCell>
-      <StyledIconTableCell>{ActionIcon}</StyledIconTableCell>
+      <StyledIconTableCell>
+        {status === 'active' ? (
+          mode === 'view' ? (
+            <SettingsObjectFieldActiveActionDropdown
+              isCustomField={fieldMetadataItem.isCustom === true}
+              scopeKey={fieldMetadataItem.id}
+              onEdit={() => navigate(linkToNavigate)}
+              onSetAsLabelIdentifier={
+                canBeSetAsLabelIdentifier
+                  ? () => handleSetLabelIdentifierField(fieldMetadataItem)
+                  : undefined
+              }
+              onDeactivate={
+                isLabelIdentifier
+                  ? undefined
+                  : () => handleDisableField(fieldMetadataItem)
+              }
+            />
+          ) : (
+            canToggleField && (
+              <LightIconButton
+                Icon={IconMinus}
+                accent="tertiary"
+                onClick={handleToggleField}
+              />
+            )
+          )
+        ) : mode === 'view' ? (
+          <SettingsObjectFieldInactiveActionDropdown
+            isCustomField={fieldMetadataItem.isCustom === true}
+            scopeKey={fieldMetadataItem.id}
+            onActivate={() => activateMetadataField(fieldMetadataItem)}
+            onDelete={() => deleteMetadataField(fieldMetadataItem)}
+          />
+        ) : (
+          <LightIconButton
+            Icon={IconPlus}
+            accent="tertiary"
+            onClick={handleToggleField}
+          />
+        )}
+      </StyledIconTableCell>
     </StyledObjectFieldTableRow>
   );
 };
diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectItemTableRow.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectItemTableRow.tsx
index ed5c7134162d..0c69f4b81afe 100644
--- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectItemTableRow.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectItemTableRow.tsx
@@ -1,19 +1,19 @@
-import { ReactNode } from 'react';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
+import { ReactNode } from 'react';
 import { useIcons } from 'twenty-ui';
 
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
-import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
 import { SettingsDataModelObjectTypeTag } from '@/settings/data-model/objects/SettingsDataModelObjectTypeTag';
 import { getObjectTypeLabel } from '@/settings/data-model/utils/getObjectTypeLabel';
 import { TableCell } from '@/ui/layout/table/components/TableCell';
 import { TableRow } from '@/ui/layout/table/components/TableRow';
 
-type SettingsObjectItemTableRowProps = {
+export type SettingsObjectMetadataItemTableRowProps = {
   action: ReactNode;
-  objectItem: ObjectMetadataItem;
-  to?: string;
+  objectMetadataItem: ObjectMetadataItem;
+  link?: string;
+  totalObjectCount: number;
 };
 
 export const StyledObjectTableRow = styled(TableRow)`
@@ -30,35 +30,33 @@ const StyledActionTableCell = styled(TableCell)`
   padding-right: ${({ theme }) => theme.spacing(1)};
 `;
 
-export const SettingsObjectItemTableRow = ({
+export const SettingsObjectMetadataItemTableRow = ({
   action,
-  objectItem,
-  to,
-}: SettingsObjectItemTableRowProps) => {
+  objectMetadataItem,
+  link,
+  totalObjectCount,
+}: SettingsObjectMetadataItemTableRowProps) => {
   const theme = useTheme();
 
-  const { totalCount } = useFindManyRecords({
-    objectNameSingular: objectItem.nameSingular,
-  });
   const { getIcon } = useIcons();
-  const Icon = getIcon(objectItem.icon);
-  const objectTypeLabel = getObjectTypeLabel(objectItem);
+  const Icon = getIcon(objectMetadataItem.icon);
+  const objectTypeLabel = getObjectTypeLabel(objectMetadataItem);
 
   return (
-    <StyledObjectTableRow key={objectItem.namePlural} to={to}>
+    <StyledObjectTableRow key={objectMetadataItem.namePlural} to={link}>
       <StyledNameTableCell>
         {!!Icon && (
           <Icon size={theme.icon.size.md} stroke={theme.icon.stroke.sm} />
         )}
-        {objectItem.labelPlural}
+        {objectMetadataItem.labelPlural}
       </StyledNameTableCell>
       <TableCell>
         <SettingsDataModelObjectTypeTag objectTypeLabel={objectTypeLabel} />
       </TableCell>
       <TableCell align="right">
-        {objectItem.fields.filter((field) => !field.isSystem).length}
+        {objectMetadataItem.fields.filter((field) => !field.isSystem).length}
       </TableCell>
-      <TableCell align="right">{totalCount}</TableCell>
+      <TableCell align="right">{totalObjectCount}</TableCell>
       <StyledActionTableCell>{action}</StyledActionTableCell>
     </StyledObjectTableRow>
   );
diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/states/settingsObjectFieldsFamilyState.ts b/packages/twenty-front/src/modules/settings/data-model/object-details/states/settingsObjectFieldsFamilyState.ts
new file mode 100644
index 000000000000..daf3c3c33dbf
--- /dev/null
+++ b/packages/twenty-front/src/modules/settings/data-model/object-details/states/settingsObjectFieldsFamilyState.ts
@@ -0,0 +1,14 @@
+import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+import { createFamilyState } from '@/ui/utilities/state/utils/createFamilyState';
+
+export type SortedFieldByTableFamilyStateKey = {
+  objectMetadataItemId: string;
+};
+
+export const settingsObjectFieldsFamilyState = createFamilyState<
+  FieldMetadataItem[] | null,
+  SortedFieldByTableFamilyStateKey
+>({
+  key: 'settingsObjectFieldsFamilyState',
+  defaultValue: null,
+});
diff --git a/packages/twenty-front/src/modules/settings/data-model/objects/SettingsObjectCoverImage.tsx b/packages/twenty-front/src/modules/settings/data-model/objects/SettingsObjectCoverImage.tsx
index 23be86ff8ca0..87ce82a443ea 100644
--- a/packages/twenty-front/src/modules/settings/data-model/objects/SettingsObjectCoverImage.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/objects/SettingsObjectCoverImage.tsx
@@ -4,6 +4,7 @@ import { IconEye } from 'twenty-ui';
 import { FloatingButton } from '@/ui/input/button/components/FloatingButton';
 import { Card } from '@/ui/layout/card/components/Card';
 
+import { SettingsPath } from '@/types/SettingsPath';
 import DarkCoverImage from '../assets/cover-dark.png';
 import LightCoverImage from '../assets/cover-light.png';
 
@@ -34,7 +35,7 @@ export const SettingsObjectCoverImage = () => {
           Icon={IconEye}
           title="Visualize"
           size="small"
-          to="/settings/objects/overview"
+          to={'/settings/' + SettingsPath.ObjectOverview}
         />
       </StyledButtonContainer>
     </StyledCoverImageContainer>
diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionShowContainer.tsx b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionShowContainer.tsx
index 03b733e4a94e..1e2b75d7c2b6 100644
--- a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionShowContainer.tsx
+++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionShowContainer.tsx
@@ -1,5 +1,5 @@
-import { useNavigate } from 'react-router-dom';
 import { Section } from '@react-email/components';
+import { useNavigate } from 'react-router-dom';
 import { H2Title } from 'twenty-ui';
 
 import { useDeleteOneDatabaseConnection } from '@/databases/hooks/useDeleteOneDatabaseConnection';
@@ -31,6 +31,7 @@ export const SettingsIntegrationDatabaseConnectionShowContainer = () => {
     SettingsPath.Integrations,
   );
 
+  // TODO: move breadcrumb to header?
   return (
     <>
       <Breadcrumb
diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx
index b454a31b0421..b1b3ae1a03fb 100644
--- a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx
+++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContent.tsx
@@ -1,8 +1,8 @@
-import { FormProvider, useForm } from 'react-hook-form';
-import { useNavigate } from 'react-router-dom';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { Section } from '@react-email/components';
 import pick from 'lodash.pick';
+import { FormProvider, useForm } from 'react-hook-form';
+import { useNavigate } from 'react-router-dom';
 import { H2Title } from 'twenty-ui';
 import { z } from 'zod';
 
@@ -94,6 +94,7 @@ export const SettingsIntegrationEditDatabaseConnectionContent = ({
     }
   };
 
+  // TODO: move breadcrumb to header?
   return (
     <>
       <FormProvider
diff --git a/packages/twenty-front/src/modules/spreadsheet-import/components/Table.tsx b/packages/twenty-front/src/modules/spreadsheet-import/components/SpreadsheetImportTable.tsx
similarity index 94%
rename from packages/twenty-front/src/modules/spreadsheet-import/components/Table.tsx
rename to packages/twenty-front/src/modules/spreadsheet-import/components/SpreadsheetImportTable.tsx
index ea953e057591..c898e0c24e26 100644
--- a/packages/twenty-front/src/modules/spreadsheet-import/components/Table.tsx
+++ b/packages/twenty-front/src/modules/spreadsheet-import/components/SpreadsheetImportTable.tsx
@@ -1,6 +1,6 @@
-// @ts-expect-error // Todo: remove usage of react-data-grid
-import DataGrid, { DataGridProps } from 'react-data-grid';
 import styled from '@emotion/styled';
+// @ts-expect-error  // Todo: remove usage of react-data-grid
+import DataGrid, { DataGridProps } from 'react-data-grid';
 import { RGBA } from 'twenty-ui';
 
 import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal';
@@ -107,12 +107,12 @@ const StyledDataGrid = styled(DataGrid)`
   }
 ` as typeof DataGrid;
 
-type TableProps<Data> = DataGridProps<Data> & {
+type SpreadsheetImportTableProps<Data> = DataGridProps<Data> & {
   rowHeight?: number;
   hiddenHeader?: boolean;
 };
 
-export const Table = <Data,>({
+export const SpreadsheetImportTable = <Data,>({
   className,
   columns,
   components,
@@ -123,7 +123,7 @@ export const Table = <Data,>({
   onRowsChange,
   onSelectedRowsChange,
   selectedRows,
-}: TableProps<Data>) => {
+}: SpreadsheetImportTableProps<Data>) => {
   const { rtl } = useSpreadsheetImportInternal();
 
   if (!rows?.length || !columns?.length) return null;
diff --git a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/SelectHeaderStep/components/SelectHeaderTable.tsx b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/SelectHeaderStep/components/SelectHeaderTable.tsx
index 3d5124fb91e3..f236f4319ee1 100644
--- a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/SelectHeaderStep/components/SelectHeaderTable.tsx
+++ b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/SelectHeaderStep/components/SelectHeaderTable.tsx
@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 
-import { Table } from '@/spreadsheet-import/components/Table';
+import { SpreadsheetImportTable } from '@/spreadsheet-import/components/SpreadsheetImportTable';
 import { ImportedRow } from '@/spreadsheet-import/types';
 
 import { generateSelectionColumns } from './SelectColumn';
@@ -22,7 +22,7 @@ export const SelectHeaderTable = ({
   );
 
   return (
-    <Table
+    <SpreadsheetImportTable
       // Todo: remove usage of react-data-grid
       rowKeyGetter={(row: any) => importedRows.indexOf(row)}
       rows={importedRows}
diff --git a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/ExampleTable.tsx b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/ExampleTable.tsx
index bbbaab975ae7..562b3c4788f8 100644
--- a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/ExampleTable.tsx
+++ b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/UploadStep/components/ExampleTable.tsx
@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 
-import { Table } from '@/spreadsheet-import/components/Table';
+import { SpreadsheetImportTable } from '@/spreadsheet-import/components/SpreadsheetImportTable';
 import { Fields } from '@/spreadsheet-import/types';
 import { generateExampleRow } from '@/spreadsheet-import/utils/generateExampleRow';
 
@@ -16,5 +16,11 @@ export const ExampleTable = <T extends string>({
   const data = useMemo(() => generateExampleRow(fields), [fields]);
   const columns = useMemo(() => generateColumns(fields), [fields]);
 
-  return <Table rows={data} columns={columns} className={'rdg-example'} />;
+  return (
+    <SpreadsheetImportTable
+      rows={data}
+      columns={columns}
+      className={'rdg-example'}
+    />
+  );
 };
diff --git a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx
index 2c20ed969ccd..bcd0405becaf 100644
--- a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx
+++ b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/ValidationStep/ValidationStep.tsx
@@ -5,8 +5,8 @@ import { RowsChangeData } from 'react-data-grid';
 import { IconTrash } from 'twenty-ui';
 
 import { Heading } from '@/spreadsheet-import/components/Heading';
+import { SpreadsheetImportTable } from '@/spreadsheet-import/components/SpreadsheetImportTable';
 import { StepNavigationButton } from '@/spreadsheet-import/components/StepNavigationButton';
-import { Table } from '@/spreadsheet-import/components/Table';
 import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal';
 import {
   Columns,
@@ -277,7 +277,7 @@ export const ValidationStep = <T extends string>({
           />
         </StyledToolbar>
         <StyledScrollContainer>
-          <Table
+          <SpreadsheetImportTable
             rowKeyGetter={rowKeyGetter}
             rows={tableData}
             onRowsChange={updateRow}
diff --git a/packages/twenty-front/src/modules/types/AppPath.ts b/packages/twenty-front/src/modules/types/AppPath.ts
index 5aab0b7e2ef6..dbbab7ad239e 100644
--- a/packages/twenty-front/src/modules/types/AppPath.ts
+++ b/packages/twenty-front/src/modules/types/AppPath.ts
@@ -15,7 +15,7 @@ export enum AppPath {
 
   // Onboarded
   Index = '/',
-  TasksPage = '/tasks',
+  TasksPage = '/objects/tasks',
   OpportunitiesPage = '/objects/opportunities',
 
   RecordIndexPage = '/objects/:objectNamePlural',
diff --git a/packages/twenty-front/src/modules/object-metadata/types/OrderBy.ts b/packages/twenty-front/src/modules/types/OrderBy.ts
similarity index 100%
rename from packages/twenty-front/src/modules/object-metadata/types/OrderBy.ts
rename to packages/twenty-front/src/modules/types/OrderBy.ts
diff --git a/packages/twenty-front/src/modules/ui/input/button/components/Button.tsx b/packages/twenty-front/src/modules/ui/input/button/components/Button.tsx
index a90daab5bb9d..de07f830399a 100644
--- a/packages/twenty-front/src/modules/ui/input/button/components/Button.tsx
+++ b/packages/twenty-front/src/modules/ui/input/button/components/Button.tsx
@@ -336,6 +336,7 @@ const StyledButton = styled('button', {
   flex-direction: row;
   font-family: ${({ theme }) => theme.font.family};
   font-weight: 500;
+  font-size: ${({ theme }) => theme.font.size.md};
   gap: ${({ theme }) => theme.spacing(1)};
   height: ${({ size }) => (size === 'small' ? '24px' : '32px')};
   justify-content: ${({ justify }) => justify};
diff --git a/packages/twenty-front/src/modules/ui/input/button/components/FloatingButton.tsx b/packages/twenty-front/src/modules/ui/input/button/components/FloatingButton.tsx
index 7904445a54c6..820da15de574 100644
--- a/packages/twenty-front/src/modules/ui/input/button/components/FloatingButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/button/components/FloatingButton.tsx
@@ -1,3 +1,4 @@
+import isPropValid from '@emotion/is-prop-valid';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { Link } from 'react-router-dom';
@@ -19,12 +20,11 @@ export type FloatingButtonProps = {
   to?: string;
 };
 
-const shouldForwardProp = (prop: string) =>
-  !['applyBlur', 'applyShadow', 'focus', 'position', 'size', 'to'].includes(
-    prop,
-  );
-
-const StyledButton = styled('button', { shouldForwardProp })<
+const StyledButton = styled('button', {
+  shouldForwardProp: (prop) =>
+    !['applyBlur', 'applyShadow', 'focus', 'position', 'size'].includes(prop) &&
+    isPropValid(prop),
+})<
   Pick<
     FloatingButtonProps,
     | 'size'
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
index ed24815dc73d..7be32100909a 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx
@@ -6,7 +6,7 @@ import {
   Placement,
   useFloating,
 } from '@floating-ui/react';
-import { useRef } from 'react';
+import { MouseEvent, useRef } from 'react';
 import { Keys } from 'react-hotkeys-hook';
 import { Key } from 'ts-key-enum';
 
@@ -93,6 +93,14 @@ export const Dropdown = ({
     toggleDropdown();
   };
 
+  const handleClickableComponentClick = (event: MouseEvent) => {
+    event.stopPropagation();
+    event.preventDefault();
+
+    toggleDropdown();
+    onClickOutside?.();
+  };
+
   useListenClickOutside({
     refs: [refs.floating],
     callback: () => {
@@ -126,10 +134,7 @@ export const Dropdown = ({
         {clickableComponent && (
           <div
             ref={refs.setReference}
-            onClick={() => {
-              toggleDropdown();
-              onClickOutside?.();
-            }}
+            onClick={handleClickableComponentClick}
             className={className}
           >
             {clickableComponent}
diff --git a/packages/twenty-front/src/modules/ui/layout/modal/components/Modal.tsx b/packages/twenty-front/src/modules/ui/layout/modal/components/Modal.tsx
index abd6bb2f053e..fe7983082e73 100644
--- a/packages/twenty-front/src/modules/ui/layout/modal/components/Modal.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/modal/components/Modal.tsx
@@ -1,7 +1,10 @@
 import { ModalHotkeyScope } from '@/ui/layout/modal/components/types/ModalHotkeyScope';
 import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
 import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
-import { useListenClickOutsideV2 } from '@/ui/utilities/pointer-event/hooks/useListenClickOutsideV2';
+import {
+  ClickOutsideMode,
+  useListenClickOutsideV2,
+} from '@/ui/utilities/pointer-event/hooks/useListenClickOutsideV2';
 import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
 import styled from '@emotion/styled';
 import { motion } from 'framer-motion';
@@ -205,6 +208,7 @@ export const Modal = ({
         onClose();
       }
     },
+    mode: ClickOutsideMode.comparePixels,
   });
 
   const stopEventPropagation = (e: React.MouseEvent) => {
diff --git a/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx b/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx
index ae60265f63b5..f9f9a1046e9c 100644
--- a/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/page/PageHeader.tsx
@@ -1,6 +1,6 @@
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
-import { ComponentProps, ReactNode } from 'react';
+import { ReactNode } from 'react';
 import { useRecoilValue } from 'recoil';
 import {
   IconChevronDown,
@@ -18,7 +18,7 @@ import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
 
 export const PAGE_BAR_MIN_HEIGHT = 40;
 
-const StyledTopBarContainer = styled.div`
+const StyledTopBarContainer = styled.div<{ width?: number }>`
   align-items: center;
   background: ${({ theme }) => theme.background.noisy};
   color: ${({ theme }) => theme.font.color.primary};
@@ -31,6 +31,7 @@ const StyledTopBarContainer = styled.div`
   padding-left: 0;
   padding-right: ${({ theme }) => theme.spacing(3)};
   z-index: 20;
+  width: ${({ width }) => width + 'px' || '100%'};
 
   @media (max-width: ${MOBILE_VIEWPORT}px) {
     padding-left: ${({ theme }) => theme.spacing(3)};
@@ -76,8 +77,8 @@ const StyledTopBarButtonContainer = styled.div`
   margin-right: ${({ theme }) => theme.spacing(1)};
 `;
 
-type PageHeaderProps = ComponentProps<'div'> & {
-  title: string;
+type PageHeaderProps = {
+  title: ReactNode;
   hasClosePageButton?: boolean;
   onClosePage?: () => void;
   hasPaginationButtons?: boolean;
@@ -87,6 +88,7 @@ type PageHeaderProps = ComponentProps<'div'> & {
   navigateToNextRecord?: () => void;
   Icon: IconComponent;
   children?: ReactNode;
+  width?: number;
 };
 
 export const PageHeader = ({
@@ -100,13 +102,14 @@ export const PageHeader = ({
   navigateToNextRecord,
   Icon,
   children,
+  width,
 }: PageHeaderProps) => {
   const isMobile = useIsMobile();
   const theme = useTheme();
   const isNavigationDrawerOpen = useRecoilValue(isNavigationDrawerOpenState);
 
   return (
-    <StyledTopBarContainer>
+    <StyledTopBarContainer width={width}>
       <StyledLeftContainer>
         {!isMobile && !isNavigationDrawerOpen && (
           <StyledTopBarButtonContainer>
@@ -143,7 +146,11 @@ export const PageHeader = ({
           )}
           {Icon && <Icon size={theme.icon.size.md} />}
           <StyledTitleContainer data-testid="top-bar-title">
-            <OverflowingTextWithTooltip text={title} />
+            {typeof title === 'string' ? (
+              <OverflowingTextWithTooltip text={title} />
+            ) : (
+              title
+            )}
           </StyledTitleContainer>
         </StyledTopBarIconStyledTitleContainer>
       </StyledLeftContainer>
diff --git a/packages/twenty-front/src/modules/ui/layout/page/PagePanel.tsx b/packages/twenty-front/src/modules/ui/layout/page/PagePanel.tsx
index 92a917a7181b..14cf6b0dfe12 100644
--- a/packages/twenty-front/src/modules/ui/layout/page/PagePanel.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/page/PagePanel.tsx
@@ -1,15 +1,21 @@
-import React from 'react';
 import styled from '@emotion/styled';
+import React from 'react';
 
 const StyledPanel = styled.div`
   background: ${({ theme }) => theme.background.primary};
   border: 1px solid ${({ theme }) => theme.border.color.medium};
   border-radius: ${({ theme }) => theme.border.radius.md};
   height: 100%;
-  overflow: auto;
+  overflow-x: auto;
+  overflow-y: hidden;
   width: 100%;
 `;
 
-export const PagePanel = ({ children }: { children: React.ReactNode }) => (
+type PagePanelProps = {
+  children: React.ReactNode;
+  hasInformationBar?: boolean;
+};
+
+export const PagePanel = ({ children }: PagePanelProps) => (
   <StyledPanel>{children}</StyledPanel>
 );
diff --git a/packages/twenty-front/src/modules/ui/layout/page/SubMenuTopBarContainer.tsx b/packages/twenty-front/src/modules/ui/layout/page/SubMenuTopBarContainer.tsx
index de229145dc84..8df4797d8199 100644
--- a/packages/twenty-front/src/modules/ui/layout/page/SubMenuTopBarContainer.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/page/SubMenuTopBarContainer.tsx
@@ -1,16 +1,18 @@
 import styled from '@emotion/styled';
-import { JSX } from 'react';
+import { JSX, ReactNode } from 'react';
 import { IconComponent } from 'twenty-ui';
 
 import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
 
 import { InformationBannerWrapper } from '@/information-banner/components/InformationBannerWrapper';
+import { OBJECT_SETTINGS_WIDTH } from '@/settings/data-model/constants/ObjectSettings';
 import { PageBody } from './PageBody';
 import { PageHeader } from './PageHeader';
 
 type SubMenuTopBarContainerProps = {
   children: JSX.Element | JSX.Element[];
-  title: string;
+  title: string | ReactNode;
+  actionButton?: ReactNode;
   Icon: IconComponent;
   className?: string;
 };
@@ -25,6 +27,7 @@ const StyledContainer = styled.div<{ isMobile: boolean }>`
 export const SubMenuTopBarContainer = ({
   children,
   title,
+  actionButton,
   Icon,
   className,
 }: SubMenuTopBarContainerProps) => {
@@ -32,7 +35,13 @@ export const SubMenuTopBarContainer = ({
 
   return (
     <StyledContainer isMobile={isMobile} className={className}>
-      {isMobile && <PageHeader title={title} Icon={Icon} />}
+      <PageHeader
+        title={title}
+        Icon={Icon}
+        width={OBJECT_SETTINGS_WIDTH + 4 * 8}
+      >
+        {actionButton}
+      </PageHeader>
       <PageBody>
         <InformationBannerWrapper />
         {children}
diff --git a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx
index 166b568c85ee..9cecd4558277 100644
--- a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageMoreButton.tsx
@@ -1,7 +1,7 @@
-import { useNavigate } from 'react-router-dom';
 import styled from '@emotion/styled';
-import { useRecoilValue } from 'recoil';
-import { IconDotsVertical, IconTrash } from 'twenty-ui';
+import { useNavigate } from 'react-router-dom';
+import { useRecoilState, useRecoilValue } from 'recoil';
+import { IconDotsVertical, IconRestore, IconTrash } from 'twenty-ui';
 
 import { useDeleteOneRecord } from '@/object-record/hooks/useDeleteOneRecord';
 import { PageHotkeyScope } from '@/types/PageHotkeyScope';
@@ -11,6 +11,9 @@ import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
 import { navigationMemorizedUrlState } from '@/ui/navigation/states/navigationMemorizedUrlState';
 
+import { useDestroyManyRecords } from '@/object-record/hooks/useDestroyManyRecords';
+import { useRestoreManyRecords } from '@/object-record/hooks/useRestoreManyRecords';
+import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState';
 import { Dropdown } from '../../dropdown/components/Dropdown';
 import { DropdownMenu } from '../../dropdown/components/DropdownMenu';
 
@@ -32,6 +35,12 @@ export const ShowPageMoreButton = ({
   const { deleteOneRecord } = useDeleteOneRecord({
     objectNameSingular,
   });
+  const { destroyManyRecords } = useDestroyManyRecords({
+    objectNameSingular,
+  });
+  const { restoreManyRecords } = useRestoreManyRecords({
+    objectNameSingular,
+  });
 
   const handleDelete = () => {
     deleteOneRecord(recordId);
@@ -39,6 +48,21 @@ export const ShowPageMoreButton = ({
     navigate(navigationMemorizedUrl, { replace: true });
   };
 
+  const handleDestroy = () => {
+    destroyManyRecords([recordId]);
+    closeDropdown();
+    navigate(navigationMemorizedUrl, { replace: true });
+  };
+
+  const handleRestore = () => {
+    restoreManyRecords([recordId]);
+    closeDropdown();
+  };
+
+  const [recordFromStore] = useRecoilState<any>(
+    recordStoreFamilyState(recordId),
+  );
+
   return (
     <StyledContainer>
       <Dropdown
@@ -56,12 +80,29 @@ export const ShowPageMoreButton = ({
         dropdownComponents={
           <DropdownMenu>
             <DropdownMenuItemsContainer>
-              <MenuItem
-                onClick={handleDelete}
-                accent="danger"
-                LeftIcon={IconTrash}
-                text="Delete"
-              />
+              {recordFromStore && !recordFromStore.deletedAt && (
+                <MenuItem
+                  onClick={handleDelete}
+                  accent="danger"
+                  LeftIcon={IconTrash}
+                  text="Delete"
+                />
+              )}
+              {recordFromStore && recordFromStore.deletedAt && (
+                <>
+                  <MenuItem
+                    onClick={handleDestroy}
+                    accent="danger"
+                    LeftIcon={IconTrash}
+                    text="Destroy"
+                  />
+                  <MenuItem
+                    onClick={handleRestore}
+                    LeftIcon={IconRestore}
+                    text="Restore"
+                  />
+                </>
+              )}
             </DropdownMenuItemsContainer>
           </DropdownMenu>
         }
diff --git a/packages/twenty-front/src/modules/ui/layout/table/components/SortableTableHeader.tsx b/packages/twenty-front/src/modules/ui/layout/table/components/SortableTableHeader.tsx
new file mode 100644
index 000000000000..fcdb02ebf543
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/table/components/SortableTableHeader.tsx
@@ -0,0 +1,67 @@
+import { TableHeader } from '@/ui/layout/table/components/TableHeader';
+import { sortedFieldByTableFamilyState } from '@/ui/layout/table/states/sortedFieldByTableFamilyState';
+import { TableSortValue } from '@/ui/layout/table/types/TableSortValue';
+import { useRecoilState } from 'recoil';
+import { IconArrowDown, IconArrowUp } from 'twenty-ui';
+
+export const SortableTableHeader = ({
+  tableId,
+  fieldName,
+  label,
+  align = 'left',
+  initialSort,
+}: {
+  tableId: string;
+  fieldName: string;
+  label: string;
+  align?: 'left' | 'center' | 'right';
+  initialSort?: TableSortValue;
+}) => {
+  const [sortedFieldByTable, setSortedFieldByTable] = useRecoilState(
+    sortedFieldByTableFamilyState({ tableId }),
+  );
+
+  const sortValue = sortedFieldByTable ?? initialSort;
+
+  const isSortOnThisField = sortValue?.fieldName === fieldName;
+
+  const sortDirection = isSortOnThisField ? sortValue.orderBy : null;
+
+  const isAsc =
+    sortDirection === 'AscNullsLast' || sortDirection === 'AscNullsFirst';
+  const isDesc =
+    sortDirection === 'DescNullsLast' || sortDirection === 'DescNullsFirst';
+
+  const isSortActive = isAsc || isDesc;
+
+  const handleClick = () => {
+    setSortedFieldByTable({
+      fieldName,
+      orderBy: isSortOnThisField
+        ? sortValue.orderBy === 'AscNullsLast'
+          ? 'DescNullsLast'
+          : 'AscNullsLast'
+        : 'DescNullsLast',
+    });
+  };
+
+  return (
+    <TableHeader align={align} onClick={handleClick}>
+      {isSortActive && align === 'right' ? (
+        isAsc ? (
+          <IconArrowUp size="14" />
+        ) : (
+          <IconArrowDown size="14" />
+        )
+      ) : null}
+      {label}
+      {isSortActive && align === 'left' ? (
+        isAsc ? (
+          <IconArrowUp size="14" />
+        ) : (
+          <IconArrowDown size="14" />
+        )
+      ) : null}
+    </TableHeader>
+  );
+};
diff --git a/packages/twenty-front/src/modules/ui/layout/table/components/TableHeader.tsx b/packages/twenty-front/src/modules/ui/layout/table/components/TableHeader.tsx
index 39e3a9ccc2ac..c00a80c0eef1 100644
--- a/packages/twenty-front/src/modules/ui/layout/table/components/TableHeader.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/table/components/TableHeader.tsx
@@ -1,6 +1,9 @@
 import styled from '@emotion/styled';
 
-const StyledTableHeader = styled.div<{ align?: 'left' | 'center' | 'right' }>`
+const StyledTableHeader = styled.div<{
+  align?: 'left' | 'center' | 'right';
+  onClick?: () => void;
+}>`
   align-items: center;
   border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
   color: ${({ theme }) => theme.font.color.tertiary};
@@ -15,6 +18,7 @@ const StyledTableHeader = styled.div<{ align?: 'left' | 'center' | 'right' }>`
         : 'flex-start'};
   padding: 0 ${({ theme }) => theme.spacing(2)};
   text-align: ${({ align }) => align ?? 'left'};
+  cursor: ${({ onClick }) => (onClick ? 'pointer' : 'default')};
 `;
 
 export { StyledTableHeader as TableHeader };
diff --git a/packages/twenty-front/src/modules/ui/layout/table/hooks/__tests__/useSortedArray.test.tsx b/packages/twenty-front/src/modules/ui/layout/table/hooks/__tests__/useSortedArray.test.tsx
new file mode 100644
index 000000000000..05298000eb4f
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/table/hooks/__tests__/useSortedArray.test.tsx
@@ -0,0 +1,119 @@
+import { renderHook } from '@testing-library/react';
+import React, { ReactNode } from 'react';
+import { MutableSnapshot, RecoilRoot } from 'recoil';
+
+import {
+  mockedTableMetadata,
+  MockedTableType,
+  mockedTableData as tableData,
+  tableDataSortedByFieldsCountInAscendingOrder,
+  tableDataSortedByFieldsCountInDescendingOrder,
+  tableDataSortedBylabelInAscendingOrder,
+  tableDataSortedBylabelInDescendingOrder,
+} from '~/testing/mock-data/tableData';
+
+import { OrderBy } from '@/types/OrderBy';
+import { sortedFieldByTableFamilyState } from '@/ui/layout/table/states/sortedFieldByTableFamilyState';
+
+import { useSortedArray } from '@/ui/layout/table/hooks/useSortedArray';
+
+interface WrapperProps {
+  children: ReactNode;
+  initializeState?: (mutableSnapshot: MutableSnapshot) => void;
+}
+
+const Wrapper: React.FC<WrapperProps> = ({ children, initializeState }) => (
+  <RecoilRoot initializeState={initializeState}>{children}</RecoilRoot>
+);
+
+describe('useSortedArray hook', () => {
+  const initializeState =
+    (fieldName: keyof MockedTableType, orderBy: OrderBy) =>
+    ({ set }: MutableSnapshot) => {
+      set(
+        sortedFieldByTableFamilyState({
+          tableId: mockedTableMetadata.tableId,
+        }),
+        {
+          fieldName,
+          orderBy,
+        },
+      );
+    };
+
+  test('initial sorting behavior for string fields - Ascending', () => {
+    const { result } = renderHook(
+      () => useSortedArray(tableData, mockedTableMetadata),
+      {
+        wrapper: ({ children }: { children: ReactNode }) => (
+          <Wrapper
+            initializeState={initializeState('labelPlural', 'AscNullsLast')}
+          >
+            {children}
+          </Wrapper>
+        ),
+      },
+    );
+
+    const sortedData = result.current;
+
+    expect(sortedData).toEqual(tableDataSortedBylabelInAscendingOrder);
+  });
+
+  test('initial sorting behavior for string fields - Descending', () => {
+    const { result } = renderHook(
+      () => useSortedArray(tableData, mockedTableMetadata),
+      {
+        wrapper: ({ children }: { children: ReactNode }) => (
+          <Wrapper
+            initializeState={initializeState('labelPlural', 'DescNullsLast')}
+          >
+            {children}
+          </Wrapper>
+        ),
+      },
+    );
+
+    const sortedData = result.current;
+
+    expect(sortedData).toEqual(tableDataSortedBylabelInDescendingOrder);
+  });
+
+  test('initial sorting behavior for number fields - Ascending', () => {
+    const { result } = renderHook(
+      () => useSortedArray(tableData, mockedTableMetadata),
+      {
+        wrapper: ({ children }: { children: ReactNode }) => (
+          <Wrapper
+            initializeState={initializeState('fieldsCount', 'AscNullsLast')}
+          >
+            {children}
+          </Wrapper>
+        ),
+      },
+    );
+
+    const sortedData = result.current;
+
+    expect(sortedData).toEqual(tableDataSortedByFieldsCountInAscendingOrder);
+  });
+
+  test('initial sorting behavior for number fields - Descending', () => {
+    const { result } = renderHook(
+      () => useSortedArray(tableData, mockedTableMetadata),
+      {
+        wrapper: ({ children }: { children: ReactNode }) => (
+          <Wrapper
+            initializeState={initializeState('fieldsCount', 'DescNullsLast')}
+          >
+            {children}
+          </Wrapper>
+        ),
+      },
+    );
+
+    const sortedData = result.current;
+
+    expect(sortedData).toEqual(tableDataSortedByFieldsCountInDescendingOrder);
+  });
+});
diff --git a/packages/twenty-front/src/modules/ui/layout/table/hooks/useSortedArray.ts b/packages/twenty-front/src/modules/ui/layout/table/hooks/useSortedArray.ts
new file mode 100644
index 000000000000..bc582345ff3c
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/table/hooks/useSortedArray.ts
@@ -0,0 +1,52 @@
+import { sortedFieldByTableFamilyState } from '@/ui/layout/table/states/sortedFieldByTableFamilyState';
+import { TableMetadata } from '@/ui/layout/table/types/TableMetadata';
+import { useMemo } from 'react';
+import { useRecoilValue } from 'recoil';
+import { isDefined } from 'twenty-ui';
+
+export const useSortedArray = <T>(
+  arrayToSort: T[],
+  tableMetadata: TableMetadata<T>,
+): T[] => {
+  const sortedFieldByTable = useRecoilValue(
+    sortedFieldByTableFamilyState({ tableId: tableMetadata.tableId }),
+  );
+
+  const initialSort = tableMetadata.initialSort;
+
+  const sortedArray = useMemo(() => {
+    const sortValueToUse = isDefined(sortedFieldByTable)
+      ? sortedFieldByTable
+      : initialSort;
+
+    if (!isDefined(sortValueToUse)) {
+      return arrayToSort;
+    }
+
+    const sortFieldName = sortValueToUse.fieldName as keyof T;
+    const sortFieldType = tableMetadata.fields.find(
+      (field) => field.fieldName === sortFieldName,
+    )?.fieldType;
+    const sortOrder = sortValueToUse.orderBy;
+
+    return [...arrayToSort].sort((a: T, b: T) => {
+      if (sortFieldType === 'string') {
+        return sortOrder === 'AscNullsLast' || sortOrder === 'AscNullsFirst'
+          ? (a[sortFieldName] as string)?.localeCompare(
+              b[sortFieldName] as string,
+            )
+          : (b[sortFieldName] as string)?.localeCompare(
+              a[sortFieldName] as string,
+            );
+      } else if (sortFieldType === 'number') {
+        return sortOrder === 'AscNullsLast' || sortOrder === 'AscNullsFirst'
+          ? (a[sortFieldName] as number) - (b[sortFieldName] as number)
+          : (b[sortFieldName] as number) - (a[sortFieldName] as number);
+      } else {
+        return 0;
+      }
+    });
+  }, [arrayToSort, tableMetadata, initialSort, sortedFieldByTable]);
+
+  return sortedArray;
+};
diff --git a/packages/twenty-front/src/modules/ui/layout/table/states/sortedFieldByTableFamilyState.ts b/packages/twenty-front/src/modules/ui/layout/table/states/sortedFieldByTableFamilyState.ts
new file mode 100644
index 000000000000..7e088dab72d9
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/table/states/sortedFieldByTableFamilyState.ts
@@ -0,0 +1,14 @@
+import { TableSortValue } from '@/ui/layout/table/types/TableSortValue';
+import { createFamilyState } from '@/ui/utilities/state/utils/createFamilyState';
+
+export type SortedFieldByTableFamilyStateKey = {
+  tableId: string;
+};
+
+export const sortedFieldByTableFamilyState = createFamilyState<
+  TableSortValue | null,
+  SortedFieldByTableFamilyStateKey
+>({
+  key: 'sortedFieldByTableFamilyState',
+  defaultValue: null,
+});
diff --git a/packages/twenty-front/src/modules/ui/layout/table/types/TableFieldMetadata.ts b/packages/twenty-front/src/modules/ui/layout/table/types/TableFieldMetadata.ts
new file mode 100644
index 000000000000..4e807bda6533
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/table/types/TableFieldMetadata.ts
@@ -0,0 +1,6 @@
+export type TableFieldMetadata<ItemType> = {
+  fieldLabel: string;
+  fieldName: keyof ItemType;
+  fieldType: 'string' | 'number';
+  align: 'left' | 'right';
+};
diff --git a/packages/twenty-front/src/modules/ui/layout/table/types/TableMetadata.ts b/packages/twenty-front/src/modules/ui/layout/table/types/TableMetadata.ts
new file mode 100644
index 000000000000..b4ba856f1407
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/table/types/TableMetadata.ts
@@ -0,0 +1,8 @@
+import { TableFieldMetadata } from '@/ui/layout/table/types/TableFieldMetadata';
+import { TableSortValue } from '@/ui/layout/table/types/TableSortValue';
+
+export type TableMetadata<ItemType> = {
+  tableId: string;
+  fields: TableFieldMetadata<ItemType>[];
+  initialSort?: TableSortValue;
+};
diff --git a/packages/twenty-front/src/modules/ui/layout/table/types/TableSortValue.ts b/packages/twenty-front/src/modules/ui/layout/table/types/TableSortValue.ts
new file mode 100644
index 000000000000..f72ba0b5b979
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/table/types/TableSortValue.ts
@@ -0,0 +1,6 @@
+import { OrderBy } from '@/types/OrderBy';
+
+export type TableSortValue = {
+  fieldName: string;
+  orderBy: OrderBy;
+};
diff --git a/packages/twenty-front/src/modules/ui/navigation/bread-crumb/components/Breadcrumb.tsx b/packages/twenty-front/src/modules/ui/navigation/bread-crumb/components/Breadcrumb.tsx
index 099f3022e15c..d06cfc8263ca 100644
--- a/packages/twenty-front/src/modules/ui/navigation/bread-crumb/components/Breadcrumb.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/bread-crumb/components/Breadcrumb.tsx
@@ -1,6 +1,6 @@
+import styled from '@emotion/styled';
 import { Fragment } from 'react';
 import { Link } from 'react-router-dom';
-import styled from '@emotion/styled';
 
 type BreadcrumbProps = {
   className?: string;
@@ -9,10 +9,10 @@ type BreadcrumbProps = {
 
 const StyledWrapper = styled.nav`
   align-items: center;
-  color: ${({ theme }) => theme.font.color.extraLight};
+  color: ${({ theme }) => theme.font.color.secondary};
   display: flex;
-  font-size: ${({ theme }) => theme.font.size.lg};
-  font-weight: ${({ theme }) => theme.font.weight.semiBold};
+  font-size: ${({ theme }) => theme.font.size.md};
+  // font-weight: ${({ theme }) => theme.font.weight.semiBold};
   gap: ${({ theme }) => theme.spacing(2)};
   line-height: ${({ theme }) => theme.text.lineHeight.lg};
 `;
@@ -23,7 +23,7 @@ const StyledLink = styled(Link)`
 `;
 
 const StyledText = styled.span`
-  color: ${({ theme }) => theme.font.color.tertiary};
+  color: ${({ theme }) => theme.font.color.primary};
 `;
 
 export const Breadcrumb = ({ className, links }: BreadcrumbProps) => (
diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx
index 406402377646..92b020a7dc7b 100644
--- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawer.tsx
@@ -32,7 +32,7 @@ const StyledContainer = styled.div<{ isSubMenu?: boolean }>`
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
-  gap: ${({ theme }) => theme.spacing(3)};
+  gap: ${({ theme }) => theme.spacing(3.5)};
   height: 100%;
   min-width: ${DESKTOP_NAV_DRAWER_WIDTHS.menu}px;
   padding: ${({ theme }) => theme.spacing(3, 2, 4)};
diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx
index d6bbf810089b..03ae1fcd0ada 100644
--- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx
@@ -15,8 +15,6 @@ const StyledContainer = styled.div<{ isMultiWorkspace: boolean }>`
   display: flex;
   gap: ${({ theme, isMultiWorkspace }) =>
     !isMultiWorkspace ? theme.spacing(2) : null};
-  padding: ${({ theme, isMultiWorkspace }) =>
-    !isMultiWorkspace ? theme.spacing(1) : null};
   height: ${({ theme }) => theme.spacing(8)};
   user-select: none;
 `;
diff --git a/packages/twenty-front/src/modules/views/components/SortOrFilterChip.tsx b/packages/twenty-front/src/modules/views/components/SortOrFilterChip.tsx
index 47106b58c1f8..0fab6fffdece 100644
--- a/packages/twenty-front/src/modules/views/components/SortOrFilterChip.tsx
+++ b/packages/twenty-front/src/modules/views/components/SortOrFilterChip.tsx
@@ -2,12 +2,37 @@ import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { IconComponent, IconX } from 'twenty-ui';
 
-const StyledChip = styled.div`
+const StyledChip = styled.div<{ variant: SortOrFitlerChipVariant }>`
   align-items: center;
-  background-color: ${({ theme }) => theme.accent.quaternary};
-  border: 1px solid ${({ theme }) => theme.accent.tertiary};
+  background-color: ${({ theme, variant }) => {
+    switch (variant) {
+      case 'danger':
+        return theme.background.danger;
+      case 'default':
+      default:
+        return theme.accent.quaternary;
+    }
+  }};
+  border: 1px solid
+    ${({ theme, variant }) => {
+      switch (variant) {
+        case 'danger':
+          return theme.border.color.danger;
+        case 'default':
+        default:
+          return theme.accent.tertiary;
+      }
+    }};
   border-radius: 4px;
-  color: ${({ theme }) => theme.color.blue};
+  color: ${({ theme, variant }) => {
+    switch (variant) {
+      case 'danger':
+        return theme.color.red;
+      case 'default':
+      default:
+        return theme.color.blue;
+    }
+  }};
   cursor: pointer;
   display: flex;
   flex-direction: row;
@@ -24,7 +49,7 @@ const StyledIcon = styled.div`
   margin-right: ${({ theme }) => theme.spacing(1)};
 `;
 
-const StyledDelete = styled.div`
+const StyledDelete = styled.div<{ variant: SortOrFitlerChipVariant }>`
   align-items: center;
   cursor: pointer;
   display: flex;
@@ -33,7 +58,15 @@ const StyledDelete = styled.div`
   margin-top: 1px;
   user-select: none;
   &:hover {
-    background-color: ${({ theme }) => theme.accent.secondary};
+    background-color: ${({ theme, variant }) => {
+      switch (variant) {
+        case 'danger':
+          return theme.color.red20;
+        case 'default':
+        default:
+          return theme.accent.secondary;
+      }
+    }};
     border-radius: ${({ theme }) => theme.border.radius.sm};
   }
 `;
@@ -42,9 +75,12 @@ const StyledLabelKey = styled.div`
   font-weight: ${({ theme }) => theme.font.weight.medium};
 `;
 
+type SortOrFitlerChipVariant = 'default' | 'danger';
+
 type SortOrFilterChipProps = {
   labelKey?: string;
   labelValue: string;
+  variant?: SortOrFitlerChipVariant;
   Icon?: IconComponent;
   onRemove: () => void;
   onClick?: () => void;
@@ -54,6 +90,7 @@ type SortOrFilterChipProps = {
 export const SortOrFilterChip = ({
   labelKey,
   labelValue,
+  variant = 'default',
   Icon,
   onRemove,
   testId,
@@ -67,7 +104,7 @@ export const SortOrFilterChip = ({
   };
 
   return (
-    <StyledChip onClick={onClick}>
+    <StyledChip onClick={onClick} variant={variant}>
       {Icon && (
         <StyledIcon>
           <Icon size={theme.icon.size.sm} />
@@ -76,6 +113,7 @@ export const SortOrFilterChip = ({
       {labelKey && <StyledLabelKey>{labelKey}</StyledLabelKey>}
       {labelValue}
       <StyledDelete
+        variant={variant}
         onClick={handleDeleteClick}
         data-testid={'remove-icon-' + testId}
       >
diff --git a/packages/twenty-front/src/modules/views/components/VariantFilterChip.tsx b/packages/twenty-front/src/modules/views/components/VariantFilterChip.tsx
new file mode 100644
index 000000000000..70033af530d8
--- /dev/null
+++ b/packages/twenty-front/src/modules/views/components/VariantFilterChip.tsx
@@ -0,0 +1,30 @@
+import { useIcons } from 'twenty-ui';
+
+import { Filter } from '@/object-record/object-filter-dropdown/types/Filter';
+import { SortOrFilterChip } from '@/views/components/SortOrFilterChip';
+import { useCombinedViewFilters } from '@/views/hooks/useCombinedViewFilters';
+
+type VariantFilterChipProps = {
+  viewFilter: Filter;
+};
+
+export const VariantFilterChip = ({ viewFilter }: VariantFilterChipProps) => {
+  const { removeCombinedViewFilter } = useCombinedViewFilters();
+
+  const { getIcon } = useIcons();
+
+  const handleRemoveClick = () => {
+    removeCombinedViewFilter(viewFilter.id);
+  };
+
+  return (
+    <SortOrFilterChip
+      key={viewFilter.fieldMetadataId}
+      testId={viewFilter.fieldMetadataId}
+      variant={viewFilter.variant}
+      labelValue={viewFilter.definition.label}
+      Icon={getIcon(viewFilter.definition.iconName)}
+      onRemove={handleRemoveClick}
+    />
+  );
+};
diff --git a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
index e51137f74461..6f2c9f6e7076 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
@@ -1,9 +1,10 @@
-import { ReactNode } from 'react';
 import styled from '@emotion/styled';
+import { ReactNode, useMemo } from 'react';
 import { useRecoilValue } from 'recoil';
 
 import { AddObjectFilterFromDetailsButton } from '@/object-record/object-filter-dropdown/components/AddObjectFilterFromDetailsButton';
 import { ObjectFilterDropdownScope } from '@/object-record/object-filter-dropdown/scopes/ObjectFilterDropdownScope';
+import { Filter } from '@/object-record/object-filter-dropdown/types/Filter';
 import { DropdownScope } from '@/ui/layout/dropdown/scopes/DropdownScope';
 import { EditableFilterDropdownButton } from '@/views/components/EditableFilterDropdownButton';
 import { EditableSortChip } from '@/views/components/EditableSortChip';
@@ -14,6 +15,7 @@ import { useGetCurrentView } from '@/views/hooks/useGetCurrentView';
 import { useResetCurrentView } from '@/views/hooks/useResetCurrentView';
 import { mapViewFiltersToFilters } from '@/views/utils/mapViewFiltersToFilters';
 import { mapViewSortsToSorts } from '@/views/utils/mapViewSortsToSorts';
+import { VariantFilterChip } from './VariantFilterChip';
 
 export type ViewBarDetailsProps = {
   hasFilterButton?: boolean;
@@ -118,6 +120,29 @@ export const ViewBarDetails = ({
   const { resetCurrentView } = useResetCurrentView();
   const canResetView = canPersistView && !hasFiltersQueryParams;
 
+  const { otherViewFilters, defaultViewFilters } = useMemo(() => {
+    if (!currentViewWithCombinedFiltersAndSorts) {
+      return {
+        otherViewFilters: [],
+        defaultViewFilters: [],
+      };
+    }
+
+    const otherViewFilters =
+      currentViewWithCombinedFiltersAndSorts.viewFilters.filter(
+        (viewFilter) => viewFilter.variant && viewFilter.variant !== 'default',
+      );
+    const defaultViewFilters =
+      currentViewWithCombinedFiltersAndSorts.viewFilters.filter(
+        (viewFilter) => !viewFilter.variant || viewFilter.variant === 'default',
+      );
+
+    return {
+      otherViewFilters,
+      defaultViewFilters,
+    };
+  }, [currentViewWithCombinedFiltersAndSorts]);
+
   const handleCancelClick = () => {
     resetCurrentView();
   };
@@ -136,6 +161,22 @@ export const ViewBarDetails = ({
     <StyledBar>
       <StyledFilterContainer>
         <StyledChipcontainer>
+          {otherViewFilters.map((viewFilter) => (
+            <VariantFilterChip
+              key={viewFilter.fieldMetadataId}
+              // Why do we have two types, Filter and ViewFilter?
+              // Why key defition is already present in the Filter type and added on the fly here with mapViewFiltersToFilters ?
+              // Also as filter is spread into viewFilter, definition is present
+              // FixMe: Ugly hack to make it work
+              viewFilter={viewFilter as unknown as Filter}
+            />
+          ))}
+          {!!otherViewFilters.length &&
+            !!currentViewWithCombinedFiltersAndSorts?.viewSorts?.length && (
+              <StyledSeperatorContainer>
+                <StyledSeperator />
+              </StyledSeperatorContainer>
+            )}
           {mapViewSortsToSorts(
             currentViewWithCombinedFiltersAndSorts?.viewSorts ?? [],
             availableSortDefinitions,
@@ -143,13 +184,13 @@ export const ViewBarDetails = ({
             <EditableSortChip key={sort.fieldMetadataId} viewSort={sort} />
           ))}
           {!!currentViewWithCombinedFiltersAndSorts?.viewSorts?.length &&
-            !!currentViewWithCombinedFiltersAndSorts?.viewFilters?.length && (
+            !!defaultViewFilters.length && (
               <StyledSeperatorContainer>
                 <StyledSeperator />
               </StyledSeperatorContainer>
             )}
           {mapViewFiltersToFilters(
-            currentViewWithCombinedFiltersAndSorts?.viewFilters ?? [],
+            defaultViewFilters,
             availableFilterDefinitions,
           ).map((viewFilter) => (
             <ObjectFilterDropdownScope
diff --git a/packages/twenty-front/src/modules/views/types/ViewFilter.ts b/packages/twenty-front/src/modules/views/types/ViewFilter.ts
index 1a21b111f071..608e13918550 100644
--- a/packages/twenty-front/src/modules/views/types/ViewFilter.ts
+++ b/packages/twenty-front/src/modules/views/types/ViewFilter.ts
@@ -3,6 +3,7 @@ import { ViewFilterOperand } from './ViewFilterOperand';
 export type ViewFilter = {
   __typename: 'ViewFilter';
   id: string;
+  variant?: 'default' | 'danger';
   fieldMetadataId: string;
   operand: ViewFilterOperand;
   value: string;
diff --git a/packages/twenty-front/src/pages/settings/Releases.tsx b/packages/twenty-front/src/pages/settings/Releases.tsx
index de3c74f33659..72d9732b7ebb 100644
--- a/packages/twenty-front/src/pages/settings/Releases.tsx
+++ b/packages/twenty-front/src/pages/settings/Releases.tsx
@@ -3,7 +3,7 @@ import React, { useEffect, useState } from 'react';
 import rehypeStringify from 'rehype-stringify';
 import remarkParse from 'remark-parse';
 import remarkRehype from 'remark-rehype';
-import { H1Title, IconSettings } from 'twenty-ui';
+import { H1Title, IconRocket } from 'twenty-ui';
 import { unified } from 'unified';
 import { visit } from 'unist-util-visit';
 
@@ -108,7 +108,7 @@ export const Releases = () => {
   }, []);
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Releases">
+    <SubMenuTopBarContainer Icon={IconRocket} title="Releases">
       <SettingsPageContainer>
         <StyledH1Title title="Releases" />
         <ScrollWrapper>
diff --git a/packages/twenty-front/src/pages/settings/SettingsProfile.tsx b/packages/twenty-front/src/pages/settings/SettingsProfile.tsx
index 4f876639c054..07202b6fa42f 100644
--- a/packages/twenty-front/src/pages/settings/SettingsProfile.tsx
+++ b/packages/twenty-front/src/pages/settings/SettingsProfile.tsx
@@ -1,5 +1,4 @@
-import styled from '@emotion/styled';
-import { H1Title, H2Title, IconSettings } from 'twenty-ui';
+import { H2Title, IconUserCircle } from 'twenty-ui';
 
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { ChangePassword } from '@/settings/profile/components/ChangePassword';
@@ -10,14 +9,9 @@ import { ProfilePictureUploader } from '@/settings/profile/components/ProfilePic
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
 
-const StyledH1Title = styled(H1Title)`
-  margin-bottom: 0;
-`;
-
 export const SettingsProfile = () => (
-  <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+  <SubMenuTopBarContainer Icon={IconUserCircle} title="Profile">
     <SettingsPageContainer>
-      <StyledH1Title title="Profile" />
       <Section>
         <H2Title title="Picture" />
         <ProfilePictureUploader />
diff --git a/packages/twenty-front/src/pages/settings/SettingsWorkspace.tsx b/packages/twenty-front/src/pages/settings/SettingsWorkspace.tsx
index bfcee4cc1d2e..84f27a4c4cc2 100644
--- a/packages/twenty-front/src/pages/settings/SettingsWorkspace.tsx
+++ b/packages/twenty-front/src/pages/settings/SettingsWorkspace.tsx
@@ -1,5 +1,4 @@
-import styled from '@emotion/styled';
-import { H1Title, H2Title, IconSettings } from 'twenty-ui';
+import { H2Title, IconSettings } from 'twenty-ui';
 
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { DeleteWorkspace } from '@/settings/profile/components/DeleteWorkspace';
@@ -9,14 +8,9 @@ import { WorkspaceLogoUploader } from '@/settings/workspace/components/Workspace
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
 
-const StyledH1Title = styled(H1Title)`
-  margin-bottom: 0;
-`;
-
 export const SettingsWorkspace = () => (
-  <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+  <SubMenuTopBarContainer Icon={IconSettings} title="General">
     <SettingsPageContainer>
-      <StyledH1Title title="General" />
       <Section>
         <H2Title title="Picture" />
         <WorkspaceLogoUploader />
diff --git a/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx b/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx
index 8339d1cbbf58..2408fd380d6b 100644
--- a/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx
+++ b/packages/twenty-front/src/pages/settings/SettingsWorkspaceMembers.tsx
@@ -1,7 +1,7 @@
 import styled from '@emotion/styled';
 import { useState } from 'react';
 import { useRecoilValue } from 'recoil';
-import { H1Title, H2Title, IconSettings, IconTrash } from 'twenty-ui';
+import { H2Title, IconTrash, IconUsers } from 'twenty-ui';
 
 import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
 import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
@@ -18,10 +18,6 @@ import { WorkspaceInviteLink } from '@/workspace/components/WorkspaceInviteLink'
 import { WorkspaceInviteTeam } from '@/workspace/components/WorkspaceInviteTeam';
 import { WorkspaceMemberCard } from '@/workspace/components/WorkspaceMemberCard';
 
-const StyledH1Title = styled(H1Title)`
-  margin-bottom: 0;
-`;
-
 const StyledButtonContainer = styled.div`
   align-items: center;
   display: flex;
@@ -50,9 +46,8 @@ export const SettingsWorkspaceMembers = () => {
   };
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer Icon={IconUsers} title="Members">
       <SettingsPageContainer>
-        <StyledH1Title title="Members" />
         <Section>
           <H2Title
             title="Invite by email"
diff --git a/packages/twenty-front/src/pages/settings/accounts/SettingsAccounts.tsx b/packages/twenty-front/src/pages/settings/accounts/SettingsAccounts.tsx
index 0a46dfbe95d9..c9fa96c6c404 100644
--- a/packages/twenty-front/src/pages/settings/accounts/SettingsAccounts.tsx
+++ b/packages/twenty-front/src/pages/settings/accounts/SettingsAccounts.tsx
@@ -1,5 +1,5 @@
 import { useRecoilValue } from 'recoil';
-import { H2Title, IconSettings } from 'twenty-ui';
+import { H2Title, IconAt } from 'twenty-ui';
 
 import { ConnectedAccount } from '@/accounts/types/ConnectedAccount';
 import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
@@ -14,7 +14,6 @@ import { SettingsAccountsSettingsSection } from '@/settings/accounts/components/
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
-import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
 
 export const SettingsAccounts = () => {
@@ -37,10 +36,8 @@ export const SettingsAccounts = () => {
   const isBlocklistEnabled = useIsFeatureEnabled('IS_BLOCKLIST_ENABLED');
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer Icon={IconAt} title="Account">
       <SettingsPageContainer>
-        <Breadcrumb links={[{ children: 'Accounts' }]} />
-
         {loading ? (
           <SettingsAccountLoader />
         ) : (
diff --git a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendars.tsx b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendars.tsx
index 6d3d1c3570e7..f2e93d234ecc 100644
--- a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendars.tsx
+++ b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendars.tsx
@@ -1,5 +1,3 @@
-import { IconSettings } from 'twenty-ui';
-
 import { SettingsAccountsCalendarChannelsContainer } from '@/settings/accounts/components/SettingsAccountsCalendarChannelsContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
@@ -7,11 +5,13 @@ import { SettingsPath } from '@/types/SettingsPath';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
 import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { IconCalendarEvent } from 'twenty-ui';
 
 export const SettingsAccountsCalendars = () => {
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
-      <SettingsPageContainer>
+    <SubMenuTopBarContainer
+      Icon={IconCalendarEvent}
+      title={
         <Breadcrumb
           links={[
             {
@@ -21,6 +21,9 @@ export const SettingsAccountsCalendars = () => {
             { children: 'Calendars' },
           ]}
         />
+      }
+    >
+      <SettingsPageContainer>
         <Section>
           <SettingsAccountsCalendarChannelsContainer />
         </Section>
diff --git a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsEmails.tsx b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsEmails.tsx
index b972ad215e87..11af16608aef 100644
--- a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsEmails.tsx
+++ b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsEmails.tsx
@@ -1,20 +1,23 @@
-import { IconSettings } from 'twenty-ui';
-
 import { SettingsAccountsMessageChannelsContainer } from '@/settings/accounts/components/SettingsAccountsMessageChannelsContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
 import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { IconMail } from 'twenty-ui';
 
 export const SettingsAccountsEmails = () => (
-  <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
-    <SettingsPageContainer>
+  <SubMenuTopBarContainer
+    Icon={IconMail}
+    title={
       <Breadcrumb
         links={[
           { children: 'Accounts', href: '/settings/accounts' },
           { children: 'Emails' },
         ]}
       />
+    }
+  >
+    <SettingsPageContainer>
       <Section>
         <SettingsAccountsMessageChannelsContainer />
       </Section>
diff --git a/packages/twenty-front/src/pages/settings/accounts/SettingsNewAccount.tsx b/packages/twenty-front/src/pages/settings/accounts/SettingsNewAccount.tsx
index 7c7a5d31b96a..69465ef5e579 100644
--- a/packages/twenty-front/src/pages/settings/accounts/SettingsNewAccount.tsx
+++ b/packages/twenty-front/src/pages/settings/accounts/SettingsNewAccount.tsx
@@ -1,20 +1,23 @@
-import { IconSettings } from 'twenty-ui';
-
 import { SettingsNewAccountSection } from '@/settings/accounts/components/SettingsNewAccountSection';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { IconAt } from 'twenty-ui';
 
 export const SettingsNewAccount = () => {
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
-      <SettingsPageContainer>
+    <SubMenuTopBarContainer
+      Icon={IconAt}
+      title={
         <Breadcrumb
           links={[
             { children: 'Accounts', href: '/settings/accounts' },
             { children: `New` },
           ]}
         />
+      }
+    >
+      <SettingsPageContainer>
         <SettingsNewAccountSection />
       </SettingsPageContainer>
     </SubMenuTopBarContainer>
diff --git a/packages/twenty-front/src/pages/settings/crm-migration/SettingsCRMMigration.tsx b/packages/twenty-front/src/pages/settings/crm-migration/SettingsCRMMigration.tsx
index 48c8ca73304a..4b6c98be095f 100644
--- a/packages/twenty-front/src/pages/settings/crm-migration/SettingsCRMMigration.tsx
+++ b/packages/twenty-front/src/pages/settings/crm-migration/SettingsCRMMigration.tsx
@@ -16,12 +16,13 @@ const REVERT_PUBLIC_KEY = 'pk_live_a87fee8c-28c7-494f-99a3-996ff89f9918';
 export const SettingsCRMMigration = () => {
   const currentWorkspace = useRecoilValue(currentWorkspaceState);
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconSettings}
+      title={<Breadcrumb links={[{ children: 'Migrate' }]} />}
+      actionButton={<SettingsReadDocumentationButton />}
+    >
       <SettingsPageContainer>
-        <SettingsHeaderContainer>
-          <Breadcrumb links={[{ children: 'Migrate' }]} />
-          <SettingsReadDocumentationButton />
-        </SettingsHeaderContainer>
+        <SettingsHeaderContainer></SettingsHeaderContainer>
         <Section>
           <RevertConnect
             config={{
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx
index 7adb8ee74f2c..0b40a39d8723 100644
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsNewObject.tsx
@@ -1,7 +1,7 @@
 import { zodResolver } from '@hookform/resolvers/zod';
 import { FormProvider, useForm } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
-import { H2Title, IconSettings } from 'twenty-ui';
+import { H2Title, IconHierarchy2 } from 'twenty-ui';
 import { z } from 'zod';
 
 import { useCreateOneObjectMetadataItem } from '@/object-metadata/hooks/useCreateOneObjectMetadataItem';
@@ -70,25 +70,30 @@ export const SettingsNewObject = () => {
   return (
     // eslint-disable-next-line react/jsx-props-no-spreading
     <FormProvider {...formConfig}>
-      <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+      <SubMenuTopBarContainer
+        Icon={IconHierarchy2}
+        title={
+          <Breadcrumb
+            links={[
+              {
+                children: 'Objects',
+                href: settingsObjectsPagePath,
+              },
+              { children: 'New' },
+            ]}
+          />
+        }
+        actionButton={
+          <SaveAndCancelButtons
+            isSaveDisabled={!canSave}
+            isCancelDisabled={isSubmitting}
+            onCancel={() => navigate(settingsObjectsPagePath)}
+            onSave={formConfig.handleSubmit(handleSave)}
+          />
+        }
+      >
         <SettingsPageContainer>
-          <SettingsHeaderContainer>
-            <Breadcrumb
-              links={[
-                {
-                  children: 'Objects',
-                  href: settingsObjectsPagePath,
-                },
-                { children: 'New' },
-              ]}
-            />
-            <SaveAndCancelButtons
-              isSaveDisabled={!canSave}
-              isCancelDisabled={isSubmitting}
-              onCancel={() => navigate(settingsObjectsPagePath)}
-              onSave={formConfig.handleSubmit(handleSave)}
-            />
-          </SettingsHeaderContainer>
+          <SettingsHeaderContainer></SettingsHeaderContainer>
           <Section>
             <H2Title
               title="About"
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetail.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetail.tsx
deleted file mode 100644
index 3f551f7728f1..000000000000
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetail.tsx
+++ /dev/null
@@ -1,237 +0,0 @@
-import styled from '@emotion/styled';
-import { useEffect } from 'react';
-import { useNavigate, useParams } from 'react-router-dom';
-import { H2Title, IconPlus, IconSettings } from 'twenty-ui';
-
-import { LABEL_IDENTIFIER_FIELD_METADATA_TYPES } from '@/object-metadata/constants/LabelIdentifierFieldMetadataTypes';
-import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataItem';
-import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
-import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem';
-import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
-import { getActiveFieldMetadataItems } from '@/object-metadata/utils/getActiveFieldMetadataItems';
-import { getDisabledFieldMetadataItems } from '@/object-metadata/utils/getDisabledFieldMetadataItems';
-import { getFieldSlug } from '@/object-metadata/utils/getFieldSlug';
-import { isLabelIdentifierField } from '@/object-metadata/utils/isLabelIdentifierField';
-import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
-import { SettingsObjectFieldActiveActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown';
-import { SettingsObjectFieldInactiveActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown';
-import {
-  SettingsObjectFieldItemTableRow,
-  StyledObjectFieldTableRow,
-} from '@/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow';
-import { SettingsObjectSummaryCard } from '@/settings/data-model/object-details/components/SettingsObjectSummaryCard';
-import { getFieldIdentifierType } from '@/settings/data-model/utils/getFieldIdentifierType';
-import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
-import { AppPath } from '@/types/AppPath';
-import { SettingsPath } from '@/types/SettingsPath';
-import { Button } from '@/ui/input/button/components/Button';
-import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
-import { Section } from '@/ui/layout/section/components/Section';
-import { Table } from '@/ui/layout/table/components/Table';
-import { TableHeader } from '@/ui/layout/table/components/TableHeader';
-import { TableSection } from '@/ui/layout/table/components/TableSection';
-import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
-import { UndecoratedLink } from '@/ui/navigation/link/components/UndecoratedLink';
-
-const StyledDiv = styled.div`
-  display: flex;
-  justify-content: flex-end;
-  padding-top: ${({ theme }) => theme.spacing(2)};
-`;
-
-export const SettingsObjectDetail = () => {
-  const navigate = useNavigate();
-
-  const { objectSlug = '' } = useParams();
-  const { findActiveObjectMetadataItemBySlug } =
-    useFilteredObjectMetadataItems();
-  const { updateOneObjectMetadataItem } = useUpdateOneObjectMetadataItem();
-
-  const activeObjectMetadataItem =
-    findActiveObjectMetadataItemBySlug(objectSlug);
-
-  useEffect(() => {
-    if (!activeObjectMetadataItem) navigate(AppPath.NotFound);
-  }, [activeObjectMetadataItem, navigate]);
-
-  const {
-    activateMetadataField,
-    deactivateMetadataField,
-    deleteMetadataField,
-  } = useFieldMetadataItem();
-
-  if (!activeObjectMetadataItem) return null;
-
-  const activeMetadataFields = getActiveFieldMetadataItems(
-    activeObjectMetadataItem,
-  );
-  const deactivatedMetadataFields = getDisabledFieldMetadataItems(
-    activeObjectMetadataItem,
-  );
-
-  const handleDisableObject = async () => {
-    await updateOneObjectMetadataItem({
-      idToUpdate: activeObjectMetadataItem.id,
-      updatePayload: { isActive: false },
-    });
-    navigate(getSettingsPagePath(SettingsPath.Objects));
-  };
-
-  const handleDisableField = (activeFieldMetadatItem: FieldMetadataItem) => {
-    deactivateMetadataField(activeFieldMetadatItem);
-  };
-
-  const handleSetLabelIdentifierField = (
-    activeFieldMetadatItem: FieldMetadataItem,
-  ) =>
-    updateOneObjectMetadataItem({
-      idToUpdate: activeObjectMetadataItem.id,
-      updatePayload: {
-        labelIdentifierFieldMetadataId: activeFieldMetadatItem.id,
-      },
-    });
-
-  const shouldDisplayAddFieldButton = !activeObjectMetadataItem.isRemote;
-
-  return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
-      <SettingsPageContainer>
-        <Breadcrumb
-          links={[
-            { children: 'Objects', href: '/settings/objects' },
-            { children: activeObjectMetadataItem.labelPlural },
-          ]}
-        />
-        <Section>
-          <H2Title title="About" description="Manage your object" />
-          <SettingsObjectSummaryCard
-            iconKey={activeObjectMetadataItem.icon ?? undefined}
-            name={activeObjectMetadataItem.labelPlural || ''}
-            objectMetadataItem={activeObjectMetadataItem}
-            onDeactivate={handleDisableObject}
-            onEdit={() => navigate('./edit')}
-          />
-        </Section>
-        <Section>
-          <H2Title
-            title="Fields"
-            description={`Customise the fields available in the ${activeObjectMetadataItem.labelSingular} views and their display order in the ${activeObjectMetadataItem.labelSingular} detail view and menus.`}
-          />
-          <Table>
-            <StyledObjectFieldTableRow>
-              <TableHeader>Name</TableHeader>
-              <TableHeader>
-                {activeObjectMetadataItem.isCustom
-                  ? 'Identifier'
-                  : 'Field type'}
-              </TableHeader>
-              <TableHeader>Data type</TableHeader>
-              <TableHeader></TableHeader>
-            </StyledObjectFieldTableRow>
-            {!!activeMetadataFields.length && (
-              <TableSection title="Active">
-                {activeMetadataFields.map((activeMetadataField) => {
-                  const isLabelIdentifier = isLabelIdentifierField({
-                    fieldMetadataItem: activeMetadataField,
-                    objectMetadataItem: activeObjectMetadataItem,
-                  });
-                  const canBeSetAsLabelIdentifier =
-                    activeObjectMetadataItem.isCustom &&
-                    !isLabelIdentifier &&
-                    LABEL_IDENTIFIER_FIELD_METADATA_TYPES.includes(
-                      activeMetadataField.type,
-                    );
-
-                  return (
-                    <SettingsObjectFieldItemTableRow
-                      key={activeMetadataField.id}
-                      identifierType={getFieldIdentifierType(
-                        activeMetadataField,
-                        activeObjectMetadataItem,
-                      )}
-                      variant={
-                        activeObjectMetadataItem.isCustom
-                          ? 'identifier'
-                          : 'field-type'
-                      }
-                      fieldMetadataItem={activeMetadataField}
-                      isRemoteObjectField={activeObjectMetadataItem.isRemote}
-                      // to={`./${getFieldSlug(activeMetadataField)}`}
-                      ActionIcon={
-                        <SettingsObjectFieldActiveActionDropdown
-                          isCustomField={!!activeMetadataField.isCustom}
-                          scopeKey={activeMetadataField.id}
-                          onEdit={() =>
-                            navigate(`./${getFieldSlug(activeMetadataField)}`)
-                          }
-                          onSetAsLabelIdentifier={
-                            canBeSetAsLabelIdentifier
-                              ? () =>
-                                  handleSetLabelIdentifierField(
-                                    activeMetadataField,
-                                  )
-                              : undefined
-                          }
-                          onDeactivate={
-                            isLabelIdentifier
-                              ? undefined
-                              : () => handleDisableField(activeMetadataField)
-                          }
-                        />
-                      }
-                    />
-                  );
-                })}
-              </TableSection>
-            )}
-            {!!deactivatedMetadataFields.length && (
-              <TableSection isInitiallyExpanded={false} title="Inactive">
-                {deactivatedMetadataFields.map((deactivatedMetadataField) => (
-                  <SettingsObjectFieldItemTableRow
-                    key={deactivatedMetadataField.id}
-                    variant={
-                      activeObjectMetadataItem.isCustom
-                        ? 'identifier'
-                        : 'field-type'
-                    }
-                    fieldMetadataItem={deactivatedMetadataField}
-                    ActionIcon={
-                      <SettingsObjectFieldInactiveActionDropdown
-                        isCustomField={!!deactivatedMetadataField.isCustom}
-                        scopeKey={deactivatedMetadataField.id}
-                        onActivate={() =>
-                          activateMetadataField(deactivatedMetadataField)
-                        }
-                        onDelete={() =>
-                          deleteMetadataField(deactivatedMetadataField)
-                        }
-                      />
-                    }
-                  />
-                ))}
-              </TableSection>
-            )}
-          </Table>
-          {shouldDisplayAddFieldButton && (
-            <StyledDiv>
-              <UndecoratedLink
-                to={
-                  deactivatedMetadataFields.length
-                    ? './new-field/step-1'
-                    : './new-field/step-2'
-                }
-              >
-                <Button
-                  Icon={IconPlus}
-                  title="Add Field"
-                  size="small"
-                  variant="secondary"
-                />
-              </UndecoratedLink>
-            </StyledDiv>
-          )}
-        </Section>
-      </SettingsPageContainer>
-    </SubMenuTopBarContainer>
-  );
-};
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPage.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPage.tsx
new file mode 100644
index 000000000000..899c36909fb6
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPage.tsx
@@ -0,0 +1,30 @@
+import { useEffect } from 'react';
+import { useNavigate, useParams } from 'react-router-dom';
+
+import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
+import { AppPath } from '@/types/AppPath';
+import { isDefined } from 'twenty-ui';
+import { SettingsObjectDetailPageContent } from '~/pages/settings/data-model/SettingsObjectDetailPageContent';
+
+export const SettingsObjectDetailPage = () => {
+  const navigate = useNavigate();
+
+  const { objectSlug = '' } = useParams();
+  const { findActiveObjectMetadataItemBySlug } =
+    useFilteredObjectMetadataItems();
+
+  const activeObjectMetadataItem =
+    findActiveObjectMetadataItemBySlug(objectSlug);
+
+  useEffect(() => {
+    if (!activeObjectMetadataItem) navigate(AppPath.NotFound);
+  }, [activeObjectMetadataItem, navigate]);
+
+  if (!isDefined(activeObjectMetadataItem)) return <></>;
+
+  return (
+    <SettingsObjectDetailPageContent
+      objectMetadataItem={activeObjectMetadataItem}
+    />
+  );
+};
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPageContent.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPageContent.tsx
new file mode 100644
index 000000000000..f7ca61f50492
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectDetailPageContent.tsx
@@ -0,0 +1,103 @@
+import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem';
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { getDisabledFieldMetadataItems } from '@/object-metadata/utils/getDisabledFieldMetadataItems';
+import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
+import { SettingsObjectSummaryCard } from '@/settings/data-model/object-details/components/SettingsObjectSummaryCard';
+import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
+import { SettingsPath } from '@/types/SettingsPath';
+import { Button } from '@/ui/input/button/components/Button';
+import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
+import { Section } from '@/ui/layout/section/components/Section';
+import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { UndecoratedLink } from '@/ui/navigation/link/components/UndecoratedLink';
+import styled from '@emotion/styled';
+import { isNonEmptyArray } from '@sniptt/guards';
+import { useNavigate } from 'react-router-dom';
+import { H2Title, IconHierarchy2, IconPlus } from 'twenty-ui';
+import { SettingsObjectFieldTable } from '~/pages/settings/data-model/SettingsObjectFieldTable';
+
+const StyledDiv = styled.div`
+  display: flex;
+  justify-content: flex-end;
+  padding-top: ${({ theme }) => theme.spacing(2)};
+`;
+
+export type SettingsObjectDetailPageContentProps = {
+  objectMetadataItem: ObjectMetadataItem;
+};
+
+export const SettingsObjectDetailPageContent = ({
+  objectMetadataItem,
+}: SettingsObjectDetailPageContentProps) => {
+  const navigate = useNavigate();
+
+  const { updateOneObjectMetadataItem } = useUpdateOneObjectMetadataItem();
+
+  const handleDisableObject = async () => {
+    await updateOneObjectMetadataItem({
+      idToUpdate: objectMetadataItem.id,
+      updatePayload: { isActive: false },
+    });
+    navigate(getSettingsPagePath(SettingsPath.Objects));
+  };
+
+  const disabledFieldMetadataItems =
+    getDisabledFieldMetadataItems(objectMetadataItem);
+
+  const shouldDisplayAddFieldButton = !objectMetadataItem.isRemote;
+
+  return (
+    <SubMenuTopBarContainer
+      Icon={IconHierarchy2}
+      title={
+        <Breadcrumb
+          links={[
+            { children: 'Objects', href: '/settings/objects' },
+            { children: objectMetadataItem.labelPlural },
+          ]}
+        />
+      }
+    >
+      <SettingsPageContainer>
+        <Section>
+          <H2Title title="About" description="Manage your object" />
+          <SettingsObjectSummaryCard
+            iconKey={objectMetadataItem.icon ?? undefined}
+            name={objectMetadataItem.labelPlural || ''}
+            objectMetadataItem={objectMetadataItem}
+            onDeactivate={handleDisableObject}
+            onEdit={() => navigate('./edit')}
+          />
+        </Section>
+        <Section>
+          <H2Title
+            title="Fields"
+            description={`Customise the fields available in the ${objectMetadataItem.labelSingular} views and their display order in the ${objectMetadataItem.labelSingular} detail view and menus.`}
+          />
+          <SettingsObjectFieldTable
+            objectMetadataItem={objectMetadataItem}
+            mode="view"
+          />
+          {shouldDisplayAddFieldButton && (
+            <StyledDiv>
+              <UndecoratedLink
+                to={
+                  isNonEmptyArray(disabledFieldMetadataItems)
+                    ? './new-field/step-1'
+                    : './new-field/step-2'
+                }
+              >
+                <Button
+                  Icon={IconPlus}
+                  title="Add Field"
+                  size="small"
+                  variant="secondary"
+                />
+              </UndecoratedLink>
+            </StyledDiv>
+          )}
+        </Section>
+      </SettingsPageContainer>
+    </SubMenuTopBarContainer>
+  );
+};
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx
index 662f5c9a2ef2..641c6b30d914 100644
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectEdit.tsx
@@ -5,12 +5,13 @@ import pick from 'lodash.pick';
 import { useEffect } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
 import { useNavigate, useParams } from 'react-router-dom';
-import { H2Title, IconArchive, IconSettings } from 'twenty-ui';
+import { H2Title, IconArchive, IconHierarchy2 } from 'twenty-ui';
 import { z } from 'zod';
 
 import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
 import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem';
 import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug';
+import { RecordFieldValueSelectorContextProvider } from '@/object-record/record-store/contexts/RecordFieldValueSelectorContext';
 import { SaveAndCancelButtons } from '@/settings/components/SaveAndCancelButtons/SaveAndCancelButtons';
 import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
@@ -30,7 +31,6 @@ import { Button } from '@/ui/input/button/components/Button';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
 import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
-import { RecordFieldValueSelectorContextProvider } from '@/object-record/record-store/contexts/RecordFieldValueSelectorContext';
 
 const objectEditFormSchema = z
   .object({})
@@ -108,22 +108,26 @@ export const SettingsObjectEdit = () => {
   return (
     <RecordFieldValueSelectorContextProvider>
       <FormProvider {...formConfig}>
-        <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+        <SubMenuTopBarContainer
+          Icon={IconHierarchy2}
+          title={
+            <Breadcrumb
+              links={[
+                {
+                  children: 'Objects',
+                  href: settingsObjectsPagePath,
+                },
+                {
+                  children: activeObjectMetadataItem.labelPlural,
+                  href: `${settingsObjectsPagePath}/${objectSlug}`,
+                },
+                { children: 'Edit' },
+              ]}
+            />
+          }
+        >
           <SettingsPageContainer>
             <SettingsHeaderContainer>
-              <Breadcrumb
-                links={[
-                  {
-                    children: 'Objects',
-                    href: settingsObjectsPagePath,
-                  },
-                  {
-                    children: activeObjectMetadataItem.labelPlural,
-                    href: `${settingsObjectsPagePath}/${objectSlug}`,
-                  },
-                  { children: 'Edit' },
-                ]}
-              />
               {activeObjectMetadataItem.isCustom && (
                 <SaveAndCancelButtons
                   isSaveDisabled={!canSave}
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx
index f69f30beb052..cff1a2d75fe0 100644
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldEdit.tsx
@@ -6,7 +6,7 @@ import pick from 'lodash.pick';
 import { useEffect } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
 import { useNavigate, useParams } from 'react-router-dom';
-import { H2Title, IconArchive, IconSettings } from 'twenty-ui';
+import { H2Title, IconArchive, IconHierarchy2 } from 'twenty-ui';
 import { z } from 'zod';
 
 import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataItem';
@@ -172,19 +172,23 @@ export const SettingsObjectFieldEdit = () => {
     <RecordFieldValueSelectorContextProvider>
       {/* eslint-disable-next-line react/jsx-props-no-spreading */}
       <FormProvider {...formConfig}>
-        <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+        <SubMenuTopBarContainer
+          Icon={IconHierarchy2}
+          title={
+            <Breadcrumb
+              links={[
+                { children: 'Objects', href: '/settings/objects' },
+                {
+                  children: activeObjectMetadataItem.labelPlural,
+                  href: `/settings/objects/${objectSlug}`,
+                },
+                { children: activeMetadataField.label },
+              ]}
+            />
+          }
+        >
           <SettingsPageContainer>
             <SettingsHeaderContainer>
-              <Breadcrumb
-                links={[
-                  { children: 'Objects', href: '/settings/objects' },
-                  {
-                    children: activeObjectMetadataItem.labelPlural,
-                    href: `/settings/objects/${objectSlug}`,
-                  },
-                  { children: activeMetadataField.label },
-                ]}
-              />
               {shouldDisplaySaveAndCancel && (
                 <SaveAndCancelButtons
                   isSaveDisabled={!canSave}
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldTable.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldTable.tsx
new file mode 100644
index 000000000000..fffa5f2763a0
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectFieldTable.tsx
@@ -0,0 +1,194 @@
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import {
+  SettingsObjectFieldItemTableRow,
+  StyledObjectFieldTableRow,
+} from '@/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow';
+import { settingsObjectFieldsFamilyState } from '@/settings/data-model/object-details/states/settingsObjectFieldsFamilyState';
+import { SortableTableHeader } from '@/ui/layout/table/components/SortableTableHeader';
+import { Table } from '@/ui/layout/table/components/Table';
+import { TableHeader } from '@/ui/layout/table/components/TableHeader';
+import { TableSection } from '@/ui/layout/table/components/TableSection';
+import { useSortedArray } from '@/ui/layout/table/hooks/useSortedArray';
+import { TableMetadata } from '@/ui/layout/table/types/TableMetadata';
+import { isNonEmptyArray } from '@sniptt/guards';
+
+import { useEffect, useMemo } from 'react';
+import { useRecoilState } from 'recoil';
+import { useMapFieldMetadataItemToSettingsObjectDetailTableItem } from '~/pages/settings/data-model/hooks/useMapFieldMetadataItemToSettingsObjectDetailTableItem';
+import { SettingsObjectDetailTableItem } from '~/pages/settings/data-model/types/SettingsObjectDetailTableItem';
+
+const SETTINGS_OBJECT_DETAIL_TABLE_METADATA_STANDARD: TableMetadata<SettingsObjectDetailTableItem> =
+  {
+    tableId: 'settingsObjectDetail',
+    fields: [
+      {
+        fieldLabel: 'Name',
+        fieldName: 'label',
+        fieldType: 'string',
+        align: 'left',
+      },
+      {
+        fieldLabel: 'Field type',
+        fieldName: 'fieldType',
+        fieldType: 'string',
+        align: 'left',
+      },
+      {
+        fieldLabel: 'Data type',
+        fieldName: 'dataType',
+        fieldType: 'string',
+        align: 'left',
+      },
+    ],
+    initialSort: {
+      fieldName: 'label',
+      orderBy: 'AscNullsLast',
+    },
+  };
+
+const SETTINGS_OBJECT_DETAIL_TABLE_METADATA_CUSTOM: TableMetadata<SettingsObjectDetailTableItem> =
+  {
+    tableId: 'settingsObjectDetail',
+    fields: [
+      {
+        fieldLabel: 'Name',
+        fieldName: 'label',
+        fieldType: 'string',
+        align: 'left',
+      },
+      {
+        fieldLabel: 'Identifier',
+        fieldName: 'identifierType',
+        fieldType: 'string',
+        align: 'left',
+      },
+      {
+        fieldLabel: 'Data type',
+        fieldName: 'dataType',
+        fieldType: 'string',
+        align: 'left',
+      },
+    ],
+    initialSort: {
+      fieldName: 'label',
+      orderBy: 'AscNullsLast',
+    },
+  };
+
+export type SettingsObjectFieldTableProps = {
+  objectMetadataItem: ObjectMetadataItem;
+  mode: 'view' | 'new-field';
+};
+
+// TODO: find another way than using mode which feels like it could be replaced by another pattern
+export const SettingsObjectFieldTable = ({
+  objectMetadataItem,
+  mode,
+}: SettingsObjectFieldTableProps) => {
+  const tableMetadata = objectMetadataItem.isCustom
+    ? SETTINGS_OBJECT_DETAIL_TABLE_METADATA_CUSTOM
+    : SETTINGS_OBJECT_DETAIL_TABLE_METADATA_STANDARD;
+
+  const { mapFieldMetadataItemToSettingsObjectDetailTableItem } =
+    useMapFieldMetadataItemToSettingsObjectDetailTableItem(objectMetadataItem);
+
+  const [settingsObjectFields, setSettingsObjectFields] = useRecoilState(
+    settingsObjectFieldsFamilyState({
+      objectMetadataItemId: objectMetadataItem.id,
+    }),
+  );
+
+  useEffect(() => {
+    setSettingsObjectFields(objectMetadataItem.fields);
+  }, [objectMetadataItem, setSettingsObjectFields]);
+
+  const activeObjectSettingsDetailItems = useMemo(() => {
+    const activeMetadataFields = settingsObjectFields?.filter(
+      (fieldMetadataItem) =>
+        fieldMetadataItem.isActive && !fieldMetadataItem.isSystem,
+    );
+
+    return (
+      activeMetadataFields?.map(
+        mapFieldMetadataItemToSettingsObjectDetailTableItem,
+      ) ?? []
+    );
+  }, [
+    settingsObjectFields,
+    mapFieldMetadataItemToSettingsObjectDetailTableItem,
+  ]);
+
+  const disabledObjectSettingsDetailItems = useMemo(() => {
+    const disabledFieldMetadataItems = settingsObjectFields?.filter(
+      (fieldMetadataItem) =>
+        !fieldMetadataItem.isActive && !fieldMetadataItem.isSystem,
+    );
+
+    return (
+      disabledFieldMetadataItems?.map(
+        mapFieldMetadataItemToSettingsObjectDetailTableItem,
+      ) ?? []
+    );
+  }, [
+    settingsObjectFields,
+    mapFieldMetadataItemToSettingsObjectDetailTableItem,
+  ]);
+
+  const sortedActiveObjectSettingsDetailItems = useSortedArray(
+    activeObjectSettingsDetailItems,
+    tableMetadata,
+  );
+
+  const sortedDisabledObjectSettingsDetailItems = useSortedArray(
+    disabledObjectSettingsDetailItems,
+    tableMetadata,
+  );
+
+  return (
+    <Table>
+      <StyledObjectFieldTableRow>
+        {tableMetadata.fields.map((item) => (
+          <SortableTableHeader
+            key={item.fieldName}
+            fieldName={item.fieldName}
+            label={item.fieldLabel}
+            tableId={tableMetadata.tableId}
+            initialSort={tableMetadata.initialSort}
+          />
+        ))}
+        <TableHeader></TableHeader>
+      </StyledObjectFieldTableRow>
+      {isNonEmptyArray(sortedActiveObjectSettingsDetailItems) && (
+        <TableSection title="Active">
+          {sortedActiveObjectSettingsDetailItems.map(
+            (objectSettingsDetailItem) => (
+              <SettingsObjectFieldItemTableRow
+                key={objectSettingsDetailItem.fieldMetadataItem.id}
+                settingsObjectDetailTableItem={objectSettingsDetailItem}
+                status="active"
+                mode={mode}
+              />
+            ),
+          )}
+        </TableSection>
+      )}
+      {isNonEmptyArray(sortedDisabledObjectSettingsDetailItems) && (
+        <TableSection
+          isInitiallyExpanded={mode === 'new-field' ? true : false}
+          title="Inactive"
+        >
+          {sortedDisabledObjectSettingsDetailItems.map(
+            (objectSettingsDetailItem) => (
+              <SettingsObjectFieldItemTableRow
+                key={objectSettingsDetailItem.fieldMetadataItem.id}
+                settingsObjectDetailTableItem={objectSettingsDetailItem}
+                status="disabled"
+                mode={mode}
+              />
+            ),
+          )}
+        </TableSection>
+      )}
+    </Table>
+  );
+};
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldStep1.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldStep1.tsx
index 98d5d0859a3a..f2e18dc14f6a 100644
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldStep1.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectNewField/SettingsObjectNewFieldStep1.tsx
@@ -1,27 +1,21 @@
-import { useEffect, useState } from 'react';
-import { useNavigate, useParams } from 'react-router-dom';
 import styled from '@emotion/styled';
-import { H2Title, IconMinus, IconPlus, IconSettings } from 'twenty-ui';
+import { useEffect } from 'react';
+import { useNavigate, useParams } from 'react-router-dom';
+import { H2Title, IconPlus, IconSettings } from 'twenty-ui';
 
-import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataItem';
 import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
-import { isLabelIdentifierField } from '@/object-metadata/utils/isLabelIdentifierField';
 import { SaveAndCancelButtons } from '@/settings/components/SaveAndCancelButtons/SaveAndCancelButtons';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
-import {
-  SettingsObjectFieldItemTableRow,
-  StyledObjectFieldTableRow,
-} from '@/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow';
+
+import { useFieldMetadataItem } from '@/object-metadata/hooks/useFieldMetadataItem';
+import { settingsObjectFieldsFamilyState } from '@/settings/data-model/object-details/states/settingsObjectFieldsFamilyState';
 import { AppPath } from '@/types/AppPath';
 import { Button } from '@/ui/input/button/components/Button';
-import { LightIconButton } from '@/ui/input/button/components/LightIconButton';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
-import { Table } from '@/ui/layout/table/components/Table';
-import { TableHeader } from '@/ui/layout/table/components/TableHeader';
-import { TableSection } from '@/ui/layout/table/components/TableSection';
 import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { useRecoilState } from 'recoil';
+import { SettingsObjectFieldTable } from '~/pages/settings/data-model/SettingsObjectFieldTable';
 
 const StyledSection = styled(Section)`
   display: flex;
@@ -43,141 +37,87 @@ export const SettingsObjectNewFieldStep1 = () => {
   const activeObjectMetadataItem =
     findActiveObjectMetadataItemBySlug(objectSlug);
 
-  const { activateMetadataField, deactivateMetadataField } =
-    useFieldMetadataItem();
-  const [metadataFields, setMetadataFields] = useState(
-    activeObjectMetadataItem?.fields ?? [],
+  const [settingsObjectFields] = useRecoilState(
+    settingsObjectFieldsFamilyState({
+      objectMetadataItemId: activeObjectMetadataItem?.id,
+    }),
   );
 
-  const activeMetadataFields = metadataFields.filter((field) => field.isActive);
-  const deactivatedMetadataFields = metadataFields.filter(
-    (field) => !field.isActive,
-  );
+  const { activateMetadataField, deactivateMetadataField } =
+    useFieldMetadataItem();
 
-  const canSave = metadataFields.some(
+  const canSave = settingsObjectFields?.some(
     (field, index) =>
       field.isActive !== activeObjectMetadataItem?.fields[index].isActive,
   );
 
-  useEffect(() => {
-    if (!activeObjectMetadataItem) {
-      navigate(AppPath.NotFound);
+  const handleSave = async () => {
+    if (!activeObjectMetadataItem || !settingsObjectFields) {
       return;
     }
 
-    if (!metadataFields.length)
-      setMetadataFields(activeObjectMetadataItem.fields);
-  }, [activeObjectMetadataItem, metadataFields.length, navigate]);
-
-  if (!activeObjectMetadataItem) return null;
-
-  const handleToggleField = (fieldMetadataId: string) =>
-    setMetadataFields((previousFields) =>
-      previousFields.map((field) =>
-        field.id === fieldMetadataId
-          ? { ...field, isActive: !field.isActive }
-          : field,
-      ),
-    );
-
-  const handleSave = async () => {
     await Promise.all(
-      metadataFields.map((metadataField, index) => {
+      settingsObjectFields.map((fieldMetadataItem, index) => {
         if (
-          metadataField.isActive ===
+          fieldMetadataItem.isActive ===
           activeObjectMetadataItem.fields[index].isActive
         ) {
           return undefined;
         }
 
-        return metadataField.isActive
-          ? activateMetadataField(metadataField)
-          : deactivateMetadataField(metadataField);
+        return fieldMetadataItem.isActive
+          ? activateMetadataField(fieldMetadataItem)
+          : deactivateMetadataField(fieldMetadataItem);
       }),
     );
 
     navigate(`/settings/objects/${objectSlug}`);
   };
 
+  useEffect(() => {
+    if (!activeObjectMetadataItem) {
+      navigate(AppPath.NotFound);
+      return;
+    }
+  }, [activeObjectMetadataItem, navigate]);
+
+  if (!activeObjectMetadataItem) return null;
+
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
-      <SettingsPageContainer>
-        <SettingsHeaderContainer>
-          <Breadcrumb
-            links={[
-              { children: 'Objects', href: '/settings/objects' },
-              {
-                children: activeObjectMetadataItem.labelPlural,
-                href: `/settings/objects/${objectSlug}`,
-              },
-              { children: 'New Field' },
-            ]}
+    <SubMenuTopBarContainer
+      Icon={IconSettings}
+      title={
+        <Breadcrumb
+          links={[
+            { children: 'Objects', href: '/settings/objects' },
+            {
+              children: activeObjectMetadataItem.labelPlural,
+              href: `/settings/objects/${objectSlug}`,
+            },
+            { children: 'New Field' },
+          ]}
+        />
+      }
+      actionButton={
+        !activeObjectMetadataItem.isRemote && (
+          <SaveAndCancelButtons
+            isSaveDisabled={!canSave}
+            onCancel={() => navigate(`/settings/objects/${objectSlug}`)}
+            onSave={handleSave}
           />
-          {!activeObjectMetadataItem.isRemote && (
-            <SaveAndCancelButtons
-              isSaveDisabled={!canSave}
-              onCancel={() => navigate(`/settings/objects/${objectSlug}`)}
-              onSave={handleSave}
-            />
-          )}
-        </SettingsHeaderContainer>
+        )
+      }
+    >
+      <SettingsPageContainer>
         <StyledSection>
           <H2Title
             title="Check deactivated fields"
             description="Before creating a custom field, check if it already exists in the deactivated section."
           />
-          <Table>
-            <StyledObjectFieldTableRow>
-              <TableHeader>Name</TableHeader>
-              <TableHeader>Field type</TableHeader>
-              <TableHeader>Data type</TableHeader>
-              <TableHeader></TableHeader>
-            </StyledObjectFieldTableRow>
-            {!!activeMetadataFields.length && (
-              <TableSection isInitiallyExpanded={false} title="Active">
-                {activeMetadataFields.map((activeMetadataField) => (
-                  <SettingsObjectFieldItemTableRow
-                    key={activeMetadataField.id}
-                    fieldMetadataItem={activeMetadataField}
-                    isRemoteObjectField={activeObjectMetadataItem.isRemote}
-                    ActionIcon={
-                      isLabelIdentifierField({
-                        fieldMetadataItem: activeMetadataField,
-                        objectMetadataItem: activeObjectMetadataItem,
-                      }) ? undefined : (
-                        <LightIconButton
-                          Icon={IconMinus}
-                          accent="tertiary"
-                          onClick={() =>
-                            handleToggleField(activeMetadataField.id)
-                          }
-                        />
-                      )
-                    }
-                  />
-                ))}
-              </TableSection>
-            )}
-            {!!deactivatedMetadataFields.length && (
-              <TableSection title="Disabled">
-                {deactivatedMetadataFields.map((deactivatedMetadataField) => (
-                  <SettingsObjectFieldItemTableRow
-                    key={deactivatedMetadataField.name}
-                    fieldMetadataItem={deactivatedMetadataField}
-                    ActionIcon={
-                      <LightIconButton
-                        Icon={IconPlus}
-                        accent="tertiary"
-                        onClick={() =>
-                          handleToggleField(deactivatedMetadataField.id)
-                        }
-                      />
-                    }
-                  />
-                ))}
-              </TableSection>
-            )}
-          </Table>
+          <SettingsObjectFieldTable
+            objectMetadataItem={activeObjectMetadataItem}
+            mode="new-field"
+          />
           <StyledAddCustomFieldButton
             Icon={IconPlus}
             title="Add Custom Field"
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectOverview.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectOverview.tsx
index 265171d71be5..a33ed73e4764 100644
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjectOverview.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjectOverview.tsx
@@ -1,12 +1,25 @@
 import { ReactFlowProvider } from 'reactflow';
-import { IconSettings } from 'twenty-ui';
 
 import { SettingsDataModelOverview } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverview';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
+import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { IconHierarchy2 } from 'twenty-ui';
 
 export const SettingsObjectOverview = () => {
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconHierarchy2}
+      title={
+        <Breadcrumb
+          links={[
+            { children: 'Data model', href: '/settings/objects' },
+            {
+              children: 'Overview',
+            },
+          ]}
+        />
+      }
+    >
       <ReactFlowProvider>
         <SettingsDataModelOverview />
       </ReactFlowProvider>
diff --git a/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx b/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx
index efb5856ea5e3..30b148cdbd25 100644
--- a/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx
@@ -1,116 +1,191 @@
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
-import {
-  H1Title,
-  H2Title,
-  IconChevronRight,
-  IconPlus,
-  IconSettings,
-} from 'twenty-ui';
+import { H2Title, IconChevronRight, IconHierarchy2, IconPlus } from 'twenty-ui';
 
 import { useDeleteOneObjectMetadataItem } from '@/object-metadata/hooks/useDeleteOneObjectMetadataItem';
 import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
 import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem';
 import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
+import { useCombinedGetTotalCount } from '@/object-record/multiple-objects/hooks/useCombinedGetTotalCount';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import {
-  SettingsObjectItemTableRow,
+  SettingsObjectMetadataItemTableRow,
   StyledObjectTableRow,
 } from '@/settings/data-model/object-details/components/SettingsObjectItemTableRow';
 import { SettingsObjectCoverImage } from '@/settings/data-model/objects/SettingsObjectCoverImage';
 import { SettingsObjectInactiveMenuDropDown } from '@/settings/data-model/objects/SettingsObjectInactiveMenuDropDown';
+import { getObjectTypeLabel } from '@/settings/data-model/utils/getObjectTypeLabel';
 import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
 import { SettingsPath } from '@/types/SettingsPath';
 import { Button } from '@/ui/input/button/components/Button';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
+import { SortableTableHeader } from '@/ui/layout/table/components/SortableTableHeader';
 import { Table } from '@/ui/layout/table/components/Table';
 import { TableHeader } from '@/ui/layout/table/components/TableHeader';
 import { TableSection } from '@/ui/layout/table/components/TableSection';
+import { useSortedArray } from '@/ui/layout/table/hooks/useSortedArray';
 import { UndecoratedLink } from '@/ui/navigation/link/components/UndecoratedLink';
+import { isNonEmptyArray } from '@sniptt/guards';
+import { useMemo } from 'react';
+import { SETTINGS_OBJECT_TABLE_METADATA } from '~/pages/settings/data-model/constants/SettingsObjectTableMetadata';
+import { SettingsObjectTableItem } from '~/pages/settings/data-model/types/SettingsObjectTableItem';
 
 const StyledIconChevronRight = styled(IconChevronRight)`
   color: ${({ theme }) => theme.font.color.tertiary};
 `;
 
-const StyledH1Title = styled(H1Title)`
-  margin-bottom: 0;
-`;
-
 export const SettingsObjects = () => {
   const theme = useTheme();
 
-  const { activeObjectMetadataItems, inactiveObjectMetadataItems } =
-    useFilteredObjectMetadataItems();
   const { deleteOneObjectMetadataItem } = useDeleteOneObjectMetadataItem();
   const { updateOneObjectMetadataItem } = useUpdateOneObjectMetadataItem();
 
+  const { activeObjectMetadataItems, inactiveObjectMetadataItems } =
+    useFilteredObjectMetadataItems();
+
+  const { totalCountByObjectMetadataItemNamePlural } = useCombinedGetTotalCount(
+    {
+      objectMetadataItems: [
+        ...activeObjectMetadataItems,
+        ...inactiveObjectMetadataItems,
+      ],
+    },
+  );
+
+  const activeObjectSettingsArray = useMemo(
+    () =>
+      activeObjectMetadataItems.map(
+        (objectMetadataItem) =>
+          ({
+            objectMetadataItem,
+            labelPlural: objectMetadataItem.labelPlural,
+            objectTypeLabel: getObjectTypeLabel(objectMetadataItem).labelText,
+            fieldsCount: objectMetadataItem.fields.filter(
+              (field) => !field.isSystem,
+            ).length,
+            totalObjectCount:
+              totalCountByObjectMetadataItemNamePlural[
+                objectMetadataItem.namePlural
+              ] ?? 0,
+          }) satisfies SettingsObjectTableItem,
+      ),
+    [activeObjectMetadataItems, totalCountByObjectMetadataItemNamePlural],
+  );
+
+  const inactiveObjectSettingsArray = useMemo(
+    () =>
+      inactiveObjectMetadataItems.map(
+        (objectMetadataItem) =>
+          ({
+            objectMetadataItem,
+            labelPlural: objectMetadataItem.labelPlural,
+            objectTypeLabel: getObjectTypeLabel(objectMetadataItem).labelText,
+            fieldsCount: objectMetadataItem.fields.filter(
+              (field) => !field.isSystem,
+            ).length,
+            totalObjectCount:
+              totalCountByObjectMetadataItemNamePlural[
+                objectMetadataItem.namePlural
+              ] ?? 0,
+          }) satisfies SettingsObjectTableItem,
+      ),
+    [inactiveObjectMetadataItems, totalCountByObjectMetadataItemNamePlural],
+  );
+
+  const sortedActiveObjectSettingsItems = useSortedArray(
+    activeObjectSettingsArray,
+    SETTINGS_OBJECT_TABLE_METADATA,
+  );
+
+  const sortedInactiveObjectSettingsItems = useSortedArray(
+    inactiveObjectSettingsArray,
+    SETTINGS_OBJECT_TABLE_METADATA,
+  );
+
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconHierarchy2}
+      title="Data model"
+      actionButton={
+        <UndecoratedLink to={getSettingsPagePath(SettingsPath.NewObject)}>
+          <Button
+            Icon={IconPlus}
+            title="Add object"
+            accent="blue"
+            size="small"
+          />
+        </UndecoratedLink>
+      }
+    >
       <SettingsPageContainer>
-        <SettingsHeaderContainer>
-          <StyledH1Title title="Objects" />
-          <UndecoratedLink to={getSettingsPagePath(SettingsPath.NewObject)}>
-            <Button
-              Icon={IconPlus}
-              title="Add object"
-              accent="blue"
-              size="small"
-            />
-          </UndecoratedLink>
-        </SettingsHeaderContainer>
         <>
           <SettingsObjectCoverImage />
           <Section>
             <H2Title title="Existing objects" />
             <Table>
               <StyledObjectTableRow>
-                <TableHeader>Name</TableHeader>
-                <TableHeader>Type</TableHeader>
-                <TableHeader align="right">Fields</TableHeader>
-                <TableHeader align="right">Instances</TableHeader>
+                {SETTINGS_OBJECT_TABLE_METADATA.fields.map(
+                  (settingsObjectsTableMetadataField) => (
+                    <SortableTableHeader
+                      fieldName={settingsObjectsTableMetadataField.fieldName}
+                      label={settingsObjectsTableMetadataField.fieldLabel}
+                      tableId={SETTINGS_OBJECT_TABLE_METADATA.tableId}
+                      align={settingsObjectsTableMetadataField.align}
+                      initialSort={SETTINGS_OBJECT_TABLE_METADATA.initialSort}
+                    />
+                  ),
+                )}
                 <TableHeader></TableHeader>
               </StyledObjectTableRow>
-              {!!activeObjectMetadataItems.length && (
+              {isNonEmptyArray(sortedActiveObjectSettingsItems) && (
                 <TableSection title="Active">
-                  {activeObjectMetadataItems.map((activeObjectMetadataItem) => (
-                    <SettingsObjectItemTableRow
-                      key={activeObjectMetadataItem.namePlural}
-                      objectItem={activeObjectMetadataItem}
+                  {sortedActiveObjectSettingsItems.map((objectSettingsItem) => (
+                    <SettingsObjectMetadataItemTableRow
+                      key={objectSettingsItem.objectMetadataItem.namePlural}
+                      objectMetadataItem={objectSettingsItem.objectMetadataItem}
+                      totalObjectCount={objectSettingsItem.totalObjectCount}
                       action={
                         <StyledIconChevronRight
                           size={theme.icon.size.md}
                           stroke={theme.icon.stroke.sm}
                         />
                       }
-                      to={`/settings/objects/${getObjectSlug(
-                        activeObjectMetadataItem,
+                      link={`/settings/objects/${getObjectSlug(
+                        objectSettingsItem.objectMetadataItem,
                       )}`}
                     />
                   ))}
                 </TableSection>
               )}
-              {!!inactiveObjectMetadataItems.length && (
+              {isNonEmptyArray(inactiveObjectMetadataItems) && (
                 <TableSection title="Inactive">
-                  {inactiveObjectMetadataItems.map(
-                    (inactiveObjectMetadataItem) => (
-                      <SettingsObjectItemTableRow
-                        key={inactiveObjectMetadataItem.namePlural}
-                        objectItem={inactiveObjectMetadataItem}
+                  {sortedInactiveObjectSettingsItems.map(
+                    (objectSettingsItem) => (
+                      <SettingsObjectMetadataItemTableRow
+                        key={objectSettingsItem.objectMetadataItem.namePlural}
+                        objectMetadataItem={
+                          objectSettingsItem.objectMetadataItem
+                        }
+                        totalObjectCount={objectSettingsItem.totalObjectCount}
                         action={
                           <SettingsObjectInactiveMenuDropDown
-                            isCustomObject={inactiveObjectMetadataItem.isCustom}
-                            scopeKey={inactiveObjectMetadataItem.namePlural}
+                            isCustomObject={
+                              objectSettingsItem.objectMetadataItem.isCustom
+                            }
+                            scopeKey={
+                              objectSettingsItem.objectMetadataItem.namePlural
+                            }
                             onActivate={() =>
                               updateOneObjectMetadataItem({
-                                idToUpdate: inactiveObjectMetadataItem.id,
+                                idToUpdate:
+                                  objectSettingsItem.objectMetadataItem.id,
                                 updatePayload: { isActive: true },
                               })
                             }
                             onDelete={() =>
                               deleteOneObjectMetadataItem(
-                                inactiveObjectMetadataItem.id,
+                                objectSettingsItem.objectMetadataItem.id,
                               )
                             }
                           />
diff --git a/packages/twenty-front/src/pages/settings/data-model/__stories__/SettingsObjectDetail.stories.tsx b/packages/twenty-front/src/pages/settings/data-model/__stories__/SettingsObjectDetail.stories.tsx
index 687cf19a2c9b..977480343fc5 100644
--- a/packages/twenty-front/src/pages/settings/data-model/__stories__/SettingsObjectDetail.stories.tsx
+++ b/packages/twenty-front/src/pages/settings/data-model/__stories__/SettingsObjectDetail.stories.tsx
@@ -8,11 +8,11 @@ import {
 import { graphqlMocks } from '~/testing/graphqlMocks';
 import { sleep } from '~/utils/sleep';
 
-import { SettingsObjectDetail } from '../SettingsObjectDetail';
+import { SettingsObjectDetailPage } from '../SettingsObjectDetailPage';
 
 const meta: Meta<PageDecoratorArgs> = {
   title: 'Pages/Settings/DataModel/SettingsObjectDetail',
-  component: SettingsObjectDetail,
+  component: SettingsObjectDetailPage,
   decorators: [PageDecorator],
   args: {
     routePath: '/settings/objects/:objectSlug',
@@ -25,7 +25,7 @@ const meta: Meta<PageDecoratorArgs> = {
 
 export default meta;
 
-export type Story = StoryObj<typeof SettingsObjectDetail>;
+export type Story = StoryObj<typeof SettingsObjectDetailPage>;
 
 export const StandardObject: Story = {
   play: async () => {
diff --git a/packages/twenty-front/src/pages/settings/data-model/constants/SettingsObjectTableMetadata.ts b/packages/twenty-front/src/pages/settings/data-model/constants/SettingsObjectTableMetadata.ts
new file mode 100644
index 000000000000..7ad50ba37834
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/constants/SettingsObjectTableMetadata.ts
@@ -0,0 +1,37 @@
+import { TableMetadata } from '@/ui/layout/table/types/TableMetadata';
+import { SettingsObjectTableItem } from '~/pages/settings/data-model/types/SettingsObjectTableItem';
+
+export const SETTINGS_OBJECT_TABLE_METADATA: TableMetadata<SettingsObjectTableItem> =
+  {
+    tableId: 'settingsObject',
+    fields: [
+      {
+        fieldLabel: 'Name',
+        fieldName: 'labelPlural',
+        fieldType: 'string',
+        align: 'left',
+      },
+      {
+        fieldLabel: 'Type',
+        fieldName: 'objectTypeLabel',
+        fieldType: 'string',
+        align: 'left',
+      },
+      {
+        fieldLabel: 'Fields',
+        fieldName: 'fieldsCount',
+        fieldType: 'number',
+        align: 'right',
+      },
+      {
+        fieldLabel: 'Instances',
+        fieldName: 'totalObjectCount',
+        fieldType: 'number',
+        align: 'right',
+      },
+    ],
+    initialSort: {
+      fieldName: 'labelPlural',
+      orderBy: 'AscNullsLast',
+    },
+  };
diff --git a/packages/twenty-front/src/pages/settings/data-model/hooks/useMapFieldMetadataItemToSettingsObjectDetailTableItem.ts b/packages/twenty-front/src/pages/settings/data-model/hooks/useMapFieldMetadataItemToSettingsObjectDetailTableItem.ts
new file mode 100644
index 000000000000..2a965c0195b5
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/hooks/useMapFieldMetadataItemToSettingsObjectDetailTableItem.ts
@@ -0,0 +1,46 @@
+import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMetadata';
+import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { getFieldIdentifierType } from '@/settings/data-model/utils/getFieldIdentifierType';
+import { getSettingsFieldTypeConfig } from '@/settings/data-model/utils/getSettingsFieldTypeConfig';
+import { SettingsObjectDetailTableItem } from '~/pages/settings/data-model/types/SettingsObjectDetailTableItem';
+import { getSettingsObjectFieldType } from '~/pages/settings/data-model/utils/getSettingsObjectFieldType';
+
+export const useMapFieldMetadataItemToSettingsObjectDetailTableItem = (
+  objectMetadataItem: ObjectMetadataItem,
+) => {
+  const getRelationMetadata = useGetRelationMetadata();
+
+  const mapFieldMetadataItemToSettingsObjectDetailTableItem = (
+    fieldMetadataItem: FieldMetadataItem,
+  ): SettingsObjectDetailTableItem => {
+    const fieldType = getSettingsObjectFieldType(
+      objectMetadataItem,
+      fieldMetadataItem,
+    );
+
+    const { relationObjectMetadataItem } =
+      getRelationMetadata({
+        fieldMetadataItem,
+      }) ?? {};
+
+    const identifierType = getFieldIdentifierType(
+      fieldMetadataItem,
+      objectMetadataItem,
+    );
+
+    return {
+      fieldMetadataItem,
+      fieldType: fieldType ?? '',
+      dataType:
+        relationObjectMetadataItem?.labelPlural ??
+        getSettingsFieldTypeConfig(fieldMetadataItem.type)?.label ??
+        '',
+      label: fieldMetadataItem.label,
+      identifierType: identifierType,
+      objectMetadataItem,
+    } satisfies SettingsObjectDetailTableItem;
+  };
+
+  return { mapFieldMetadataItemToSettingsObjectDetailTableItem };
+};
diff --git a/packages/twenty-front/src/pages/settings/data-model/types/SettingsObjectDetailTableItem.ts b/packages/twenty-front/src/pages/settings/data-model/types/SettingsObjectDetailTableItem.ts
new file mode 100644
index 000000000000..642d392030bb
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/types/SettingsObjectDetailTableItem.ts
@@ -0,0 +1,12 @@
+import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { FieldIdentifierType } from '@/settings/data-model/types/FieldIdentifierType';
+
+export type SettingsObjectDetailTableItem = {
+  fieldMetadataItem: FieldMetadataItem;
+  objectMetadataItem: ObjectMetadataItem;
+  fieldType: string | boolean;
+  label: string;
+  dataType: string;
+  identifierType?: FieldIdentifierType;
+};
diff --git a/packages/twenty-front/src/pages/settings/data-model/types/SettingsObjectTableItem.ts b/packages/twenty-front/src/pages/settings/data-model/types/SettingsObjectTableItem.ts
new file mode 100644
index 000000000000..62b1a0ec01fc
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/types/SettingsObjectTableItem.ts
@@ -0,0 +1,9 @@
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+
+export type SettingsObjectTableItem = {
+  objectMetadataItem: ObjectMetadataItem;
+  totalObjectCount: number;
+  fieldsCount: number;
+  objectTypeLabel: string;
+  labelPlural: string;
+};
diff --git a/packages/twenty-front/src/pages/settings/data-model/utils/getSettingsObjectFieldType.ts b/packages/twenty-front/src/pages/settings/data-model/utils/getSettingsObjectFieldType.ts
new file mode 100644
index 000000000000..1386d810bd1d
--- /dev/null
+++ b/packages/twenty-front/src/pages/settings/data-model/utils/getSettingsObjectFieldType.ts
@@ -0,0 +1,30 @@
+import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
+import { getFieldIdentifierType } from '@/settings/data-model/utils/getFieldIdentifierType';
+import { isDefined } from 'twenty-ui';
+
+export const getSettingsObjectFieldType = (
+  objectMetadataItem: ObjectMetadataItem,
+  fieldMetadataItem: FieldMetadataItem,
+) => {
+  const variant = objectMetadataItem.isCustom ? 'identifier' : 'field-type';
+
+  const identifierType = getFieldIdentifierType(
+    fieldMetadataItem,
+    objectMetadataItem,
+  );
+
+  if (variant === 'field-type') {
+    return objectMetadataItem.isRemote
+      ? 'Remote'
+      : fieldMetadataItem.isCustom
+        ? 'Custom'
+        : 'Standard';
+  } else {
+    return isDefined(identifierType)
+      ? identifierType === 'label'
+        ? 'Record text'
+        : 'Record image'
+      : null;
+  }
+};
diff --git a/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx b/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx
index c2dc7014bc96..c551fda4572c 100644
--- a/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx
+++ b/packages/twenty-front/src/pages/settings/developers/SettingsDevelopers.tsx
@@ -1,7 +1,6 @@
 import styled from '@emotion/styled';
-import { H2Title, IconPlus, IconSettings } from 'twenty-ui';
+import { H2Title, IconCode, IconPlus } from 'twenty-ui';
 
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { SettingsApiKeysTable } from '@/settings/developers/components/SettingsApiKeysTable';
 import { SettingsReadDocumentationButton } from '@/settings/developers/components/SettingsReadDocumentationButton';
@@ -9,7 +8,6 @@ import { SettingsWebhooksTable } from '@/settings/developers/components/Settings
 import { Button } from '@/ui/input/button/components/Button';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
-import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 
 const StyledButtonContainer = styled.div`
   display: flex;
@@ -19,12 +17,12 @@ const StyledButtonContainer = styled.div`
 
 export const SettingsDevelopers = () => {
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconCode}
+      title="Developers"
+      actionButton={<SettingsReadDocumentationButton />}
+    >
       <SettingsPageContainer>
-        <SettingsHeaderContainer>
-          <Breadcrumb links={[{ children: 'Developers' }]} />
-          <SettingsReadDocumentationButton />
-        </SettingsHeaderContainer>
         <Section>
           <H2Title
             title="API keys"
diff --git a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx
index fd83b5ee6be8..21919f09a4f5 100644
--- a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx
+++ b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeyDetail.tsx
@@ -4,16 +4,16 @@ import { DateTime } from 'luxon';
 import { useState } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
 import { useRecoilState } from 'recoil';
-import { H2Title, IconRepeat, IconSettings, IconTrash } from 'twenty-ui';
+import { H2Title, IconCode, IconRepeat, IconTrash } from 'twenty-ui';
 
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useCreateOneRecord } from '@/object-record/hooks/useCreateOneRecord';
 import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
 import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { ApiKeyInput } from '@/settings/developers/components/ApiKeyInput';
 import { ApiKeyNameInput } from '@/settings/developers/components/ApiKeyNameInput';
+import { apiKeyTokenState } from '@/settings/developers/states/generatedApiKeyTokenState';
 import { ApiKey } from '@/settings/developers/types/api-key/ApiKey';
 import { computeNewExpirationDate } from '@/settings/developers/utils/compute-new-expiration-date';
 import { formatExpiration } from '@/settings/developers/utils/format-expiration';
@@ -24,7 +24,6 @@ import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer'
 import { Section } from '@/ui/layout/section/components/Section';
 import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 import { useGenerateApiKeyTokenMutation } from '~/generated/graphql';
-import { apiKeyTokenState } from '@/settings/developers/states/generatedApiKeyTokenState';
 
 const StyledInfo = styled.span`
   color: ${({ theme }) => theme.font.color.light};
@@ -121,16 +120,18 @@ export const SettingsDevelopersApiKeyDetail = () => {
   return (
     <>
       {apiKeyData?.name && (
-        <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+        <SubMenuTopBarContainer
+          Icon={IconCode}
+          title={
+            <Breadcrumb
+              links={[
+                { children: 'Developers', href: '/settings/developers' },
+                { children: `${apiKeyName} API Key` },
+              ]}
+            />
+          }
+        >
           <SettingsPageContainer>
-            <SettingsHeaderContainer>
-              <Breadcrumb
-                links={[
-                  { children: 'Developers', href: '/settings/developers' },
-                  { children: `${apiKeyName} API Key` },
-                ]}
-              />
-            </SettingsHeaderContainer>
             <Section>
               {apiKeyToken ? (
                 <>
diff --git a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx
index 15b5a83c9549..7a2207125022 100644
--- a/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx
+++ b/packages/twenty-front/src/pages/settings/developers/api-keys/SettingsDevelopersApiKeysNew.tsx
@@ -1,25 +1,24 @@
 import { DateTime } from 'luxon';
 import { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { H2Title, IconSettings } from 'twenty-ui';
+import { H2Title, IconCode } from 'twenty-ui';
 
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useCreateOneRecord } from '@/object-record/hooks/useCreateOneRecord';
 import { SaveAndCancelButtons } from '@/settings/components/SaveAndCancelButtons/SaveAndCancelButtons';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { EXPIRATION_DATES } from '@/settings/developers/constants/ExpirationDates';
+import { apiKeyTokenState } from '@/settings/developers/states/generatedApiKeyTokenState';
 import { ApiKey } from '@/settings/developers/types/api-key/ApiKey';
 import { Select } from '@/ui/input/components/Select';
 import { TextInput } from '@/ui/input/components/TextInput';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { Section } from '@/ui/layout/section/components/Section';
 import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { useSetRecoilState } from 'recoil';
+import { Key } from 'ts-key-enum';
 import { useGenerateApiKeyTokenMutation } from '~/generated/graphql';
 import { isDefined } from '~/utils/isDefined';
-import { Key } from 'ts-key-enum';
-import { apiKeyTokenState } from '@/settings/developers/states/generatedApiKeyTokenState';
-import { useSetRecoilState } from 'recoil';
 
 export const SettingsDevelopersApiKeysNew = () => {
   const [generateOneApiKeyToken] = useGenerateApiKeyTokenMutation();
@@ -64,23 +63,27 @@ export const SettingsDevelopersApiKeysNew = () => {
   };
   const canSave = !!formValues.name && createOneApiKey;
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconCode}
+      title={
+        <Breadcrumb
+          links={[
+            { children: 'Developers', href: '/settings/developers' },
+            { children: 'New API Key' },
+          ]}
+        />
+      }
+      actionButton={
+        <SaveAndCancelButtons
+          isSaveDisabled={!canSave}
+          onCancel={() => {
+            navigate('/settings/developers');
+          }}
+          onSave={handleSave}
+        />
+      }
+    >
       <SettingsPageContainer>
-        <SettingsHeaderContainer>
-          <Breadcrumb
-            links={[
-              { children: 'Developers', href: '/settings/developers' },
-              { children: 'New API Key' },
-            ]}
-          />
-          <SaveAndCancelButtons
-            isSaveDisabled={!canSave}
-            onCancel={() => {
-              navigate('/settings/developers');
-            }}
-            onSave={handleSave}
-          />
-        </SettingsHeaderContainer>
         <Section>
           <H2Title title="Name" description="Name of your API key" />
           <TextInput
diff --git a/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx b/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx
index 0ef044167ddd..174561f6a9f2 100644
--- a/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx
+++ b/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhookDetail.tsx
@@ -1,7 +1,7 @@
 import styled from '@emotion/styled';
 import { useState } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
-import { H2Title, IconSettings, IconTrash } from 'twenty-ui';
+import { H2Title, IconCode, IconTrash } from 'twenty-ui';
 
 import { useObjectMetadataItems } from '@/object-metadata/hooks/useObjectMetadataItems';
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
@@ -9,7 +9,6 @@ import { useDeleteOneRecord } from '@/object-record/hooks/useDeleteOneRecord';
 import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
 import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
 import { SaveAndCancelButtons } from '@/settings/components/SaveAndCancelButtons/SaveAndCancelButtons';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { Webhook } from '@/settings/developers/types/webhook/Webhook';
 import { Button } from '@/ui/input/button/components/Button';
@@ -88,23 +87,27 @@ export const SettingsDevelopersWebhooksDetail = () => {
   return (
     <>
       {webhookData?.targetUrl && (
-        <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+        <SubMenuTopBarContainer
+          Icon={IconCode}
+          title={
+            <Breadcrumb
+              links={[
+                { children: 'Developers', href: '/settings/developers' },
+                { children: 'Webhook' },
+              ]}
+            />
+          }
+          actionButton={
+            <SaveAndCancelButtons
+              isSaveDisabled={!isDirty}
+              onCancel={() => {
+                navigate('/settings/developers');
+              }}
+              onSave={handleSave}
+            />
+          }
+        >
           <SettingsPageContainer>
-            <SettingsHeaderContainer>
-              <Breadcrumb
-                links={[
-                  { children: 'Developers', href: '/settings/developers' },
-                  { children: 'Webhook' },
-                ]}
-              />
-              <SaveAndCancelButtons
-                isSaveDisabled={!isDirty}
-                onCancel={() => {
-                  navigate('/settings/developers');
-                }}
-                onSave={handleSave}
-              />
-            </SettingsHeaderContainer>
             <Section>
               <H2Title
                 title="Endpoint URL"
diff --git a/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhooksNew.tsx b/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhooksNew.tsx
index ba471414b551..2e9f06e10d3e 100644
--- a/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhooksNew.tsx
+++ b/packages/twenty-front/src/pages/settings/developers/webhooks/SettingsDevelopersWebhooksNew.tsx
@@ -1,11 +1,10 @@
 import { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
-import { H2Title, IconSettings } from 'twenty-ui';
+import { H2Title, IconCode } from 'twenty-ui';
 
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useCreateOneRecord } from '@/object-record/hooks/useCreateOneRecord';
 import { SaveAndCancelButtons } from '@/settings/components/SaveAndCancelButtons/SaveAndCancelButtons';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { Webhook } from '@/settings/developers/types/webhook/Webhook';
 import { TextInput } from '@/ui/input/components/TextInput';
@@ -35,23 +34,27 @@ export const SettingsDevelopersWebhooksNew = () => {
   };
   const canSave = !!formValues.targetUrl && createOneWebhook;
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconCode}
+      title={
+        <Breadcrumb
+          links={[
+            { children: 'Developers', href: '/settings/developers' },
+            { children: 'New webhook' },
+          ]}
+        />
+      }
+      actionButton={
+        <SaveAndCancelButtons
+          isSaveDisabled={!canSave}
+          onCancel={() => {
+            navigate('/settings/developers');
+          }}
+          onSave={handleSave}
+        />
+      }
+    >
       <SettingsPageContainer>
-        <SettingsHeaderContainer>
-          <Breadcrumb
-            links={[
-              { children: 'Developers', href: '/settings/developers' },
-              { children: 'New webhook' },
-            ]}
-          />
-          <SaveAndCancelButtons
-            isSaveDisabled={!canSave}
-            onCancel={() => {
-              navigate('/settings/developers');
-            }}
-            onSave={handleSave}
-          />
-        </SettingsHeaderContainer>
         <Section>
           <H2Title
             title="Endpoint URL"
diff --git a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationDatabase.tsx b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationDatabase.tsx
index adb50e51f9ea..430848d7615b 100644
--- a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationDatabase.tsx
+++ b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationDatabase.tsx
@@ -42,8 +42,9 @@ export const SettingsIntegrationDatabase = () => {
   if (!isIntegrationAvailable) return null;
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
-      <SettingsPageContainer>
+    <SubMenuTopBarContainer
+      Icon={IconSettings}
+      title={
         <Breadcrumb
           links={[
             {
@@ -53,6 +54,9 @@ export const SettingsIntegrationDatabase = () => {
             { children: integration.text },
           ]}
         />
+      }
+    >
+      <SettingsPageContainer>
         <SettingsIntegrationPreview
           integrationLogoUrl={integration.from.image}
         />
diff --git a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationEditDatabaseConnection.tsx b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationEditDatabaseConnection.tsx
index 284f4ed22c52..7600c2a89cd0 100644
--- a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationEditDatabaseConnection.tsx
+++ b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationEditDatabaseConnection.tsx
@@ -3,10 +3,21 @@ import { IconSettings } from 'twenty-ui';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { SettingsIntegrationEditDatabaseConnectionContainer } from '@/settings/integrations/database-connection/components/SettingsIntegrationEditDatabaseConnectionContainer';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
+import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 
 export const SettingsIntegrationEditDatabaseConnection = () => {
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconSettings}
+      title={
+        <Breadcrumb
+          links={[
+            // TODO
+            { children: 'Edit connection' },
+          ]}
+        />
+      }
+    >
       <SettingsPageContainer>
         <SettingsIntegrationEditDatabaseConnectionContainer />
       </SettingsPageContainer>
diff --git a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx
index ddfa70336953..4763e02e664f 100644
--- a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx
+++ b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrationNewDatabaseConnection.tsx
@@ -8,7 +8,6 @@ import { z } from 'zod';
 import { useCreateOneDatabaseConnection } from '@/databases/hooks/useCreateOneDatabaseConnection';
 import { getForeignDataWrapperType } from '@/databases/utils/getForeignDataWrapperType';
 import { SaveAndCancelButtons } from '@/settings/components/SaveAndCancelButtons/SaveAndCancelButtons';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import {
   SettingsIntegrationDatabaseConnectionForm,
@@ -132,34 +131,38 @@ export const SettingsIntegrationNewDatabaseConnection = () => {
   };
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconSettings}
+      title={
+        <Breadcrumb
+          links={[
+            {
+              children: 'Integrations',
+              href: settingsIntegrationsPagePath,
+            },
+            {
+              children: integration.text,
+              href: `${settingsIntegrationsPagePath}/${databaseKey}`,
+            },
+            { children: 'New' },
+          ]}
+        />
+      }
+      actionButton={
+        <SaveAndCancelButtons
+          isSaveDisabled={!canSave}
+          onCancel={() =>
+            navigate(`${settingsIntegrationsPagePath}/${databaseKey}`)
+          }
+          onSave={handleSave}
+        />
+      }
+    >
       <SettingsPageContainer>
         <FormProvider
           // eslint-disable-next-line react/jsx-props-no-spreading
           {...formConfig}
         >
-          <SettingsHeaderContainer>
-            <Breadcrumb
-              links={[
-                {
-                  children: 'Integrations',
-                  href: settingsIntegrationsPagePath,
-                },
-                {
-                  children: integration.text,
-                  href: `${settingsIntegrationsPagePath}/${databaseKey}`,
-                },
-                { children: 'New' },
-              ]}
-            />
-            <SaveAndCancelButtons
-              isSaveDisabled={!canSave}
-              onCancel={() =>
-                navigate(`${settingsIntegrationsPagePath}/${databaseKey}`)
-              }
-              onSave={handleSave}
-            />
-          </SettingsHeaderContainer>
           <Section>
             <H2Title
               title="Connect a new database"
diff --git a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrations.tsx b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrations.tsx
index 9cbc824004d0..cd12fb14eae3 100644
--- a/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrations.tsx
+++ b/packages/twenty-front/src/pages/settings/integrations/SettingsIntegrations.tsx
@@ -1,18 +1,15 @@
-import { IconSettings } from 'twenty-ui';
-
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { SettingsIntegrationGroup } from '@/settings/integrations/components/SettingsIntegrationGroup';
 import { useSettingsIntegrationCategories } from '@/settings/integrations/hooks/useSettingsIntegrationCategories';
 import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
-import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { IconApps } from 'twenty-ui';
 
 export const SettingsIntegrations = () => {
   const integrationCategories = useSettingsIntegrationCategories();
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer Icon={IconApps} title="Integrations">
       <SettingsPageContainer>
-        <Breadcrumb links={[{ children: 'Integrations' }]} />
         {integrationCategories.map((group) => (
           <SettingsIntegrationGroup key={group.key} integrationGroup={group} />
         ))}
diff --git a/packages/twenty-front/src/pages/settings/profile/appearance/components/SettingsAppearance.tsx b/packages/twenty-front/src/pages/settings/profile/appearance/components/SettingsAppearance.tsx
index fa34fdd5d687..efa1036b0acf 100644
--- a/packages/twenty-front/src/pages/settings/profile/appearance/components/SettingsAppearance.tsx
+++ b/packages/twenty-front/src/pages/settings/profile/appearance/components/SettingsAppearance.tsx
@@ -1,5 +1,4 @@
-import styled from '@emotion/styled';
-import { H1Title, H2Title, IconSettings } from 'twenty-ui';
+import { H2Title, IconColorSwatch } from 'twenty-ui';
 
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { ColorSchemePicker } from '@/ui/input/color-scheme/components/ColorSchemePicker';
@@ -8,17 +7,12 @@ import { Section } from '@/ui/layout/section/components/Section';
 import { useColorScheme } from '@/ui/theme/hooks/useColorScheme';
 import { DateTimeSettings } from '~/pages/settings/profile/appearance/components/DateTimeSettings';
 
-const StyledH1Title = styled(H1Title)`
-  margin-bottom: 0;
-`;
-
 export const SettingsAppearance = () => {
   const { colorScheme, setColorScheme } = useColorScheme();
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer Icon={IconColorSwatch} title="Appearance">
       <SettingsPageContainer>
-        <StyledH1Title title="Appearance" />
         <Section>
           <H2Title title="Theme" />
           <ColorSchemePicker value={colorScheme} onChange={setColorScheme} />
diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/ResetServerlessFunctionStatesEffect.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/ResetServerlessFunctionStatesEffect.tsx
index f158f69cb69c..595f2b2a1d47 100644
--- a/packages/twenty-front/src/pages/settings/serverless-functions/ResetServerlessFunctionStatesEffect.tsx
+++ b/packages/twenty-front/src/pages/settings/serverless-functions/ResetServerlessFunctionStatesEffect.tsx
@@ -1,7 +1,7 @@
-import { useResetRecoilState } from 'recoil';
+import { settingsServerlessFunctionCodeEditorOutputParamsState } from '@/settings/serverless-functions/states/settingsServerlessFunctionCodeEditorOutputParamsState';
 import { settingsServerlessFunctionInputState } from '@/settings/serverless-functions/states/settingsServerlessFunctionInputState';
 import { settingsServerlessFunctionOutputState } from '@/settings/serverless-functions/states/settingsServerlessFunctionOutputState';
-import { settingsServerlessFunctionCodeEditorOutputParamsState } from '@/settings/serverless-functions/states/settingsServerlessFunctionCodeEditorOutputParamsState';
+import { useResetRecoilState } from 'recoil';
 
 export const ResetServerlessFunctionStatesEffect = () => {
   const resetSettingsServerlessFunctionInput = useResetRecoilState(
diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx
index afb03cd87a53..b67cd4655479 100644
--- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx
+++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionDetail.tsx
@@ -1,25 +1,24 @@
-import { useParams } from 'react-router-dom';
-import { IconCode, IconSettings, IconTestPipe } from 'twenty-ui';
-import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
-import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
-import { Section } from '@/ui/layout/section/components/Section';
-import { TabList } from '@/ui/layout/tab/components/TabList';
-import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
-import { useRecoilValue, useSetRecoilState } from 'recoil';
 import { SettingsServerlessFunctionCodeEditorTab } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionCodeEditorTab';
 import { SettingsServerlessFunctionSettingsTab } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionSettingsTab';
-import { useServerlessFunctionUpdateFormState } from '@/settings/serverless-functions/hooks/useServerlessFunctionUpdateFormState';
 import { SettingsServerlessFunctionTestTab } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTestTab';
+import { SettingsServerlessFunctionTestTabEffect } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTestTabEffect';
 import { useExecuteOneServerlessFunction } from '@/settings/serverless-functions/hooks/useExecuteOneServerlessFunction';
+import { useServerlessFunctionUpdateFormState } from '@/settings/serverless-functions/hooks/useServerlessFunctionUpdateFormState';
+import { useUpdateOneServerlessFunction } from '@/settings/serverless-functions/hooks/useUpdateOneServerlessFunction';
+import { settingsServerlessFunctionInputState } from '@/settings/serverless-functions/states/settingsServerlessFunctionInputState';
+import { settingsServerlessFunctionOutputState } from '@/settings/serverless-functions/states/settingsServerlessFunctionOutputState';
 import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
-import { useUpdateOneServerlessFunction } from '@/settings/serverless-functions/hooks/useUpdateOneServerlessFunction';
+import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
+import { Section } from '@/ui/layout/section/components/Section';
+import { TabList } from '@/ui/layout/tab/components/TabList';
+import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
+import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
+import { useParams } from 'react-router-dom';
+import { useRecoilValue, useSetRecoilState } from 'recoil';
+import { IconCode, IconFunction, IconSettings, IconTestPipe } from 'twenty-ui';
 import { useDebouncedCallback } from 'use-debounce';
-import { SettingsServerlessFunctionTestTabEffect } from '@/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTestTabEffect';
-import { settingsServerlessFunctionOutputState } from '@/settings/serverless-functions/states/settingsServerlessFunctionOutputState';
-import { settingsServerlessFunctionInputState } from '@/settings/serverless-functions/states/settingsServerlessFunctionInputState';
 
 const TAB_LIST_COMPONENT_ID = 'serverless-function-detail';
 
@@ -145,16 +144,18 @@ export const SettingsServerlessFunctionDetail = () => {
 
   return (
     formValues.name && (
-      <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+      <SubMenuTopBarContainer
+        Icon={IconFunction}
+        title={
+          <Breadcrumb
+            links={[
+              { children: 'Functions', href: '/settings/functions' },
+              { children: `${formValues.name}` },
+            ]}
+          />
+        }
+      >
         <SettingsPageContainer>
-          <SettingsHeaderContainer>
-            <Breadcrumb
-              links={[
-                { children: 'Functions', href: '/settings/functions' },
-                { children: `${formValues.name}` },
-              ]}
-            />
-          </SettingsHeaderContainer>
           <Section>
             <TabList tabListId={TAB_LIST_COMPONENT_ID} tabs={tabs} />
           </Section>
diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx
index d186ffdec76a..ff44358c0d62 100644
--- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx
+++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctions.tsx
@@ -1,31 +1,36 @@
-import { IconPlus, IconSettings } from 'twenty-ui';
-import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
-import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
-import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
-import { Section } from '@/ui/layout/section/components/Section';
+import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { SettingsServerlessFunctionsTable } from '@/settings/serverless-functions/components/SettingsServerlessFunctionsTable';
 import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
 import { SettingsPath } from '@/types/SettingsPath';
 import { Button } from '@/ui/input/button/components/Button';
+import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
+import { Section } from '@/ui/layout/section/components/Section';
+import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 import { UndecoratedLink } from '@/ui/navigation/link/components/UndecoratedLink';
+import { IconFunction, IconPlus } from 'twenty-ui';
 
 export const SettingsServerlessFunctions = () => {
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconFunction}
+      title="Functions"
+      actionButton={
+        <UndecoratedLink
+          to={getSettingsPagePath(SettingsPath.NewServerlessFunction)}
+        >
+          <Button
+            Icon={IconPlus}
+            title="New Function"
+            accent="blue"
+            size="small"
+          />
+        </UndecoratedLink>
+      }
+    >
       <SettingsPageContainer>
         <SettingsHeaderContainer>
           <Breadcrumb links={[{ children: 'Functions' }]} />
-          <UndecoratedLink
-            to={getSettingsPagePath(SettingsPath.NewServerlessFunction)}
-          >
-            <Button
-              Icon={IconPlus}
-              title="New Function"
-              accent="blue"
-              size="small"
-            />
-          </UndecoratedLink>
         </SettingsHeaderContainer>
         <Section>
           <SettingsServerlessFunctionsTable />
diff --git a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx
index 2f5dbce31bf7..c4f9eadce925 100644
--- a/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx
+++ b/packages/twenty-front/src/pages/settings/serverless-functions/SettingsServerlessFunctionsNew.tsx
@@ -1,19 +1,18 @@
-import { IconSettings } from 'twenty-ui';
-import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
-import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
-import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
-import { SettingsHeaderContainer } from '@/settings/components/SettingsHeaderContainer';
 import { SaveAndCancelButtons } from '@/settings/components/SaveAndCancelButtons/SaveAndCancelButtons';
+import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
+import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
+import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 import { useNavigate } from 'react-router-dom';
 
+import { SettingsServerlessFunctionNewForm } from '@/settings/serverless-functions/components/SettingsServerlessFunctionNewForm';
 import { useCreateOneServerlessFunction } from '@/settings/serverless-functions/hooks/useCreateOneServerlessFunction';
-import { DEFAULT_CODE } from '@/ui/input/code-editor/components/CodeEditor';
 import { ServerlessFunctionNewFormValues } from '@/settings/serverless-functions/hooks/useServerlessFunctionUpdateFormState';
-import { SettingsServerlessFunctionNewForm } from '@/settings/serverless-functions/components/SettingsServerlessFunctionNewForm';
-import { isDefined } from '~/utils/isDefined';
-import { useState } from 'react';
 import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
 import { SettingsPath } from '@/types/SettingsPath';
+import { DEFAULT_CODE } from '@/ui/input/code-editor/components/CodeEditor';
+import { useState } from 'react';
+import { IconFunction } from 'twenty-ui';
+import { isDefined } from '~/utils/isDefined';
 
 export const SettingsServerlessFunctionsNew = () => {
   const navigate = useNavigate();
@@ -54,23 +53,27 @@ export const SettingsServerlessFunctionsNew = () => {
   const canSave = !!formValues.name && createOneServerlessFunction;
 
   return (
-    <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
+    <SubMenuTopBarContainer
+      Icon={IconFunction}
+      title={
+        <Breadcrumb
+          links={[
+            { children: 'Functions', href: '/settings/functions' },
+            { children: 'New' },
+          ]}
+        />
+      }
+      actionButton={
+        <SaveAndCancelButtons
+          isSaveDisabled={!canSave}
+          onCancel={() => {
+            navigate('/settings/functions');
+          }}
+          onSave={handleSave}
+        />
+      }
+    >
       <SettingsPageContainer>
-        <SettingsHeaderContainer>
-          <Breadcrumb
-            links={[
-              { children: 'Functions', href: '/settings/functions' },
-              { children: 'New' },
-            ]}
-          />
-          <SaveAndCancelButtons
-            isSaveDisabled={!canSave}
-            onCancel={() => {
-              navigate('/settings/functions');
-            }}
-            onSave={handleSave}
-          />
-        </SettingsHeaderContainer>
         <SettingsServerlessFunctionNewForm
           formValues={formValues}
           onChange={onChange}
diff --git a/packages/twenty-front/src/testing/mock-data/tableData.ts b/packages/twenty-front/src/testing/mock-data/tableData.ts
new file mode 100644
index 000000000000..9ebe0f306077
--- /dev/null
+++ b/packages/twenty-front/src/testing/mock-data/tableData.ts
@@ -0,0 +1,71 @@
+import { TableMetadata } from '@/ui/layout/table/types/TableMetadata';
+
+export type MockedTableType = {
+  labelPlural: string;
+  fieldsCount: number;
+};
+
+export const mockedTableMetadata: TableMetadata<MockedTableType> = {
+  tableId: 'SettingsObjectDetail',
+  fields: [
+    {
+      fieldName: 'labelPlural',
+      fieldType: 'string',
+      align: 'left',
+      fieldLabel: 'Name',
+    },
+    {
+      fieldName: 'fieldsCount',
+      fieldType: 'number',
+      align: 'right',
+      fieldLabel: 'Fields Count',
+    },
+  ],
+};
+
+export const mockedTableData = [
+  {
+    labelPlural: 'Opportunities',
+    fieldsCount: 11,
+  },
+  {
+    labelPlural: 'Contact',
+    fieldsCount: 3,
+  },
+  {
+    labelPlural: 'Leads',
+    fieldsCount: 4,
+  },
+  {
+    labelPlural: 'Tasks',
+    fieldsCount: 5,
+  },
+];
+
+export const tableDataSortedBylabelInAscendingOrder = [
+  { labelPlural: 'Contact', fieldsCount: 3 },
+  { labelPlural: 'Leads', fieldsCount: 4 },
+  { labelPlural: 'Opportunities', fieldsCount: 11 },
+  { labelPlural: 'Tasks', fieldsCount: 5 },
+];
+
+export const tableDataSortedBylabelInDescendingOrder = [
+  { labelPlural: 'Tasks', fieldsCount: 5 },
+  { labelPlural: 'Opportunities', fieldsCount: 11 },
+  { labelPlural: 'Leads', fieldsCount: 4 },
+  { labelPlural: 'Contact', fieldsCount: 3 },
+];
+
+export const tableDataSortedByFieldsCountInAscendingOrder = [
+  { labelPlural: 'Contact', fieldsCount: 3 },
+  { labelPlural: 'Leads', fieldsCount: 4 },
+  { labelPlural: 'Tasks', fieldsCount: 5 },
+  { labelPlural: 'Opportunities', fieldsCount: 11 },
+];
+
+export const tableDataSortedByFieldsCountInDescendingOrder = [
+  { labelPlural: 'Opportunities', fieldsCount: 11 },
+  { labelPlural: 'Tasks', fieldsCount: 5 },
+  { labelPlural: 'Leads', fieldsCount: 4 },
+  { labelPlural: 'Contact', fieldsCount: 3 },
+];
diff --git a/packages/twenty-front/src/utils/title-utils.ts b/packages/twenty-front/src/utils/title-utils.ts
index 74213f0083da..dddb2ce1196e 100644
--- a/packages/twenty-front/src/utils/title-utils.ts
+++ b/packages/twenty-front/src/utils/title-utils.ts
@@ -49,10 +49,6 @@ export const getPageTitleFromPath = (pathname: string): string => {
       return 'Create Workspace';
     case AppPath.CreateProfile:
       return 'Create Profile';
-    case AppPath.TasksPage:
-      return 'Tasks';
-    case AppPath.OpportunitiesPage:
-      return 'Opportunities';
     case SettingsPathPrefixes.Appearance:
       return SettingsPageTitles.Appearance;
     case SettingsPathPrefixes.Accounts:
diff --git a/packages/twenty-server/package.json b/packages/twenty-server/package.json
index abcab3e11298..4b80f49e6871 100644
--- a/packages/twenty-server/package.json
+++ b/packages/twenty-server/package.json
@@ -11,7 +11,8 @@
     "command:prod": "node dist/src/command/command",
     "worker:prod": "node dist/src/queue-worker/queue-worker",
     "database:init:prod": "npx ts-node ./scripts/setup-db.ts && yarn database:migrate:prod",
-    "database:migrate:prod": "npx -y typeorm migration:run -d dist/src/database/typeorm/metadata/metadata.datasource && npx -y typeorm migration:run -d dist/src/database/typeorm/core/core.datasource"
+    "database:migrate:prod": "npx -y typeorm migration:run -d dist/src/database/typeorm/metadata/metadata.datasource && npx -y typeorm migration:run -d dist/src/database/typeorm/core/core.datasource",
+    "typeorm": "../../node_modules/typeorm/.bin/typeorm"
   },
   "dependencies": {
     "@graphql-yoga/nestjs": "patch:@graphql-yoga/nestjs@2.1.0#./patches/@graphql-yoga-nestjs-npm-2.1.0-cb509e6047.patch",
diff --git a/packages/twenty-server/src/database/typeorm/metadata/migrations/1723038077987-addSoftDelete.ts b/packages/twenty-server/src/database/typeorm/metadata/migrations/1723038077987-addSoftDelete.ts
new file mode 100644
index 000000000000..c9550c95408e
--- /dev/null
+++ b/packages/twenty-server/src/database/typeorm/metadata/migrations/1723038077987-addSoftDelete.ts
@@ -0,0 +1,17 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class AddSoftDelete1723038077987 implements MigrationInterface {
+  name = 'AddSoftDelete1723038077987';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "metadata"."objectMetadata" ADD "isSoftDeletable" boolean`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "metadata"."objectMetadata" DROP COLUMN "isSoftDeletable"`,
+    );
+  }
+}
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/args-string.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/args-string.factory.ts
index d4b8efd77ed6..5755fe413489 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/args-string.factory.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/args-string.factory.ts
@@ -3,6 +3,7 @@ import { Injectable } from '@nestjs/common';
 import { FieldMetadataInterface } from 'src/engine/metadata-modules/field-metadata/interfaces/field-metadata.interface';
 
 import { stringifyWithoutKeyQuote } from 'src/engine/api/graphql/workspace-query-builder/utils/stringify-without-key-quote.util';
+import { isDefined } from 'src/utils/is-defined';
 
 import { ArgsAliasFactory } from './args-alias.factory';
 
@@ -13,10 +14,18 @@ export class ArgsStringFactory {
   create(
     initialArgs: Record<string, any> | undefined,
     fieldMetadataCollection: FieldMetadataInterface[],
+    softDeletable?: boolean,
   ): string | null {
     if (!initialArgs) {
       return null;
     }
+    if (softDeletable) {
+      initialArgs.filter = {
+        and: [initialArgs.filter, { deletedAt: { is: 'NULL' } }].filter(
+          isDefined,
+        ),
+      };
+    }
     let argsString = '';
     const computedArgs = this.argsAliasFactory.create(
       initialArgs,
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/fields-string.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/fields-string.factory.ts
index 1acc3778d15f..7dbf38b897c8 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/fields-string.factory.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/fields-string.factory.ts
@@ -22,19 +22,23 @@ export class FieldsStringFactory {
     private readonly relationFieldAliasFactory: RelationFieldAliasFactory,
   ) {}
 
-  create(
+  async create(
     info: GraphQLResolveInfo,
     fieldMetadataCollection: FieldMetadataInterface[],
     objectMetadataCollection: ObjectMetadataInterface[],
+    withSoftDeleted?: boolean,
   ): Promise<string> {
     const selectedFields: Partial<Record> = graphqlFields(info);
 
-    return this.createFieldsStringRecursive(
+    const res = await this.createFieldsStringRecursive(
       info,
       selectedFields,
       fieldMetadataCollection,
       objectMetadataCollection,
+      withSoftDeleted ?? false,
     );
+
+    return res;
   }
 
   async createFieldsStringRecursive(
@@ -42,6 +46,7 @@ export class FieldsStringFactory {
     selectedFields: Partial<Record>,
     fieldMetadataCollection: FieldMetadataInterface[],
     objectMetadataCollection: ObjectMetadataInterface[],
+    withSoftDeleted: boolean,
     accumulator = '',
   ): Promise<string> {
     const fieldMetadataMap = new Map(
@@ -65,6 +70,7 @@ export class FieldsStringFactory {
             fieldMetadata,
             objectMetadataCollection,
             info,
+            withSoftDeleted,
           );
 
           fieldAlias = alias;
@@ -91,6 +97,7 @@ export class FieldsStringFactory {
           fieldValue,
           fieldMetadataCollection,
           objectMetadataCollection,
+          withSoftDeleted,
           accumulator,
         );
         accumulator += `}\n`;
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-many-query.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-many-query.factory.ts
index 476695f3c6dd..03391ce4cb53 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-many-query.factory.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-many-query.factory.ts
@@ -36,6 +36,7 @@ export class FindManyQueryFactory {
     const argsString = this.argsStringFactory.create(
       args,
       options.fieldMetadataCollection,
+      !options.withSoftDeleted && !!options.objectMetadataItem.isSoftDeletable,
     );
 
     return `
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-one-query.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-one-query.factory.ts
index 80bbf3c9eea0..efef8ff69ff5 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-one-query.factory.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/find-one-query.factory.ts
@@ -26,10 +26,12 @@ export class FindOneQueryFactory {
       options.info,
       options.fieldMetadataCollection,
       options.objectMetadataCollection,
+      options.withSoftDeleted,
     );
     const argsString = this.argsStringFactory.create(
       args,
       options.fieldMetadataCollection,
+      !options.withSoftDeleted && !!options.objectMetadataItem.isSoftDeletable,
     );
 
     return `
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/relation-field-alias.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/relation-field-alias.factory.ts
index 51371924dd15..00918785cc97 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/relation-field-alias.factory.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/factories/relation-field-alias.factory.ts
@@ -12,7 +12,6 @@ import {
   RelationDirection,
 } from 'src/engine/utils/deduce-relation-direction.util';
 import { getFieldArgumentsByKey } from 'src/engine/api/graphql/workspace-query-builder/utils/get-field-arguments-by-key.util';
-import { ObjectMetadataService } from 'src/engine/metadata-modules/object-metadata/object-metadata.service';
 import { computeObjectTargetTable } from 'src/engine/utils/compute-object-target-table.util';
 import { computeColumnName } from 'src/engine/metadata-modules/field-metadata/utils/compute-column-name.util';
 
@@ -27,7 +26,6 @@ export class RelationFieldAliasFactory {
     @Inject(forwardRef(() => FieldsStringFactory))
     private readonly fieldsStringFactory: CircularDep<FieldsStringFactory>,
     private readonly argsStringFactory: ArgsStringFactory,
-    private readonly objectMetadataService: ObjectMetadataService,
   ) {}
 
   create(
@@ -36,6 +34,7 @@ export class RelationFieldAliasFactory {
     fieldMetadata: FieldMetadataInterface,
     objectMetadataCollection: ObjectMetadataInterface[],
     info: GraphQLResolveInfo,
+    withSoftDeleted?: boolean,
   ): Promise<string> {
     if (!isRelationFieldMetadataType(fieldMetadata.type)) {
       throw new Error(`Field ${fieldMetadata.name} is not a relation field`);
@@ -47,6 +46,7 @@ export class RelationFieldAliasFactory {
       fieldMetadata,
       objectMetadataCollection,
       info,
+      withSoftDeleted,
     );
   }
 
@@ -56,6 +56,7 @@ export class RelationFieldAliasFactory {
     fieldMetadata: FieldMetadataInterface,
     objectMetadataCollection: ObjectMetadataInterface[],
     info: GraphQLResolveInfo,
+    withSoftDeleted?: boolean,
   ): Promise<string> {
     const relationMetadata =
       fieldMetadata.fromRelationMetadata ?? fieldMetadata.toRelationMetadata;
@@ -98,9 +99,11 @@ export class RelationFieldAliasFactory {
       relationDirection === RelationDirection.FROM
     ) {
       const args = getFieldArgumentsByKey(info, fieldKey);
+
       const argsString = this.argsStringFactory.create(
         args,
         referencedObjectMetadata.fields ?? [],
+        !withSoftDeleted && !!referencedObjectMetadata.isSoftDeletable,
       );
       const fieldsString =
         await this.fieldsStringFactory.createFieldsStringRecursive(
@@ -108,6 +111,7 @@ export class RelationFieldAliasFactory {
           fieldValue,
           referencedObjectMetadata.fields ?? [],
           objectMetadataCollection,
+          withSoftDeleted ?? false,
         );
 
       return `
@@ -137,6 +141,7 @@ export class RelationFieldAliasFactory {
         fieldValue,
         referencedObjectMetadata.fields ?? [],
         objectMetadataCollection,
+        withSoftDeleted ?? false,
       );
 
     // Otherwise it means it's a relation destination is of kind ONE
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/record.interface.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/record.interface.ts
index 32ee60f567c6..54d2c373b642 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/record.interface.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/record.interface.ts
@@ -3,6 +3,7 @@ export interface Record {
   [key: string]: any;
   createdAt: string;
   updatedAt: string;
+  deletedAt: string | null;
 }
 
 export type RecordFilter = {
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/workspace-query-builder-options.interface.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/workspace-query-builder-options.interface.ts
index 4f1ace4a8013..4a543cea0eda 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/workspace-query-builder-options.interface.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-builder/interfaces/workspace-query-builder-options.interface.ts
@@ -8,4 +8,5 @@ export interface WorkspaceQueryBuilderOptions {
   info: GraphQLResolveInfo;
   fieldMetadataCollection: FieldMetadataInterface[];
   objectMetadataCollection: ObjectMetadataInterface[];
+  withSoftDeleted?: boolean;
 }
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/listeners/entity-events-to-db.listener.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/listeners/entity-events-to-db.listener.ts
index 0d5909471ddb..6c7d6e066d24 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/listeners/entity-events-to-db.listener.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/listeners/entity-events-to-db.listener.ts
@@ -35,11 +35,10 @@ export class EntityEventsToDbListener {
     return this.handle(payload);
   }
 
-  // @OnEvent('*.deleted') - TODO: implement when we soft delete has been implemented
-  // ....
-
-  // @OnEvent('*.restored') - TODO: implement when we soft delete has been implemented
-  // ....
+  @OnEvent('*.deleted')
+  async handleDelete(payload: ObjectRecordUpdateEvent<any>) {
+    return this.handle(payload);
+  }
 
   private async handle(payload: ObjectRecordBaseEvent) {
     if (!payload.objectMetadata?.isAuditLogged) {
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/utils/with-soft-deleted.util.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/utils/with-soft-deleted.util.ts
new file mode 100644
index 000000000000..a972782a6ad1
--- /dev/null
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/utils/with-soft-deleted.util.ts
@@ -0,0 +1,29 @@
+import { RecordFilter } from 'src/engine/api/graphql/workspace-query-builder/interfaces/record.interface';
+
+import { isDefined } from 'src/utils/is-defined';
+
+export const withSoftDeleted = <T extends RecordFilter>(
+  filter: T | undefined | null,
+): boolean => {
+  if (!isDefined(filter)) {
+    return false;
+  }
+
+  if (Array.isArray(filter)) {
+    return filter.some((item) => withSoftDeleted(item));
+  }
+
+  for (const [key, value] of Object.entries(filter)) {
+    if (key === 'deletedAt') {
+      return true;
+    }
+
+    if (typeof value === 'object' && value !== null) {
+      if (withSoftDeleted(value)) {
+        return true;
+      }
+    }
+  }
+
+  return false;
+};
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-hook/types/workspace-query-hook.type.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-hook/types/workspace-query-hook.type.ts
index 40ec1df6b4d4..f155475877e0 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-hook/types/workspace-query-hook.type.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-hook/types/workspace-query-hook.type.ts
@@ -3,9 +3,11 @@ import {
   CreateOneResolverArgs,
   DeleteManyResolverArgs,
   DeleteOneResolverArgs,
+  DestroyManyResolverArgs,
   FindDuplicatesResolverArgs,
   FindManyResolverArgs,
   FindOneResolverArgs,
+  RestoreManyResolverArgs,
   UpdateManyResolverArgs,
   UpdateOneResolverArgs,
 } from 'src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface';
@@ -33,4 +35,8 @@ export type WorkspacePreQueryHookPayload<T> = T extends 'createMany'
                 ? UpdateOneResolverArgs
                 : T extends 'findDuplicates'
                   ? FindDuplicatesResolverArgs
-                  : never;
+                  : T extends 'restoreMany'
+                    ? RestoreManyResolverArgs
+                    : T extends 'destroyMany'
+                      ? DestroyManyResolverArgs
+                      : never;
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-runner.service.ts b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-runner.service.ts
index 18a55038861f..30f526a345ef 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-runner.service.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-query-runner/workspace-query-runner.service.ts
@@ -15,10 +15,12 @@ import {
   CreateOneResolverArgs,
   DeleteManyResolverArgs,
   DeleteOneResolverArgs,
+  DestroyManyResolverArgs,
   FindDuplicatesResolverArgs,
   FindManyResolverArgs,
   FindOneResolverArgs,
   ResolverArgsType,
+  RestoreManyResolverArgs,
   UpdateManyResolverArgs,
   UpdateOneResolverArgs,
 } from 'src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface';
@@ -34,6 +36,7 @@ import {
 } from 'src/engine/api/graphql/workspace-query-runner/jobs/call-webhook-jobs.job';
 import { assertIsValidUuid } from 'src/engine/api/graphql/workspace-query-runner/utils/assert-is-valid-uuid.util';
 import { parseResult } from 'src/engine/api/graphql/workspace-query-runner/utils/parse-result.util';
+import { withSoftDeleted } from 'src/engine/api/graphql/workspace-query-runner/utils/with-soft-deleted.util';
 import { WorkspaceQueryHookService } from 'src/engine/api/graphql/workspace-query-runner/workspace-query-hook/workspace-query-hook.service';
 import {
   WorkspaceQueryRunnerException,
@@ -108,7 +111,10 @@ export class WorkspaceQueryRunnerService {
 
     const query = await this.workspaceQueryBuilderFactory.findMany(
       computedArgs,
-      options,
+      {
+        ...options,
+        withSoftDeleted: withSoftDeleted(args.filter),
+      },
     );
 
     const result = await this.execute(query, authContext.workspace.id);
@@ -159,7 +165,10 @@ export class WorkspaceQueryRunnerService {
 
     const query = await this.workspaceQueryBuilderFactory.findOne(
       computedArgs,
-      options,
+      {
+        ...options,
+        withSoftDeleted: withSoftDeleted(args.filter),
+      },
     );
 
     const result = await this.execute(query, authContext.workspace.id);
@@ -540,6 +549,7 @@ export class WorkspaceQueryRunnerService {
     options: WorkspaceQueryRunnerOptions,
   ): Promise<Record[] | undefined> {
     const { authContext, objectMetadataItem } = options;
+    let query: string;
 
     assertMutationNotOnRemoteObject(objectMetadataItem);
 
@@ -555,8 +565,96 @@ export class WorkspaceQueryRunnerService {
         args,
       );
 
+    if (objectMetadataItem.isSoftDeletable) {
+      query = await this.workspaceQueryBuilderFactory.updateMany(
+        {
+          filter: hookedArgs.filter,
+          data: {
+            deletedAt: new Date().toISOString(),
+          },
+        },
+        {
+          ...options,
+          atMost: maximumRecordAffected,
+        },
+      );
+    } else {
+      query = await this.workspaceQueryBuilderFactory.deleteMany(hookedArgs, {
+        ...options,
+        atMost: maximumRecordAffected,
+      });
+    }
+
+    const result = await this.execute(query, authContext.workspace.id);
+
+    const parsedResults = (
+      await this.parseResult<PGGraphQLMutation<Record>>(
+        result,
+        objectMetadataItem,
+        objectMetadataItem.isSoftDeletable ? 'update' : 'deleteFrom',
+        authContext.workspace.id,
+      )
+    )?.records;
+
+    await this.triggerWebhooks<Record>(
+      parsedResults,
+      CallWebhookJobsJobOperation.delete,
+      options,
+    );
+
+    parsedResults.forEach((record) => {
+      this.eventEmitter.emit(`${objectMetadataItem.nameSingular}.deleted`, {
+        name: `${objectMetadataItem.nameSingular}.deleted`,
+        workspaceId: authContext.workspace.id,
+        userId: authContext.user?.id,
+        recordId: record.id,
+        objectMetadata: objectMetadataItem,
+        properties: {
+          before: this.removeNestedProperties(record),
+        },
+      } satisfies ObjectRecordDeleteEvent<any>);
+    });
+
+    return parsedResults;
+  }
+
+  async destroyMany<
+    Record extends IRecord = IRecord,
+    Filter extends RecordFilter = RecordFilter,
+  >(
+    args: DestroyManyResolverArgs<Filter>,
+    options: WorkspaceQueryRunnerOptions,
+  ): Promise<Record[] | undefined> {
+    const { authContext, objectMetadataItem } = options;
+
+    assertMutationNotOnRemoteObject(objectMetadataItem);
+
+    if (!objectMetadataItem.isSoftDeletable) {
+      throw new WorkspaceQueryRunnerException(
+        'This method is reserved to objects that can be soft-deleted, use delete instead',
+        WorkspaceQueryRunnerExceptionCode.DATA_NOT_FOUND,
+      );
+    }
+
+    const maximumRecordAffected = this.environmentService.get(
+      'MUTATION_MAXIMUM_AFFECTED_RECORDS',
+    );
+
+    const hookedArgs =
+      await this.workspaceQueryHookService.executePreQueryHooks(
+        authContext,
+        objectMetadataItem.nameSingular,
+        'destroyMany',
+        args,
+      );
+
     const query = await this.workspaceQueryBuilderFactory.deleteMany(
-      hookedArgs,
+      {
+        filter: {
+          ...hookedArgs.filter,
+          deletedAt: { is: 'NOT_NULL' },
+        },
+      },
       {
         ...options,
         atMost: maximumRecordAffected,
@@ -580,17 +678,83 @@ export class WorkspaceQueryRunnerService {
       options,
     );
 
+    return parsedResults;
+  }
+
+  async restoreMany<
+    Record extends IRecord = IRecord,
+    Filter extends RecordFilter = RecordFilter,
+  >(
+    args: RestoreManyResolverArgs<Filter>,
+    options: WorkspaceQueryRunnerOptions,
+  ): Promise<Record[] | undefined> {
+    const { authContext, objectMetadataItem } = options;
+
+    assertMutationNotOnRemoteObject(objectMetadataItem);
+
+    if (!objectMetadataItem.isSoftDeletable) {
+      throw new WorkspaceQueryRunnerException(
+        'This method is reserved to objects that can be soft-deleted',
+        WorkspaceQueryRunnerExceptionCode.DATA_NOT_FOUND,
+      );
+    }
+
+    const maximumRecordAffected = this.environmentService.get(
+      'MUTATION_MAXIMUM_AFFECTED_RECORDS',
+    );
+
+    const hookedArgs =
+      await this.workspaceQueryHookService.executePreQueryHooks(
+        authContext,
+        objectMetadataItem.nameSingular,
+        'restoreMany',
+        args,
+      );
+
+    const query = await this.workspaceQueryBuilderFactory.updateMany(
+      {
+        filter: {
+          ...hookedArgs.filter,
+          deletedAt: { is: 'NOT_NULL' },
+        },
+        data: {
+          deletedAt: null,
+        },
+      },
+      {
+        ...options,
+        atMost: maximumRecordAffected,
+      },
+    );
+
+    const result = await this.execute(query, authContext.workspace.id);
+
+    const parsedResults = (
+      await this.parseResult<PGGraphQLMutation<Record>>(
+        result,
+        objectMetadataItem,
+        'update',
+        authContext.workspace.id,
+      )
+    )?.records;
+
+    await this.triggerWebhooks<Record>(
+      parsedResults,
+      CallWebhookJobsJobOperation.delete,
+      options,
+    );
+
     parsedResults.forEach((record) => {
-      this.eventEmitter.emit(`${objectMetadataItem.nameSingular}.deleted`, {
-        name: `${objectMetadataItem.nameSingular}.deleted`,
+      this.eventEmitter.emit(`${objectMetadataItem.nameSingular}.created`, {
+        name: `${objectMetadataItem.nameSingular}.created`,
         workspaceId: authContext.workspace.id,
         userId: authContext.user?.id,
         recordId: record.id,
         objectMetadata: objectMetadataItem,
         properties: {
-          before: this.removeNestedProperties(record),
+          after: this.removeNestedProperties(record),
         },
-      } satisfies ObjectRecordDeleteEvent<any>);
+      } satisfies ObjectRecordCreateEvent<any>);
     });
 
     return parsedResults;
@@ -606,6 +770,7 @@ export class WorkspaceQueryRunnerService {
         authContext.workspace.id,
         objectMetadataItem.nameSingular,
       );
+    let query: string;
 
     assertMutationNotOnRemoteObject(objectMetadataItem);
     assertIsValidUuid(args.id);
@@ -618,10 +783,22 @@ export class WorkspaceQueryRunnerService {
         args,
       );
 
-    const query = await this.workspaceQueryBuilderFactory.deleteOne(
-      hookedArgs,
-      options,
-    );
+    if (objectMetadataItem.isSoftDeletable) {
+      query = await this.workspaceQueryBuilderFactory.updateOne(
+        {
+          id: hookedArgs.id,
+          data: {
+            deletedAt: new Date().toISOString(),
+          },
+        },
+        options,
+      );
+    } else {
+      query = await this.workspaceQueryBuilderFactory.deleteOne(
+        hookedArgs,
+        options,
+      );
+    }
 
     const existingRecord = await repository.findOne({
       where: { id: args.id },
@@ -633,7 +810,7 @@ export class WorkspaceQueryRunnerService {
       await this.parseResult<PGGraphQLMutation<Record>>(
         result,
         objectMetadataItem,
-        'deleteFrom',
+        objectMetadataItem.isSoftDeletable ? 'update' : 'deleteFrom',
         authContext.workspace.id,
       )
     )?.records;
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/destroy-many-resolver.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/destroy-many-resolver.factory.ts
new file mode 100644
index 000000000000..4a064a406b9b
--- /dev/null
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/destroy-many-resolver.factory.ts
@@ -0,0 +1,42 @@
+import { Injectable } from '@nestjs/common';
+
+import { WorkspaceResolverBuilderFactoryInterface } from 'src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolver-builder-factory.interface';
+import {
+  DestroyManyResolverArgs,
+  Resolver,
+} from 'src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface';
+import { WorkspaceSchemaBuilderContext } from 'src/engine/api/graphql/workspace-schema-builder/interfaces/workspace-schema-builder-context.interface';
+
+import { workspaceQueryRunnerGraphqlApiExceptionHandler } from 'src/engine/api/graphql/workspace-query-runner/utils/workspace-query-runner-graphql-api-exception-handler.util';
+import { WorkspaceQueryRunnerService } from 'src/engine/api/graphql/workspace-query-runner/workspace-query-runner.service';
+
+@Injectable()
+export class DestroyManyResolverFactory
+  implements WorkspaceResolverBuilderFactoryInterface
+{
+  public static methodName = 'destroyMany' as const;
+
+  constructor(
+    private readonly workspaceQueryRunnerService: WorkspaceQueryRunnerService,
+  ) {}
+
+  create(
+    context: WorkspaceSchemaBuilderContext,
+  ): Resolver<DestroyManyResolverArgs> {
+    const internalContext = context;
+
+    return async (_source, args, context, info) => {
+      try {
+        return await this.workspaceQueryRunnerService.destroyMany(args, {
+          authContext: internalContext.authContext,
+          objectMetadataItem: internalContext.objectMetadataItem,
+          info,
+          fieldMetadataCollection: internalContext.fieldMetadataCollection,
+          objectMetadataCollection: internalContext.objectMetadataCollection,
+        });
+      } catch (error) {
+        workspaceQueryRunnerGraphqlApiExceptionHandler(error);
+      }
+    };
+  }
+}
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/factories.ts b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/factories.ts
index 2f4a88b34d2a..99d9c5419766 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/factories.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/factories.ts
@@ -1,3 +1,5 @@
+import { DestroyManyResolverFactory } from 'src/engine/api/graphql/workspace-resolver-builder/factories/destroy-many-resolver.factory';
+import { RestoreManyResolverFactory } from 'src/engine/api/graphql/workspace-resolver-builder/factories/restore-many-resolver.factory';
 import { UpdateManyResolverFactory } from 'src/engine/api/graphql/workspace-resolver-builder/factories/update-many-resolver.factory';
 
 import { CreateManyResolverFactory } from './create-many-resolver.factory';
@@ -19,6 +21,8 @@ export const workspaceResolverBuilderFactories = [
   DeleteOneResolverFactory,
   UpdateManyResolverFactory,
   DeleteManyResolverFactory,
+  DestroyManyResolverFactory,
+  RestoreManyResolverFactory,
 ];
 
 export const workspaceResolverBuilderMethodNames = {
@@ -34,5 +38,7 @@ export const workspaceResolverBuilderMethodNames = {
     DeleteOneResolverFactory.methodName,
     UpdateManyResolverFactory.methodName,
     DeleteManyResolverFactory.methodName,
+    DestroyManyResolverFactory.methodName,
+    RestoreManyResolverFactory.methodName,
   ],
 } as const;
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/restore-many-resolver.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/restore-many-resolver.factory.ts
new file mode 100644
index 000000000000..ceba95306aed
--- /dev/null
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/factories/restore-many-resolver.factory.ts
@@ -0,0 +1,42 @@
+import { Injectable } from '@nestjs/common';
+
+import { WorkspaceResolverBuilderFactoryInterface } from 'src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolver-builder-factory.interface';
+import {
+  Resolver,
+  RestoreManyResolverArgs,
+} from 'src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface';
+import { WorkspaceSchemaBuilderContext } from 'src/engine/api/graphql/workspace-schema-builder/interfaces/workspace-schema-builder-context.interface';
+
+import { workspaceQueryRunnerGraphqlApiExceptionHandler } from 'src/engine/api/graphql/workspace-query-runner/utils/workspace-query-runner-graphql-api-exception-handler.util';
+import { WorkspaceQueryRunnerService } from 'src/engine/api/graphql/workspace-query-runner/workspace-query-runner.service';
+
+@Injectable()
+export class RestoreManyResolverFactory
+  implements WorkspaceResolverBuilderFactoryInterface
+{
+  public static methodName = 'restoreMany' as const;
+
+  constructor(
+    private readonly workspaceQueryRunnerService: WorkspaceQueryRunnerService,
+  ) {}
+
+  create(
+    context: WorkspaceSchemaBuilderContext,
+  ): Resolver<RestoreManyResolverArgs> {
+    const internalContext = context;
+
+    return async (_source, args, context, info) => {
+      try {
+        return await this.workspaceQueryRunnerService.restoreMany(args, {
+          authContext: internalContext.authContext,
+          objectMetadataItem: internalContext.objectMetadataItem,
+          info,
+          fieldMetadataCollection: internalContext.fieldMetadataCollection,
+          objectMetadataCollection: internalContext.objectMetadataCollection,
+        });
+      } catch (error) {
+        workspaceQueryRunnerGraphqlApiExceptionHandler(error);
+      }
+    };
+  }
+}
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface.ts b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface.ts
index 2727a3fdc605..cbe5b1fa2e84 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface.ts
@@ -20,6 +20,8 @@ export enum ResolverArgsType {
   UpdateMany = 'UpdateMany',
   DeleteOne = 'DeleteOne',
   DeleteMany = 'DeleteMany',
+  RestoreMany = 'RestoreMany',
+  DestroyMany = 'DestroyMany',
 }
 
 export interface FindManyResolverArgs<
@@ -82,6 +84,14 @@ export interface DeleteManyResolverArgs<Filter = any> {
   filter: Filter;
 }
 
+export interface RestoreManyResolverArgs<Filter = any> {
+  filter: Filter;
+}
+
+export interface DestroyManyResolverArgs<Filter = any> {
+  filter: Filter;
+}
+
 export type WorkspaceResolverBuilderQueryMethodNames =
   (typeof workspaceResolverBuilderMethodNames.queries)[number];
 
@@ -106,4 +116,6 @@ export type ResolverArgs =
   | FindOneResolverArgs
   | FindDuplicatesResolverArgs
   | UpdateManyResolverArgs
-  | UpdateOneResolverArgs;
+  | UpdateOneResolverArgs
+  | DestroyManyResolverArgs
+  | RestoreManyResolverArgs;
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/workspace-resolver.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/workspace-resolver.factory.ts
index 7fed8b96c613..fc405bfff689 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/workspace-resolver.factory.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-resolver-builder/workspace-resolver.factory.ts
@@ -5,6 +5,8 @@ import { IResolvers } from '@graphql-tools/utils';
 import { ObjectMetadataInterface } from 'src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface';
 
 import { DeleteManyResolverFactory } from 'src/engine/api/graphql/workspace-resolver-builder/factories/delete-many-resolver.factory';
+import { DestroyManyResolverFactory } from 'src/engine/api/graphql/workspace-resolver-builder/factories/destroy-many-resolver.factory';
+import { RestoreManyResolverFactory } from 'src/engine/api/graphql/workspace-resolver-builder/factories/restore-many-resolver.factory';
 import { UpdateManyResolverFactory } from 'src/engine/api/graphql/workspace-resolver-builder/factories/update-many-resolver.factory';
 import { AuthContext } from 'src/engine/core-modules/auth/types/auth-context.type';
 import { getResolverName } from 'src/engine/utils/get-resolver-name.util';
@@ -36,6 +38,8 @@ export class WorkspaceResolverFactory {
     private readonly deleteOneResolverFactory: DeleteOneResolverFactory,
     private readonly updateManyResolverFactory: UpdateManyResolverFactory,
     private readonly deleteManyResolverFactory: DeleteManyResolverFactory,
+    private readonly restoreManyResolverFactory: RestoreManyResolverFactory,
+    private readonly destroyManyResolverFactory: DestroyManyResolverFactory,
   ) {}
 
   async create(
@@ -56,6 +60,8 @@ export class WorkspaceResolverFactory {
       ['deleteOne', this.deleteOneResolverFactory],
       ['updateMany', this.updateManyResolverFactory],
       ['deleteMany', this.deleteManyResolverFactory],
+      ['restoreMany', this.restoreManyResolverFactory],
+      ['destroyMany', this.destroyManyResolverFactory],
     ]);
     const resolvers: IResolvers = {
       Query: {},
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/factories/root-type.factory.ts b/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/factories/root-type.factory.ts
index 780cf2985af7..c39111d3ff18 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/factories/root-type.factory.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/factories/root-type.factory.ts
@@ -2,14 +2,14 @@ import { Injectable, Logger } from '@nestjs/common';
 
 import { GraphQLFieldConfigMap, GraphQLObjectType } from 'graphql';
 
-import { WorkspaceBuildSchemaOptions } from 'src/engine/api/graphql/workspace-schema-builder/interfaces/workspace-build-schema-optionts.interface';
 import { WorkspaceResolverBuilderMethodNames } from 'src/engine/api/graphql/workspace-resolver-builder/interfaces/workspace-resolvers-builder.interface';
+import { WorkspaceBuildSchemaOptions } from 'src/engine/api/graphql/workspace-schema-builder/interfaces/workspace-build-schema-optionts.interface';
 import { ObjectMetadataInterface } from 'src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface';
 
+import { TypeMapperService } from 'src/engine/api/graphql/workspace-schema-builder/services/type-mapper.service';
 import { TypeDefinitionsStorage } from 'src/engine/api/graphql/workspace-schema-builder/storages/type-definitions.storage';
-import { getResolverName } from 'src/engine/utils/get-resolver-name.util';
 import { getResolverArgs } from 'src/engine/api/graphql/workspace-schema-builder/utils/get-resolver-args.util';
-import { TypeMapperService } from 'src/engine/api/graphql/workspace-schema-builder/services/type-mapper.service';
+import { getResolverName } from 'src/engine/utils/get-resolver-name.util';
 
 import { ArgsFactory } from './args.factory';
 import { ObjectTypeDefinitionKind } from './object-type-definition.factory';
@@ -101,13 +101,17 @@ export class RootTypeFactory {
           );
         }
 
+        const allowedMethodNames = [
+          'updateMany',
+          'deleteMany',
+          'createMany',
+          'findDuplicates',
+          'restoreMany',
+          'destroyMany',
+        ];
+
         const outputType = this.typeMapperService.mapToGqlType(objectType, {
-          isArray: [
-            'updateMany',
-            'deleteMany',
-            'createMany',
-            'findDuplicates',
-          ].includes(methodName),
+          isArray: allowedMethodNames.includes(methodName),
         });
 
         fieldConfigMap[name] = {
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/__tests__/get-resolver-args.spec.ts b/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/__tests__/get-resolver-args.spec.ts
index 72a9de127dc4..3f47f10797ac 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/__tests__/get-resolver-args.spec.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/__tests__/get-resolver-args.spec.ts
@@ -50,6 +50,12 @@ describe('getResolverArgs', () => {
     deleteOne: {
       id: { type: GraphQLID, isNullable: false },
     },
+    restoreMany: {
+      filter: { kind: InputTypeDefinitionKind.Filter, isNullable: false },
+    },
+    destroyMany: {
+      filter: { kind: InputTypeDefinitionKind.Filter, isNullable: false },
+    },
   };
 
   // Test each resolver type
diff --git a/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/get-resolver-args.util.ts b/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/get-resolver-args.util.ts
index a279282b50dc..f42377b89c20 100644
--- a/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/get-resolver-args.util.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/utils/get-resolver-args.util.ts
@@ -116,6 +116,20 @@ export const getResolverArgs = (
           isNullable: false,
         },
       };
+    case 'restoreMany':
+      return {
+        filter: {
+          kind: InputTypeDefinitionKind.Filter,
+          isNullable: false,
+        },
+      };
+    case 'destroyMany':
+      return {
+        filter: {
+          kind: InputTypeDefinitionKind.Filter,
+          isNullable: false,
+        },
+      };
     default:
       throw new Error(`Unknown resolver type: ${type}`);
   }
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/dtos/timeline-thread-participant.dto.ts b/packages/twenty-server/src/engine/core-modules/messaging/dtos/timeline-thread-participant.dto.ts
index 6444474155ad..d0845ddf0f81 100644
--- a/packages/twenty-server/src/engine/core-modules/messaging/dtos/timeline-thread-participant.dto.ts
+++ b/packages/twenty-server/src/engine/core-modules/messaging/dtos/timeline-thread-participant.dto.ts
@@ -1,14 +1,14 @@
-import { ObjectType, Field } from '@nestjs/graphql';
+import { Field, ObjectType } from '@nestjs/graphql';
 
 import { UUIDScalarType } from 'src/engine/api/graphql/workspace-schema-builder/graphql-types/scalars';
 
 @ObjectType('TimelineThreadParticipant')
 export class TimelineThreadParticipant {
   @Field(() => UUIDScalarType, { nullable: true })
-  personId: string;
+  personId: string | null;
 
   @Field(() => UUIDScalarType, { nullable: true })
-  workspaceMemberId: string;
+  workspaceMemberId: string | null;
 
   @Field()
   firstName: string;
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/services/get-messages.service.ts b/packages/twenty-server/src/engine/core-modules/messaging/services/get-messages.service.ts
new file mode 100644
index 000000000000..63e5bf51cd25
--- /dev/null
+++ b/packages/twenty-server/src/engine/core-modules/messaging/services/get-messages.service.ts
@@ -0,0 +1,101 @@
+import { Injectable } from '@nestjs/common';
+
+import { TIMELINE_THREADS_DEFAULT_PAGE_SIZE } from 'src/engine/core-modules/messaging/constants/messaging.constants';
+import { TimelineThreadsWithTotal } from 'src/engine/core-modules/messaging/dtos/timeline-threads-with-total.dto';
+import { TimelineMessagingService } from 'src/engine/core-modules/messaging/services/timeline-messaging.service';
+import { formatThreads } from 'src/engine/core-modules/messaging/utils/format-threads.util';
+import { TwentyORMManager } from 'src/engine/twenty-orm/twenty-orm.manager';
+import { PersonWorkspaceEntity } from 'src/modules/person/standard-objects/person.workspace-entity';
+
+@Injectable()
+export class GetMessagesService {
+  constructor(
+    private readonly twentyORMManager: TwentyORMManager,
+    private readonly timelineMessagingService: TimelineMessagingService,
+  ) {}
+
+  async getMessagesFromPersonIds(
+    workspaceMemberId: string,
+    personIds: string[],
+    page = 1,
+    pageSize: number = TIMELINE_THREADS_DEFAULT_PAGE_SIZE,
+  ): Promise<TimelineThreadsWithTotal> {
+    const offset = (page - 1) * pageSize;
+
+    const { messageThreads, totalNumberOfThreads } =
+      await this.timelineMessagingService.getAndCountMessageThreads(
+        personIds,
+        offset,
+        pageSize,
+      );
+
+    if (!messageThreads) {
+      return {
+        totalNumberOfThreads: 0,
+        timelineThreads: [],
+      };
+    }
+
+    const messageThreadIds = messageThreads.map(
+      (messageThread) => messageThread.id,
+    );
+
+    const threadParticipantsByThreadId =
+      await this.timelineMessagingService.getThreadParticipantsByThreadId(
+        messageThreadIds,
+      );
+
+    const threadVisibilityByThreadId =
+      await this.timelineMessagingService.getThreadVisibilityByThreadId(
+        messageThreadIds,
+        workspaceMemberId,
+      );
+
+    return {
+      totalNumberOfThreads,
+      timelineThreads: formatThreads(
+        messageThreads,
+        threadParticipantsByThreadId,
+        threadVisibilityByThreadId,
+      ),
+    };
+  }
+
+  async getMessagesFromCompanyId(
+    workspaceMemberId: string,
+    companyId: string,
+    page = 1,
+    pageSize: number = TIMELINE_THREADS_DEFAULT_PAGE_SIZE,
+  ): Promise<TimelineThreadsWithTotal> {
+    const personRepository =
+      await this.twentyORMManager.getRepository<PersonWorkspaceEntity>(
+        'person',
+      );
+    const personIds = (
+      await personRepository.find({
+        where: {
+          companyId,
+        },
+        select: {
+          id: true,
+        },
+      })
+    ).map((person) => person.id);
+
+    if (personIds.length === 0) {
+      return {
+        totalNumberOfThreads: 0,
+        timelineThreads: [],
+      };
+    }
+
+    const messageThreads = await this.getMessagesFromPersonIds(
+      workspaceMemberId,
+      personIds,
+      page,
+      pageSize,
+    );
+
+    return messageThreads;
+  }
+}
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/services/timeline-messaging.service.ts b/packages/twenty-server/src/engine/core-modules/messaging/services/timeline-messaging.service.ts
new file mode 100644
index 000000000000..87a24166b5b6
--- /dev/null
+++ b/packages/twenty-server/src/engine/core-modules/messaging/services/timeline-messaging.service.ts
@@ -0,0 +1,259 @@
+import { Injectable } from '@nestjs/common';
+
+import { Any, Not } from 'typeorm';
+
+import { TimelineThread } from 'src/engine/core-modules/messaging/dtos/timeline-thread.dto';
+import { TwentyORMManager } from 'src/engine/twenty-orm/twenty-orm.manager';
+import { MessageChannelVisibility } from 'src/modules/messaging/common/standard-objects/message-channel.workspace-entity';
+import { MessageParticipantWorkspaceEntity } from 'src/modules/messaging/common/standard-objects/message-participant.workspace-entity';
+import { MessageThreadWorkspaceEntity } from 'src/modules/messaging/common/standard-objects/message-thread.workspace-entity';
+
+@Injectable()
+export class TimelineMessagingService {
+  constructor(private readonly twentyORMManager: TwentyORMManager) {}
+
+  public async getAndCountMessageThreads(
+    personIds: string[],
+    offset: number,
+    pageSize: number,
+  ): Promise<{
+    messageThreads: Omit<
+      TimelineThread,
+      | 'firstParticipant'
+      | 'lastTwoParticipants'
+      | 'participantCount'
+      | 'read'
+      | 'visibility'
+    >[];
+    totalNumberOfThreads: number;
+  }> {
+    const messageThreadRepository =
+      await this.twentyORMManager.getRepository<MessageThreadWorkspaceEntity>(
+        'messageThread',
+      );
+
+    const [messageThreadIds, totalNumberOfThreads] =
+      await messageThreadRepository.findAndCount({
+        select: {
+          id: true,
+        },
+        where: {
+          messages: {
+            messageParticipants: {
+              personId: Any(personIds),
+            },
+          },
+        },
+        skip: offset,
+        take: pageSize,
+      });
+
+    const messageThreads = await messageThreadRepository.find({
+      select: {
+        id: true,
+      },
+      where: {
+        id: Any(messageThreadIds.map((thread) => thread.id)),
+      },
+      order: {
+        messages: {
+          receivedAt: 'DESC',
+        },
+      },
+      relations: ['messages'],
+    });
+
+    return {
+      messageThreads: messageThreads.map((messageThread) => {
+        const lastMessage = messageThread.messages[0];
+        const firstMessage =
+          messageThread.messages[messageThread.messages.length - 1];
+
+        return {
+          id: messageThread.id,
+          subject: firstMessage.subject,
+          lastMessageBody: lastMessage.text,
+          lastMessageReceivedAt: lastMessage.receivedAt ?? new Date(),
+          numberOfMessagesInThread: messageThread.messages.length,
+        };
+      }),
+      totalNumberOfThreads,
+    };
+  }
+
+  public async getThreadParticipantsByThreadId(
+    messageThreadIds: string[],
+  ): Promise<{
+    [key: string]: MessageParticipantWorkspaceEntity[];
+  }> {
+    const messageParticipantRepository =
+      await this.twentyORMManager.getRepository<MessageParticipantWorkspaceEntity>(
+        'messageParticipant',
+      );
+    const threadParticipants = await messageParticipantRepository
+      .createQueryBuilder()
+      .select('messageParticipant')
+      .addSelect('message.messageThreadId')
+      .addSelect('message.receivedAt')
+      .leftJoinAndSelect('messageParticipant.person', 'person')
+      .leftJoinAndSelect(
+        'messageParticipant.workspaceMember',
+        'workspaceMember',
+      )
+      .leftJoin('messageParticipant.message', 'message')
+      .where('message.messageThreadId = ANY(:messageThreadIds)', {
+        messageThreadIds,
+      })
+      .andWhere('messageParticipant.role = :role', { role: 'from' })
+      .orderBy('message.messageThreadId')
+      .distinctOn(['message.messageThreadId', 'messageParticipant.handle'])
+      .getMany();
+
+    // This is because subqueries are not handled by twentyORM
+    const orderedThreadParticipants = threadParticipants.sort(
+      (a, b) =>
+        (a.message.receivedAt ?? new Date()).getTime() -
+        (b.message.receivedAt ?? new Date()).getTime(),
+    );
+
+    // This is because composite fields are not handled correctly by the ORM
+    const threadParticipantsWithCompositeFields = orderedThreadParticipants.map(
+      (threadParticipant) => ({
+        ...threadParticipant,
+        person: {
+          id: threadParticipant.person?.id,
+          name: {
+            //eslint-disable-next-line
+            //@ts-ignore
+            firstName: threadParticipant.person?.nameFirstName,
+            //eslint-disable-next-line
+            //@ts-ignore
+            lastName: threadParticipant.person?.nameLastName,
+          },
+          avatarUrl: threadParticipant.person?.avatarUrl,
+        },
+        workspaceMember: {
+          id: threadParticipant.workspaceMember?.id,
+          name: {
+            //eslint-disable-next-line
+            //@ts-ignore
+            firstName: threadParticipant.workspaceMember?.nameFirstName,
+            //eslint-disable-next-line
+            //@ts-ignore
+            lastName: threadParticipant.workspaceMember?.nameLastName,
+          },
+          avatarUrl: threadParticipant.workspaceMember?.avatarUrl,
+        },
+      }),
+    );
+
+    return threadParticipantsWithCompositeFields.reduce(
+      (threadParticipantsAcc, threadParticipant) => {
+        if (!threadParticipant.message.messageThreadId)
+          return threadParticipantsAcc;
+
+        if (!threadParticipantsAcc[threadParticipant.message.messageThreadId])
+          threadParticipantsAcc[threadParticipant.message.messageThreadId] = [];
+
+        threadParticipantsAcc[threadParticipant.message.messageThreadId].push(
+          threadParticipant,
+        );
+
+        return threadParticipantsAcc;
+      },
+      {},
+    );
+  }
+
+  public async getThreadVisibilityByThreadId(
+    messageThreadIds: string[],
+    workspaceMemberId: string,
+  ): Promise<{
+    [key: string]: MessageChannelVisibility;
+  }> {
+    const messageThreadRepository =
+      await this.twentyORMManager.getRepository<MessageThreadWorkspaceEntity>(
+        'messageThread',
+      );
+
+    const threadsWithoutWorkspaceMember = await messageThreadRepository.find({
+      select: {
+        id: true,
+      },
+      where: {
+        id: Any(messageThreadIds),
+        messages: {
+          messageChannelMessageAssociations: {
+            messageChannel: {
+              connectedAccount: {
+                accountOwnerId: Not(workspaceMemberId),
+              },
+            },
+          },
+        },
+      },
+    });
+
+    const threadIdsWithoutWorkspaceMember = threadsWithoutWorkspaceMember.map(
+      (thread) => thread.id,
+    );
+
+    const threadVisibility = await messageThreadRepository
+      .createQueryBuilder()
+      .select('messageThread.id', 'id')
+      .addSelect('messageChannel.visibility', 'visibility')
+      .leftJoin('messageThread.messages', 'message')
+      .leftJoin(
+        'message.messageChannelMessageAssociations',
+        'messageChannelMessageAssociation',
+      )
+      .leftJoin(
+        'messageChannelMessageAssociation.messageChannel',
+        'messageChannel',
+      )
+      .where('messageThread.id = ANY(:messageThreadIds)', {
+        messageThreadIds: threadIdsWithoutWorkspaceMember,
+      })
+      .getRawMany();
+
+    const visibilityValues = Object.values(MessageChannelVisibility);
+
+    const threadVisibilityByThreadIdForWhichWorkspaceMemberIsNotInParticipants:
+      | {
+          [key: string]: MessageChannelVisibility;
+        }
+      | undefined = threadVisibility?.reduce(
+      (threadVisibilityAcc, threadVisibility) => {
+        threadVisibilityAcc[threadVisibility.id] =
+          visibilityValues[
+            Math.max(
+              visibilityValues.indexOf(threadVisibility.visibility),
+              visibilityValues.indexOf(
+                threadVisibilityAcc[threadVisibility.id] ??
+                  MessageChannelVisibility.METADATA,
+              ),
+            )
+          ];
+
+        return threadVisibilityAcc;
+      },
+      {},
+    );
+
+    const threadVisibilityByThreadId: {
+      [key: string]: MessageChannelVisibility;
+    } = messageThreadIds.reduce((threadVisibilityAcc, messageThreadId) => {
+      // If the workspace member is not in the participants of the thread, use the visibility value from the query
+      threadVisibilityAcc[messageThreadId] =
+        threadIdsWithoutWorkspaceMember.includes(messageThreadId)
+          ? (threadVisibilityByThreadIdForWhichWorkspaceMemberIsNotInParticipants?.[
+              messageThreadId
+            ] ?? MessageChannelVisibility.METADATA)
+          : MessageChannelVisibility.SHARE_EVERYTHING;
+
+      return threadVisibilityAcc;
+    }, {});
+
+    return threadVisibilityByThreadId;
+  }
+}
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.module.ts b/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.module.ts
index 275f7f0df151..f34f1c4e4476 100644
--- a/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.module.ts
+++ b/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.module.ts
@@ -1,12 +1,17 @@
 import { Module } from '@nestjs/common';
 
+import { GetMessagesService } from 'src/engine/core-modules/messaging/services/get-messages.service';
+import { TimelineMessagingService } from 'src/engine/core-modules/messaging/services/timeline-messaging.service';
 import { TimelineMessagingResolver } from 'src/engine/core-modules/messaging/timeline-messaging.resolver';
-import { TimelineMessagingService } from 'src/engine/core-modules/messaging/timeline-messaging.service';
-import { WorkspaceDataSourceModule } from 'src/engine/workspace-datasource/workspace-datasource.module';
 import { UserModule } from 'src/engine/core-modules/user/user.module';
+import { WorkspaceDataSourceModule } from 'src/engine/workspace-datasource/workspace-datasource.module';
 @Module({
   imports: [WorkspaceDataSourceModule, UserModule],
   exports: [],
-  providers: [TimelineMessagingResolver, TimelineMessagingService],
+  providers: [
+    TimelineMessagingResolver,
+    TimelineMessagingService,
+    GetMessagesService,
+  ],
 })
 export class TimelineMessagingModule {}
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.resolver.ts b/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.resolver.ts
index 6ed83dc9d215..33a3a3caeba4 100644
--- a/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.resolver.ts
+++ b/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.resolver.ts
@@ -1,18 +1,16 @@
-import { Args, Query, Resolver, Int, ArgsType, Field } from '@nestjs/graphql';
 import { UseGuards } from '@nestjs/common';
+import { Args, ArgsType, Field, Int, Query, Resolver } from '@nestjs/graphql';
 
 import { Max } from 'class-validator';
 
-import { JwtAuthGuard } from 'src/engine/guards/jwt.auth.guard';
-import { Workspace } from 'src/engine/core-modules/workspace/workspace.entity';
-import { AuthWorkspace } from 'src/engine/decorators/auth/auth-workspace.decorator';
-import { TimelineMessagingService } from 'src/engine/core-modules/messaging/timeline-messaging.service';
+import { UUIDScalarType } from 'src/engine/api/graphql/workspace-schema-builder/graphql-types/scalars';
 import { TIMELINE_THREADS_MAX_PAGE_SIZE } from 'src/engine/core-modules/messaging/constants/messaging.constants';
 import { TimelineThreadsWithTotal } from 'src/engine/core-modules/messaging/dtos/timeline-threads-with-total.dto';
-import { AuthUser } from 'src/engine/decorators/auth/auth-user.decorator';
+import { GetMessagesService } from 'src/engine/core-modules/messaging/services/get-messages.service';
 import { UserService } from 'src/engine/core-modules/user/services/user.service';
 import { User } from 'src/engine/core-modules/user/user.entity';
-import { UUIDScalarType } from 'src/engine/api/graphql/workspace-schema-builder/graphql-types/scalars';
+import { AuthUser } from 'src/engine/decorators/auth/auth-user.decorator';
+import { JwtAuthGuard } from 'src/engine/guards/jwt.auth.guard';
 
 @ArgsType()
 class GetTimelineThreadsFromPersonIdArgs {
@@ -44,13 +42,12 @@ class GetTimelineThreadsFromCompanyIdArgs {
 @Resolver(() => TimelineThreadsWithTotal)
 export class TimelineMessagingResolver {
   constructor(
-    private readonly timelineMessagingService: TimelineMessagingService,
+    private readonly getMessagesFromPersonIdsService: GetMessagesService,
     private readonly userService: UserService,
   ) {}
 
   @Query(() => TimelineThreadsWithTotal)
   async getTimelineThreadsFromPersonId(
-    @AuthWorkspace() { id: workspaceId }: Workspace,
     @AuthUser() user: User,
     @Args() { personId, page, pageSize }: GetTimelineThreadsFromPersonIdArgs,
   ) {
@@ -61,9 +58,8 @@ export class TimelineMessagingResolver {
     }
 
     const timelineThreads =
-      await this.timelineMessagingService.getMessagesFromPersonIds(
+      await this.getMessagesFromPersonIdsService.getMessagesFromPersonIds(
         workspaceMember.id,
-        workspaceId,
         [personId],
         page,
         pageSize,
@@ -74,7 +70,6 @@ export class TimelineMessagingResolver {
 
   @Query(() => TimelineThreadsWithTotal)
   async getTimelineThreadsFromCompanyId(
-    @AuthWorkspace() { id: workspaceId }: Workspace,
     @AuthUser() user: User,
     @Args() { companyId, page, pageSize }: GetTimelineThreadsFromCompanyIdArgs,
   ) {
@@ -85,9 +80,8 @@ export class TimelineMessagingResolver {
     }
 
     const timelineThreads =
-      await this.timelineMessagingService.getMessagesFromCompanyId(
+      await this.getMessagesFromPersonIdsService.getMessagesFromCompanyId(
         workspaceMember.id,
-        workspaceId,
         companyId,
         page,
         pageSize,
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.service.ts b/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.service.ts
deleted file mode 100644
index 5982b0d3148d..000000000000
--- a/packages/twenty-server/src/engine/core-modules/messaging/timeline-messaging.service.ts
+++ /dev/null
@@ -1,525 +0,0 @@
-import { Injectable } from '@nestjs/common';
-
-import { TIMELINE_THREADS_DEFAULT_PAGE_SIZE } from 'src/engine/core-modules/messaging/constants/messaging.constants';
-import { TimelineThreadsWithTotal } from 'src/engine/core-modules/messaging/dtos/timeline-threads-with-total.dto';
-import { WorkspaceDataSourceService } from 'src/engine/workspace-datasource/workspace-datasource.service';
-import { MessageChannelVisibility } from 'src/modules/messaging/common/standard-objects/message-channel.workspace-entity';
-
-type TimelineThreadParticipant = {
-  personId: string;
-  workspaceMemberId: string;
-  firstName: string;
-  lastName: string;
-  displayName: string;
-  avatarUrl: string;
-  handle: string;
-};
-
-@Injectable()
-export class TimelineMessagingService {
-  constructor(
-    private readonly workspaceDataSourceService: WorkspaceDataSourceService,
-  ) {}
-
-  async getMessagesFromPersonIds(
-    workspaceMemberId: string,
-    workspaceId: string,
-    personIds: string[],
-    page = 1,
-    pageSize: number = TIMELINE_THREADS_DEFAULT_PAGE_SIZE,
-  ): Promise<TimelineThreadsWithTotal> {
-    const offset = (page - 1) * pageSize;
-
-    const dataSourceSchema =
-      this.workspaceDataSourceService.getSchemaName(workspaceId);
-
-    const messageThreads:
-      | {
-          id: string;
-          lastMessageReceivedAt: Date;
-          lastMessageId: string;
-          lastMessageBody: string;
-          rowNumber: number;
-        }[]
-      | undefined = await this.workspaceDataSourceService.executeRawQuery(
-      `
-      SELECT id,
-      "lastMessageReceivedAt",
-      "lastMessageId",
-      "lastMessageBody"
-      FROM
-      (SELECT message."messageThreadId" AS id,
-      MAX(message."receivedAt") AS "lastMessageReceivedAt",
-      message.id AS "lastMessageId",
-      message.text AS "lastMessageBody",
-      ROW_NUMBER() OVER (PARTITION BY message."messageThreadId" ORDER BY MAX(message."receivedAt") DESC) AS "rowNumber"
-      FROM
-          ${dataSourceSchema}."message" message 
-      LEFT JOIN
-          ${dataSourceSchema}."messageParticipant" "messageParticipant" ON "messageParticipant"."messageId" = message.id
-      WHERE
-          "messageParticipant"."personId" = ANY($1)
-      AND EXISTS (
-          SELECT 1
-          FROM ${dataSourceSchema}."messageChannelMessageAssociation" mcma
-          WHERE mcma."messageId" = message.id
-      )
-      GROUP BY
-          message."messageThreadId",
-          message.id
-      ORDER BY
-          message."receivedAt" DESC
-      ) AS "messageThreads"
-      WHERE
-      "rowNumber" = 1
-      LIMIT $2
-      OFFSET $3
-        `,
-      [personIds, pageSize, offset],
-      workspaceId,
-    );
-
-    if (!messageThreads) {
-      return {
-        totalNumberOfThreads: 0,
-        timelineThreads: [],
-      };
-    }
-
-    const messageThreadIds = messageThreads.map(
-      (messageThread) => messageThread.id,
-    );
-
-    const threadSubjects:
-      | {
-          id: string;
-          subject: string;
-        }[]
-      | undefined = await this.workspaceDataSourceService.executeRawQuery(
-      `
-      SELECT *
-      FROM
-      (SELECT
-        message."messageThreadId" AS id,
-        message.subject,
-        ROW_NUMBER() OVER (PARTITION BY message."messageThreadId" ORDER BY MAX(message."receivedAt") ASC) AS "rowNumber"
-      FROM
-          ${dataSourceSchema}."message" message
-      WHERE
-          message."messageThreadId" = ANY($1)
-      GROUP BY
-          message."messageThreadId",
-          message.id
-      ORDER BY
-          message."receivedAt" DESC
-      ) AS "messageThreads"
-      WHERE
-      "rowNumber" = 1
-      `,
-      [messageThreadIds],
-      workspaceId,
-    );
-
-    const numberOfMessagesInThread:
-      | {
-          id: string;
-          numberOfMessagesInThread: number;
-        }[]
-      | undefined = await this.workspaceDataSourceService.executeRawQuery(
-      `
-      SELECT
-          message."messageThreadId" AS id,
-          COUNT(message.id) AS "numberOfMessagesInThread"
-      FROM
-          ${dataSourceSchema}."message" message
-      WHERE
-          message."messageThreadId" = ANY($1)
-      AND EXISTS (
-          SELECT 1
-          FROM ${dataSourceSchema}."messageChannelMessageAssociation" mcma
-          WHERE mcma."messageId" = message.id
-      )
-      GROUP BY
-          message."messageThreadId"
-      `,
-      [messageThreadIds],
-      workspaceId,
-    );
-
-    const messageThreadsByMessageThreadId: {
-      [key: string]: {
-        id: string;
-        lastMessageReceivedAt: Date;
-        lastMessageBody: string;
-      };
-    } = messageThreads.reduce((messageThreadAcc, messageThread) => {
-      messageThreadAcc[messageThread.id] = messageThread;
-
-      return messageThreadAcc;
-    }, {});
-
-    const subjectsByMessageThreadId:
-      | {
-          [key: string]: {
-            id: string;
-            subject: string;
-          };
-        }
-      | undefined = threadSubjects?.reduce(
-      (threadSubjectAcc, threadSubject) => {
-        threadSubjectAcc[threadSubject.id] = threadSubject;
-
-        return threadSubjectAcc;
-      },
-      {},
-    );
-
-    const numberOfMessagesByMessageThreadId:
-      | {
-          [key: string]: {
-            id: string;
-            numberOfMessagesInThread: number;
-          };
-        }
-      | undefined = numberOfMessagesInThread?.reduce(
-      (numberOfMessagesAcc, numberOfMessages) => {
-        numberOfMessagesAcc[numberOfMessages.id] = numberOfMessages;
-
-        return numberOfMessagesAcc;
-      },
-      {},
-    );
-
-    const threadMessagesParticipants:
-      | {
-          id: string;
-          messageId: string;
-          receivedAt: Date;
-          body: string;
-          subject: string;
-          role: string;
-          personId: string;
-          workspaceMemberId: string;
-          handle: string;
-          personFirstName: string;
-          personLastName: string;
-          personAvatarUrl: string;
-          workspaceMemberFirstName: string;
-          workspaceMemberLastName: string;
-          workspaceMemberAvatarUrl: string;
-          messageDisplayName: string;
-        }[]
-      | undefined = await this.workspaceDataSourceService.executeRawQuery(
-      `
-      SELECT DISTINCT message."messageThreadId" AS id,
-        message.id AS "messageId",
-        message."receivedAt",
-        message.text,
-        message."subject",
-        "messageParticipant"."role",
-        "messageParticipant"."personId",
-        "messageParticipant"."workspaceMemberId",
-        "messageParticipant".handle,
-        "person"."nameFirstName" as "personFirstName",
-        "person"."nameLastName" as "personLastName",
-        "person"."avatarUrl" as "personAvatarUrl",
-        "workspaceMember"."nameFirstName" as "workspaceMemberFirstName",
-        "workspaceMember"."nameLastName" as "workspaceMemberLastName",
-        "workspaceMember"."avatarUrl" as "workspaceMemberAvatarUrl",
-        "messageParticipant"."displayName" as "messageDisplayName"
-        FROM
-            ${dataSourceSchema}."message" message
-        LEFT JOIN
-            ${dataSourceSchema}."messageParticipant" "messageParticipant" ON "messageParticipant"."messageId" = message.id
-        LEFT JOIN
-            ${dataSourceSchema}."person" person ON person."id" = "messageParticipant"."personId"
-        LEFT JOIN
-            ${dataSourceSchema}."workspaceMember" "workspaceMember" ON "workspaceMember".id = "messageParticipant"."workspaceMemberId"
-        WHERE
-            message."messageThreadId" = ANY($1)
-        ORDER BY
-            message."receivedAt" DESC
-        `,
-      [messageThreadIds],
-      workspaceId,
-    );
-
-    const threadMessagesFromActiveParticipants =
-      threadMessagesParticipants?.filter(
-        (threadMessage) => threadMessage.role === 'from',
-      );
-
-    const totalNumberOfThreads =
-      await this.workspaceDataSourceService.executeRawQuery(
-        `
-      SELECT COUNT(DISTINCT message."messageThreadId")
-      FROM
-          ${dataSourceSchema}."message" message 
-      LEFT JOIN
-          ${dataSourceSchema}."messageParticipant" "messageParticipant" ON "messageParticipant"."messageId" = message.id
-      WHERE
-          "messageParticipant"."personId" = ANY($1)
-      AND EXISTS (
-          SELECT 1
-          FROM ${dataSourceSchema}."messageChannelMessageAssociation" mcma
-          WHERE mcma."messageId" = message.id
-      )
-      `,
-        [personIds],
-        workspaceId,
-      );
-
-    const threadActiveParticipantsByThreadId: {
-      [key: string]: TimelineThreadParticipant[];
-    } = messageThreadIds.reduce((messageThreadIdAcc, messageThreadId) => {
-      const threadMessages = threadMessagesFromActiveParticipants?.filter(
-        (threadMessage) => threadMessage.id === messageThreadId,
-      );
-
-      const threadActiveParticipants = threadMessages?.reduce(
-        (
-          threadMessageAcc,
-          threadMessage,
-        ): {
-          [key: string]: TimelineThreadParticipant;
-        } => {
-          const threadParticipant = threadMessageAcc[threadMessage.handle];
-
-          const firstName =
-            threadMessage.personFirstName ||
-            threadMessage.workspaceMemberFirstName ||
-            '';
-
-          const lastName =
-            threadMessage.personLastName ||
-            threadMessage.workspaceMemberLastName ||
-            '';
-
-          const displayName =
-            firstName ||
-            threadMessage.messageDisplayName ||
-            threadMessage.handle;
-
-          if (!threadParticipant) {
-            threadMessageAcc[threadMessage.handle] = {
-              personId: threadMessage.personId,
-              workspaceMemberId: threadMessage.workspaceMemberId,
-              firstName,
-              lastName,
-              displayName,
-              avatarUrl:
-                threadMessage.personAvatarUrl ??
-                threadMessage.workspaceMemberAvatarUrl ??
-                '',
-              handle: threadMessage.handle,
-            };
-          }
-
-          return threadMessageAcc;
-        },
-        {},
-      );
-
-      messageThreadIdAcc[messageThreadId] = threadActiveParticipants
-        ? Object.values(threadActiveParticipants)
-        : [];
-
-      return messageThreadIdAcc;
-    }, {});
-
-    const messageThreadIdsForWhichWorkspaceMemberIsNotInParticipants =
-      messageThreadIds.reduce(
-        (
-          messageThreadIdsForWhichWorkspaceMemberIsInNotParticipantsAcc: string[],
-          messageThreadId,
-        ) => {
-          const threadMessagesWithWorkspaceMemberInParticipants =
-            threadMessagesParticipants?.filter(
-              (threadMessage) =>
-                threadMessage.id === messageThreadId &&
-                threadMessage.workspaceMemberId === workspaceMemberId,
-            ) ?? [];
-
-          if (threadMessagesWithWorkspaceMemberInParticipants.length === 0)
-            messageThreadIdsForWhichWorkspaceMemberIsInNotParticipantsAcc.push(
-              messageThreadId,
-            );
-
-          return messageThreadIdsForWhichWorkspaceMemberIsInNotParticipantsAcc;
-        },
-        [],
-      );
-
-    const threadVisibility:
-      | {
-          id: string;
-          visibility: MessageChannelVisibility;
-        }[]
-      | undefined = await this.workspaceDataSourceService.executeRawQuery(
-      `
-      SELECT
-          message."messageThreadId" AS id,
-          "messageChannel".visibility
-      FROM
-          ${dataSourceSchema}."message" message
-      LEFT JOIN
-          ${dataSourceSchema}."messageChannelMessageAssociation" "messageChannelMessageAssociation" ON "messageChannelMessageAssociation"."messageId" = message.id
-      LEFT JOIN
-          ${dataSourceSchema}."messageChannel" "messageChannel" ON "messageChannel".id = "messageChannelMessageAssociation"."messageChannelId"
-      WHERE
-          message."messageThreadId" = ANY($1)
-      `,
-      [messageThreadIdsForWhichWorkspaceMemberIsNotInParticipants],
-      workspaceId,
-    );
-
-    const visibilityValues = Object.values(MessageChannelVisibility);
-
-    const threadVisibilityByThreadIdForWhichWorkspaceMemberIsNotInParticipants:
-      | {
-          [key: string]: MessageChannelVisibility;
-        }
-      | undefined = threadVisibility?.reduce(
-      (threadVisibilityAcc, threadVisibility) => {
-        threadVisibilityAcc[threadVisibility.id] =
-          visibilityValues[
-            Math.max(
-              visibilityValues.indexOf(threadVisibility.visibility),
-              visibilityValues.indexOf(
-                threadVisibilityAcc[threadVisibility.id] ??
-                  MessageChannelVisibility.METADATA,
-              ),
-            )
-          ];
-
-        return threadVisibilityAcc;
-      },
-      {},
-    );
-
-    const threadVisibilityByThreadId: {
-      [key: string]: MessageChannelVisibility;
-    } = messageThreadIds.reduce((threadVisibilityAcc, messageThreadId) => {
-      // If the workspace member is not in the participants of the thread, use the visibility value from the query
-      threadVisibilityAcc[messageThreadId] =
-        messageThreadIdsForWhichWorkspaceMemberIsNotInParticipants.includes(
-          messageThreadId,
-        )
-          ? (threadVisibilityByThreadIdForWhichWorkspaceMemberIsNotInParticipants?.[
-              messageThreadId
-            ] ?? MessageChannelVisibility.METADATA)
-          : MessageChannelVisibility.SHARE_EVERYTHING;
-
-      return threadVisibilityAcc;
-    }, {});
-
-    const timelineThreads = messageThreadIds.map((messageThreadId) => {
-      const threadActiveParticipants =
-        threadActiveParticipantsByThreadId[messageThreadId];
-
-      const firstParticipant = threadActiveParticipants[0];
-
-      const threadActiveParticipantsWithoutFirstParticipant =
-        threadActiveParticipants.filter(
-          (threadParticipant) =>
-            threadParticipant.handle !== firstParticipant.handle,
-        );
-
-      const lastTwoParticipants: TimelineThreadParticipant[] = [];
-
-      const lastParticipant =
-        threadActiveParticipantsWithoutFirstParticipant.slice(-1)[0];
-
-      if (lastParticipant) {
-        lastTwoParticipants.push(lastParticipant);
-
-        const threadActiveParticipantsWithoutFirstAndLastParticipants =
-          threadActiveParticipantsWithoutFirstParticipant.filter(
-            (threadParticipant) =>
-              threadParticipant.handle !== lastParticipant.handle,
-          );
-
-        if (threadActiveParticipantsWithoutFirstAndLastParticipants.length > 0)
-          lastTwoParticipants.push(
-            threadActiveParticipantsWithoutFirstAndLastParticipants.slice(
-              -1,
-            )[0],
-          );
-      }
-
-      const thread = messageThreadsByMessageThreadId[messageThreadId];
-
-      const threadSubject =
-        subjectsByMessageThreadId?.[messageThreadId].subject ?? '';
-
-      const numberOfMessages =
-        numberOfMessagesByMessageThreadId?.[messageThreadId]
-          .numberOfMessagesInThread ?? 1;
-
-      return {
-        id: messageThreadId,
-        read: true,
-        firstParticipant,
-        lastTwoParticipants,
-        lastMessageReceivedAt: thread.lastMessageReceivedAt,
-        lastMessageBody: thread.lastMessageBody,
-        visibility:
-          threadVisibilityByThreadId?.[messageThreadId] ??
-          MessageChannelVisibility.METADATA,
-        subject: threadSubject,
-        numberOfMessagesInThread: numberOfMessages,
-        participantCount: threadActiveParticipants.length,
-      };
-    });
-
-    return {
-      totalNumberOfThreads: totalNumberOfThreads[0]?.count ?? 0,
-      timelineThreads,
-    };
-  }
-
-  async getMessagesFromCompanyId(
-    workspaceMemberId: string,
-    workspaceId: string,
-    companyId: string,
-    page = 1,
-    pageSize: number = TIMELINE_THREADS_DEFAULT_PAGE_SIZE,
-  ): Promise<TimelineThreadsWithTotal> {
-    const dataSourceSchema =
-      this.workspaceDataSourceService.getSchemaName(workspaceId);
-
-    const personIds = await this.workspaceDataSourceService.executeRawQuery(
-      `
-        SELECT 
-            p."id"
-        FROM
-            ${dataSourceSchema}."person" p
-        WHERE
-            p."companyId" = $1
-        `,
-      [companyId],
-      workspaceId,
-    );
-
-    if (!personIds) {
-      return {
-        totalNumberOfThreads: 0,
-        timelineThreads: [],
-      };
-    }
-
-    const formattedPersonIds = personIds.map(
-      (personId: { id: string }) => personId.id,
-    );
-
-    const messageThreads = await this.getMessagesFromPersonIds(
-      workspaceMemberId,
-      workspaceId,
-      formattedPersonIds,
-      page,
-      pageSize,
-    );
-
-    return messageThreads;
-  }
-}
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/utils/extract-participant-summary.util.ts b/packages/twenty-server/src/engine/core-modules/messaging/utils/extract-participant-summary.util.ts
new file mode 100644
index 000000000000..46d8b18f78b2
--- /dev/null
+++ b/packages/twenty-server/src/engine/core-modules/messaging/utils/extract-participant-summary.util.ts
@@ -0,0 +1,54 @@
+import { TimelineThreadParticipant } from 'src/engine/core-modules/messaging/dtos/timeline-thread-participant.dto';
+import { filterActiveParticipants } from 'src/engine/core-modules/messaging/utils/filter-active-participants.util';
+import { formatThreadParticipant } from 'src/engine/core-modules/messaging/utils/format-thread-participant.util';
+import { MessageParticipantWorkspaceEntity } from 'src/modules/messaging/common/standard-objects/message-participant.workspace-entity';
+
+export const extractParticipantSummary = (
+  messageParticipants: MessageParticipantWorkspaceEntity[],
+): {
+  firstParticipant: TimelineThreadParticipant;
+  lastTwoParticipants: TimelineThreadParticipant[];
+  participantCount: number;
+} => {
+  const activeMessageParticipants =
+    filterActiveParticipants(messageParticipants);
+
+  const firstParticipant = formatThreadParticipant(
+    activeMessageParticipants[0],
+  );
+
+  const activeMessageParticipantsWithoutFirstParticipant =
+    activeMessageParticipants.filter(
+      (threadParticipant) =>
+        threadParticipant.handle !== firstParticipant.handle,
+    );
+
+  const lastTwoParticipants: TimelineThreadParticipant[] = [];
+
+  const lastParticipant =
+    activeMessageParticipantsWithoutFirstParticipant.slice(-1)[0];
+
+  if (lastParticipant) {
+    lastTwoParticipants.push(formatThreadParticipant(lastParticipant));
+
+    const activeMessageParticipantsWithoutFirstAndLastParticipants =
+      activeMessageParticipantsWithoutFirstParticipant.filter(
+        (threadParticipant) =>
+          threadParticipant.handle !== lastParticipant.handle,
+      );
+
+    if (activeMessageParticipantsWithoutFirstAndLastParticipants.length > 0) {
+      lastTwoParticipants.push(
+        formatThreadParticipant(
+          activeMessageParticipantsWithoutFirstAndLastParticipants.slice(-1)[0],
+        ),
+      );
+    }
+  }
+
+  return {
+    firstParticipant,
+    lastTwoParticipants,
+    participantCount: activeMessageParticipants.length,
+  };
+};
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/utils/filter-active-participants.util.ts b/packages/twenty-server/src/engine/core-modules/messaging/utils/filter-active-participants.util.ts
new file mode 100644
index 000000000000..7e743b6a5eb7
--- /dev/null
+++ b/packages/twenty-server/src/engine/core-modules/messaging/utils/filter-active-participants.util.ts
@@ -0,0 +1,7 @@
+import { MessageParticipantWorkspaceEntity } from 'src/modules/messaging/common/standard-objects/message-participant.workspace-entity';
+
+export const filterActiveParticipants = (
+  participants: MessageParticipantWorkspaceEntity[],
+): MessageParticipantWorkspaceEntity[] => {
+  return participants.filter((participant) => participant.role === 'from');
+};
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/utils/format-thread-participant.util.ts b/packages/twenty-server/src/engine/core-modules/messaging/utils/format-thread-participant.util.ts
new file mode 100644
index 000000000000..4cf5f5ead1fb
--- /dev/null
+++ b/packages/twenty-server/src/engine/core-modules/messaging/utils/format-thread-participant.util.ts
@@ -0,0 +1,30 @@
+import { TimelineThreadParticipant } from 'src/engine/core-modules/messaging/dtos/timeline-thread-participant.dto';
+import { MessageParticipantWorkspaceEntity } from 'src/modules/messaging/common/standard-objects/message-participant.workspace-entity';
+
+export const formatThreadParticipant = (
+  threadParticipant: MessageParticipantWorkspaceEntity,
+): TimelineThreadParticipant => ({
+  personId: threadParticipant.personId,
+  workspaceMemberId: threadParticipant.workspaceMemberId,
+  firstName:
+    threadParticipant.person?.name?.firstName ||
+    threadParticipant.workspaceMember?.name.firstName ||
+    '',
+  lastName:
+    threadParticipant.person?.name?.lastName ||
+    threadParticipant.workspaceMember?.name.lastName ||
+    '',
+  displayName:
+    threadParticipant.person?.name?.firstName ||
+    threadParticipant.person?.name?.lastName ||
+    threadParticipant.workspaceMember?.name.firstName ||
+    threadParticipant.workspaceMember?.name.lastName ||
+    threadParticipant.displayName ||
+    threadParticipant.handle ||
+    '',
+  avatarUrl:
+    threadParticipant.person?.avatarUrl ||
+    threadParticipant.workspaceMember?.avatarUrl ||
+    '',
+  handle: threadParticipant.handle,
+});
diff --git a/packages/twenty-server/src/engine/core-modules/messaging/utils/format-threads.util.ts b/packages/twenty-server/src/engine/core-modules/messaging/utils/format-threads.util.ts
new file mode 100644
index 000000000000..a141cbca12ea
--- /dev/null
+++ b/packages/twenty-server/src/engine/core-modules/messaging/utils/format-threads.util.ts
@@ -0,0 +1,28 @@
+import { TimelineThread } from 'src/engine/core-modules/messaging/dtos/timeline-thread.dto';
+import { extractParticipantSummary } from 'src/engine/core-modules/messaging/utils/extract-participant-summary.util';
+import { MessageChannelVisibility } from 'src/modules/messaging/common/standard-objects/message-channel.workspace-entity';
+import { MessageParticipantWorkspaceEntity } from 'src/modules/messaging/common/standard-objects/message-participant.workspace-entity';
+
+export const formatThreads = (
+  threads: Omit<
+    TimelineThread,
+    | 'firstParticipant'
+    | 'lastTwoParticipants'
+    | 'participantCount'
+    | 'read'
+    | 'visibility'
+  >[],
+  threadParticipantsByThreadId: {
+    [key: string]: MessageParticipantWorkspaceEntity[];
+  },
+  threadVisibilityByThreadId: {
+    [key: string]: MessageChannelVisibility;
+  },
+): TimelineThread[] => {
+  return threads.map((thread) => ({
+    ...thread,
+    ...extractParticipantSummary(threadParticipantsByThreadId[thread.id]),
+    visibility: threadVisibilityByThreadId[thread.id],
+    read: true,
+  }));
+};
diff --git a/packages/twenty-server/src/engine/core-modules/workflow/core-workflow-trigger.module.ts b/packages/twenty-server/src/engine/core-modules/workflow/core-workflow-trigger.module.ts
index 821b31d9d437..76cefa494ab1 100644
--- a/packages/twenty-server/src/engine/core-modules/workflow/core-workflow-trigger.module.ts
+++ b/packages/twenty-server/src/engine/core-modules/workflow/core-workflow-trigger.module.ts
@@ -3,10 +3,10 @@ import { Module } from '@nestjs/common';
 import { WorkflowTriggerResolver } from 'src/engine/core-modules/workflow/workflow-trigger.resolver';
 import { WorkflowCommonModule } from 'src/modules/workflow/common/workflow-common.module';
 import { WorkflowRunnerModule } from 'src/modules/workflow/workflow-runner/workflow-runner.module';
-import { WorkflowTriggerService } from 'src/modules/workflow/workflow-trigger/workflow-trigger.service';
+import { WorkflowTriggerWorkspaceService } from 'src/modules/workflow/workflow-trigger/workflow-trigger.workspace-service';
 
 @Module({
   imports: [WorkflowCommonModule, WorkflowRunnerModule],
-  providers: [WorkflowTriggerService, WorkflowTriggerResolver],
+  providers: [WorkflowTriggerWorkspaceService, WorkflowTriggerResolver],
 })
 export class WorkflowTriggerCoreModule {}
diff --git a/packages/twenty-server/src/engine/core-modules/workflow/workflow-trigger.resolver.ts b/packages/twenty-server/src/engine/core-modules/workflow/workflow-trigger.resolver.ts
index 078ac0d7e3d2..35c8a40882ba 100644
--- a/packages/twenty-server/src/engine/core-modules/workflow/workflow-trigger.resolver.ts
+++ b/packages/twenty-server/src/engine/core-modules/workflow/workflow-trigger.resolver.ts
@@ -4,26 +4,22 @@ import { Args, Mutation, Resolver } from '@nestjs/graphql';
 import { RunWorkflowVersionInput } from 'src/engine/core-modules/workflow/dtos/run-workflow-version-input.dto';
 import { WorkflowTriggerResultDTO } from 'src/engine/core-modules/workflow/dtos/workflow-trigger-result.dto';
 import { workflowTriggerGraphqlApiExceptionHandler } from 'src/engine/core-modules/workflow/utils/workflow-trigger-graphql-api-exception-handler.util';
-import { Workspace } from 'src/engine/core-modules/workspace/workspace.entity';
-import { AuthWorkspace } from 'src/engine/decorators/auth/auth-workspace.decorator';
 import { JwtAuthGuard } from 'src/engine/guards/jwt.auth.guard';
-import { WorkflowTriggerService } from 'src/modules/workflow/workflow-trigger/workflow-trigger.service';
+import { WorkflowTriggerWorkspaceService } from 'src/modules/workflow/workflow-trigger/workflow-trigger.workspace-service';
 
 @UseGuards(JwtAuthGuard)
 @Resolver()
 export class WorkflowTriggerResolver {
   constructor(
-    private readonly workflowTriggerService: WorkflowTriggerService,
+    private readonly workflowTriggerWorkspaceService: WorkflowTriggerWorkspaceService,
   ) {}
 
   @Mutation(() => Boolean)
   async enableWorkflowTrigger(
-    @AuthWorkspace() { id: workspaceId }: Workspace,
     @Args('workflowVersionId') workflowVersionId: string,
   ) {
     try {
-      return await this.workflowTriggerService.enableWorkflowTrigger(
-        workspaceId,
+      return await this.workflowTriggerWorkspaceService.enableWorkflowTrigger(
         workflowVersionId,
       );
     } catch (error) {
@@ -33,13 +29,11 @@ export class WorkflowTriggerResolver {
 
   @Mutation(() => WorkflowTriggerResultDTO)
   async runWorkflowVersion(
-    @AuthWorkspace() { id: workspaceId }: Workspace,
     @Args('input') { workflowVersionId, payload }: RunWorkflowVersionInput,
   ) {
     try {
       return {
-        result: await this.workflowTriggerService.runWorkflowVersion(
-          workspaceId,
+        result: await this.workflowTriggerWorkspaceService.runWorkflowVersion(
           workflowVersionId,
           payload ?? {},
         ),
diff --git a/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type.ts b/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type.ts
index 69c6d256ab45..1efa0eeffff5 100644
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type.ts
@@ -8,6 +8,7 @@ import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/fi
 export enum FieldActorSource {
   EMAIL = 'EMAIL',
   CALENDAR = 'CALENDAR',
+  WORKFLOW = 'WORKFLOW',
   API = 'API',
   IMPORT = 'IMPORT',
   MANUAL = 'MANUAL',
diff --git a/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface.ts b/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface.ts
index 8d805dfe4a03..2eac59ec319a 100644
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface.ts
@@ -20,4 +20,5 @@ export interface ObjectMetadataInterface {
   isAuditLogged: boolean;
   labelIdentifierFieldMetadataId?: string | null;
   imageIdentifierFieldMetadataId?: string | null;
+  isSoftDeletable?: boolean | null;
 }
diff --git a/packages/twenty-server/src/engine/metadata-modules/object-metadata/object-metadata.entity.ts b/packages/twenty-server/src/engine/metadata-modules/object-metadata/object-metadata.entity.ts
index 3d550b02fe5d..ebbb188669b9 100644
--- a/packages/twenty-server/src/engine/metadata-modules/object-metadata/object-metadata.entity.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/object-metadata/object-metadata.entity.ts
@@ -69,6 +69,9 @@ export class ObjectMetadataEntity implements ObjectMetadataInterface {
   @Column({ default: true })
   isAuditLogged: boolean;
 
+  @Column({ nullable: true, type: 'boolean' })
+  isSoftDeletable?: boolean | null;
+
   @Column({ nullable: true, type: 'uuid' })
   labelIdentifierFieldMetadataId?: string | null;
 
diff --git a/packages/twenty-server/src/engine/twenty-orm/base.workspace-entity.ts b/packages/twenty-server/src/engine/twenty-orm/base.workspace-entity.ts
index f7e430a8d6b9..f122f29c47a5 100644
--- a/packages/twenty-server/src/engine/twenty-orm/base.workspace-entity.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/base.workspace-entity.ts
@@ -1,6 +1,7 @@
 import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
 import { WorkspaceField } from 'src/engine/twenty-orm/decorators/workspace-field.decorator';
-import { WorkspaceIsPimaryField } from 'src/engine/twenty-orm/decorators/workspace-is-primary-field.decorator';
+import { WorkspaceIsNullable } from 'src/engine/twenty-orm/decorators/workspace-is-nullable.decorator';
+import { WorkspaceIsPrimaryField } from 'src/engine/twenty-orm/decorators/workspace-is-primary-field.decorator';
 import { WorkspaceIsSystem } from 'src/engine/twenty-orm/decorators/workspace-is-system.decorator';
 import { BASE_OBJECT_STANDARD_FIELD_IDS } from 'src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids';
 
@@ -13,7 +14,7 @@ export abstract class BaseWorkspaceEntity {
     defaultValue: 'uuid',
     icon: 'Icon123',
   })
-  @WorkspaceIsPimaryField()
+  @WorkspaceIsPrimaryField()
   @WorkspaceIsSystem()
   id: string;
 
@@ -25,7 +26,7 @@ export abstract class BaseWorkspaceEntity {
     icon: 'IconCalendar',
     defaultValue: 'now',
   })
-  createdAt: Date;
+  createdAt: string;
 
   @WorkspaceField({
     standardId: BASE_OBJECT_STANDARD_FIELD_IDS.updatedAt,
@@ -35,5 +36,15 @@ export abstract class BaseWorkspaceEntity {
     icon: 'IconCalendarClock',
     defaultValue: 'now',
   })
-  updatedAt: Date;
+  updatedAt: string;
+
+  @WorkspaceField({
+    standardId: BASE_OBJECT_STANDARD_FIELD_IDS.deletedAt,
+    type: FieldMetadataType.DATE_TIME,
+    label: 'Deleted at',
+    description: 'Date when the record was deleted',
+    icon: 'IconCalendarMinus',
+  })
+  @WorkspaceIsNullable()
+  deletedAt?: string | null;
 }
diff --git a/packages/twenty-server/src/engine/twenty-orm/custom.workspace-entity.ts b/packages/twenty-server/src/engine/twenty-orm/custom.workspace-entity.ts
index 5fd099f02531..92085ec61151 100644
--- a/packages/twenty-server/src/engine/twenty-orm/custom.workspace-entity.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/custom.workspace-entity.ts
@@ -8,7 +8,7 @@ import {
   RelationOnDeleteAction,
 } from 'src/engine/metadata-modules/relation-metadata/relation-metadata.entity';
 import { BaseWorkspaceEntity } from 'src/engine/twenty-orm/base.workspace-entity';
-import { WorkspaceCustomObject } from 'src/engine/twenty-orm/decorators/workspace-custom-object.decorator';
+import { WorkspaceCustomEntity } from 'src/engine/twenty-orm/decorators/workspace-custom-entity.decorator';
 import { WorkspaceField } from 'src/engine/twenty-orm/decorators/workspace-field.decorator';
 import { WorkspaceIsNullable } from 'src/engine/twenty-orm/decorators/workspace-is-nullable.decorator';
 import { WorkspaceIsSystem } from 'src/engine/twenty-orm/decorators/workspace-is-system.decorator';
@@ -21,7 +21,9 @@ import { NoteTargetWorkspaceEntity } from 'src/modules/note/standard-objects/not
 import { TaskTargetWorkspaceEntity } from 'src/modules/task/standard-objects/task-target.workspace-entity';
 import { TimelineActivityWorkspaceEntity } from 'src/modules/timeline/standard-objects/timeline-activity.workspace-entity';
 
-@WorkspaceCustomObject()
+@WorkspaceCustomEntity({
+  softDelete: true,
+})
 export class CustomWorkspaceEntity extends BaseWorkspaceEntity {
   @WorkspaceField({
     standardId: CUSTOM_OBJECT_STANDARD_FIELD_IDS.name,
diff --git a/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-custom-object.decorator.ts b/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-custom-entity.decorator.ts
similarity index 63%
rename from packages/twenty-server/src/engine/twenty-orm/decorators/workspace-custom-object.decorator.ts
rename to packages/twenty-server/src/engine/twenty-orm/decorators/workspace-custom-entity.decorator.ts
index 17f6ef526b31..74f1ff0295be 100644
--- a/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-custom-object.decorator.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-custom-entity.decorator.ts
@@ -1,7 +1,13 @@
 import { metadataArgsStorage } from 'src/engine/twenty-orm/storage/metadata-args.storage';
 import { TypedReflect } from 'src/utils/typed-reflect';
 
-export function WorkspaceCustomObject(): ClassDecorator {
+interface WorkspaceCustomEntityOptions {
+  softDelete?: boolean;
+}
+
+export function WorkspaceCustomEntity(
+  options: WorkspaceCustomEntityOptions = {},
+): ClassDecorator {
   return (target) => {
     const gate = TypedReflect.getMetadata(
       'workspace:gate-metadata-args',
@@ -11,6 +17,7 @@ export function WorkspaceCustomObject(): ClassDecorator {
     metadataArgsStorage.addExtendedEntities({
       target,
       gate,
+      softDelete: options.softDelete,
     });
   };
 }
diff --git a/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-entity.decorator.ts b/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-entity.decorator.ts
index 5e56de14008c..3b9e5b6f1d66 100644
--- a/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-entity.decorator.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-entity.decorator.ts
@@ -12,6 +12,7 @@ interface WorkspaceEntityOptions {
   icon?: string;
   labelIdentifierStandardId?: string;
   imageIdentifierStandardId?: string;
+  softDelete?: boolean;
 }
 
 export function WorkspaceEntity(
@@ -47,6 +48,7 @@ export function WorkspaceEntity(
       isAuditLogged,
       isSystem,
       gate,
+      softDelete: options.softDelete,
     });
   };
 }
diff --git a/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-is-primary-field.decorator.ts b/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-is-primary-field.decorator.ts
index 5dc8a389b675..efebefa469d3 100644
--- a/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-is-primary-field.decorator.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/decorators/workspace-is-primary-field.decorator.ts
@@ -1,6 +1,6 @@
 import { TypedReflect } from 'src/utils/typed-reflect';
 
-export function WorkspaceIsPimaryField(): PropertyDecorator {
+export function WorkspaceIsPrimaryField(): PropertyDecorator {
   return (object, propertyKey) => {
     TypedReflect.defineMetadata(
       'workspace:is-primary-field-metadata-args',
diff --git a/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema-column.factory.ts b/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema-column.factory.ts
index d85282c6293d..251e3058d778 100644
--- a/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema-column.factory.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema-column.factory.ts
@@ -22,12 +22,18 @@ type EntitySchemaColumnMap = {
 export class EntitySchemaColumnFactory {
   create(
     fieldMetadataCollection: FieldMetadataEntity[],
+    softDelete: boolean,
   ): EntitySchemaColumnMap {
     let entitySchemaColumnMap: EntitySchemaColumnMap = {};
 
     for (const fieldMetadata of fieldMetadataCollection) {
       const key = fieldMetadata.name;
 
+      // Skip deletedAt column if soft delete is not enabled
+      if (!softDelete && key === 'deletedAt') {
+        continue;
+      }
+
       if (isRelationFieldMetadataType(fieldMetadata.type)) {
         const relationMetadata =
           fieldMetadata.fromRelationMetadata ??
diff --git a/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema.factory.ts b/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema.factory.ts
index 14564a02920a..249f14091139 100644
--- a/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema.factory.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/factories/entity-schema.factory.ts
@@ -21,6 +21,7 @@ export class EntitySchemaFactory {
   ): Promise<EntitySchema> {
     const columns = this.entitySchemaColumnFactory.create(
       objectMetadata.fields,
+      objectMetadata.isSoftDeletable ?? false,
     );
 
     const relations = await this.entitySchemaRelationFactory.create(
diff --git a/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-entity-metadata-args.interface.ts b/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-entity-metadata-args.interface.ts
index ac10ea898dd2..0f506c5e25a1 100644
--- a/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-entity-metadata-args.interface.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-entity-metadata-args.interface.ts
@@ -54,12 +54,15 @@ export interface WorkspaceEntityMetadataArgs {
   /**
    * Label identifier.
    */
-
   readonly labelIdentifierStandardId: string | null;
 
   /**
    * Image identifier.
    */
-
   readonly imageIdentifierStandardId: string | null;
+
+  /**
+   * Enable soft delete.
+   */
+  readonly softDelete?: boolean;
 }
diff --git a/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-extended-entity-metadata-args.interface.ts b/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-extended-entity-metadata-args.interface.ts
index 12706f004849..fe29d8c15e86 100644
--- a/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-extended-entity-metadata-args.interface.ts
+++ b/packages/twenty-server/src/engine/twenty-orm/interfaces/workspace-extended-entity-metadata-args.interface.ts
@@ -13,4 +13,9 @@ export interface WorkspaceExtendedEntityMetadataArgs {
    * Entity gate.
    */
   readonly gate?: Gate;
+
+  /**
+   * Enable soft delete.
+   */
+  readonly softDelete?: boolean;
 }
diff --git a/packages/twenty-server/src/engine/utils/__tests__/get-resolver-name.spec.ts b/packages/twenty-server/src/engine/utils/__tests__/get-resolver-name.spec.ts
index 55f327d19651..dec23df4b14f 100644
--- a/packages/twenty-server/src/engine/utils/__tests__/get-resolver-name.spec.ts
+++ b/packages/twenty-server/src/engine/utils/__tests__/get-resolver-name.spec.ts
@@ -15,6 +15,8 @@ describe('getResolverName', () => {
     ['createOne', 'createEntity'],
     ['updateOne', 'updateEntity'],
     ['deleteOne', 'deleteEntity'],
+    ['restoreMany', 'restoreEntities'],
+    ['destroyMany', 'destroyEntities'],
   ])('should return correct name for %s resolver', (type, expectedResult) => {
     expect(
       getResolverName(metadata, type as WorkspaceResolverBuilderMethodNames),
diff --git a/packages/twenty-server/src/engine/utils/get-resolver-name.util.ts b/packages/twenty-server/src/engine/utils/get-resolver-name.util.ts
index 4c35f0edafd6..f5462b87fd8c 100644
--- a/packages/twenty-server/src/engine/utils/get-resolver-name.util.ts
+++ b/packages/twenty-server/src/engine/utils/get-resolver-name.util.ts
@@ -25,8 +25,12 @@ export const getResolverName = (
       return `delete${pascalCase(objectMetadata.nameSingular)}`;
     case 'updateMany':
       return `update${pascalCase(objectMetadata.namePlural)}`;
+    case 'restoreMany':
+      return `restore${pascalCase(objectMetadata.namePlural)}`;
     case 'deleteMany':
       return `delete${pascalCase(objectMetadata.namePlural)}`;
+    case 'destroyMany':
+      return `destroy${pascalCase(objectMetadata.namePlural)}`;
     default:
       throw new Error(`Unknown resolver type: ${type}`);
   }
diff --git a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids.ts b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids.ts
index 12d7b809ed4c..ff51c318ea17 100644
--- a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids.ts
+++ b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids.ts
@@ -53,6 +53,7 @@ export const BASE_OBJECT_STANDARD_FIELD_IDS = {
   id: '20202020-eda0-4cee-9577-3eb357e3c22b',
   createdAt: '20202020-66ac-4502-9975-e4d959c50311',
   updatedAt: '20202020-d767-4622-bdcf-d8a084834d86',
+  deletedAt: '20202020-b9a7-48d8-8387-b9a3090a50ec',
 };
 
 export const BLOCKLIST_STANDARD_FIELD_IDS = {
@@ -411,10 +412,19 @@ export const WORKFLOW_STANDARD_FIELD_IDS = {
   noteTargets: '20202020-40aa-4839-965e-972a2f72e08d',
 };
 
+export const WORKFLOW_RUN_STANDARD_FIELD_IDS = {
+  workflowVersion: '20202020-2f52-4ba8-8dc4-d0d6adb9578d',
+  startedAt: '20202020-a234-4e2d-bd15-85bcea6bb183',
+  endedAt: '20202020-e1c1-4b6b-bbbd-b2beaf2e159e',
+  status: '20202020-6b3e-4f9c-8c2b-2e5b8e6d6f3b',
+  createdBy: '20202020-6007-401a-8aa5-e6f38581a6f3',
+};
+
 export const WORKFLOW_VERSION_STANDARD_FIELD_IDS = {
   name: '20202020-a12f-4cca-9937-a2e40cc65509',
   workflow: '20202020-afa3-46c3-91b0-0631ca6aa1c8',
   trigger: '20202020-4eae-43e7-86e0-212b41a30b48',
+  runs: '20202020-1d08-46df-901a-85045f18099a',
 };
 
 export const WORKSPACE_MEMBER_STANDARD_FIELD_IDS = {
diff --git a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-object-ids.ts b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-object-ids.ts
index 7be15073db4b..a13e78836b57 100644
--- a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-object-ids.ts
+++ b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/constants/standard-object-ids.ts
@@ -41,6 +41,7 @@ export const STANDARD_OBJECT_IDS = {
   webhook: '20202020-be4d-4e08-811d-0fffcd13ffd4',
   workflow: '20202020-62be-406c-b9ca-8caa50d51392',
   workflowEventListener: '20202020-92aa-462f-965c-a785b00e9989',
+  workflowRun: '20202020-4e28-4e95-a9d7-6c00874f843c',
   workflowVersion: '20202020-d65d-4ab9-9344-d77bfb376a3d',
   workspaceMember: '20202020-3319-4234-a34c-82d5c0e881a6',
 };
diff --git a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-field.factory.ts b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-field.factory.ts
index 44966b547f9b..2b60513479dc 100644
--- a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-field.factory.ts
+++ b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-field.factory.ts
@@ -150,6 +150,14 @@ export class StandardFieldFactory {
       return [];
     }
 
+    if (
+      workspaceFieldMetadataArgs.name === 'deletedAt' &&
+      workspaceEntityMetadataArgs &&
+      !workspaceEntityMetadataArgs.softDelete
+    ) {
+      return [];
+    }
+
     return [
       {
         type: workspaceFieldMetadataArgs.type,
diff --git a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-object.factory.ts b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-object.factory.ts
index 72e29753e992..da2c8318b8fa 100644
--- a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-object.factory.ts
+++ b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/factories/standard-object.factory.ts
@@ -54,6 +54,7 @@ export class StandardObjectFactory {
       isCustom: false,
       isRemote: false,
       isSystem: workspaceEntityMetadataArgs.isSystem ?? false,
+      isSoftDeletable: workspaceEntityMetadataArgs.softDelete ?? false,
     };
   }
 }
diff --git a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/standard-objects/index.ts b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/standard-objects/index.ts
index 95c148669293..d510e4f2d2e7 100644
--- a/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/standard-objects/index.ts
+++ b/packages/twenty-server/src/engine/workspace-manager/workspace-sync-metadata/standard-objects/index.ts
@@ -32,6 +32,7 @@ import { ViewSortWorkspaceEntity } from 'src/modules/view/standard-objects/view-
 import { ViewWorkspaceEntity } from 'src/modules/view/standard-objects/view.workspace-entity';
 import { WebhookWorkspaceEntity } from 'src/modules/webhook/standard-objects/webhook.workspace-entity';
 import { WorkflowEventListenerWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow-event-listener.workspace-entity';
+import { WorkflowRunWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow-run.workspace-entity';
 import { WorkflowVersionWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow-version.workspace-entity';
 import { WorkflowWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow.workspace-entity';
 import { WorkspaceMemberWorkspaceEntity } from 'src/modules/workspace-member/standard-objects/workspace-member.workspace-entity';
@@ -64,6 +65,7 @@ export const standardObjectMetadataDefinitions = [
   WorkflowWorkspaceEntity,
   WorkflowEventListenerWorkspaceEntity,
   WorkflowVersionWorkspaceEntity,
+  WorkflowRunWorkspaceEntity,
   WorkspaceMemberWorkspaceEntity,
   MessageThreadWorkspaceEntity,
   MessageThreadSubscriberWorkspaceEntity,
diff --git a/packages/twenty-server/src/modules/company/standard-objects/company.workspace-entity.ts b/packages/twenty-server/src/modules/company/standard-objects/company.workspace-entity.ts
index 3947cd94b92b..bfea234bb283 100644
--- a/packages/twenty-server/src/modules/company/standard-objects/company.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/company/standard-objects/company.workspace-entity.ts
@@ -4,6 +4,7 @@ import {
   ActorMetadata,
   FieldActorSource,
 } from 'src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type';
+import { AddressMetadata } from 'src/engine/metadata-modules/field-metadata/composite-types/address.composite-type';
 import { CurrencyMetadata } from 'src/engine/metadata-modules/field-metadata/composite-types/currency.composite-type';
 import { LinksMetadata } from 'src/engine/metadata-modules/field-metadata/composite-types/links.composite-type';
 import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
@@ -30,7 +31,6 @@ import { PersonWorkspaceEntity } from 'src/modules/person/standard-objects/perso
 import { TaskTargetWorkspaceEntity } from 'src/modules/task/standard-objects/task-target.workspace-entity';
 import { TimelineActivityWorkspaceEntity } from 'src/modules/timeline/standard-objects/timeline-activity.workspace-entity';
 import { WorkspaceMemberWorkspaceEntity } from 'src/modules/workspace-member/standard-objects/workspace-member.workspace-entity';
-import { AddressMetadata } from 'src/engine/metadata-modules/field-metadata/composite-types/address.composite-type';
 
 @WorkspaceEntity({
   standardId: STANDARD_OBJECT_IDS.company,
@@ -40,6 +40,7 @@ import { AddressMetadata } from 'src/engine/metadata-modules/field-metadata/comp
   description: 'A company',
   icon: 'IconBuildingSkyscraper',
   labelIdentifierStandardId: COMPANY_STANDARD_FIELD_IDS.name,
+  softDelete: true,
 })
 export class CompanyWorkspaceEntity extends BaseWorkspaceEntity {
   @WorkspaceField({
@@ -132,7 +133,7 @@ export class CompanyWorkspaceEntity extends BaseWorkspaceEntity {
   })
   @WorkspaceIsSystem()
   @WorkspaceIsNullable()
-  position: number | null;
+  position: number;
 
   @WorkspaceField({
     standardId: COMPANY_STANDARD_FIELD_IDS.createdBy,
diff --git a/packages/twenty-server/src/modules/note/standard-objects/note-target.workspace-entity.ts b/packages/twenty-server/src/modules/note/standard-objects/note-target.workspace-entity.ts
index 51e82ca8c57d..abb015895611 100644
--- a/packages/twenty-server/src/modules/note/standard-objects/note-target.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/note/standard-objects/note-target.workspace-entity.ts
@@ -26,6 +26,7 @@ import { WorkflowWorkspaceEntity } from 'src/modules/workflow/common/standard-ob
   labelPlural: 'Note Targets',
   description: 'A note target',
   icon: 'IconCheckbox',
+  softDelete: true,
 })
 @WorkspaceIsSystem()
 export class NoteTargetWorkspaceEntity extends BaseWorkspaceEntity {
diff --git a/packages/twenty-server/src/modules/note/standard-objects/note.workspace-entity.ts b/packages/twenty-server/src/modules/note/standard-objects/note.workspace-entity.ts
index 7b5c9611885e..a8aa5b9342c4 100644
--- a/packages/twenty-server/src/modules/note/standard-objects/note.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/note/standard-objects/note.workspace-entity.ts
@@ -30,6 +30,7 @@ import { TimelineActivityWorkspaceEntity } from 'src/modules/timeline/standard-o
   description: 'A note',
   icon: 'IconNotes',
   labelIdentifierStandardId: NOTE_STANDARD_FIELD_IDS.title,
+  softDelete: true,
 })
 export class NoteWorkspaceEntity extends BaseWorkspaceEntity {
   @WorkspaceField({
diff --git a/packages/twenty-server/src/modules/opportunity/standard-objects/opportunity.workspace-entity.ts b/packages/twenty-server/src/modules/opportunity/standard-objects/opportunity.workspace-entity.ts
index 142b000b9a0d..3acd4dc88ebd 100644
--- a/packages/twenty-server/src/modules/opportunity/standard-objects/opportunity.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/opportunity/standard-objects/opportunity.workspace-entity.ts
@@ -39,6 +39,7 @@ import { TimelineActivityWorkspaceEntity } from 'src/modules/timeline/standard-o
   description: 'An opportunity',
   icon: 'IconTargetArrow',
   labelIdentifierStandardId: OPPORTUNITY_STANDARD_FIELD_IDS.name,
+  softDelete: true,
 })
 @WorkspaceIsNotAuditLogged()
 export class OpportunityWorkspaceEntity extends BaseWorkspaceEntity {
diff --git a/packages/twenty-server/src/modules/person/standard-objects/person.workspace-entity.ts b/packages/twenty-server/src/modules/person/standard-objects/person.workspace-entity.ts
index 46300a1451cc..4083e4a4b8ba 100644
--- a/packages/twenty-server/src/modules/person/standard-objects/person.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/person/standard-objects/person.workspace-entity.ts
@@ -40,6 +40,7 @@ import { TimelineActivityWorkspaceEntity } from 'src/modules/timeline/standard-o
   icon: 'IconUser',
   labelIdentifierStandardId: PERSON_STANDARD_FIELD_IDS.name,
   imageIdentifierStandardId: PERSON_STANDARD_FIELD_IDS.avatarUrl,
+  softDelete: true,
 })
 export class PersonWorkspaceEntity extends BaseWorkspaceEntity {
   @WorkspaceField({
@@ -127,7 +128,7 @@ export class PersonWorkspaceEntity extends BaseWorkspaceEntity {
   })
   @WorkspaceIsSystem()
   @WorkspaceIsNullable()
-  position: number | null;
+  position: number;
 
   @WorkspaceField({
     standardId: PERSON_STANDARD_FIELD_IDS.createdBy,
diff --git a/packages/twenty-server/src/modules/task/standard-objects/task-target.workspace-entity.ts b/packages/twenty-server/src/modules/task/standard-objects/task-target.workspace-entity.ts
index e5a856bbd99f..82c864ed2382 100644
--- a/packages/twenty-server/src/modules/task/standard-objects/task-target.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/task/standard-objects/task-target.workspace-entity.ts
@@ -26,6 +26,7 @@ import { WorkflowWorkspaceEntity } from 'src/modules/workflow/common/standard-ob
   labelPlural: 'Task Targets',
   description: 'An task target',
   icon: 'IconCheckbox',
+  softDelete: true,
 })
 @WorkspaceIsSystem()
 export class TaskTargetWorkspaceEntity extends BaseWorkspaceEntity {
diff --git a/packages/twenty-server/src/modules/task/standard-objects/task.workspace-entity.ts b/packages/twenty-server/src/modules/task/standard-objects/task.workspace-entity.ts
index 03f0c88002e3..d087d69c6fbd 100644
--- a/packages/twenty-server/src/modules/task/standard-objects/task.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/task/standard-objects/task.workspace-entity.ts
@@ -32,6 +32,7 @@ import { WorkspaceMemberWorkspaceEntity } from 'src/modules/workspace-member/sta
   description: 'A task',
   icon: 'IconCheckbox',
   labelIdentifierStandardId: TASK_STANDARD_FIELD_IDS.title,
+  softDelete: true,
 })
 export class TaskWorkspaceEntity extends BaseWorkspaceEntity {
   @WorkspaceField({
diff --git a/packages/twenty-server/src/modules/workflow/common/standard-objects/workflow-run.workspace-entity.ts b/packages/twenty-server/src/modules/workflow/common/standard-objects/workflow-run.workspace-entity.ts
new file mode 100644
index 000000000000..5f78df89164c
--- /dev/null
+++ b/packages/twenty-server/src/modules/workflow/common/standard-objects/workflow-run.workspace-entity.ts
@@ -0,0 +1,124 @@
+import { Relation } from 'src/engine/workspace-manager/workspace-sync-metadata/interfaces/relation.interface';
+
+import { FeatureFlagKey } from 'src/engine/core-modules/feature-flag/enums/feature-flag-key.enum';
+import {
+  ActorMetadata,
+  FieldActorSource,
+} from 'src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type';
+import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
+import { RelationMetadataType } from 'src/engine/metadata-modules/relation-metadata/relation-metadata.entity';
+import { BaseWorkspaceEntity } from 'src/engine/twenty-orm/base.workspace-entity';
+import { WorkspaceEntity } from 'src/engine/twenty-orm/decorators/workspace-entity.decorator';
+import { WorkspaceField } from 'src/engine/twenty-orm/decorators/workspace-field.decorator';
+import { WorkspaceGate } from 'src/engine/twenty-orm/decorators/workspace-gate.decorator';
+import { WorkspaceIsNullable } from 'src/engine/twenty-orm/decorators/workspace-is-nullable.decorator';
+import { WorkspaceIsSystem } from 'src/engine/twenty-orm/decorators/workspace-is-system.decorator';
+import { WorkspaceJoinColumn } from 'src/engine/twenty-orm/decorators/workspace-join-column.decorator';
+import { WorkspaceRelation } from 'src/engine/twenty-orm/decorators/workspace-relation.decorator';
+import { WORKFLOW_RUN_STANDARD_FIELD_IDS } from 'src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids';
+import { STANDARD_OBJECT_IDS } from 'src/engine/workspace-manager/workspace-sync-metadata/constants/standard-object-ids';
+import { WorkflowVersionWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow-version.workspace-entity';
+
+export enum WorkflowRunStatus {
+  NOT_STARTED = 'NOT_STARTED',
+  RUNNING = 'RUNNING',
+  COMPLETED = 'COMPLETED',
+  FAILED = 'FAILED',
+}
+
+@WorkspaceEntity({
+  standardId: STANDARD_OBJECT_IDS.workflowRun,
+  namePlural: 'workflowRuns',
+  labelSingular: 'workflowRun',
+  labelPlural: 'WorkflowRuns',
+  description: 'A workflow run',
+})
+@WorkspaceGate({
+  featureFlag: FeatureFlagKey.IsWorkflowEnabled,
+})
+@WorkspaceIsSystem()
+export class WorkflowRunWorkspaceEntity extends BaseWorkspaceEntity {
+  @WorkspaceField({
+    standardId: WORKFLOW_RUN_STANDARD_FIELD_IDS.startedAt,
+    type: FieldMetadataType.DATE_TIME,
+    label: 'Workflow run started at',
+    description: 'Workflow run started at',
+    icon: 'IconHistory',
+  })
+  @WorkspaceIsNullable()
+  startedAt: string | null;
+
+  @WorkspaceField({
+    standardId: WORKFLOW_RUN_STANDARD_FIELD_IDS.endedAt,
+    type: FieldMetadataType.DATE_TIME,
+    label: 'Workflow run ended at',
+    description: 'Workflow run ended at',
+    icon: 'IconHistory',
+  })
+  @WorkspaceIsNullable()
+  endedAt: string | null;
+
+  @WorkspaceField({
+    standardId: WORKFLOW_RUN_STANDARD_FIELD_IDS.status,
+    type: FieldMetadataType.SELECT,
+    label: 'Workflow run status',
+    description: 'Workflow run status',
+    icon: 'IconHistory',
+    options: [
+      {
+        value: WorkflowRunStatus.NOT_STARTED,
+        label: 'Not started',
+        position: 0,
+        color: 'grey',
+      },
+      {
+        value: WorkflowRunStatus.RUNNING,
+        label: 'Running',
+        position: 1,
+        color: 'yellow',
+      },
+      {
+        value: WorkflowRunStatus.COMPLETED,
+        label: 'Completed',
+        position: 2,
+        color: 'green',
+      },
+      {
+        value: WorkflowRunStatus.FAILED,
+        label: 'Failed',
+        position: 3,
+        color: 'red',
+      },
+    ],
+    defaultValue: "'NOT_STARTED'",
+  })
+  status: WorkflowRunStatus;
+
+  @WorkspaceField({
+    standardId: WORKFLOW_RUN_STANDARD_FIELD_IDS.createdBy,
+    type: FieldMetadataType.ACTOR,
+    label: 'Created by',
+    icon: 'IconCreativeCommonsSa',
+    description: 'The creator of the record',
+    defaultValue: {
+      source: `'${FieldActorSource.MANUAL}'`,
+      name: "''",
+    },
+  })
+  createdBy: ActorMetadata;
+
+  // Relations
+  @WorkspaceRelation({
+    standardId: WORKFLOW_RUN_STANDARD_FIELD_IDS.workflowVersion,
+    type: RelationMetadataType.MANY_TO_ONE,
+    label: 'Workflow',
+    description: 'WorkflowVersion workflow',
+    icon: 'IconVersions',
+    inverseSideTarget: () => WorkflowVersionWorkspaceEntity,
+    inverseSideFieldKey: 'runs',
+  })
+  workflowVersion: Relation<WorkflowVersionWorkspaceEntity>;
+
+  @WorkspaceJoinColumn('workflowVersion')
+  workflowVersionId: string;
+}
diff --git a/packages/twenty-server/src/modules/workflow/common/standard-objects/workflow-version.workspace-entity.ts b/packages/twenty-server/src/modules/workflow/common/standard-objects/workflow-version.workspace-entity.ts
index 3c52fb22f31b..ec8a8206b2e2 100644
--- a/packages/twenty-server/src/modules/workflow/common/standard-objects/workflow-version.workspace-entity.ts
+++ b/packages/twenty-server/src/modules/workflow/common/standard-objects/workflow-version.workspace-entity.ts
@@ -2,7 +2,10 @@ import { Relation } from 'src/engine/workspace-manager/workspace-sync-metadata/i
 
 import { FeatureFlagKey } from 'src/engine/core-modules/feature-flag/enums/feature-flag-key.enum';
 import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
-import { RelationMetadataType } from 'src/engine/metadata-modules/relation-metadata/relation-metadata.entity';
+import {
+  RelationMetadataType,
+  RelationOnDeleteAction,
+} from 'src/engine/metadata-modules/relation-metadata/relation-metadata.entity';
 import { BaseWorkspaceEntity } from 'src/engine/twenty-orm/base.workspace-entity';
 import { WorkspaceEntity } from 'src/engine/twenty-orm/decorators/workspace-entity.decorator';
 import { WorkspaceField } from 'src/engine/twenty-orm/decorators/workspace-field.decorator';
@@ -11,8 +14,12 @@ import { WorkspaceIsNullable } from 'src/engine/twenty-orm/decorators/workspace-
 import { WorkspaceIsSystem } from 'src/engine/twenty-orm/decorators/workspace-is-system.decorator';
 import { WorkspaceJoinColumn } from 'src/engine/twenty-orm/decorators/workspace-join-column.decorator';
 import { WorkspaceRelation } from 'src/engine/twenty-orm/decorators/workspace-relation.decorator';
-import { WORKFLOW_VERSION_STANDARD_FIELD_IDS } from 'src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids';
+import {
+  WORKFLOW_RUN_STANDARD_FIELD_IDS,
+  WORKFLOW_VERSION_STANDARD_FIELD_IDS,
+} from 'src/engine/workspace-manager/workspace-sync-metadata/constants/standard-field-ids';
 import { STANDARD_OBJECT_IDS } from 'src/engine/workspace-manager/workspace-sync-metadata/constants/standard-object-ids';
+import { WorkflowRunWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow-run.workspace-entity';
 import { WorkflowWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow.workspace-entity';
 import { WorkflowTrigger } from 'src/modules/workflow/common/types/workflow-trigger.type';
 
@@ -64,4 +71,16 @@ export class WorkflowVersionWorkspaceEntity extends BaseWorkspaceEntity {
 
   @WorkspaceJoinColumn('workflow')
   workflowId: string;
+
+  @WorkspaceRelation({
+    standardId: WORKFLOW_RUN_STANDARD_FIELD_IDS.workflowVersion,
+    type: RelationMetadataType.ONE_TO_MANY,
+    label: 'Runs',
+    description: 'Workflow runs linked to the version.',
+    icon: 'IconVersions',
+    inverseSideTarget: () => WorkflowRunWorkspaceEntity,
+    onDelete: RelationOnDeleteAction.SET_NULL,
+  })
+  @WorkspaceIsNullable()
+  runs: Relation<WorkflowRunWorkspaceEntity>;
 }
diff --git a/packages/twenty-server/src/modules/workflow/common/workflow-common.module.ts b/packages/twenty-server/src/modules/workflow/common/workflow-common.module.ts
index 159fb862285a..009da5aa8119 100644
--- a/packages/twenty-server/src/modules/workflow/common/workflow-common.module.ts
+++ b/packages/twenty-server/src/modules/workflow/common/workflow-common.module.ts
@@ -1,9 +1,9 @@
 import { Module } from '@nestjs/common';
 
-import { WorkflowCommonService } from 'src/modules/workflow/common/workflow-common.services';
+import { WorkflowCommonWorkspaceService } from 'src/modules/workflow/common/workflow-common.workspace-service';
 
 @Module({
-  providers: [WorkflowCommonService],
-  exports: [WorkflowCommonService],
+  providers: [WorkflowCommonWorkspaceService],
+  exports: [WorkflowCommonWorkspaceService],
 })
 export class WorkflowCommonModule {}
diff --git a/packages/twenty-server/src/modules/workflow/common/workflow-common.services.ts b/packages/twenty-server/src/modules/workflow/common/workflow-common.workspace-service.ts
similarity index 73%
rename from packages/twenty-server/src/modules/workflow/common/workflow-common.services.ts
rename to packages/twenty-server/src/modules/workflow/common/workflow-common.workspace-service.ts
index baa23b8e1a16..3db70e89c0d5 100644
--- a/packages/twenty-server/src/modules/workflow/common/workflow-common.services.ts
+++ b/packages/twenty-server/src/modules/workflow/common/workflow-common.workspace-service.ts
@@ -1,6 +1,6 @@
 import { Injectable } from '@nestjs/common';
 
-import { TwentyORMGlobalManager } from 'src/engine/twenty-orm/twenty-orm-global.manager';
+import { TwentyORMManager } from 'src/engine/twenty-orm/twenty-orm.manager';
 import { WorkflowVersionWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow-version.workspace-entity';
 import { WorkflowTrigger } from 'src/modules/workflow/common/types/workflow-trigger.type';
 import {
@@ -9,22 +9,16 @@ import {
 } from 'src/modules/workflow/workflow-trigger/workflow-trigger.exception';
 
 @Injectable()
-export class WorkflowCommonService {
-  constructor(
-    private readonly twentyORMGlobalManager: TwentyORMGlobalManager,
-  ) {}
+export class WorkflowCommonWorkspaceService {
+  constructor(private readonly twentyORMManager: TwentyORMManager) {}
 
-  async getWorkflowVersion(
-    workspaceId: string,
-    workflowVersionId: string,
-  ): Promise<
+  async getWorkflowVersion(workflowVersionId: string): Promise<
     Omit<WorkflowVersionWorkspaceEntity, 'trigger'> & {
       trigger: WorkflowTrigger;
     }
   > {
     const workflowVersionRepository =
-      await this.twentyORMGlobalManager.getRepositoryForWorkspace<WorkflowVersionWorkspaceEntity>(
-        workspaceId,
+      await this.twentyORMManager.getRepository<WorkflowVersionWorkspaceEntity>(
         'workflowVersion',
       );
 
diff --git a/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.exception.ts b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.exception.ts
new file mode 100644
index 000000000000..9284ce454dab
--- /dev/null
+++ b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.exception.ts
@@ -0,0 +1,12 @@
+import { CustomException } from 'src/utils/custom-exception';
+
+export class WorkflowActionRunnerException extends CustomException {
+  code: WorkflowActionRunnerExceptionCode;
+  constructor(message: string, code: WorkflowActionRunnerExceptionCode) {
+    super(message, code);
+  }
+}
+
+export enum WorkflowActionRunnerExceptionCode {
+  SCOPED_WORKSPACE_NOT_FOUND = 'SCOPED_WORKSPACE_NOT_FOUND',
+}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.interface.ts b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.interface.ts
index b443e7c9c688..1591af06c027 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.interface.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.interface.ts
@@ -1,14 +1,12 @@
-import { WorkflowResult } from 'src/modules/workflow/common/types/workflow-result.type';
 import { WorkflowAction } from 'src/modules/workflow/common/types/workflow-action.type';
+import { WorkflowResult } from 'src/modules/workflow/common/types/workflow-result.type';
 
 export interface WorkflowActionRunner {
   execute({
     action,
-    workspaceId,
     payload,
   }: {
     action: WorkflowAction;
-    workspaceId: string;
     payload?: object;
   }): Promise<WorkflowResult>;
 }
diff --git a/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.module.ts b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.module.ts
index 890b6885003d..1bafd6cfe396 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.module.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runner.module.ts
@@ -1,12 +1,17 @@
 import { Module } from '@nestjs/common';
 
+import { ServerlessFunctionModule } from 'src/engine/metadata-modules/serverless-function/serverless-function.module';
+import { ScopedWorkspaceContextFactory } from 'src/engine/twenty-orm/factories/scoped-workspace-context.factory';
 import { WorkflowActionRunnerFactory } from 'src/modules/workflow/workflow-action-runner/workflow-action-runner.factory';
 import { CodeWorkflowActionRunner } from 'src/modules/workflow/workflow-action-runner/workflow-action-runners/code-workflow-action-runner';
-import { ServerlessFunctionModule } from 'src/engine/metadata-modules/serverless-function/serverless-function.module';
 
 @Module({
   imports: [ServerlessFunctionModule],
-  providers: [WorkflowActionRunnerFactory, CodeWorkflowActionRunner],
+  providers: [
+    WorkflowActionRunnerFactory,
+    CodeWorkflowActionRunner,
+    ScopedWorkspaceContextFactory,
+  ],
   exports: [WorkflowActionRunnerFactory],
 })
 export class WorkflowActionRunnerModule {}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runners/code-workflow-action-runner.ts b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runners/code-workflow-action-runner.ts
index 3be348283672..2afedcb21402 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runners/code-workflow-action-runner.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-action-runner/workflow-action-runners/code-workflow-action-runner.ts
@@ -1,25 +1,38 @@
 import { Injectable } from '@nestjs/common';
 
-import { WorkflowActionRunner } from 'src/modules/workflow/workflow-action-runner/workflow-action-runner.interface';
-import { WorkflowAction } from 'src/modules/workflow/common/types/workflow-action.type';
 import { ServerlessFunctionService } from 'src/engine/metadata-modules/serverless-function/serverless-function.service';
+import { ScopedWorkspaceContextFactory } from 'src/engine/twenty-orm/factories/scoped-workspace-context.factory';
+import { WorkflowAction } from 'src/modules/workflow/common/types/workflow-action.type';
 import { WorkflowResult } from 'src/modules/workflow/common/types/workflow-result.type';
+import {
+  WorkflowActionRunnerException,
+  WorkflowActionRunnerExceptionCode,
+} from 'src/modules/workflow/workflow-action-runner/workflow-action-runner.exception';
+import { WorkflowActionRunner } from 'src/modules/workflow/workflow-action-runner/workflow-action-runner.interface';
 
 @Injectable()
 export class CodeWorkflowActionRunner implements WorkflowActionRunner {
   constructor(
     private readonly serverlessFunctionService: ServerlessFunctionService,
+    private readonly scopedWorkspaceContextFactory: ScopedWorkspaceContextFactory,
   ) {}
 
   async execute({
     action,
-    workspaceId,
     payload,
   }: {
     action: WorkflowAction;
-    workspaceId: string;
     payload?: object;
   }): Promise<WorkflowResult> {
+    const { workspaceId } = this.scopedWorkspaceContextFactory.create();
+
+    if (!workspaceId) {
+      throw new WorkflowActionRunnerException(
+        'Scoped workspace not found',
+        WorkflowActionRunnerExceptionCode.SCOPED_WORKSPACE_NOT_FOUND,
+      );
+    }
+
     const result = await this.serverlessFunctionService.executeOne(
       action.settings.serverlessFunctionId,
       workspaceId,
diff --git a/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.exception.ts b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.exception.ts
new file mode 100644
index 000000000000..1bab0da515ee
--- /dev/null
+++ b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.exception.ts
@@ -0,0 +1,11 @@
+import { CustomException } from 'src/utils/custom-exception';
+
+export class WorkflowRunnerException extends CustomException {
+  constructor(message: string, code: string) {
+    super(message, code);
+  }
+}
+
+export enum WorkflowRunnerExceptionCode {
+  WORKFLOW_FAILED = 'WORKFLOW_FAILED',
+}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.job.ts b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.job.ts
index b2937ffd17c2..64f1d6984fa5 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.job.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.job.ts
@@ -1,54 +1,58 @@
+import { Scope } from '@nestjs/common';
+
 import { Process } from 'src/engine/integrations/message-queue/decorators/process.decorator';
 import { Processor } from 'src/engine/integrations/message-queue/decorators/processor.decorator';
 import { MessageQueue } from 'src/engine/integrations/message-queue/message-queue.constants';
-import { TwentyORMGlobalManager } from 'src/engine/twenty-orm/twenty-orm-global.manager';
-import { WorkflowWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow.workspace-entity';
-import { WorkflowCommonService } from 'src/modules/workflow/common/workflow-common.services';
-import { WorkflowRunnerService } from 'src/modules/workflow/workflow-runner/workflow-runner.service';
+import { WorkflowRunStatus } from 'src/modules/workflow/common/standard-objects/workflow-run.workspace-entity';
+import { WorkflowCommonWorkspaceService } from 'src/modules/workflow/common/workflow-common.workspace-service';
+import { WorkflowRunnerWorkspaceService } from 'src/modules/workflow/workflow-runner/workflow-runner.workspace-service';
+import { WorkflowStatusWorkspaceService } from 'src/modules/workflow/workflow-status/workflow-status.workspace-service';
 
 export type RunWorkflowJobData = {
   workspaceId: string;
-  workflowId: string;
+  workflowVersionId: string;
+  workflowRunId: string;
   payload: object;
 };
 
-@Processor(MessageQueue.workflowQueue)
+@Processor({ queueName: MessageQueue.workflowQueue, scope: Scope.REQUEST })
 export class WorkflowRunnerJob {
   constructor(
-    private readonly workflowCommonService: WorkflowCommonService,
-    private readonly workflowRunnerService: WorkflowRunnerService,
-    private readonly twentyORMGlobalManager: TwentyORMGlobalManager,
+    private readonly workflowCommonWorkspaceService: WorkflowCommonWorkspaceService,
+    private readonly workflowRunnerWorkspaceService: WorkflowRunnerWorkspaceService,
+    private readonly workflowStatusWorkspaceService: WorkflowStatusWorkspaceService,
   ) {}
 
   @Process(WorkflowRunnerJob.name)
   async handle({
-    workspaceId,
-    workflowId,
+    workflowVersionId,
+    workflowRunId,
     payload,
   }: RunWorkflowJobData): Promise<void> {
-    const workflowRepository =
-      await this.twentyORMGlobalManager.getRepositoryForWorkspace<WorkflowWorkspaceEntity>(
-        workspaceId,
-        'workflow',
-      );
+    await this.workflowStatusWorkspaceService.startWorkflowRun(workflowRunId);
 
-    const workflow = await workflowRepository.findOneByOrFail({
-      id: workflowId,
-    });
+    const workflowVersion =
+      await this.workflowCommonWorkspaceService.getWorkflowVersion(
+        workflowVersionId,
+      );
 
-    if (!workflow.publishedVersionId) {
-      throw new Error('Workflow has no published version');
-    }
+    try {
+      await this.workflowRunnerWorkspaceService.run({
+        action: workflowVersion.trigger.nextAction,
+        payload,
+      });
 
-    const workflowVersion = await this.workflowCommonService.getWorkflowVersion(
-      workspaceId,
-      workflow.publishedVersionId,
-    );
+      await this.workflowStatusWorkspaceService.endWorkflowRun(
+        workflowRunId,
+        WorkflowRunStatus.COMPLETED,
+      );
+    } catch (error) {
+      await this.workflowStatusWorkspaceService.endWorkflowRun(
+        workflowRunId,
+        WorkflowRunStatus.FAILED,
+      );
 
-    await this.workflowRunnerService.run({
-      action: workflowVersion.trigger.nextAction,
-      workspaceId,
-      payload,
-    });
+      throw error;
+    }
   }
 }
diff --git a/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.module.ts b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.module.ts
index a5698425057d..9bd7e69d3876 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.module.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.module.ts
@@ -1,13 +1,18 @@
 import { Module } from '@nestjs/common';
 
-import { WorkflowRunnerService } from 'src/modules/workflow/workflow-runner/workflow-runner.service';
-import { WorkflowRunnerJob } from 'src/modules/workflow/workflow-runner/workflow-runner.job';
 import { WorkflowCommonModule } from 'src/modules/workflow/common/workflow-common.module';
 import { WorkflowActionRunnerModule } from 'src/modules/workflow/workflow-action-runner/workflow-action-runner.module';
+import { WorkflowRunnerJob } from 'src/modules/workflow/workflow-runner/workflow-runner.job';
+import { WorkflowRunnerWorkspaceService } from 'src/modules/workflow/workflow-runner/workflow-runner.workspace-service';
+import { WorkflowStatusModule } from 'src/modules/workflow/workflow-status/workflow-status.module';
 
 @Module({
-  imports: [WorkflowCommonModule, WorkflowActionRunnerModule],
-  providers: [WorkflowRunnerService, WorkflowRunnerJob],
-  exports: [WorkflowRunnerService],
+  imports: [
+    WorkflowCommonModule,
+    WorkflowActionRunnerModule,
+    WorkflowStatusModule,
+  ],
+  providers: [WorkflowRunnerWorkspaceService, WorkflowRunnerJob],
+  exports: [WorkflowRunnerWorkspaceService],
 })
 export class WorkflowRunnerModule {}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.service.ts b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.workspace-service.ts
similarity index 68%
rename from packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.service.ts
rename to packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.workspace-service.ts
index 9b79d20536b6..0822bc5d2f34 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.service.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-runner/workflow-runner.workspace-service.ts
@@ -2,28 +2,37 @@ import { Injectable } from '@nestjs/common';
 
 import { WorkflowAction } from 'src/modules/workflow/common/types/workflow-action.type';
 import { WorkflowActionRunnerFactory } from 'src/modules/workflow/workflow-action-runner/workflow-action-runner.factory';
+import {
+  WorkflowRunnerException,
+  WorkflowRunnerExceptionCode,
+} from 'src/modules/workflow/workflow-runner/workflow-runner.exception';
 
 const MAX_RETRIES_ON_FAILURE = 3;
 
+export type WorkflowRunOutput = {
+  data?: object;
+  error?: object;
+};
+
 @Injectable()
-export class WorkflowRunnerService {
+export class WorkflowRunnerWorkspaceService {
   constructor(
     private readonly workflowActionRunnerFactory: WorkflowActionRunnerFactory,
   ) {}
 
   async run({
     action,
-    workspaceId,
     payload,
     attemptCount = 1,
   }: {
     action?: WorkflowAction;
-    workspaceId: string;
     payload?: object;
     attemptCount?: number;
-  }) {
+  }): Promise<WorkflowRunOutput> {
     if (!action) {
-      return payload;
+      return {
+        data: payload,
+      };
     }
 
     const workflowActionRunner = this.workflowActionRunnerFactory.get(
@@ -32,26 +41,26 @@ export class WorkflowRunnerService {
 
     const result = await workflowActionRunner.execute({
       action,
-      workspaceId,
       payload,
     });
 
     if (result.data) {
       return await this.run({
         action: action.nextAction,
-        workspaceId,
         payload: result.data,
       });
     }
 
     if (!result.error) {
-      throw new Error('Execution result error, no data or error');
+      throw new WorkflowRunnerException(
+        'Execution result error, no data or error',
+        WorkflowRunnerExceptionCode.WORKFLOW_FAILED,
+      );
     }
 
     if (action.settings.errorHandlingOptions.continueOnFailure.value) {
       return await this.run({
         action: action.nextAction,
-        workspaceId,
         payload,
       });
     }
@@ -62,12 +71,14 @@ export class WorkflowRunnerService {
     ) {
       return await this.run({
         action,
-        workspaceId,
         payload,
         attemptCount: attemptCount + 1,
       });
     }
 
-    return result.error;
+    throw new WorkflowRunnerException(
+      `Workflow failed: ${result.error}`,
+      WorkflowRunnerExceptionCode.WORKFLOW_FAILED,
+    );
   }
 }
diff --git a/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.exception.ts b/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.exception.ts
new file mode 100644
index 000000000000..6510815f090c
--- /dev/null
+++ b/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.exception.ts
@@ -0,0 +1,13 @@
+import { CustomException } from 'src/utils/custom-exception';
+
+export class WorkflowStatusException extends CustomException {
+  code: WorkflowStatusExceptionCode;
+  constructor(message: string, code: WorkflowStatusExceptionCode) {
+    super(message, code);
+  }
+}
+
+export enum WorkflowStatusExceptionCode {
+  WORKFLOW_RUN_NOT_FOUND = 'WORKFLOW_RUN_NOT_FOUND',
+  INVALID_OPERATION = 'INVALID_OPERATION',
+}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.module.ts b/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.module.ts
new file mode 100644
index 000000000000..14eec4fb10c7
--- /dev/null
+++ b/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.module.ts
@@ -0,0 +1,9 @@
+import { Module } from '@nestjs/common';
+
+import { WorkflowStatusWorkspaceService } from 'src/modules/workflow/workflow-status/workflow-status.workspace-service';
+
+@Module({
+  providers: [WorkflowStatusWorkspaceService],
+  exports: [WorkflowStatusWorkspaceService],
+})
+export class WorkflowStatusModule {}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.workspace-service.ts b/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.workspace-service.ts
new file mode 100644
index 000000000000..949ae0c27e21
--- /dev/null
+++ b/packages/twenty-server/src/modules/workflow/workflow-status/workflow-status.workspace-service.ts
@@ -0,0 +1,92 @@
+import { Injectable } from '@nestjs/common';
+
+import { ActorMetadata } from 'src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type';
+import { TwentyORMManager } from 'src/engine/twenty-orm/twenty-orm.manager';
+import {
+  WorkflowRunStatus,
+  WorkflowRunWorkspaceEntity,
+} from 'src/modules/workflow/common/standard-objects/workflow-run.workspace-entity';
+import {
+  WorkflowStatusException,
+  WorkflowStatusExceptionCode,
+} from 'src/modules/workflow/workflow-status/workflow-status.exception';
+
+@Injectable()
+export class WorkflowStatusWorkspaceService {
+  constructor(private readonly twentyORMManager: TwentyORMManager) {}
+
+  async createWorkflowRun(workflowVersionId: string, createdBy: ActorMetadata) {
+    const workflowRunRepository =
+      await this.twentyORMManager.getRepository<WorkflowRunWorkspaceEntity>(
+        'workflowRun',
+      );
+
+    return (
+      await workflowRunRepository.save({
+        workflowVersionId,
+        createdBy,
+        status: WorkflowRunStatus.NOT_STARTED,
+      })
+    ).id;
+  }
+
+  async startWorkflowRun(workflowRunId: string) {
+    const workflowRunRepository =
+      await this.twentyORMManager.getRepository<WorkflowRunWorkspaceEntity>(
+        'workflowRun',
+      );
+
+    const workflowRunToUpdate = await workflowRunRepository.findOneBy({
+      id: workflowRunId,
+    });
+
+    if (!workflowRunToUpdate) {
+      throw new WorkflowStatusException(
+        'No workflow run to start',
+        WorkflowStatusExceptionCode.WORKFLOW_RUN_NOT_FOUND,
+      );
+    }
+
+    if (workflowRunToUpdate.status !== WorkflowRunStatus.NOT_STARTED) {
+      throw new WorkflowStatusException(
+        'Workflow run already started',
+        WorkflowStatusExceptionCode.INVALID_OPERATION,
+      );
+    }
+
+    return workflowRunRepository.update(workflowRunToUpdate.id, {
+      status: WorkflowRunStatus.RUNNING,
+      startedAt: new Date().toISOString(),
+    });
+  }
+
+  async endWorkflowRun(workflowRunId: string, status: WorkflowRunStatus) {
+    const workflowRunRepository =
+      await this.twentyORMManager.getRepository<WorkflowRunWorkspaceEntity>(
+        'workflowRun',
+      );
+
+    const workflowRunToUpdate = await workflowRunRepository.findOneBy({
+      id: workflowRunId,
+    });
+
+    if (!workflowRunToUpdate) {
+      throw new WorkflowStatusException(
+        'No workflow run to end',
+        WorkflowStatusExceptionCode.WORKFLOW_RUN_NOT_FOUND,
+      );
+    }
+
+    if (workflowRunToUpdate.status !== WorkflowRunStatus.RUNNING) {
+      throw new WorkflowStatusException(
+        'Workflow cannot be ended as it is not running',
+        WorkflowStatusExceptionCode.INVALID_OPERATION,
+      );
+    }
+
+    return workflowRunRepository.update(workflowRunToUpdate.id, {
+      status,
+      endedAt: new Date().toISOString(),
+    });
+  }
+}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-event-trigger.job.ts b/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-event-trigger.job.ts
index 5370d04c1e53..f96e91b14e4f 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-event-trigger.job.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-event-trigger.job.ts
@@ -1,14 +1,18 @@
-import { Logger } from '@nestjs/common';
+import { Scope } from '@nestjs/common';
 
 import { InjectMessageQueue } from 'src/engine/integrations/message-queue/decorators/message-queue.decorator';
 import { Process } from 'src/engine/integrations/message-queue/decorators/process.decorator';
 import { Processor } from 'src/engine/integrations/message-queue/decorators/processor.decorator';
 import { MessageQueue } from 'src/engine/integrations/message-queue/message-queue.constants';
 import { MessageQueueService } from 'src/engine/integrations/message-queue/services/message-queue.service';
+import { FieldActorSource } from 'src/engine/metadata-modules/field-metadata/composite-types/actor.composite-type';
+import { TwentyORMManager } from 'src/engine/twenty-orm/twenty-orm.manager';
+import { WorkflowWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow.workspace-entity';
 import {
   RunWorkflowJobData,
   WorkflowRunnerJob,
 } from 'src/modules/workflow/workflow-runner/workflow-runner.job';
+import { WorkflowStatusWorkspaceService } from 'src/modules/workflow/workflow-status/workflow-status.workspace-service';
 
 export type WorkflowEventTriggerJobData = {
   workspaceId: string;
@@ -16,21 +20,44 @@ export type WorkflowEventTriggerJobData = {
   payload: object;
 };
 
-@Processor(MessageQueue.workflowQueue)
+@Processor({ queueName: MessageQueue.workflowQueue, scope: Scope.REQUEST })
 export class WorkflowEventTriggerJob {
-  private readonly logger = new Logger(WorkflowEventTriggerJob.name);
-
   constructor(
     @InjectMessageQueue(MessageQueue.workflowQueue)
     private readonly messageQueueService: MessageQueueService,
+    private readonly twentyORMManager: TwentyORMManager,
+    private readonly workflowStatusWorkspaceService: WorkflowStatusWorkspaceService,
   ) {}
 
   @Process(WorkflowEventTriggerJob.name)
   async handle(data: WorkflowEventTriggerJobData): Promise<void> {
+    const workflowRepository =
+      await this.twentyORMManager.getRepository<WorkflowWorkspaceEntity>(
+        'workflow',
+      );
+
+    const workflow = await workflowRepository.findOneByOrFail({
+      id: data.workflowId,
+    });
+
+    if (!workflow.publishedVersionId) {
+      throw new Error('Workflow has no published version');
+    }
+
+    const workflowRunId =
+      await this.workflowStatusWorkspaceService.createWorkflowRun(
+        workflow.publishedVersionId,
+        {
+          source: FieldActorSource.WORKFLOW,
+          name: workflow.name,
+        },
+      );
+
     this.messageQueueService.add<RunWorkflowJobData>(WorkflowRunnerJob.name, {
       workspaceId: data.workspaceId,
-      workflowId: data.workflowId,
+      workflowVersionId: workflow.publishedVersionId,
       payload: data.payload,
+      workflowRunId,
     });
   }
 }
diff --git a/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-trigger-job.module.ts b/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-trigger-job.module.ts
index 8d11ad4cb766..4f03c12fd958 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-trigger-job.module.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-trigger/jobs/workflow-trigger-job.module.ts
@@ -1,10 +1,11 @@
 import { Module } from '@nestjs/common';
 
 import { WorkflowRunnerModule } from 'src/modules/workflow/workflow-runner/workflow-runner.module';
+import { WorkflowStatusModule } from 'src/modules/workflow/workflow-status/workflow-status.module';
 import { WorkflowEventTriggerJob } from 'src/modules/workflow/workflow-trigger/jobs/workflow-event-trigger.job';
 
 @Module({
-  imports: [WorkflowRunnerModule],
+  imports: [WorkflowRunnerModule, WorkflowStatusModule],
   providers: [WorkflowEventTriggerJob],
 })
 export class WorkflowTriggerJobModule {}
diff --git a/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.exception.ts b/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.exception.ts
index 2f4621095065..dd15486857ee 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.exception.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.exception.ts
@@ -12,4 +12,5 @@ export enum WorkflowTriggerExceptionCode {
   INVALID_WORKFLOW_TRIGGER = 'INVALID_WORKFLOW_TRIGGER',
   INVALID_WORKFLOW_VERSION = 'INVALID_WORKFLOW_VERSION',
   INVALID_ACTION_TYPE = 'INVALID_ACTION_TYPE',
+  INTERNAL_ERROR = 'INTERNAL_ERROR',
 }
diff --git a/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.service.ts b/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.workspace-service.ts
similarity index 59%
rename from packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.service.ts
rename to packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.workspace-service.ts
index 94b1720884ff..ea661862dd98 100644
--- a/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.service.ts
+++ b/packages/twenty-server/src/modules/workflow/workflow-trigger/workflow-trigger.workspace-service.ts
@@ -1,54 +1,55 @@
 import { Injectable } from '@nestjs/common';
 
-import { TwentyORMGlobalManager } from 'src/engine/twenty-orm/twenty-orm-global.manager';
+import { TwentyORMManager } from 'src/engine/twenty-orm/twenty-orm.manager';
 import { WorkflowEventListenerWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow-event-listener.workspace-entity';
 import { WorkflowWorkspaceEntity } from 'src/modules/workflow/common/standard-objects/workflow.workspace-entity';
 import {
   WorkflowDatabaseEventTrigger,
   WorkflowTriggerType,
 } from 'src/modules/workflow/common/types/workflow-trigger.type';
-import { WorkflowCommonService } from 'src/modules/workflow/common/workflow-common.services';
-import { WorkflowRunnerService } from 'src/modules/workflow/workflow-runner/workflow-runner.service';
+import { WorkflowCommonWorkspaceService } from 'src/modules/workflow/common/workflow-common.workspace-service';
+import { WorkflowRunnerWorkspaceService } from 'src/modules/workflow/workflow-runner/workflow-runner.workspace-service';
 import {
   WorkflowTriggerException,
   WorkflowTriggerExceptionCode,
 } from 'src/modules/workflow/workflow-trigger/workflow-trigger.exception';
 
 @Injectable()
-export class WorkflowTriggerService {
+export class WorkflowTriggerWorkspaceService {
   constructor(
-    private readonly twentyORMGlobalManager: TwentyORMGlobalManager,
-    private readonly workflowCommonService: WorkflowCommonService,
-    private readonly workflowRunnerService: WorkflowRunnerService,
+    private readonly twentyORMManager: TwentyORMManager,
+    private readonly workflowCommonWorkspaceService: WorkflowCommonWorkspaceService,
+    private readonly workflowRunnerWorkspaceService: WorkflowRunnerWorkspaceService,
   ) {}
 
-  async runWorkflowVersion(
-    workspaceId: string,
-    workflowVersionId: string,
-    payload: object,
-  ) {
-    const workflowVersion = await this.workflowCommonService.getWorkflowVersion(
-      workspaceId,
-      workflowVersionId,
-    );
-
-    return await this.workflowRunnerService.run({
-      action: workflowVersion.trigger.nextAction,
-      workspaceId,
-      payload,
-    });
+  async runWorkflowVersion(workflowVersionId: string, payload: object) {
+    const workflowVersion =
+      await this.workflowCommonWorkspaceService.getWorkflowVersion(
+        workflowVersionId,
+      );
+
+    try {
+      return await this.workflowRunnerWorkspaceService.run({
+        action: workflowVersion.trigger.nextAction,
+        payload,
+      });
+    } catch (error) {
+      throw new WorkflowTriggerException(
+        `Error running workflow version ${error}`,
+        WorkflowTriggerExceptionCode.INTERNAL_ERROR,
+      );
+    }
   }
 
-  async enableWorkflowTrigger(workspaceId: string, workflowVersionId: string) {
-    const workflowVersion = await this.workflowCommonService.getWorkflowVersion(
-      workspaceId,
-      workflowVersionId,
-    );
+  async enableWorkflowTrigger(workflowVersionId: string) {
+    const workflowVersion =
+      await this.workflowCommonWorkspaceService.getWorkflowVersion(
+        workflowVersionId,
+      );
 
     switch (workflowVersion.trigger.type) {
       case WorkflowTriggerType.DATABASE_EVENT:
         await this.upsertEventListenerAndPublishVersion(
-          workspaceId,
           workflowVersion.workflowId,
           workflowVersionId,
           workflowVersion.trigger,
@@ -62,7 +63,6 @@ export class WorkflowTriggerService {
   }
 
   private async upsertEventListenerAndPublishVersion(
-    workspaceId: string,
     workflowId: string,
     workflowVersionId: string,
     trigger: WorkflowDatabaseEventTrigger,
@@ -77,8 +77,7 @@ export class WorkflowTriggerService {
     }
 
     const workflowEventListenerRepository =
-      await this.twentyORMGlobalManager.getRepositoryForWorkspace<WorkflowEventListenerWorkspaceEntity>(
-        workspaceId,
+      await this.twentyORMManager.getRepository<WorkflowEventListenerWorkspaceEntity>(
         'workflowEventListener',
       );
 
@@ -87,12 +86,10 @@ export class WorkflowTriggerService {
       eventName,
     });
 
-    const workspaceDataSource =
-      await this.twentyORMGlobalManager.getDataSourceForWorkspace(workspaceId);
+    const workspaceDataSource = await this.twentyORMManager.getDatasource();
 
     const workflowRepository =
-      await this.twentyORMGlobalManager.getRepositoryForWorkspace<WorkflowWorkspaceEntity>(
-        workspaceId,
+      await this.twentyORMManager.getRepository<WorkflowWorkspaceEntity>(
         'workflow',
       );
 
diff --git a/packages/twenty-ui/src/display/banner/components/Banner.tsx b/packages/twenty-ui/src/display/banner/components/Banner.tsx
index f08b15ce0249..8a89a8b209ea 100644
--- a/packages/twenty-ui/src/display/banner/components/Banner.tsx
+++ b/packages/twenty-ui/src/display/banner/components/Banner.tsx
@@ -1,9 +1,10 @@
 import styled from '@emotion/styled';
 
-const StyledBanner = styled.div`
+const StyledBanner = styled.div<{ variant?: BannerVariant }>`
   align-items: center;
   backdrop-filter: blur(5px);
-  background: ${({ theme }) => theme.color.blue};
+  background: ${({ theme, variant }) =>
+    variant === 'danger' ? theme.color.red : theme.color.blue};
   display: flex;
   gap: ${({ theme }) => theme.spacing(3)};
   height: 40px;
@@ -19,4 +20,14 @@ const StyledBanner = styled.div`
   box-sizing: border-box;
 `;
 
-export { StyledBanner as Banner };
+export type BannerVariant = 'danger' | 'default';
+
+export const Banner = ({
+  variant = 'default',
+  children,
+}: {
+  variant?: BannerVariant;
+  children: React.ReactNode;
+} & React.HTMLAttributes<HTMLDivElement>) => (
+  <StyledBanner variant={variant}>{children}</StyledBanner>
+);
diff --git a/packages/twenty-ui/src/display/icon/components/TablerIcons.ts b/packages/twenty-ui/src/display/icon/components/TablerIcons.ts
index 2b5996d9b772..722507d11c96 100644
--- a/packages/twenty-ui/src/display/icon/components/TablerIcons.ts
+++ b/packages/twenty-ui/src/display/icon/components/TablerIcons.ts
@@ -146,6 +146,7 @@ export {
   IconRelationOneToOne,
   IconReload,
   IconRepeat,
+  IconRestore,
   IconRocket,
   IconRotate,
   IconSearch,
@@ -174,4 +175,5 @@ export {
   IconWorld,
   IconX,
 } from '@tabler/icons-react';
+
 export type { TablerIconsProps } from '@tabler/icons-react';
diff --git a/yarn.lock b/yarn.lock
index 179058fe4d29..bac1580e3bc0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9761,6 +9761,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@playwright/test@npm:^1.46.0":
+  version: 1.46.0
+  resolution: "@playwright/test@npm:1.46.0"
+  dependencies:
+    playwright: "npm:1.46.0"
+  bin:
+    playwright: cli.js
+  checksum: 10c0/dced91081efc8b063267626059b37923f44f98132edba906f30281277d919de27c6acf6de082d390ad263112a983f856e7f4bf37722a33cc42f62c5be308bf87
+  languageName: node
+  linkType: hard
+
 "@pnpm/config.env-replace@npm:^1.1.0":
   version: 1.1.0
   resolution: "@pnpm/config.env-replace@npm:1.1.0"
@@ -40191,7 +40202,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"playwright@npm:^1.14.0, playwright@npm:^1.40.1":
+"playwright@npm:1.46.0, playwright@npm:^1.14.0, playwright@npm:^1.46.0":
   version: 1.46.0
   resolution: "playwright@npm:1.46.0"
   dependencies:
@@ -47071,6 +47082,14 @@ __metadata:
   languageName: unknown
   linkType: soft
 
+"twenty-e2e-testing@workspace:packages/twenty-e2e-testing":
+  version: 0.0.0-use.local
+  resolution: "twenty-e2e-testing@workspace:packages/twenty-e2e-testing"
+  dependencies:
+    "@playwright/test": "npm:^1.46.0"
+  languageName: unknown
+  linkType: soft
+
 "twenty-emails@workspace:packages/twenty-emails":
   version: 0.0.0-use.local
   resolution: "twenty-emails@workspace:packages/twenty-emails"
@@ -47440,7 +47459,7 @@ __metadata:
     pg: "npm:^8.11.3"
     pg-boss: "npm:^9.0.3"
     planer: "npm:^1.2.0"
-    playwright: "npm:^1.40.1"
+    playwright: "npm:^1.46.0"
     pluralize: "npm:^8.0.0"
     prettier: "npm:^3.1.1"
     prism-react-renderer: "npm:^2.1.0"