Updated the Record to start with the overall screen

src/components/Solutions/Writing.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @next/next/no-img-element */
 import {WritingExercise} from "@/interfaces/exam";
 import {CommonProps} from ".";
-import {Fragment, useState} from "react";
+import {Fragment, useEffect, useState} from "react";
 import Button from "../Low/Button";
 import {Dialog, Tab, Transition} from "@headlessui/react";
 import {writingReverseMarking} from "@/utils/score";
@@ -85,7 +85,7 @@ export default function Writing({id, type, prompt, attachment, userSolutions, on
 				</div>
 
 				<div className="w-full h-full flex flex-col gap-8">
-					{userSolutions && (
+					{userSolutions && userSolutions.length > 0 && (
 						<div className="flex flex-col gap-4 w-full">
 							<span>Your answer:</span>
 							<div className="w-full h-full min-h-[320px] cursor-text px-7 py-8 input border-2 border-mti-gray-platinum bg-white rounded-3xl whitespace-pre-wrap">

src/pages/(exam)/ExamPage.tsx

@@ -30,7 +30,7 @@ interface Props {
 
 export default function ExamPage({page}: Props) {
 	const [hasBeenUploaded, setHasBeenUploaded] = useState(false);
-	const [moduleIndex, setModuleIndex] = useState(0);
+	const [moduleIndex, setModuleIndex] = useState(-1);
 	const [sessionId, setSessionId] = useState("");
 	const [exam, setExam] = useState<Exam>();
 	const [isEvaluationLoading, setIsEvaluationLoading] = useState(false);
@@ -247,14 +247,15 @@ export default function ExamPage({page}: Props) {
 					user={user!}
 					disableSelection={page === "exams"}
 					onStart={(modules, avoid) => {
-						setSelectedModules(modules);
+						setModuleIndex(0);
 						setAvoidRepeated(avoid);
+						setSelectedModules(modules);
 					}}
 				/>
 			);
 		}
 
-		if (moduleIndex >= selectedModules.length) {
+		if (moduleIndex >= selectedModules.length || moduleIndex === -1) {
 			return (
 				<Finish
 					isLoading={isEvaluationLoading}

src/pages/record.tsx

@@ -24,7 +24,7 @@ import useGroups from "@/hooks/useGroups";
 import {shouldRedirectHome} from "@/utils/navigation.disabled";
 import useAssignments from "@/hooks/useAssignments";
 import {uuidv4} from "@firebase/util";
-import { usePDFDownload } from "@/hooks/usePDFDownload";
+import {usePDFDownload} from "@/hooks/usePDFDownload";
 
 export const getServerSideProps = withIronSessionSsr(({req, res}) => {
 	const user = req.session.user;
@@ -175,7 +175,7 @@ export default function History({user}: {user: User}) {
 			level: calculateBandScore(x.correct, x.total, x.module, user.focus),
 		}));
 
-		const { timeSpent, session } = dateStats[0];
+		const {timeSpent, session} = dateStats[0];
 
 		const selectExam = () => {
 			const examPromises = uniqBy(dateStats, "exam").map((stat) => getExamById(stat.module, stat.exam));
@@ -201,7 +201,7 @@ export default function History({user}: {user: User}) {
 			correct / total >= 0.3 && correct / total < 0.7 && "text-mti-red",
 			correct / total < 0.3 && "text-mti-rose",
 		);
-		
+
 		const content = (
 			<>
 				<div className="w-full flex justify-between -md:items-center 2xl:items-center">
@@ -215,8 +215,7 @@ export default function History({user}: {user: User}) {
 						)}
 					</div>
 					<div className="flex flex-row gap-2">
-						<span
+						<span className={textColor}>
-							className={textColor}>
 							Level{" "}
 							{(aggregatedLevels.reduce((accumulator, current) => accumulator + current.level, 0) / aggregatedLevels.length).toFixed(1)}
 						</span>