Added the Prettier linter.

Includes .eslintrc rules for both the Prettier's syntax and that required by Create React App.
hotosm · Aug 25, 2017 · a913f28 · a913f28
1 parent db34f2c
commit a913f28
Show file tree

Hide file tree

Showing 53 changed files with 2,966 additions and 2,349 deletions.
diff --git a/.eslintrc b/.eslintrc
@@ -0,0 +1,9 @@
+{
+  extends: "react-app",
+  "plugins": [
+    "prettier"
+  ],
+  "rules": {
+    "prettier/prettier": "error"
+  }
+}
diff --git a/package.json b/package.json
@@ -30,11 +30,14 @@
     "chai": "^3.5.0",
     "chai-webdriverio": "^0.3.0",
     "enzyme": "^2.8.2",
+    "eslint": "^4.5.0",
+    "eslint-plugin-prettier": "^2.2.0",
     "jeet": "^7.1.0",
     "mocha": "^3.2.0",
     "node-bourbon": "^4.2.8",
     "node-neat": "^1.7.2",
     "node-sass-chokidar": "^0.0.3",
+    "prettier": "^1.5.3",
     "react-addons-test-utils": "^15.5.1",
     "react-test-renderer": "^15.5.4",
     "wdio-browserstack-service": "^0.1.11",

