Like, everything was working and then I added a .js file, to react and all of a sudden the moves do not show until the window resizes. I have since disconnected the file, but it still doesn't work.

Just trying to get a chessboard working (and yes I know that there is a board.jsx, but this is for practice) and I got the pieces to move like this: (this is inside a constructor)

let newBoard = this.props.boardArray;
this.handleClick = (i, j) => {
      switch (canStartMove){  
        case true:
          if(newBoard[i][j] !== null){
            move = newBoard[i][j];
            alert(move);
          } else {
            break;
          }
          l = i;
          m = j;
          canStartMove = false;
          break;
        case false:
          if(l !== i || j !== m){
            if(true){ // rules should go here, but for test purposes set to true //something about whose turn it is as well
              newBoard[l][m] = null;
              newBoard[i][j] = move;
              alert(newBoard[i][j]);
            } else {
              alert("that's illegal");
            }
          }
          this.props.setBoardArray(newBoard);
          canStartMove = true;   
          }
      }
    }

or approximately like this. where it updates an array that then translates that to .svg's

const [boardArray, setBoardArray] = useState(initBoardArray);

where initBoardArray is defined

const initBoardArray =
  [["b-R", "b-N", "b-B", "b-Q", "b-K", "b-B", "b-N", "b-R"],
  ["b-P", "b-P", "b-P", "b-P", "b-P", "b-P", "b-P", "b-P"],
  [null, null, null, null, null, null, null, null],
  [null, null, null, null, null, null, null, null],
  [null, null, null, null, null, null, null, null],
  [null, null, null, null, null, null, null, null],
  ["w-P", "w-P", "w-P", "w-P", "w-P", "w-P", "w-P", "w-P"],
  ["w-R", "w-N", "w-B", "w-Q", "w-K", "w-B", "w-N", "w-R"]];

But the changes don't show until the window resizes or something. which I defined like this

const { height, width } = useWindowDimensions();

  let newSide = 0;
  (function resizeTheBoard() {
    let diagonal = Math.sqrt((height * 900 / 780) ** 2 + width ** 2);
    newSide = Math.SQRT2 * diagonal / 2;
  })();
  

but I had this resize function at the beginning and the problem has just started now, so.... I am not even sure if the problem is here. I am also using Container from react-bootstrap though I removed that as well and the problem persists. If anyone has any idea or if this makes any sense, any help would be appreciated.