before Unified API

src/useGame/useGame.ts

@@ -16,7 +16,7 @@ export function useGame(cols: number, rows: number, platformHook?: unknown) {
   const foodManager = useFood(cols, rows, rendererManager);
 
   const gameManager = useGameStatus(rendererManager, snakeManager, foodManager);
-  const { gameStatus, startGame, stopGame, score, level } = gameManager;
+  const { gameStatus, startGame, stopGame, togglePause, score, level } = gameManager;
 
   useEffect(() => {
     renderBoard(cols, rows);
@@ -36,6 +36,7 @@ export function useGame(cols: number, rows: number, platformHook?: unknown) {
     gameStatus,
     startGame,
     stopGame,
+    togglePause,
     score,
     level,
     ...snakeManager,

src/useGame/useGameStatus.ts

@@ -18,6 +18,7 @@ export function useGameStatus(
   const [gameStatus, setGameStatus] = useState<GameStatus>("waiting");
   const [score, setScore] = useState(0);
   const [level, setLevel] = useState(1);
+  const [paused, setPaused] = useState(false);
   const levelRef = useRef(1);
   const foodsEatenRef = useRef(0);
   const gameLoopRef = useRef<number | null>(null);
@@ -60,7 +61,7 @@ export function useGameStatus(
     console.log("useGameStatus effect - gameStatus:", gameStatus);
     if (gameStatus === "started") {
       console.log("Starting game loop");
-
+      if (paused) return;
       let shouldGrow = false;
       lastUpdateRef.current = performance.now();
 
@@ -141,7 +142,7 @@ export function useGameStatus(
         }
       };
     }
-  }, [gameStatus]);
+  }, [gameStatus, paused]);
 
   useEffect(() => {
     if (gameStatus === "game-over") {
@@ -157,6 +158,8 @@ export function useGameStatus(
     setGameStatus,
     startGame,
     stopGame,
+    paused,
+    togglePause: () => setPaused(curr => !curr),
     score,
     level,
   };