fix: phone number disappearing issue (#9811)

Co-authored-by: Udit Takkar <udit.07814802719@cse.mait.ac.in>
Co-authored-by: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com>

packages/ui/form/PhoneInput.tsx

@@ -1,5 +1,5 @@
 import { isSupportedCountry } from "libphonenumber-js";
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import PhoneInput from "react-phone-input-2";
 import "react-phone-input-2/lib/style.css";
 
@@ -18,11 +18,20 @@ export type PhoneInputProps = {
 };
 
 function BasePhoneInput({ name, className = "", onChange, ...rest }: PhoneInputProps) {
+  useEffect(() => {
+    if (!rest.value) {
+      return;
+    }
+    const formattedValue = rest.value.trim().replace(/^\+?/, "+");
+    onChange(formattedValue);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
   const defaultCountry = useDefaultCountry();
   return (
     <PhoneInput
       {...rest}
-      country={defaultCountry}
+      country={rest.value ? undefined : defaultCountry}
       enableSearch
       disableSearchIcon
       inputProps={{