Im using the withApollo HOC when i submit a form to run some mutation, the problem is is that the data that is returned is not passed into my props, does anyone know how to access this data?

withApollo

injects a client instance that allows you to create a promise that sends a query.

then

-ing the promise gives access to the data

@samjbmason shoot me a sample of the code you're trying to get working and I'll be happy to help 🙂

@cj This the handle submit of the form

handleSubmit: (payload, { props }) => {
    props.client
      .query({
        query: findUserQuery,
        variables: { email: payload.email }
      })
      .then(({ data }) => {
        if (data.User != null) {
          return props.client.mutate({
            mutation: createRideWithExistingUserMutation,
            variables: { userId: data.User.id, ...rideObject(payload) }
          })
        }
        return props.client.mutate({
          mutation: createUserAndRideMutation,
          variables: { email: payload.email, ...rideObject(payload) }
        })
      })
      .catch(e => console.log(e))
  }

@samjbmason sorry, kids got home... why wouldn't you just use

graphql

as @nilan suggested and then do something like:

handleSubmit: async (payload, { props }) => {
  const defaultData = { ...rideObject(payload) }
  const { User } = await props.findUser({ email: payload.email })

  if (User) {
    return props.createRideWithExistingUser({ userId: User.id, ...defaultData })
  } else {
    return props.createUserAndRide({ email: payload.email, ...defaultData })
  }
}

this line looks good but I didnt think it was possible to calla query from a prop

const { User } = await props.findUser({ email: payload.email })

@samjbmason that's what

import { graphql } from 'react-apollo'

is for http://dev.apollodata.com/react/higher-order-components.html

@cj But I thought queries passed into graphql, run immediately on load and that it was only mutations that you can call inside a component through props.

@sambmason - if you use withApollo then you are doing the graphql query imperatively inside your component, so it would not make sense for the data to go into props (which are for things passed into your component from outside). You should use setState in the then() part of the promise returned by props.client.query (or dispatch an action if you are using redux for state) and then have your component render based on state rather than props

@dankent I ended up with a mix of withApollo and graphql, I set up the mutations with

graphql

so I could use them in the props with

props.mutate

and then used the withApollo to setup a

props.client.query

to fetch the the user in the submit handler and the pass that value to the mutations. It seemed to work pretty well