devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added a National ID/Passport field to the demographic information of a student

Browse Source
This commit is contained in:
Tiago Ribeiro
2024-01-11 11:05:14 +00:00
parent 174398b4f7
commit 0c9f0b3dbd
4 changed files with 61 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/DemographicInformationInput.tsx
View File

@@ -19,6 +19,7 @@ interface Props {
export default function DemographicInformationInput({user, mutateUser}: Props) {
const [country, setCountry] = useState<string>();
const [phone, setPhone] = useState<string>();
const [passport_id, setPassportID] = useState<string>();
const [gender, setGender] = useState<Gender>();
const [employment, setEmployment] = useState<EmploymentStatus>();
const [position, setPosition] = useState<string>();
@@ -39,6 +40,7 @@ export default function DemographicInformationInput({user, mutateUser}: Props) {
gender,
employment: user.type === "corporate" ? undefined : employment,
position: user.type === "corporate" ? position : undefined,
passport_id,
},
agentInformation: user.type === "agent" ? {companyName, commercialRegistration} : undefined,
})
@@ -72,11 +74,23 @@ export default function DemographicInformationInput({user, mutateUser}: Props) {
/>
</div>
)}
<div className="relative flex flex-col gap-3 w-full">
<label className="font-normal text-base text-mti-gray-dim">Country *</label>
<CountrySelect value={country} onChange={setCountry} />
<div className="w-full grid grid-cols-2 gap-6">
<div className="relative flex flex-col gap-3 w-full">
<label className="font-normal text-base text-mti-gray-dim">Country *</label>
<CountrySelect value={country} onChange={setCountry} />
</div>
<Input type="tel" name="phone" label="Phone number" onChange={(e) => setPhone(e)} placeholder="Enter phone number" required />
</div>
<Input type="tel" name="phone" label="Phone number" onChange={(e) => setPhone(e)} placeholder="Enter phone number" required />
{user.type === "student" && (
<Input
type="text"
name="passport_id"
label="Passport/National ID"
onChange={(e) => setPassportID(e)}
placeholder="Enter National ID or Passport number"
required
/>
)}
<div className="relative flex flex-col gap-3 w-full">
<label className="font-normal text-base text-mti-gray-dim">Gender *</label>
<RadioGroup value={gender} onChange={setGender} className="flex flex-row justify-between">