CODEWITHSUNDEEP
javascriptfirebasegoogle-cloud-firestore
Flov
Flov

Reputation: 1587

Firebase: Collection group query and then get parent of sub collection

My data model:

A Trip has a sub collection Rides and references the trip with tripId

A ride has an experience: string which I'd like to filter on.

So I thought to query the SubCollection Rides

export const getTripsByExperience = async (experience: EXPERIENCES) => {
  const ridesQuery = query(
    collectionGroup(db, 'rides'),
    where('experience', '==', experience)
  );
  const querySnapshot = await getDocs(ridesQuery);
  let trips: Trip[] = [];
  querySnapshot.forEach(async (rideDoc) => {
    const ride = rideDoc.data();
    const tripSnapshot = await getDoc(doc(db, 'trips', ride.id));
    trips.push({ ...tripSnapshot.data(), id: tripSnapshot.id });
  });
  return trips
}

When I console.log this out right after trips.push trips.length gets incrementally bigger, but when the loop finishes, the function returns an empty array 🤯

What is the right approach here to get the trips filtered by rides.experience?

Upvotes: 0

Views: 112

Answers (1)

Sergey Sosunov
Sergey Sosunov

Reputation: 4600

forEach does not work with async, just convert it to the map instead.

const tripsPromises = querySnapshot.docs.map(async (rideDoc) => {
    const ride = rideDoc.data();
    const tripSnapshot = await getDoc(doc(db, 'trips', ride.id));
    return { ...tripSnapshot.data(), id: tripSnapshot.id };
});

const trips: Trip[] = await Promise.all(tripsPromises);

Here is a similar question with more details and examples in the answers: Using async/await with a forEach loop

Update: The documents can be accessed as an array via the "docs" property or enumerated using the forEach method as per https://firebase.google.com/docs/reference/node/firebase.firestore.QuerySnapshot

Upvotes: 2

Related Questions