title: error - ReferenceError: Cannot access 'auth' before initialization
body: <p>so I am following this online tutorial on how to build a WhatsApp build and I ran into this problem.</p>
  <pre><code> import &quot;../styles/globals.css&quot;;
      import { useAuthState } from &quot;react-firebase-hooks/auth&quot;;
      import { auth, db } from &quot;../firebase&quot;;
      
      function MyApp({ Component, pageProps }) {
        const [user] = useAuthState(auth);
      
        if (!user) return &lt;Login /&gt;;
      
        return &lt;Component {...pageProps} /&gt;;
      }
      
      export default MyApp;
  </code></pre>
  <p>This is my firebase.js, I removed the my apiKey because I am sharing my code but that don't think that is the issue.</p>
  <pre><code>import firebase from &quot;firebase/app&quot;;
  
  const firebaseConfig = {
    apiKey: &quot;&quot;,
    authDomain: &quot;global-chat-80ab3.firebaseapp.com&quot;,
    projectId: &quot;global-chat-80ab3&quot;,
    storageBucket: &quot;global-chat-80ab3.appspot.com&quot;,
    messagingSenderId: &quot;405392556419&quot;,
    appId: &quot;1:405392556419:web:562d012b108561b8be76b6&quot;,
  };
  
  const app = !firebase.apps.length
    ? firebase.initializeApp(firebaseConfig)
    : firebase.app();
  
  const db = app.firestore();
  const auth = app.auth();
  const provider = new firebase.auth.GoogleAuthProvider();
  
  export { db, auth, provider };
  </code></pre>