I have an app that sends user to main page after login.On the main page I have a navbar that displays “Log in” or user’s name based on the state of the user’s log in status.To refresh the state in the navbar component i call

if (!user) {
    router.push("/main-page");
    location.reload();
  }

in the client component inside the navbar,that holds the state. But after loging in the user is pushed back to the /auth/login page even though he is logged in and i have access to the “user” object.After the user is sent to /auth/login he has to manually navigate to /main-page where the state is finnaly updated,but this makes for terrible user experience.
I am also using next-auth.js , even though i don’t think that makes any difference.Anyone know a way to refresh the state withouth router.push() , or another way of reloading the page that dosen’t trigger before my api call goes to get the user data?