Main tab doesn’t retain authenticated state after authenticating user in popup window using Laravel Socialite

I am working on a project with TALL Stack where I implemented OAuth2 using Laravel Socialite package. Initially, I made a simple link with the redirect uri. This approach works fine and the user gets authenticated with google seamlessly and gets redirected to the intended route. Currently I want to have the Google OAuth2 authentication page to open in a popup window and once the user is authenticated, the popup window closes then the main tab or window redirects the user to the intended route after authentication. The problem I am facing now is, the user gets authenticated within the popup window and the window closes after authentication. However, the main window does not retain the authenticated state of the user. As a result, the redirection doesn’t occur. Let me also mention that this only happens the first time the user gets authenticated. Once you authenticate the user subsequently, the redirection occurs within the popup window and the popup doesn’t close automatically. This indicates that the user actually get’s authenticated but only within the popup and not the main tab or window.

This is the link for redirecting to the OAuth2 page

<a href="javascript:void(0);" onclick="openOAuthPopup()" class="w-full py-3 md:py-5 rounded-2xl border-2 border-green-500 hover:border-2 hover:border-green-700 flex justify-center items-center">
  <img class="w-6 mx-3" src="{{ asset('images/google.png') }}" alt=""> Sign up with Google
</a>

In the JS, I open the pop up window for OAuth2 authentication then listen for an event from the popup window for a successful authentication and then redirect the user to the dashboard.

function openOAuthPopup() {
     var popup = window.open('/auth/redirect', 'popup', 'width=700, height=700');

     // Listen for messages from the popup
     window.addEventListener('message', function(event) {
     if (event.origin !== "{{ url('/') }}") // Replace with your domain
         return;

         if (event.data === 'authenticated') {
             window.location.href = '/dashboard';
         }
     }, false);
}

Below is the php method for handling the callback

public function callback(): View
    {
        $googleUser = Socialite::driver('google')->stateless()->user();
        //Handle user registration or login
        ...

        return view('livewire.auth.oauth_callback');
    }

Within the view livewire.auth.oauth_callback, I had simple script that sends a message to the opener window and then closes the popup window.

// When the popup loads this view, send a message to the opener window
window.onload = function() {
      window.opener.postMessage("authenticated", "{{ url('/') }");
      window.close(); // Close the popup window
}

I don’t know if this has got anything to do with session. My config/session.php has everything in default.

What I’m I doing wrongly? Also, is there a better approach to this?