Estoy tratando de llenar un tablero de buscaminas de 10X10 y tengo problemas para agregar bombas en coordenadas aleatorias. Todas las celdas en el tablero tienen su campo isBomb como verdadero cuando estoy usando console.log También aquí está el enlace stackblitz https://stackblitz.com/edit/react-uqcox1?file=src/components/Board.js

 import React, { useEffect, useState } from 'react' const INITIAL_CELL = { isClicked: false, isBomb: false, isFlagged: false, } const CreateInitialBoard = () => { let board = Array.from({ length: BOARD_SIZE }, () => Array.from({ length: BOARD_SIZE }, () => INITIAL_CELL)) board = AddBombs(board); return board; } const AddBombs = (board) => { let _board = board; console.log(board, "before"); let randomX, randomY, bombsAdded = 0; while (bombsAdded < BOMB_COUNT) { randomX = Math.floor(Math.random() * BOARD_SIZE); randomY = Math.floor(Math.random() * BOARD_SIZE); _board[randomX][randomY].isBomb = true; bombsAdded++; } console.log(_board, "after"); return _board } const BOARD_SIZE = 10; const BOMB_COUNT = 10; const INITIAL_BOARD = CreateInitialBoard(); export default function Board() { const [board, setBoard] = useState(INITIAL_BOARD); return ( <div className='board'> { board.map((row, rowIndex) => { return row.map((cell, cellIndex) => { return ( <div key={`${rowIndex}-${cellIndex}`} className='cell'> {rowIndex}, {cellIndex} </div> ) }) }) } </div> ) }