diff --git a/src/app/(frontend)/signup/_components/SignupForm.tsx b/src/app/(frontend)/signup/_components/SignupForm.tsx index a2e977f..a14bd17 100644 --- a/src/app/(frontend)/signup/_components/SignupForm.tsx +++ b/src/app/(frontend)/signup/_components/SignupForm.tsx @@ -132,11 +132,14 @@ export default function SignupForm({ email, token }: SignupFormProps) { placeholder="Enter Here" {...register('email')} error={errors.email} - className={"w-full placeholder:text-gray " + (!!email ? 'bg-primary-grey-light' : '')} + className={ + 'w-full placeholder:text-gray ' + + (!!email ? 'bg-primary-grey-light' : '') + } required={true} readOnly={!!email} /> -
+
diff --git a/src/components/ui/FormInput.tsx b/src/components/ui/FormInput.tsx index 2c6ad3d..8659c73 100644 --- a/src/components/ui/FormInput.tsx +++ b/src/components/ui/FormInput.tsx @@ -15,7 +15,10 @@ interface FormInputProps extends InputHTMLAttributes { } const FormInput = forwardRef( - ({ label, placeholder, error, className, tooltip, showTooltip, required, textarea, ...rest }, ref) => { + ( + { label, placeholder, error, className, tooltip, showTooltip, required, textarea, ...rest }, + ref, + ) => { const [isHovered, setIsHovered] = useState(false); return (
@@ -77,8 +80,8 @@ const FormInput = forwardRef {error?.message} diff --git a/src/components/ui/FormSelect.tsx b/src/components/ui/FormSelect.tsx index 2fe4d24..b53279f 100644 --- a/src/components/ui/FormSelect.tsx +++ b/src/components/ui/FormSelect.tsx @@ -79,8 +79,8 @@ const FormSelect = forwardRef(

{error?.message} diff --git a/src/lib/zod/schema/signupInput.ts b/src/lib/zod/schema/signupInput.ts index 5b4e7b7..1a3bd65 100644 --- a/src/lib/zod/schema/signupInput.ts +++ b/src/lib/zod/schema/signupInput.ts @@ -1,25 +1,42 @@ -import { z } from "zod"; +import { z } from 'zod'; export const signupSchema = z.object({ timestamp: z.date(), - firstName: z.string().min(1, "First name is required").max(50, "First name must be less than 50 characters"), - lastName: z.string().min(1, "Last name is required").max(50, "Last name must be less than 50 characters"), - gender: z.enum(["male", "female", "other", "prefer not to say"], { + firstName: z + .string() + .min(1, 'First name is required') + .max(50, 'First name must be less than 50 characters'), + lastName: z + .string() + .min(1, 'Last name is required') + .max(50, 'Last name must be less than 50 characters'), + gender: z.enum(['male', 'female', 'other', 'prefer not to say'], { // This is done so that the error message shown when an option is not selected is more user-friendly // instead of the default "Invalid enum value". This is because the placeholder option is not a valid enum value, // but i still want to show it as an option in the select dropdown to explain what the field is for. // If a label is added above the select dropdown, then this can be removed. - errorMap: () => ({ message: "Please select a valid gender option" }), + errorMap: () => ({ message: 'Please select a valid gender option' }), }), - email: z.string().email("Invalid email address"), - studentID: z.string().regex(/^\d{9}$/, "Student ID must be a 9-digit number").optional().or(z.literal("")), - upi: z.string().regex(/^[a-z]{3,4}\d{3}$/, "UPI must be 3 or 4 lowercase letters followed by 3 digits").optional().or(z.literal("")), - yearOfStudy: z.enum(["1st Year", "2nd Year", "3rd Year", "4th Year+"], { - errorMap: () => ({ message: "Please select a valid year of study" }), + email: z.string().email('Invalid email address'), + studentID: z + .string() + .regex(/^\d{9}$/, 'Student ID must be a 9-digit number') + .optional() + .or(z.literal('')), + upi: z + .string() + .regex(/^([A-Za-z]{3,4}\d{3,4})?$/, 'UPI/AUT Network must be 3-4 letters + 3-4 digits') + .optional(), + yearOfStudy: z.enum(['1st Year', '2nd Year', '3rd Year', '4th Year+'], { + errorMap: () => ({ message: 'Please select year of study' }), }), - ethnicity: z.string().min(1, "Ethnicity is required"), + ethnicity: z.string().min(1, 'Ethnicity is required'), convincedByCommitteeMember: z.string().optional(), - membershipCardNumber: z.string().regex(/^\d+$/, "Membership card number must be an integer").optional().or(z.literal("")), + membershipCardNumber: z + .string() + .regex(/^\d+$/, 'Membership card number must be an integer') + .optional() + .or(z.literal('')), membershipPayment: z.string().optional(), paymentScreenshotLink: z.string().optional(), referrerName: z.string().optional(), @@ -27,4 +44,4 @@ export const signupSchema = z.object({ token: z.string().optional(), }); -export type SignupInput = z.infer; \ No newline at end of file +export type SignupInput = z.infer;