Merge 0681640 into e77aa4d

package.json

@@ -11,16 +11,19 @@
     "enzyme-adapter-react-16": "^1.1.1",
     "enzyme-to-json": "^3.3.3",
     "eslint": "^4.19.1",
+    "jest-localstorage-mock": "^2.2.0",
     "prop-types": "^15.6.1",
     "react": "^16.3.2",
     "react-dom": "^16.3.2",
+    "react-mock-router": "^1.0.15",
     "react-notify-toast": "^0.4.0",
     "react-redux": "^5.0.7",
     "react-router-dom": "^4.2.2",
     "react-scripts": "1.1.4",
     "redux": "^4.0.0",
     "redux-logger": "^3.0.6",
     "redux-mock-store": "^1.5.1",
+    "redux-test-utils": "^0.2.2",
     "redux-thunk": "^2.2.0"
   },
   "scripts": {
@@ -29,7 +32,8 @@
     "test": "react-scripts test --env=jsdom",
     "eject": "react-scripts eject",
     "test:bamboo": "react-scripts test --env=jsdom -u --ci --coverage --testResultsProcessor ./node_modules/jest-junit",
-    "lint": "eslint ./src"
+    "lint": "eslint ./src",
+    "coverage": "react-scripts test --env=jsdom --coverage"
   },
   "devDependencies": {
     "eslint-config-airbnb": "^16.1.0",
@@ -41,6 +45,9 @@
     "react-addons-test-utils": "^15.6.2"
   },
   "jest": {
+    "collectCoverageFrom": [
+      "**/src/**/*.{js,jsx}"
+    ],
     "snapshotSerializers": [
       "enzyme-to-json/serializer"
     ]

src/App.js

@@ -7,6 +7,7 @@ import store from './redux/reducers/store';
 import './App.css';
 import Login from './components/Login';
 import Dashboard from './components/Dashboard';
+import Authenticate from './components/Auth';
 
 const App = () => (
   <Provider store={store}>
@@ -16,7 +17,7 @@ const App = () => (
         <Navbar />
         <Switch>
           <Route exact path="/" component={Login} />
-          <Route exact path="/dashboard" component={Dashboard} />
+          <Route exact path="/dashboard" component={Authenticate(Dashboard)} />
         </Switch>
       </div>
     </BrowserRouter>

src/components/Auth/index.jsx

@@ -0,0 +1,36 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+
+export const mapStateToProps = ({ users: { loggedIn } }) => ({
+  loggedIn,
+});
+
+export const AuthWrapper = (WrappedComponent) => {
+  class Authenticate extends Component {
+    static propTypes = {
+      loggedIn: PropTypes.bool,
+      history: PropTypes.shape({
+        push: PropTypes.func,
+      }).isRequired,
+    };
+
+    static defaultProps = {
+      loggedIn: false,
+    };
+
+    componentWillMount() {
+      if (!this.props.loggedIn) {
+        this.props.history.push('/');
+      }
+    }
+
+    render() {
+      return <WrappedComponent {...this.props} />;
+    }
+  }
+
+  return Authenticate;
+};
+
+export default Authenticate => connect(mapStateToProps, null)(AuthWrapper(Authenticate));

src/components/Login.js

@@ -114,7 +114,11 @@ export class Login extends Component {
 Login.propTypes = {
   loginAction: PropTypes.func.isRequired,
   history: PropTypes.shape({ url: PropTypes.string, push: PropTypes.func }).isRequired,
-  loading: PropTypes.bool.isRequired,
+  loading: PropTypes.bool,
+};
+
+Login.defaultProps = {
+  loading: false,
 };
 
 const mapStateToProps = state => ({

src/components/Navbar.js

@@ -69,11 +69,15 @@ export class Navbar extends Component {
 
 Navbar.propTypes = {
   loggedIn: PropTypes.bool.isRequired,
-  user: PropTypes.shape({ username: PropTypes.string }).isRequired,
+  user: PropTypes.shape({ username: PropTypes.string }),
   logoutAction: PropTypes.func.isRequired,
   history: PropTypes.shape({ url: PropTypes.string, push: PropTypes.func }).isRequired,
 };
 
+Navbar.defaultProps = {
+  user: {},
+};
+
 const mapStateToProps = state => ({
   loggedIn: state.users.loggedIn,
   user: state.users.payload,

src/redux/actions/auth/authActionCreators.js

@@ -1,4 +1,10 @@
-import { AUTHENTICATED, AUTHENTICATION_FAILED, AUTHENTICATION_IN_PROGRESS, LOGGED_OUT, LOGOUT_FAILED } from '../types';
+import {
+  AUTHENTICATED,
+  AUTHENTICATION_FAILED,
+  AUTHENTICATION_IN_PROGRESS,
+  LOGGED_OUT,
+  LOGOUT_FAILED,
+} from '../types';
 
 // Action creator
 const login = response => ({
@@ -28,10 +34,5 @@ const logoutFailed = errorMessage => ({
   payload: { errorMessage },
 });
 
-export {
-  login,
-  loginFailed,
-  loginStarted,
-  logout,
-  logoutFailed,
-};
+
+export { login, loginFailed, loginStarted, logout, logoutFailed };

src/redux/reducers/store.js

@@ -29,6 +29,7 @@ const createStoreWithMiddleware = applyMiddleware(reduxThunk, logger)(createStor
 const persistedState = loadState();
 const store = createStoreWithMiddleware(rootReducer, persistedState);
 
+
 store.subscribe(() => {
   saveState({
     users: { loggedIn: store.getState().users.loggedIn },

src/setupTests.js

@@ -2,3 +2,10 @@ import { configure } from 'enzyme';
 import Adapter from 'enzyme-adapter-react-16';
 
 configure({ adapter: new Adapter() });
+
+const localStorageMock = {
+  getItem: jest.fn(),
+  setItem: jest.fn(),
+  clear: jest.fn(),
+};
+global.localStorage = localStorageMock;