How to validate if the child elements match another set of child elements in listener and then load values only when they match? (Firebase & React)

I am working on a chat application, what I need to do is restrict the loaded channels displayed based on the ones they join. The values load from this section of the firebase real-time db.

I need to make sure or validate that they match the keys in this, and only load them when they do.

The firebase db ref I'm using for both:

TopicsJoinedList: firebase.database().ref("/users/" + firebase.auth().currentUser.uid + "/ChannelsJoined"),    channelsRef: firebase.database().ref("channels"),  

this is what my listener functions look like

 addApprovedChannelListener = () => {      let ApprovedChannelsArray = [];      this.state.TopicsJoinedList.on("child_added", snap =>{        let ApprovedChannelsLoad=snap.val();        ApprovedChannelsArray.push(ApprovedChannelsLoad);        console.log(ApprovedChannelsArray);        this.setState({ApprovedChannels: ApprovedChannelsArray});        console.log(this.state.ApprovedChannels);      });    };      addListeners = () => {      let loadedChannels = [];      this.state.channelsRef.on("child_added", snap => {        let channelsloaded = snap.val();        loadedChannels.push(channelsloaded);        this.setState({ channels: loadedChannels }, () => this.setFirstChannel());        this.addNotificationListener(snap.key);      });    };    

I want to limit the ones loaded based on such criteria in the second listener.

https://stackoverflow.com/questions/67239151/how-to-validate-if-the-child-elements-match-another-set-of-child-elements-in-lis April 24, 2021 at 11:47AM