diff --git a/src/actions/actions.js b/src/actions/actions.js
@@ -1,50 +1,50 @@
-var Reflux = require('reflux');
+var Reflux = require("reflux");
 
 module.exports = Reflux.createActions({
-  'selectedBbox': {},
+  selectedBbox: {},
 
-  'latestImageryLoaded': {},
+  latestImageryLoaded: {},
 
-  'footprintsLoaded': {},
+  footprintsLoaded: {},
 
   // Filter actios
-  'setDateFilter': {
-    shouldEmit: function (val) {
-      return [ 'all', 'week', 'month', 'year' ].indexOf(val) >= 0;
+  setDateFilter: {
+    shouldEmit: function(val) {
+      return ["all", "week", "month", "year"].indexOf(val) >= 0;
     }
   },
-  'setResolutionFilter': {
-    shouldEmit: function (val) {
-      return [ 'all', 'low', 'medium', 'high' ].indexOf(val) >= 0;
+  setResolutionFilter: {
+    shouldEmit: function(val) {
+      return ["all", "low", "medium", "high"].indexOf(val) >= 0;
     }
   },
-  'setDataTypeFilter': {
-    shouldEmit: function (val) {
-      return [ 'all', 'service' ].indexOf(val) >= 0;
+  setDataTypeFilter: {
+    shouldEmit: function(val) {
+      return ["all", "service"].indexOf(val) >= 0;
     }
   },
 
   // Results pane related actions.
-  'resultOver': {},
-  'resultOut': {},
-  'resultSelected': {},
+  resultOver: {},
+  resultOut: {},
+  resultSelected: {},
 
   // openModal(which)
-  'openModal': {},
+  openModal: {},
 
-  'fitToBounds': {},
-  'moveToCoords': {},
+  fitToBounds: {},
+  moveToCoords: {},
 
-  'requestMyLocation': {},
+  requestMyLocation: {},
 
-  'selectPreview': {},
+  selectPreview: {},
 
-  'setBaseLayer': {},
+  setBaseLayer: {},
 
-  'showNotification': {},
-  'clearNotification': {},
-  'clearNotificationAfter': {},
+  showNotification: {},
+  clearNotification: {},
+  clearNotificationAfter: {},
 
-  'userLogOut': {},
-  'userLogIn': {}
+  userLogOut: {},
+  userLogIn: {}
 });
diff --git a/src/components/app.js b/src/components/app.js
@@ -1,21 +1,21 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-import createReactClass from 'create-react-class';
-import Reflux from 'reflux';
+import PropTypes from "prop-types";
+import React from "react";
+import createReactClass from "create-react-class";
+import Reflux from "reflux";
 
-import MessageModal from 'components/modals/message_modal';
-import Notifications from 'components/uploader/notifications';
-import FeedbackModal from 'components/modals/feedback_modal';
-import Header from 'components/header';
-import actions from 'actions/actions';
+import MessageModal from "components/modals/message_modal";
+import Notifications from "components/uploader/notifications";
+import FeedbackModal from "components/modals/feedback_modal";
+import Header from "components/header";
+import actions from "actions/actions";
 
 export default createReactClass({
-  displayName: 'App',
+  displayName: "App",
 
   mixins: [
-    Reflux.listenTo(actions.showNotification, 'onNotificationShow'),
-    Reflux.listenTo(actions.clearNotification, 'dismissNotification'),
-    Reflux.listenTo(actions.clearNotificationAfter, 'dismissNotification')
+    Reflux.listenTo(actions.showNotification, "onNotificationShow"),
+    Reflux.listenTo(actions.clearNotification, "dismissNotification"),
+    Reflux.listenTo(actions.clearNotificationAfter, "dismissNotification")
   ],
 
   propTypes: {
@@ -25,7 +25,7 @@ export default createReactClass({
     children: PropTypes.object
   },
 
-  componentWillMount: function () {
+  componentWillMount: function() {
     // Pull the search filter state from the URL.  Why is this here instead
     // of in the Filters component?  Because we want to ensure that we set
     // these filter parameters BEFORE the map component loads, since that is
@@ -44,31 +44,34 @@ export default createReactClass({
     }
   },
 
-  getInitialState: function () {
+  getInitialState: function() {
     return {
       notification: { type: null, message: null }
     };
   },
 
-  onNotificationShow: function (type, message) {
+  onNotificationShow: function(type, message) {
     this.setState({
       notification: { type: type, message: message }
     });
   },
 
-  dismissNotification: function (time) {
+  dismissNotification: function(time) {
     if (!time) {
       time = 0;
     }
 
-    setTimeout(function () {
-      this.setState({
-        notification: { type: null, message: null }
-      });
-    }.bind(this), time);
+    setTimeout(
+      function() {
+        this.setState({
+          notification: { type: null, message: null }
+        });
+      }.bind(this),
+      time
+    );
   },
 
-  render: function () {
+  render: function() {
     // Only show the modal if there are no url params.
     // There can't be any other without map.
     var params = this.props.params || {};
@@ -83,17 +86,17 @@ export default createReactClass({
           location={this.props.location}
         />
 
-        <main className='page__body' role='main'>
-          <section className='layout layout--app'>
-            <header className='layout__header'>
-              <div className='inner'>
-                <div className='layout__headline'>
-                  <h1 className='layout__title'>Browse</h1>
+        <main className="page__body" role="main">
+          <section className="layout layout--app">
+            <header className="layout__header">
+              <div className="inner">
+                <div className="layout__headline">
+                  <h1 className="layout__title">Browse</h1>
                 </div>
               </div>
             </header>
-            <div className='layout__body'>
-              <div className='inner'>
+            <div className="layout__body">
+              <div className="inner">
                 {React.cloneElement(this.props.children, {
                   params: params,
                   query: query
@@ -102,23 +105,20 @@ export default createReactClass({
             </div>
           </section>
         </main>
-        <footer className='page__footer' role='contentinfo'>
-          <div className='inner'>
+        <footer className="page__footer" role="contentinfo">
+          <div className="inner">
             <p>
-              Made with love by
-              {' '}
+              Made with love by{" "}
               <a
-                href='https://developmentseed.org'
-                title='Visit Development Seed website'
+                href="https://developmentseed.org"
+                title="Visit Development Seed website"
               >
                 Development Seed
-              </a>
-              {' '}
-              and
-              {' '}
+              </a>{" "}
+              and{" "}
               <a
-                href='http://hot.openstreetmap.org/'
-                title='Visit the Humanitarian OpenStreetMap Team website'
+                href="http://hot.openstreetmap.org/"
+                title="Visit the Humanitarian OpenStreetMap Team website"
               >
                 HOT
               </a>