Remove duplicate plus sign for phone numbers (#8871)

Fixes #8838 

1. Summary
It seems [this PR](https://github.com/twentyhq/twenty/pull/8614) caused
the issue. We added a plus sign on front-end when the
[callingCode](c735026f6c/packages/twenty-front/src/modules/ui/field/display/components/PhonesDisplay.tsx (L70))
retrieved from back-end already has a plus sign.

2. Solution
@guillim Please let me know if I missed a case where the plus sign is
not there for the `callingCode`. If so, I think we should check whether
or not `callingCode` has a leading plus sign on front-end before adding
it. For now, I just removed the code that appends a plus sign on
front-end.

3. Screenshots

![localhost_3001_objects_people_view=f4aee583-9d0c-4961-a6e1-fd66bc51dfd5](https://github.com/user-attachments/assets/9fe8b361-47b9-4e3f-82b7-570713cf430c)

---------

Co-authored-by: guillim <guigloo@msn.com>
Co-authored-by: Guillim <guillim@users.noreply.github.com>
Co-authored-by: Weiko <deniaud.corentin@gmail.com>

packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiItemFieldInput.tsx

@@ -111,7 +111,7 @@ export const MultiItemFieldInput = <T,>({
         break;
       case FieldMetadataType.Phones:
         item = items[index] as PhoneRecord;
-        setInputValue(`+${item.callingCode}` + item.number);
+        setInputValue(item.callingCode + item.number);
         break;
       case FieldMetadataType.Emails:
         item = items[index] as string;

packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/PhonesFieldInput.tsx

@@ -14,6 +14,8 @@ import { PhoneCountryPickerDropdownButton } from '@/ui/input/components/internal
 import { FieldMetadataType } from '~/generated-metadata/graphql';
 import { stripSimpleQuotesFromString } from '~/utils/string/stripSimpleQuotesFromString';
 
+export const DEFAULT_PHONE_COUNTRY_CODE = '1';
+
 const StyledCustomPhoneInput = styled(ReactPhoneNumberInput)`
   font-family: ${({ theme }) => theme.font.family};
   height: 32px;
@@ -71,11 +73,10 @@ export const PhonesFieldInput = ({ onCancel }: PhonesFieldInputProps) => {
   const defaultCallingCode =
     stripSimpleQuotesFromString(
       fieldDefinition?.defaultValue?.primaryPhoneCountryCode,
-    ) ?? '+1';
+    ) ?? DEFAULT_PHONE_COUNTRY_CODE;
-
   // TODO : improve once we store the real country code
   const defaultCountry = useCountries().find(
-    (obj) => obj.callingCode === defaultCallingCode,
+    (obj) => `+${obj.callingCode}` === defaultCallingCode,
   )?.countryCode;
 
   const handlePersistPhones = (
@@ -103,7 +104,7 @@ export const PhonesFieldInput = ({ onCancel }: PhonesFieldInputProps) => {
         if (phone !== undefined) {
           return {
             number: phone.nationalNumber,
-            callingCode: `${phone.countryCallingCode}`,
+            callingCode: `+${phone.countryCallingCode}`,
           };
         }
         return {

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

@@ -37,7 +37,7 @@ export const SettingsDataModelFieldPhonesForm = ({
     .sort((a, b) => a.countryName.localeCompare(b.countryName))
     .map((country) => ({
       label: `${country.countryName} (+${country.callingCode})`,
-      value: `${country.callingCode}`,
+      value: `+${country.callingCode}`,
     }));
   countries.unshift({ label: 'No country', value: '' });
   const defaultDefaultValue = {

packages/twenty-front/src/modules/settings/data-model/fields/preview/utils/getPhonesFieldPreviewValue.ts

@@ -22,9 +22,9 @@ export const getPhonesFieldPreviewValue = ({
   const primaryPhoneCountryCode =
     fieldMetadataItem.defaultValue?.primaryPhoneCountryCode &&
     fieldMetadataItem.defaultValue.primaryPhoneCountryCode !== ''
-      ? `+${stripSimpleQuotesFromString(
+      ? stripSimpleQuotesFromString(
           fieldMetadataItem.defaultValue?.primaryPhoneCountryCode,
-        )}`
+        )
       : null;
   return {
     ...placeholderDefaultValue,

packages/twenty-front/src/modules/ui/field/display/components/PhonesDisplay.tsx

@@ -67,7 +67,7 @@ export const PhonesDisplay = ({ value, isFocused }: PhonesDisplayProps) => {
     <ExpandableList isChipCountDisplayed>
       {phones.map(({ number, callingCode }, index) => {
         const { parsedPhone, invalidPhone } =
-          parsePhoneNumberOrReturnInvalidValue(`+${callingCode}` + number);
+          parsePhoneNumberOrReturnInvalidValue(callingCode + number);
         const URI = parsedPhone?.getURI();
         return (
           <RoundedLink
@@ -84,7 +84,7 @@ export const PhonesDisplay = ({ value, isFocused }: PhonesDisplayProps) => {
     <StyledContainer>
       {phones.map(({ number, callingCode }, index) => {
         const { parsedPhone, invalidPhone } =
-          parsePhoneNumberOrReturnInvalidValue(`+${callingCode}` + number);
+          parsePhoneNumberOrReturnInvalidValue(callingCode + number);
         const URI = parsedPhone?.getURI();
         return (
           <RoundedLink