1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00

updated with-apollo example to update option API (#3296)

This commit is contained in:
Thomas Vogel 2017-11-16 11:18:25 +01:00 committed by Tim Neutkens
parent 7c9d350091
commit abe0aebcc0
2 changed files with 10 additions and 13 deletions

View file

@ -67,7 +67,7 @@ function PostList ({ data: { loading, error, allPosts, _allPostsMeta }, loadMore
return <div>Loading</div>
}
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,

View file

@ -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 })
}
})
})