firebase onAuthStateChanged giving null on opening a link on new tab

I am using firebase for authentication in react app. Whenever I open a link in my app on new tab auth.onAuthStateChanged gives a null rather than giving the signed in user. I don't face this issue whenever I reload my page. But this happens whenever I open a nav link on new tab. I had gone through all the similar articles from stack overflow and other resources and changed my code accordingly the problem still remains the same. currently my code looks like this

const firebaseApp = firebase.initializeApp({
  apiKey: process.env.REACT_APP_FIREBASE_KEY,
  authDomain: process.env.REACT_APP_FIREBASE_DOMAIN,
  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
  storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_FIREBASE_SENDER_ID,
  appId: process.env.REACT_APP_FIREBASE_APP_ID,
});

export const auth = firebaseApp.auth();



useEffect(() => {
    auth.onAuthStateChanged((user) => {
      if (user) {
        setCurrentUser(user);
        setLoading(false);
      } else {
        setCurrentUser(null);
        setLoading(false);
      }
    });
  }, []);

If you have faced similar issue. Please help!