applied the new api middleware

package.json

@@ -3,13 +3,12 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "start": "react-scripts start",
+    "start": "serve -s ./build",
     "dev": "npm run lint && react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test --watchAll",
     "test:coverage": "react-scripts test --watchAll \"-- --coverage\"",
     "test:CI": "CI=true react-scripts test \"-- --coverage\"",
-    "cover": "CI=true react-scripts test \"-- --coverage\"",
     "coveralls": "cat coverage/lcov.info | coveralls",
     "eject": "react-scripts eject",
     "lint": "./node_modules/.bin/eslint . --fix"
@@ -46,8 +45,7 @@
     "redux-devtools-extension": "^2.13.8",
     "redux-mock-store": "^1.5.3",
     "redux-promise-middleware": "^6.1.1",
-    "redux-thunk": "^2.3.0",
-    "sinon": "^7.3.2"
+    "redux-thunk": "^2.3.0"
   },
   "eslintConfig": {
     "extends": "react-app"

src/__mocks__/user.js

@@ -34,8 +34,8 @@ export const mismatchedResetPassword = {
 };
 
 export const matchedResetPassword = {
-  password: 'Brazzaville10!',
-  confirmPassword: 'Brazzaville10!'
+  passwordOne: 'Brazzaville10!',
+  passwordTwo: 'Brazzaville10!'
 };
 
 export const sendEmail = { email: 'noreplay@gmail.com' };

src/__tests__/reducers/password.test.js

@@ -1,62 +1,76 @@
 import passwordReducer from '../../reducers/user/passwordReducer';
 import initialState from '../../store/initialState';
-import { passwordAction } from '../../actions-types';
-import {
-  sendEmail,
-  fakeEmail,
-  matchedResetPassword,
-  mismatchedResetPassword
-} from '../../__mocks__/user';
+import { userActionsTypes } from '../../actions-types';
+import { matchedResetPassword, mismatchedResetPassword } from '../../__mocks__/user';
 
-describe('User reducer', () => {
-  test('INITIALIZE_EMAIL', () => {
+describe('Password reducer', () => {
+  test('FORGOT_PASSWORD_START', () => {
     const reducer = passwordReducer(initialState, {
-      type: passwordAction.FORGOT_PASSWORD_INITIALIZED,
-      payload: { ...sendEmail }
+      type: userActionsTypes.FORGOT_PASSWORD_START,
+      payload: { loading: true }
     });
-    expect(reducer).toHaveProperty('email');
+    expect(reducer.forgotPassword).toHaveProperty('loading');
+    expect(reducer.forgotPassword.loading).toBeTruthy();
   });
 
   test('EMAIL_SENT_SUCCESSFULLY', () => {
     const reducer = passwordReducer(initialState, {
-      type: passwordAction.FORGOT_PASSWORD_SUCCESS,
-      payload: { ...sendEmail }
+      type: userActionsTypes.FORGOT_PASSWORD_SUCCESS,
+      payload: { message: { sendEmail: 'luctunechi45@gmail.com' } }
     });
-    expect(reducer).toHaveProperty('email');
+    expect(reducer.forgotPassword.message).toHaveProperty('sendEmail');
   });
 
   test('ERROR', () => {
     const reducer = passwordReducer(initialState, {
-      type: passwordAction.FORGOT_PASSWORD_ERROR,
-      payload: { ...fakeEmail }
+      type: userActionsTypes.FORGOT_PASSWORD_FAILURE,
+      payload: { errors: { sendEmail: 'qweqwewqew@gmail' } }
     });
-    expect(reducer).toHaveProperty('email');
+    expect(reducer.forgotPassword.errors).toHaveProperty('sendEmail');
   });
 
-  test('INITIALIZE_PASSWORD', () => {
+  test('FORGOT_PASSWORD_END', () => {
     const reducer = passwordReducer(initialState, {
-      type: passwordAction.RESET_PASSWORD_INITIALIZED,
-      payload: { ...matchedResetPassword }
+      type: userActionsTypes.FORGOT_PASSWORD_END,
+      payload: { loading: false }
     });
-    expect(reducer).toHaveProperty('password');
-    expect(reducer).toHaveProperty('confirmPassword');
+
+    expect(reducer.forgotPassword).toHaveProperty('loading');
+    expect(reducer.forgotPassword.loading).toBeFalsy();
+  });
+
+  test('UPDATE_PASSWORD_START', () => {
+    const reducer = passwordReducer(initialState, {
+      type: userActionsTypes.RESET_PASSWORD_START,
+      payload: { loading: true }
+    });
+    expect(reducer.updatePassword).toHaveProperty('loading');
+    expect(reducer.updatePassword.loading).toBeTruthy();
   });
 
   test('UPDATE_SUCCESSFULLY_PASSWORD', () => {
     const reducer = passwordReducer(initialState, {
-      type: passwordAction.RESET_PASSWORD_SUCCESS,
-      payload: { ...matchedResetPassword }
+      type: userActionsTypes.RESET_PASSWORD_SUCCESS,
+      payload: { message: { matchedResetPassword } }
     });
-    expect(reducer).toHaveProperty('password');
-    expect(reducer).toHaveProperty('confirmPassword');
+    expect(reducer.updatePassword).toHaveProperty('message');
   });
 
   test('ERROR', () => {
     const reducer = passwordReducer(initialState, {
-      type: passwordAction.RESET_PASSWORD_ERROR,
-      payload: { ...mismatchedResetPassword }
+      type: userActionsTypes.RESET_PASSWORD_FAILURE,
+      payload: { errors: { mismatchedResetPassword } }
     });
-    expect(reducer).toHaveProperty('password');
-    expect(reducer).toHaveProperty('confirmPassword');
+    expect(reducer.updatePassword).toHaveProperty('errors');
+  });
+
+  test('UPDATE_PASSWORD_END', () => {
+    const reducer = passwordReducer(initialState, {
+      type: userActionsTypes.RESET_PASSWORD_END,
+      payload: { loading: false }
+    });
+
+    expect(reducer.updatePassword).toHaveProperty('loading');
+    expect(reducer.updatePassword.loading).toBeFalsy();
   });
 });

src/actions-types/index.js

@@ -1,6 +1,5 @@
 import * as userActionsTypes from './userActionsTypes';
 import * as apiActionsTypes from './apiActionsTypes';
 import * as notificationActionTypes from './notificationActionTypes';
-import * as passwordAction from './PasswordActionsType';
 
-export { apiActionsTypes, userActionsTypes, notificationActionTypes, passwordAction };
+export { apiActionsTypes, userActionsTypes, notificationActionTypes };

src/actions-types/userActionsTypes.js

@@ -22,3 +22,14 @@ export const UPLOAD_PROFILE_PICTURE_START = 'UPLOAD_PROFILE_PICTURE_START';
 export const UPLOAD_PROFILE_PICTURE_END = 'UPLOAD_PROFILE_PICTURE_END';
 export const UPLOAD_PROFILE_PICTURE_SUCCESS = 'UPLOAD_PROFILE_PICTURE_SUCCESS';
 export const UPLOAD_PROFILE_PICTURE_FAILURE = 'UPLOAD_PROFILE_PICTURE_FAILURE';
+
+
+export const FORGOT_PASSWORD_START = 'FORGOT_PASSWORD_START';
+export const FORGOT_PASSWORD_END = 'FORGOT_PASSWORD_END';
+export const FORGOT_PASSWORD_SUCCESS = 'FORGOT_PASSWORD_SUCCESS';
+export const FORGOT_PASSWORD_FAILURE = 'FORGOT_PASSWORD_FAILURE';
+
+export const RESET_PASSWORD_START = 'RESET_PASSWORD_START';
+export const RESET_PASSWORD_END = 'RESET_PASSWORD_END';
+export const RESET_PASSWORD_SUCCESS = 'RESET_PASSWORD_SUCCESS';
+export const RESET_PASSWORD_FAILURE = 'RESET_PASSWORD_FAILURE';

src/actions/user/forgotPasswordAction.js

@@ -0,0 +1,12 @@
+import { userActionsTypes } from '../../actions-types';
+import { apiAction } from '../../helpers';
+
+export default email => dispatch => dispatch(apiAction({
+  method: 'post',
+  url: '/auth/reset',
+  data: { email },
+  onStart: userActionsTypes.FORGOT_PASSWORD_START,
+  onEnd: userActionsTypes.FORGOT_PASSWORD_END,
+  onSuccess: userActionsTypes.FORGOT_PASSWORD_SUCCESS,
+  onFailure: userActionsTypes.FORGOT_PASSWORD_FAILURE
+}));

src/actions/user/index.js

@@ -5,5 +5,17 @@ import login from './login';
 import editProfile from './editProfile';
 import updateProfile from './updateProfile';
 import uploadImage from './uploadImage';
+import forgotPasswordAction from './forgotPasswordAction';
+import updatePasswordAction from './updatePasswordAction';
 
-export { getUser, signup, socialAuth, editProfile, uploadImage, login, updateProfile };
+export {
+  getUser,
+  signup,
+  socialAuth,
+  editProfile,
+  uploadImage,
+  login,
+  updateProfile,
+  forgotPasswordAction,
+  updatePasswordAction
+};

src/actions/user/updatePasswordAction.js

@@ -0,0 +1,12 @@
+import { userActionsTypes } from '../../actions-types';
+import { apiAction } from '../../helpers';
+
+export default (form, token) => dispatch => dispatch(apiAction({
+  method: 'patch',
+  url: `auth/reset/${token}`,
+  data: { ...form },
+  onStart: userActionsTypes.RESET_PASSWORD_STARTS,
+  onEnd: userActionsTypes.RESET_PASSWORD_END,
+  onSuccess: userActionsTypes.RESET_PASSWORD_SUCCESS,
+  onFailure: userActionsTypes.RESET_PASSWORD_FAILURE
+}));

src/components/ResetPassword/ForgotPassword.js

@@ -5,7 +5,7 @@ import { Link } from 'react-router-dom';
 import { ToastContainer, toast } from 'react-toastify';
 import { Input, Button, Form, Img } from '../common';
 import { regularExpression } from '../../helpers/user/formValidator';
-import { forgotPassword } from '../../actions/user/passwordActions';
+import { forgotPasswordAction } from '../../actions/user';
 import Logo from '../../assets/images/logo_ah_secondo.png';
 
 class ForgotPassword extends Component {
@@ -21,18 +21,19 @@ class ForgotPassword extends Component {
   handleSubmit = async (e) => {
     e.preventDefault();
     const { email } = this.state;
-    this.setState({ loading: true });
+
     if (regularExpression.test(email)) {
-      const isEmailSent = await this.props.forgotPassword(email);
-      this.setState({ email: '', loading: false });
+      const isEmailSent = await this.props.forgotPasswordAction(email);
+      this.setState({ email: '' });
       return isEmailSent;
     }
-    this.setState({ loading: false });
+
     return toast.error('Please enter your Email');
   };
 
   render() {
-    const { email, loading } = this.state;
+    const { loading } = this.props;
+    const { email } = this.state;
     return (
       <div className="container">
         <ToastContainer position={toast.POSITION.TOP_CENTER} />
@@ -69,11 +70,19 @@ class ForgotPassword extends Component {
 }
 
 ForgotPassword.propTypes = {
-  isLoading: PropTypes.bool,
-  forgotPassword: PropTypes.func
+  loading: PropTypes.bool,
+  message: PropTypes.string,
+  errors: PropTypes.object,
+  forgotPasswordAction: PropTypes.func
 };
 
+const mapStateToProps = ({ user: { forgotPassword: { loading, message, errors } } }) => ({
+  loading,
+  message,
+  errors
+});
+
 export default connect(
-  null,
-  { forgotPassword }
+  mapStateToProps,
+  { forgotPasswordAction }
 )(ForgotPassword);