I've been using NextJS and sometimes, I'm not sure, if it's about React missconception or the NextJS Framework I needed to understand better to make some simple things work!

Bellow, I have the code which should set false next time I press (F5) in the client side. I'm using NextJS!

import { Modal } from "@mui/material";
import React, { useState } from "react";

const LangModal = () => {
    const [open, setOpen] = useState(true);
    const handleModal = () => {
        setOpen(false);
        console.log("[Agora o Model é false]", open);
};

return (
    <Modal open={open} onClick={() => handleModal()}>
        <div>
            <h2> Simple React Modal</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi accumsan odio enim, non pharetra est ultrices et.</p>
        </div>
    </Modal>
  );
};
export default LangModal;

Please, could you help me guys???