fix merge conflict

.babelrc

@@ -1,11 +1,4 @@
 {
   "presets": ["@babel/preset-env", "@babel/preset-react"],
-<<<<<<< HEAD
-  "plugins": [
-    "@babel/plugin-proposal-class-properties",
-    "@babel/plugin-transform-runtime"
-  ]
-=======
   "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-transform-runtime"]
->>>>>>> convert to async
 }

package.json

@@ -34,28 +34,32 @@
     "bootstrap": "^4.3.1",
     "classnames": "^2.2.6",
     "clean-webpack-plugin": "^3.0.0",
-    "history": "^4.9.0",
-    "enzyme": "^3.9.0",
+    "enzyme": "^3.10.0",
     "enzyme-adapter-react-16": "^1.12.1",
     "enzyme-to-json": "^3.3.5",
     "express": "^4.17.1",
+    "express-validator": "^6.1.1",
+    "file-loader": "^4.0.0",
+    "history": "^4.9.0",
     "html-webpack-plugin": "^3.2.0",
     "identity-obj-proxy": "^3.0.0",
     "jquery": "^3.4.1",
     "jwt-decode": "^2.2.0",
     "mini-css-extract-plugin": "^0.7.0",
     "nock": "^10.0.6",
     "prop-types": "^15.7.2",
+    "query-string": "^5.1.1",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",
     "react-redux": "^7.1.0",
     "react-router": "^5.0.1",
     "react-router-dom": "^5.0.1",
     "react-router-redux": "^4.0.8",
+    "reactstrap": "^8.0.0",
     "redux": "^4.0.1",
     "redux-mock-store": "^1.5.3",
     "redux-thunk": "^2.3.0",
-    "reactstrap": "^8.0.0",
+    "sinon": "^7.3.2",
     "uglifyjs-webpack-plugin": "^2.1.3",
     "url-loader": "^2.0.1",
     "webpack": "^4.35.2",

src/components/ChangePassword/ChangePassword.js

@@ -7,7 +7,7 @@ import './changePassword.scss';
 import { withRouter } from 'react-router-dom';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import * as actions from '../../../store/actions/authActions/changePassword';
-import Card from '../card/card';
+import Card from '../Card/Card';
 import Button from '../Button';
 import Input from '../Inputs/Input';
 import Footer from '../Footer/Footer';

src/components/Header/Header.js

@@ -53,7 +53,7 @@ export class Header extends React.Component {
         <Navbar className="nav-style" light expand="md">
           <div>
             <Link to="/" className="nav-brand">
-              Communitee
+              CSLC
             </Link>
           </div>
           <NavbarToggler onClick={this.toggle} />

src/components/inputs/input.js → src/components/Inputs/Input.js

@@ -3,9 +3,7 @@ import 'bootstrap/dist/css/bootstrap.css';
 import PropTypes from 'prop-types';
 import './inputs.scss';
 
-const InputField = ({
-  id, type, placeholder, name, onChange, value,
-}) => (
+const InputField = ({ id, type, placeholder, name, onChange, value }) => (
   <Fragment>
     <input
       id={id}

src/components/ResetPassword/ResetPassword.js

@@ -1,27 +1,28 @@
-/* eslint-disable react/prop-types */
-/* eslint-disable react/destructuring-assignment */
-/* eslint-disable no-tabs */
-import React, { PureComponent } from 'react';
-import {
-  CardText, CardBody, CardTitle, CardSubtitle, FormGroup,
-} from 'reactstrap';
+import React, { Component } from 'react';
+import { CardText, CardBody, CardSubtitle, FormGroup } from 'reactstrap';
 import { connect } from 'react-redux';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import propTypes from 'prop-types';
 import './resetpassword.scss';
-import { ResetPassword } from '../../../store/actions/authActions/resetPassword';
-import Card from '../Card';
+import * as actions from '../../../store/actions/authActions/resetPassword';
+import Card from '../Card/Card';
 import Button from '../Button';
 import Input from '../Inputs/Input';
 import Footer from '../Footer/Footer';
+import { Header } from '../Header/Header';
+import { Heading } from '../Heading/Heading';
+
 /**
  * @description
  * @param
  * @returns
  */
-export class ResetPasswordCard extends PureComponent {
+export class ResetPasswordCard extends Component {
   constructor(props) {
     super(props);
-    // this.handleSubmit = this.handleSubmit.bind(this);
+
+    this.handleSubmit = this.handleSubmit.bind(this);
+    this.handleEmail = this.handleEmail.bind(this);
     this.state = {
       email: '',
     };
@@ -33,40 +34,37 @@ export class ResetPasswordCard extends PureComponent {
   }
 
   handleSubmit() {
+    const { ResetPassword, history } = this.props;
     const { email } = this.state;
-
-    // eslint-disable-next-line react/prop-types
-    this.props.ResetPassword(email, this.props.history);
+    ResetPassword(email, history);
   }
 
   render() {
+    const { passwordResetSuccess, passwordResetError, loading } = this.props;
     return (
-      <div className="container">
+      <div className="containers">
         <div className="bg-image" />
+        <Header />
         <Card>
           <CardBody>
             <CardSubtitle>
-              <i className="fas fa-lock" />
+              <FontAwesomeIcon icon="lock" className="FontAwesomeIcon" />
             </CardSubtitle>
-            <CardTitle className="forgot"> Forgot Password? </CardTitle>
+            <Heading title="Forgot Password?" />
             <CardText>
-							Please enter your email address here and we will send you information to change your
-							password
+              Please enter your email address here and we will
+              send you information to change your password
             </CardText>
-            <div className="success">{this.props.passwordResetSuccess}</div>
+            <div className="success">{passwordResetSuccess}</div>
             <FormGroup>
-              <Input
-                placeholder="Email"
-                id="email"
-                onChange={e => this.handleEmail(e)}
-              />
-              <div className="error">{this.props.passwordResetError}</div>
+              <Input placeholder="Email" id="email" onChange={e => this.handleEmail(e)} />
+              <div className="error">{passwordResetError}</div>
             </FormGroup>
             <Button
-              classname="button"
+              classname="buttons"
               type="button"
               onClick={e => this.handleSubmit(e)}
-              text={this.props.loading === true ? 'Loading...' : 'Reset Password'}
+              text={loading === true ? 'Loading...' : 'Reset Password'}
             />
           </CardBody>
         </Card>
@@ -77,17 +75,20 @@ export class ResetPasswordCard extends PureComponent {
 }
 
 const mapDispatchToProps = {
-  ResetPassword,
+  ResetPassword: actions.ResetPassword,
 };
 
 const mapStateToProps = state => ({
   passwordResetError: state.auth.passwordResetError,
   passwordResetSuccess: state.auth.passwordResetSuccess,
-  loading: state.auth.loading,
+  loading: state.auth.isLoading,
 });
 
 ResetPasswordCard.propTypes = {
-  // eslint-disable-next-line react/require-default-props
   ResetPassword: propTypes.func,
+  history: propTypes.string,
+  loading: propTypes.bool,
+  passwordResetError: propTypes.string,
+  passwordResetSuccess: propTypes.string,
 };
 export default connect(mapStateToProps, mapDispatchToProps)(ResetPasswordCard);