Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| b2bffb3b83 | |||
| dd1a2953da |
@@ -14,8 +14,8 @@ const validationSchema = Yup.object().shape({
|
||||
country: Yup.string()
|
||||
.required("Required"),
|
||||
phone_number: Yup.string()
|
||||
.min(9, "Min 9 characters")
|
||||
.max(11, "Max 11 characters")
|
||||
.min(9, "Invalid")
|
||||
.max(11, "Invalid")
|
||||
.required("Required"),
|
||||
// birthYear: Yup.string()
|
||||
// .required("Required"),
|
||||
@@ -177,8 +177,8 @@ const VirtualAddCardPopout = ({ details, onClose, situation, walletItem }) => {
|
||||
onSubmit={handleSubmit}
|
||||
>
|
||||
{(props) => (
|
||||
<Form className="w-full overflow-y-auto">
|
||||
<div className="logout-modal-wrapper mx-auto w-[90%] lg:w-[900px] h-auto bg-white dark:bg-dark-white lg:rounded-2xl">
|
||||
<div className="logout-modal-wrapper mx-auto w-[90%] md:w-[768px] h-auto bg-white dark:bg-dark-white lg:rounded-2xl overflow-y-auto">
|
||||
<Form className="w-full">
|
||||
<div className="modal-header-con">
|
||||
<h1 className="modal-title">
|
||||
{walletItem?.description}
|
||||
@@ -209,320 +209,329 @@ const VirtualAddCardPopout = ({ details, onClose, situation, walletItem }) => {
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div className="p-4 w-full grid lg:grid-cols-2 gap-4">
|
||||
{/* left part */}
|
||||
<div className='w-full flex flex-col gap-4'>
|
||||
<div className='p-4 w-full flex flex-col h-auto md:h-[28rem]'>
|
||||
<div className='pb-4'>
|
||||
<h1 className='text-lg md:text-xl flex gap-1'><span className='font-bold'>Name:</span>{userDetails.lastname} {userDetails.firstname}</h1>
|
||||
<div className="field w-full grid md:grid-cols-3 gap-4">
|
||||
<div className="md:col-span-1 field w-full">
|
||||
</div>
|
||||
<div className="grid md:grid-cols-2 gap-4">
|
||||
{/* left part */}
|
||||
<div className='w-full flex flex-col gap-4'>
|
||||
<div className="field w-full grid md:grid-cols-5 gap-4">
|
||||
<div className="md:col-span-2 field w-full">
|
||||
<label
|
||||
htmlFor="country"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Country</span>
|
||||
{props.errors.country && props.touched.country && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.country}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="country"
|
||||
name="country"
|
||||
value={props.values.country}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
disabled={countryCode ? true : false}
|
||||
>
|
||||
{allCountries.loading ?
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Loading...
|
||||
</option>
|
||||
: allCountries.data?.length > 0 ?
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Select Country
|
||||
</option>
|
||||
{allCountries.data?.map(item => (
|
||||
<option key={item.uid} className="text-slate-500 text-lg" value={item.code}>
|
||||
{item.country}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
:
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Not Found
|
||||
</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div className='md:col-span-3'>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Phone Number"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="w-full input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="phone_number"
|
||||
value={props.values.phone_number}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.phone_number && props.touched.phone_number) && props.errors.phone_number}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<InputCom
|
||||
disable={true}
|
||||
fieldClass="px-6"
|
||||
label="Email"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="email"
|
||||
value={props.values.email}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.email && props.touched.email) && props.errors.email}
|
||||
/>
|
||||
<div className="hidden field w-full md:grid-cols-2 gap-4">
|
||||
<InputCom
|
||||
disable={true}
|
||||
fieldClass="px-6"
|
||||
label="Firstname"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="firstname"
|
||||
value={props.values.firstname}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.firstname && props.touched.firstname) && props.errors.firstname}
|
||||
/>
|
||||
<InputCom
|
||||
disable={true}
|
||||
fieldClass="px-6"
|
||||
label="Lastname"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="lastname"
|
||||
value={props.values.lastname}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.lastname && props.touched.lastname) && props.errors.lastname}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* hidden section */}
|
||||
<div className="hidden field w-full flex-col gap-4">
|
||||
<p className='job-label'>Date of Birth</p>
|
||||
<div className='xxs:grid-cols-3 gap-4'>
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="birthDay"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Day</span>
|
||||
{props.errors.birthDay && props.touched.birthDay && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.birthDay}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="birthDay"
|
||||
name="birthDay"
|
||||
value={props.values.birthDay}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
>
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value=''>
|
||||
select
|
||||
</option>
|
||||
{day.map(item => (
|
||||
<option key={item} className="text-slate-500 text-lg" value={item}>
|
||||
{item}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
</select>
|
||||
</div>
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="birthMonth"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Month</span>
|
||||
{props.errors.birthMonth && props.touched.birthMonth && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.birthMonth}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="birthMonth"
|
||||
name="birthMonth"
|
||||
value={props.values.birthMonth}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
>
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value=''>
|
||||
select
|
||||
</option>
|
||||
{month.map(item => (
|
||||
<option key={item.value} className="text-slate-500 text-lg" value={item.value}>
|
||||
{item.name}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
</select>
|
||||
</div>
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="birthYear"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Year</span>
|
||||
{props.errors.birthYear && props.touched.birthYear && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.birthYear}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="birthYear"
|
||||
name="birthYear"
|
||||
value={props.values.birthYear}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
>
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value=''>
|
||||
select
|
||||
</option>
|
||||
{year.map(item => (
|
||||
<option key={item} className="text-slate-500 text-lg" value={item}>
|
||||
{item}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="field w-full grid md:grid-cols-3 gap-4">
|
||||
<p className='hidden md:flex w-full md:col-span-1 job-label items-center'>Date of Birth</p>
|
||||
<div className='w-full md:col-span-2 '>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Date of Birth"
|
||||
labelClass="md:hidden tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="date"
|
||||
name="dob"
|
||||
value={props.values.dob}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.dob && props.touched.dob) && props.errors.dob}
|
||||
maxDate={year[0] + '-12-31'}
|
||||
minDate={year[year?.length - 1] + '-01-01'}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* right part */}
|
||||
<div className='w-full p-4 flex flex-col gap-4 bg-blue-200 dark:bg-slate-900 rounded-2xl'>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Address"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="address"
|
||||
value={props.values.address}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.address && props.touched.address) && props.errors.address}
|
||||
/>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="City"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="city"
|
||||
value={props.values.city}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.city && props.touched.city) && props.errors.city}
|
||||
/>
|
||||
{/* <InputCom
|
||||
fieldClass="px-6"
|
||||
label="State/Province"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="state"
|
||||
value={props.values.state}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.state && props.touched.state) && props.errors.state}
|
||||
/> */}
|
||||
|
||||
<div className="field w-full grid md:grid-cols-2 gap-4">
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="country"
|
||||
htmlFor="state"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Country</span>
|
||||
{props.errors.country && props.touched.country && (
|
||||
<span>State/Province</span>
|
||||
{props.errors.state && props.touched.state && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.country}
|
||||
{props.errors.state}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="country"
|
||||
name="country"
|
||||
value={props.values.country}
|
||||
id="state"
|
||||
name="state"
|
||||
value={props.values.state}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
disabled={countryCode ? true : false}
|
||||
>
|
||||
{allCountries.loading ?
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Loading...
|
||||
</option>
|
||||
: allCountries.data?.length > 0 ?
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Select Country
|
||||
</option>
|
||||
{allCountries.data?.map(item => (
|
||||
<option key={item.uid} className="text-slate-500 text-lg" value={item.code}>
|
||||
{item.country}
|
||||
{state.loading ?
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Loading...
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
:
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Not Found
|
||||
</option>
|
||||
}
|
||||
: Object.keys(state.data)?.length > 0 ?
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Select State
|
||||
</option>
|
||||
{Object.keys(state.data)?.map((item, index) => (
|
||||
<option key={index} className="text-slate-500 text-lg" value={item}>
|
||||
{state?.data[item]}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
:
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Not Found
|
||||
</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div className='md:col-span-2'>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Phone Number"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="w-full input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="phone_number"
|
||||
value={props.values.phone_number}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.phone_number && props.touched.phone_number) && props.errors.phone_number}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<InputCom
|
||||
disable={true}
|
||||
fieldClass="px-6"
|
||||
label="Email"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="email"
|
||||
value={props.values.email}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.email && props.touched.email) && props.errors.email}
|
||||
/>
|
||||
<div className="hidden field w-full md:grid-cols-2 gap-4">
|
||||
<InputCom
|
||||
disable={true}
|
||||
fieldClass="px-6"
|
||||
label="Firstname"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="firstname"
|
||||
value={props.values.firstname}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.firstname && props.touched.firstname) && props.errors.firstname}
|
||||
/>
|
||||
<InputCom
|
||||
disable={true}
|
||||
fieldClass="px-6"
|
||||
label="Lastname"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="lastname"
|
||||
value={props.values.lastname}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.lastname && props.touched.lastname) && props.errors.lastname}
|
||||
/>
|
||||
</div>
|
||||
<div className="field w-full flex flex-col gap-4">
|
||||
<p className='hidden job-label'>Date of Birth</p>
|
||||
<div className='hidden xxs:grid-cols-3 gap-4'>
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="birthDay"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Day</span>
|
||||
{props.errors.birthDay && props.touched.birthDay && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.birthDay}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="birthDay"
|
||||
name="birthDay"
|
||||
value={props.values.birthDay}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
>
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value=''>
|
||||
select
|
||||
</option>
|
||||
{day.map(item => (
|
||||
<option key={item} className="text-slate-500 text-lg" value={item}>
|
||||
{item}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
</select>
|
||||
</div>
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="birthMonth"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Month</span>
|
||||
{props.errors.birthMonth && props.touched.birthMonth && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.birthMonth}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="birthMonth"
|
||||
name="birthMonth"
|
||||
value={props.values.birthMonth}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
>
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value=''>
|
||||
select
|
||||
</option>
|
||||
{month.map(item => (
|
||||
<option key={item.value} className="text-slate-500 text-lg" value={item.value}>
|
||||
{item.name}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
</select>
|
||||
</div>
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="birthYear"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>Year</span>
|
||||
{props.errors.birthYear && props.touched.birthYear && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.birthYear}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="birthYear"
|
||||
name="birthYear"
|
||||
value={props.values.birthYear}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
>
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value=''>
|
||||
select
|
||||
</option>
|
||||
{year.map(item => (
|
||||
<option key={item} className="text-slate-500 text-lg" value={item}>
|
||||
{item}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className=''>
|
||||
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Date of Birth"
|
||||
label="Zip Code"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="date"
|
||||
name="dob"
|
||||
value={props.values.dob}
|
||||
type="text"
|
||||
name="zipCode"
|
||||
value={props.values.zipCode}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.dob && props.touched.dob) && props.errors.dob}
|
||||
maxDate={year[0] + '-12-31'}
|
||||
minDate={year[year?.length - 1] + '-01-01'}
|
||||
error={(props.errors.zipCode && props.touched.zipCode) && props.errors.zipCode}
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* right part */}
|
||||
<div className='p-4 w-full flex flex-col gap-4 bg-blue-200 dark:bg-slate-900 rounded-2xl'>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Address"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="address"
|
||||
value={props.values.address}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.address && props.touched.address) && props.errors.address}
|
||||
/>
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="City"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="city"
|
||||
value={props.values.city}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.city && props.touched.city) && props.errors.city}
|
||||
/>
|
||||
{/* <InputCom
|
||||
fieldClass="px-6"
|
||||
label="State/Province"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="state"
|
||||
value={props.values.state}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.state && props.touched.state) && props.errors.state}
|
||||
/> */}
|
||||
|
||||
<div className="field w-full grid md:grid-cols-2 gap-4">
|
||||
<div className="field w-full">
|
||||
<label
|
||||
htmlFor="state"
|
||||
className="job-label job-label-flex"
|
||||
>
|
||||
<span>State/Province</span>
|
||||
{props.errors.state && props.touched.state && (
|
||||
<span className="text-[12px] text-red-500">
|
||||
{props.errors.state}
|
||||
</span>
|
||||
)}
|
||||
</label>
|
||||
<select
|
||||
id="state"
|
||||
name="state"
|
||||
value={props.values.state}
|
||||
className={`input-field p-2 mt-3 rounded-full placeholder:text-base text-dark-gray w-full h-[42px] bg-slate-100 focus:ring-0 focus:outline-none border`}
|
||||
onChange={props.handleChange}
|
||||
>
|
||||
{state.loading ?
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Loading...
|
||||
</option>
|
||||
: Object.keys(state.data)?.length > 0 ?
|
||||
<>
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Select State
|
||||
</option>
|
||||
{Object.keys(state.data)?.map((item, index) => (
|
||||
<option key={index} className="text-slate-500 text-lg" value={item}>
|
||||
{state?.data[item]}
|
||||
</option>
|
||||
))}
|
||||
</>
|
||||
:
|
||||
<option className="text-slate-500 text-lg" value="">
|
||||
Not Found
|
||||
</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<InputCom
|
||||
fieldClass="px-6"
|
||||
label="Zip Code"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="zipCode"
|
||||
value={props.values.zipCode}
|
||||
inputHandler={props.handleChange}
|
||||
error={(props.errors.zipCode && props.touched.zipCode) && props.errors.zipCode}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -556,8 +565,8 @@ const VirtualAddCardPopout = ({ details, onClose, situation, walletItem }) => {
|
||||
</>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Form>
|
||||
</Form>
|
||||
</div>
|
||||
)}
|
||||
</Formik>
|
||||
</ModalCom>
|
||||
|
||||
Reference in New Issue
Block a user