Added a confirmation dialog for when the user leaves questions unanswered

src/exams/Listening.tsx

@@ -9,6 +9,7 @@ import {renderSolution} from "@/components/Solutions";
 import ModuleTitle from "@/components/Medium/ModuleTitle";
 import AudioPlayer from "@/components/Low/AudioPlayer";
 import Button from "@/components/Low/Button";
+import BlankQuestionsModal from "@/components/BlankQuestionsModal";
 
 interface Props {
 	exam: ListeningExam;
@@ -20,6 +21,16 @@ export default function Listening({exam, showSolutions = false, onFinish}: Props
 	const [exerciseIndex, setExerciseIndex] = useState(-1);
 	const [timesListened, setTimesListened] = useState(0);
 	const [userSolutions, setUserSolutions] = useState<UserSolution[]>([]);
+	const [showBlankModal, setShowBlankModal] = useState(false);
+
+	const confirmFinishModule = (keepGoing?: boolean) => {
+		if (!keepGoing) {
+			setShowBlankModal(false);
+			return;
+		}
+
+		onFinish(userSolutions.map((x) => ({...x, module: "reading", exam: exam.id})));
+	};
 
 	const nextExercise = (solution?: UserSolution) => {
 		if (solution) {
@@ -31,6 +42,11 @@ export default function Listening({exam, showSolutions = false, onFinish}: Props
 			return;
 		}
 
+		if (!userSolutions.map((x) => x.score.missing).every((x) => x === 0)) {
+			setShowBlankModal(true);
+			return;
+		}
+
 		if (solution) {
 			onFinish(
 				[...userSolutions.filter((x) => x.exercise !== solution.exercise), solution].map((x) => ({...x, module: "listening", exam: exam.id})),
@@ -79,6 +95,7 @@ export default function Listening({exam, showSolutions = false, onFinish}: Props
 
 	return (
 		<>
+			<BlankQuestionsModal isOpen={showBlankModal} onClose={confirmFinishModule} />
 			<div className="flex flex-col h-full w-full gap-8 justify-between">
 				<ModuleTitle
 					exerciseIndex={exerciseIndex + 1}

src/exams/Reading.tsx

@@ -15,6 +15,7 @@ import ProgressBar from "@/components/Low/ProgressBar";
 import ModuleTitle from "@/components/Medium/ModuleTitle";
 import {Divider} from "primereact/divider";
 import Button from "@/components/Low/Button";
+import BlankQuestionsModal from "@/components/BlankQuestionsModal";
 
 interface Props {
 	exam: ReadingExam;
@@ -83,6 +84,16 @@ export default function Reading({exam, showSolutions = false, onFinish}: Props)
 	const [exerciseIndex, setExerciseIndex] = useState(-1);
 	const [showTextModal, setShowTextModal] = useState(false);
 	const [userSolutions, setUserSolutions] = useState<UserSolution[]>([]);
+	const [showBlankModal, setShowBlankModal] = useState(false);
+
+	const confirmFinishModule = (keepGoing?: boolean) => {
+		if (!keepGoing) {
+			setShowBlankModal(false);
+			return;
+		}
+
+		onFinish(userSolutions.map((x) => ({...x, module: "reading", exam: exam.id})));
+	};
 
 	const nextExercise = (solution?: UserSolution) => {
 		if (solution) {
@@ -94,6 +105,11 @@ export default function Reading({exam, showSolutions = false, onFinish}: Props)
 			return;
 		}
 
+		if (!userSolutions.map((x) => x.score.missing).every((x) => x === 0)) {
+			setShowBlankModal(true);
+			return;
+		}
+
 		if (solution) {
 			onFinish(
 				[...userSolutions.filter((x) => x.exercise !== solution.exercise), solution].map((x) => ({...x, module: "reading", exam: exam.id})),
@@ -142,6 +158,7 @@ export default function Reading({exam, showSolutions = false, onFinish}: Props)
 	return (
 		<>
 			<div className="flex flex-col h-full w-full gap-8">
+				<BlankQuestionsModal isOpen={showBlankModal} onClose={confirmFinishModule} />
 				<TextModal {...exam.text} isOpen={showTextModal} onClose={() => setShowTextModal(false)} />
 				<ModuleTitle
 					minTimer={exam.minTimer}