update connection using relay subscription updater

Question

I have a relay subscription setup in which I am getting the data in the updater which looks like this https://gist.github.com/ydvsailendar/6b9569bbcbc269246e299eb5cce18a80#file-gistfile1-txt-L10

I want to update my connection for a query so that I can get the updated messages via the query when the subscription gets new messages.

here is my subscription:

import { ConnectionHandler } from 'relay-runtime';
import {
    graphql,
    requestSubscription
} from 'react-relay'
import environment from '../network';

const subscription = graphql`
    subscription chatWithSubscription($id: String){
        chatWith(id: $id){
            textMessage
            id
            chatId
            date
            userType
            translatedMessage
        }
    }
`;

function chatWith(id) {
    const variables = { id: id };
    requestSubscription(environment, {
        subscription,
        variables,
        onError: (error) => {
            console.log(error, "error");
        },
        updater: (store) => {
            console.log(store, "store"); 
        }
    });
}

module.exports = chatWith;

and here is my query which i want to update via the updater:

module.exports = createPaginationContainer(
  ChatMessages,
  graphql`
    fragment ChatMessages_query on Query
      @argumentDefinitions(
        count: { type: "Int", defaultValue: 10 }
        cursor: { type: "String" }
        chatId: { type: "ID" }
      ) {
      messages(
        first: $count
        after: $cursor
        chatId: $chatId
      ) @connection(key: "ChatMessages_messages") {
        edges {
          node {
            id
            chatId
            userType
            date
            textMessage
            translatedMessage
          }
          cursor
        }
        totalCount
        pageInfo {
          endCursor
          hasNextPage
        }
      }
    }
  `,
  {
    direction: "forward" | "backward",
    getConnectionFromProps(props) {
      return props.query && props.query.messages;
    },
    // This is also the default implementation of `getFragmentVariables` if it isn't provided.
    getFragmentVariables(prevVars, totalCount) {
      return {
        ...prevVars,
        count: totalCount
      };
    },
    getVariables(props, { count, cursor }, fragmentVariables) {
      return {
        count,
        cursor,
        chatId: fragmentVariables.chatId
      };
    },
    query: graphql`
      query ChatMessagesPaginationQuery(
        $count: Int!
        $cursor: String
        $chatId: ID!
      ) {
        ...ChatMessages_query
          @arguments(
            count: $count
            cursor: $cursor
            chatId: $chatId
          )
      }
    `
  }
);

I am new to using updater via subscription and the docs were really confusing i couldn't understand the viewers' prop and other mentioned in the docs. please help me with the implementation.