signup form

apps/student/app/signup/steps/SemesterGradesStep.tsx

@@ -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>
+  );
+}