title: GraphQL subscriptions
body: <p>I'm having a hard time with GraphQL today. Probably encountered every single error possible. </p>
  
  <p>I want to be able to subscribe to websockets in my component so I wrote some code to do this. Subscription works fine and it seems like it work, but the problem I have is <strong>how to get the updated values that come from the subscription inside my component?</strong>.</p>
  
  <pre><code>const FIELD_QUE = gql`
    query fieldChanged($fieldName: String!, $projectId: Int!) {
      fieldChanged(fieldName: $fieldName, projectId: $projectId) {
        usersEmail
        value
        projectId
      }
    }
  `;
  
  const FIELD_MUT = gql`
    mutation ChangeFieldMutation($fieldName: String!, $projectId: Int!, $value: String!, $usersEmail: String!) {
      changeField(fieldName: $fieldName, projectId: $projectId, value: $value, usersEmail: $usersEmail) {
        projectId
        value
        usersEmail
      }
    }
  `;
  
  const withMutation = graphql(FIELD_MUT, {
    props: ({ ownProps, mutate }) =&gt; ({
      changeField: ({ fieldName, value, projectId, usersEmail }) =&gt; {
        mutate({
          variables: { fieldName, value, projectId, usersEmail },
        });
      },
    }),
  });
  
  const FIELD_SUB = gql`
    subscription onFieldChanged($projectId: Int!){
        fieldChanged(projectId: $projectId){
          projectId
          value
          usersEmail
        }
      }
  `;
  
  const withSubscription = graphql(FIELD_QUE, {
    name: 'fieldChanged',
    options: () =&gt; ({
      variables: {
        projectId: 1,
        fieldName: 'description',
      },
    }),
    props: props =&gt; ({
      subscribeToFieldChange: (params) =&gt; {
        return props.fieldChanged.subscribeToMore({
          document: FIELD_SUB,
          variables: {
            projectId: params.projectId,
            fieldName: params.fieldName,
          },
          updateQuery: (prev, { subscriptionData }) =&gt; {
            if (!subscriptionData.data) return prev;
            const newValue = subscriptionData.data;
            const result = { ...prev, ...newValue };
            return result;
          },
        });
      },
    }),
  });
  </code></pre>
  
  <p>All I get is this:
  <a href="https://i.stack.imgur.com/ZLgNa.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ZLgNa.jpg" alt="enter image description here"></a></p>