- Adapted the exam to store all of its information to Zustand;

- Made it so, every time there is a change or every X seconds, it saves the session;

src/pages/(exam)/ExamPage.tsx

@@ -16,11 +16,12 @@ import {Exam, UserSolution, Variant} from "@/interfaces/exam";
 import {Stat} from "@/interfaces/user";
 import useExamStore from "@/stores/examStore";
 import {evaluateSpeakingAnswer, evaluateWritingAnswer} from "@/utils/evaluation";
-import {getExam} from "@/utils/exams";
+import {defaultExamUserSolutions, getExam} from "@/utils/exams";
 import axios from "axios";
 import {useRouter} from "next/router";
 import {toast, ToastContainer} from "react-toastify";
 import {v4 as uuidv4} from "uuid";
+import useSessions from "@/hooks/useSessions";
 
 interface Props {
 	page: "exams" | "exercises";
@@ -33,11 +34,15 @@ export default function ExamPage({page}: Props) {
 	const [showAbandonPopup, setShowAbandonPopup] = useState(false);
 	const [isEvaluationLoading, setIsEvaluationLoading] = useState(false);
 	const [statsAwaitingEvaluation, setStatsAwaitingEvaluation] = useState<string[]>([]);
+	const [timeSpent, setTimeSpent] = useState(0);
+
+	const partIndex = useExamStore((state) => state.partIndex);
+	const assignment = useExamStore((state) => state.assignment);
+	const initialTimeSpent = useExamStore((state) => state.timeSpent);
+	const exerciseIndex = useExamStore((state) => state.exerciseIndex);
 
-	const {assignment} = useExamStore((state) => state);
 	const {exam, setExam} = useExamStore((state) => state);
 	const {exams, setExams} = useExamStore((state) => state);
-	const {timeSpent, setTimeSpent} = useExamStore((state) => state);
 	const {sessionId, setSessionId} = useExamStore((state) => state);
 	const {moduleIndex, setModuleIndex} = useExamStore((state) => state);
 	const {userSolutions, setUserSolutions} = useExamStore((state) => state);
@@ -47,16 +52,56 @@ export default function ExamPage({page}: Props) {
 	const {user} = useUser({redirectTo: "/login"});
 	const router = useRouter();
 
-	useEffect(() => setSessionId(uuidv4()), [setSessionId]);
+	// eslint-disable-next-line react-hooks/exhaustive-deps
+	const saveSession = async () => {
+		await axios.post("/api/sessions", {
+			id: sessionId,
+			userSolutions,
+			moduleIndex,
+			selectedModules,
+			assignment,
+			timeSpent,
+			exams,
+			exam,
+			partIndex,
+			exerciseIndex,
+			user: user?.id,
+		});
+	};
+
+	useEffect(() => setTimeSpent((prev) => prev + initialTimeSpent), [initialTimeSpent]);
+
+	useEffect(() => {
+		if (userSolutions.length === 0 && exams.length > 0) {
+			const defaultSolutions = exams.map(defaultExamUserSolutions).flat();
+			setUserSolutions(defaultSolutions);
+		}
+	}, [exams, setUserSolutions, userSolutions]);
+
+	useEffect(() => {
+		if (sessionId.length > 0 && userSolutions.length > 0 && selectedModules.length > 0 && exams.length > 0 && !!exam && timeSpent > 0)
+			saveSession();
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, [assignment, exam, exams, moduleIndex, selectedModules, sessionId, userSolutions, user, exerciseIndex, partIndex]);
+
+	useEffect(() => {
+		if (timeSpent % 20 === 0 && timeSpent > 0) saveSession();
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, [timeSpent]);
+
+	useEffect(() => {
+		if (selectedModules.length > 0) {
+			setSessionId(uuidv4());
+		}
+	}, [setSessionId, selectedModules]);
 	useEffect(() => {
 		if (user?.type === "developer") console.log(exam);
 	}, [exam, user]);
 
 	useEffect(() => {
-		selectedModules.length > 0 && timeSpent === 0 && !showSolutions;
 		if (selectedModules.length > 0 && timeSpent === 0 && !showSolutions) {
 			const timerInterval = setInterval(() => {
-				setTimeSpent(timeSpent + 1);
+				setTimeSpent((prev) => prev + 1);
 			}, 1000);
 
 			return () => {