[Bug] User gets logged out on page refresh — Firebase auth persistence not configured

[saismrutiranjan18]

Problem

The app uses onAuthStateChanged in App.js to sync the logged-in user to
React Context, but Firebase auth persistence is never explicitly set. This
causes the user to appear logged out on every browser refresh, redirecting
them back to /login mid-session.

Root Cause

Firebase defaults to browserSessionPersistence in some environments,
which clears auth state when the tab is refreshed or reopened.

Additionally, if the useEffect in App.js has no cleanup (i.e. doesn't
return unsubscribe()), it creates a memory leak on every re-render.

Fix

// src/firebase.js — add persistence setup
import {
  getAuth,
  setPersistence,
  browserLocalPersistence
} from 'firebase/auth';

const auth = getAuth(app);

setPersistence(auth, browserLocalPersistence); // persist across refreshes

export { auth };

// src/App.js — ensure proper cleanup
useEffect(() => {
  const unsubscribe = onAuthStateChanged(auth, (authUser) => {
    if (authUser) {
      dispatch({ type: 'SET_USER', user: authUser });
    } else {
      dispatch({ type: 'SET_USER', user: null });
    }
  });

  return () => unsubscribe(); // ← critical: prevents memory leak
}, []);

Expected Behaviour

User stays logged in after refreshing the page until they explicitly sign out.

Actual Behaviour

User is redirected to /login on every page refresh.