IO-761 User Reset updates

client/src/components/user-request-pw-reset/user-request-reset-pw.component.jsx

@@ -4,7 +4,10 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import ImEXOnlineLogo from "../../assets/logo192.png";
-import { sendPasswordReset } from "../../redux/user/user.actions";
+import {
+  sendPasswordReset,
+  sendPasswordResetAgain,
+} from "../../redux/user/user.actions";
 import { selectPasswordReset } from "../../redux/user/user.selectors";
 import AlertComponent from "../alert/alert.component";
 import "./user-request-pw-reset.styles.scss";
@@ -14,9 +17,14 @@ const mapStateToProps = createStructuredSelector({
 });
 const mapDispatchToProps = (dispatch) => ({
   sendPasswordReset: (email) => dispatch(sendPasswordReset(email)),
+  sendPasswordResetAgain: (email) => dispatch(sendPasswordResetAgain(email)),
 });
 
-export function UserRequestResetPw({ passwordReset, sendPasswordReset }) {
+export function UserRequestResetPw({
+  passwordReset,
+  sendPasswordReset,
+  sendPasswordResetAgain,
+}) {
   const handleFinish = (values) => {
     try {
       sendPasswordReset(values.email);
@@ -35,7 +43,8 @@ export function UserRequestResetPw({ passwordReset, sendPasswordReset }) {
         extra={[
           <Button
             key="send-again"
-            onClick={() => sendPasswordReset(passwordReset.email)}
+            onClick={() => sendPasswordResetAgain(passwordReset.email)}
+            loading={passwordReset.loading}
           >
             {t("general.labels.sendagain")}
           </Button>,
@@ -68,7 +77,12 @@ export function UserRequestResetPw({ passwordReset, sendPasswordReset }) {
         {passwordReset.error ? (
           <AlertComponent message={passwordReset.error} type="warning" />
         ) : null}
-        <Button className="login-btn" type="primary" htmlType="submit">
+        <Button
+          className="login-btn"
+          type="primary"
+          htmlType="submit"
+          loading={passwordReset.loading}
+        >
           {t("general.actions.submit")}
         </Button>
       </Form>

client/src/redux/user/user.actions.js

@@ -77,6 +77,12 @@ export const sendPasswordReset = (email) => ({
   type: UserActionTypes.SEND_PASSWORD_RESET_EMAIL_START,
   payload: email,
 });
+
+export const sendPasswordResetAgain = (email) => ({
+  type: UserActionTypes.SEND_PASSWORD_RESET_EMAIL_START_AGAIN,
+  payload: email,
+});
+
 export const sendPasswordResetFailure = (error) => ({
   type: UserActionTypes.SEND_PASSWORD_RESET_EMAIL_FAILURE,
   payload: error,

client/src/redux/user/user.reducer.js

@@ -13,6 +13,7 @@ const INITIAL_STATE = {
     email: null,
     error: null,
     success: false,
+    loading: false,
   },
   authLevel: 0,
 };
@@ -33,6 +34,17 @@ const userReducer = (state = INITIAL_STATE, action) => {
           email: action.payload,
           error: null,
           success: false,
+          loading: true,
+        },
+      };
+    case UserActionTypes.SEND_PASSWORD_RESET_EMAIL_START_AGAIN:
+      return {
+        ...state,
+        passwordreset: {
+          email: action.payload,
+          error: null,
+          success: true,
+          loading: true,
         },
       };
     case UserActionTypes.VALIDATE_PASSWORD_RESET_FAILURE:
@@ -42,7 +54,11 @@ const userReducer = (state = INITIAL_STATE, action) => {
     case UserActionTypes.SEND_PASSWORD_RESET_EMAIL_SUCCESS:
       return {
         ...state,
-        passwordreset: { ...state.passwordreset, success: true },
+        passwordreset: {
+          ...state.passwordreset,
+          success: true,
+          loading: false,
+        },
       };
     case UserActionTypes.SIGN_IN_SUCCESS:
       return {

client/src/redux/user/user.sagas.js

@@ -170,6 +170,10 @@ export function* onSendPasswordResetStart() {
     UserActionTypes.SEND_PASSWORD_RESET_EMAIL_START,
     sendPasswordResetEmail
   );
+  yield takeLatest(
+    UserActionTypes.SEND_PASSWORD_RESET_EMAIL_START_AGAIN,
+    sendPasswordResetEmail
+  );
 }
 export function* sendPasswordResetEmail({ payload }) {
   try {

client/src/redux/user/user.types.js

@@ -21,6 +21,8 @@ const UserActionTypes = {
   SET_INSTANCE_CONFLICT: "SET_INSTANCE_CONFLICT",
   SET_LOCAL_FINGERPRINT: "SET_LOCAL_FINGERPRINT",
   SEND_PASSWORD_RESET_EMAIL_START: "SEND_PASSWORD_RESET_EMAIL_START",
+  SEND_PASSWORD_RESET_EMAIL_START_AGAIN:
+    "SEND_PASSWORD_RESET_EMAIL_START_AGAIN",
   SEND_PASSWORD_RESET_EMAIL_FAILURE: "SEND_PASSWORD_RESET_EMAIL_FAILURE",
   SEND_PASSWORD_RESET_EMAIL_SUCCESS: "SEND_PASSWORD_RESET_EMAIL_SUCCESS",
   VALIDATE_PASSWORD_RESET_START: "VALIDATE_PASSWORD_RESET_START",