Space key resets the game - reactjs

Question

i wanted to make a game and followed a tutorial to make a Tetris game, while playing it i noticed that when you press the space button the whole game resets, i cant figure out how to fix that. My harddrop function works when i press space so that works but then the game resets to. As far as i know there should be no other function set to the spacebar (keyCode === 32)
If i remove the harddrop function the game still restarts if i press space
this is my code:
const Tetris = () => {
const [dropTime, setDropTime] = useState(null);
const [gameOver, setGameOver] = useState(false);
const [player, updatePlayerPos, resetPlayer, playerRotate] = usePlayer();
const [stage, setStage, rowsCleared] = useStage(player, resetPlayer);
const [score, setScore, rows, setRows, level, setLevel] = useGameStatus(
rowsCleared
);
console.log('re-render');
const movePlayer = dir => {
if (!checkCollision(player, stage, { x: dir, y: 0 })) {
updatePlayerPos({ x: dir, y: 0 });
}
};
const keyUp = ({ keyCode }) => {
if (!gameOver) {
// Activate the interval again when user releases down arrow.
if (keyCode === 40) {
setDropTime(1000 / (level + 1));
}
}
};
const startGame = () => {
// Reset everything
setStage(createStage());
setDropTime(1000);
resetPlayer();
setScore(0);
setLevel(0);
setRows(0);
setGameOver(false);
};
const drop = () => {
// Increase level when player has cleared 10 rows
if (rows > (level + 1) * 10) {
setLevel(prev => prev + 1);
// Also increase speed
setDropTime(1000 / (level + 1) + 200);
}
if (!checkCollision(player, stage, { x: 0, y: 1 })) {
updatePlayerPos({ x: 0, y: 1, collided: false });
} else {
// Game over!
if (player.pos.y < 1) {
console.log('GAME OVER!!!');
setGameOver(true);
setDropTime(null);
}
updatePlayerPos({ x: 0, y: 0, collided: true });
}
};
const dropPlayer = () => {
setDropTime(null);
drop();
};
const hardDrop = () => {
let pot = 0;
while (!checkCollision(player, stage, { x: 0, y: pot })) {
setDropTime(5);
pot += 1;
}
updatePlayerPos({ x: 0, y: pot-1, collided: true });
}
// starts the game
useInterval(() => {
drop();
}, dropTime);
const move = ({ keyCode }) => {
if (!gameOver) {
if (keyCode === 37) {
movePlayer(-1);
} else if (keyCode === 39) {
movePlayer(1);
} else if (keyCode === 40) {
dropPlayer();
} else if (keyCode === 38) {
playerRotate(stage, 1);
} else if (keyCode === 32) {
hardDrop()
}
}
};
return (
<StyledTetrisWrapper
role="button"
tabIndex="0"
onKeyDown={e => move(e)}
onKeyUp={keyUp}
>
<StyledHeader/>
<StyledTetris>
<Stage stage={stage} />
<aside>
{gameOver ? (
<Display gameOver={gameOver} text="Game Over" />
) : (
<div className='aside-container'>
<Display text={`Score: ${score}`} />
<Display text={`rows: ${rows}`} />
<Display text={`Level: ${level}`} />
</div>
)}
<StartButton callback={startGame}></StartButton>
<button className='back-btn'
type='button'
onClick={(e) => {
e.preventDefault();
window.location.href="https://play-it-games.netlify.app/";
}}>Back to Play it!</button>
</aside>
</StyledTetris>
</StyledTetrisWrapper>
);
};
export default Tetris;