Merge pull request #16 from andrewfritz86/handle-bad-notes

Handle bad notes
andrewfritz86 · Jun 10, 2024 · d139a99 · d139a99
2 parents 76a3fb1 + 1c09590
commit d139a99
Showing 1 changed file with 21 additions and 3 deletions.
diff --git a/src/components/Modes/Challenge/Challenge.tsx b/src/components/Modes/Challenge/Challenge.tsx
@@ -6,6 +6,7 @@ import { Note, Scale } from "@types";
 import data from "@data";
 
 interface ChallengeGameState {
+  badNotes: number[];
   notesLeft: number[];
   notesFound: number[];
   shuffledNotes: Note[];
@@ -24,6 +25,7 @@ function setUpGameState() {
     notesLeft: notesInScale,
     notesFound: [],
     inProgress: true,
+    badNotes: [],
   };
 }
 
@@ -33,8 +35,14 @@ export default function Challenge() {
   const [gameState, setGameState] = useState<ChallengeGameState>(
     setUpGameState()
   );
-  const { inProgress, notesLeft, notesFound, shuffledNotes, randomScale } =
-    gameState;
+  const {
+    badNotes,
+    inProgress,
+    notesLeft,
+    notesFound,
+    shuffledNotes,
+    randomScale,
+  } = gameState;
   const notesLeftCount = notesLeft.length;
   function handleClick(id: number): void {
     const index = notesLeft.indexOf(id);
@@ -54,6 +62,14 @@ export default function Challenge() {
           return { ...prev, inProgress: false };
         });
       }
+    } else {
+      // bad note
+      setGameState((prev) => {
+        return {
+          ...prev,
+          badNotes: [...prev.badNotes, id],
+        };
+      });
     }
   }
 
@@ -92,7 +108,9 @@ export default function Challenge() {
               key={note.id}
               className={classNames("rounded-md m-2 basis-1/4 h-20", {
                 "bg-green-500": notesFound.includes(note.id),
-                "bg-sky-500/50": !notesFound.includes(note.id),
+                "bg-sky-500/50":
+                  !notesFound.includes(note.id) && !badNotes.includes(note.id),
+                "bg-red-500": badNotes.includes(note.id),
               })}
             >
               {note.string}