Uncaught Error in snapshot listener. Firebase quota exceeded

Question

I'm building a React Native app which makes use of Firebase Cloud Firestore database. I have implemented multiple snapshot listeners to fetch the different collections. However, I've encountered the following error [Unhandled promise rejection: FirebaseError: Quota exceeded.]

I've checked my code and gone back to the developer docs but I'm not able to find where the problem is. I suspect the problem could be with the getCompetitionCollectionListener function.

How do I find the exact cause of the error in my code and how would you implement a fix? Did I perhaps write the async call function incorrectly or miss a line of code somewhere?

Database Functions:

import { auth, db } from "../config/firebase.config";
import {
  doc,
  setDoc,
  Timestamp,
  collection,
  getDocs,
  addDoc,
  onSnapshot,
} from "firebase/firestore";

//Create a New User Function.
export const createUserOnRegister = (user, username) => {
  const userRef = doc(db, "users", user.uid);
  const userData = {
    email: user.email,
    username: username,
    role: "cosplayer",
    dateCreated: Timestamp.fromDate(new Date()),
  };
  return setDoc(userRef, userData);
};

// Get All Users Function.
export const getAllUsers = async () => {
  const users = [];
  // Query the firestore db for the collection of users
  const querySnapshot = await getDocs(collection(db, "users"));
  // Loop through the users collection and retrieve the uid of each user
  querySnapshot.forEach((doc) => {
    let user = { ...doc.data(), uid: doc.id };
    users.push(user);
  });
  return users;
};

//Create a new competition item in the firestore db.
export const newCompetition = (competition) => {
  return addDoc(collection(db, "competitions"), competition);
};

// Return the collection of competitions from the firestore db.
export const getCompetitionCollectionListener = () => {
  return collection(db, "competitions");
};

// Return the collection of entries.
export const getEntryOfCompetition = async (id) => {
  let entries = [];

  const collectionRef = collection(db, "competitions/" + id + "/entries");
  const collectionSnapshot = await getDocs(collectionRef);

  collectionSnapshot.forEach((doc) => {
    entries.push(doc.data());
  });
  return entries;
};

// Add a new Entry to the Competition collection.
export const addEntryToCompetition = async (data, id) => {
  const collectionRef = collection(db, "competitions/" + id + "/entries");
  // const collectionSnapshot = await addDoc(collectionRef, data);
  return addDoc(collectionRef, data);
};

Error Message:

[Unhandled promise rejection: FirebaseError: Quota exceeded.]
at node_modules\@babel\runtime\helpers\construct.js:null in _construct
at node_modules\@babel\runtime\helpers\wrapNativeSuper.js:null in Wrapper
at http://192.168.1.3:19000/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:null in _createSuperInternal
at node_modules\@firebase\util\dist\index.esm2017.js:null in FirebaseError#constructor
at http://192.168.1.3:19000/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&hot=false&strict=false&minify=false:null in _createSuperInternal
at node_modules\@firebase\firestore\dist\index.rn.js:null in j#constructor
at node_modules\@firebase\firestore\dist\index.rn.js:null in Gs
at node_modules\promise\setimmediate\core.js:null in setImmediate$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _allocateCallback$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _callTimer
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _callReactNativeMicrotasksPass
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in callReactNativeMicrotasks
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __callReactNativeMicrotasks
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard$argument_0
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in flushedQueue

Rules:

rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write: if
          request.time < timestamp.date(2022, 12, 12);
    }
  }
}

Usage Screenshot: Screenshot of Firestore Usage Quota Exceeded

Answer 1

I believe this error is thrown when you exceeded your quota limit.

Take a look at https://firebase.google.com/docs/firestore/quotas

Add try catch to your functions so you can know which one is throwing this error and act accordingly