fix(general): update code for eslint conformance

.babelrc

@@ -1,4 +1,4 @@
 {
-  "presets": ['react', 'es2015', 'stage-0'],
-  "plugins": ['add-module-exports']
+  "presets": ["react", "es2015", "stage-0"],
+  "plugins": ["add-module-exports"]
 }

.eslintrc

@@ -1,20 +1,38 @@
 {
   "extends": "eslint-config-airbnb",
   "rules": {
-    "indent": [2, 2, {"SwitchCase": 1}],
+    "indent": [1, 4, {"SwitchCase": 1}],
     "no-console": [0],
     "func-names": [0],
-    "semi": [2, "never"],
-    "no-extra-semi": [2],
-    "space-before-function-paren": [2, "always"],
+    "semi": [0],
+    "no-extra-semi": [1],
+    "space-before-function-paren": [0],
     "no-else-return": [0],
     "space-infix-ops": [0],
     "react/prefer-es6-class": [0],
     "react/prefer-stateless-function": [0],
     "import/no-unresolved": [0],
     "global-require": [0],
+    "import/no-extraneous-dependencies": [0],
+    "no-unused-vars": [1],
+    "max-len": [1],
+    "jsx-quotes": [1],
+    "jsx-a11y/img-has-alt": [1],
+    "jsx-a11y/img-redundant-alt": [1],
+    "comma-dangle": [1],
+    "react/jsx-closing-bracket-location": [0],
+    "eqeqeq": [0],
+    "react/jsx-indent": [1],
+    "quotes": [1],
+    "react/jsx-curly-spacing": [1],
+    "no-use-before-define": [0]
   },
-  "globals": {
-    "__PREFIX_LINKS__": true,
+  "parserOptions": {
+    "ecmaFeatures": {
+      "experimentalObjectRestSpread": true
+    }
   },
+  "globals": {
+    "__PREFIX_LINKS__": true
+  }
 }

.gitignore

@@ -6,5 +6,6 @@ pages/.manifest
 .idea
 gatsby-starter-lumen.iml
 .vscode/
+public
 
 npm-debug.log

.vscode/launch.json

@@ -4,15 +4,6 @@
     // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
     "version": "0.2.0",
     "configurations": [
-        {
-            "type": "node",
-            "request": "launch",
-            "name": "Develop",
-            "program": "${workspaceRoot}/node_modules/gatsby/bin/gatsby.js",
-            "cwd": "${workspaceRoot}",
-            "args": ["develop"],
-            "sourceMaps": true
-        },
         {
             "type": "node",
             "request": "launch",
@@ -22,15 +13,6 @@
             "args": ["build"],
             "sourceMaps": true
         },
-        {
-            "type": "node",
-            "request": "launch",
-            "name": "Serve Public",
-            "program": "${workspaceRoot}/node_modules/gatsby/bin/gatsby.js",
-            "cwd": "${workspaceRoot}",
-            "args": ["serve-build"],
-            "sourceMaps": true
-        },
         {
             "type": "node",
             "request": "attach",

components/ComposePage/index.jsx

@@ -1,36 +1,32 @@
-import React from 'react'
-import DocumentTitle from 'react-document-title'
-import { RouteHandler, Link } from 'react-router'
-import SiteSidebar from '../SiteSidebar'
-import { config } from 'config'
-import { rawDefaultEditorContent } from '../Editor/defaultEditorContent'
-import { ContentState, convertToRaw } from 'draft-js'
-import GitHubForm from '../Forms/GitHubForm'
-import MyEditor from '../Editor'
+import React from 'react';
+import SiteSidebar from '../SiteSidebar';
+import { rawDefaultEditorContent } from '../Editor/defaultEditorContent';
+import GitHubForm from '../Forms/GitHubForm';
+import MyEditor from '../Editor';
 
 export default class ComposePage extends React.Component {
-  constructor () {
-    super()
-    this.state = {editorContent: rawDefaultEditorContent};
-  }
-
-  render () {
-    const passEditorContent = (editorContent) => {// https://www.youtube.com/watch?v=5Xew--ycx0o&list=PL55RiY5tL51oyA8euSROLjMFZbXaV7skS&index=4#t=165.980087
-      console.log('editorContent in ComposePage:', editorContent)
-      this.setState({editorContent: editorContent})
+    constructor () {
+        super();
+        this.state = { editorContent: rawDefaultEditorContent };
     }
-    return (
-      <div>
-        <SiteSidebar {...this.props}/>
-        <div className='content'>
-          <div className='main'>
-            <div className='main-inner'>
-              <MyEditor editorContent={this.state.editorContent}/>
-              <GitHubForm passContent={passEditorContent.bind(this)}/>
+
+    render () {
+        const passEditorContent = (editorContent) => { // https://www.youtube.com/watch?v=5Xew--ycx0o&list=PL55RiY5tL51oyA8euSROLjMFZbXaV7skS&index=4#t=165.980087
+            console.log('editorContent in ComposePage:', editorContent);
+            this.setState({ editorContent });
+        }
+        return (
+          <div>
+            <SiteSidebar {...this.props} />
+            <div className="content">
+              <div className="main">
+                <div className="main-inner">
+                  <MyEditor editorContent={this.state.editorContent} />
+                  <GitHubForm passContent={passEditorContent} />
+                </div>
+              </div>
             </div>
           </div>
-        </div>
-      </div>
-    );
-  }
-}
+        );
+    }
+}

components/Editor/Index.jsx

@@ -1,69 +1,81 @@
-import React from 'react'
-import { RouteHandler, Link } from 'react-router'
-import DocumentTitle from 'react-document-title'
-import { EditorState, ContentState, convertFromRaw, convertToRaw, convertFromHTML} from 'draft-js'
-import { Editor, createEditorState} from 'medium-draft'
-import 'medium-draft/lib/index.css'
-import './style.css'
+import React from 'react';
+import { EditorState, convertFromRaw, convertToRaw } from 'draft-js';
+import { Editor } from 'medium-draft';
+import 'medium-draft/lib/index.css';
+import './style.css';
 
 export default class MyEditor extends React.Component {
-  constructor(props) {
-    super(props);
-
-    const state = EditorState.createWithContent(convertFromRaw(this.props.editorContent));
-    this.state = {editorState: state};
-
-    this.onChange = (editorState) => {
-      this.setState({editorState: editorState});
-      const rawEditorContent = JSON.stringify(convertToRaw(this.state.editorState.getCurrentContent()));
-      localStorage.setItem('rawEditorContent',rawEditorContent);
-      this.logData();
+    constructor(props) {
+        super(props);
+
+        this.propTypes = {
+            editorContent: React.PropTypes.any,
+        };
+
+        const state = EditorState.createWithContent(convertFromRaw(this.props.editorContent));
+        this.state = { editorState: state };
+
+        this.onChange = (editorState) => {
+            this.setState({ editorState });
+            const rawEditorContent = JSON
+                .stringify(convertToRaw(this.state.editorState.getCurrentContent()));
+            localStorage.setItem('rawEditorContent', rawEditorContent);
+            this.logData();
+        };
+
+        this.logData = this.logData.bind(this);
+    }
+
+    componentDidMount() {
+        // this.refs.editor.focus();
+    }
+
+    componentWillReceiveProps(props) {
+        console.log('props:', props);
+        const editorStateFromPassedProps = EditorState
+            .createWithContent(convertFromRaw(props.editorContent));
+        console.log('editorStateFromPassedProps:', editorStateFromPassedProps);
+        this.setState({ editorState: editorStateFromPassedProps });
     }
 
-    this.logData = this.logData.bind(this);
-  }
-
-  componentWillReceiveProps(props) {
-    console.log('props:', props)
-    const editorStateFromPassedProps = EditorState.createWithContent(convertFromRaw(props.editorContent));
-    console.log('editorStateFromPassedProps:', editorStateFromPassedProps)
-    this.setState({editorState: editorStateFromPassedProps})
-  }
-
-  componentDidMount() {
-    // this.refs.editor.focus();
-  }
-
-  logData() {
-    console.group("Current Data:");
-    console.info("selection:", this.state.editorState.getSelection().toJS());
-    console.info("editor content - object:", this.state.editorState.getCurrentContent().toJS());
-    console.info("editor content - raw:", JSON.stringify(convertToRaw(this.state.editorState.getCurrentContent())));
-    console.groupEnd()
-    // window.ga('send', 'event', 'draftjs', 'log-data');
-  }
-
-  render() {
-    return (
-      <div id="content">  
-        <div className="editor">
-          <Editor ref="editor" editorState={this.state.editorState} onChange={this.onChange}/>
-        </div>
-      </div>
-    );
-  }
+    logData() {
+        console.group('Current Data:');
+        console.info('selection:', this.state.editorState.getSelection().toJS());
+        console.info('editor content - object:', this.state.editorState.getCurrentContent().toJS());
+        console.info('editor content - raw:',
+                     JSON.stringify(convertToRaw(this.state.editorState.getCurrentContent())));
+        console.groupEnd();
+        // window.ga('send', 'event', 'draftjs', 'log-data');
+    }
+
+    render() {
+        return (
+          <div id="content">
+            <div className="editor">
+              <Editor
+                ref={(editor) => { this.editor = editor }}
+                editorState={this.state.editorState}
+                onChange={this.onChange} />
+            </div>
+          </div>
+        );
+    }
 }
 
+MyEditor.propTypes = {
+    editorContent: React.PropTypes.any,
+};
+
 // was in constructor
-    // code for gatsby develop only 
+    // code for gatsby develop only
     // these lines throw errors with Gatsby build, because of this: https://github.com/facebook/draft-js/issues/586
     // can use them with gatsby develop for playing around
     // const sampleMarkup = '<b>Bold text</b>, <i>Italic text</i>, unstyled text<br/ ><a href="http://www.facebook.com">Example link</a>';
     // const blocksFromHTML = convertFromHTML(sampleMarkup);
     // const state = ContentState.createFromBlockArray(blocksFromHTML);
     // this.state = {editorState: EditorState.createWithContent(state)};
 
-    // console.group("Constructor Data");    
+    // console.group("Constructor Data");
     // console.info("sampleMarkup:", sampleMarkup);
     // console.info("blocksFromHTML:", blocksFromHTML);
     // console.info("state:", state);
@@ -72,14 +84,14 @@ export default class MyEditor extends React.Component {
     // this.loadFromGitHub = this.loadFromGitHub.bind(this);
     // this.saveToGitHub = this.saveToGitHub.bind(this);
     // this.createOnGitHub = this.createOnGitHub.bind(this);
-// end was in constructor    
+// end was in constructor
 
   // loadFromGitHub() {
   //   // window.ga('send', 'event', 'draftjs', 'load-data', 'ajax');
   //   this.setState({
   //     placeholder: 'Loading...',
   //   });
-    
+
   //   const req = new XMLHttpRequest();
   //   req.open('GET', 'https://api.github.com/repos/riongull/blog/contents/pages/articles/data.json', true);
   //   req.onreadystatechange = () => {
@@ -88,7 +100,7 @@ export default class MyEditor extends React.Component {
   //       const responseObj = JSON.parse(responseText);
   //       const base64content = responseObj.content;
   //       const content = JSON.parse(window.atob(base64content));
-        
+
   //       console.group("Load Data")
   //       console.info("responseText:", responseText);
   //       console.info("responseObj:", responseObj);
@@ -118,7 +130,7 @@ export default class MyEditor extends React.Component {
 
   //   const endpoint = "https://api.github.com/repos/riongull/blog/contents/pages/articles/drafts/new.json"
   //   var params = {
-  //     message: "creating a file", 
+  //     message: "creating a file",
   //     content: "test text",
   //   }
 
@@ -147,7 +159,7 @@ export default class MyEditor extends React.Component {
   //     \`this is some code\`
   //     1. this is a list
   //     2. with two items
-  //     And here's the **final** sentence.  Okay just one more with a [link](www.example.com). 
+  //     And here's the **final** sentence.  Okay just one more with a [link](www.example.com).
   //   `
   //   var config = {
   //     message: 'Adding a file',
@@ -169,7 +181,7 @@ export default class MyEditor extends React.Component {
   //   var path = 'pages/articles/drafts/somePost';
   //   var contents = JSON.stringify(convertToRaw(this.state.editorState.getCurrentContent()));
   //   console.log(contents);
-    
+
   //   var config = {
   //     message: 'Uploaded Draftjs state from editor',
   //     content: window.btoa(contents),
@@ -195,7 +207,7 @@ export default class MyEditor extends React.Component {
           //   Load a draft entry from GitHub
           //   <form onSubmit={this.fetchFromGitHub} >
           //     <input type="text" placeholder="GitHub username" ref="fetch_user"></input><br/>
-          //     <input type="password" placeholder="GitHuB access token" ref="fetch_token"></input><br/>
+          //     <input type="password" placeholder="GitHuB access token" ref="fetch_token" /><br/>
           //     <input type="text" placeholder="GitHub repository" ref="fetch_repo"></input><br/>
           //     <input type="text" placeholder="Folder name" ref="fetch_folder"></input><br/>
           //     <input type="text" placeholder="File name" ref="fetch_file"></input><br/>
@@ -211,7 +223,8 @@ export default class MyEditor extends React.Component {
           //     <input type="text" placeholder="GitHub repository" ref="repo"></input><br/>
           //     <input type="text" placeholder="Folder name" ref="folder"></input><br/>
           //     <input type="text" placeholder="File name" ref="file"></input><br/>
-          //     <input type="checkbox" id="cbox1" ref="overwrite_checkbox"></input><label for="cbox1">overwrite github file</label><br/>
+          //     <input type="checkbox" id="cbox1" ref="overwrite_checkbox" />
+          //     <label for="cbox1">overwrite github file</label><br/>
           //     <button type="submit">Post to GitHub</button>
           //   </form>
           // </div>