From d107139d6cbd8fadb3e89a73aa7515fb3f46ebc4 Mon Sep 17 00:00:00 2001
From: Victor Giers <mail@victorgiers.com>
Date: Thu, 8 Jan 2026 02:04:16 +0100
Subject: [PATCH] Add useEffect hooks for state management in QuizRunner

---
 client/src/components/QuizRunner.tsx | 26 ++++++++++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/client/src/components/QuizRunner.tsx b/client/src/components/QuizRunner.tsx
index a14e37a..9829550 100644
--- a/client/src/components/QuizRunner.tsx
+++ b/client/src/components/QuizRunner.tsx
@@ -418,6 +418,32 @@ export default function QuizRunner({ defaultMode = 'all', defaultEntryId, autoSt
   const correctText = deriveCorrectText(currentQuestion);
   const shouldShowExplanation = showResult && (!lastCorrect || showExplanation);
 
+  useEffect(() => {
+    if (status !== 'running') return;
+    const saved = history[currentIndex];
+    if (saved) {
+      setResponse(saved.response);
+      setShowResult(true);
+      setLastCorrect(saved.correct);
+      setLastSkipped(saved.skipped);
+      setShowExplanation(saved.showExplanation);
+    } else {
+      resetQuestionState();
+    }
+  }, [currentIndex, history, status]);
+
+  useEffect(() => {
+    if (!showResult) return;
+    setHistory((prev) => {
+      const next = [...prev];
+      const existing = next[currentIndex];
+      if (existing) {
+        next[currentIndex] = { ...existing, showExplanation };
+      }
+      return next;
+    });
+  }, [showExplanation, showResult, currentIndex]);
+
   return (
     <div className="quiz-runner">
       <div className="quiz-top">