In my database, I have user and group collections. Each document in the user collection corresponds to a user UID and contains an array field called "userGroups" which lists the groups that user belongs to, with each group being identified by the group's document ID in the group collection.
I've successfully retrieved the userGroups array for the current user and stored it in groupRef (refer to code below). Now, my goal is to map these values to the groups collection and fetch only those documents that are included in the groupRef array. Essentially, I want to display in the UI only the groups that the current user is a member of.
user collection group collection
const [groupsList, setGroupList] = useState([]);
const [groupRef, setGroupRef] = useState([]);
const [track, setTrack] = useState('')
const handleSubmit = () => {
setTrack('start')
fire.firestore().collection('users').doc(fire.auth().currentUser.uid).get().then((value) => {
console.log("userGroups " + value.data().userGroups) // this returns an object
setGroupRef([value.data().userGroups])
})
}
useEffect(() => {
handleSubmit()
}, [track])
console.log("sample list " + groupRef)
fire.firestore().collection('groups').onSnapshot(snapshot => (
setGroupList(snapshot.docs.map(doc => doc.data()))
))
^ This code snippet retrieves all documents from the groups collection. Any suggestions on how I can filter and retrieve only the ones where the current user is a member? Your assistance would be greatly appreciated as I've been struggling with this issue for a while. I'm also new to working with Firebase.