Could not reach Cloud Firestore backend - React native Firebase v9

Question

I saw many questions on SO regarding this issue and none of them was answered (or the solution doesn't work), I don't know why. People are having this error continuously but no solution is being provided. And from past few days even I'm encountering this error (Note: It seems to be working fine on my physical device (not while debugging, it works on only if I release it), but not on android emulator, so I'm pretty sure my internet is working fine):

Setting a timer for a long period of time, i.e. multiple minutes, is a performance and correctness issue on Android as it keeps the timer module awake, and timers can only be called when the app is in the foreground. See https://github.com/facebook/react-native/issues/12981 for more info.
(Saw setTimeout with duration 3052257ms)
Authorization status: 1

[2022-02-09T07:05:26.500Z]  @firebase/firestore: Firestore (9.6.5): Could not reach Cloud Firestore backend. Backend 
didn't respond within 10 seconds.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will 
operate in offline mode until it is able to successfully connect to the backend.
Authorization status: 1

[2022-02-09T07:08:44.688Z]  @firebase/firestore: Firestore (9.6.5): Connection WebChannel transport errored: me {
  "defaultPrevented": false,
  "g": Y {
    "A": true,
    "J": null,
    "R": [Circular],
    "g": $d {
      "$": true,
      "$a": 2,
      "A": 3,
      "B": null,
      "Ba": 12,
      "C": 0,
      "D": "gsessionid",
      "Da": false,
      "Ea": Dd {
        "g": Cd {},
      },
      ... & so on...

Package.json:

"@react-native-firebase/app": "^14.3.1",
"@react-native-firebase/messaging": "^14.3.1",
"@react-native-google-signin/google-signin": "^7.0.4",
"expo": "~44.0.0",
"firebase": "^9.6.3",

The authentication & messaging seems to be working fine, but I think the db from firestore is having this issue. Following is some of the code from my firebase.tsx config file:

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";
import { getFirestore } from "firebase/firestore";

const firebaseConfig = {
  apiKey: "",
  authDomain: "",
  databaseURL: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
  measurementId: "",
};

const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const db = getFirestore(app);

export { auth, db };

What I tried so far:

1. Changing the firestore database rules as mentioned in this answer: https://stackoverflow.com/a/70980383/11685381

2. Using this workaround: https://github.com/firebase/firebase-js-sdk/issues/5667#issuecomment-952079600

3. I'm not using any .env variables according to this answer: https://stackoverflow.com/a/69095824/11685381

4. Wiped android emulator data, then Cold Boot. Didn't work.

5. Upgraded firebase-9.6.3 to firebase-9.6.6. Didn't work.

6. cleaned the build folder, yarn installed all the packages again. Didn't work.

Can anyone provide any working solution to this problem? Thank you!

EDIT-1:

The code where I'm calling firestore db especially:

In my HomeScreen.tsx:

import { doc, setDoc, onSnapshot, collection } from "firebase/firestore";
import { db } from "../../../firebase";

// inside functional component
useEffect(() => {
    const addUser = () => {
      const path = doc(db, "Users", user.uid);
      const data = {
        _id: user.uid,
        name: user.displayName,
        email: user.email,
      };
      setDoc(path, data)
        .then(() => {
          console.log("User added to db");
        })
        .catch((err) => {
          console.log("Error while adding user to firestore: ", err);
        });
    };
    addUser();
  }, []);

useEffect(() => {
    const unsub = onSnapshot(collection(db, "Items"), (snapshot) =>
      setItems(snapshot.docs.map((doc) => doc.data()))
    );
    return () => unsub();
  }, []);

// so nothing is being displayed here as firestore is not working.

Answer 1

Found out the solution on my own after a lot of search. Although I had to make a new bare react native project from scratch, and even then I was encountering that error, I had literally lost hope with firebase at that point. Then after sometime I changed my firebase config to the below code and it worked:

import {initializeApp} from 'firebase/app';
import {getAuth} from 'firebase/auth';
import {initializeFirestore} from 'firebase/firestore';

const firebaseConfig = {
  apiKey: '',
  authDomain: '',
  projectId: '',
  storageBucket: '',
  messagingSenderId: '',
  appId: '',
  measurementId: '',
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const db = initializeFirestore(app, {
  experimentalForceLongPolling: true,
});

export {auth, db};

I had to change the initialization of db as mentioned above, hope it works for everyone out there who's stuck on this weird error.

Thank you all for your help!