Added the same functionality to the Assignments

src/dashboards/AssignmentCreator.tsx

@@ -19,7 +19,8 @@ import {toast} from "react-toastify";
 import {uuidv4} from "@firebase/util";
 import {Assignment} from "@/interfaces/results";
 import Checkbox from "@/components/Low/Checkbox";
-import {Variant} from "@/interfaces/exam";
+import {InstructorGender, Variant} from "@/interfaces/exam";
+import Select from "@/components/Low/Select";
 
 interface Props {
 	isCreating: boolean;
@@ -40,6 +41,7 @@ export default function AssignmentCreator({isCreating, assignment, assigner, gro
 		assignment ? moment(assignment.endDate).toDate() : moment().hours(23).minutes(59).add(8, "day").toDate(),
 	);
 	const [variant, setVariant] = useState<Variant>("full");
+	const [instructorGender, setInstructorGender] = useState<InstructorGender>(assignment?.instructorGender || "varied");
 	// creates a new exam for each assignee or just one exam for all assignees
 	const [generateMultiple, setGenerateMultiple] = useState<boolean>(false);
 
@@ -63,6 +65,7 @@ export default function AssignmentCreator({isCreating, assignment, assigner, gro
 			selectedModules,
 			generateMultiple,
 			variant,
+			instructorGender,
 		})
 			.then(() => {
 				toast.success(`The assignment "${name}" has been ${assignment ? "updated" : "created"} successfully!`);
@@ -226,6 +229,20 @@ export default function AssignmentCreator({isCreating, assignment, assigner, gro
 					</div>
 				</div>
 
+				<div className="flex flex-col gap-3 w-full">
+					<label className="font-normal text-base text-mti-gray-dim">Speaking Instructor&apos;s Gender</label>
+					<Select
+						value={{value: instructorGender, label: capitalize(instructorGender)}}
+						onChange={(value) => (value ? setInstructorGender(value.value as InstructorGender) : null)}
+						disabled={!selectedModules.includes("speaking") || !!assignment}
+						options={[
+							{value: "male", label: "Male"},
+							{value: "female", label: "Female"},
+							{value: "varied", label: "Varied"},
+						]}
+					/>
+				</div>
+
 				<section className="w-full flex flex-col gap-3">
 					<span className="font-semibold">Assignees ({assignees.length} selected)</span>
 					<div className="flex gap-4 overflow-x-scroll scrollbar-hide">

src/interfaces/results.ts

@@ -1,4 +1,5 @@
 import {Module} from "@/interfaces";
+import {InstructorGender} from "./exam";
 import {Stat} from "./user";
 
 export type UserResults = {[key in Module]: ModuleResult};
@@ -19,7 +20,8 @@ export interface Assignment {
 		type: "academic" | "general";
 		stats: Stat[];
 	}[];
-	exams: {id: string; module: Module, assignee: string}[];
+	exams: {id: string; module: Module; assignee: string}[];
+	instructorGender?: InstructorGender;
 	startDate: Date;
 	endDate: Date;
 }

src/pages/api/assignments/index.ts

@@ -86,7 +86,7 @@ const generateExams = async (
 	}
 
 	const selectedModulePromises = selectedModules.map(async (module: Module) => {
-		const exams: Exam[] = await getExams(db, module, "false", undefined);
+		const exams: Exam[] = await getExams(db, module, "false", undefined, variant, instructorGender);
 		const exam = exams[getRandomIndex(exams)];
 
 		if (exam) {
@@ -133,6 +133,7 @@ async function POST(req: NextApiRequest, res: NextApiResponse) {
 		assignees,
 		results: [],
 		exams,
+		instructorGender,
 		...body,
 	});