js -> jsx

gatsby-config.js

@@ -9,7 +9,10 @@ module.exports = {
     {
       resolve: 'gatsby-plugin-sass',
       options: {
-        includePaths: [`${__dirname}/node_modules`, `${__dirname}/src/styles`],
+        includePaths: [
+          `${__dirname}/node_modules`,
+          `${__dirname}/src/styles`
+        ],
       },
     },
     {

gatsby-node.js

@@ -4,7 +4,7 @@ exports.createPages = ({ boundActionCreators, graphql }) => {
   const { createPage } = boundActionCreators
 
   return new Promise((resolve, reject) => {
-    const template = path.resolve('src/templates/Project.js')
+    const template = path.resolve('src/templates/Project.jsx')
 
     resolve(graphql(`
         {

package.json

@@ -3,12 +3,12 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "lint:js": "eslint ./gatsby-*.js && eslint ./src/**/*.js",
+    "lint:js": "eslint ./gatsby-*.{js,jsx} && eslint ./src/**/*.{js,jsx}",
-    "lint:css": "stylelint ./src/**/*.scss",
+    "lint:css": "stylelint ./src/**/*.{css,scss}",
     "lint": "npm run lint:js && npm run lint:css",
     "build": "gatsby build",
     "start": "gatsby develop",
-    "format": "prettier --write 'src/**/*.js'",
+    "format": "prettier --write 'src/**/*.{js,jsx}'",
     "test": "npm run lint",
     "deploy": "./deploy.sh"
   },

src/components/molecules/Availability.jsx

@@ -24,7 +24,11 @@ class Availability extends Component {
         return e
       }
 
-      window.addEventListener('scroll', this.handleScroll, supportsPassive ? { passive: true } : false)
+      window.addEventListener(
+        'scroll',
+        this.handleScroll,
+        supportsPassive ? { passive: true } : false
+      )
     }
   }
 
@@ -61,9 +65,7 @@ class Availability extends Component {
           <MoveIn>
             <aside
               className={
-                status
+                status ? 'availability available' : 'availability unavailable'
-                  ? 'availability available'
-                  : 'availability unavailable'
               }
             >
               <p

src/components/organisms/Header.jsx

@@ -23,7 +23,10 @@ const Header = ({ meta, isHomepage }) => {
       </FadeIn>
 
       <Social meta={meta} hide={!isHomepage} />
-      <Availability meta={meta} hide={!isHomepage && !meta.availability.status} />
+      <Availability
+        meta={meta}
+        hide={!isHomepage && !meta.availability.status}
+      />
     </header>
   )
 }

src/pages/404.js

@@ -1,7 +0,0 @@
-import React from 'react'
-
-const NotFound = () => (
-  <h1>Shenanigans, page not found.</h1>
-)
-
-export default NotFound

src/pages/404.jsx

@@ -0,0 +1,5 @@
+import React from 'react'
+
+const NotFound = () => <h1>Shenanigans, page not found.</h1>
+
+export default NotFound

src/pages/index.jsx

@@ -2,9 +2,7 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import Projects from '../components/organisms/Projects'
 
-const Home = ({ data }) => (
+const Home = ({ data }) => <Projects data={data} />
-  <Projects data={data} />
-)
 
 Home.propTypes = {
   data: PropTypes.object,