Fix phone input clearing its value when hitting space (#13031)

This PR fixes a bug with phone input clearing its value when we press
space right after a country calling code.

As the problem comes from the library `react-phone-input-number` this PR
implements a yarn patch.

Fixes https://github.com/twentyhq/twenty/issues/12903

.yarn/patches/react-phone-number-input-npm-3.4.5-dc2895c306.patch

@@ -0,0 +1,45 @@
+diff --git a/commonjs/helpers/phoneInputHelpers.js b/commonjs/helpers/phoneInputHelpers.js
+index 8fd1b16ec670ab7d0abcb800a2edd7848e86ce1e..ab6e0dd90def507629c2ead59fba929a739f0759 100644
+--- a/commonjs/helpers/phoneInputHelpers.js
++++ b/commonjs/helpers/phoneInputHelpers.js
+@@ -574,7 +574,9 @@ function onPhoneDigitsChange(phoneDigits, _ref5) {
+   // Generate the new `value` property.
+   var value;
+   if (phoneDigits) {
+-    if (phoneDigits[0] === '+') {
++    if(phoneDigits === prevPhoneDigits) {
++			value = e164(phoneDigits, country, metadata)
++		} else if (phoneDigits[0] === '+') {
+       if (phoneDigits === '+') {
+         value = undefined;
+       } else if (country && (0, _getInternationalPhoneNumberPrefix["default"])(country, metadata).indexOf(phoneDigits) === 0) {
+diff --git a/modules/helpers/phoneInputHelpers.js b/modules/helpers/phoneInputHelpers.js
+index 75e8463f6b5d32c560d1dec2776671bee2af1d07..99af2904807cc3c23aea566bbeebda2a5bc9afa4 100644
+--- a/modules/helpers/phoneInputHelpers.js
++++ b/modules/helpers/phoneInputHelpers.js
+@@ -551,7 +551,9 @@ export function onPhoneDigitsChange(phoneDigits, _ref5) {
+   // Generate the new `value` property.
+   var value;
+   if (phoneDigits) {
+-    if (phoneDigits[0] === '+') {
++    if(phoneDigits === prevPhoneDigits) {
++			value = e164(phoneDigits, country, metadata)
++		} else if (phoneDigits[0] === '+') {
+       if (phoneDigits === '+') {
+         value = undefined;
+       } else if (country && getInternationalPhoneNumberPrefix(country, metadata).indexOf(phoneDigits) === 0) {
+diff --git a/react-styleguidist/project/source/helpers/phoneInputHelpers.js b/react-styleguidist/project/source/helpers/phoneInputHelpers.js
+index b844ef0fd183fe4f45e436bdb2382fc2987dcef2..8960834900e59a57e130521fd369e82fe05f5090 100644
+--- a/react-styleguidist/project/source/helpers/phoneInputHelpers.js
++++ b/react-styleguidist/project/source/helpers/phoneInputHelpers.js
+@@ -505,7 +505,9 @@ export function onPhoneDigitsChange(phoneDigits, {
+ 	// Generate the new `value` property.
+ 	let value
+ 	if (phoneDigits) {
+-		if (phoneDigits[0] === '+') {
++		if(phoneDigits === prevPhoneDigits) {
++			value = e164(phoneDigits, country, metadata)
++		} else if (phoneDigits[0] === '+') {
+ 			if (phoneDigits === '+') {
+ 				value = undefined
+ 			} else if (country && getInternationalPhoneNumberPrefix(country, metadata).indexOf(phoneDigits) !== 0) {

package.json

@@ -168,7 +168,7 @@
     "react-imask": "^7.6.0",
     "react-intersection-observer": "^9.15.1",
     "react-loading-skeleton": "^3.3.1",
-    "react-phone-number-input": "^3.3.4",
+    "react-phone-number-input": "patch:react-phone-number-input@npm%3A3.4.5#~/.yarn/patches/react-phone-number-input-npm-3.4.5-dc2895c306.patch",
     "react-responsive": "^9.0.2",
     "react-router-dom": "^6.4.4",
     "react-textarea-autosize": "^8.4.1",

yarn.lock

@@ -51110,7 +51110,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-phone-number-input@npm:^3.3.4":
+"react-phone-number-input@npm:3.4.5":
   version: 3.4.5
   resolution: "react-phone-number-input@npm:3.4.5"
   dependencies:
@@ -51126,6 +51126,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-phone-number-input@patch:react-phone-number-input@npm%3A3.4.5#~/.yarn/patches/react-phone-number-input-npm-3.4.5-dc2895c306.patch":
+  version: 3.4.5
+  resolution: "react-phone-number-input@patch:react-phone-number-input@npm%3A3.4.5#~/.yarn/patches/react-phone-number-input-npm-3.4.5-dc2895c306.patch::version=3.4.5&hash=4d6a74"
+  dependencies:
+    classnames: "npm:^2.5.1"
+    country-flag-icons: "npm:^1.5.11"
+    input-format: "npm:^0.3.10"
+    libphonenumber-js: "npm:^1.11.5"
+    prop-types: "npm:^15.8.1"
+  peerDependencies:
+    react: ">=16.8"
+    react-dom: ">=16.8"
+  checksum: 10c0/24d6cc7fcae591eb9c34f00ad781dcc0578fab0516bba3d4594dfe5c0e9debfb9d0c7ebe531a886e4694078dcba5b2e9b1d6d632759cc8d2de3d8b86448371a8
+  languageName: node
+  linkType: hard
+
 "react-promise-suspense@npm:0.3.4":
   version: 0.3.4
   resolution: "react-promise-suspense@npm:0.3.4"
@@ -57214,7 +57230,7 @@ __metadata:
     react-imask: "npm:^7.6.0"
     react-intersection-observer: "npm:^9.15.1"
     react-loading-skeleton: "npm:^3.3.1"
-    react-phone-number-input: "npm:^3.3.4"
+    react-phone-number-input: "patch:react-phone-number-input@npm%3A3.4.5#~/.yarn/patches/react-phone-number-input-npm-3.4.5-dc2895c306.patch"
     react-responsive: "npm:^9.0.2"
     react-router-dom: "npm:^6.4.4"
     react-textarea-autosize: "npm:^8.4.1"