CODEWITHSUNDEEP
reactjsreact-nativegraphqlapolloreact-apollo
Guardian_nw
Guardian_nw

Reputation: 223

Apollo Client React container add created element to paginated list of elements without refetching

This title is quite confusing, but I will try to explain the best that I can. I have a situation where I am collecting and displaying a list of data elements from the server in React Native. It uses a query that sends a GraphQL parameter to the server to limit the initial request to the first 15 elements.

query GetElements ($count: Int) {
    elements (count: $count) {
            id
            name
            tye
    }
}

As previously stated, this will query the main list with an initial count of 15 elements.

I have another page of the app that a user can create a new element on the backend using a different GraphQL query.

My question is: Is there a way to easily update the main list of elements to include the newly created element without performing any addition network requests? In other words, I want to be able to simply add the new element to the main list of elements whenever the create command is successful.

The problem is: Apollo's readQuery command on the update proxy will not return to me the appropriate data set to update unless I know the variables that were send with the initial query; this includes the pagination count variable.

Upvotes: 3

Views: 1486

Answers (2)

Manzo
Manzo

Reputation: 66

You can now define the key for the queries cache store like this:

 query AllItems($cursor: String, $limit: Int, $query: String) {
  items(cursor: $cursor, limit: $limit, query: $query) @connection(key: "AllItemsQuery") {
    count
    cursor
    has_next
    has_prior
    data{
      ...CoreItem
    }
  }
}

Upvotes: 2

kkemple
kkemple

Reputation: 992

if you would just like to receive the added item, it seems like you want subscriptions :: http://dev.apollodata.com/react/subscriptions.html

Upvotes: 0

Related Questions