feat: address composite field (#4492)

Added new Address field input type. --------- Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
2024-03-28 16:50:38 +01:00
parent 22d4af2e0c
commit 3171d0c87b
56 changed files with 1839 additions and 716 deletions
--- a/packages/twenty-front/src/generated-metadata/graphql.ts
+++ b/packages/twenty-front/src/generated-metadata/graphql.ts
@ -265,6 +265,7 @@ export type FieldDeleteResponse = {

 /** Type of the field */
 export enum FieldMetadataType {
+  Address = 'ADDRESS',
  Boolean = 'BOOLEAN',
  Currency = 'CURRENCY',
  DateTime = 'DATE_TIME',
--- a/packages/twenty-front/src/generated/graphql.tsx
+++ b/packages/twenty-front/src/generated/graphql.tsx
@ -179,6 +179,7 @@ export type FieldDeleteResponse = {

 /** Type of the field */
 export enum FieldMetadataType {
+  Address = 'ADDRESS',
  Boolean = 'BOOLEAN',
  Currency = 'CURRENCY',
  DateTime = 'DATE_TIME',
--- a/packages/twenty-front/src/modules/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions.ts
+++ b/packages/twenty-front/src/modules/object-metadata/utils/formatFieldMetadataItemsAsFilterDefinitions.ts
@ -18,6 +18,7 @@ export const formatFieldMetadataItemsAsFilterDefinitions = ({
        FieldMetadataType.Number,
        FieldMetadataType.Link,
        FieldMetadataType.FullName,
+        FieldMetadataType.Address,
        FieldMetadataType.Relation,
        FieldMetadataType.Select,
        FieldMetadataType.Currency,
@ -52,24 +53,32 @@ export const formatFieldMetadataItemAsFilterDefinition = ({
    field.toRelationMetadata?.fromObjectMetadata.namePlural,
  relationObjectMetadataNameSingular:
    field.toRelationMetadata?.fromObjectMetadata.nameSingular,
-  type:
-    field.type === FieldMetadataType.DateTime
-      ? 'DATE_TIME'
-      : field.type === FieldMetadataType.Link
-        ? 'LINK'
-        : field.type === FieldMetadataType.FullName
-          ? 'FULL_NAME'
-          : field.type === FieldMetadataType.Number
-            ? 'NUMBER'
-            : field.type === FieldMetadataType.Currency
-              ? 'CURRENCY'
-              : field.type === FieldMetadataType.Email
-                ? 'TEXT'
-                : field.type === FieldMetadataType.Phone
-                  ? 'TEXT'
-                  : field.type === FieldMetadataType.Relation
-                    ? 'RELATION'
-                    : field.type === FieldMetadataType.Select
-                      ? 'SELECT'
-                      : 'TEXT',
+  type: getFilterType(field.type),
 });
+
+const getFilterType = (fieldType: FieldMetadataType) => {
+  switch (fieldType) {
+    case FieldMetadataType.DateTime:
+      return 'DATE_TIME';
+    case FieldMetadataType.Link:
+      return 'LINK';
+    case FieldMetadataType.FullName:
+      return 'FULL_NAME';
+    case FieldMetadataType.Number:
+      return 'NUMBER';
+    case FieldMetadataType.Currency:
+      return 'CURRENCY';
+    case FieldMetadataType.Email:
+      return 'EMAIL';
+    case FieldMetadataType.Phone:
+      return 'PHONE';
+    case FieldMetadataType.Relation:
+      return 'RELATION';
+    case FieldMetadataType.Select:
+      return 'SELECT';
+    case FieldMetadataType.Address:
+      return 'ADDRESS';
+    default:
+      return 'TEXT';
+  }
+};
--- a/packages/twenty-front/src/modules/object-metadata/utils/mapFieldMetadataToGraphQLQuery.ts
+++ b/packages/twenty-front/src/modules/object-metadata/utils/mapFieldMetadataToGraphQLQuery.ts
@ -106,6 +106,18 @@ ${mapObjectMetadataToGraphQLQuery({
 {
  firstName
  lastName
+}`;
+  } else if (fieldType === 'ADDRESS') {
+    return `${field.name}
+{
+  addressStreet1
+  addressStreet2
+  addressCity
+  addressState
+  addressCountry
+  addressPostcode
+  addressLat
+  addressLng
 }`;
  }

--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/FilterType.ts
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/FilterType.ts
@ -8,4 +8,5 @@ export type FilterType =
  | 'FULL_NAME'
  | 'LINK'
  | 'RELATION'
+  | 'ADDRESS'
  | 'SELECT';
--- a/packages/twenty-front/src/modules/object-record/record-field/components/FieldDisplay.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/components/FieldDisplay.tsx
@ -1,6 +1,7 @@
 import { useContext } from 'react';

 import { FieldContext } from '../contexts/FieldContext';
+import { AddressFieldDisplay } from '../meta-types/display/components/AddressFieldDisplay';
 import { ChipFieldDisplay } from '../meta-types/display/components/ChipFieldDisplay';
 import { CurrencyFieldDisplay } from '../meta-types/display/components/CurrencyFieldDisplay';
 import { DateFieldDisplay } from '../meta-types/display/components/DateFieldDisplay';
@ -13,6 +14,7 @@ import { RelationFieldDisplay } from '../meta-types/display/components/RelationF
 import { SelectFieldDisplay } from '../meta-types/display/components/SelectFieldDisplay';
 import { TextFieldDisplay } from '../meta-types/display/components/TextFieldDisplay';
 import { UuidFieldDisplay } from '../meta-types/display/components/UuidFieldDisplay';
+import { isFieldAddress } from '../types/guards/isFieldAddress';
 import { isFieldCurrency } from '../types/guards/isFieldCurrency';
 import { isFieldDateTime } from '../types/guards/isFieldDateTime';
 import { isFieldEmail } from '../types/guards/isFieldEmail';
@ -55,5 +57,7 @@ export const FieldDisplay = () => {
    <PhoneFieldDisplay />
  ) : isFieldSelect(fieldDefinition) ? (
    <SelectFieldDisplay />
+  ) : isFieldAddress(fieldDefinition) ? (
+    <AddressFieldDisplay />
  ) : null;
 };
--- a/packages/twenty-front/src/modules/object-record/record-field/components/FieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/components/FieldInput.tsx
@ -1,5 +1,6 @@
 import { useContext } from 'react';

+import { AddressFieldInput } from '@/object-record/record-field/meta-types/input/components/AddressFieldInput';
 import { FullNameFieldInput } from '@/object-record/record-field/meta-types/input/components/FullNameFieldInput';
 import { SelectFieldInput } from '@/object-record/record-field/meta-types/input/components/SelectFieldInput';
 import { RecordFieldInputScope } from '@/object-record/record-field/scopes/RecordFieldInputScope';
@ -19,6 +20,7 @@ import { RatingFieldInput } from '../meta-types/input/components/RatingFieldInpu
 import { RelationFieldInput } from '../meta-types/input/components/RelationFieldInput';
 import { TextFieldInput } from '../meta-types/input/components/TextFieldInput';
 import { FieldInputEvent } from '../types/FieldInputEvent';
+import { isFieldAddress } from '../types/guards/isFieldAddress';
 import { isFieldBoolean } from '../types/guards/isFieldBoolean';
 import { isFieldCurrency } from '../types/guards/isFieldCurrency';
 import { isFieldDateTime } from '../types/guards/isFieldDateTime';
@ -127,6 +129,14 @@ export const FieldInput = ({
        <RatingFieldInput onSubmit={onSubmit} />
      ) : isFieldSelect(fieldDefinition) ? (
        <SelectFieldInput onSubmit={onSubmit} onCancel={onCancel} />
+      ) : isFieldAddress(fieldDefinition) ? (
+        <AddressFieldInput
+          onEnter={onEnter}
+          onEscape={onEscape}
+          onClickOutside={onClickOutside}
+          onTab={onTab}
+          onShiftTab={onShiftTab}
+        />
      ) : (
        <></>
      )}
--- a/packages/twenty-front/src/modules/object-record/record-field/hooks/usePersistField.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/hooks/usePersistField.ts
@ -1,6 +1,8 @@
 import { useContext } from 'react';
 import { useRecoilCallback } from 'recoil';

+import { isFieldAddress } from '@/object-record/record-field/types/guards/isFieldAddress';
+import { isFieldAddressValue } from '@/object-record/record-field/types/guards/isFieldAddressValue';
 import { isFieldFullName } from '@/object-record/record-field/types/guards/isFieldFullName';
 import { isFieldFullNameValue } from '@/object-record/record-field/types/guards/isFieldFullNameValue';
 import { isFieldSelect } from '@/object-record/record-field/types/guards/isFieldSelect';
@ -82,6 +84,10 @@ export const usePersistField = () => {
        const fieldIsSelect =
          isFieldSelect(fieldDefinition) && isFieldSelectValue(valueToPersist);

+        const fieldIsAddress =
+          isFieldAddress(fieldDefinition) &&
+          isFieldAddressValue(valueToPersist);
+
        if (
          fieldIsRelation ||
          fieldIsText ||
@ -94,7 +100,8 @@ export const usePersistField = () => {
          fieldIsLink ||
          fieldIsCurrency ||
          fieldIsFullName ||
-          fieldIsSelect
+          fieldIsSelect ||
+          fieldIsAddress
        ) {
          const fieldName = fieldDefinition.metadata.fieldName;
          set(
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/AddressFieldDisplay.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/display/components/AddressFieldDisplay.tsx
@ -0,0 +1,17 @@
+import { useAddressField } from '@/object-record/record-field/meta-types/hooks/useAddressField';
+import { TextDisplay } from '@/ui/field/display/components/TextDisplay';
+
+export const AddressFieldDisplay = () => {
+  const { fieldValue } = useAddressField();
+
+  const content = [
+    fieldValue?.addressStreet1,
+    fieldValue?.addressStreet2,
+    fieldValue?.addressCity,
+    fieldValue?.addressCountry,
+  ]
+    .filter(Boolean)
+    .join(', ');
+
+  return <TextDisplay text={content} />;
+};
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useAddressField.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useAddressField.ts
@ -0,0 +1,57 @@
+import { useContext } from 'react';
+import { useRecoilState, useRecoilValue } from 'recoil';
+
+import { useRecordFieldInput } from '@/object-record/record-field/hooks/useRecordFieldInput';
+import { isFieldAddressValue } from '@/object-record/record-field/types/guards/isFieldAddressValue';
+import { recordStoreFamilySelector } from '@/object-record/record-store/states/selectors/recordStoreFamilySelector';
+import { FieldMetadataType } from '~/generated-metadata/graphql';
+
+import { FieldContext } from '../../contexts/FieldContext';
+import { usePersistField } from '../../hooks/usePersistField';
+import { FieldAddressValue } from '../../types/FieldMetadata';
+import { assertFieldMetadata } from '../../types/guards/assertFieldMetadata';
+import { isFieldAddress } from '../../types/guards/isFieldAddress';
+
+export const useAddressField = () => {
+  const { entityId, fieldDefinition, hotkeyScope } = useContext(FieldContext);
+
+  assertFieldMetadata(
+    FieldMetadataType.Address,
+    isFieldAddress,
+    fieldDefinition,
+  );
+
+  const fieldName = fieldDefinition.metadata.fieldName;
+
+  const [fieldValue, setFieldValue] = useRecoilState<FieldAddressValue>(
+    recordStoreFamilySelector({
+      recordId: entityId,
+      fieldName: fieldName,
+    }),
+  );
+
+  const persistField = usePersistField();
+
+  const persistAddressField = (newValue: FieldAddressValue) => {
+    if (!isFieldAddressValue(newValue)) {
+      return;
+    }
+
+    persistField(newValue);
+  };
+
+  const { setDraftValue, getDraftValueSelector } =
+    useRecordFieldInput<FieldAddressValue>(`${entityId}-${fieldName}`);
+
+  const draftValue = useRecoilValue(getDraftValueSelector());
+
+  return {
+    fieldDefinition,
+    fieldValue,
+    setFieldValue,
+    draftValue,
+    setDraftValue,
+    hotkeyScope,
+    persistAddressField,
+  };
+};
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/AddressFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/AddressFieldInput.tsx
@ -0,0 +1,85 @@
+import { useAddressField } from '@/object-record/record-field/meta-types/hooks/useAddressField';
+import { FieldAddressDraftValue } from '@/object-record/record-field/types/FieldInputDraftValue';
+import { AddressInput } from '@/ui/field/input/components/AddressInput';
+import { FieldInputOverlay } from '@/ui/field/input/components/FieldInputOverlay';
+
+import { usePersistField } from '../../../hooks/usePersistField';
+
+import { FieldInputEvent } from './DateFieldInput';
+
+export type AddressFieldInputProps = {
+  onClickOutside?: FieldInputEvent;
+  onEnter?: FieldInputEvent;
+  onEscape?: FieldInputEvent;
+  onTab?: FieldInputEvent;
+  onShiftTab?: FieldInputEvent;
+};
+
+export const AddressFieldInput = ({
+  onEnter,
+  onEscape,
+  onClickOutside,
+  onTab,
+  onShiftTab,
+}: AddressFieldInputProps) => {
+  const { hotkeyScope, draftValue, setDraftValue } = useAddressField();
+
+  const persistField = usePersistField();
+
+  const convertToAddress = (
+    newAddress: FieldAddressDraftValue | undefined,
+  ): FieldAddressDraftValue => {
+    return {
+      addressStreet1: newAddress?.addressStreet1 ?? '',
+      addressStreet2: newAddress?.addressStreet2 ?? null,
+      addressCity: newAddress?.addressCity ?? null,
+      addressState: newAddress?.addressState ?? null,
+      addressCountry: newAddress?.addressCountry ?? null,
+      addressPostcode: newAddress?.addressPostcode ?? null,
+      addressLat: newAddress?.addressLat ?? null,
+      addressLng: newAddress?.addressLng ?? null,
+    };
+  };
+
+  const handleEnter = (newAddress: FieldAddressDraftValue) => {
+    onEnter?.(() => persistField(convertToAddress(newAddress)));
+  };
+
+  const handleTab = (newAddress: FieldAddressDraftValue) => {
+    onTab?.(() => persistField(convertToAddress(newAddress)));
+  };
+
+  const handleShiftTab = (newAddress: FieldAddressDraftValue) => {
+    onShiftTab?.(() => persistField(convertToAddress(newAddress)));
+  };
+
+  const handleEscape = (newAddress: FieldAddressDraftValue) => {
+    onEscape?.(() => persistField(convertToAddress(newAddress)));
+  };
+
+  const handleClickOutside = (
+    event: MouseEvent | TouchEvent,
+    newAddress: FieldAddressDraftValue,
+  ) => {
+    onClickOutside?.(() => persistField(convertToAddress(newAddress)));
+  };
+
+  const handleChange = (newAddress: FieldAddressDraftValue) => {
+    setDraftValue(convertToAddress(newAddress));
+  };
+
+  return (
+    <FieldInputOverlay>
+      <AddressInput
+        value={convertToAddress(draftValue)}
+        onClickOutside={handleClickOutside}
+        onEnter={handleEnter}
+        onEscape={handleEscape}
+        hotkeyScope={hotkeyScope}
+        onChange={handleChange}
+        onTab={handleTab}
+        onShiftTab={handleShiftTab}
+      />
+    </FieldInputOverlay>
+  );
+};
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/stories/AddressFieldInput.stories.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/stories/AddressFieldInput.stories.tsx
@ -0,0 +1,137 @@
+import { useEffect } from 'react';
+import { Decorator, Meta, StoryObj } from '@storybook/react';
+import { expect, fn, userEvent, waitFor } from '@storybook/test';
+
+import { useAddressField } from '@/object-record/record-field/meta-types/hooks/useAddressField';
+import { FieldAddressDraftValue } from '@/object-record/record-field/types/FieldInputDraftValue';
+import {
+  AddressInput,
+  AddressInputProps,
+} from '@/ui/field/input/components/AddressInput';
+import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
+import { FieldMetadataType } from '~/generated-metadata/graphql';
+
+import { FieldContextProvider } from '../../../__stories__/FieldContextProvider';
+
+const AddressValueSetterEffect = ({
+  value,
+}: {
+  value: FieldAddressDraftValue;
+}) => {
+  const { setFieldValue } = useAddressField();
+
+  useEffect(() => {
+    setFieldValue(value);
+  }, [setFieldValue, value]);
+
+  return <></>;
+};
+
+type AddressInputWithContextProps = AddressInputProps & {
+  value: string;
+  entityId?: string;
+};
+
+const AddressInputWithContext = ({
+  entityId,
+  value,
+  onEnter,
+  onEscape,
+  onClickOutside,
+  onTab,
+  onShiftTab,
+}: AddressInputWithContextProps) => {
+  const setHotKeyScope = useSetHotkeyScope();
+
+  useEffect(() => {
+    setHotKeyScope('hotkey-scope');
+  }, [setHotKeyScope]);
+
+  return (
+    <div>
+      <FieldContextProvider
+        fieldDefinition={{
+          fieldMetadataId: 'text',
+          label: 'Address',
+          type: FieldMetadataType.Address,
+          iconName: 'IconTag',
+          metadata: {
+            fieldName: 'Address',
+            placeHolder: 'Enter text',
+          },
+        }}
+        entityId={entityId}
+      >
+        <AddressValueSetterEffect value={value} />
+        <AddressInput
+          onEnter={onEnter}
+          onEscape={onEscape}
+          onClickOutside={onClickOutside}
+          value={value}
+          hotkeyScope=""
+          onTab={onTab}
+          onShiftTab={onShiftTab}
+        />
+      </FieldContextProvider>
+      <div data-testid="data-field-input-click-outside-div" />
+    </div>
+  );
+};
+
+const enterJestFn = fn();
+const escapeJestfn = fn();
+const clickOutsideJestFn = fn();
+const tabJestFn = fn();
+const shiftTabJestFn = fn();
+
+const clearMocksDecorator: Decorator = (Story, context) => {
+  if (context.parameters.clearMocks === true) {
+    enterJestFn.mockClear();
+    escapeJestfn.mockClear();
+    clickOutsideJestFn.mockClear();
+    tabJestFn.mockClear();
+    shiftTabJestFn.mockClear();
+  }
+  return <Story />;
+};
+
+const meta: Meta = {
+  title: 'UI/Data/Field/Input/AddressInput',
+  component: AddressInputWithContext,
+  args: {
+    value: 'text',
+    onEnter: enterJestFn,
+    onEscape: escapeJestfn,
+    onClickOutside: clickOutsideJestFn,
+    onTab: tabJestFn,
+    onShiftTab: shiftTabJestFn,
+  },
+  argTypes: {
+    onEnter: { control: false },
+    onEscape: { control: false },
+    onClickOutside: { control: false },
+    onTab: { control: false },
+    onShiftTab: { control: false },
+  },
+  decorators: [clearMocksDecorator],
+  parameters: {
+    clearMocks: true,
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof AddressInputWithContext>;
+
+export const Default: Story = {};
+
+export const Enter: Story = {
+  play: async () => {
+    expect(enterJestFn).toHaveBeenCalledTimes(0);
+
+    await waitFor(() => {
+      userEvent.keyboard('{enter}');
+      expect(enterJestFn).toHaveBeenCalledTimes(1);
+    });
+  },
+};
--- a/packages/twenty-front/src/modules/object-record/record-field/types/FieldInputDraftValue.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/types/FieldInputDraftValue.ts
@ -1,5 +1,6 @@
 import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
 import {
+  FieldAddressValue,
  FieldBooleanValue,
  FieldCurrencyValue,
  FieldDateTimeValue,
@ -28,6 +29,16 @@ export type FieldCurrencyDraftValue = {
  amount: string;
 };
 export type FieldFullNameDraftValue = { firstName: string; lastName: string };
+export type FieldAddressDraftValue = {
+  addressStreet1: string;
+  addressStreet2: string | null;
+  addressCity: string | null;
+  addressState: string | null;
+  addressPostcode: string | null;
+  addressCountry: string | null;
+  addressLat: number | null;
+  addressLng: number | null;
+};

 export type FieldInputDraftValue<FieldValue> = FieldValue extends FieldTextValue
  ? FieldTextDraftValue
@ -55,4 +66,6 @@ export type FieldInputDraftValue<FieldValue> = FieldValue extends FieldTextValue
                        ? FieldSelectDraftValue
                        : FieldValue extends FieldRelationValue
                          ? FieldRelationDraftValue
-                          : never;
+                          : FieldValue extends FieldAddressValue
+                            ? FieldAddressDraftValue
+                            : never;
--- a/packages/twenty-front/src/modules/object-record/record-field/types/FieldMetadata.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/types/FieldMetadata.ts
@ -69,6 +69,12 @@ export type FieldRatingMetadata = {
  fieldName: string;
 };

+export type FieldAddressMetadata = {
+  objectMetadataNameSingular?: string;
+  placeHolder: string;
+  fieldName: string;
+};
+
 export type FieldRawJsonMetadata = {
  objectMetadataNameSingular?: string;
  fieldName: string;
@ -109,7 +115,8 @@ export type FieldMetadata =
  | FieldRelationMetadata
  | FieldSelectMetadata
  | FieldTextMetadata
-  | FieldUuidMetadata;
+  | FieldUuidMetadata
+  | FieldAddressMetadata;

 export type FieldTextValue = string;
 export type FieldUUidValue = string;
@ -125,6 +132,16 @@ export type FieldCurrencyValue = {
  amountMicros: number | null;
 };
 export type FieldFullNameValue = { firstName: string; lastName: string };
+export type FieldAddressValue = {
+  addressStreet1: string;
+  addressStreet2: string | null;
+  addressCity: string | null;
+  addressState: string | null;
+  addressPostcode: string | null;
+  addressCountry: string | null;
+  addressLat: number | null;
+  addressLng: number | null;
+};
 export type FieldRatingValue = (typeof RATING_VALUES)[number];
 export type FieldSelectValue = string | null;

--- a/packages/twenty-front/src/modules/object-record/record-field/types/guards/assertFieldMetadata.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/types/guards/assertFieldMetadata.ts
@ -2,6 +2,7 @@ import { FieldMetadataType } from '~/generated-metadata/graphql';

 import { FieldDefinition } from '../FieldDefinition';
 import {
+  FieldAddressMetadata,
  FieldBooleanMetadata,
  FieldCurrencyMetadata,
  FieldDateTimeMetadata,
@ -49,9 +50,11 @@ type AssertFieldMetadataFunction = <
                            ? FieldTextMetadata
                            : E extends 'UUID'
                              ? FieldUuidMetadata
-                              : E extends 'RAW_JSON'
-                                ? FieldRawJsonMetadata
-                                : never,
+                              : E extends 'ADDRESS'
+                                ? FieldAddressMetadata
+                                : E extends 'RAW_JSON'
+                                  ? FieldRawJsonMetadata
+                                  : never,
 >(
  fieldType: E,
  fieldTypeGuard: (
--- a/packages/twenty-front/src/modules/object-record/record-field/types/guards/isFieldAddress.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/types/guards/isFieldAddress.ts
@ -0,0 +1,6 @@
+import { FieldDefinition } from '../FieldDefinition';
+import { FieldAddressMetadata, FieldMetadata } from '../FieldMetadata';
+
+export const isFieldAddress = (
+  field: Pick<FieldDefinition<FieldMetadata>, 'type'>,
+): field is FieldDefinition<FieldAddressMetadata> => field.type === 'ADDRESS';
--- a/packages/twenty-front/src/modules/object-record/record-field/types/guards/isFieldAddressValue.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/types/guards/isFieldAddressValue.ts
@ -0,0 +1,19 @@
+import { z } from 'zod';
+
+import { FieldAddressValue } from '../FieldMetadata';
+
+const addressSchema = z.object({
+  addressStreet1: z.string(),
+  addressStreet2: z.string().nullable(),
+  addressCity: z.string().nullable(),
+  addressState: z.string().nullable(),
+  addressPostcode: z.string().nullable(),
+  addressCountry: z.string().nullable(),
+  addressLat: z.number().nullable(),
+  addressLng: z.number().nullable(),
+});
+
+export const isFieldAddressValue = (
+  fieldValue: unknown,
+): fieldValue is FieldAddressValue =>
+  addressSchema.safeParse(fieldValue).success;
--- a/packages/twenty-front/src/modules/object-record/record-field/utils/isFieldValueEmpty.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/utils/isFieldValueEmpty.ts
@ -1,5 +1,7 @@
 import { FieldDefinition } from '@/object-record/record-field/types/FieldDefinition';
 import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata';
+import { isFieldAddress } from '@/object-record/record-field/types/guards/isFieldAddress';
+import { isFieldAddressValue } from '@/object-record/record-field/types/guards/isFieldAddressValue';
 import { isFieldBoolean } from '@/object-record/record-field/types/guards/isFieldBoolean';
 import { isFieldCurrency } from '@/object-record/record-field/types/guards/isFieldCurrency';
 import { isFieldCurrencyValue } from '@/object-record/record-field/types/guards/isFieldCurrencyValue';
@ -68,6 +70,18 @@ export const isFieldValueEmpty = ({
    return !isFieldLinkValue(fieldValue) || isValueEmpty(fieldValue?.url);
  }

+  if (isFieldAddress(fieldDefinition)) {
+    return (
+      !isFieldAddressValue(fieldValue) ||
+      (isValueEmpty(fieldValue?.addressStreet1) &&
+        isValueEmpty(fieldValue?.addressStreet2) &&
+        isValueEmpty(fieldValue?.addressCity) &&
+        isValueEmpty(fieldValue?.addressState) &&
+        isValueEmpty(fieldValue?.addressPostcode) &&
+        isValueEmpty(fieldValue?.addressCountry))
+    );
+  }
+
  throw new Error(
    `Entity field type not supported in isFieldValueEmpty : ${fieldDefinition.type}}`,
  );
--- a/packages/twenty-front/src/modules/object-record/record-filter/types/ObjectRecordQueryFilter.ts
+++ b/packages/twenty-front/src/modules/object-record/record-filter/types/ObjectRecordQueryFilter.ts
@ -71,6 +71,15 @@ export type FullNameFilter = {
  lastName?: StringFilter;
 };

+export type AddressFilter = {
+  addressStreet1?: StringFilter;
+  addressStreet2?: StringFilter;
+  addressCity?: StringFilter;
+  addressState?: StringFilter;
+  addressCountry?: StringFilter;
+  addressPostcode?: StringFilter;
+};
+
 export type LeafFilter =
  | UUIDFilter
  | StringFilter
@ -80,6 +89,7 @@ export type LeafFilter =
  | URLFilter
  | FullNameFilter
  | BooleanFilter
+  | AddressFilter
  | undefined;

 export type AndObjectRecordFilter = {
--- a/packages/twenty-front/src/modules/object-record/record-filter/utils/isRecordMatchingFilter.ts
+++ b/packages/twenty-front/src/modules/object-record/record-filter/utils/isRecordMatchingFilter.ts
@ -2,6 +2,7 @@ import { isObject } from '@sniptt/guards';

 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
 import {
+  AddressFilter,
  AndObjectRecordFilter,
  BooleanFilter,
  CurrencyFilter,
@ -180,6 +181,30 @@ export const isRecordMatchingFilter = ({
            }))
        );
      }
+      case FieldMetadataType.Address: {
+        const addressFilter = filterValue as AddressFilter;
+
+        const keys = [
+          'addressStreet1',
+          'addressStreet2',
+          'addressCity',
+          'addressState',
+          'addressCountry',
+          'addressPostcode',
+        ] as const;
+
+        return keys.some((key) => {
+          const value = addressFilter[key];
+          if (value === undefined) {
+            return false;
+          }
+
+          return isMatchingStringFilter({
+            stringFilter: value,
+            value: record[filterKey][key],
+          });
+        });
+      }
      case FieldMetadataType.DateTime: {
        return isMatchingDateFilter({
          dateFilter: filterValue as DateFilter,
--- a/packages/twenty-front/src/modules/object-record/utils/generateEmptyFieldValue.ts
+++ b/packages/twenty-front/src/modules/object-record/utils/generateEmptyFieldValue.ts
@ -25,6 +25,18 @@ export const generateEmptyFieldValue = (
        lastName: '',
      };
    }
+    case FieldMetadataType.Address: {
+      return {
+        addressStreet1: '',
+        addressStreet2: '',
+        addressCity: '',
+        addressState: '',
+        addressCountry: '',
+        addressPostcode: '',
+        addressLat: null,
+        addressLng: null,
+      };
+    }
    case FieldMetadataType.DateTime: {
      return null;
    }
--- a/packages/twenty-front/src/modules/settings/data-model/constants/SettingsFieldTypeConfigs.ts
+++ b/packages/twenty-front/src/modules/settings/data-model/constants/SettingsFieldTypeConfigs.ts
@ -8,6 +8,7 @@ import {
  IconKey,
  IconLink,
  IconMail,
+  IconMap,
  IconNumbers,
  IconPhone,
  IconRelationManyToMany,
@ -101,4 +102,18 @@ export const SETTINGS_FIELD_TYPE_CONFIGS: Record<
    Icon: IconUser,
    defaultValue: { firstName: 'John', lastName: 'Doe' },
  },
+  [FieldMetadataType.Address]: {
+    label: 'Address',
+    Icon: IconMap,
+    defaultValue: {
+      addressStreet1: '456 Oak Street',
+      addressStreet2: 'Unit 3B',
+      addressCity: 'Springfield',
+      addressState: 'California',
+      addressCountry: 'United States',
+      addressPostcode: '90210',
+      addressLat: 34.0522,
+      addressLng: -118.2437,
+    },
+  },
 };
--- a/packages/twenty-front/src/modules/settings/data-model/fields/forms/components/SettingsDataModelFieldSettingsFormCard.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/fields/forms/components/SettingsDataModelFieldSettingsFormCard.tsx
@ -66,6 +66,7 @@ const previewableTypes = [
  FieldMetadataType.Rating,
  FieldMetadataType.Relation,
  FieldMetadataType.Text,
+  FieldMetadataType.Address,
 ];

 export const SettingsDataModelFieldSettingsFormCard = ({
--- a/packages/twenty-front/src/modules/ui/display/icon/types/IconComponent.ts
+++ b/packages/twenty-front/src/modules/ui/display/icon/types/IconComponent.ts
@ -1,8 +1,10 @@
 import { FunctionComponent } from 'react';

-export type IconComponent = FunctionComponent<{
+export type IconComponentProps = {
  className?: string;
  color?: string;
  size?: number;
  stroke?: number;
-}>;
+};
+
+export type IconComponent = FunctionComponent<IconComponentProps>;
--- a/packages/twenty-front/src/modules/ui/field/input/components/AddressInput.tsx
+++ b/packages/twenty-front/src/modules/ui/field/input/components/AddressInput.tsx
@ -0,0 +1,254 @@
+import { RefObject, useEffect, useRef, useState } from 'react';
+import { useTheme } from '@emotion/react';
+import styled from '@emotion/styled';
+import { flip, offset, useFloating } from '@floating-ui/react';
+import { Key } from 'ts-key-enum';
+
+import { FieldAddressDraftValue } from '@/object-record/record-field/types/FieldInputDraftValue';
+import { FieldAddressValue } from '@/object-record/record-field/types/FieldMetadata';
+import { CountrySelect } from '@/ui/input/components/internal/country/components/CountrySelect';
+import { TextInput } from '@/ui/input/components/TextInput';
+import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useClickOutsideListener';
+import { isDefined } from '~/utils/isDefined';
+
+const StyledAddressContainer = styled.div`
+  background: ${({ theme }) => theme.background.secondary};
+  border: 1px solid ${({ theme }) => theme.border.color.light};
+  border-radius: ${({ theme }) => theme.border.radius.md};
+  box-shadow: ${({ theme }) => theme.boxShadow.strong};
+
+  padding: 4px 8px;
+
+  width: 100%;
+  min-width: 260px;
+  > div {
+    margin-bottom: 6px;
+  }
+`;
+
+const StyledHalfRowContainer = styled.div`
+  display: flex;
+  gap: 8px;
+`;
+
+export type AddressInputProps = {
+  value: FieldAddressValue;
+  onTab: (newAddress: FieldAddressDraftValue) => void;
+  onShiftTab: (newAddress: FieldAddressDraftValue) => void;
+  onEnter: (newAddress: FieldAddressDraftValue) => void;
+  onEscape: (newAddress: FieldAddressDraftValue) => void;
+  onClickOutside: (
+    event: MouseEvent | TouchEvent,
+    newAddress: FieldAddressDraftValue,
+  ) => void;
+  hotkeyScope: string;
+  clearable?: boolean;
+  onChange?: (updatedValue: FieldAddressDraftValue) => void;
+};
+
+export const AddressInput = ({
+  value,
+  hotkeyScope,
+  onTab,
+  onShiftTab,
+  onEnter,
+  onEscape,
+  onClickOutside,
+  onChange,
+}: AddressInputProps) => {
+  const theme = useTheme();
+
+  const [internalValue, setInternalValue] = useState(value);
+  const addressStreet1InputRef = useRef<HTMLInputElement>(null);
+  const addressStreet2InputRef = useRef<HTMLInputElement>(null);
+  const addressCityInputRef = useRef<HTMLInputElement>(null);
+  const addressStateInputRef = useRef<HTMLInputElement>(null);
+  const addressPostCodeInputRef = useRef<HTMLInputElement>(null);
+
+  const inputRefs: {
+    [key in keyof FieldAddressDraftValue]?: RefObject<HTMLInputElement>;
+  } = {
+    addressStreet1: addressStreet1InputRef,
+    addressStreet2: addressStreet2InputRef,
+    addressCity: addressCityInputRef,
+    addressState: addressStateInputRef,
+    addressPostcode: addressPostCodeInputRef,
+  };
+
+  const [focusPosition, setFocusPosition] =
+    useState<keyof FieldAddressDraftValue>('addressStreet1');
+
+  const wrapperRef = useRef<HTMLDivElement>(null);
+
+  const { refs, floatingStyles } = useFloating({
+    placement: 'top-start',
+    middleware: [
+      flip(),
+      offset({
+        mainAxis: theme.spacingMultiplicator * 2,
+      }),
+    ],
+  });
+
+  const getChangeHandler =
+    (field: keyof FieldAddressDraftValue) => (updatedAddressPart: string) => {
+      const updatedAddress = { ...value, [field]: updatedAddressPart };
+      setInternalValue(updatedAddress);
+      onChange?.(updatedAddress);
+    };
+
+  const getFocusHandler = (fieldName: keyof FieldAddressDraftValue) => () => {
+    setFocusPosition(fieldName);
+
+    inputRefs[fieldName]?.current?.focus();
+  };
+
+  useScopedHotkeys(
+    'tab',
+    () => {
+      const currentFocusPosition = Object.keys(inputRefs).findIndex(
+        (key) => key === focusPosition,
+      );
+      const maxFocusPosition = Object.keys(inputRefs).length - 1;
+
+      const nextFocusPosition = currentFocusPosition + 1;
+
+      const isFocusPositionAfterLast = nextFocusPosition > maxFocusPosition;
+
+      if (isFocusPositionAfterLast) {
+        onTab?.(internalValue);
+      } else {
+        const nextFocusFieldName = Object.keys(inputRefs)[
+          nextFocusPosition
+        ] as keyof FieldAddressDraftValue;
+
+        setFocusPosition(nextFocusFieldName);
+        inputRefs[nextFocusFieldName]?.current?.focus();
+      }
+    },
+    hotkeyScope,
+    [onTab, internalValue, focusPosition],
+  );
+
+  useScopedHotkeys(
+    'shift+tab',
+    () => {
+      const currentFocusPosition = Object.keys(inputRefs).findIndex(
+        (key) => key === focusPosition,
+      );
+
+      const nextFocusPosition = currentFocusPosition - 1;
+
+      const isFocusPositionBeforeFirst = nextFocusPosition < 0;
+
+      if (isFocusPositionBeforeFirst) {
+        onShiftTab?.(internalValue);
+      } else {
+        const nextFocusFieldName = Object.keys(inputRefs)[
+          nextFocusPosition
+        ] as keyof FieldAddressDraftValue;
+
+        setFocusPosition(nextFocusFieldName);
+        inputRefs[nextFocusFieldName]?.current?.focus();
+      }
+    },
+    hotkeyScope,
+    [onTab, internalValue, focusPosition],
+  );
+
+  useScopedHotkeys(
+    Key.Enter,
+    () => {
+      onEnter(internalValue);
+    },
+    hotkeyScope,
+    [onEnter, internalValue],
+  );
+
+  useScopedHotkeys(
+    [Key.Escape],
+    () => {
+      onEscape(internalValue);
+    },
+    hotkeyScope,
+    [onEscape, internalValue],
+  );
+
+  const { useListenClickOutside } = useClickOutsideListener('addressInput');
+
+  useListenClickOutside({
+    refs: [wrapperRef],
+    callback: (event) => {
+      event.stopImmediatePropagation();
+
+      onClickOutside?.(event, internalValue);
+    },
+    enabled: isDefined(onClickOutside),
+  });
+
+  useEffect(() => {
+    setInternalValue(value);
+  }, [value]);
+
+  return (
+    <div ref={refs.setFloating} style={floatingStyles}>
+      <StyledAddressContainer ref={wrapperRef}>
+        <TextInput
+          autoFocus
+          value={internalValue.addressStreet1 ?? ''}
+          ref={inputRefs['addressStreet1']}
+          label="ADDRESS 1"
+          fullWidth
+          onChange={getChangeHandler('addressStreet1')}
+          onFocus={getFocusHandler('addressStreet1')}
+          disableHotkeys
+        />
+        <TextInput
+          value={internalValue.addressStreet2 ?? ''}
+          ref={inputRefs['addressStreet2']}
+          label="ADDRESS 2"
+          fullWidth
+          onChange={getChangeHandler('addressStreet2')}
+          onFocus={getFocusHandler('addressStreet2')}
+          disableHotkeys
+        />
+        <StyledHalfRowContainer>
+          <TextInput
+            value={internalValue.addressCity ?? ''}
+            ref={inputRefs['addressCity']}
+            label="CITY"
+            fullWidth
+            onChange={getChangeHandler('addressCity')}
+            onFocus={getFocusHandler('addressCity')}
+            disableHotkeys
+          />
+          <TextInput
+            value={internalValue.addressState ?? ''}
+            ref={inputRefs['addressState']}
+            label="STATE"
+            fullWidth
+            onChange={getChangeHandler('addressState')}
+            onFocus={getFocusHandler('addressState')}
+            disableHotkeys
+          />
+        </StyledHalfRowContainer>
+        <StyledHalfRowContainer>
+          <TextInput
+            value={internalValue.addressPostcode ?? ''}
+            ref={inputRefs['addressPostcode']}
+            label="POST CODE"
+            fullWidth
+            onChange={getChangeHandler('addressPostcode')}
+            onFocus={getFocusHandler('addressPostcode')}
+            disableHotkeys
+          />
+          <CountrySelect
+            onChange={getChangeHandler('addressCountry')}
+            selectedCountryName={internalValue.addressCountry ?? ''}
+          />
+        </StyledHalfRowContainer>
+      </StyledAddressContainer>
+    </div>
+  );
+};
--- a/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx
+++ b/packages/twenty-front/src/modules/ui/field/input/components/DoubleTextInput.tsx
@ -13,7 +13,7 @@ import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside';
 import { isDefined } from '~/utils/isDefined';

-import { StyledInput } from './TextInput';
+import { StyledTextInput } from './TextInput';

 const StyledContainer = styled.div`
  align-items: center;
@ -174,7 +174,7 @@ export const DoubleTextInput = ({

  return (
    <StyledContainer ref={containerRef}>
-      <StyledInput
+      <StyledTextInput
        autoComplete="off"
        autoFocus
        onFocus={() => setFocusPosition('left')}
@ -188,7 +188,7 @@ export const DoubleTextInput = ({
          handleOnPaste(event)
        }
      />
-      <StyledInput
+      <StyledTextInput
        autoComplete="off"
        onFocus={() => setFocusPosition('right')}
        ref={secondValueInputRef}
--- a/packages/twenty-front/src/modules/ui/field/input/components/PhoneInput.tsx
+++ b/packages/twenty-front/src/modules/ui/field/input/components/PhoneInput.tsx
@ -3,7 +3,7 @@ import ReactPhoneNumberInput from 'react-phone-number-input';
 import styled from '@emotion/styled';

 import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents';
-import { CountryPickerDropdownButton } from '@/ui/input/components/internal/phone/components/CountryPickerDropdownButton';
+import { PhoneCountryPickerDropdownButton } from '@/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton';

 import 'react-phone-number-input/style.css';

@ -102,7 +102,7 @@ export const PhoneInput = ({
        onChange={handleChange}
        international={true}
        withCountryCallingCode={true}
-        countrySelectComponent={CountryPickerDropdownButton}
+        countrySelectComponent={PhoneCountryPickerDropdownButton}
      />
    </StyledContainer>
  );
--- a/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx
+++ b/packages/twenty-front/src/modules/ui/field/input/components/TextInput.tsx
@ -4,7 +4,7 @@ import styled from '@emotion/styled';
 import { useRegisterInputEvents } from '@/object-record/record-field/meta-types/input/hooks/useRegisterInputEvents';
 import { TEXT_INPUT_STYLE } from '@/ui/theme/constants/TextInputStyle';

-export const StyledInput = styled.input`
+export const StyledTextInput = styled.input`
  margin: 0;
  ${TEXT_INPUT_STYLE}
  width: 100%;
@ -60,7 +60,7 @@ export const TextInput = ({
  });

  return (
-    <StyledInput
+    <StyledTextInput
      autoComplete="off"
      ref={wrapperRef}
      placeholder={placeholder}
--- a/packages/twenty-front/src/modules/ui/input/components/EntityTitleDoubleTextInput.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/EntityTitleDoubleTextInput.tsx
@ -1,7 +1,7 @@
 import { ChangeEvent } from 'react';
 import styled from '@emotion/styled';

-import { StyledInput } from '@/ui/field/input/components/TextInput';
+import { StyledTextInput as UIStyledTextInput } from '@/ui/field/input/components/TextInput';
 import { ComputeNodeDimensions } from '@/ui/utilities/dimensions/components/ComputeNodeDimensions';
 import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';

@ -23,7 +23,7 @@ const StyledDoubleTextContainer = styled.div`
  text-align: center;
 `;

-const StyledTextInput = styled(StyledInput)`
+const StyledTextInput = styled(UIStyledTextInput)`
  margin: 0 ${({ theme }) => theme.spacing(0.5)};
  padding: 0;
  width: ${({ width }) => (width ? `${width}px` : 'auto')};
--- a/packages/twenty-front/src/modules/ui/input/components/Select.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/Select.tsx
@ -1,4 +1,4 @@
-import { useMemo, useState } from 'react';
+import { useMemo, useRef, useState } from 'react';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';

@ -10,6 +10,7 @@ import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/Dropdow
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
+import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useClickOutsideListener';

 import { SelectHotkeyScope } from '../types/SelectHotkeyScope';

@ -43,6 +44,7 @@ const StyledControlContainer = styled.div<{ disabled?: boolean }>`
  align-items: center;
  background-color: ${({ theme }) => theme.background.transparent.lighter};
  border: 1px solid ${({ theme }) => theme.border.color.medium};
+  box-sizing: border-box;
  border-radius: ${({ theme }) => theme.border.radius.sm};
  color: ${({ disabled, theme }) =>
    disabled ? theme.font.color.tertiary : theme.font.color.primary};
@ -88,6 +90,8 @@ export const Select = <Value extends string | number | null>({
  value,
  withSearchInput,
 }: SelectProps<Value>) => {
+  const selectContainerRef = useRef<HTMLDivElement>(null);
+
  const theme = useTheme();
  const [searchInputValue, setSearchInputValue] = useState('');

@ -109,6 +113,15 @@ export const Select = <Value extends string | number | null>({

  const { closeDropdown } = useDropdown(dropdownId);

+  const { useListenClickOutside } = useClickOutsideListener(dropdownId);
+
+  useListenClickOutside({
+    refs: [selectContainerRef],
+    callback: () => {
+      closeDropdown();
+    },
+  });
+
  const selectControl = (
    <StyledControlContainer disabled={isDisabled}>
      <StyledControlLabel>
@ -133,6 +146,7 @@ export const Select = <Value extends string | number | null>({
      fullWidth={fullWidth}
      tabIndex={0}
      onBlur={onBlur}
+      ref={selectContainerRef}
    >
      {!!label && <StyledLabel>{label}</StyledLabel>}
      {isDisabled ? (
--- a/packages/twenty-front/src/modules/ui/input/components/TextInput.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/TextInput.tsx
@ -20,20 +20,6 @@ import { useCombinedRefs } from '~/hooks/useCombinedRefs';

 import { InputHotkeyScope } from '../types/InputHotkeyScope';

-export type TextInputComponentProps = Omit<
-  InputHTMLAttributes<HTMLInputElement>,
-  'onChange' | 'onKeyDown'
-> & {
-  className?: string;
-  label?: string;
-  onChange?: (text: string) => void;
-  fullWidth?: boolean;
-  disableHotkeys?: boolean;
-  error?: string;
-  RightIcon?: IconComponent;
-  onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
-};
-
 const StyledContainer = styled.div<Pick<TextInputComponentProps, 'fullWidth'>>`
  display: inline-flex;
  flex-direction: column;
@ -110,6 +96,21 @@ const StyledTrailingIcon = styled.div`

 const INPUT_TYPE_PASSWORD = 'password';

+export type TextInputComponentProps = Omit<
+  InputHTMLAttributes<HTMLInputElement>,
+  'onChange' | 'onKeyDown'
+> & {
+  className?: string;
+  label?: string;
+  onChange?: (text: string) => void;
+  fullWidth?: boolean;
+  disableHotkeys?: boolean;
+  error?: string;
+  RightIcon?: IconComponent;
+  onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+  onBlur?: () => void;
+};
+
 const TextInputComponent = (
  {
    className,
@ -163,6 +164,7 @@ const TextInputComponent = (
      inputRef.current?.blur();
    },
    InputHotkeyScope.TextInput,
+    { enabled: !disableHotkeys },
  );

  const [passwordVisible, setPasswordVisible] = useState(false);
--- a/packages/twenty-front/src/modules/ui/input/components/internal/country/components/CountrySelect.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/country/components/CountrySelect.tsx
@ -0,0 +1,37 @@
+import { useMemo } from 'react';
+
+import { IconComponentProps } from '@/ui/display/icon/types/IconComponent';
+import { SELECT_COUNTRY_DROPDOWN_ID } from '@/ui/input/components/internal/country/constants/SelectCountryDropdownId';
+import { useCountries } from '@/ui/input/components/internal/hooks/useCountries';
+import { Select, SelectOption } from '@/ui/input/components/Select';
+
+export const CountrySelect = ({
+  selectedCountryName,
+  onChange,
+}: {
+  selectedCountryName: string;
+  onChange: (countryCode: string) => void;
+}) => {
+  const countries = useCountries();
+
+  const options: SelectOption<string>[] = useMemo(() => {
+    return countries.map<SelectOption<string>>(({ countryName, Flag }) => ({
+      label: countryName,
+      value: countryName,
+      Icon: (props: IconComponentProps) =>
+        Flag({ width: props.size, height: props.size }), // TODO : improve this ?
+    }));
+  }, [countries]);
+
+  return (
+    <Select
+      fullWidth
+      dropdownId={SELECT_COUNTRY_DROPDOWN_ID}
+      options={options}
+      label="COUNTRY"
+      withSearchInput
+      onChange={onChange}
+      value={selectedCountryName}
+    />
+  );
+};
--- a/packages/twenty-front/src/modules/ui/input/components/internal/country/constants/SelectCountryDropdownId.ts
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/country/constants/SelectCountryDropdownId.ts
@ -0,0 +1 @@
+export const SELECT_COUNTRY_DROPDOWN_ID = 'select-country-picker';
--- a/packages/twenty-front/src/modules/ui/input/components/internal/hooks/useCountries.ts
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/hooks/useCountries.ts
@ -0,0 +1,37 @@
+import { useMemo } from 'react';
+import { hasFlag } from 'country-flag-icons';
+import * as Flags from 'country-flag-icons/react/3x2';
+import { getCountries, getCountryCallingCode } from 'libphonenumber-js';
+
+import { Country } from '@/ui/input/components/internal/types/Country';
+
+export const useCountries = () => {
+  return useMemo<Country[]>(() => {
+    const regionNamesInEnglish = new Intl.DisplayNames(['en'], {
+      type: 'region',
+    });
+
+    const countryCodes = getCountries();
+
+    return countryCodes.reduce<Country[]>((result, countryCode) => {
+      const countryName = regionNamesInEnglish.of(countryCode);
+
+      if (!countryName) return result;
+
+      if (!hasFlag(countryCode)) return result;
+
+      const Flag = Flags[countryCode];
+
+      const callingCode = getCountryCallingCode(countryCode);
+
+      result.push({
+        countryCode,
+        countryName,
+        callingCode,
+        Flag,
+      });
+
+      return result;
+    }, []);
+  }, []);
+};
--- a/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton.tsx
@ -1,19 +1,17 @@
-import { useEffect, useMemo, useState } from 'react';
-import { getCountries, getCountryCallingCode } from 'react-phone-number-input';
+import { useEffect, useState } from 'react';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
-import { hasFlag } from 'country-flag-icons';
-import * as Flags from 'country-flag-icons/react/3x2';
-import { CountryCallingCode } from 'libphonenumber-js';

 import { IconChevronDown, IconWorld } from '@/ui/display/icon';
+import { useCountries } from '@/ui/input/components/internal/hooks/useCountries';
+import { Country } from '@/ui/input/components/internal/types/Country';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { isDefined } from '~/utils/isDefined';

 import { CountryPickerHotkeyScope } from '../types/CountryPickerHotkeyScope';

-import { CountryPickerDropdownSelect } from './CountryPickerDropdownSelect';
+import { PhoneCountryPickerDropdownSelect } from './PhoneCountryPickerDropdownSelect';

 import 'react-phone-number-input/style.css';

@ -57,14 +55,7 @@ const StyledIconContainer = styled.div`
  }
 `;

-export type Country = {
-  countryCode: string;
-  countryName: string;
-  callingCode: CountryCallingCode;
-  Flag: Flags.FlagComponent;
-};
-
-export const CountryPickerDropdownButton = ({
+export const PhoneCountryPickerDropdownButton = ({
  value,
  onChange,
 }: {
@ -82,34 +73,7 @@ export const CountryPickerDropdownButton = ({
    closeDropdown();
  };

-  const countries = useMemo<Country[]>(() => {
-    const regionNamesInEnglish = new Intl.DisplayNames(['en'], {
-      type: 'region',
-    });
-
-    const countryCodes = getCountries();
-
-    return countryCodes.reduce<Country[]>((result, countryCode) => {
-      const countryName = regionNamesInEnglish.of(countryCode);
-
-      if (!countryName) return result;
-
-      if (!hasFlag(countryCode)) return result;
-
-      const Flag = Flags[countryCode];
-
-      const callingCode = getCountryCallingCode(countryCode);
-
-      result.push({
-        countryCode,
-        countryName,
-        callingCode,
-        Flag,
-      });
-
-      return result;
-    }, []);
-  }, []);
+  const countries = useCountries();

  useEffect(() => {
    const country = countries.find(({ countryCode }) => countryCode === value);
@ -132,7 +96,7 @@ export const CountryPickerDropdownButton = ({
        </StyledDropdownButtonContainer>
      }
      dropdownComponents={
-        <CountryPickerDropdownSelect
+        <PhoneCountryPickerDropdownSelect
          countries={countries}
          selectedCountry={selectedCountry}
          onChange={handleChange}
--- a/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownSelect.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownSelect.tsx
@ -1,6 +1,7 @@
 import { useMemo, useState } from 'react';
 import styled from '@emotion/styled';

+import { Country } from '@/ui/input/components/internal/types/Country';
 import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
@ -8,8 +9,6 @@ import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownM
 import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
 import { MenuItemSelectAvatar } from '@/ui/navigation/menu-item/components/MenuItemSelectAvatar';

-import { Country } from './CountryPickerDropdownButton';
-
 import 'react-phone-number-input/style.css';

 const StyledIconContainer = styled.div`
@ -27,7 +26,7 @@ const StyledIconContainer = styled.div`
  }
 `;

-export const CountryPickerDropdownSelect = ({
+export const PhoneCountryPickerDropdownSelect = ({
  countries,
  selectedCountry,
  onChange,
--- a/packages/twenty-front/src/modules/ui/input/components/internal/types/Country.ts
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/types/Country.ts
@ -0,0 +1,9 @@
+import * as Flags from 'country-flag-icons/react/3x2';
+import { CountryCallingCode } from 'libphonenumber-js';
+
+export type Country = {
+  countryCode: string;
+  countryName: string;
+  callingCode: CountryCallingCode;
+  Flag: Flags.FlagComponent;
+};
--- a/packages/twenty-server/src/database/typeorm-seeds/workspace/companies.ts
+++ b/packages/twenty-server/src/database/typeorm-seeds/workspace/companies.ts
@ -29,7 +29,6 @@ export const seedCompanies = async (
      'id',
      'name',
      'domainName',
-      'address',
      'position',
    ])
    .orIgnore()
@ -38,91 +37,78 @@ export const seedCompanies = async (
        id: DEV_SEED_COMPANY_IDS.LINKEDIN,
        name: 'Linkedin',
        domainName: 'linkedin.com',
-        address: '',
        position: 1,
      },
      {
        id: DEV_SEED_COMPANY_IDS.FACEBOOK,
        name: 'Facebook',
        domainName: 'facebook.com',
-        address: '',
        position: 2,
      },
      {
        id: DEV_SEED_COMPANY_IDS.QONTO,
        name: 'Qonto',
        domainName: 'qonto.com',
-        address: '',
        position: 3,
      },
      {
        id: DEV_SEED_COMPANY_IDS.MICROSOFT,
        name: 'Microsoft',
        domainName: 'microsoft.com',
-        address: '',
        position: 4,
      },
      {
        id: DEV_SEED_COMPANY_IDS.AIRBNB,
        name: 'Airbnb',
        domainName: 'airbnb.com',
-        address: '',
        position: 5,
      },
      {
        id: DEV_SEED_COMPANY_IDS.GOOGLE,
        name: 'Google',
        domainName: 'google.com',
-        address: '',
        position: 6,
      },
      {
        id: DEV_SEED_COMPANY_IDS.NETFLIX,
        name: 'Netflix',
        domainName: 'netflix.com',
-        address: '',
        position: 7,
      },
      {
        id: DEV_SEED_COMPANY_IDS.LIBEO,
        name: 'Libeo',
        domainName: 'libeo.io',
-        address: '',
        position: 8,
      },
      {
        id: DEV_SEED_COMPANY_IDS.CLAAP,
        name: 'Claap',
        domainName: 'claap.io',
-        address: '',
        position: 9,
      },
      {
        id: DEV_SEED_COMPANY_IDS.HASURA,
        name: 'Hasura',
        domainName: 'hasura.io',
-        address: '',
        position: 10,
      },
      {
        id: DEV_SEED_COMPANY_IDS.WEWORK,
        name: 'Wework',
        domainName: 'wework.com',
-        address: '',
        position: 11,
      },
      {
        id: DEV_SEED_COMPANY_IDS.SAMSUNG,
        name: 'Samsung',
        domainName: 'samsung.com',
-        address: '',
        position: 12,
      },
      {
        id: DEV_SEED_COMPANY_IDS.ALGOLIA,
        name: 'Algolia',
        domainName: 'algolia.com',
-        address: '',
        position: 13,
      },
    ])
--- a/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/type-definitions.generator.ts
+++ b/packages/twenty-server/src/engine/api/graphql/workspace-schema-builder/type-definitions.generator.ts
@ -9,6 +9,7 @@ import { fullNameObjectDefinition } from 'src/engine/metadata-modules/field-meta
 import { currencyObjectDefinition } from 'src/engine/metadata-modules/field-metadata/composite-types/currency.composite-type';
 import { linkObjectDefinition } from 'src/engine/metadata-modules/field-metadata/composite-types/link.composite-type';
 import { EnumTypeDefinitionFactory } from 'src/engine/api/graphql/workspace-schema-builder/factories/enum-type-definition.factory';
+import { addressObjectDefinition } from 'src/engine/metadata-modules/field-metadata/composite-types/address.composite-type';

 import { TypeDefinitionsStorage } from './storages/type-definitions.storage';
 import {
@ -68,7 +69,8 @@ export class TypeDefinitionsGenerator {
      currencyObjectDefinition,
      linkObjectDefinition,
      fullNameObjectDefinition,
-    ];
+      addressObjectDefinition,
+    ] satisfies ObjectMetadataInterface[];

    this.logger.log(
      `Generating staticObjects: [${staticObjectMetadataCollection
--- a/packages/twenty-server/src/engine/api/rest/api-rest-query-builder/utils/map-field-metadata-to-graphql-query.utils.ts
+++ b/packages/twenty-server/src/engine/api/rest/api-rest-query-builder/utils/map-field-metadata-to-graphql-query.utils.ts
@ -104,5 +104,19 @@ export const mapFieldMetadataToGraphqlQuery = (
        lastName
      }
    `;
+  } else if (fieldType === FieldMetadataType.ADDRESS) {
+    return `
+      ${field.name}
+      {
+        addressStreet1
+        addressStreet2
+        addressCity
+        addressPostcode
+        addressState
+        addressCountry
+        addressLat
+        addressLng
+      }
+    `;
  }
 };
--- a/packages/twenty-server/src/engine/core-modules/open-api/utils/components.utils.ts
+++ b/packages/twenty-server/src/engine/core-modules/open-api/utils/components.utils.ts
@ -57,6 +57,7 @@ const getSchemaComponentsProperties = (
      case FieldMetadataType.LINK:
      case FieldMetadataType.CURRENCY:
      case FieldMetadataType.FULL_NAME:
+      case FieldMetadataType.ADDRESS:
        itemProperty = {
          type: 'object',
          properties: Object.keys(field.targetColumnMap).reduce(
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/address.composite-type.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/address.composite-type.ts
@ -0,0 +1,195 @@
+import { FieldMetadataInterface } from 'src/engine/metadata-modules/field-metadata/interfaces/field-metadata.interface';
+import { ObjectMetadataInterface } from 'src/engine/metadata-modules/field-metadata/interfaces/object-metadata.interface';
+
+import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
+import { generateTargetColumnMap } from 'src/engine/metadata-modules/field-metadata/utils/generate-target-column-map.util';
+
+export const addressFields = (
+  fieldMetadata?: FieldMetadataInterface,
+): FieldMetadataInterface[] => {
+  const inferredFieldMetadata = fieldMetadata as
+    | FieldMetadataInterface<FieldMetadataType.ADDRESS>
+    | undefined;
+  const targetColumnMap = inferredFieldMetadata
+    ? generateTargetColumnMap(
+        inferredFieldMetadata.type,
+        inferredFieldMetadata.isCustom ?? false,
+        inferredFieldMetadata.name,
+      )
+    : {
+        addressStreet1: 'addressStreet1',
+        addressStreet2: 'addressStreet2',
+        addressCity: 'addressCity',
+        addressPostcode: 'addressPostcode',
+        addressState: 'addressState',
+        addressCountry: 'addressCountry',
+        addressLat: 'addressLat',
+        addressLng: 'addressLng',
+      };
+
+  return [
+    {
+      id: 'addressStreet1',
+      type: FieldMetadataType.TEXT,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressStreet1',
+      label: 'Address',
+      targetColumnMap: {
+        value: targetColumnMap.addressStreet1,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressStreet1 ?? undefined,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.TEXT>,
+    {
+      id: 'addressStreet2',
+      type: FieldMetadataType.TEXT,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressStreet2',
+      label: 'Address 2',
+      targetColumnMap: {
+        value: targetColumnMap.addressStreet2,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressStreet2 ?? null,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.TEXT>,
+    {
+      id: 'addressCity',
+      type: FieldMetadataType.TEXT,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressCity',
+      label: 'City',
+      targetColumnMap: {
+        value: targetColumnMap.addressCity,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressCity ?? null,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.TEXT>,
+    {
+      id: 'addressPostcode',
+      type: FieldMetadataType.TEXT,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressPostcode',
+      label: 'Postcode',
+      targetColumnMap: {
+        value: targetColumnMap.addressPostcode,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressPostcode ?? null,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.TEXT>,
+    {
+      id: 'addressState',
+      type: FieldMetadataType.TEXT,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressState',
+      label: 'State',
+      targetColumnMap: {
+        value: targetColumnMap.addressState,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressState ?? null,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.TEXT>,
+    {
+      id: 'addressCountry',
+      type: FieldMetadataType.TEXT,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressCountry',
+      label: 'Country',
+      targetColumnMap: {
+        value: targetColumnMap.addressCountry,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressCountry ?? null,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.TEXT>,
+    {
+      id: 'addressLat',
+      type: FieldMetadataType.NUMBER,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressLat',
+      label: 'Latitude',
+      targetColumnMap: {
+        value: targetColumnMap.addressLat,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressLat ?? null,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.NUMBER>,
+    {
+      id: 'addressLng',
+      type: FieldMetadataType.NUMBER,
+      objectMetadataId: FieldMetadataType.ADDRESS.toString(),
+      name: 'addressLng',
+      label: 'Longitude',
+      targetColumnMap: {
+        value: targetColumnMap.addressLng,
+      },
+      isNullable: true,
+      ...(inferredFieldMetadata
+        ? {
+            defaultValue:
+              inferredFieldMetadata.defaultValue?.addressLng ?? null,
+          }
+        : {}),
+    } satisfies FieldMetadataInterface<FieldMetadataType.NUMBER>,
+  ];
+};
+
+export const addressObjectDefinition = {
+  id: FieldMetadataType.ADDRESS.toString(),
+  nameSingular: 'address',
+  namePlural: 'address',
+  labelSingular: 'Address',
+  labelPlural: 'Addresses',
+  targetTableName: '',
+  fields: addressFields(),
+  fromRelations: [],
+  toRelations: [],
+  isActive: true,
+  isSystem: true,
+  isCustom: false,
+  isRemote: false,
+} satisfies ObjectMetadataInterface;
+
+export type AddressMetadata = {
+  addressStreet1: string;
+  addressStreet2: string;
+  addressCity: string;
+  addressState: string;
+  addressZipCode: string;
+  addressCountry: string;
+  addressLat: number;
+  addressLng: number;
+};
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/index.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/composite-types/index.ts
@ -4,6 +4,7 @@ import { currencyFields } from 'src/engine/metadata-modules/field-metadata/compo
 import { fullNameFields } from 'src/engine/metadata-modules/field-metadata/composite-types/full-name.composite-type';
 import { linkFields } from 'src/engine/metadata-modules/field-metadata/composite-types/link.composite-type';
 import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
+import { addressFields } from 'src/engine/metadata-modules/field-metadata/composite-types/address.composite-type';

 export type CompositeFieldsDefinitionFunction = (
  fieldMetadata?: FieldMetadataInterface,
@ -16,4 +17,5 @@ export const compositeDefinitions = new Map<
  [FieldMetadataType.LINK, linkFields],
  [FieldMetadataType.CURRENCY, currencyFields],
  [FieldMetadataType.FULL_NAME, fullNameFields],
+  [FieldMetadataType.ADDRESS, addressFields],
 ]);
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/dtos/default-value.input.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/dtos/default-value.input.ts
@ -6,6 +6,7 @@ import {
  IsNotEmpty,
  IsNumber,
  IsNumberString,
+  IsString,
  Matches,
  ValidateIf,
 } from 'class-validator';
@ -98,3 +99,36 @@ export class FieldMetadataDefaultValueNowFunction {
  @IsNotEmpty()
  value: typeof fieldMetadataDefaultValueFunctionName.NOW;
 }
+export class FieldMetadataDefaultValueAddress {
+  @ValidateIf((_object, value) => value !== null)
+  @IsString()
+  addressStreet1: string | null;
+
+  @ValidateIf((_object, value) => value !== null)
+  @IsString()
+  addressStreet2: string | null;
+
+  @ValidateIf((_object, value) => value !== null)
+  @IsString()
+  addressCity: string | null;
+
+  @ValidateIf((_object, value) => value !== null)
+  @IsString()
+  addressPostcode: string | null;
+
+  @ValidateIf((_object, value) => value !== null)
+  @IsString()
+  addressState: string | null;
+
+  @ValidateIf((_object, value) => value !== null)
+  @IsString()
+  addressCountry: string | null;
+
+  @ValidateIf((_object, value) => value !== null)
+  @IsNumber()
+  addressLat: number | null;
+
+  @ValidateIf((_object, value) => value !== null)
+  @IsNumber()
+  addressLng: number | null;
+}
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/field-metadata.entity.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/field-metadata.entity.ts
@ -36,6 +36,8 @@ export enum FieldMetadataType {
  MULTI_SELECT = 'MULTI_SELECT',
  RELATION = 'RELATION',
  POSITION = 'POSITION',
+  ADDRESS = 'ADDRESS',
+  JSON = 'JSON',
  RAW_JSON = 'RAW_JSON',
 }

--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/field-metadata-default-value.interface.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/field-metadata-default-value.interface.ts
@ -1,4 +1,5 @@
 import {
+  FieldMetadataDefaultValueAddress,
  FieldMetadataDefaultValueBoolean,
  FieldMetadataDefaultValueCurrency,
  FieldMetadataDefaultValueDateTime,
@ -35,6 +36,7 @@ type FieldMetadataDefaultValueMapping = {
  [FieldMetadataType.LINK]: FieldMetadataDefaultValueLink;
  [FieldMetadataType.CURRENCY]: FieldMetadataDefaultValueCurrency;
  [FieldMetadataType.FULL_NAME]: FieldMetadataDefaultValueFullName;
+  [FieldMetadataType.ADDRESS]: FieldMetadataDefaultValueAddress;
  [FieldMetadataType.RATING]: FieldMetadataDefaultValueString;
  [FieldMetadataType.SELECT]: FieldMetadataDefaultValueString;
  [FieldMetadataType.MULTI_SELECT]: FieldMetadataDefaultValueStringArray;
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/field-metadata-target-column-map.interface.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/interfaces/field-metadata-target-column-map.interface.ts
@ -19,6 +19,17 @@ export interface FieldMetadataTargetColumnMapFullName {
  lastName: string;
 }

+export type FieldMetadataTargetColumnMapAddress = {
+  addressStreet1: string;
+  addressStreet2: string;
+  addressCity: string;
+  addressState: string;
+  addressZipCode: string;
+  addressCountry: string;
+  addressLat: number;
+  addressLng: number;
+};
+
 type AllFieldMetadataTypes = {
  [key: string]: string;
 };
@ -27,6 +38,7 @@ type FieldMetadataTypeMapping = {
  [FieldMetadataType.LINK]: FieldMetadataTargetColumnMapLink;
  [FieldMetadataType.CURRENCY]: FieldMetadataTargetColumnMapCurrency;
  [FieldMetadataType.FULL_NAME]: FieldMetadataTargetColumnMapFullName;
+  [FieldMetadataType.ADDRESS]: FieldMetadataTargetColumnMapAddress;
 };

 type TypeByFieldMetadata<T extends FieldMetadataType | 'default'> = [
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/generate-default-value.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/generate-default-value.ts
@ -15,6 +15,17 @@ export function generateDefaultValue(
        firstName: "''",
        lastName: "''",
      };
+    case FieldMetadataType.ADDRESS:
+      return {
+        addressStreet1: "''",
+        addressStreet2: "''",
+        addressCity: "''",
+        addressState: "''",
+        addressCountry: "''",
+        addressPostcode: "''",
+        addressLat: null,
+        addressLng: null,
+      };
    case FieldMetadataType.LINK:
      return {
        url: "''",
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/generate-target-column-map.util.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/generate-target-column-map.util.ts
@ -54,6 +54,17 @@ export function generateTargetColumnMap(
        firstName: `${columnName}FirstName`,
        lastName: `${columnName}LastName`,
      };
+    case FieldMetadataType.ADDRESS:
+      return {
+        addressStreet1: `${columnName}AddressStreet1`,
+        addressStreet2: `${columnName}AddressStreet2`,
+        addressCity: `${columnName}AddressCity`,
+        addressPostcode: `${columnName}AddressPostcode`,
+        addressState: `${columnName}AddressState`,
+        addressCountry: `${columnName}AddressCountry`,
+        addressLat: `${columnName}AddressLat`,
+        addressLng: `${columnName}AddressLng`,
+      };
    case FieldMetadataType.RELATION:
      return {};
    default:
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/is-composite-field-metadata-type.util.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/is-composite-field-metadata-type.util.ts
@ -9,6 +9,7 @@ export const isCompositeFieldMetadataType = (
  return (
    type === FieldMetadataType.LINK ||
    type === FieldMetadataType.CURRENCY ||
-    type === FieldMetadataType.FULL_NAME
+    type === FieldMetadataType.FULL_NAME ||
+    type === FieldMetadataType.ADDRESS
  );
 };
--- a/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/validate-default-value-for-type.util.ts
+++ b/packages/twenty-server/src/engine/metadata-modules/field-metadata/utils/validate-default-value-for-type.util.ts
@ -8,6 +8,7 @@ import {

 import { FieldMetadataType } from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
 import {
+  FieldMetadataDefaultValueAddress,
  FieldMetadataDefaultValueBoolean,
  FieldMetadataDefaultValueCurrency,
  FieldMetadataDefaultValueDateTime,
@ -44,6 +45,7 @@ export const defaultValueValidatorsMap = {
  [FieldMetadataType.RATING]: [FieldMetadataDefaultValueString],
  [FieldMetadataType.SELECT]: [FieldMetadataDefaultValueString],
  [FieldMetadataType.MULTI_SELECT]: [FieldMetadataDefaultValueStringArray],
+  [FieldMetadataType.ADDRESS]: [FieldMetadataDefaultValueAddress],
  [FieldMetadataType.RAW_JSON]: [FieldMetadataDefaultValueRawJson],
 };

--- a/packages/twenty-server/src/engine/workspace-manager/demo-objects-prefill-data/companies-demo.json
+++ b/packages/twenty-server/src/engine/workspace-manager/demo-objects-prefill-data/companies-demo.json
--- a/packages/twenty-server/src/engine/workspace-manager/demo-objects-prefill-data/company.ts
+++ b/packages/twenty-server/src/engine/workspace-manager/demo-objects-prefill-data/company.ts
@ -12,7 +12,7 @@ export const companyPrefillDemoData = async (
    .into(`${schemaName}.company`, [
      'name',
      'domainName',
-      'address',
+      'addressAddressCity',
      'employees',
      'linkedinLinkUrl',
      'position',
--- a/packages/twenty-server/src/modules/company/standard-objects/company.object-metadata.ts
+++ b/packages/twenty-server/src/modules/company/standard-objects/company.object-metadata.ts
@ -51,7 +51,7 @@ export class CompanyObjectMetadata extends BaseObjectMetadata {

  @FieldMetadata({
    standardId: companyStandardFieldIds.address,
-    type: FieldMetadataType.TEXT,
+    type: FieldMetadataType.ADDRESS,
    label: 'Address',
    description: 'The company address',
    icon: 'IconMap',
--- a/packages/twenty-zapier/src/utils/computeInputFields.ts
+++ b/packages/twenty-zapier/src/utils/computeInputFields.ts
@ -89,6 +89,57 @@ const get_subfieldsFromField = (nodeField: NodeField): NodeField[] => {
      };
      return [amountMicros, currencyCode];
    }
+    case FieldMetadataType.ADDRESS: {
+      const address1: NodeField = {
+        type: 'TEXT',
+        name: 'addressStreet1',
+        label: 'Address',
+        description: 'Address',
+        isNullable: true,
+        defaultValue: null,
+      };
+      const address2: NodeField = {
+        type: 'TEXT',
+        name: 'addressStreet2',
+        label: 'Address 2',
+        description: 'Address 2',
+        isNullable: true,
+        defaultValue: null,
+      };
+      const city: NodeField = {
+        type: 'TEXT',
+        name: 'addressCity',
+        label: 'City',
+        description: 'City',
+        isNullable: true,
+        defaultValue: null,
+      };
+      const state: NodeField = {
+        type: 'TEXT',
+        name: 'addressState',
+        label: 'State',
+        description: 'State',
+        isNullable: true,
+        defaultValue: null,
+      };
+      const postalCode: NodeField = {
+        type: 'TEXT',
+        name: 'addressPostalCode',
+        label: 'Postal Code',
+        description: 'Postal Code',
+        isNullable: true,
+        defaultValue: null,
+      };
+      const country: NodeField = {
+        type: 'TEXT',
+        name: 'addressCountry',
+        label: 'Country',
+        description: 'Country',
+        isNullable: true,
+        defaultValue: null,
+      };
+      return [address1, address2, city, state, postalCode, country];
+    }
    default:
      throw new Error(`Unknown nodeField type: ${nodeField.type}`);
  }
@ -109,6 +160,7 @@ export const computeInputFields = (
      case FieldMetadataType.FULL_NAME:
      case FieldMetadataType.LINK:
      case FieldMetadataType.CURRENCY:
+      case FieldMetadataType.ADDRESS:
        for (const subNodeField of get_subfieldsFromField(nodeField)) {
          const field = {
            key: `${nodeField.name}__${subNodeField.name}`,
--- a/packages/twenty-zapier/src/utils/data.types.ts
+++ b/packages/twenty-zapier/src/utils/data.types.ts
@ -47,6 +47,7 @@ export enum FieldMetadataType {
  SELECT = 'SELECT',
  MULTI_SELECT = 'MULTI_SELECT',
  RELATION = 'RELATION',
+  ADDRESS = 'ADDRESS',
 }

 export type Schema = {
				`@ -0,0 +1 @@`
				`export const SELECT_COUNTRY_DROPDOWN_ID = 'select-country-picker';`