Default address country 🗺️ & Phone prefix ☎️

packages/twenty-front/src/modules/object-metadata/utils/formatFieldMetadataItemInput.ts

@@ -1,4 +1,5 @@
 import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+import { computeMetadataDefaultValue } from '~/pages/settings/data-model/utils/compute-metadata-defaultValue-utils';
 import { computeMetadataNameFromLabel } from '~/pages/settings/data-model/utils/compute-metadata-name-from-label.utils';
 
 export const formatFieldMetadataItemInput = (
@@ -18,7 +19,7 @@ export const formatFieldMetadataItemInput = (
   const label = input.label?.trim();
 
   return {
-    defaultValue: input.defaultValue,
+    defaultValue: computeMetadataDefaultValue(input.defaultValue),
     description: input.description?.trim() ?? null,
     icon: input.icon,
     label,

packages/twenty-front/src/modules/object-record/record-field/types/guards/isFieldAddressValue.ts

@@ -2,7 +2,7 @@ import { z } from 'zod';
 
 import { FieldAddressValue } from '../FieldMetadata';
 
-const addressSchema = z.object({
+export const addressSchema = z.object({
   addressStreet1: z.string(),
   addressStreet2: z.string().nullable(),
   addressCity: z.string().nullable(),

packages/twenty-front/src/modules/object-record/record-field/utils/computeDraftValueFromFieldValue.ts

@@ -1,6 +1,7 @@
 import { FieldDefinition } from '@/object-record/record-field/types/FieldDefinition';
 import { FieldInputDraftValue } from '@/object-record/record-field/types/FieldInputDraftValue';
 import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata';
+import { isFieldAddress } from '@/object-record/record-field/types/guards/isFieldAddress';
 import { isFieldCurrency } from '@/object-record/record-field/types/guards/isFieldCurrency';
 import { isFieldCurrencyValue } from '@/object-record/record-field/types/guards/isFieldCurrencyValue';
 import { isFieldNumber } from '@/object-record/record-field/types/guards/isFieldNumber';
@@ -42,6 +43,20 @@ export const computeDraftValueFromFieldValue = <FieldValue>({
     } as unknown as FieldInputDraftValue<FieldValue>;
   }
 
+  if (isFieldAddress(fieldDefinition)) {
+    if (
+      isFieldValueEmpty({ fieldValue, fieldDefinition }) &&
+      !!fieldDefinition?.defaultValue?.addressCountry
+    ) {
+      return {
+        ...fieldValue,
+        addressCountry: fieldDefinition?.defaultValue?.addressCountry,
+      } as unknown as FieldInputDraftValue<FieldValue>;
+    }
+
+    return fieldValue as FieldInputDraftValue<FieldValue>;
+  }
+
   if (
     isFieldNumber(fieldDefinition) &&
     isFieldNumberValue(fieldValue) &&

packages/twenty-front/src/modules/settings/data-model/fields/forms/address/components/SettingsDataModelFieldAddressForm.tsx

@@ -0,0 +1,81 @@
+import { Controller, useFormContext } from 'react-hook-form';
+
+import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+import { addressSchema as addressFieldDefaultValueSchema } from '@/object-record/record-field/types/guards/isFieldAddressValue';
+import { SettingsOptionCardContentSelect } from '@/settings/components/SettingsOptions/SettingsOptionCardContentSelect';
+import { useCountries } from '@/ui/input/components/internal/hooks/useCountries';
+import { IconMap } from 'twenty-ui';
+import { z } from 'zod';
+import { removeSingleQuotesFromStrings } from '~/pages/settings/data-model/utils/compute-metadata-defaultValue-utils';
+
+type SettingsDataModelFieldAddressFormProps = {
+  disabled?: boolean;
+  defaultCountry?: string;
+  fieldMetadataItem: Pick<
+    FieldMetadataItem,
+    'icon' | 'label' | 'type' | 'defaultValue' | 'settings'
+  >;
+};
+
+export const settingsDataModelFieldAddressFormSchema = z.object({
+  defaultValue: addressFieldDefaultValueSchema,
+});
+
+export type SettingsDataModelFieldTextFormValues = z.infer<
+  typeof settingsDataModelFieldAddressFormSchema
+>;
+
+export const SettingsDataModelFieldAddressForm = ({
+  disabled,
+  fieldMetadataItem,
+}: SettingsDataModelFieldAddressFormProps) => {
+  const { control } = useFormContext<SettingsDataModelFieldTextFormValues>();
+  const countries = useCountries().map((country) => ({
+    label: country.countryName,
+    value: country.countryName,
+  }));
+  countries.unshift({ label: 'No country', value: '' });
+  const defaultValueInstance = {
+    addressStreet1: '',
+    addressStreet2: null,
+    addressCity: null,
+    addressState: null,
+    addressPostcode: null,
+    addressCountry: null,
+    addressLat: null,
+    addressLng: null,
+  };
+  const fieldMetadataItemDefaultValue = fieldMetadataItem?.defaultValue
+    ? removeSingleQuotesFromStrings(fieldMetadataItem?.defaultValue)
+    : fieldMetadataItem?.defaultValue;
+
+  return (
+    <Controller
+      name="defaultValue"
+      defaultValue={{
+        ...defaultValueInstance,
+        ...fieldMetadataItemDefaultValue,
+      }}
+      control={control}
+      render={({ field: { onChange, value } }) => {
+        const defaultCountry = value?.addressCountry || '';
+        return (
+          <>
+            <SettingsOptionCardContentSelect
+              Icon={IconMap}
+              dropdownId="selectDefaultCountry"
+              title="Default Country"
+              description="The default country for new addresses"
+              value={defaultCountry}
+              onChange={(newCountry) =>
+                onChange({ ...value, addressCountry: newCountry })
+              }
+              disabled={disabled}
+              options={countries}
+            />
+          </>
+        );
+      }}
+    />
+  );
+};

packages/twenty-front/src/modules/settings/data-model/fields/forms/address/components/SettingsDataModelFieldAddressSettingsFormCard.tsx

@@ -0,0 +1,45 @@
+import styled from '@emotion/styled';
+
+import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
+
+import { SettingsDataModelPreviewFormCard } from '@/settings/data-model/components/SettingsDataModelPreviewFormCard';
+import { SettingsDataModelFieldAddressForm } from '@/settings/data-model/fields/forms/address/components/SettingsDataModelFieldAddressForm';
+import {
+  SettingsDataModelFieldPreviewCard,
+  SettingsDataModelFieldPreviewCardProps,
+} from '@/settings/data-model/fields/preview/components/SettingsDataModelFieldPreviewCard';
+
+type SettingsDataModelFieldAddressSettingsFormCardProps = {
+  disabled?: boolean;
+  fieldMetadataItem: Pick<
+    FieldMetadataItem,
+    'icon' | 'label' | 'type' | 'defaultValue'
+  >;
+} & Pick<SettingsDataModelFieldPreviewCardProps, 'objectMetadataItem'>;
+
+const StyledFieldPreviewCard = styled(SettingsDataModelFieldPreviewCard)`
+  flex: 1 1 100%;
+`;
+
+export const SettingsDataModelFieldAddressSettingsFormCard = ({
+  disabled,
+  fieldMetadataItem,
+  objectMetadataItem,
+}: SettingsDataModelFieldAddressSettingsFormCardProps) => {
+  return (
+    <SettingsDataModelPreviewFormCard
+      preview={
+        <StyledFieldPreviewCard
+          fieldMetadataItem={fieldMetadataItem}
+          objectMetadataItem={objectMetadataItem}
+        />
+      }
+      form={
+        <SettingsDataModelFieldAddressForm
+          disabled={disabled}
+          fieldMetadataItem={fieldMetadataItem}
+        />
+      }
+    />
+  );
+};

packages/twenty-front/src/modules/settings/data-model/fields/forms/components/SettingsDataModelFieldSettingsFormCard.tsx

@@ -5,6 +5,8 @@ import { z } from 'zod';
 import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
 import { SettingsDataModelPreviewFormCard } from '@/settings/data-model/components/SettingsDataModelPreviewFormCard';
 import { SETTINGS_FIELD_TYPE_CONFIGS } from '@/settings/data-model/constants/SettingsFieldTypeConfigs';
+import { settingsDataModelFieldAddressFormSchema } from '@/settings/data-model/fields/forms/address/components/SettingsDataModelFieldAddressForm';
+import { SettingsDataModelFieldAddressSettingsFormCard } from '@/settings/data-model/fields/forms/address/components/SettingsDataModelFieldAddressSettingsFormCard';
 import { settingsDataModelFieldBooleanFormSchema } from '@/settings/data-model/fields/forms/boolean/components/SettingsDataModelFieldBooleanForm';
 import { SettingsDataModelFieldBooleanSettingsFormCard } from '@/settings/data-model/fields/forms/boolean/components/SettingsDataModelFieldBooleanSettingsFormCard';
 import { settingsDataModelFieldtextFormSchema } from '@/settings/data-model/fields/forms/components/text/SettingsDataModelFieldTextForm';
@@ -64,6 +66,10 @@ const textFieldFormSchema = z
   .object({ type: z.literal(FieldMetadataType.Text) })
   .merge(settingsDataModelFieldtextFormSchema);
 
+const addressFieldFormSchema = z
+  .object({ type: z.literal(FieldMetadataType.Address) })
+  .merge(settingsDataModelFieldAddressFormSchema);
+
 const otherFieldsFormSchema = z.object({
   type: z.enum(
     Object.keys(
@@ -76,6 +82,7 @@ const otherFieldsFormSchema = z.object({
         FieldMetadataType.Date,
         FieldMetadataType.DateTime,
         FieldMetadataType.Number,
+        FieldMetadataType.Address,
         FieldMetadataType.Text,
       ]),
     ) as [FieldMetadataType, ...FieldMetadataType[]],
@@ -94,6 +101,7 @@ export const settingsDataModelFieldSettingsFormSchema = z.discriminatedUnion(
     multiSelectFieldFormSchema,
     numberFieldFormSchema,
     textFieldFormSchema,
+    addressFieldFormSchema,
     otherFieldsFormSchema,
   ],
 );
@@ -200,6 +208,15 @@ export const SettingsDataModelFieldSettingsFormCard = ({
     );
   }
 
+  if (fieldMetadataItem.type === FieldMetadataType.Address) {
+    return (
+      <SettingsDataModelFieldAddressSettingsFormCard
+        fieldMetadataItem={fieldMetadataItem}
+        objectMetadataItem={objectMetadataItem}
+      />
+    );
+  }
+
   if (
     fieldMetadataItem.type === FieldMetadataType.Select ||
     fieldMetadataItem.type === FieldMetadataType.MultiSelect

packages/twenty-front/src/modules/ui/input/components/internal/country/components/CountrySelect.tsx

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { IconComponentProps } from 'twenty-ui';
+import { IconCircleOff, IconComponentProps } from 'twenty-ui';
 
 import { SELECT_COUNTRY_DROPDOWN_ID } from '@/ui/input/components/internal/country/constants/SelectCountryDropdownId';
 import { useCountries } from '@/ui/input/components/internal/hooks/useCountries';
@@ -15,12 +15,20 @@ export const CountrySelect = ({
   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 ?
-    }));
+    const countryList = countries.map<SelectOption<string>>(
+      ({ countryName, Flag }) => ({
+        label: countryName,
+        value: countryName,
+        Icon: (props: IconComponentProps) =>
+          Flag({ width: props.size, height: props.size }), // TODO : improve this ?
+      }),
+    );
+    countryList.unshift({
+      label: 'No country',
+      value: '',
+      Icon: IconCircleOff,
+    });
+    return countryList;
   }, [countries]);
 
   return (

packages/twenty-front/src/pages/settings/data-model/utils/compute-metadata-defaultValue-utils.ts

@@ -0,0 +1,57 @@
+export const computeMetadataDefaultValue = (input: any): any => {
+  if (typeof input !== 'object') {
+    throw new Error('Input type for DefaultValue is not handled yet');
+  }
+  return addSingleQuotesToStrings(input);
+};
+
+export const addSingleQuotesToStrings = (obj: any): any => {
+  if (typeof obj === 'string') {
+    if (obj === '') {
+      return "''";
+    }
+    if (obj === "''") {
+      return "''";
+    }
+
+    obj = "'" + obj + "'";
+
+    if (obj.startsWith("''") === true) {
+      obj = obj.slice(1);
+    }
+    if (obj.endsWith("''") === true) {
+      obj = obj.slice(1);
+    }
+    return obj;
+  } else if (Array.isArray(obj)) {
+    return obj.map(addSingleQuotesToStrings);
+  } else if (typeof obj === 'object' && obj !== null) {
+    const newObj: any = {};
+    for (const key in obj) {
+      if (Object.prototype.hasOwnProperty.call(obj, key) === true) {
+        newObj[key] = addSingleQuotesToStrings(obj[key]);
+      }
+    }
+    return newObj;
+  }
+  return obj;
+};
+export const removeSingleQuotesFromStrings = (obj: any): any => {
+  if (typeof obj === 'string') {
+    if (obj.startsWith("'") && obj.endsWith("'")) {
+      return obj.slice(1, -1);
+    }
+    return obj;
+  } else if (Array.isArray(obj)) {
+    return obj.map(removeSingleQuotesFromStrings);
+  } else if (typeof obj === 'object' && obj !== null) {
+    const newObj: any = {};
+    for (const key in obj) {
+      if (Object.prototype.hasOwnProperty.call(obj, key) === true) {
+        newObj[key] = removeSingleQuotesFromStrings(obj[key]);
+      }
+    }
+    return newObj;
+  }
+  return obj;
+};

packages/twenty-server/src/engine/metadata-modules/field-metadata/field-metadata-validation.service.ts

@@ -23,7 +23,7 @@ enum ValueType {
   NUMBER = 'number',
 }
 
-class SettingsValidation {
+class NumberSettingsValidation {
   @IsOptional()
   @IsInt()
   @Min(0)
@@ -32,7 +32,9 @@ class SettingsValidation {
   @IsOptional()
   @IsEnum(ValueType)
   type?: 'percentage' | 'number';
+}
 
+class TextSettingsValidation {
   @IsOptional()
   @IsInt()
   @Min(0)
@@ -55,17 +57,19 @@ export class FieldMetadataValidationService<
   }) {
     switch (fieldType) {
       case FieldMetadataType.NUMBER:
+        await this.validateSettings(NumberSettingsValidation, settings);
+        break;
       case FieldMetadataType.TEXT:
-        await this.validateSettings(settings);
+        await this.validateSettings(TextSettingsValidation, settings);
         break;
       default:
         break;
     }
   }
 
-  private async validateSettings(settings: any) {
+  private async validateSettings(validator: any, settings: any) {
     try {
-      const settingsInstance = plainToInstance(SettingsValidation, settings);
+      const settingsInstance = plainToInstance(validator, settings);
 
       await validateOrReject(settingsInstance);
     } catch (error) {