Dynamic GraphQL mutations in React with template literals

Question

I am trying to send my Google OAuth response to gql mutation to authenticate the user/log them in. When getting the response from google, I am doing the following:

const authGQL = (user) => graphql(gql`
    mutation {
        LoginOrSignup(name: ${user.profileObj.name}, email: ${user.profileObj.email}, googleId: 
        ${user.googleId}, imageUrl: ${user.profileObj.imageUrl}) {
      name
      email
      googleId
      imageUrl
    }
  }
`);

This is within my mutations file:

const mutation = new GraphQLObjectType({
    name: 'Mutation',
    fields: {
        LoginOrSignup: {
            type: UserType,
            args: {
                name: { type: new GraphQLNonNull(GraphQLString) },
                email: { type: new GraphQLNonNull(GraphQLString) },
                googleId: { type: new GraphQLNonNull(GraphQLString) },
                imageUrl: { type: new GraphQLNonNull(GraphQLString) }
            },
            resolve(parentValue, { name, email, googleId, imageUrl}, request) {
                return AuthService.verifyUser({ name, email, googleId, imageUrl, req: request })
            }
        }
    }
});

It's not reaching the resolve function and I am not sure why! Thanks in advance.

Answer 1

Thanks to azium for pointing me in right direction. I had to use variables:

const mutation = gql` 
mutation LoginOrSignup($name: String!, $email: String!, $googleId: String!, $imageUrl: String!, $id_token: String!){
  LoginOrSignup(name: $name, email: $email, googleId: $googleId, imageUrl: $imageUrl, id_token: $id_token) {
    email
    name
  }
}
`

Within React I had to set those variables by using props.mutate:

    props.mutate({
      variables: {
        name: res.profileObj.name,
        email: res.profileObj.email,
        googleId: res.googleId,
        imageUrl: res.profileObj.imageUrl,
        id_token: res.tokenObj.id_token
      }
    })