Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 741f211

Browse files
sebas5384timneutkens
authored andcommitted
with-apollo example using Apollo 2 (vercel#3180)
* Updated dependencies related to Apollo and React. * Updated libs with Apollo 2 new set of modules. * Updated to Apollo 2 react integration modules. * Updated withData to separate apollo state from the app's state.
1 parent b937ed3 commit 741f211

File tree

6 files changed

+24
-18
lines changed

6 files changed

+24
-18
lines changed

‎examples/with-apollo/components/PostList.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
import { gql, graphql } from 'react-apollo'
1+
import { graphql } from 'react-apollo'
2+
import gql from 'graphql-tag'
23
import ErrorMessage from './ErrorMessage'
34
import PostUpvoter from './PostUpvoter'
45

‎examples/with-apollo/components/PostUpvoter.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react'
2-
import { gql, graphql } from 'react-apollo'
2+
import { graphql } from 'react-apollo'
3+
import gql from 'graphql-tag'
34

45
function PostUpvoter ({ upvote, votes, id }) {
56
return (

‎examples/with-apollo/components/Submit.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
import { gql, graphql } from 'react-apollo'
1+
import { graphql } from 'react-apollo'
2+
import gql from 'graphql-tag'
23

34
function Submit ({ createPost }) {
45
function handleSubmit (e) {

‎examples/with-apollo/lib/initApollo.js

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import { ApolloClient, createNetworkInterface } from 'react-apollo'
1+
import { ApolloClient } from 'apollo-client'
2+
import { HttpLink } from 'apollo-link-http'
3+
import { InMemoryCache } from 'apollo-cache-inmemory'
24
import fetch from 'isomorphic-fetch'
35

46
let apolloClient = null
@@ -10,14 +12,15 @@ if (!process.browser) {
1012

1113
function create (initialState) {
1214
return new ApolloClient({
13-
initialState,
15+
connectToDevTools: process.browser,
1416
ssrMode: !process.browser, // Disables forceFetch on the server (so queries are only run once)
15-
networkInterface: createNetworkInterface({
17+
link: newHttpLink({
1618
uri: 'https://api.graph.cool/simple/v1/cixmkt2ul01q00122mksg82pn', // Server URL (must be absolute)
17-
opts: {// Additional fetch() options like `credentials` or `headers`
18-
credentials: 'same-origin'
19+
opts: {
20+
credentials: 'same-origin'// Additional fetch() options like `credentials` or `headers`
1921
}
20-
})
22+
}),
23+
cache: new InMemoryCache().restore(initialState || {}),
2124
})
2225
}
2326

‎examples/with-apollo/lib/withData.js

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -48,12 +48,9 @@ export default ComposedComponent => {
4848
Head.rewind()
4949

5050
// Extract query data from the Apollo store
51-
const state = apollo.getInitialState()
52-
5351
serverState = {
5452
apollo: {
55-
// Only include the Apollo data state
56-
data: state.data
53+
data: apollo.cache.extract()
5754
}
5855
}
5956
}
@@ -66,7 +63,7 @@ export default ComposedComponent => {
6663

6764
constructor (props) {
6865
super(props)
69-
this.apollo = initApollo(this.props.serverState)
66+
this.apollo = initApollo(this.props.serverState.apollo.data)
7067
}
7168

7269
render () {

‎examples/with-apollo/package.json

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,13 +7,16 @@
77
"start": "next start"
88
},
99
"dependencies": {
10-
"graphql": "^0.9.3",
10+
"apollo-client-preset": "^1.0.1",
11+
"graphql": "^0.11.7",
12+
"graphql-anywhere": "^3.1.0",
13+
"graphql-tag": "^2.5.0",
1114
"isomorphic-fetch": "^2.2.1",
1215
"next": "latest",
1316
"prop-types": "^15.5.8",
14-
"react": "^15.5.4",
15-
"react-dom": "^15.5.4",
16-
"react-apollo": "^1.1.3"
17+
"react": "^16.0.0",
18+
"react-apollo": "^2.0.0",
19+
"react-dom": "^16.0.0"
1720
},
1821
"author": "",
1922
"license": "ISC"

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /