feat: adding gamestatus state transitions

Author: elimanzo

workspaces/simon-game/src/app/components/App.tsx

@@ -4,7 +4,10 @@ import { Box } from "./Box.tsx";
 import { playNote } from "../util/playNote.ts";
 import { config } from "../constants.ts";
 
-function isSequenceCorrect(check: number[], correct: number[]): boolean {
+function isSequenceCorrect(
+  check: readonly number[],
+  correct: readonly number[],
+): boolean {
   return check.every((element, i) => element === correct[i]);
 }
 
@@ -13,11 +16,10 @@ type GameState = "pre-game" | "game-over" | "player-turn" | "cpu-turn";
 export function App() {
   const [playerMoves, setPlayerMoves] = useState<readonly number[]>([]);
   const [gameState, setGameState] = useState<GameState>("pre-game");
-  const [_correctMoves, _setCorrectMoves] = useState<readonly number[]>([
+  const [correctMoves, _setCorrectMoves] = useState<readonly number[]>([
     0, 1, 2, 3,
   ]);
-  console.log(isSequenceCorrect);
-  console.log(_correctMoves, _setCorrectMoves);
+  console.log(_setCorrectMoves);
 
   if (gameState === "pre-game") {
     return (
@@ -43,11 +45,36 @@ export function App() {
             color={box.color}
             onClick={() => {
               playNote(box.frequency);
-              setPlayerMoves((prev) => [...prev, index]);
+              setPlayerMoves((prev) => {
+                const newPlayerMoves = [...prev, index];
+                const isCorrectSequence = isSequenceCorrect(
+                  newPlayerMoves,
+                  correctMoves,
+                );
+                if (!isCorrectSequence) {
+                  setGameState("game-over");
+                  return [];
+                }
+                if (
+                  isCorrectSequence &&
+                  newPlayerMoves.length === correctMoves.length
+                ) {
+                  setGameState("cpu-turn");
+                  return [];
+                }
+                if (
+                  isCorrectSequence &&
+                  newPlayerMoves.length < correctMoves.length
+                ) {
+                  setGameState("player-turn");
+                }
+                return newPlayerMoves;
+              });
             }}
           />
         ))}
       </div>
+      <pre>{gameState}</pre>
       <pre>{JSON.stringify(playerMoves, null, 2)}</pre>
     </>
   );