What is the best way to fetch the whole GraphQL tree in React?

Let's say I have the following GraphQL schema:

type Cinema {
    name: String!    
    rooms: [Room]!
}

type Room {
    name: String!
    seats: [Seat]!
}

type Seat {
    number: Int!
    booked: Boolean!
}

In front view, I want to display a menu list on the left with collapsed navigation like:

• cinema name
  • room name 1
    • seat 1 (booked)
    • seat 2 (booked)
    • ...
  • room name 2
    • seat 1 (booked)
    • seat 2 (booked)
    • ...
  • ...

And on the right, I want to display a summary with the selected cinema name, the selected room name and a map with all seats.

So, the menu component is a classic case in GraphQL with pagination for each connection (rooms, seats). But the summary component need all data before instanciation and is not a child of the menu component:

<Page>
  <Menu />
  <Summary />
<Page />

Yep, it's possible to handle this with this schema!

Should I fragment my request according to my components, refetch until I have all data and save results in a dedicated state to send to the summary component?

Nope, it's not possible to handle this with this schema!

Should I make only one request without pagination and dispatch props manually to my components?

Note 1: I use Relay Modern as GraphQL client with Relay-style cursor pagination but all suggestions are welcome.

Note 2: This example is simpler than my real use case. I have many nested pagination and my "summary" component need all data at initialization.