Introducing linting

.eslintignore

@@ -0,0 +1,2 @@
+src/serviceWorker.js
+src/tests

.eslintrc

@@ -0,0 +1,22 @@
+{
+  "parser": "babel-eslint",
+  "extends": [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:prettier/recommended"
+  ],
+  "plugins": [
+    "react",
+    "prettier"
+  ],
+  "rules": {
+    "no-undef": [ 1 ],
+    "prettier/prettier": ["error", { "singleQuote": true }]
+  },
+  "settings": {
+    "react": {
+      "pragma": "React",
+      "version": "detect"
+    }
+  }
+}

package.json

@@ -14,7 +14,9 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "eject": "react-scripts eject",
+    "lint": "eslint './src/**/*.{js,jsx}'",
+    "lint:fix": "eslint --fix './src/**/*.{js,jsx}'"
   },
   "eslintConfig": {
     "extends": "react-app"
@@ -32,8 +34,16 @@
     ]
   },
   "devDependencies": {
+    "babel-eslint": "^10.0.3",
+    "babel-loader": "^8.0.6",
+    "eslint": "^6.4.0",
+    "eslint-config-prettier": "^6.3.0",
+    "eslint-loader": "^3.0.0",
+    "eslint-plugin-prettier": "^3.1.1",
+    "eslint-plugin-react": "^7.14.3",
     "fetch-mock": "^7.3.9",
     "node-fetch": "^2.6.0",
+    "prettier": "^1.18.2",
     "redux-mock-store": "^1.5.3",
     "timekeeper": "^2.2.0"
   }

src/actions.js

@@ -1,5 +1,5 @@
-import { api } from './bees'
-import * as types from './types'
+import { api } from './bees';
+import * as types from './types';
 
 /**
  * Define the actions for updating the Redux state
@@ -9,7 +9,7 @@ export function selectProvider(provider) {
   return {
     type: types.SELECT_PROVIDER,
     provider
-  }
+  };
 }
 
 /**
@@ -18,8 +18,8 @@ export function selectProvider(provider) {
  * requested from the API
  */
 function shouldRequestProviders(state) {
-  const providers = state.providers
-  return !providers.isRequesting
+  const providers = state.providers;
+  return !providers.isRequesting;
 }
 
 /**
@@ -30,40 +30,40 @@ export function requestProviders() {
     type: types.REQUEST_PROVIDERS,
     providers: [],
     isRequesting: true
-  }
+  };
 }
 
 /**
  * Receiving all of the providers from the API
  */
 export function receiveProviders(response) {
-  const body = response.body
-  const data = body.data
+  const body = response.body;
+  const data = body.data;
   return {
     type: types.RECEIVE_PROVIDERS,
     isRequesting: false,
     providers: data,
     receivedAt: Date.now()
-  }
+  };
 }
 
 /**
  * Request and update the providers in the state
  */
 function requestAndReceiveProviders() {
-
   return dispatch => {
-    dispatch(requestProviders())
-    return api.getProviders()
-      .then(response => dispatch(receiveProviders(response)))
-  }
+    dispatch(requestProviders());
+    return api
+      .getProviders()
+      .then(response => dispatch(receiveProviders(response)));
+  };
 }
 
-      //.catch(response => dispatch(receiveProviders({})))
+//.catch(response => dispatch(receiveProviders({})))
 export function updateProviders() {
   return (dispatch, getState) => {
     if (shouldRequestProviders(getState())) {
-      return dispatch(requestAndReceiveProviders())
+      return dispatch(requestAndReceiveProviders());
     }
-  }
+  };
 }

src/bees.js

@@ -1,8 +1,8 @@
-import { buildApi, get, post, patch, destroy } from 'redux-bees';
+import { buildApi, get } from 'redux-bees';
 
 const apiEndpoints = {
-    getProviders:      { method: get,     path: '/providers' },
-    getProvider:       { method: get,     path: '/providers/:id' }
+  getProviders: { method: get, path: '/providers' },
+  getProvider: { method: get, path: '/providers/:id' }
 };
 
 const config = {

src/configureStore.js

@@ -1,15 +1,14 @@
+import { createStore, applyMiddleware } from 'redux';
+import thunkMiddleware from 'redux-thunk';
+import { createLogger } from 'redux-logger';
+import rootReducer from './reducers';
 
-import { createStore, applyMiddleware } from 'redux'
-import thunkMiddleware from 'redux-thunk'
-import { createLogger } from 'redux-logger'
-import rootReducer from './reducers'
-
-const loggerMiddleware = createLogger()
+const loggerMiddleware = createLogger();
 
 export default function configureStore(preloadedState) {
   return createStore(
     rootReducer,
     preloadedState,
     applyMiddleware(thunkMiddleware, loggerMiddleware)
-  )
+  );
 }

src/index.js

@@ -4,7 +4,7 @@ import './index.css';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
 
-import 'babel-polyfill'
+import 'babel-polyfill';
 
 ReactDOM.render(<App />, document.getElementById('root'));
 

src/reducers.js

@@ -1,6 +1,5 @@
-
-import { combineReducers } from 'redux'
-import * as types from './types'
+import { combineReducers } from 'redux';
+import * as types from './types';
 
 /**
  * Define the reducers for the Redux store
@@ -10,13 +9,12 @@ import * as types from './types'
  * Reducer for selecting a provider
  */
 function selectProvider(state = {}, action) {
-
   // Update the state when a provider is selected by the user
   switch (action.type) {
     case types.SELECT_PROVIDER:
-      return action.provider
+      return action.provider;
     default:
-      return state
+      return state;
   }
 }
 
@@ -37,39 +35,39 @@ function updatedProviderState(
       return Object.assign({}, state, {
         isFetching: true,
         didInvalidate: false
-      })
+      });
     case types.RECEIVE_PROVIDERS:
       return Object.assign({}, state, {
         isFetching: false,
         didInvalidate: false,
         items: action.providers,
         lastUpdated: action.receivedAt
-      })
+      });
     default:
-      return state
+      return state;
   }
 }
 
 /**
  * Reducer for requesting and receiving providers
  */
 function updateProviders(state = {}, action) {
+  const updated = updatedProviderState(state.providers, action);
+
   switch (action.type) {
     case types.REQUEST_PROVIDER:
     case types.RECEIVE_PROVIDER:
-      const updated = updatedProviderState(state.providers, action)
-        //[action.provider]: provider(state[action.provider], action)
       return Object.assign({}, state, {
         providers: updated
-      })
+      });
     default:
-      return state
+      return state;
   }
 }
 
 const rootReducer = combineReducers({
   selectProvider,
   updateProviders
-})
+});
 
-export default rootReducer
+export default rootReducer;

src/types.js

@@ -1,9 +1,9 @@
 /**
  * Define the action types
  */
-export const REQUEST_PROVIDERS = 'REQUEST_PROVIDERS'
-export const RECEIVE_PROVIDERS = 'RECEIVE_PROVIDERS'
-export const SELECT_PROVIDER = 'SELECT_PROVIDER'
+export const REQUEST_PROVIDERS = 'REQUEST_PROVIDERS';
+export const RECEIVE_PROVIDERS = 'RECEIVE_PROVIDERS';
+export const SELECT_PROVIDER = 'SELECT_PROVIDER';
 
 export const REQUEST_SESSION = 'REQUEST_SESSION';
 export const RECEIVE_SESSION = 'RECEIVE_SESSION';
@@ -25,4 +25,4 @@ export default {
   REQUEST_CONTAINER,
   RECEIVE_CONTAINER,
   SUBMIT_UPLOAD
-}
+};