Merge pull request #16 from status-im/feat/apollo
feat: extract link to its own file
This commit is contained in:
commit
79afa5b9fc
|
@ -3,15 +3,13 @@ import ReactDOM from "react-dom";
|
||||||
import "./index.css";
|
import "./index.css";
|
||||||
import * as serviceWorker from "./serviceWorker";
|
import * as serviceWorker from "./serviceWorker";
|
||||||
import gql from "graphql-tag";
|
import gql from "graphql-tag";
|
||||||
import { ApolloLink } from "apollo-link";
|
|
||||||
import { ApolloClient } from "apollo-client";
|
import { ApolloClient } from "apollo-client";
|
||||||
import { ApolloProvider, Query } from "react-apollo";
|
import { ApolloProvider, Query } from "react-apollo";
|
||||||
import { InMemoryCache } from "apollo-cache-inmemory";
|
import { InMemoryCache } from "apollo-cache-inmemory";
|
||||||
import Phoenix from "phoenix";
|
import Phoenix from "phoenix";
|
||||||
import Web3 from "web3";
|
import Web3 from "web3";
|
||||||
import { makeExecutableSchema } from "graphql-tools";
|
import { makeExecutableSchema } from "graphql-tools";
|
||||||
import { rxjs } from "apollo-link-rxjs";
|
import PhoenixRxLink from "./phoenix-rx-link";
|
||||||
import { graphql } from "reactive-graphql";
|
|
||||||
|
|
||||||
const web3 = new Web3("ws://localhost:8545");
|
const web3 = new Web3("ws://localhost:8545");
|
||||||
|
|
||||||
|
@ -78,19 +76,12 @@ class App extends React.Component {
|
||||||
resolvers
|
resolvers
|
||||||
});
|
});
|
||||||
|
|
||||||
// TODO: extract to separate script
|
|
||||||
|
|
||||||
const graphQLRXJSLink = new ApolloLink(operation => {
|
|
||||||
return graphql(schema, operation.query); // TODO: test with variables in query
|
|
||||||
});
|
|
||||||
|
|
||||||
const rxjsLink = rxjs({}); // TODO: This supports onOperation and onResult. Read more about those in npm package README
|
|
||||||
|
|
||||||
// Pass your GraphQL endpoint to uri
|
|
||||||
const client = new ApolloClient({
|
const client = new ApolloClient({
|
||||||
addTypename: false,
|
// If addTypename:true, the query will fail due to __typename
|
||||||
cache: new InMemoryCache({ addTypename: false }), // TODO: If addTypename is true, the query will fail
|
// being added to the schema. reactive-graphql does not
|
||||||
link: ApolloLink.from([rxjsLink, graphQLRXJSLink])
|
// support __typename at this moment.
|
||||||
|
cache: new InMemoryCache({ addTypename: false }),
|
||||||
|
link: PhoenixRxLink(schema)
|
||||||
});
|
});
|
||||||
|
|
||||||
this.setState({ client });
|
this.setState({ client });
|
||||||
|
@ -102,13 +93,13 @@ class App extends React.Component {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ApolloProvider client={this.state.client}>
|
<ApolloProvider client={this.state.client}>
|
||||||
<div>
|
|
||||||
<button onClick={this.createTrx}>Create Trx</button>
|
|
||||||
</div>
|
|
||||||
<Query query={MY_QUERY}>
|
<Query query={MY_QUERY}>
|
||||||
{({ loading, error, data }) => {
|
{({ loading, error, data }) => {
|
||||||
if (loading) return <div>Loading...</div>;
|
if (loading) return <div>Loading...</div>;
|
||||||
if (error) return <div>Error :(</div>;
|
if (error) {
|
||||||
|
console.error(error);
|
||||||
|
return <div>Error :(</div>;
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<p>The data returned by the query: {JSON.stringify(data)}</p>
|
<p>The data returned by the query: {JSON.stringify(data)}</p>
|
||||||
);
|
);
|
||||||
|
|
|
@ -0,0 +1,19 @@
|
||||||
|
import { ApolloLink } from "apollo-link";
|
||||||
|
import { rxjs } from "apollo-link-rxjs";
|
||||||
|
import { graphql } from "reactive-graphql";
|
||||||
|
|
||||||
|
|
||||||
|
const PhoenixRxLink = schema => {
|
||||||
|
const graphqlLink = function(schema) {
|
||||||
|
return new ApolloLink(operation => {
|
||||||
|
return graphql(schema, operation.query); // TODO: test with variables in query
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const rxjsLink = rxjs({}); // TODO: This supports onOperation and onResult. Read more about those in npm package README
|
||||||
|
|
||||||
|
return ApolloLink.from([rxjsLink, graphqlLink(schema)]);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default PhoenixRxLink;
|
||||||
|
|
Loading…
Reference in New Issue