search

facebook / relay

Relay is a JavaScript framework for building data-driven React applications.
https://relay.dev
MIT License
18.41k stars 1.83k forks source link

Server Component data and Relay #4170

Open tinleym opened 1 year ago

tinleym commented 1 year ago

I'm using RSCs (Next 13) with Relay, and I can't figure out how one root query can satisfy the data requirements of its child client and server components, as usePreloadedQuery's data is only accessible to client components.

Is the approach then to fetch server component data separately, outside the purview of Relay?

sibelius commented 1 year ago

are you following this https://github.com/relayjs/relay-examples/pull/241?

tinleym commented 1 year ago

Hey Sibelius! Yes.

tinleym commented 1 year ago

OK, it seems like the thing to do is to have server components use their data directly out of their portion of the payload sans fragments, and then on the client populate the store with the entire payload (e.g. https://github.com/relayjs/relay-examples/tree/main/issue-tracker-next-v13).

This is doable, but the Relay co-location experience on the client has spoiled me :). Is there a way to use fragments without hooks on the server?

alvarlagerlof commented 1 year ago

This is doable, but the Relay co-location experience on the client has spoiled me :). Is there a way to use fragments without hooks on the server?

I saw this tweet a while back and remembered it now. I assume useFragment uses a createContext somewhere. Maybe it could use a createServerContext for server components and then copy that data into a normal client context when the client code is loaded? Somehow.