From 847df443492a8117b470a46af31347f374b541fc Mon Sep 17 00:00:00 2001
From: Zainab Amir <zainab.amir@arbisoft.com>
Date: Wed, 3 Feb 2021 17:33:47 +0500
Subject: [PATCH] VAN-299: Add header to Password Reset Alert (#119)

---
 src/reset-password/ResetPasswordPage.jsx      |  5 ++--
 .../ResetPasswordPage.test.jsx.snap           | 29 ++++++++++++++++---
 2 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/src/reset-password/ResetPasswordPage.jsx b/src/reset-password/ResetPasswordPage.jsx
index 8f6e9aeb..c02458b5 100644
--- a/src/reset-password/ResetPasswordPage.jsx
+++ b/src/reset-password/ResetPasswordPage.jsx
@@ -87,11 +87,10 @@ const ResetPasswordPage = (props) => {
       <>
         <div id="main" className="d-flex justify-content-center m-4" ref={mainRef}>
           <div className="d-flex flex-column mw-500">
-            {props.status === 'failure' ? <Alert variant="danger">{props.errors}</Alert> : null}
-            {emptyFieldError && (
+            {(emptyFieldError || props.status) && (
               <Alert id="validation-errors" variant="danger">
                 <Alert.Heading>{intl.formatMessage(messages['forgot.password.empty.new.password.error.heading'])}</Alert.Heading>
-                <ul><li>{intl.formatMessage(messages['reset.password.empty.new.password.field.error'])}</li></ul>
+                <ul><li>{emptyFieldError || props.errors}</li></ul>
               </Alert>
             )}
             <Form>
diff --git a/src/reset-password/tests/__snapshots__/ResetPasswordPage.test.jsx.snap b/src/reset-password/tests/__snapshots__/ResetPasswordPage.test.jsx.snap
index 707f8d69..269e30b7 100644
--- a/src/reset-password/tests/__snapshots__/ResetPasswordPage.test.jsx.snap
+++ b/src/reset-password/tests/__snapshots__/ResetPasswordPage.test.jsx.snap
@@ -47,7 +47,20 @@ exports[`ResetPasswordPage should match pending reset message section snapshot 1
   <div
     className="d-flex flex-column mw-500"
   >
-    
+    <div
+      className="fade alert alert-danger show"
+      id="validation-errors"
+      role="alert"
+    >
+      <div
+        className="alert-heading h4"
+      >
+        We couldn't reset your password.
+      </div>
+      <ul>
+        <li />
+      </ul>
+    </div>
     <form
       className=""
     >
@@ -155,7 +168,6 @@ exports[`ResetPasswordPage should match reset password default section snapshot
   <div
     className="d-flex flex-column mw-500"
   >
-    
     <form
       className=""
     >
@@ -282,11 +294,20 @@ exports[`ResetPasswordPage should match unsuccessful reset message section snaps
   >
     <div
       className="fade alert alert-danger show"
+      id="validation-errors"
       role="alert"
     >
-      Password reset was unsuccessful.
+      <div
+        className="alert-heading h4"
+      >
+        We couldn't reset your password.
+      </div>
+      <ul>
+        <li>
+          Password reset was unsuccessful.
+        </li>
+      </ul>
     </div>
-    
     <form
       className=""
     >