How to refresh an item in a list for Relay Modern

Question

In Relay Modern, how do you refresh just an item in a list?

I have a pagination list.

Later in a code, I want to refresh just an item, not the entire list.

How do I do that in Modern Relay?

Answer 1

I did not know RefetchContainer could be used without QueryRenderer. The following setup (simplified code) worked for me. All I have to do is to call this.props.relay.refetch({id: this.props.item.id}) on ListItem and it refetches a single item in a list.

createRefetchContainer(ListItem,
  {
    item: graphql`
      fragment ListItem_item on Item {
        id
        value
      }
    `
  },
  graphql`
      query ListItemRefetchQuery($id: ID!) {
        node(id: $id) {
            ...ListItem_item
        }
      }
    `,
  );
);

createFragmentContainer(List,
  {
    list: graphql`
      fragment List_list on List {
        items {
          ...ListItem_item
        }
      }
    `
  );
);