Enabled a way for students to do assigned tasks

src/dashboards/Student.tsx

@@ -3,12 +3,17 @@ import ProgressBar from "@/components/Low/ProgressBar";
 import ProfileSummary from "@/components/ProfileSummary";
 import useAssignments from "@/hooks/useAssignments";
 import useStats from "@/hooks/useStats";
+import {Assignment} from "@/interfaces/results";
 import {User} from "@/interfaces/user";
-import {MODULE_ARRAY} from "@/utils/moduleUtils";
+import useExamStore from "@/stores/examStore";
+import {getExamById} from "@/utils/exams";
+import {MODULE_ARRAY, sortByModule} from "@/utils/moduleUtils";
 import {averageScore, groupBySession} from "@/utils/stats";
 import clsx from "clsx";
 import {capitalize} from "lodash";
 import moment from "moment";
+import Link from "next/link";
+import {useRouter} from "next/router";
 import {BsArrowRepeat, BsBook, BsFileEarmarkText, BsHeadphones, BsMegaphone, BsPen, BsPencil, BsStar} from "react-icons/bs";
 
 interface Props {
@@ -19,6 +24,35 @@ export default function StudentDashboard({user}: Props) {
 	const {stats} = useStats(user.id);
 	const {assignments, isLoading: isAssignmentsLoading, reload: reloadAssignments} = useAssignments({assignees: user?.id});
 
+	const router = useRouter();
+
+	const setExams = useExamStore((state) => state.setExams);
+	const setShowSolutions = useExamStore((state) => state.setShowSolutions);
+	const setUserSolutions = useExamStore((state) => state.setUserSolutions);
+	const setSelectedModules = useExamStore((state) => state.setSelectedModules);
+	const setAssignment = useExamStore((state) => state.setAssignment);
+
+	const startAssignment = (assignment: Assignment) => {
+		const examPromises = assignment.exams.map((e) => getExamById(e.module, e.id));
+
+		Promise.all(examPromises).then((exams) => {
+			if (exams.every((x) => !!x)) {
+				setUserSolutions([]);
+				setShowSolutions(false);
+				setExams(exams.map((x) => x!).sort(sortByModule));
+				setSelectedModules(
+					exams
+						.map((x) => x!)
+						.sort(sortByModule)
+						.map((x) => x!.module),
+				);
+				setAssignment(assignment);
+
+				router.push("/exercises");
+			}
+		});
+	};
+
 	return (
 		<>
 			<ProfileSummary
@@ -65,7 +99,12 @@ export default function StudentDashboard({user}: Props) {
 						.filter((a) => moment(a.endDate).isSameOrAfter(moment()))
 						.sort((a, b) => moment(a.startDate).diff(b.startDate))
 						.map((assignment) => (
-							<div className="border border-mti-gray-anti-flash rounded-xl flex flex-col gap-6 p-4 min-w-[300px]" key={assignment.id}>
+							<div
+								className={clsx(
+									"border border-mti-gray-anti-flash rounded-xl flex flex-col gap-6 p-4 min-w-[300px]",
+									assignment.results.map((r) => r.user).includes(user.id) && "border-mti-green-light",
+								)}
+								key={assignment.id}>
 								<div className="flex flex-col gap-1">
 									<h3 className="font-semibold text-xl text-mti-black/90">{assignment.name}</h3>
 									<span className="flex gap-1 justify-between">
@@ -120,11 +159,21 @@ export default function StudentDashboard({user}: Props) {
 											<Button
 												disabled={moment(assignment.startDate).isAfter(moment())}
 												className="w-full max-w-[50%] h-full !rounded-xl -md:hidden"
+												onClick={() => startAssignment(assignment)}
 												variant="outline">
 												Start
 											</Button>
 										</>
 									)}
+									{assignment.results.map((r) => r.user).includes(user.id) && (
+										<Button
+											onClick={() => router.push("/record")}
+											color="green"
+											className="w-full max-w-[50%] h-full !rounded-xl -md:hidden"
+											variant="outline">
+											Submitted
+										</Button>
+									)}
 								</div>
 							</div>
 						))}