diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index ba0624d..fed3db7 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1,4 +1,5 @@ import { useState, useEffect, useCallback } from "react"; +import { flushSync } from "react-dom"; import { useNavigate, useLocation, @@ -136,15 +137,17 @@ function AppInner() { tweaks.feedbackMode === "auto" ? (data.feedbackMode ?? "end") : tweaks.feedbackMode; - setExam(data); - setExamState({ - currentIdx: 0, - answers: {}, - flags: {}, - notes: "", - revealed: {}, - startedAt: Date.now(), - feedbackMode: fm, + flushSync(() => { + setExam(data); + setExamState({ + currentIdx: 0, + answers: {}, + flags: {}, + notes: "", + revealed: {}, + startedAt: Date.now(), + feedbackMode: fm, + }); }); navigate(`/exam/${slugify(data.title)}/q1`); }; @@ -152,8 +155,10 @@ function AppInner() { const resume = () => { const saved = loadState(); if (saved?.exam && saved?.state) { - setExam(saved.exam); - setExamState(withNotes(saved.state)); + flushSync(() => { + setExam(saved.exam); + setExamState(withNotes(saved.state)); + }); navigate( `/exam/${slugify(saved.exam.title)}/q${saved.state.currentIdx + 1}`, ); @@ -235,18 +240,24 @@ function AppInner() { completedAt: number; }>(`/api/results/${remoteId}`) .then((data) => { - setExam(data.exam); - setExamState(withNotes(data.state)); + flushSync(() => { + setExam(data.exam); + setExamState(withNotes(data.state)); + }); navigate(`/review/${slugify(entry.title)}`); }) .catch(() => { - setExam(entry.exam); - setExamState(withNotes(entry.state)); + flushSync(() => { + setExam(entry.exam); + setExamState(withNotes(entry.state)); + }); navigate(`/review/${slugify(entry.title)}`); }); } else { - setExam(entry.exam); - setExamState(withNotes(entry.state)); + flushSync(() => { + setExam(entry.exam); + setExamState(withNotes(entry.state)); + }); navigate(`/review/${slugify(entry.title)}`); } };