signup form
This commit is contained in:
158
apps/student/app/signup/steps/AcademicDetailsStep.tsx
Normal file
158
apps/student/app/signup/steps/AcademicDetailsStep.tsx
Normal file
@@ -0,0 +1,158 @@
|
||||
// AcademicDetailsStep.tsx
|
||||
'use client';
|
||||
|
||||
import { FormField, FormItem, FormLabel, FormControl, FormMessage } from '@workspace/ui/components/form';
|
||||
import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@workspace/ui/components/select';
|
||||
import { Input } from '@workspace/ui/components/input';
|
||||
import { Separator } from '@workspace/ui/components/separator';
|
||||
|
||||
export default function AcademicDetailsStep({ form }: { form: any }) {
|
||||
const degreeOptions = [
|
||||
{ value: 'btech', label: 'B.Tech' },
|
||||
{ value: 'be', label: 'B.E.' },
|
||||
{ value: 'bsc', label: 'B.Sc' },
|
||||
{ value: 'bca', label: 'BCA' },
|
||||
];
|
||||
|
||||
const yearOptions = [
|
||||
{ value: '2024', label: '2024' },
|
||||
{ value: '2025', label: '2025' },
|
||||
{ value: '2026', label: '2026' },
|
||||
{ value: '2027', label: '2027' },
|
||||
];
|
||||
|
||||
const branchOptions = [
|
||||
{ value: 'cse', label: 'Computer Science' },
|
||||
{ value: 'it', label: 'Information Technology' },
|
||||
{ value: 'ece', label: 'Electronics & Communication' },
|
||||
{ value: 'mechanical', label: 'Mechanical' },
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<h3 className="text-lg font-semibold">Academic Details</h3>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="degree"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Degree *</FormLabel>
|
||||
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select your degree" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
{degreeOptions.map(({ label, value }) => (
|
||||
<SelectItem key={value} value={value}>
|
||||
{label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="year"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Year *</FormLabel>
|
||||
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Year of graduation" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
{yearOptions.map(({ label, value }) => (
|
||||
<SelectItem key={value} value={value}>
|
||||
{label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="branch"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Branch *</FormLabel>
|
||||
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||
<FormControl>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder="Select your branch" />
|
||||
</SelectTrigger>
|
||||
</FormControl>
|
||||
<SelectContent>
|
||||
{branchOptions.map(({ label, value }) => (
|
||||
<SelectItem key={value} value={value}>
|
||||
{label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="ssc"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>SSC % *</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="number" placeholder="10th percentage" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="hsc"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>HSC % *</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="number" placeholder="12th percentage" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="isDiploma"
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex items-center space-x-2">
|
||||
<FormControl>
|
||||
<input type="checkbox" checked={field.value} onChange={(e) => field.onChange(e.target.checked)} />
|
||||
</FormControl>
|
||||
<FormLabel className="!m-0">Diploma Holder?</FormLabel>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
74
apps/student/app/signup/steps/AdditionalDetailsStep.tsx
Normal file
74
apps/student/app/signup/steps/AdditionalDetailsStep.tsx
Normal file
@@ -0,0 +1,74 @@
|
||||
// AdditionalDetailsStep.tsx
|
||||
'use client';
|
||||
|
||||
import {
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormControl,
|
||||
FormMessage,
|
||||
FormDescription,
|
||||
} from '@workspace/ui/components/form';
|
||||
import { Input } from '@workspace/ui/components/input';
|
||||
import { Textarea } from '@workspace/ui/components/textarea';
|
||||
|
||||
export default function AdditionalDetailsStep({ form }: { form: any }) {
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<h3 className="text-lg font-semibold">Additional Details</h3>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="linkedin"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>LinkedIn Profile *</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="url" placeholder="https://linkedin.com/in/yourprofile" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="github"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>GitHub Profile *</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="url" placeholder="https://github.com/yourusername" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="skills"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Skills</FormLabel>
|
||||
<FormControl>
|
||||
<Textarea
|
||||
placeholder="JavaScript, React, Node.js, Python"
|
||||
className="resize-none"
|
||||
value={field.value ? (Array.isArray(field.value) ? field.value.join(", ") : field.value) : ""}
|
||||
onChange={e => {
|
||||
const value = e.target.value;
|
||||
field.onChange(value.split(',').map(s => s.trim()).filter(Boolean));
|
||||
}}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormDescription>Use commas to separate skills</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
176
apps/student/app/signup/steps/InternshipStep.tsx
Normal file
176
apps/student/app/signup/steps/InternshipStep.tsx
Normal file
@@ -0,0 +1,176 @@
|
||||
// InternshipStep.tsx
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
import { Button } from '@workspace/ui/components/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@workspace/ui/components/card';
|
||||
import { Input } from '@workspace/ui/components/input';
|
||||
import { Textarea } from '@workspace/ui/components/textarea';
|
||||
import { Separator } from '@workspace/ui/components/separator';
|
||||
import { FormField, FormItem, FormLabel, FormControl, FormMessage } from '@workspace/ui/components/form';
|
||||
import { useForm } from 'react-hook-form';
|
||||
|
||||
export default function InternshipStep({ form }: { form: any }) {
|
||||
const [modalOpen, setModalOpen] = useState(false);
|
||||
const { getValues, setValue } = form;
|
||||
const internships = getValues('internships') || [];
|
||||
|
||||
const modalForm = useForm({
|
||||
defaultValues: {
|
||||
title: '',
|
||||
company: '',
|
||||
description: '',
|
||||
location: '',
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
},
|
||||
});
|
||||
|
||||
const addInternship = () => {
|
||||
const data = modalForm.getValues();
|
||||
const updated = [...internships, data];
|
||||
setValue('internships', updated);
|
||||
modalForm.reset();
|
||||
setModalOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex justify-between items-center">
|
||||
<h3 className="text-lg font-semibold">Internships</h3>
|
||||
<Button variant="outline" onClick={() => setModalOpen(true)}>
|
||||
Add Internship
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Custom Modal */}
|
||||
{modalOpen && (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50">
|
||||
<div className="bg-white rounded-lg shadow-lg w-full max-w-lg p-6 relative">
|
||||
<button
|
||||
className="absolute top-2 right-2 text-gray-500 hover:text-gray-700"
|
||||
onClick={() => setModalOpen(false)}
|
||||
aria-label="Close"
|
||||
>
|
||||
×
|
||||
</button>
|
||||
<h2 className="text-xl font-bold mb-4">Add Internship Details</h2>
|
||||
<div className="grid grid-cols-1 gap-4">
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="title"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Title</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="e.g. SDE Intern" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="company"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Company</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="e.g. Google" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="description"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Description</FormLabel>
|
||||
<FormControl>
|
||||
<Textarea {...field} placeholder="Describe your work..." />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="location"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Location</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="Remote / Mumbai" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="startDate"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Start Date</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="date" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="endDate"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>End Date</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="date" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-end mt-6 gap-2">
|
||||
<Button variant="outline" onClick={() => setModalOpen(false)}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button onClick={addInternship}>Add</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="space-y-4">
|
||||
{internships.length === 0 && (
|
||||
<p className="text-sm text-muted-foreground">No internships added yet.</p>
|
||||
)}
|
||||
|
||||
{internships.map((intern: any, idx: number) => (
|
||||
<Card key={idx} className="bg-muted">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base font-semibold">
|
||||
{intern.title} at {intern.company}
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-1 text-sm">
|
||||
<p>{intern.location}</p>
|
||||
<p>
|
||||
{intern.startDate} to {intern.endDate}
|
||||
</p>
|
||||
<p>{intern.description}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
140
apps/student/app/signup/steps/PersonalDetailsStep.tsx
Normal file
140
apps/student/app/signup/steps/PersonalDetailsStep.tsx
Normal file
@@ -0,0 +1,140 @@
|
||||
// PersonalDetailsStep.tsx
|
||||
'use client';
|
||||
|
||||
import {
|
||||
FormField,
|
||||
FormItem,
|
||||
FormLabel,
|
||||
FormControl,
|
||||
FormMessage,
|
||||
FormDescription,
|
||||
} from '@workspace/ui/components/form';
|
||||
import { Input } from '@workspace/ui/components/input';
|
||||
import { Textarea } from '@workspace/ui/components/textarea';
|
||||
import { Separator } from '@workspace/ui/components/separator';
|
||||
|
||||
export default function PersonalDetailsStep({ form }: { form: any }) {
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<h3 className="text-lg font-semibold">Personal Details</h3>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="firstName"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>First Name *</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="Enter your first name" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="lastName"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Last Name *</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="Enter your last name" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="middleName"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Middle Name</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="Enter your middle name" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="mothersName"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Mother's Name *</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="Enter your mother's name" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="personalGmail"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Personal Email *</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="email" placeholder="Enter your Gmail address" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="rollNumber"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Roll Number *</FormLabel>
|
||||
<FormControl>
|
||||
<Input placeholder="Enter your roll number" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="phoneNumber"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Phone Number *</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="tel" placeholder="Enter your phone number" {...field} />
|
||||
</FormControl>
|
||||
<FormDescription>Without country code</FormDescription>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name="address"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Address *</FormLabel>
|
||||
<FormControl>
|
||||
<Textarea placeholder="Enter your address" className="resize-none" {...field} />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
113
apps/student/app/signup/steps/ResumeStep.tsx
Normal file
113
apps/student/app/signup/steps/ResumeStep.tsx
Normal file
@@ -0,0 +1,113 @@
|
||||
// ResumeStep.tsx
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
import { Button } from '@workspace/ui/components/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@workspace/ui/components/card';
|
||||
import { Input } from '@workspace/ui/components/input';
|
||||
import { Separator } from '@workspace/ui/components/separator';
|
||||
import { FormField, FormItem, FormLabel, FormControl, FormMessage } from '@workspace/ui/components/form';
|
||||
import { useForm } from 'react-hook-form';
|
||||
|
||||
export default function ResumeStep({ form }: { form: any }) {
|
||||
const [modalOpen, setModalOpen] = useState(false);
|
||||
const { getValues, setValue } = form;
|
||||
const resumes = getValues('resume') || [];
|
||||
|
||||
const modalForm = useForm({
|
||||
defaultValues: {
|
||||
title: '',
|
||||
link: '',
|
||||
},
|
||||
});
|
||||
|
||||
const addResume = () => {
|
||||
const data = modalForm.getValues();
|
||||
const updated = [...resumes, data];
|
||||
setValue('resume', updated);
|
||||
modalForm.reset();
|
||||
setModalOpen(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex justify-between items-center">
|
||||
<h3 className="text-lg font-semibold">Resumes</h3>
|
||||
<Button variant="outline" onClick={() => setModalOpen(true)}>
|
||||
Add Resume
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Custom Modal */}
|
||||
{modalOpen && (
|
||||
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50">
|
||||
<div className="bg-white rounded-lg shadow-lg w-full max-w-lg p-6 relative">
|
||||
<button
|
||||
className="absolute top-2 right-2 text-gray-500 hover:text-gray-700"
|
||||
onClick={() => setModalOpen(false)}
|
||||
aria-label="Close"
|
||||
>
|
||||
×
|
||||
</button>
|
||||
<h2 className="text-xl font-bold mb-4">Add Resume</h2>
|
||||
<div className="grid grid-cols-1 gap-4">
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="title"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Title</FormLabel>
|
||||
<FormControl>
|
||||
<Input {...field} placeholder="e.g. Summer 2025 Resume" />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
<FormField
|
||||
control={modalForm.control}
|
||||
name="link"
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>Link</FormLabel>
|
||||
<FormControl>
|
||||
<Input type="url" {...field} placeholder="https://drive.google.com/..." />
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<div className="flex justify-end mt-6 gap-2">
|
||||
<Button variant="outline" onClick={() => setModalOpen(false)}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button onClick={addResume}>Add</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Separator />
|
||||
|
||||
<div className="space-y-4">
|
||||
{resumes.length === 0 && (
|
||||
<p className="text-sm text-muted-foreground">No resumes uploaded yet.</p>
|
||||
)}
|
||||
|
||||
{resumes.map((resume: any, idx: number) => (
|
||||
<Card key={idx} className="bg-muted">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base font-semibold">{resume.title}</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="text-sm">
|
||||
<a href={resume.link} target="_blank" rel="noopener noreferrer" className="text-blue-600 underline">
|
||||
{resume.link}
|
||||
</a>
|
||||
</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
78
apps/student/app/signup/steps/SemesterGradesStep.tsx
Normal file
78
apps/student/app/signup/steps/SemesterGradesStep.tsx
Normal file
@@ -0,0 +1,78 @@
|
||||
// SemesterGradesStep.tsx
|
||||
'use client';
|
||||
|
||||
import { Controller } from 'react-hook-form';
|
||||
import { Input } from '@workspace/ui/components/input';
|
||||
import { Checkbox } from '@workspace/ui/components/checkbox';
|
||||
import { FormField, FormItem, FormLabel, FormControl, FormMessage } from '@workspace/ui/components/form';
|
||||
import { Separator } from '@workspace/ui/components/separator';
|
||||
|
||||
export default function SemesterGradesStep({ form }: { form: any }) {
|
||||
const sems = Array.from({ length: 8 }, (_, i) => i + 1);
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<h3 className="text-lg font-semibold">Semester Grades</h3>
|
||||
|
||||
{sems.map((sem) => (
|
||||
<div key={sem} className="border p-4 rounded-md shadow-sm">
|
||||
<h4 className="font-medium text-md mb-2">Semester {sem}</h4>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||
<FormField
|
||||
control={form.control}
|
||||
name={`sgpi.${sem - 1}.sgpi`}
|
||||
render={({ field }) => (
|
||||
<FormItem>
|
||||
<FormLabel>SGPI *</FormLabel>
|
||||
<FormControl>
|
||||
<Input
|
||||
type="number"
|
||||
step="0.01"
|
||||
placeholder="e.g., 9.86"
|
||||
value={field.value ?? ''}
|
||||
onChange={e => {
|
||||
const val = e.target.value;
|
||||
field.onChange(val === '' ? '' : Number(val));
|
||||
}}
|
||||
/>
|
||||
</FormControl>
|
||||
<FormMessage />
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name={`sgpi.${sem - 1}.kt`}
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex items-center space-x-2">
|
||||
<FormControl>
|
||||
<Checkbox checked={field.value} onCheckedChange={field.onChange} />
|
||||
</FormControl>
|
||||
<FormLabel className="!m-0">KT?</FormLabel>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
|
||||
<FormField
|
||||
control={form.control}
|
||||
name={`sgpi.${sem - 1}.ktDead`}
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex items-center space-x-2">
|
||||
<FormControl>
|
||||
<Checkbox checked={field.value} onCheckedChange={field.onChange} />
|
||||
</FormControl>
|
||||
<FormLabel className="!m-0">KT Dead?</FormLabel>
|
||||
</FormItem>
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
|
||||
<Separator />
|
||||
<p className="text-sm text-muted-foreground">Note: First 4 semesters are mandatory.</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user