db.collection(“articles”).add results in “.default.collection is not a function”

Essentially I want to add a collection called “articles” with the following actors and store it in firebase.

I followed the doc for uploading files to firebase. I was reading the doc for adding data to firebase but it was a bit confusing and not sure how to implement it.

index.js (to view the other top half, here)

...
() => {
   getDownloadURL(upload.snapshot.ref).then((downloadURL) => {
    db.collection("articles").add({
      actor: {
        description: payload.user.email,
        title: payload.user.displayName,
        date: payload.timestamp,
        image: payload.user.photoURL,
        },
        video: payload.video,
        sharedImg: downloadURL,
        comments: 0,
        description: payload.description,
       });
   });
}

However, whenever I run this code, I get “Unhandled Rejection (TypeError): firebase__WEBPACK_IMPORTED_MODULE_0_.default.collection is not a function.”

firebase.js

import { initializeApp } from 'firebase/app';
import { getAuth, GoogleAuthProvider } from 'firebase/auth';
import { getStorage } from "firebase/storage";
import { getFirestore } from "firebase/firestore";

const firebaseConfig = {
...
}

const firebaseApp = initializeApp(firebaseConfig);
const db = getFirestore(firebaseApp);
const auth = getAuth();
const provider = new GoogleAuthProvider();
const storage = getStorage(firebaseApp);
  
export { auth, provider, storage };
export default db;

Any advise as to what is going wrong? Thanks!