I want to fetch some data based on a clicked collection . I am fetching data from firestore ,so I would like when I click on a collection link , I want only it's related collections to be displayed .For example , I have a collection called Events , so the events will be displayed in my home screen as links , and when I click on a link I want to show the Games collection based on the Event . in my index.jsx:

const HomePage = (props) => {
  const {allEvents} = useStaticQuery(
    graphql`
      query{
        allEvents {
        nodes{
          id
          name
        }
      }
    }
    `

in the {Events.name} folder index.jsx:

export const query = graphql`
    events: allGames(filter: ) {
        nodes{
            id
            name
        }
}
`

in this page I want to display the games , but I didn't know how !