Merge branch '2.3-end-queries-v2.1' into 3.2-start-mutations-v2.1

Author: Carlos Rufo Jimenez

server/src/index.js

@@ -21,9 +21,9 @@ const server = new GraphQLServer({
       typeDefs: 'src/generated/prisma.graphql',
       endpoint: '__PRISMA_ENDPOINT__',
       secret: 'mysecret123',
-      debug: true
-    })
-  })
+      debug: true,
+    }),
+  }),
 })
 
 server.start(() => console.log('Server is running on http://localhost:4000'))

src/components/App.js

@@ -1,10 +1,4 @@
-import React, { Component } from 'react'
+import React from 'react'
 import LinkList from './LinkList'
 
-class App extends Component {
-  render() {
-    return <LinkList />
-  }
-}
-
-export default App
+export default () => <LinkList />

src/components/Link.js

@@ -1,19 +1,7 @@
-import React, { Component } from 'react'
+import React from 'react'
 
-class Link extends Component {
-  render() {
-    return (
-      <div>
-        <div>
-          {this.props.link.description} ({this.props.link.url})
-        </div>
-      </div>
-    )
-  }
-
-  _voteForLink = async () => {
-    // ... you'll implement this in chapter 6
-  }
-}
-
-export default Link
+export default ({ link }) => (
+  <div>
+    {link.description} ({link.url})
+  </div>
+)

src/components/LinkList.js

@@ -1,12 +1,10 @@
-import React, { Component } from 'react'
+import React from 'react'
 import Link from './Link'
 import { Query } from 'react-apollo'
 import gql from 'graphql-tag'
 
-// 1
 const FEED_QUERY = gql`
-  # 2
-  query FeedQuery {
+  {
     feed {
       links {
         id
@@ -16,24 +14,36 @@ const FEED_QUERY = gql`
       }
     }
   }
-`;
+`
+
+export default () => {
+  const linksToRender = [
+    {
+      id: '1',
+      description: 'Prisma turns your database into a GraphQL API 😎',
+      url: 'https://www.prismagraphql.com'
+    },
+    {
+      id: '2',
+      description: 'The best GraphQL client',
+      url: 'https://www.apollographql.com/docs/react/'
+    }
+  ]
+
+  return (
+    <Query query={FEED_QUERY}>
+      {({ loading, error, data }) => {
+        if (loading) return <div>Fetching</div>
+        if (error) return <div>Error</div>
+
+        const linksToRender = data.feed.links
 
-class LinkList extends Component {
-    render() {
         return (
-            <Query query={FEED_QUERY}>
-                {(result) => {
-                    if (result.loading) return <div>Loading</div>;
-                    if (result.error) return <div>Error</div>;
-                    
-                    const { data } = result;
-                    const linksToRender = data.feed.links;
-                    
-                    return <div>{linksToRender.map(link => <Link key={link.id} link={link} />)}</div>;
-                }}
-            </Query>
+          <div>
+            {linksToRender.map(link => <Link key={link.id} link={link} />)}
+          </div>
         )
-    }
+      }}
+    </Query>
+  )
 }
-
-export default LinkList;