From d83661fa7995e5d32548addeb3af67eee848714c Mon Sep 17 00:00:00 2001 From: ShreyasVij Date: Mon, 17 Aug 2026 21:16:30 +0530 Subject: [PATCH 1/4] made changes add gender and hostller --- src/components/ApplicationForm.tsx | 416 +++++++++-- .../supabase/actions/applicants.actions.ts | 679 ++++++++++++++---- src/types/index.d.ts | 4 + 3 files changed, 906 insertions(+), 193 deletions(-) diff --git a/src/components/ApplicationForm.tsx b/src/components/ApplicationForm.tsx index 046c94b..cf48376 100644 --- a/src/components/ApplicationForm.tsx +++ b/src/components/ApplicationForm.tsx @@ -56,23 +56,32 @@ const createEmptyResponses = () => {} as Record ); -const initialForm = { +type FormState = { + name: string; + phone: string; + sid: string; + branch: string; + gender: string; + hosteller: string; + responses: Record; +}; + +const initialForm: FormState = { name: "", phone: "", sid: "", branch: "", - responses: - createEmptyResponses(), + gender: "", + hosteller: "", + responses: createEmptyResponses(), }; export default function ApplicationForm() { const [form, setForm] = - useState(initialForm); + useState(initialForm); const [application, setApplication] = - useState( - null - ); + useState(null); const [ checkingApplication, @@ -97,7 +106,7 @@ export default function ApplicationForm() { */ const updateField = ( - field: keyof typeof initialForm, + field: Exclude, value: string ) => { setForm((current) => ({ @@ -128,43 +137,33 @@ export default function ApplicationForm() { useEffect(() => { let active = true; - const loadApplication = - async () => { - const existing = - await fetchMyApplication(); + const loadApplication = async () => { + const existing = + await fetchMyApplication(); - if (!active) { - return; - } - - if (existing) { - setApplication( - existing - ); + if (!active) { + return; + } - setForm({ - name: - existing.name || - "", - phone: - existing.phone || - "", - sid: - existing.sid || - "", - branch: - existing.branch || - "", - responses: - existing.responses || - createEmptyResponses(), - }); - } + if (existing) { + setApplication(existing); + + setForm({ + name: existing.name || "", + phone: existing.phone || "", + sid: existing.sid || "", + branch: existing.branch || "", + gender: existing.gender || "", + hosteller: + existing.hosteller || "", + responses: + existing.responses || + createEmptyResponses(), + }); + } - setCheckingApplication( - false - ); - }; + setCheckingApplication(false); + }; void loadApplication(); @@ -198,11 +197,23 @@ export default function ApplicationForm() { const branch = form.branch; + const gender = + form.gender; + + const hosteller = + form.hosteller; + + /* + * Validate personal information + */ + if ( !name || !phone || !sid || - !branch + !branch || + !gender || + !hosteller ) { setError( "Please fill in all the required personal fields." @@ -211,6 +222,40 @@ export default function ApplicationForm() { return; } + /* + * Validate gender + */ + + if ( + gender !== "male" && + gender !== "female" + ) { + setError( + "Please select a valid gender." + ); + + return; + } + + /* + * Validate hosteller + */ + + if ( + hosteller !== "yes" && + hosteller !== "no" + ) { + setError( + "Please select whether you are a hosteller." + ); + + return; + } + + /* + * Validate phone + */ + if ( !/^[6-9]\d{9}$/.test( phone @@ -223,6 +268,10 @@ export default function ApplicationForm() { return; } + /* + * Validate SID + */ + if ( !/^\d{8}$/.test(sid) ) { @@ -233,6 +282,10 @@ export default function ApplicationForm() { return; } + /* + * Validate application questions + */ + const missingResponses = APPLICATION_QUESTIONS.some( (question) => @@ -249,6 +302,10 @@ export default function ApplicationForm() { return; } + /* + * Trim all responses + */ + const trimmedResponses = Object.keys( form.responses @@ -276,6 +333,12 @@ export default function ApplicationForm() { sid, phone, branch, + gender as + | "male" + | "female", + hosteller as + | "yes" + | "no", trimmedResponses ); @@ -296,6 +359,10 @@ export default function ApplicationForm() { return; } + /* + * Store returned application + */ + setApplication( result.applicant ); @@ -313,6 +380,12 @@ export default function ApplicationForm() { branch: result.applicant.branch || "", + gender: + result.applicant.gender || + "", + hosteller: + result.applicant.hosteller || + "", responses: result.applicant .responses || @@ -358,11 +431,23 @@ export default function ApplicationForm() { const branch = form.branch; + const gender = + form.gender; + + const hosteller = + form.hosteller; + + /* + * Validate fields + */ + if ( !name || !phone || !sid || - !branch + !branch || + !gender || + !hosteller ) { setError( "Please fill in all the personal information." @@ -371,6 +456,40 @@ export default function ApplicationForm() { return; } + /* + * Validate gender + */ + + if ( + gender !== "male" && + gender !== "female" + ) { + setError( + "Please select a valid gender." + ); + + return; + } + + /* + * Validate hosteller + */ + + if ( + hosteller !== "yes" && + hosteller !== "no" + ) { + setError( + "Please select whether you are a hosteller." + ); + + return; + } + + /* + * Validate phone + */ + if ( !/^[6-9]\d{9}$/.test( phone @@ -383,6 +502,10 @@ export default function ApplicationForm() { return; } + /* + * Validate SID + */ + if ( !/^\d{8}$/.test(sid) ) { @@ -393,9 +516,7 @@ export default function ApplicationForm() { return; } - setSavingPersonalInfo( - true - ); + setSavingPersonalInfo(true); try { const result = @@ -404,7 +525,13 @@ export default function ApplicationForm() { name, phone, sid, - branch + branch, + gender as + | "male" + | "female", + hosteller as + | "yes" + | "no" ); if (!result.success) { @@ -425,20 +552,34 @@ export default function ApplicationForm() { setForm( (current) => ({ ...current, + name: result.applicant .name, + phone: result.applicant .phone || "", + sid: result.applicant .sid, + branch: result.applicant .branch || "", + + gender: + result.applicant + .gender || + "", + + hosteller: + result.applicant + .hosteller || + "", }) ); } catch (updateError) { @@ -513,9 +654,7 @@ export default function ApplicationForm() { }`} > {application.status - .charAt( - 0 - ) + .charAt(0) .toUpperCase() + application.status.slice( 1 @@ -686,6 +825,93 @@ export default function ApplicationForm() { + {/* Gender + Hosteller */} +
+
+ + + +
+ +
+ + + +
+
+ {canEdit && (