retrieving particular information from within a Firebase array

Question

retrieving particular information from within a Firebase array

My Firebase document contains a list with various properties such as name and imgUrl. Currently, I am facing an issue with extracting only the "name:" information from the list in Firebase Cloud Firestore so that I can determine how many times a specific name appears.

Here is how I retrieve the data from the document:

 const matchLikes = async () => {
       await fire.firestore()
        .collection("eventLikes")
        .doc(eventID).onSnapshot((querySnapshot) => {
            
                //console.log("print indi event heree  " + querySnapshot.data().eventID)
              
                setLikes(querySnapshot.data().ActivityLikes)
              
            
        })

I have stored the array in a hook for use, but I am struggling to access just the "name:" information within the array. I have attempted using

querySnapshot.data().ActivityLikes.name

, but it does not work as expected. Can anyone help me identify where I might be making a mistake?

javascript firebase google-cloud-firestore next.js

Answer 1

Answer №1

Unfortunately, Firestore does not have built-in support for projecting specific fields and aggregating data. This means you'll need to fetch the document and manually calculate the count of each name. Additionally, there is no need for an await before onSnapshot. Consider refactoring your code like so:

const calculateLikes = () => {
  fire.firestore()
    .collection("eventLikes")
    .doc(eventID)
    .onSnapshot((docSnapshot) => {
      const nameCounts = docSnapshot.data().ActivityLikes.reduce((acc, cur) => {
        acc[cur.name] = (acc[cur.name] || 0) + 1;
        return acc;
      }, {});
    
      // setLikes(querySnapshot.data().ActivityLikes)
    })
}

Answer 2

Unfortunately, Firestore does not have built-in support for projecting specific fields and aggregating data. This means you'll need to fetch the document and manually calculate the count of each name. Additionally, there is no need for an await before onSnapshot. Consider refactoring your code like so:

const calculateLikes = () => {
  fire.firestore()
    .collection("eventLikes")
    .doc(eventID)
    .onSnapshot((docSnapshot) => {
      const nameCounts = docSnapshot.data().ActivityLikes.reduce((acc, cur) => {
        acc[cur.name] = (acc[cur.name] || 0) + 1;
        return acc;
      }, {});
    
      // setLikes(querySnapshot.data().ActivityLikes)
    })
}

retrieving particular information from within a Firebase array

Answer №1

Similar questions

What are the steps for implementing the innerClass style on the searchBox within the appBase?

Is it not recommended to trigger the 'focusout' event before the anchor element triggers the 'click' event?

When defining multiple types for props in Vue, the default behavior for Boolean type props is not preserved

I'm looking for a way to incorporate JavaScript code within an iframe tag. Specifically, I'm attempting to embed code into a Wix website using the "Embed HTML

Use vue.js to add a block of content after every sixth iteration in a loop

Angular 12 - Encountering an issue with undefined properties when trying to access 'values'

Creating two interactive animations utilizing a combination of CSS and Javascript, triggered by the click event on

Understanding the fundamentals of event handling in JavaScript

Incorporating an express server into the vue-webpack-boilerplate for enhanced functionality

Is it possible to use jQuery for drag-and-drop functionality?

Extract JSON data from a web address using JavaScript

don't forget about the vertical multilevel navigation in the menu state

Can coveralls/codecov be utilized on a local machine?

Alert from Google Chrome about Service Worker

Using Express.js to Serve Static Content on a Dynamic Route

Where does the 'Execution Context Destroyed' error originate from in my code?

I'm trying to set it up so that an image pops up when I hover over text. I've tried incorporating a few different JavaScripts, but I still can

Is there a way to preserve EXIF data when converting an image to base64?

Is it possible to nest Route components in react-router version 4.x?

Searching for a client-side element within an update panel using code-behind: A step-by-step guide