Sending messages through Mutations

The addMessage mutation already exists in our back end, so we can add it to our Chats component. First, parse the mutation at the top, next to the other requests:

const ADD_MESSAGE = gql`  mutation addMessage($message : MessageInput!) {    addMessage(message : $message) {      id      text      user {        id      }    }  }`;

For each open chat, we will have one input where the user can type his message. There are multiple solutions to save all of the inputs' text inside the React component's state. For now, we will keep it simple, but we will take a look at a better way to do this in the Chapter 5, Reusable React Components.

Open a new object inside of the state initializer in our Chats class:

textInputs: {}

This object is indexed with ...

Get Hands-On Full-Stack Web Development with GraphQL and React now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.