From 7f0fb3d932a68a9f3db05dbda030c3597e18719b Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Sun, 12 Nov 2023 05:43:48 -0500
Subject: [PATCH] final error states

---
 .../password_reset/PasswordResetVerificationPage.tsx  | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/packages/fakeyou.com/src/v2/view/pages/password_reset/PasswordResetVerificationPage.tsx b/packages/fakeyou.com/src/v2/view/pages/password_reset/PasswordResetVerificationPage.tsx
index bc4a99b372..2140abf903 100644
--- a/packages/fakeyou.com/src/v2/view/pages/password_reset/PasswordResetVerificationPage.tsx
+++ b/packages/fakeyou.com/src/v2/view/pages/password_reset/PasswordResetVerificationPage.tsx
@@ -23,6 +23,7 @@ const ERR_CODE_NOT_SET = "password reset code is not set";
 const ERR_CODE_TOO_SHORT = "password reset code is too short";
 const ERR_PASSWORD_TOO_SHORT = "new password is too short";
 const ERR_PASSWORD_DOES_NOT_MATCH = "new password does not match";
+const ERR_BACKEND = "There was an issue resetting your password. Perhaps your code expired?";
 
 function PasswordResetVerificationPage(props: Props) {
   let history = useHistory();
@@ -41,6 +42,8 @@ function PasswordResetVerificationPage(props: Props) {
   const [newPasswordConfirmationIsValid, setNewPasswordConfirmationIsValid] = useState(false);
   const [newPasswordConfirmationInvalidReason, setNewPasswordConfirmationInvalidReason] = useState<string|undefined>(ERR_PASSWORD_TOO_SHORT);
 
+  const [backendError, setBackendError] = useState<string|undefined>(undefined);
+
   if (props.sessionWrapper.isLoggedIn()) {
     history.push("/");
   }
@@ -116,9 +119,12 @@ function PasswordResetVerificationPage(props: Props) {
     // TODO(bt,2023-11-12): Handle server-side errors
 
     if (RedeemResetPasswordIsSuccess(response)) {
+      setBackendError(undefined);
       props.querySessionAction();
       props.querySessionSubscriptionsAction();
       history.push("/");
+    } else {
+      setBackendError(ERR_BACKEND);
     }
 
     return false;
@@ -129,6 +135,7 @@ function PasswordResetVerificationPage(props: Props) {
   let resetTokenHelpClasses = resetTokenLooksValid ? "" : "form-control is-danger";
   let newPasswordHelpClasses = newPasswordIsValid ? "" : "form-control is-danger";
   let newPasswordConfirmationHelpClasses = newPasswordConfirmationIsValid ? "" : "form-control is-danger";
+  let backendErrorClasses = !!!backendError ? "" : "form-control is-danger";
 
   return (
     <Container type="panel" className="login-panel">
@@ -180,6 +187,10 @@ function PasswordResetVerificationPage(props: Props) {
               {newPasswordConfirmationInvalidReason}
             </p>
 
+            <p className={backendErrorClasses}>
+              {backendError}
+            </p>
+
             <Button
               label="Change Password"
               onClick={handleSubmit}