How to use react-native-leaderboard with values from firestore

Question

I'm trying to use react-native-leaderboard (https://www.npmjs.com/package/react-native-leaderboard) to display a simple 'high scores' area with a team name and their respective score. The team names and associated scores are stored in firestore.

My database structure looks like this: database structure link

I need to return name and high score data in the format below where the values are fields of each team name and each team name is a document. How can I get this from firestore in this format either specifically or conceptually? Or wha are the right words / search terms to describe what I'm attempting to do?

 //...import Leaderboard from 'react-native-leaderboard';//...this.state = {data: [
    {name: 'David', highScore: 52},
    {name: 'Jenny', highScore: 120},`
    //...
] //can also be an object of objects!: data: {a:{}, b:{}}

}

Answer 1

You can get from firebase like this:

const unsubscribe = firebase.firestore().collection("HigeScores").get().then((snap) =>{
        const datas = [];
        snap.forEach((doc) =>{
        datas.push({name: doc.data().name, highScore: doc.data().highScore})
        })
        this.setState({data: datas})
    //or you can use useState like const [data, setData] = useState([]); then setData(datas)
     })