Redirect to main page when user confirms refresh in React JS

How can I redirect the user to the main page when the user click on this green confirm button (it’s in french btw) :photo of the green confirm button when user clicks on reload button (it's in chrome)

I already have this in the app.js main component but when I try to use the useNavigate() with the navigate function it doesn’t work in the “handleBeforeUnload”. I also tried window.location.href = “/” but still doesn’t work.
Also, it’s a multiplayer game so I use socket.js to connect the client to a server (I don’t know if it changes anything, maybe it helps)

const handleBeforeUnload = (event) => {
        event.preventDefault();
        event.returnValue = ""; // Affiche une confirmation
    };

    useEffect(() => {
        window.addEventListener("beforeunload", handleBeforeUnload)

        return () => {
            window.removeEventListener("beforeunload", handleBeforeUnload)
        }
    }, [])