-
Notifications
You must be signed in to change notification settings - Fork 27k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add Apollo example #780
Add Apollo example #780
Conversation
The example should be linked from the root README as done with other examples |
@@ -1,6 +1,6 @@ | |||
# Apollo Example | |||
## Demo | |||
https://with-apollo-oeaizzfwlu.now.sh | |||
https://with-apollo-ehxkwxrnvf.now.sh |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Try to use an alias :)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
ah of course thanks for the tip!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
would that just be now alias https://with-apollo-ehxkwxrnvf.now.sh [domain name]
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think you got it correct :)
I hope you could use -a
flag.
} | ||
|
||
return { | ||
initialState: store.getState(), |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Apollo only permits rehydrating state.apollo.data
. See apollographql/apollo-client#759
Otherwise all kind of weird bugs can happen. I found out the hard way:
When using a ssr: false
query state.apollo.queries
mismatched on the client and gave me a bogus warning about a missing query variable. Apollo client unfortunately uses a bad query id https://github.com/apollostack/apollo-client/blob/41a3919/src/core/QueryManager.ts#L543 which causes things to mismatch if the order of queries isn't the same on the sever and client.
I recommend changing this to the following:
const state = store.getState()
return {
initialState: {
...state,
apollo: {
data: state.apollo.data
}
},
headers
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
OK my bad, I told @ads1018 he could simplify that way, I had taken that from some old code and it had worked so far 😄 I'll update my own example too.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @tpreusse! I didn't experience any warnings about a missing query variable with the way I have it set up. Just out of curiosity, could you show me how to reproduce that warning before I change it?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You will see that you get a bogus apollo error Network error: The inline argument "id" is expected as a variable but was not provided.
that disappears if you apply the fix above.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Interestingly, my app has query variables and I didn't encounter such an error message... any ideas? https://github.com/relatenow/relate/blob/master/containers/Profile.js#L26
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
it only explodes with required query variables which are not met because the wrong query is associated (pre-populated query store and apollo client core starting at 1 again on the client). So the order of your components plays a role in triggering the bug – super spooky, hard to find and debug.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good to know...
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for the great spot @tpreusse. I just pushed up your recommendation :)
What do you think about adding a new GraphQL section to the README for calling out all GraphQL client integration examples? Something along the lines of this: GraphQL Client IntegrationExamples |
@ads1018 since it's a pretty short list, maybe add it under FAQ as |
@timneutkens I dig it |
@sedubois since you've worked with apollo extensively. Could you do a final review / approve 💯 |
@timneutkens Looks good to me :) @sedubois let me know if you any more feedback. |
// The data prop, which is provided by the HOC below contains | ||
// a `loading` key while the query is in flight | ||
function PostList (props) { | ||
const { data: { allPosts, loading, _allPostsMeta }, loadMorePosts } = props |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think props can be inlined
// The `graphql` wrapper executes a GraphQL query and makes the results | ||
// available on the `data` prop of the wrapped component (PostList here) | ||
export default graphql(allPosts, { | ||
options: (ownProps) => ({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Unused var ownProps. I think there's a non-function (plain object) version of options
const client = new ApolloClient({ | ||
ssrMode: IS_SERVER, | ||
headers, | ||
dataIdFromObject: (result) => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think you can simplify to result => result.id || null
}) | ||
if (IS_SERVER) { | ||
return client | ||
} else { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Unnecessary else
if (IS_SERVER) { | ||
return store | ||
} | ||
window.store = store |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Suggest to rename to REDUX_STORE by symmetry with APOLLO_CLIENT
Thanks for the extra feedback @sedubois. I've just pushed up your suggestions. |
function PostList (props) { | ||
const { data: { allPosts, loading, _allPostsMeta }, loadMorePosts } = props | ||
if (loading) { | ||
if (props.data.loading) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I meant the opposite: function( { data: { allPosts, loading, _allPostsMeta }, loadMorePosts } ) { ...
But anyway nothing critical
@@ -0,0 +1,2 @@ | |||
export const IS_SERVER = typeof window === 'undefined' | |||
export const IS_BROWSER = !IS_SERVER |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actually as shown in https://github.com/possibilities/next-with-auth, you can simplify just using process.browser
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice
Yep LGTM now 👌 |
Great work Guys 👍🏻🙌🏻 |
🎉 🎉 woohoo! |
This is awesome! Thanks for the great example @ads1018 🙏 |
if (!process.browser) { | ||
const app = ( | ||
<ApolloProvider client={client} store={store}> | ||
<Component url={{ query: ctx.query, pathname: ctx.pathname }} /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Component
potentially has a getInitialProps
, I think it should be conditionally called and its result injected in here and also returned below at line 24.
As I did in my app: https://github.com/relatenow/relate/blob/77927a28adb5a8b22071cce6040c21917a9178ae/hocs/withData.js#L32
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Good spot @sedubois. I just pushed this up to my fork. I inlined the conditional rather then create a new util file. You can check it out here: adamsoffer@30de697
I can create another pull request for this.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
yes lgtm 👍
* chore(package): update babel-preset-env to version 1.1.5 (#660) * chore(package): update webpack-hot-middleware to version 2.15.0 (#654) * chore(package): update gulp-jest to version 1.0.0 (#653) * Prevent prefetcher from making identical requests. (#665) * example using inferno v1.0.* (#663) * example using inferno v1.0.* * fix name. * Handle errors of React lifecycle methods (#661) * handle errors of lifecycle methods * handle errors of render method * set output.strictModuleExceptionHandling option (#655) * fix HMR for dynamic entries (#652) * Fix Improve "pages/ not found error" (#624) * fix not found error * add comment * Added layout component example (#560) * added layout component example * coding style fixes * trailing spaces removed * updated README file * added layout example in docs * moved .babelrc so that it handles all projects from the examples folder * Release 2.0.0-beta.14 * bump styled-jsx * Release 2.0.0-beta.15 * Adds mobx example (#676) * Adds mobx example * Fix coding style to match JS Standard * Removes unecessary link * Update README.md * Update README.md * Change next version from beta to ^2.0.0-beta * Assigns the store to a local var * Adds navigation in the example * Removes unecessary imports * Fix coding style to match JS Standard * Fix Clock import * bypass SSE on Service Worker (#681) * fix HMR (#680) * Release 2.0.0-beta.16 * Update README.md (#687) * chore(package): update babel-preset-env to version 1.1.6 (#685) * chore(package): update react to version 15.4.2 (#683) * chore(package): update react-dom to version 15.4.2 (#682) * hot-reloader: return when rejected (#689) * resolve react-dom/server (#688) * Routing on the client with Redux (#691) * Routing on the client with Redux * Removing unused import * Fix link (#701) * chore(package): update styled-jsx to version 0.4.1 (#700) * Add correct content-type header for gzipped version. (#705) * Add case sensitive checks for imports and JSON page resolver (#697) * Add case-sensitive-paths-webpack-plugin plugin. * Add case-sensitive check for server/resolve. * Check the existence of the gzipped path explicitly (#704) * Check the existance of the gzipped path explicitely. * Fix a typo in the comments. * Fix a typo. * Use next.js beta for example (#710) * Add custom server example using Hapi (#712) * Fix title of README (#720) * Adding polyfill to Headers.getAll to make it work both with the current and past spec. (#723) * chore(package): update babel-preset-env to version 1.1.8 (#726) * adding @timneutkens * Add warning when running start without build (#736) * add warning when running start without build * run build before start * Revert "run build before start" This reverts commit 171b544. * exit code & dir * dont update yarn.lock * use existsSync * Add some style changes. * Implement "Immutable build artifacts" feature (#745) * Write BUILD_ID when building. It's a random id (uuid.v4()) * Add buildId to the core JS files. * Add immutable cache-control header. Only if the buildId is matched. * Set '-' as the dev buildId always. * Add buildId handling for JSON pages. * Remove default next pages compilation from the main babel-loader. (#731) * Remove default next pages compilation from the main babel-loader. This will fix the issue when the user ignore node_modules via our .babelrc option. * Change babel-loaders 'query' to 'options'. That's what's supported/recommended in webpack 2 * Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR * remove unused module alias * New test setup (#640) * Use jest-cli instead of gulp plugin. * Use jest-cli instead of gulp plugin. * Move fixtures into the examples dir. * Move test code of example app to the basic example. * Add isolated tests for server/resolve * Allow tests to use cheerio. * Use portfinder to get a unique port. * Move back integration tests into the example dir. * Introduce next-test-utils. * Remove gulp-jest * Add coveralls support. * Use transpiled version of code in dist. This is to make sure same file gets covered by both unit/isolated tests and integration tests. * Add support for source maps. * Use code from dist always. * Use nyc to stop instrument. * Add integration test suite for production usage. * Use jest-cli. * Add support for running e2e tests. * Check gzipPath with fs.stat before serving Otherwise, serve package might throw issues other than ENOENT * Install chromedriver with npm install. * Install chrome on travis-ci. * Add --forceExit to Jest. * Run tests only on Node v6. That's because selenium-webdriver only supports Node 6 LTS. * Use chromedriver NPM module to install chromedriver. * Use wd as the webdriver client. * Run chromedriver before tests. * Run travis for both node 4 and 6 * Remove unwanted npm install script. * Move some common text utilities to next-test-utils * Add lint checks and testing in npm prepublish hook. * Use npm on travis-ci. We are having some caching issues with yarn and chromedriver. * Make tests work on windows.\n But chromedriver doesn't work. * Clean up dependencies. * Run chromedriver in background without any tools. * Fix a typo in the code. * Use ES6 features used in node4 inside the gulpfile. * Add some comments. * Add support for running in windows. * Stop chromedriver properly on windows. * Fix typos. * Fix handling http methods (#748) * support HEAD method * respond with 501 if method is not GET or HEAD * Use dynamic entry feature of webpack (#750) * update webpack version and use dynamic entry feature of it * fix typo * bump the test timeout for macbook 12 users :D * Release 2.0.0-beta.17 * Dont' override glamor methods, use a new object instead (#754) * Revert "Dont' override glamor methods, use a new object instead (#754)" (#755) This reverts commit 8651662. * Use the preact-compat dist version. (#760) * Only show deprecation when using next/css (#762) * update styletron example to support multiple stylesheets (#763) * example: fix style * Fix typo for --help messages in /bin (#770) * chore(package): update mime-types to version 2.1.14 (#772) * Add correct sync version of error handling with existSync. (#769) * Add correct sync version of error handling with existSync. * Update utils.js * chore(package): update source-map-support to version 0.4.9 (#777) * Add cross browser stacktrace (#776) * Add cross browser stacktrace * Remove unused stack variable * Use UTC time to avoid time differences (#782) * chore(package): update styled-jsx to version 0.4.2 (#784) * Set default NODE_ENV value. (#768) * chore(package): update friendly-errors-webpack-plugin to version 1.1.3 (#783) * Add styled-jsx-postcss example (#781) * Add styled-jsx-postcss example * Remove commented code * Add NODE_PATH support for resolveLoaders as well. (#778) * Add NODE_PATH support for resolveLoaders as well. * Remove unwanted code. * bump webpack * Fix typo in README (#787) * Add dynamic routing keyword (#788) I was looking for "dynamic routing" in the examples and didn't find it because that keyword isn't used. * chore(package): update styled-jsx to version 0.4.3 (#792) * Remove useless config override (#790) * Fixed hapi example (#795) * Added deprecation message when adding an extra anchor in behalf of the user. (#797) * Fix link (#789) * Fix link * Fix links * Updated <Link> in repo, always wrapping an anchor. (#798) * Update README.md (#802) fix quotation mark * chore(package): update glamor to version 2.20.22 (#804) * Added Koa example (#800) * Added Koa example * Linted koa example * chore(package): update source-map-support to version 0.4.10 (#809) * Fix koa-404 issue by adding res.statusCode to 200 (#815) * chore(package): update styled-jsx to version 0.4.4 (#817) * fix not to overwrite the ignored option on Windows (#824) * added example with flow (#814) * added example with flow * Fixed linting errors * Custom server example with Hapi in README (#825) * Move nextdata into nextScript and make Main return a single el (#831) * chore(package): update babel-core to version 6.22.1 (#842) * chore(package): update babel-runtime to version 6.22.0 (#840) * chore(package): update babel-preset-react to version 6.22.0 (#839) * chore(package): update babel-preset-es2015 to version 6.22.0 (#838) * chore(package): update babel-plugin-transform-runtime to version 6.22.0 (#837) * chore(package): update babel-plugin-transform-object-rest-spread to version 6.22.0 (#836) * chore(package): update babel-plugin-transform-class-properties to version 6.22.0 (#835) * chore(package): update babel-plugin-transform-async-to-generator to version 6.22.0 (#834) * chore(package): update babel-generator to version 6.22.0 (#833) * Make sure lastAppProps always have some value. (#829) * Make sure lastAppProps always have some value. * Revert "Make sure lastAppProps always have some value." This reverts commit b4ae722. * Throw an error, if we found an empty object from getInitialProps. * Add proper tests for getInitialProps empty check. * chore(package): update styled-jsx to version 0.4.5 (#847) * bump `styled-jsx` * Release 2.0.0-beta.18 * Use ErrorDebug component on error of react-hot-loader (#852) * use ErrorDebug component for reporter of react-hot-loader * app: fix props of ErrorDebug * Update styled-component docs (#841) * Add details to custom Document documentation Custom document must be created at ./Pages/_document.js, which is not noted in the README… so I updated it. * Add note to styled-components example about existing issue * Made phrasing a bit more clear * Another phrasing update. * from P to p * chore(package): update husky to version 0.13.0 (#853) * Fix error fonts (#826) * add "consolas" font for windows * fix too small font size in non-retina display * tweak font sizes again 🙈 * Add Apollo example (#780) * Add minimal apollo example * Update apollo example README * Update apollo example demo link in README * Fix button styles * Fix show more button * Alias demo url * Include the data field on the Apollo store when hydrating * Revert * Include the data field on the Apollo store when hydrating per tpreusse's suggestion. * Add example to faq section in README * Sort by newest; Add active state to buttons * Make optimization suggestions * Use process.browser; inline props * Wrap render method created using class properties (2) (#856) * wrap render method created using class properties * use Boolean instead of double not-operator * patch-react: move a comment * chore(package): update husky to version 0.13.1 (#862) * Example using Fela (#863) * added example using fela * update package-json * removed nested routing test * fixed linting issues * fixed typo * simpler flow task (#857) * Added Google AMP example (#793) * Added Google AMP example * Added styles and a second page * Using regular anchor since there is no client-side routing * Added comment on react config for amp * Added Fela Example to the CSS-in-JS <details> in README (#878) * fix(package): update styled-jsx to version 0.5.1 (#879) https://greenkeeper.io/ * Handles the initial popstate event of older version of Safari. (#870) * Update Apollo Example (#888) * Add minimal apollo example * Update apollo example README * Update apollo example demo link in README * Fix button styles * Fix show more button * Alias demo url * Include the data field on the Apollo store when hydrating * Revert * Include the data field on the Apollo store when hydrating per tpreusse's suggestion. * Add example to faq section in README * Sort by newest; Add active state to buttons * Make optimization suggestions * Use process.browser; inline props * Pass wrapped component's initial props into component heirarchy if they exist * Don't process.exit(null) when e.g build is `SIGKILL`ed (#887) * update yarn.lock * Release 2.0.0-beta.19 * Fix handling finished response (#889) * allows to not return props if response is already finished on getInitialProps * check res.finished after getInitialProps call of Document * Add `next build` and `next start` to the first How to use sample (#894) * Update README.md (#895) Just adding download instructions * Fix Apollo Example (#900) * Add minimal apollo example * Update apollo example README * Update apollo example demo link in README * Fix button styles * Fix show more button * Alias demo url * Include the data field on the Apollo store when hydrating * Revert * Include the data field on the Apollo store when hydrating per tpreusse's suggestion. * Add example to faq section in README * Sort by newest; Add active state to buttons * Make optimization suggestions * Use process.browser; inline props * Pass wrapped component's initial props into component heirarchy if they exist * Remove unnecessary sorting of array * fix(package): update styled-jsx to version 0.5.2 (#902) https://greenkeeper.io/ * Release 2.0.0-beta.20 * chore(package): update gulp-notify to version 3.0.0 (#905) https://greenkeeper.io/ * fix(package): update source-map-support to version 0.4.11 (#901) https://greenkeeper.io/ * chore(package): update wd to version 1.1.3 (#906) https://greenkeeper.io/ * examples/with-redux: remove global store (#908) This patch removes the global `store` on the client. IMO this example should avoid polluting the global namespace with simple scoping tricks can solve the problem equally as well. * Do not patch prototypes with render exposed only as a getter. (#898) * Do not patch prototypes with render exposed only as a getter. * Use Object.getOwnPropertyDescriptor to make things simpler. * Get the prototype which has the render method. * with-apollo: Don't store Redux store and Apollo client in global namespace (#909) * Add yarn lockfile * Avoid storing Redux store and Apollo client in global namespace + don't create Apollo client when already existing in browser * Remove yarn.lock from examples (#912) * Remove yarn.lock from examples * Add yarn.lock to gitignore for examples * Move yarn ignore to examples directory * README: fix "Routing with lazy component loading" blob (#915) Looks like `<Link>` was replaced with `\n` on accident * fix typo (#916) * fix(package): update webpack-hot-middleware to version 2.16.0 (#922) https://greenkeeper.io/ * Use service-worker to fetch only JSON pages. (#924) * Use service-worker to fetch only JSON pages. We simply don't need to proxy other requests through that. That's might cause some latency issues. * Use a better regexp to identify JSON pages. * fix(package): update webpack-hot-middleware to version 2.16.1 (#935) https://greenkeeper.io/ * [WIP] Remember scroll position on error (#911) * Remember scroll position on error * Added comment + check if lastScroll was set * Remove check for lastAppProps * Use events to make scroll persistence dev-only * Return EventEmitter from next() * Update next-dev.js * fix(package): update webpack to version 2.2.1 (#938) https://greenkeeper.io/ * Add support for Webpack 2's tree-shaking (#926) * Let webpack2 to handle ES2015 module system Since Node.js can't do that, we need to transpile ES2015 module system in the emit-file-loader. * Use sourceMaps only in dev. * Introduce a transform option to emit-file-loader So, we can move our ES2015 transpile code with that option. * Remove unwanted argument options. * Update comments. * Use dev flag instead of NODE_ENV * Set dev variable consistent with examples (#939) * Fix .json import issue (#944) * Fix .json import error This is a regression we've added by #926 (tree-shaking-support) * Add a test case. * add pretty message if port already in use(#927) (#932) * add pretty message if port already use(#927) * fix console async nature * fix linter * clean callbacks code * Check package.json for the startup script * fix path to package * omit callback * remove extra check, code execute in try block * + reason for change start listen port of node http * remove extra code for search package * fix(package): update webpack-dev-middleware to version 1.10.0 (#948) https://greenkeeper.io/ * Resolve preset es2015 from next directory (#949) * Resolve styled-jsx/style when transpiling ES2015 modules. (#953) * Allow parsed url to be passed down (#950) * Allow parsed url to be passed down * Update example to reflect url passing * Check if passed url.query is empty * Rename url to parsedUrl * Added React-MD example (#940) * fix(package): update styled-jsx to version 0.5.3 (#958) https://greenkeeper.io/ * Fix typo in react-md example readme (#959) * Release 2.0.0-beta.21 * examples/with-react-md: Fixed "Cannot read property 'focus' of undefined" (#961) * Resolve all modules through module resolver (#963) * Check if BUILD_ID is available before starting (#960) * Check if BUILD_ID is available before starting * Leave whitespace at end of file * Release 2.0.0-beta.22 * Find custom babel config location properly. (#969) * Find custom babel config location properly. Earlier we simply check for the .bablerc file in the dir. But the actual logic is much complex. Now we are using the babel's actual logic to find the custom config location. * Fix failing tests. * Add styled-jsx to babel plugins (#970) * Resolve all modules through module resolver * Add styled-jsx back * Improve babel settings (#976) * fix babelrc settings * use only transform-es2015-modules-commonjs for transpiling emitting files * Allow any element to be rendered under Link (#921) * Allow any element to be rendered under Link * Use Children.only instead of Children.map * Remove check for multiple children since we already throw at 2+ * Clean up variables * Release 2.0.0-beta.23 * Added universal configuration example (#991) * Added universal configuration example * Make example more clear * Properly handle hash URL changes. (#996) * Properly handle hash URL changes. * Make sure we replace origin correctly. * Get rid of RegExp for getUrl(). * Add next.js flowtype definition to with-flow example (#973) * Add next.js flowtype definition to with-flow * Add render api types for flow * Add prefetch types * Fix push/replace api types to promise * [example] Progressive rendered application (#998) * [add] example of a progressive rendered app * [update] remove extra blank line * [update] fix typo * [update] more use cases * [update] example link * Update README.md * [update] next.js dependency version * [update] fix readme typos * fix(package): update styled-jsx to version 0.5.4 (#1002) https://greenkeeper.io/ * Pass parsed request-URL into the run-method (#1000) * fix(package): update babel-plugin-module-resolver to version 2.5.0 (#1005) https://greenkeeper.io/ * chore(package): update coveralls to version 2.11.16 (#1007) https://greenkeeper.io/ * Add contributing.md (#1009) * Add contributing.md * Only reload example app on server changes * Release 2.0.0-beta.24 * Update Apollo example (#1021) * Add minimal apollo example * Update apollo example README * Update apollo example demo link in README * Fix button styles * Fix show more button * Alias demo url * Include the data field on the Apollo store when hydrating * Revert * Include the data field on the Apollo store when hydrating per tpreusse's suggestion. * Add example to faq section in README * Sort by newest; Add active state to buttons * Make optimization suggestions * Use process.browser; inline props * Pass wrapped component's initial props into component heirarchy if they exist * Remove unnecessary sorting of array * Update Apollo example * Remove trailing comma * Update reduxRootKey * Remove unnecessary babelrc
did anyone try changing the |
This is a minimalist Apollo example; wrap pages with a higher-order component called
withData
and voilà.I put files related to this HOC inside a directory called
lib
. Side note - @sedubois had some food for thought; he pointed out thatwithData
could be made into an npm lib. For example,Demo can be found here