Call api from login form

client/package.json

@@ -85,6 +85,7 @@
     "istanbul": "0.4.4",
     "jsdom": "9.4.1",
     "mocha": "3.0.2",
+    "moxios": "0.3.0",
     "nock": "8.0.0",
     "node-sass": "3.8.0",
     "npm-run-all": "2.3.0",

client/src/actions/actionTypes.js

@@ -17,3 +17,5 @@ export const LOAD_PROFILE_SUCCESS = "UPDATE_PROFILE_SUCCESS"
 export const UPDATE_PROFILE = "UPDATE_PROFILE"
 
 export const UPDATE_ERRORS = "UPDATE_ERRORS"
+
+export const LOGIN_USER_SUCCESS = "LOGIN_USER_SUCCESS"

client/src/actions/userActions.js

@@ -0,0 +1,14 @@
+import * as types from './actionTypes'
+import userApi from '../api/userApi'
+
+export function loginUserSuccess(user) {
+  return { type: types.LOGIN_USER_SUCCESS, user }
+}
+
+export function loginUser(user) {
+  return (dispatch) => {
+    return userApi.loginUser(user).then((token) => {
+      dispatch(loginUserSuccess({username: user.email, token, isAuthenticated: true}))
+    })
+  }
+}

client/src/actions/userActions.test.js

@@ -0,0 +1,66 @@
+import expect from 'expect'
+import * as userActions from './userActions'
+import * as types from './actionTypes'
+
+import thunk from 'redux-thunk'
+import configureMockStore from 'redux-mock-store'
+import moxios from 'moxios'
+
+describe('User Actions', function () {
+  describe('loginUserSuccess', () => {
+    it('should create a LOGIN_USER_SUCCESS action', () => {
+      const user = { someUser: 'test' }
+      const expectedAction = {
+        type: types.LOGIN_USER_SUCCESS,
+        user
+      }
+
+      const action = userActions.loginUserSuccess(user)
+
+      expect(action).toEqual(expectedAction)
+    })
+  })
+
+  const middleware = [thunk]
+  const mockStore = configureMockStore(middleware)
+
+  describe('Async Actions', () => {
+    beforeEach(function () {
+      moxios.install()
+    })
+
+    afterEach(function () {
+      moxios.uninstall()
+    })
+
+    describe('loginUser', () => {
+      it('should create an LOGIN_USER_SUCCESS action', () => {
+        const expectedToken = 'expectedValidToken'
+
+        moxios.wait(() => {
+          let request = moxios.requests.mostRecent()
+          request.respondWith({
+            status: 200,
+            response: { token: expectedToken }
+          })
+        })
+
+        const expectedUser = {
+          username: 'test',
+          token: expectedToken,
+          isAuthenticated: true
+        }
+        const expecedValidPassword = 'test'
+        const expectedActions = [
+          { type: types.LOGIN_USER_SUCCESS, user: expectedUser }
+        ]
+        const store = mockStore({})
+        return store.dispatch(userActions.loginUser({ email: expectedUser.username, password: expecedValidPassword })).then(() => {
+          const actions = store.getActions()
+          expect(actions[0].type).toEqual(types.LOGIN_USER_SUCCESS)
+          expect(actions[0].user).toEqual(expectedUser)
+        })
+      })
+    })
+  })
+})

client/src/api/userApi.js

@@ -0,0 +1,18 @@
+import axios from 'axios'
+// eslint-disable-next-line no-undef
+axios.defaults.baseURL = API_URI
+
+class userApi {
+  static loginUser(user) {
+    return axios.post('/auth', user)
+      .then((response) => {
+        return response.data.token
+      })
+      .catch((error) => {
+        const errorMessage = error.response.data.message ? error.response.data.message : error
+        throw new Error(errorMessage)
+      })
+  }
+}
+
+export default userApi

client/src/components/login/LoginPage.js

@@ -4,6 +4,9 @@ import Validation from '../common/Validation'
 import {userValidationConstraints} from './userValidationConstraints'
 import toastr from 'toastr'
 import {isEmptyObject} from '../common/validationHelper'
+import {connect} from 'react-redux'
+import {bindActionCreators} from 'redux'
+import * as userActions from '../../actions/userActions'
 
 export class LoginPage extends React.Component {
   constructor(props, context) {
@@ -36,7 +39,13 @@ export class LoginPage extends React.Component {
       toastr.error('Tu dois renseigner un email et un mot de passe valides')
     }
     else {
-      //TODO perform authent
+      this.props.actions.loginUser(this.state.user)
+        .then((user) => {
+          toastr.success('Authentification réussie')
+        })
+        .catch((err) => {
+          toastr.error(err)
+        })
     }
   }
 
@@ -65,7 +74,18 @@ export class LoginPage extends React.Component {
   }
 }
 
+function mapStateToProps(state, ownProps) {
+  return {}
+}
+
+function mapDispatchToProps(dispatch) {
+  return {
+    actions: bindActionCreators(userActions, dispatch),
+  }
+}
+
 LoginPage.propTypes = {
+  actions: PropTypes.object.isRequired
 }
 
-export default LoginPage
+export default connect(mapStateToProps, mapDispatchToProps)(LoginPage)

client/src/components/login/LoginPage.test.js

@@ -5,6 +5,7 @@ import { LoginPage } from './LoginPage'
 
 function setup() {
   const props = {
+    actions: {}
   }
   return mount(<LoginPage {...props} />)
 }

client/src/reducers/index.js

@@ -6,6 +6,7 @@ import pepite from './pepiteReducer'
 import errors from './errorsReducer'
 import career from './careerReducer'
 import profile from './profileReducer'
+import user from './userReducer'
 
 const rootReducer = combineReducers({
   application,
@@ -14,6 +15,7 @@ const rootReducer = combineReducers({
   pepite,
   career,
   profile,
+  user,
   errors
 })
 

client/src/reducers/initialState.js

@@ -85,6 +85,9 @@ export default {
     linkedin: '',
     viadeo: '',
   },
+  user: {
+    isAuthenticated: false
+  },
   errors: {
     contact: {},
     bac: {},

client/src/reducers/userReducer.js

@@ -0,0 +1,11 @@
+import * as types from '../actions/actionTypes'
+import initialState from './initialState'
+
+export default function userReducer(state = initialState.user, action) {
+  switch (action.type) {
+    case types.LOGIN_USER_SUCCESS:
+      return Object.assign({}, state.user, action.user )
+    default:
+      return state
+  }
+}