Thank you for your time, i understand this question being ask couple of times in stackoverflow, but i tried none of the method works for my data structure.

My object of arrays stored in the state is as below

[
   {
      "ff07748b-0750-4508-95c9-5c8a4f06be06":{
         "number":[
            "211"
         ],
         "id":[
            "ff07748b-0750-4508-95c9-5c8a4f06be06"
         ],
         "exercise":[
            "Bench"
         ]
      },
      "8f4de6af-4d43-481f-a326-68083f52e066":{
         "number":[
            "21"
         ],
         "id":[
            "8f4de6af-4d43-481f-a326-68083f52e066"
         ],
         "exercise":[
            "Bench"
         ]
      },

      "key":"9|9|2021"
   }
]

Here's how i push it in after calling from firebase snapshot.

            querySnapshot.forEach(documentSnapshot => { 
                if(documentSnapshot.id == "9|9|2021"){
                    console.log(documentSnapshot);
                    users.push({
                        ...documentSnapshot.data(),
                        key: documentSnapshot.id,
                    });
                }
            });

Here's how i render it.

        <View>
            <FlatList
                data={users}
                renderItem={({item,index}) =>(
                    <View>
                        <Text>{item.key}</Text>
                    </View>
                    
                )}
            />  
        </View>

Wanted it to go inside and render the number,exercise.

Item.key contains the current date etc '9|9|2021' and render it out with no issues. On firebase i stored my data by "useremail" -> "today date" -> "list of stuff"