diff options
Diffstat (limited to 'components/signup/join-form.tsx')
| -rw-r--r-- | components/signup/join-form.tsx | 56 |
1 files changed, 52 insertions, 4 deletions
diff --git a/components/signup/join-form.tsx b/components/signup/join-form.tsx index e53e779f..30449a63 100644 --- a/components/signup/join-form.tsx +++ b/components/signup/join-form.tsx @@ -100,7 +100,7 @@ const enhancedCountryArray = sortedCountryArray.map(country => ({ })); // Comprehensive list of country dial codes -const countryDialCodes: { [key: string]: string } = { +export const countryDialCodes: { [key: string]: string } = { AF: "+93", AL: "+355", DZ: "+213", AS: "+1-684", AD: "+376", AO: "+244", AI: "+1-264", AG: "+1-268", AR: "+54", AM: "+374", AW: "+297", AU: "+61", AT: "+43", AZ: "+994", BS: "+1-242", BH: "+973", BD: "+880", BB: "+1-246", @@ -315,10 +315,52 @@ export function JoinForm() { // Get country code for phone number placeholder const getPhonePlaceholder = (countryCode: string) => { - if (!countryCode || !countryDialCodes[countryCode]) return "전화번호"; - return `${countryDialCodes[countryCode]} 전화번호`; + if (!countryCode || !countryDialCodes[countryCode]) return "+82 010-1234-5678"; + + const dialCode = countryDialCodes[countryCode]; + + switch (countryCode) { + case 'KR': + return `${dialCode} 010-1234-5678`; + case 'US': + case 'CA': + return `${dialCode} 555-123-4567`; + case 'JP': + return `${dialCode} 90-1234-5678`; + case 'CN': + return `${dialCode} 138-0013-8000`; + case 'GB': + return `${dialCode} 20-7946-0958`; + case 'DE': + return `${dialCode} 30-12345678`; + case 'FR': + return `${dialCode} 1-42-86-83-16`; + default: + return `${dialCode} 전화번호`; + } }; + const getPhoneDescription = (countryCode: string) => { + if (!countryCode) return "국가를 먼저 선택해주세요."; + + const dialCode = countryDialCodes[countryCode]; + + switch (countryCode) { + case 'KR': + return `${dialCode}로 시작하는 국제번호 또는 010으로 시작하는 국내번호를 입력하세요.`; + case 'US': + case 'CA': + return `${dialCode}로 시작하는 10자리 번호를 입력하세요.`; + case 'JP': + return `${dialCode}로 시작하는 일본 전화번호를 입력하세요.`; + case 'CN': + return `${dialCode}로 시작하는 중국 전화번호를 입력하세요.`; + default: + return `${dialCode}로 시작하는 국제 전화번호를 입력하세요.`; + } + }; + + // Render return ( <div className="container py-6"> @@ -555,9 +597,15 @@ export function JoinForm() { <Input {...field} placeholder={getPhonePlaceholder(form.watch("country"))} - disabled={isSubmitting} + disabled={isSubmitting} + className={cn( + form.formState.errors.phone && "border-red-500" + )} /> </FormControl> + <FormDescription className="text-xs text-muted-foreground"> + {getPhoneDescription(form.watch("country"))} + </FormDescription> <FormMessage /> </FormItem> )} |
