Skip to content

Commit 096ce45

Browse files
prettier apollo
1 parent 8ce8ea1 commit 096ce45

File tree

4 files changed

+119
-102
lines changed

4 files changed

+119
-102
lines changed
Lines changed: 19 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,20 @@
1-
import ApolloClient, { addTypename } from 'apollo-client';
1+
import ApolloClient, { addTypename } from "apollo-client";
22

3-
export default options => new ApolloClient(Object.assign({}, {
4-
queryTransformer: addTypename,
5-
dataIdFromObject: (result) => {
6-
if (result.id && result.__typename) { // eslint-disable-line no-underscore-dangle
7-
return result.__typename + result.id; // eslint-disable-line no-underscore-dangle
8-
}
9-
return null;
10-
},
11-
// shouldBatch: true,
12-
}, options));
3+
export default options => new ApolloClient(
4+
Object.assign(
5+
{},
6+
{
7+
queryTransformer: addTypename,
8+
// shouldBatch: true,
9+
dataIdFromObject: result => {
10+
if (result.id && result.__typename) {
11+
// eslint-disable-line no-underscore-dangle
12+
return result.__typename +
13+
result.id; // eslint-disable-line no-underscore-dangle
14+
}
15+
return null;
16+
}
17+
},
18+
options
19+
)
20+
);
Lines changed: 21 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,39 @@
1-
import React from 'react';
2-
import { render } from 'react-dom';
3-
import { Router, browserHistory } from 'react-router';
4-
import ApolloClient, { createNetworkInterface } from 'apollo-client';
5-
import { ApolloProvider } from 'react-apollo';
6-
import md5 from 'md5';
7-
import { print } from 'graphql';
1+
import React from "react";
2+
import { render } from "react-dom";
3+
import { Router, browserHistory } from "react-router";
4+
import ApolloClient, { createNetworkInterface } from "apollo-client";
5+
import { ApolloProvider } from "react-apollo";
6+
import md5 from "md5";
7+
import { print } from "graphql";
88
// Polyfill fetch
9-
import 'isomorphic-fetch';
9+
import "isomorphic-fetch";
1010

11-
import routes from '@sa-labs/leo-core/build/load-routes';
11+
import routes from "@sa-labs/leo-core/build/load-routes";
1212

1313
const gqlInterface = {
14-
query({
15-
query,
16-
variables,
17-
operationName,
18-
}) {
19-
20-
const variablesHash = md5(Object.entries(variables)
21-
.reduce((acc, [key, val]) => `${acc}:${key}:${val}`, ''));
14+
query({ query, variables, operationName }) {
15+
const variablesHash = md5(
16+
Object
17+
.entries(variables)
18+
.reduce((acc, [ key, val ]) => `${acc}:${key}:${val}`, "")
19+
);
2220
const queryHash = md5(print(query));
2321
return fetch(`/api/${queryHash}--${variablesHash}.json`).then(v => {
2422
return v.json();
2523
});
2624
}
27-
}
25+
};
2826

2927
const client = new ApolloClient({
3028
networkInterface: gqlInterface,
31-
initialState: window.__APOLLO_STATE__,
29+
initialState: window.__APOLLO_STATE__
3230
});
3331

34-
render((
32+
render(
3533
<ApolloProvider client={client}>
3634
<Router history={browserHistory}>
3735
{routes}
3836
</Router>
39-
</ApolloProvider>
40-
), document.getElementById('content'));
37+
</ApolloProvider>,
38+
document.getElementById("content")
39+
);
Lines changed: 49 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,48 @@
1-
import React from 'react';
2-
import ReactDOM, { renderToStaticMarkup } from 'react-dom/server';
3-
import ApolloClient, { createNetworkInterface } from 'apollo-client';
4-
import { ApolloProvider } from 'react-apollo';
5-
import { getDataFromTree } from 'react-apollo/server';
6-
import { match, RouterContext, createMemoryHistory } from 'react-router';
7-
import path from 'path';
8-
import 'isomorphic-fetch';
9-
import { execute } from 'graphql';
10-
import { print } from 'graphql';
11-
const debug = require('debug')('leo-scaffolding-apollo:entry-static');
12-
import md5 from 'md5';
1+
import React from "react";
2+
import ReactDOM, { renderToStaticMarkup } from "react-dom/server";
3+
import ApolloClient, { createNetworkInterface } from "apollo-client";
4+
import { ApolloProvider } from "react-apollo";
5+
import { getDataFromTree } from "react-apollo/server";
6+
import { match, RouterContext, createMemoryHistory } from "react-router";
7+
import path from "path";
8+
import "isomorphic-fetch";
9+
import { execute } from "graphql";
10+
import { print } from "graphql";
11+
const debug = require("debug")("leo-scaffolding-apollo:entry-static");
12+
import md5 from "md5";
1313

