Ability to filter by composite's subfields (#6832)

# This PR - Fix #6425 See https://github.com/twentyhq/twenty/issues/7188 because there's some more work to do. --------- Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
2024-10-08 11:25:42 +02:00
parent af4f3cebb0
commit 4156d7821c
57 changed files with 1424 additions and 972 deletions
--- a/packages/twenty-front/src/modules/settings/data-model/constants/SettingsCompositeFieldTypeConfigs.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/constants/SettingsCompositeFieldTypeConfigs.ts
@ -0,0 +1,190 @@
+import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
+import {
+  FieldActorValue,
+  FieldAddressValue,
+  FieldCurrencyValue,
+  FieldEmailsValue,
+  FieldFullNameValue,
+  FieldLinksValue,
+  FieldLinkValue,
+  FieldPhonesValue,
+} from '@/object-record/record-field/types/FieldMetadata';
+import { SettingsFieldTypeConfig } from '@/settings/data-model/constants/SettingsNonCompositeFieldTypeConfigs';
+import { CompositeFieldType } from '@/settings/data-model/types/CompositeFieldType';
+import {
+  IllustrationIconCurrency,
+  IllustrationIconLink,
+  IllustrationIconMail,
+  IllustrationIconMap,
+  IllustrationIconPhone,
+  IllustrationIconSetting,
+  IllustrationIconUser,
+} from 'twenty-ui';
+import { FieldMetadataType } from '~/generated-metadata/graphql';
+
+export type SettingsCompositeFieldTypeConfig<T> = SettingsFieldTypeConfig<T> & {
+  subFields: (keyof T)[];
+  filterableSubFields: (keyof T)[];
+  labelBySubField: Record<keyof T, string>;
+  exampleValue: T;
+};
+
+type SettingsCompositeFieldTypeConfigArray = Record<
+  CompositeFieldType,
+  SettingsCompositeFieldTypeConfig<any>
+>;
+
+export const SETTINGS_COMPOSITE_FIELD_TYPE_CONFIGS = {
+  [FieldMetadataType.Currency]: {
+    label: 'Currency',
+    Icon: IllustrationIconCurrency,
+    subFields: ['amountMicros', 'currencyCode'],
+    filterableSubFields: ['amountMicros', 'currencyCode'],
+    labelBySubField: {
+      amountMicros: 'Amount',
+      currencyCode: 'Currency',
+    },
+    exampleValue: {
+      amountMicros: 2000000000,
+      currencyCode: CurrencyCode.USD,
+    },
+    category: 'Basic',
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldCurrencyValue>,
+  [FieldMetadataType.Emails]: {
+    label: 'Emails',
+    Icon: IllustrationIconMail,
+    subFields: ['primaryEmail', 'additionalEmails'],
+    filterableSubFields: ['primaryEmail'],
+    labelBySubField: {
+      primaryEmail: 'Primary Email',
+      additionalEmails: 'Additional Emails',
+    },
+    exampleValue: {
+      primaryEmail: 'john@twenty.com',
+      additionalEmails: [
+        'tim@twenty.com',
+        'timapple@twenty.com',
+        'johnappletim@twenty.com',
+      ],
+    },
+    category: 'Basic',
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldEmailsValue>,
+  [FieldMetadataType.Link]: {
+    label: 'Link',
+    Icon: IllustrationIconLink,
+    exampleValue: { url: 'www.twenty.com', label: '' },
+    category: 'Basic',
+    subFields: ['url', 'label'],
+    filterableSubFields: ['url', 'label'],
+    labelBySubField: {
+      url: 'URL',
+      label: 'Label',
+    },
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldLinkValue>,
+  [FieldMetadataType.Links]: {
+    label: 'Links',
+    Icon: IllustrationIconLink,
+    exampleValue: {
+      primaryLinkUrl: 'twenty.com',
+      primaryLinkLabel: '',
+      secondaryLinks: [{ url: 'twenty.com', label: 'Twenty' }],
+    },
+    category: 'Basic',
+    subFields: ['primaryLinkUrl', 'primaryLinkLabel', 'secondaryLinks'],
+    filterableSubFields: ['primaryLinkUrl', 'primaryLinkLabel'],
+    labelBySubField: {
+      primaryLinkUrl: 'Link URL',
+      primaryLinkLabel: 'Link Label',
+      secondaryLinks: 'Secondary Links',
+    },
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldLinksValue>,
+  [FieldMetadataType.Phones]: {
+    label: 'Phones',
+    Icon: IllustrationIconPhone,
+    exampleValue: {
+      primaryPhoneNumber: '234-567-890',
+      primaryPhoneCountryCode: '+1',
+      additionalPhones: [{ number: '234-567-890', countryCode: '+1' }],
+    },
+    subFields: [
+      'primaryPhoneNumber',
+      'primaryPhoneCountryCode',
+      'additionalPhones',
+    ],
+    filterableSubFields: ['primaryPhoneNumber', 'primaryPhoneCountryCode'],
+    labelBySubField: {
+      primaryPhoneNumber: 'Primary Phone Number',
+      primaryPhoneCountryCode: 'Primary Phone Country Code',
+      additionalPhones: 'Additional Phones',
+    },
+    category: 'Basic',
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldPhonesValue>,
+  [FieldMetadataType.FullName]: {
+    label: 'Full Name',
+    Icon: IllustrationIconUser,
+    exampleValue: { firstName: 'John', lastName: 'Doe' },
+    category: 'Advanced',
+    subFields: ['firstName', 'lastName'],
+    filterableSubFields: ['firstName', 'lastName'],
+    labelBySubField: {
+      firstName: 'First Name',
+      lastName: 'Last Name',
+    },
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldFullNameValue>,
+  [FieldMetadataType.Address]: {
+    label: 'Address',
+    Icon: IllustrationIconMap,
+    subFields: [
+      'addressStreet1',
+      'addressStreet2',
+      'addressCity',
+      'addressState',
+      'addressCountry',
+      'addressPostcode',
+      'addressLat',
+      'addressLng',
+    ],
+    filterableSubFields: [
+      'addressStreet1',
+      'addressStreet2',
+      'addressCity',
+      'addressState',
+      'addressCountry',
+      'addressPostcode',
+    ],
+    labelBySubField: {
+      addressStreet1: 'Address 1',
+      addressStreet2: 'Address 2',
+      addressCity: 'City',
+      addressState: 'State',
+      addressCountry: 'Country',
+      addressPostcode: 'Post Code',
+      addressLat: 'Latitude',
+      addressLng: 'Longitude',
+    },
+    exampleValue: {
+      addressStreet1: '456 Oak Street',
+      addressStreet2: 'Unit 3B',
+      addressCity: 'Springfield',
+      addressState: 'California',
+      addressCountry: 'United States',
+      addressPostcode: '90210',
+      addressLat: 34.0522,
+      addressLng: -118.2437,
+    },
+    category: 'Basic',
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldAddressValue>,
+  [FieldMetadataType.Actor]: {
+    label: 'Actor',
+    Icon: IllustrationIconSetting,
+    category: 'Basic',
+    subFields: ['source', 'name', 'workspaceMemberId'],
+    filterableSubFields: ['source', 'name', 'workspaceMemberId'],
+    labelBySubField: {
+      source: 'Source',
+      name: 'Name',
+      workspaceMemberId: 'Workspace Member ID',
+    },
+    exampleValue: { source: 'source', name: 'name', workspaceMemberId: 'id' },
+  } as const satisfies SettingsCompositeFieldTypeConfig<FieldActorValue>,
+} as const satisfies SettingsCompositeFieldTypeConfigArray;
--- a/packages/twenty-front/src/modules/settings/data-model/constants/SettingsFieldTypeConfigs.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/constants/SettingsFieldTypeConfigs.ts
@ -1,196 +1,7 @@
-import {
-  IconComponent,
-  IllustrationIconArray,
-  IllustrationIconCalendarEvent,
-  IllustrationIconCalendarTime,
-  IllustrationIconCurrency,
-  IllustrationIconJson,
-  IllustrationIconLink,
-  IllustrationIconMail,
-  IllustrationIconMap,
-  IllustrationIconNumbers,
-  IllustrationIconOneToMany,
-  IllustrationIconPhone,
-  IllustrationIconSetting,
-  IllustrationIconStar,
-  IllustrationIconTag,
-  IllustrationIconTags,
-  IllustrationIconText,
-  IllustrationIconToggle,
-  IllustrationIconUid,
-  IllustrationIconUser,
-} from 'twenty-ui';
-
-import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
-import { DEFAULT_DATE_VALUE } from '@/settings/data-model/constants/DefaultDateValue';
-import { SettingsFieldTypeCategoryType } from '@/settings/data-model/types/SettingsFieldTypeCategoryType';
-import { SettingsSupportedFieldType } from '@/settings/data-model/types/SettingsSupportedFieldType';
-import { FieldMetadataType } from '~/generated-metadata/graphql';
-
-DEFAULT_DATE_VALUE.setFullYear(DEFAULT_DATE_VALUE.getFullYear() + 2);
-
-export type SettingsFieldTypeConfig = {
-  label: string;
-  Icon: IconComponent;
-  exampleValue?: unknown;
-  category: SettingsFieldTypeCategoryType;
-};
+import { SETTINGS_COMPOSITE_FIELD_TYPE_CONFIGS } from '@/settings/data-model/constants/SettingsCompositeFieldTypeConfigs';
+import { SETTINGS_NON_COMPOSITE_FIELD_TYPE_CONFIGS } from '@/settings/data-model/constants/SettingsNonCompositeFieldTypeConfigs';

 export const SETTINGS_FIELD_TYPE_CONFIGS = {
-  [FieldMetadataType.Uuid]: {
-    label: 'Unique ID',
-    Icon: IllustrationIconUid,
-    exampleValue: '00000000-0000-0000-0000-000000000000',
-    category: 'Advanced',
-  },
-  [FieldMetadataType.Text]: {
-    label: 'Text',
-    Icon: IllustrationIconText,
-    exampleValue:
-      'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum magna enim, dapibus non enim in, lacinia faucibus nunc. Sed interdum ante sed felis facilisis, eget ultricies neque molestie. Mauris auctor, justo eu volutpat cursus, libero erat tempus nulla, non sodales lorem lacus a est.',
-    category: 'Basic',
-  },
-  [FieldMetadataType.Numeric]: {
-    label: 'Numeric',
-    Icon: IllustrationIconNumbers,
-    exampleValue: 2000,
-    category: 'Basic',
-  },
-  [FieldMetadataType.Number]: {
-    label: 'Number',
-    Icon: IllustrationIconNumbers,
-    exampleValue: 2000,
-    category: 'Basic',
-  },
-  [FieldMetadataType.Link]: {
-    label: 'Link',
-    Icon: IllustrationIconLink,
-    exampleValue: { url: 'www.twenty.com', label: '' },
-    category: 'Basic',
-  },
-  [FieldMetadataType.Links]: {
-    label: 'Links',
-    Icon: IllustrationIconLink,
-    exampleValue: { primaryLinkUrl: 'twenty.com', primaryLinkLabel: '' },
-    category: 'Basic',
-  },
-  [FieldMetadataType.Boolean]: {
-    label: 'True/False',
-    Icon: IllustrationIconToggle,
-    exampleValue: true,
-    category: 'Basic',
-  },
-  [FieldMetadataType.DateTime]: {
-    label: 'Date and Time',
-    Icon: IllustrationIconCalendarTime,
-    exampleValue: DEFAULT_DATE_VALUE.toISOString(),
-    category: 'Basic',
-  },
-  [FieldMetadataType.Date]: {
-    label: 'Date',
-    Icon: IllustrationIconCalendarEvent,
-    exampleValue: DEFAULT_DATE_VALUE.toISOString(),
-    category: 'Basic',
-  },
-  [FieldMetadataType.Select]: {
-    label: 'Select',
-    Icon: IllustrationIconTag,
-    category: 'Basic',
-  },
-  [FieldMetadataType.MultiSelect]: {
-    label: 'Multi-select',
-    Icon: IllustrationIconTags,
-    category: 'Basic',
-  },
-  [FieldMetadataType.Currency]: {
-    label: 'Currency',
-    Icon: IllustrationIconCurrency,
-    exampleValue: { amountMicros: 2000000000, currencyCode: CurrencyCode.USD },
-    category: 'Basic',
-  },
-  [FieldMetadataType.Relation]: {
-    label: 'Relation',
-    Icon: IllustrationIconOneToMany,
-    category: 'Relation',
-  },
-  [FieldMetadataType.Email]: {
-    label: 'Email',
-    Icon: IllustrationIconMail,
-    category: 'Basic',
-  },
-  [FieldMetadataType.Emails]: {
-    label: 'Emails',
-    Icon: IllustrationIconMail,
-    exampleValue: { primaryEmail: 'john@twenty.com' },
-    category: 'Basic',
-  },
-  [FieldMetadataType.Phone]: {
-    label: 'Phone',
-    Icon: IllustrationIconPhone,
-    exampleValue: '+1234-567-890',
-    category: 'Basic',
-  },
-  [FieldMetadataType.Phones]: {
-    label: 'Phones',
-    Icon: IllustrationIconPhone,
-    exampleValue: {
-      primaryPhoneNumber: '234-567-890',
-      primaryPhoneCountryCode: '+1',
-    },
-    category: 'Basic',
-  },
-  [FieldMetadataType.Rating]: {
-    label: 'Rating',
-    Icon: IllustrationIconStar,
-    exampleValue: '3',
-    category: 'Basic',
-  },
-  [FieldMetadataType.FullName]: {
-    label: 'Full Name',
-    Icon: IllustrationIconUser,
-    exampleValue: { firstName: 'John', lastName: 'Doe' },
-    category: 'Advanced',
-  },
-  [FieldMetadataType.Address]: {
-    label: 'Address',
-    Icon: IllustrationIconMap,
-    exampleValue: {
-      addressStreet1: '456 Oak Street',
-      addressStreet2: 'Unit 3B',
-      addressCity: 'Springfield',
-      addressState: 'California',
-      addressCountry: 'United States',
-      addressPostcode: '90210',
-      addressLat: 34.0522,
-      addressLng: -118.2437,
-    },
-    category: 'Basic',
-  },
-  [FieldMetadataType.RawJson]: {
-    label: 'JSON',
-    Icon: IllustrationIconJson,
-    exampleValue: { key: 'value' },
-
-    category: 'Basic',
-  },
-  [FieldMetadataType.RichText]: {
-    label: 'System',
-    Icon: IllustrationIconSetting,
-    exampleValue: { key: 'value' },
-    category: 'Basic',
-  },
-  [FieldMetadataType.Actor]: {
-    label: 'System',
-    Icon: IllustrationIconSetting,
-    category: 'Basic',
-  },
-  [FieldMetadataType.Array]: {
-    label: 'Array',
-    Icon: IllustrationIconArray,
-    category: 'Basic',
-    exampleValue: ['value1', 'value2'],
-  },
-} as const satisfies Record<
-  SettingsSupportedFieldType,
-  SettingsFieldTypeConfig
->;
+  ...SETTINGS_COMPOSITE_FIELD_TYPE_CONFIGS,
+  ...SETTINGS_NON_COMPOSITE_FIELD_TYPE_CONFIGS,
+};
--- a/packages/twenty-front/src/modules/settings/data-model/constants/SettingsNonCompositeFieldTypeConfigs.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/constants/SettingsNonCompositeFieldTypeConfigs.ts
@ -0,0 +1,152 @@
+import {
+  IconComponent,
+  IllustrationIconArray,
+  IllustrationIconCalendarEvent,
+  IllustrationIconCalendarTime,
+  IllustrationIconJson,
+  IllustrationIconMail,
+  IllustrationIconNumbers,
+  IllustrationIconOneToMany,
+  IllustrationIconPhone,
+  IllustrationIconSetting,
+  IllustrationIconStar,
+  IllustrationIconTag,
+  IllustrationIconTags,
+  IllustrationIconText,
+  IllustrationIconToggle,
+  IllustrationIconUid,
+} from 'twenty-ui';
+
+import {
+  FieldArrayValue,
+  FieldBooleanValue,
+  FieldDateTimeValue,
+  FieldDateValue,
+  FieldEmailValue,
+  FieldJsonValue,
+  FieldMultiSelectValue,
+  FieldNumberValue,
+  FieldPhoneValue,
+  FieldRatingValue,
+  FieldRelationValue,
+  FieldRichTextValue,
+  FieldSelectValue,
+  FieldTextValue,
+  FieldUUidValue,
+} from '@/object-record/record-field/types/FieldMetadata';
+import { DEFAULT_DATE_VALUE } from '@/settings/data-model/constants/DefaultDateValue';
+import { SettingsFieldTypeCategoryType } from '@/settings/data-model/types/SettingsFieldTypeCategoryType';
+import { SettingsNonCompositeFieldType } from '@/settings/data-model/types/SettingsNonCompositeFieldType';
+import { FieldMetadataType } from '~/generated-metadata/graphql';
+
+DEFAULT_DATE_VALUE.setFullYear(DEFAULT_DATE_VALUE.getFullYear() + 2);
+
+export type SettingsFieldTypeConfig<T> = {
+  label: string;
+  Icon: IconComponent;
+  exampleValue?: T;
+  category: SettingsFieldTypeCategoryType;
+};
+
+type SettingsNonCompositeFieldTypeConfigArray = Record<
+  SettingsNonCompositeFieldType,
+  SettingsFieldTypeConfig<any>
+>;
+
+// TODO: can we derive this from backend definitions ?
+export const SETTINGS_NON_COMPOSITE_FIELD_TYPE_CONFIGS: SettingsNonCompositeFieldTypeConfigArray =
+  {
+    [FieldMetadataType.Uuid]: {
+      label: 'Unique ID',
+      Icon: IllustrationIconUid,
+      exampleValue: '00000000-0000-0000-0000-000000000000',
+      category: 'Advanced',
+    } as const satisfies SettingsFieldTypeConfig<FieldUUidValue>,
+    [FieldMetadataType.Text]: {
+      label: 'Text',
+      Icon: IllustrationIconText,
+      exampleValue:
+        'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum magna enim, dapibus non enim in, lacinia faucibus nunc. Sed interdum ante sed felis facilisis, eget ultricies neque molestie. Mauris auctor, justo eu volutpat cursus, libero erat tempus nulla, non sodales lorem lacus a est.',
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldTextValue>,
+    [FieldMetadataType.Numeric]: {
+      label: 'Numeric',
+      Icon: IllustrationIconNumbers,
+      exampleValue: 2000,
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldNumberValue>,
+    [FieldMetadataType.Number]: {
+      label: 'Number',
+      Icon: IllustrationIconNumbers,
+      exampleValue: 2000,
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldNumberValue>,
+    [FieldMetadataType.Boolean]: {
+      label: 'True/False',
+      Icon: IllustrationIconToggle,
+      exampleValue: true,
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldBooleanValue>,
+    [FieldMetadataType.DateTime]: {
+      label: 'Date and Time',
+      Icon: IllustrationIconCalendarTime,
+      exampleValue: DEFAULT_DATE_VALUE.toISOString(),
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldDateTimeValue>,
+    [FieldMetadataType.Date]: {
+      label: 'Date',
+      Icon: IllustrationIconCalendarEvent,
+      exampleValue: DEFAULT_DATE_VALUE.toISOString(),
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldDateValue>,
+    [FieldMetadataType.Select]: {
+      label: 'Select',
+      Icon: IllustrationIconTag,
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldSelectValue>,
+    [FieldMetadataType.MultiSelect]: {
+      label: 'Multi-select',
+      Icon: IllustrationIconTags,
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldMultiSelectValue>,
+    [FieldMetadataType.Relation]: {
+      label: 'Relation',
+      Icon: IllustrationIconOneToMany,
+      category: 'Relation',
+    } as const satisfies SettingsFieldTypeConfig<FieldRelationValue<any>>,
+    [FieldMetadataType.Email]: {
+      label: 'Email',
+      Icon: IllustrationIconMail,
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldEmailValue>,
+    [FieldMetadataType.Phone]: {
+      label: 'Phone',
+      Icon: IllustrationIconPhone,
+      exampleValue: '+1234-567-890',
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldPhoneValue>,
+    [FieldMetadataType.Rating]: {
+      label: 'Rating',
+      Icon: IllustrationIconStar,
+      exampleValue: 'RATING_3',
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldRatingValue>,
+    [FieldMetadataType.RawJson]: {
+      label: 'JSON',
+      Icon: IllustrationIconJson,
+      exampleValue: { key: 'value' },
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldJsonValue>,
+    [FieldMetadataType.RichText]: {
+      label: 'Rich Text',
+      Icon: IllustrationIconSetting,
+      exampleValue: { key: 'value' },
+      category: 'Basic',
+    } as const satisfies SettingsFieldTypeConfig<FieldRichTextValue>,
+    [FieldMetadataType.Array]: {
+      label: 'Array',
+      Icon: IllustrationIconArray,
+      category: 'Basic',
+      exampleValue: ['value1', 'value2'],
+    } as const satisfies SettingsFieldTypeConfig<FieldArrayValue>,
+  };
--- a/packages/twenty-front/src/modules/settings/data-model/fields/forms/components/SettingsDataModelFieldTypeSelect.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/fields/forms/components/SettingsDataModelFieldTypeSelect.tsx
@ -2,14 +2,13 @@ import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
 import { SettingsCard } from '@/settings/components/SettingsCard';
 import { SETTINGS_FIELD_TYPE_CATEGORIES } from '@/settings/data-model/constants/SettingsFieldTypeCategories';
 import { SETTINGS_FIELD_TYPE_CATEGORY_DESCRIPTIONS } from '@/settings/data-model/constants/SettingsFieldTypeCategoryDescriptions';
-import {
-  SETTINGS_FIELD_TYPE_CONFIGS,
-  SettingsFieldTypeConfig,
-} from '@/settings/data-model/constants/SettingsFieldTypeConfigs';
+import { SETTINGS_FIELD_TYPE_CONFIGS } from '@/settings/data-model/constants/SettingsFieldTypeConfigs';
+import { SettingsFieldTypeConfig } from '@/settings/data-model/constants/SettingsNonCompositeFieldTypeConfigs';
+
 import { useBooleanSettingsFormInitialValues } from '@/settings/data-model/fields/forms/boolean/hooks/useBooleanSettingsFormInitialValues';
 import { useCurrencySettingsFormInitialValues } from '@/settings/data-model/fields/forms/currency/hooks/useCurrencySettingsFormInitialValues';
 import { useSelectSettingsFormInitialValues } from '@/settings/data-model/fields/forms/select/hooks/useSelectSettingsFormInitialValues';
-import { SettingsSupportedFieldType } from '@/settings/data-model/types/SettingsSupportedFieldType';
+import { SettingsFieldType } from '@/settings/data-model/types/SettingsFieldType';
 import { TextInput } from '@/ui/input/components/TextInput';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
@ -23,8 +22,8 @@ import { FieldMetadataType } from '~/generated-metadata/graphql';
 export const settingsDataModelFieldTypeFormSchema = z.object({
  type: z.enum(
    Object.keys(SETTINGS_FIELD_TYPE_CONFIGS) as [
-      SettingsSupportedFieldType,
-      ...SettingsSupportedFieldType[],
+      SettingsFieldType,
+      ...SettingsFieldType[],
    ],
  ),
 });
@ -35,7 +34,7 @@ export type SettingsDataModelFieldTypeFormValues = z.infer<

 type SettingsDataModelFieldTypeSelectProps = {
  className?: string;
-  excludedFieldTypes?: SettingsSupportedFieldType[];
+  excludedFieldTypes?: SettingsFieldType[];
  fieldMetadataItem?: Pick<
    FieldMetadataItem,
    'defaultValue' | 'options' | 'type'
@ -78,11 +77,11 @@ export const SettingsDataModelFieldTypeSelect = ({
  const theme = useTheme();
  const { control } = useFormContext<SettingsDataModelFieldTypeFormValues>();
  const [searchQuery, setSearchQuery] = useState('');
-  const fieldTypeConfigs = Object.entries<SettingsFieldTypeConfig>(
+  const fieldTypeConfigs = Object.entries<SettingsFieldTypeConfig<any>>(
    SETTINGS_FIELD_TYPE_CONFIGS,
  ).filter(
    ([key, config]) =>
-      !excludedFieldTypes.includes(key as SettingsSupportedFieldType) &&
+      !excludedFieldTypes.includes(key as SettingsFieldType) &&
      config.label.toLowerCase().includes(searchQuery.toLowerCase()),
  );

@ -95,7 +94,7 @@ export const SettingsDataModelFieldTypeSelect = ({
  const { resetDefaultValueField: resetSelectDefaultValueField } =
    useSelectSettingsFormInitialValues({ fieldMetadataItem });

-  const resetDefaultValueField = (nextValue: SettingsSupportedFieldType) => {
+  const resetDefaultValueField = (nextValue: SettingsFieldType) => {
    switch (nextValue) {
      case FieldMetadataType.Boolean:
        resetBooleanDefaultValueField();
@ -118,7 +117,7 @@ export const SettingsDataModelFieldTypeSelect = ({
      control={control}
      defaultValue={
        fieldMetadataItem && fieldMetadataItem.type in fieldTypeConfigs
-          ? (fieldMetadataItem.type as SettingsSupportedFieldType)
+          ? (fieldMetadataItem.type as SettingsFieldType)
          : FieldMetadataType.Text
      }
      render={({ field: { onChange } }) => (
@ -147,10 +146,8 @@ export const SettingsDataModelFieldTypeSelect = ({
                      <SettingsCard
                        key={key}
                        onClick={() => {
-                          onChange(key as SettingsSupportedFieldType);
-                          resetDefaultValueField(
-                            key as SettingsSupportedFieldType,
-                          );
+                          onChange(key as SettingsFieldType);
+                          resetDefaultValueField(key as SettingsFieldType);
                          onFieldTypeSelect();
                        }}
                        Icon={
--- a/packages/twenty-front/src/modules/settings/data-model/fields/preview/utils/getCurrencyFieldPreviewValue.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/fields/preview/utils/getCurrencyFieldPreviewValue.ts
@ -16,9 +16,11 @@ export const getCurrencyFieldPreviewValue = ({
 }): FieldCurrencyValue | null => {
  if (fieldMetadataItem.type !== FieldMetadataType.Currency) return null;

-  const placeholderDefaultValue = getSettingsFieldTypeConfig(
+  const currencyFieldTypeConfig = getSettingsFieldTypeConfig(
    FieldMetadataType.Currency,
-  ).exampleValue;
+  );
+
+  const placeholderDefaultValue = currencyFieldTypeConfig.exampleValue;

  return currencyFieldDefaultValueSchema
    .transform((value) => ({
--- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDataType.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDataType.tsx
@ -3,7 +3,7 @@ import styled from '@emotion/styled';
 import { Link } from 'react-router-dom';
 import { IconComponent, IconTwentyStar } from 'twenty-ui';

-import { SettingsSupportedFieldType } from '@/settings/data-model/types/SettingsSupportedFieldType';
+import { SettingsFieldType } from '@/settings/data-model/types/SettingsFieldType';
 import { getSettingsFieldTypeConfig } from '@/settings/data-model/utils/getSettingsFieldTypeConfig';
 import { FieldMetadataType } from '~/generated-metadata/graphql';

@ -11,11 +11,11 @@ type SettingsObjectFieldDataTypeProps = {
  to?: string;
  Icon?: IconComponent;
  label?: string;
-  value: SettingsSupportedFieldType;
+  value: SettingsFieldType;
 };

 const StyledDataType = styled.div<{
-  value: SettingsSupportedFieldType;
+  value: SettingsFieldType;
  to?: string;
 }>`
  align-items: center;
--- a/packages/twenty-front/src/modules/settings/data-model/types/CompositeFieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/CompositeFieldType.ts
@ -0,0 +1,21 @@
+import { FieldType } from '@/settings/data-model/types/FieldType';
+import { PickLiteral } from '~/types/PickLiteral';
+
+// TODO: add to future fullstack shared package
+export const COMPOSITE_FIELD_TYPES = [
+  'CURRENCY',
+  'EMAILS',
+  'LINK',
+  'LINKS',
+  'ADDRESS',
+  'PHONES',
+  'FULL_NAME',
+  'ACTOR',
+] as const;
+
+type CompositeFieldTypeBaseLiteral = (typeof COMPOSITE_FIELD_TYPES)[number];
+
+export type CompositeFieldType = PickLiteral<
+  FieldType,
+  CompositeFieldTypeBaseLiteral
+>;
--- a/packages/twenty-front/src/modules/settings/data-model/types/FieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/FieldType.ts
@ -0,0 +1,3 @@
+import { FieldMetadataType } from '~/generated-metadata/graphql';
+
+export type FieldType = `${FieldMetadataType}`;
--- a/packages/twenty-front/src/modules/settings/data-model/types/NonCompositeFieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/NonCompositeFieldType.ts
@ -0,0 +1,8 @@
+import { CompositeFieldType } from '@/settings/data-model/types/CompositeFieldType';
+import { FieldType } from '@/settings/data-model/types/FieldType';
+import { ExcludeLiteral } from '~/types/ExcludeLiteral';
+
+export type NonCompositeFieldType = ExcludeLiteral<
+  FieldType,
+  CompositeFieldType
+>;
--- a/packages/twenty-front/src/modules/settings/data-model/types/SettingsCompositeFieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/SettingsCompositeFieldType.ts
@ -0,0 +1,8 @@
+import { CompositeFieldType } from '@/settings/data-model/types/CompositeFieldType';
+import { SettingsFieldType } from '@/settings/data-model/types/SettingsFieldType';
+import { PickLiteral } from '~/types/PickLiteral';
+
+export type SettingsCompositeFieldType = PickLiteral<
+  SettingsFieldType,
+  CompositeFieldType
+>;
--- a/packages/twenty-front/src/modules/settings/data-model/types/SettingsExcludedFieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/SettingsExcludedFieldType.ts
@ -0,0 +1,7 @@
+import { FieldType } from '@/settings/data-model/types/FieldType';
+import { PickLiteral } from '~/types/PickLiteral';
+
+export type SettingsExcludedFieldType = PickLiteral<
+  FieldType,
+  'POSITION' | 'TS_VECTOR'
+>;
--- a/packages/twenty-front/src/modules/settings/data-model/types/SettingsFieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/SettingsFieldType.ts
@ -0,0 +1,8 @@
+import { FieldType } from '@/settings/data-model/types/FieldType';
+import { SettingsExcludedFieldType } from '@/settings/data-model/types/SettingsExcludedFieldType';
+import { ExcludeLiteral } from '~/types/ExcludeLiteral';
+
+export type SettingsFieldType = ExcludeLiteral<
+  FieldType,
+  SettingsExcludedFieldType
+>;
--- a/packages/twenty-front/src/modules/settings/data-model/types/SettingsNonCompositeFieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/SettingsNonCompositeFieldType.ts
@ -0,0 +1,8 @@
+import { NonCompositeFieldType } from '@/settings/data-model/types/NonCompositeFieldType';
+import { SettingsExcludedFieldType } from '@/settings/data-model/types/SettingsExcludedFieldType';
+import { ExcludeLiteral } from '~/types/ExcludeLiteral';
+
+export type SettingsNonCompositeFieldType = ExcludeLiteral<
+  NonCompositeFieldType,
+  SettingsExcludedFieldType
+>;
--- a/packages/twenty-front/src/modules/settings/data-model/types/SettingsSupportedFieldType.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/types/SettingsSupportedFieldType.ts
@ -1,6 +0,0 @@
-import { FieldMetadataType } from '~/generated-metadata/graphql';
-
-export type SettingsSupportedFieldType = Exclude<
-  FieldMetadataType,
-  FieldMetadataType.Position | FieldMetadataType.TsVector
->;
--- a/packages/twenty-front/src/modules/settings/data-model/utils/getSettingsFieldTypeConfig.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/utils/getSettingsFieldTypeConfig.ts
@ -1,13 +1,6 @@
 import { SETTINGS_FIELD_TYPE_CONFIGS } from '@/settings/data-model/constants/SettingsFieldTypeConfigs';
-import { SettingsSupportedFieldType } from '@/settings/data-model/types/SettingsSupportedFieldType';
-import { isFieldTypeSupportedInSettings } from '@/settings/data-model/utils/isFieldTypeSupportedInSettings';
-import { FieldMetadataType } from '~/generated-metadata/graphql';
+import { SettingsFieldType } from '@/settings/data-model/types/SettingsFieldType';

-export const getSettingsFieldTypeConfig = <T extends FieldMetadataType>(
-  fieldType: T,
-) =>
-  (isFieldTypeSupportedInSettings(fieldType)
-    ? SETTINGS_FIELD_TYPE_CONFIGS[fieldType]
-    : undefined) as T extends SettingsSupportedFieldType
-    ? (typeof SETTINGS_FIELD_TYPE_CONFIGS)[T]
-    : undefined;
+export const getSettingsFieldTypeConfig = (fieldType: SettingsFieldType) => {
+  return SETTINGS_FIELD_TYPE_CONFIGS[fieldType as SettingsFieldType];
+};
--- a/packages/twenty-front/src/modules/settings/data-model/utils/isFieldTypeSupportedInSettings.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/utils/isFieldTypeSupportedInSettings.ts
@ -1,8 +1,7 @@
 import { SETTINGS_FIELD_TYPE_CONFIGS } from '@/settings/data-model/constants/SettingsFieldTypeConfigs';
-import { SettingsSupportedFieldType } from '@/settings/data-model/types/SettingsSupportedFieldType';
-import { FieldMetadataType } from '~/generated-metadata/graphql';
+import { FieldType } from '@/settings/data-model/types/FieldType';
+import { SettingsFieldType } from '@/settings/data-model/types/SettingsFieldType';

 export const isFieldTypeSupportedInSettings = (
-  fieldType: FieldMetadataType,
-): fieldType is SettingsSupportedFieldType =>
-  fieldType in SETTINGS_FIELD_TYPE_CONFIGS;
+  fieldType: FieldType,
+): fieldType is SettingsFieldType => fieldType in SETTINGS_FIELD_TYPE_CONFIGS;