React Navigate does not works

After registering a user, he should be redirected to the login page and at the same time the entire Context should be saved, but for some reason this does not happen,
Why doesn’t Navigate work here and how to make a redirect? I will be very grateful.

the function being called, it works exactly and goes into “then” method

    const onSubmit = (e) => {
        e.preventDefault();
        const payload = {
            email: emailRef.current.value,
            name: nameRef.current.value,
            password: passwordRef.current.value,
            re_password: confirmPasswordRef.current.value,
        }
        axiosClient.post('/signup', payload)
            .then(({ data }) => {
                setUser(data.user);
                setShwoLoginPage(true);
                return <Navigate to={"/login"} replace={true} />
            })
            .catch((error) => {
                setErrors(error.data.errors)
            })
    }

Router

const router = createBrowserRouter([
    {
        path: '/',
        element: <DefaultLayout />,
        children: [
            {
                path: '/login',
                element: <Login />
            },
            {
                path: '/signup',
                element: <Signup />
            },
        ]
    },
    {
        path: '/main',
        element: <GuestLayout />,
        children: [
        ]
    },
]);

Default Layout

import React from "react";
import { Outlet } from "react-router-dom";

export default function DefaultLayout() {
    return (<>
        Default
        <Outlet />
    </>);
}

I tried to do it through the flag in Context, but in this case there is an infinite redrawing