Ensure input fields are cleared after submit or cancel

src/ui/change-password-form-ui-handler.ts

@@ -66,13 +66,9 @@ export class ChangePasswordFormUiHandler extends FormModalUiHandler {
     return inputFieldConfigs;
   }
 
-  override show(args: any[]): boolean {
+  override show(args: [ModalConfig, ...any]): boolean {
-    console.log("=========================1=======================");
     if (super.show(args)) {
-      // Forces the modal to show above the others
+      const config = args[0];
-      // this.modalContainer.parentContainer?.bringToTop(this.modalContainer);
-      console.log("========================2========================");
-      const config = args[0] as ModalConfig;
       const originalSubmitAction = this.submitAction;
       this.submitAction = () => {
         if (globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
@@ -95,12 +91,25 @@ export class ChangePasswordFormUiHandler extends FormModalUiHandler {
           pokerogueApi.account.changePassword({ password: passwordInput.text }).then(error => {
             if (!error && originalSubmitAction) {
               originalSubmitAction();
+              // Only clear inputs if the action was successful
+              for (const input of this.inputs) {
+                input.setText("");
+              }
             } else {
               onFail(error);
             }
           });
         }
       };
+      // Upon pressing cancel, the inputs should be cleared
+      const originalCancelAction = this.cancelAction;
+      this.cancelAction = () => {
+        console.log("Change password form cancelled");
+        for (const input of this.inputs) {
+          input.setText("");
+        }
+        originalCancelAction?.();
+      };
 
       return true;
     }

src/ui/form-modal-ui-handler.ts

@@ -18,6 +18,7 @@ export abstract class FormModalUiHandler extends ModalUiHandler {
   protected inputs: InputText[];
   protected errorMessage: Phaser.GameObjects.Text;
   protected submitAction: Function | null;
+  protected cancelAction: (() => void) | null;
   protected tween: Phaser.Tweens.Tween;
   protected formLabels: Phaser.GameObjects.Text[];
 
@@ -113,22 +114,37 @@ export abstract class FormModalUiHandler extends ModalUiHandler {
     });
   }
 
-  show(args: any[]): boolean {
+  override show(args: any[]): boolean {
     if (super.show(args)) {
       this.inputContainers.map(ic => ic.setVisible(true));
 
       const config = args[0] as FormModalConfig;
 
       this.submitAction = config.buttonActions.length ? config.buttonActions[0] : null;
+      this.cancelAction = config.buttonActions[1] ?? null;
 
-      if (this.buttonBgs.length) {
+      // #region: Override button pointerDown
-        this.buttonBgs[0].off("pointerdown");
+      // Override the pointerDown event for the buttonBgs to call the `submitAction` and `cancelAction`
-        this.buttonBgs[0].on("pointerdown", () => {
+      // properties that we set above, allowing their behavior to change after this method terminates
-          if (this.submitAction && globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
+      // Some subclasses use this to add behavior to the submit and cancel action
-            this.submitAction();
+
+      this.buttonBgs[0].off("pointerdown");
+      this.buttonBgs[0].on("pointerdown", () => {
+        if (this.submitAction && globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
+          this.submitAction();
+        }
+      });
+      const cancelBg = this.buttonBgs[1];
+      if (cancelBg) {
+        cancelBg.off("pointerdown");
+        cancelBg.on("pointerdown", () => {
+          // The seemingly redundant cancelAction check is intentionally left in as a defensive programming measure
+          if (this.cancelAction && globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
+            this.cancelAction();
           }
         });
       }
+      //#endregion: Override pointerDown events
 
       this.modalContainer.y += 24;
       this.modalContainer.setAlpha(0);

src/ui/modal-ui-handler.ts

@@ -6,7 +6,7 @@ import type { Button } from "#enums/buttons";
 import { globalScene } from "#app/global-scene";
 
 export interface ModalConfig {
-  buttonActions: Function[];
+  buttonActions: ((...args: any[]) => any)[];
 }
 
 export abstract class ModalUiHandler extends UiHandler {