From 1377c3a8fafa7a1c11395c9f6d83cd184e3c898f Mon Sep 17 00:00:00 2001 From: UnEpicier Date: Sun, 18 Feb 2024 18:05:04 +0100 Subject: [PATCH] :sparkles: Handling winning game --- src/components/Grid/hooks/useActions.ts | 68 ++++++++++++++++++++++--- src/utils/game.tsx | 1 - 2 files changed, 60 insertions(+), 9 deletions(-) diff --git a/src/components/Grid/hooks/useActions.ts b/src/components/Grid/hooks/useActions.ts index 758cdf6..07fd911 100644 --- a/src/components/Grid/hooks/useActions.ts +++ b/src/components/Grid/hooks/useActions.ts @@ -23,19 +23,26 @@ export const useActions = (grid: GridType, setGrid: React.Dispatch { ev.preventDefault(); + // Only have action if the cell is hidden and has not a flag on it if (grid[rowIndex][colIndex].hidden && !grid[rowIndex][colIndex].flag) { setGrid((prev) => { + let bombsCount: number | null = null; + + // Start the game with making sure the clicked cell will be empty after generation if (gameState.status === 'idle') { - const { grid: newGrid, bombsCount } = startGame(prev, gameState.difficulty as Difficulty, true, rowIndex, colIndex); + const { grid: newGrid, bombsCount: _bombsCount } = startGame(prev, gameState.difficulty as Difficulty, true, rowIndex, colIndex); prev = newGrid; + bombsCount = _bombsCount; + setGameState((prevGameState) => ({ ...prevGameState, status: 'playing', - bombs: bombsCount, + bombs: _bombsCount, })); } + // If the clicked cell hide a bomb, loose immediatly if (prev[rowIndex][colIndex].value === 'bomb') { setGameState((prev) => ({ ...prev, @@ -43,14 +50,25 @@ export const useActions = (grid: GridType, setGrid: React.Dispatch ({ + ...prev, + endType: 'win', + })); + return revealAllGrid(grid, true); } - prev[rowIndex][colIndex].hidden = false; return prev; }); + + // Since React state cannot see if a large nested object has changed, we need to call a forceUpdate method forceUpdate(); } }; @@ -58,20 +76,26 @@ export const useActions = (grid: GridType, setGrid: React.Dispatch { ev.preventDefault(); + // Only have action if the cell is hidden if (grid[rowIndex][colIndex].hidden) { setGrid((prev) => { + let bombsCount: number | null = null; + + // Start the game without making sure the clicked cell will be empty after generation if (gameState.status === 'idle') { - const { grid: newGrid, bombsCount } = startGame(prev, gameState.difficulty as Difficulty, false); + const { grid: newGrid, bombsCount: _bombsCount } = startGame(prev, gameState.difficulty as Difficulty, false); prev = newGrid; + bombsCount = _bombsCount; + setGameState((prevGameState) => ({ ...prevGameState, status: 'playing', - bombs: bombsCount, + bombs: _bombsCount, })); } - return prev.map((row, idx) => { + prev = prev.map((row, idx) => { if (idx === rowIndex) { return row.map((col, idy) => { if (idy === colIndex) { @@ -90,6 +114,16 @@ export const useActions = (grid: GridType, setGrid: React.Dispatch ({ + ...prev, + endType: 'win', + })); + return revealAllGrid(grid, true); + } + + return prev; }); } }; @@ -99,3 +133,21 @@ export const useActions = (grid: GridType, setGrid: React.Dispatch { + let bombsFlagged = 0; + + grid.map((row) => { + row.map((cell) => { + if (cell.value === 'bomb' && cell.flag === true) { + bombsFlagged++; + } + }); + }); + + if (bombsFlagged === bombs) { + return true; + } + + return false; +}; diff --git a/src/utils/game.tsx b/src/utils/game.tsx index 3dbd35e..266f3b3 100644 --- a/src/utils/game.tsx +++ b/src/utils/game.tsx @@ -166,7 +166,6 @@ export const startGame = (grid: GridType, difficulty: Difficulty, needEmpty: boo } while (grid[rowIndex][colIndex].value !== 'empty'); grid = genNumbers(grid); - // console.log(grid, bombsCount); return { grid, bombsCount }; }