feat(phone-input): integrate phone number input component and validation
- Added `libphonenumber-js` dependency for improved phone number handling. - Refactored `CreateAdmin` form to utilize a new `PhoneNumberInput` component with validation rules. - Updated `useCreateAdminPresenter` to normalize phone number input before submission. - Enhanced error messages for phone validation in `Texts` constant. - Modified `User` schema to validate phone numbers using E.164 format.
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
import { FormErrorMessages } from "@/constants/Texts";
|
||||
import { isValidE164Phone, normalizeToE164 } from "@/lib/phone/e164";
|
||||
import type { CountryCode } from "libphonenumber-js";
|
||||
|
||||
type PhoneRulesOptions = {
|
||||
required?: boolean;
|
||||
defaultCountry?: CountryCode;
|
||||
};
|
||||
|
||||
/** React Hook Form rules for an E.164 phone field. */
|
||||
export function createPhoneFieldRules(options: PhoneRulesOptions = {}) {
|
||||
const { required = false, defaultCountry } = options;
|
||||
|
||||
return {
|
||||
validate: (value: string | undefined) => {
|
||||
const trimmed = value?.trim() ?? "";
|
||||
if (!trimmed) {
|
||||
return required ? FormErrorMessages.required : true;
|
||||
}
|
||||
if (!isValidE164Phone(trimmed)) {
|
||||
return FormErrorMessages.invalidPhone;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
setValueAs: (value: string | undefined) => {
|
||||
const trimmed = value?.trim() ?? "";
|
||||
if (!trimmed) return "";
|
||||
return normalizeToE164(trimmed, defaultCountry) ?? trimmed;
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
/** Normalize before API submit (defensive). */
|
||||
export function normalizePhoneFieldValue(
|
||||
value: string | undefined,
|
||||
defaultCountry?: CountryCode,
|
||||
): string | undefined {
|
||||
const trimmed = value?.trim();
|
||||
if (!trimmed) return undefined;
|
||||
return normalizeToE164(trimmed, defaultCountry) ?? undefined;
|
||||
}
|
||||
Reference in New Issue
Block a user