From 222ab374d53a206332b1ab51c7c43f6d5dc7a31e Mon Sep 17 00:00:00 2001
From: Wes Bos <wesbos@gmail.com>
Date: Tue, 8 Aug 2017 22:09:05 -0400
Subject: yep

---
 components/Count.js | 37 +++++++++++++++++++++++++++++++++++++
 1 file changed, 37 insertions(+)
 create mode 100644 components/Count.js

(limited to 'components/Count.js')

diff --git a/components/Count.js b/components/Count.js
new file mode 100644
index 0000000..800a902
--- /dev/null
+++ b/components/Count.js
@@ -0,0 +1,37 @@
+import React, { Component } from 'react'
+import { graphql, gql } from 'react-apollo'
+
+import { ALL_ITEMS_QUERY } from '../queries';
+
+class Count extends Component {
+
+  render() {
+
+    // 1
+    if (this.props.allLinksQuery && this.props.allLinksQuery.loading) {
+      return <div>Loading</div>
+    }
+
+    // 2
+    if (this.props.allLinksQuery && this.props.allLinksQuery.error) {
+      return <div>Error</div>
+    }
+
+    // 3
+    const itemsToRender = this.props.allLinksQuery.allItems
+
+    return (
+      <div>
+        <h1>There are {itemsToRender.length} items for sale</h1>
+      </div>
+    )
+  }
+
+}
+
+// 1
+
+// We export the graphQL HOC - this will fetch the data and inject it into the Count compeont via props
+
+export { ALL_ITEMS_QUERY }
+export default graphql(ALL_ITEMS_QUERY, { name: 'allLinksQuery' }) (Count)
-- 
cgit v1.3