Relay: What's the role of the `query` that's passed to `createPaginationContainer`?

[nikolasburk]

When using createPaginationContainer, we're passing it a configuration object that also contains a query (as is the case in the official example).

I was wondering why we have to do that seen that there still is a QueryRenderer on the top-level that could take care of building query at the root of the hierarchy. Couldn't we just omit this second query or what's the reason that we have to include it?

I also noticed that the root query that's passed to the QueryRenderer also needs to have the first and after arguments to enable pagination. So, it seems like the QueryRenderer is still responsible to compose this query, so what's the role of the additional one that's passed to createPaginationContainer?

[sibelius]

createPaginationContainer and createRefetchContainer both has query

The idea is that these containers will send a query to get more data, this query could be different from the QueryRenderer query

This another query was implicit on Relay Classic, however it is explicit on Relay Modern as all the queries should be known in compile time

check this https://github.com/facebook/relay/issues/1942#issue-240931473

[nikolasburk]

Ah ok! That already helps, thanks!

My follow-up question would be if the query that's passed to the QueryRenderer is then relevant at all to a PaginationContainer. Like what if in our hierarchy we only had one PaginationContainer nested directly under a QueryRenderer, but no FragmentContainer.

Does the QueryRenderer still need its own root query or can that be omitted then?

[sibelius]

you still need a QueryRenderer for you root component container, it will do the first query.

You can compose your QueryRenderer with multiple PaginationContainers or RefetchContainers as well

[nikolasburk]

Ah ok! So, to summarize, can the following be stated?

The QueryRenderer is there to execute the initial fetch of the data - so of course it still needs its root query. All subsequent pagination requests (that are triggered e.g. through loadMore) will be executed based on the query that's passed to PaginationContainer

[sibelius]

yep, can we close this?

[nikolasburk]

Yes, thanks a lot for your help!

[amkoehler]

This thread was super helpful for me in getting started with pagination containers. I couldn't figure out why multiple query roots needed to be defined but it makes sense now. Thank you both!