react-adopt
react-adopt copied to clipboard
How to wait for Query result
I would like to use React Adopt with Formik and Apollo Client. I am getting initial form data in getUser but first time I am getting empty data object with loading flag, and when the result came back from server, loading flag turn to false and I get the result. Using following snippet, Formik always initialised with empty array, because rendering Formik doesn't wait for loading=false.
const Composed = adopt({
getUser: ({ render }) => <Query query={CURRENT_USER_PROFILE_QUERY} children={render}/>,
updateUser: ({ render }) => <Mutation mutation={CURRENT_USER_UPDATE_MUTATION}
children={render}/>,
form: ({ render, updateUser, getUser }) =>
<Formik initialValues={{ ...formDefaultValue, ...getUser.data.me }} children={render} />,
});
Without React Adopt my code looks like this:
<Query query={CURRENT_USER_PROFILE_QUERY}>
{({ loading, error, data }) => {
if (!loading) return (
<Formik initialValues={{ ...formDefaultValue, ...data.me }}>
How can I achieve it with React Adopt?
If you dont use mapProps, then you can use getUser.loading or getUser.error.
If you dont use
mapProps, then you can usegetUser.loadingorgetUser.error.
But apparently not within in the render function where Composed is used. I also did not find any documentation that would support this claim.