Update with-apollo example (#1394)

* 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

* Update with-apollo example

- Remove use of deprecated 'reduxRootKey' option
- Add loading indicator inside pagination button

examples/with-apollo/components/PostList.js

@@ -4,12 +4,8 @@ import PostUpvoter from './PostUpvoter'
 const POSTS_PER_PAGE = 10
 
 function PostList ({ data: { allPosts, loading, _allPostsMeta }, loadMorePosts }) {
-  if (loading) {
-    return <div>Loading</div>
-  }
-
+  if (allPosts && allPosts.length) {
     const areMorePosts = allPosts.length < _allPostsMeta.count
-
     return (
       <section>
         <ul>
@@ -23,7 +19,7 @@ function PostList ({ data: { allPosts, loading, _allPostsMeta }, loadMorePosts }
             </li>
           )}
         </ul>
-      {areMorePosts ? <button onClick={() => loadMorePosts()}><span />Show More</button> : ''}
+        {areMorePosts ? <button onClick={() => loadMorePosts()}> {loading ? 'Loading...' : 'Show More'} </button> : ''}
         <style jsx>{`
           section {
             padding-bottom: 20px;
@@ -58,11 +54,14 @@ function PostList ({ data: { allPosts, loading, _allPostsMeta }, loadMorePosts }
             border-color: #ffffff transparent transparent transparent;
             content: "";
             height: 0;
+            margin-right: 5px;
             width: 0;
           }
         `}</style>
       </section>
     )
+  }
+  return <div>Loading</div>
 }
 
 const allPosts = gql`

examples/with-apollo/lib/withData.js

@@ -26,10 +26,11 @@ export default (Component) => (
       }
 
       const state = store.getState()
+
       return {
         initialState: {
           ...state,
-          [client.reduxRootKey]: {
+          apollo: {
             data: client.getInitialState().data
           }
         },