Refactor: apply PhoneInputCustom to ScreenPortofolioCreate

Changes:
- Replace react-native-international-phone-number with PhoneInputCustom
- Remove ICountry dependency, use CountryData from constants
- Update state management (inputValue → phoneNumber)
- Improve phone number formatting logic
- Add handleCountryChange for better country switching

Features Applied:
 NO emoji flags - only calling codes (+62, +65, etc)
 Clean, professional UI
 Modal country picker with search
 Real-time phone number formatting
 Auto-update country code on change
 Consistent with LoginView implementation

Phone Input Logic:
- Format on every phone change
- Re-format when country changes
- Remove duplicate country codes
- Remove leading zeros
- Store E.164 format in API data

UI:
- Phone Input: [+62 ⌄ | xxx-xxx-xxx]
- Country Picker: Modal with search
- Display: Country name + calling code only

Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>
This commit is contained in:
2026-03-26 11:42:54 +08:00
parent 0cb734e790
commit ecbcc12abf
4 changed files with 43 additions and 16 deletions

View File

@@ -1,6 +1,5 @@
import { MainColor } from "@/constants/color-palet";
import {
COUNTRIES,
DEFAULT_COUNTRY,
searchCountries,
type CountryData,
@@ -61,7 +60,6 @@ export default function PhoneInputCustom({
activeOpacity={0.7}
>
<Text style={styles.countryCodeText}>+{selectedCountry.callingCode}</Text>
<Text style={styles.dropdownIcon}></Text>
</TouchableOpacity>
<View style={styles.divider} />
@@ -73,7 +71,6 @@ export default function PhoneInputCustom({
value={value}
onChangeText={handlePhoneChange}
keyboardType="phone-pad"
returnKeyType="done"
autoComplete="tel"
importantForAutofill="yes"
editable={!disabled}