I just looked to see how Redwood processes Cell components, and it confirmed what I guessed - it looks like Cells get compiled into single components that encapsulate all of the Loading, Empty, Error, and Success states and run the GraphQL query on component render. Since it ends up as a single component, any props passed to the Cell that change will cause a re-render of the entire resulting Cell component, including the full lifecycle and the GraphQL query.
I also now more clearly understand why it has to be this way - all props passed to the Cell are consumed in many places, including the beforeQuery
function and all 4 lifecycle states.
I can think of two ways to possibly accomplish what I want:
- If Cells accepted different props for each “piece” (e.g. queryProps, errorProps, successProps, etc), and used
ContextProvider
/useContext
to consume only the expected props at each phase of the lifecycle, perhaps that could work. - I could possibly do something like this myself by making a
ContextProvider
in the Cell’s parent component, then consume that context only within my Success component.
I’ll try the second approach and see if I can do it in a clean way.