Added subscription support and switched backend to graphcool.
This commit is contained in:
parent
b2c548538a
commit
1932294e23
8 changed files with 110 additions and 66 deletions
52
package-lock.json
generated
52
package-lock.json
generated
|
@ -12,8 +12,7 @@
|
|||
"@types/graphql": {
|
||||
"version": "0.9.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/graphql/-/graphql-0.9.3.tgz",
|
||||
"integrity": "sha512-+NlcRhAXQUWXnmKomiNR/5ELupOQ3N1Oz7EcUTO8P3nWDo8b2szwvaqelzE97h5N3MU27zrNLGDomJh85OlYnQ==",
|
||||
"optional": true
|
||||
"integrity": "sha512-+NlcRhAXQUWXnmKomiNR/5ELupOQ3N1Oz7EcUTO8P3nWDo8b2szwvaqelzE97h5N3MU27zrNLGDomJh85OlYnQ=="
|
||||
},
|
||||
"@types/isomorphic-fetch": {
|
||||
"version": "0.0.34",
|
||||
|
@ -691,6 +690,11 @@
|
|||
"resolved": "https://registry.npmjs.org/babylon/-/babylon-6.17.4.tgz",
|
||||
"integrity": "sha512-kChlV+0SXkjE0vUn9OZ7pBMWRFd8uq3mZe8x1K6jhuNcAFAtEnjchFAqB+dYEXKyd+JpT6eppRR78QAr5gTsUw=="
|
||||
},
|
||||
"backo2": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/backo2/-/backo2-1.0.2.tgz",
|
||||
"integrity": "sha1-MasayLEpNjRj41s+u2n038+6eUc="
|
||||
},
|
||||
"balanced-match": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
|
||||
|
@ -2664,6 +2668,11 @@
|
|||
"resolved": "https://registry.npmjs.org/graphql-anywhere/-/graphql-anywhere-3.1.0.tgz",
|
||||
"integrity": "sha1-PqDY6GRrXO5oA1AWqadVfBXCHpY="
|
||||
},
|
||||
"graphql-subscriptions": {
|
||||
"version": "0.4.4",
|
||||
"resolved": "https://registry.npmjs.org/graphql-subscriptions/-/graphql-subscriptions-0.4.4.tgz",
|
||||
"integrity": "sha512-hqfUsZv39qmK4SEoKMnTO05U4EVvIeAD4ai5ztE9gCl4hEdeaF2Q5gvF80ONQQAnkys4odzxWYd2tBLS/cWl8g=="
|
||||
},
|
||||
"graphql-tag": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/graphql-tag/-/graphql-tag-2.4.2.tgz",
|
||||
|
@ -3593,6 +3602,11 @@
|
|||
"resolved": "https://registry.npmjs.org/lodash._reinterpolate/-/lodash._reinterpolate-3.0.0.tgz",
|
||||
"integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0="
|
||||
},
|
||||
"lodash.assign": {
|
||||
"version": "4.2.0",
|
||||
"resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz",
|
||||
"integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc="
|
||||
},
|
||||
"lodash.camelcase": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
|
||||
|
@ -3623,6 +3637,11 @@
|
|||
"resolved": "https://registry.npmjs.org/lodash.isobject/-/lodash.isobject-3.0.2.tgz",
|
||||
"integrity": "sha1-PI+41bW/S/kK4G4U8qUwpO2TXh0="
|
||||
},
|
||||
"lodash.isstring": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
|
||||
"integrity": "sha1-1SfftUVuynzJu5XV2ur4i6VKVFE="
|
||||
},
|
||||
"lodash.memoize": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
|
||||
|
@ -5718,6 +5737,18 @@
|
|||
"resolved": "https://registry.npmjs.org/style-loader/-/style-loader-0.18.2.tgz",
|
||||
"integrity": "sha512-WPpJPZGUxWYHWIUMNNOYqql7zh85zGmr84FdTVWq52WTIkqlW9xSxD3QYWi/T31cqn9UNSsietVEgGn2aaSCzw=="
|
||||
},
|
||||
"subscriptions-transport-ws": {
|
||||
"version": "0.8.1",
|
||||
"resolved": "https://registry.npmjs.org/subscriptions-transport-ws/-/subscriptions-transport-ws-0.8.1.tgz",
|
||||
"integrity": "sha512-RRRrxZCn0Gxj8etaeliqZtjKRpE3J6PY+/rocUR8RpPe7Y3M+tG2bu1/aNe7p1DsC2fnco9QU9oH49BGrg8i7g==",
|
||||
"dependencies": {
|
||||
"eventemitter3": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-2.0.3.tgz",
|
||||
"integrity": "sha1-teEHm1n7XhuidxwKmTvgYKWMmbo="
|
||||
}
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.1.0.tgz",
|
||||
|
@ -5917,6 +5948,11 @@
|
|||
"integrity": "sha1-bgkk1r2mta/jSeOabWMoUKD4grc=",
|
||||
"optional": true
|
||||
},
|
||||
"ultron": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.0.tgz",
|
||||
"integrity": "sha1-sHoualQagV/Go0zNRTO67DB8qGQ="
|
||||
},
|
||||
"uniq": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/uniq/-/uniq-1.0.1.tgz",
|
||||
|
@ -6363,6 +6399,18 @@
|
|||
"resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-1.3.4.tgz",
|
||||
"integrity": "sha1-+Aek8LHZ6ROuekgRLmzDrxmRtF8="
|
||||
},
|
||||
"ws": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/ws/-/ws-3.0.0.tgz",
|
||||
"integrity": "sha1-mN2wAFbIOQy3Ued4h4hJf5kQO2w=",
|
||||
"dependencies": {
|
||||
"safe-buffer": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.0.1.tgz",
|
||||
"integrity": "sha1-0mPKVGls2KMGtcplUekt5XkY++c="
|
||||
}
|
||||
}
|
||||
},
|
||||
"xdg-basedir": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-2.0.0.tgz",
|
||||
|
|
|
@ -9,7 +9,8 @@
|
|||
"react-dom": "^15.6.1",
|
||||
"react-router": "^4.1.1",
|
||||
"react-scripts": "1.0.10",
|
||||
"react-tap-event-plugin": "^2.0.1"
|
||||
"react-tap-event-plugin": "^2.0.1",
|
||||
"subscriptions-transport-ws": "^0.8.1"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
|
|
|
@ -8,7 +8,7 @@ export default ({achievements, id, completed}) => {
|
|||
return <div>Loading...</div>
|
||||
}
|
||||
|
||||
const list = achievements.sort((a, b) => {
|
||||
const list = [...achievements].sort((a, b) => {
|
||||
if (a.number === b.number)
|
||||
return a.letter > b.letter;
|
||||
return a.number > b.number;
|
||||
|
|
|
@ -10,7 +10,7 @@ export default ({
|
|||
return <div> Loading... </div>
|
||||
}
|
||||
|
||||
const sortedAdventures = allAdventures.sort((a,b) => (a.number > b.number));
|
||||
const sortedAdventures = [...allAdventures].sort((a,b) => (a.number > b.number));
|
||||
|
||||
const [
|
||||
requiredAdventures,
|
||||
|
|
|
@ -1,20 +1,17 @@
|
|||
import { gql, graphql } from 'react-apollo';
|
||||
import { stripEdges } from '../utils.js';
|
||||
|
||||
export default graphql(gql`
|
||||
query GetAchievementsForAdventure($adventureID:ID!){
|
||||
getAdventure(id:$adventureID) {
|
||||
achievements {
|
||||
edges {
|
||||
node {
|
||||
id,
|
||||
number,
|
||||
letter,
|
||||
description,
|
||||
additionalText
|
||||
}
|
||||
}
|
||||
allAchievements(filter: {
|
||||
adventure: {
|
||||
id: $adventureID
|
||||
}
|
||||
}) {
|
||||
id,
|
||||
number,
|
||||
letter,
|
||||
description,
|
||||
additionalText
|
||||
}
|
||||
}
|
||||
`,{
|
||||
|
@ -26,8 +23,8 @@ export default graphql(gql`
|
|||
};
|
||||
},
|
||||
props: ({ownProps, data}) => {
|
||||
return data.getAdventure ? {
|
||||
achievements: stripEdges(data.getAdventure.achievements),
|
||||
return data.allAchievements ? {
|
||||
achievements: data.allAchievements,
|
||||
...ownProps
|
||||
} : {...ownProps}
|
||||
|
||||
|
|
|
@ -1,26 +1,18 @@
|
|||
import { gql, graphql } from 'react-apollo';
|
||||
|
||||
import { stripEdges } from '../utils.js';
|
||||
|
||||
export default graphql(gql`
|
||||
query GetAllAdventuresForRank{
|
||||
viewer {
|
||||
allAdventures {
|
||||
edges {
|
||||
node {
|
||||
name,
|
||||
number,
|
||||
required,
|
||||
id
|
||||
}
|
||||
}
|
||||
}
|
||||
query GetAllAdventures{
|
||||
allAdventures {
|
||||
name,
|
||||
number,
|
||||
required,
|
||||
id
|
||||
}
|
||||
}
|
||||
`,{
|
||||
props: ({ownProps, data}) => (
|
||||
data.viewer ? {
|
||||
allAdventures: stripEdges(data.viewer.allAdventures),
|
||||
data.allAdventures ? {
|
||||
allAdventures: data.allAdventures,
|
||||
...ownProps
|
||||
} : {...ownProps})
|
||||
});
|
||||
|
|
|
@ -1,36 +1,31 @@
|
|||
import { gql, graphql } from 'react-apollo';
|
||||
|
||||
export default graphql(gql`
|
||||
query GetScoutData($scoutID:ID!){
|
||||
getScout(id: $scoutID){
|
||||
displayName,
|
||||
advancementDeadline,
|
||||
adventures {
|
||||
edges {
|
||||
node {
|
||||
name
|
||||
}
|
||||
}
|
||||
},
|
||||
achievements {
|
||||
edges {
|
||||
node {
|
||||
number,
|
||||
letter
|
||||
}
|
||||
}
|
||||
query getScoutData($scoutID:ID!){
|
||||
Scout(id: $scoutID) {
|
||||
displayName
|
||||
advancementDeadline
|
||||
completedAdventures {
|
||||
id
|
||||
name
|
||||
}
|
||||
completedAchievements {
|
||||
id
|
||||
number
|
||||
letter
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
`,{
|
||||
options : ({scoutID}) => ({variables: {scoutID}}),
|
||||
props: ({ ownProps, data }) => (
|
||||
data.getScout ? {
|
||||
data.Scout ? {
|
||||
scoutID: ownProps.scoutID,
|
||||
displayName: data.getScout.displayName,
|
||||
completedAdventures: data.getScout.adventures,
|
||||
completedAchievements: data.getScout.achievements,
|
||||
advancementDeadline: data.getScout.advancementDeadline
|
||||
displayName: data.Scout.displayName,
|
||||
advancementDeadline: data.Scout.advancementDeadline,
|
||||
completedAdventures: data.Scout.completedAdventures,
|
||||
completedAchievements: data.Scout.completedAchievements
|
||||
} : {
|
||||
scoutID: ownProps.scoutID
|
||||
}
|
||||
|
|
27
src/index.js
27
src/index.js
|
@ -1,12 +1,19 @@
|
|||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
|
||||
import {
|
||||
ApolloClient,
|
||||
createNetworkInterface,
|
||||
ApolloProvider
|
||||
} from 'react-apollo';
|
||||
import {
|
||||
SubscriptionClient,
|
||||
addGraphQLSubscriptions
|
||||
} from 'subscriptions-transport-ws';
|
||||
|
||||
import injectTapEventPlugin from 'react-tap-event-plugin';
|
||||
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
|
||||
|
||||
//import registerServiceWorker from './registerServiceWorker';
|
||||
import './index.css';
|
||||
import App from './App';
|
||||
|
@ -15,23 +22,27 @@ import App from './App';
|
|||
// http://stackoverflow.com/a/34015469/988941
|
||||
injectTapEventPlugin();
|
||||
|
||||
const client = new ApolloClient({
|
||||
networkInterface: createNetworkInterface({
|
||||
uri: 'https://us-west-2.api.scaphold.io/graphql/scout'
|
||||
})
|
||||
const httpInterface = createNetworkInterface({
|
||||
uri: "https://api.graph.cool/simple/v1/cj53el7vnpphz01759pf8l7ou"
|
||||
});
|
||||
|
||||
const loc = window.location;
|
||||
const wsClient = new SubscriptionClient("wss://subscriptions.us-west-2.graph.cool/v1/cj53el7vnpphz01759pf8l7ou", {
|
||||
reconnect: true
|
||||
});
|
||||
|
||||
console.log("location: ", loc);
|
||||
const networkInterface = addGraphQLSubscriptions(httpInterface, wsClient);
|
||||
|
||||
const client = new ApolloClient({ networkInterface });
|
||||
|
||||
const location = window.location;
|
||||
|
||||
ReactDOM.render(
|
||||
<MuiThemeProvider>
|
||||
<ApolloProvider client={client}>
|
||||
<App slug={loc.pathname} query={loc.search} />
|
||||
<App slug={location.pathname} query={location.search} />
|
||||
</ApolloProvider>
|
||||
</MuiThemeProvider>,
|
||||
document.getElementById('root')
|
||||
);
|
||||
|
||||
//registerServiceWorker();
|
||||
//registerServiceWorker(); //See import above
|
||||
|
|
Loading…
Reference in a new issue