Feedback on v2.1 Query component #1565
Description
Hi there! I was reading the roadmap and had a suggestion on the Query component.
For reference, here is the draft API of the Query component that is in the document:
<Query
skip={boolean}
options={QueryOptions}
loading={(result?) => Component || null}
error={(result?) => Component || null}
render={(result) => Component}
/>I think there could be value in keeping the API more similar to the graphql HoC and the proposed Mutation component by using a single render prop:
<Query
skip={boolean}
options={QueryOptions}
render={(result) => Component}
/>The reason is that when there is just a single render prop, then you can more easily compose components, like so:
<Composer
operations={[
<Query
skip={boolean}
options={QueryOptions}
/>,
<Mutation
options={MutationOptions}
/>
]}
render={([queryResult, mutationResult]) => {
return (
<div>
stuff
</div>
);
}}
/>The above API is useful when you need access to more than one operation within a subtree. If Query has three render props, then this type of composition isn't as straightforward.
What do you think? Are there other ways to compose operations that work just as well with 3 props?
I'm curious to hear what you think. Thanks for reading!
Disclaimer: I've never used GraphQL nor Apollo (I've just been reading the docs a bunch), but I'm assuming that it's useful to sometimes have access to a read and write operation at the same time (say, fetching some resources and updating some of those resources). Maybe you might even have more mutations than that if people tend to made a separate mutation for, say, deleting a resource?
Or maybe I'm completely wrong. If so, sorry for wasting your time! 🙈