Hands-On Full-Stack Web Development with GraphQL and React

The Apollo Mutation HoC

The complete HoC workflow requires you to have the HoC Query method set up, too. Otherwise, you won't be able to see why this approach has some advantages over the other one.

So, if you have undone the Query HoC, you should insert the code again, in order to test the mutation HoC. You can also skip to the next section, where you will learn how to use the Mutation component.

Follow these instructions to set up the mutation HoC:

1. Import the compose method from the react-apollo package, as follows:

import { graphql, compose } from 'react-apollo';

2. Add the addPost mutation and parse it with graphql-tag:

const ADD_POST = gql`  mutation addPost($post : PostInput!) {    addPost(post : $post) {      id      text      user {        username avatar ...