14-
import routes from '@sa-labs/leo-core/build/load-routes';
15-
import Html from '@sa-labs/leo-core/build/load-html';
16-
import {
17-
conf,
18-
schema
19-
} from '@sa-labs/leo-core/build/inserted-files';
14+
import routes from "@sa-labs/leo-core/build/load-routes";
15+
import Html from "@sa-labs/leo-core/build/load-html";
16+
import { conf, schema } from "@sa-labs/leo-core/build/inserted-files";
2017

2118
const basePort = process.env.PORT || 3000;
2219
const apiHost = `http://localhost:${basePort + 10}`;
2320
const apiUrl = `${apiHost}/graphql`;
2421

2522
const gqlInterface = {
26-
query({
27-
query,
28-
variables,
29-
operationName,
30-
}) {
23+
query({ query, variables, operationName }) {
3124
// TODO: static render is failing for some reason?!?!?
32-
const variablesString = Object.entries(variables)
33-
.reduce((acc, [key, val]) => `${acc}:${key}:${val}`, '');
25+
const variablesString = Object
26+
.entries(variables)
27+
.reduce((acc, [ key, val ]) => `${acc}:${key}:${val}`, "");
3428
const queryHash = md5(print(query));
35-
return execute(schema, query, undefined, undefined, variables, operationName).then(json => {
29+
return execute(
30+
schema,
31+
query,
32+
undefined,
33+
undefined,
34+
variables,
35+
operationName
36+
).then(json => {
3637
_globalJSONAsset({
3738
name: `/api/${queryHash}--${md5(variablesString)}.json`,
3839
json: json
3940
});
4041
debug(json.length);
4142
return json;
42-
})
43+
});
4344
}
44-
}
45-
45+
};
4646

4747
export default (locals, callback) => {
4848
debug(`${locals.path} rendering`);
@@ -61,21 +61,23 @@ export default (locals, callback) => {
6161
</ApolloProvider>
6262
);
6363

64-
getDataFromTree(component).then(context => {
65-
const body = ReactDOM.renderToString(component);
66-
const html = renderToStaticMarkup(
67-
<Html
68-
body={body}
69-
assets={locals.assets}
70-
bundleAssets={locals.assetsPluginHash}
71-
props={renderProps}
72-
data={context.store.getState().apollo.data}
73-
/>
74-
);
75-
callback(null, html);
76-
}).catch(e => {
77-
debug(`${locals.path} failed`);
78-
callback(e);
79-
})
80-
})
81-
}
64+
getDataFromTree(component)
65+
.then(context => {
66+
const body = ReactDOM.renderToString(component);
67+
const html = renderToStaticMarkup(
68+
<Html
69+
body={body}
70+
assets={locals.assets}
71+
bundleAssets={locals.assetsPluginHash}
72+
props={renderProps}
73+
data={context.store.getState().apollo.data}
74+
/>
75+
);
76+
callback(null, html);
77+
})
78+
.catch(e => {
79+
debug(`${locals.path} failed`);
80+
callback(e);
81+
});
82+
});
83+
};
Lines changed: 30 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,39 @@
1-
import React, { Component, PropTypes } from 'react';
1+
import React, { Component, PropTypes } from "react";
22

33
export default class Html extends Component {
44
static propTypes = {
55
body: PropTypes.string.isRequired,
6-
data: PropTypes.object.isRequired,
6+
data: PropTypes.object.isRequired
77
};
88
render() {
9-
const {
10-
bundleAssets,
11-
data,
12-
body,
13-
} = this.props;
9+
const { bundleAssets, data, body } = this.props;
1410

15-
return <html lang="en">
16-
<head>
17-
<meta charSet="utf-8" />
18-
<meta name="viewport" content="width=device-width, initial-scale=1" />
19-
<link rel="stylesheet" type="text/css" href={`/${bundleAssets.static.css}`}/>
20-
</head>
21-
<body>
22-
<div id="content" dangerouslySetInnerHTML={{ __html: body }} />
23-
<script
24-
dangerouslySetInnerHTML={{ __html: `window.__APOLLO_STATE__=${JSON.stringify({ apollo: { data }})};` }}
25-
charSet="UTF-8"
26-
/>
27-
<script src='/js/client.js' charSet="UTF-8" />
28-
</body>
29-
</html>
11+
return (
12+
<html lang="en">
13+
<head>
14+
<meta charSet="utf-8" />
15+
<meta name="viewport" content="width=device-width, initial-scale=1" />
16+
<link
17+
rel="stylesheet"
18+
type="text/css"
19+
href={`/${bundleAssets.static.css}`}
20+
/>
21+
</head>
22+
<body>
23+
<div id="content" dangerouslySetInnerHTML={{ __html: body }} />
24+
<script
25+
dangerouslySetInnerHTML={
26+
{
27+
__html: `window.__APOLLO_STATE__=${JSON.stringify({
28+
apollo: { data }
29+
})};`
30+
}
31+
}
32+
charSet="UTF-8"
33+
/>
34+
<script src="/js/client.js" charSet="UTF-8" />
35+
</body>
36+
</html>
37+
);
3038
}
3139
}

0 commit comments

Comments
 (0)