From 1f81a701633e47899da0550655eda01fd94598e5 Mon Sep 17 00:00:00 2001
From: Drikus Roor <drikusroor@gmail.com>
Date: Fri, 13 Dec 2024 15:23:01 +0100
Subject: [PATCH] feat: Add overlay visibility tracking to MatchingPairs game
 logic

---
 backend/experiment/rules/matching_pairs.py              | 1 +
 frontend/src/components/MatchingPairs/MatchingPairs.tsx | 6 ++++--
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/backend/experiment/rules/matching_pairs.py b/backend/experiment/rules/matching_pairs.py
index e4cde2739..716a1da6b 100644
--- a/backend/experiment/rules/matching_pairs.py
+++ b/backend/experiment/rules/matching_pairs.py
@@ -140,6 +140,7 @@ def calculate_intermediate_score(self, session, result):
         second_card = result_data["second_card"]
         second_section = Section.objects.get(pk=second_card["id"])
         second_card["filename"] = str(second_section.filename)
+        overlay_was_shown = result_data["overlay_was_shown"]
         if first_section.group == second_section.group:
             if "seen" in second_card and second_card["seen"]:
                 score = 20
diff --git a/frontend/src/components/MatchingPairs/MatchingPairs.tsx b/frontend/src/components/MatchingPairs/MatchingPairs.tsx
index a948372cf..83a52cd7c 100644
--- a/frontend/src/components/MatchingPairs/MatchingPairs.tsx
+++ b/frontend/src/components/MatchingPairs/MatchingPairs.tsx
@@ -52,6 +52,7 @@ const MatchingPairs = ({
     const [score, setScore] = useState<number | null>(null);
     const [total, setTotal] = useState(bonusPoints);
     const [startOfTurn, setStartOfTurn] = useState(performance.now());
+    const [overlayWasShown, setOverlayWasShown] = useState(false);
 
     // New state to track card states
     const [sections, setSections] = useState(() => initialSections.map(section => ({
@@ -191,14 +192,15 @@ const MatchingPairs = ({
                     const scoreResponse = await scoreIntermediateResult({
                         session,
                         participant,
-                        result: { "start_of_turn": startOfTurn, first_card: firstCard, second_card: currentCard }
+                        result: { "start_of_turn": startOfTurn, first_card: firstCard, second_card: currentCard, overlay_was_shown: overlayWasShown, },
                     });
                     if (!scoreResponse) {
                         throw new Error('We cannot currently proceed with the game. Try again later');
                     }
                     setScore(scoreResponse.score);
                     showFeedback(scoreResponse.score);
-                    showOverlay(scoreResponse.score);
+                    const isShowingOverlay = showOverlay(scoreResponse.score);
+                    setOverlayWasShown(isShowingOverlay);
                 } catch {
                     setError('We cannot currently proceed with the game. Try again later');
                     return;