title: TypeError: _firebase_firebase__WEBPACK_IMPORTED_MODULE_1__.firestore.collection is not a function
body: <pre><code>import { useState, useEffect } from 'react';
  import { firestore } from '../firebase/firebase';
  
  const useFirestore = (collection) =&gt; {
    const [docs, setDocs] = useState([]);
  
    useEffect(() =&gt; {
      const unsub = firestore.collection(collection)
        .orderBy('createdAt', 'desc')
        .onSnapshot(snap =&gt; {
          let documents = [];
          snap.forEach(doc =&gt; {
            documents.push({...doc.data(), id: doc.id});
          });
          setDocs(documents);
        });
  
      return () =&gt; unsub();
      // this is a cleanup function that react will run when
      // a component using the hook unmounts
    }, [collection]);
  
    return { docs };
  }
  
  export default useFirestore
  </code></pre>
  <p>Im trying to use this custom hook i found on a tutorial to access firestore but it keeps giving this error and i cant find anything to fix it.</p>
  <p>firebase file looks like this.</p>
  <pre><code>import * as firebase from &quot;firebase/app&quot;
  import &quot;firebase/firestore&quot;
  
  const firebaseConfig = {
      &quot;this is filled with info I got from firebase just dont want to post it on the internet.&quot;
  };
  
  const firestore = firebase.initializeApp(firebaseConfig);
  
  export { firestore }
  </code></pre>