Firebase: Cannot read properties of undefined (reading 'indexOf')

Victor Choe 0
Viewed 30

I am new to Firebase Cloud and I am following a video from a few years ago but they are using namedspace v8 and I wanted to use modular v9.

Their code goes as followed:

  useEffect(() => {
    if(user) {
        db
        .collection('users')
        .doc(user?.uid)
        .collection('orders')
        .orderBy('created', 'desc')
        .onSnapshot(snapshot => (
            setOrders(snapshot.docs.map(doc => ({
                id: doc.id,
                data: doc.data()
            })))
        ))
    } else {
        setOrders([])
    }

  }, [user])

My Code:

  useEffect(() => {
    const getDocs = async () => {
      try {
        const collRef = await getDocs(
          collection(db, "users", user?.id, "orders")
        );
        const orderedRef = query(collRef, orderBy("created", "desc"));
        const docSnap = onSnapshot(orderedRef, (snapshot) => {
          snapshot.map((doc) => ({
            id: doc.id,
            data: doc.data(),
          }));
          setOrders(docSnap);
        });
      } catch (err) {
        console.log(err.message);
      }
    };
    getDocs();
  }, [user]);

I am trying to get all the orders from a particular user using their user?.id and ordered them by created in a descending order and display them in my order component but I am getting this error back Firebase: Cannot read properties of undefined (reading 'indexOf')

NOTE

I also tried to console.log at every step(at const collRef & const orderedRef) and I'm not getting anything back.

google-cloud-firestore javascript
1 Answers

Your collRef is not a CollectionReference, but a QuerySnapshot as you assign it here:

const collRef = await getDocs(
  collection(db, "users", user?.id, "orders")
);

You'll want to assign collRef like this:

const collRef = collection(db, "users", user?.id, "orders");
Frank van Puffelen0
Related