pure components for inner index files

Author: leebyron

site/blog/index.html.js

@@ -13,28 +13,19 @@ var Marked = require('../_core/Marked');
 var BlogSidebar = require('../_core/BlogSidebar');
 var BlogPost = require('../_core/BlogPost');
 
-var BlogIndex = React.createClass({
-  render: function() {
-    var page = this.props.page;
-    var site = this.props.site;
-    var posts = site.files.blog
-      .filter(file => !file.draft && path.extname(file.relPath) === '.md')
-      .sort((a, b) => a.date < b.date);
-    return (
-      <Site section="blog" title="Blog">
-        <section>
-          <div className="documentationContent">
-            <div>
-            {posts.map(post =>
+export default ({ page, site }) =>
+  <Site section="blog" title="Blog">
+    <section>
+      <div className="documentationContent">
+        <div>
+          {site.files.blog
+            .filter(file => !file.draft && path.extname(file.relPath) === '.md')
+            .sort((a, b) => a.date < b.date)
+            .map(post =>
               <BlogPost post={post} isPermalink={false} key={post.permalink} />
-            )}
-            </div>
-            <BlogSidebar site={site} />
-          </div>
-        </section>
-      </Site>
-    );
-  }
-});
-
-module.exports = BlogIndex;
+          )}
+        </div>
+        <BlogSidebar site={site} />
+      </div>
+    </section>
+  </Site>

site/code/index.html.js

@@ -10,18 +10,14 @@ var React = require('react');
 var Site = require('../_core/Site');
 var Marked = require('../_core/Marked');
 
-var Code = React.createClass({
-  render: function() {
-    var page = this.props.page;
-    var site = this.props.site;
-    return (
-      <Site section="code" title="Code" page={page}>
-
-        <section>
-          <div className="documentationContent">
-            <div className="inner-content">
-              <h1>Code</h1>
-              <Marked>{`
+export default ({ page, site }) =>
+  <Site section="code" title="Code" page={page}>
+
+    <section>
+      <div className="documentationContent">
+        <div className="inner-content">
+          <h1>Code</h1>
+          <Marked>{`
 
 Many different programming languages support GraphQL. This list contains some of the more popular server-side frameworks, client libraries, and other useful stuff.
 
@@ -333,15 +329,10 @@ Code that executes a hello world GraphQL query with \`graphql-clj\`:
 
   - [awesome-graphql](https://github.com/chentsulin/awesome-graphql): A fantastic community maintained collection of libraries, resources, and more.
 
-              `}</Marked>
-
-            </div>
-          </div>
-        </section>
+          `}</Marked>
 
-      </Site>
-    );
-  }
-});
+        </div>
+      </div>
+    </section>
 
-module.exports = Code;
+  </Site>