diff --git a/examples/with-apollo/components/PostList.js b/examples/with-apollo/components/PostList.js
index ecd59292..8d939ae9 100644
--- a/examples/with-apollo/components/PostList.js
+++ b/examples/with-apollo/components/PostList.js
@@ -67,7 +67,7 @@ function PostList ({ data: { loading, error, allPosts, _allPostsMeta }, loadMore
return
Loading
}
-const allPosts = gql`
+export const allPosts = gql`
query allPosts($first: Int!, $skip: Int!) {
allPosts(orderBy: createdAt_DESC, first: $first, skip: $skip) {
id
@@ -81,15 +81,16 @@ const allPosts = gql`
}
}
`
+export const allPostsQueryVars = {
+ skip: 0,
+ first: POSTS_PER_PAGE
+}
// The `graphql` wrapper executes a GraphQL query and makes the results
// available on the `data` prop of the wrapped component (PostList)
export default graphql(allPosts, {
options: {
- variables: {
- skip: 0,
- first: POSTS_PER_PAGE
- }
+ variables: allPostsQueryVars
},
props: ({ data }) => ({
data,
diff --git a/examples/with-apollo/components/Submit.js b/examples/with-apollo/components/Submit.js
index 792d3b5d..527ff33c 100644
--- a/examples/with-apollo/components/Submit.js
+++ b/examples/with-apollo/components/Submit.js
@@ -1,5 +1,6 @@
import { graphql } from 'react-apollo'
import gql from 'graphql-tag'
+import {allPosts, allPostsQueryVars} from './PostList'
function Submit ({ createPost }) {
function handleSubmit (e) {
@@ -65,14 +66,9 @@ export default graphql(createPost, {
props: ({ mutate }) => ({
createPost: (title, url) => mutate({
variables: { title, url },
- updateQueries: {
- allPosts: (previousResult, { mutationResult }) => {
- const newPost = mutationResult.data.createPost
- return Object.assign({}, previousResult, {
- // Append the new post
- allPosts: [newPost, ...previousResult.allPosts]
- })
- }
+ update: (proxy, { data: { createPost } }) => {
+ const data = proxy.readQuery({ query: allPosts, variables: allPostsQueryVars })
+ proxy.writeQuery({ query: allPosts, data: {allPosts: [createPost, ...data.allPosts]}, variables: allPostsQueryVars })
}
})
})