From f06d9e9e5e09c25d2b8b777d1b71a84d4ce20d66 Mon Sep 17 00:00:00 2001
From: Scott Kiener <scott.kiener@safelite.com>
Date: Mon, 13 Nov 2023 14:23:40 -0500
Subject: [PATCH] CSR-1452 | Loading modal spinner for revalidate
 (payment-method)

---
 .../loading-modal/loading-modal.vue           | 24 ++++++++++---------
 src/layouts/payment-method/payment-method.vue |  2 ++
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/fmg-components/loading-modal/loading-modal.vue b/src/fmg-components/loading-modal/loading-modal.vue
index c3722000b..820ff6f7b 100644
--- a/src/fmg-components/loading-modal/loading-modal.vue
+++ b/src/fmg-components/loading-modal/loading-modal.vue
@@ -54,6 +54,14 @@
 </template>
 
 <script>
+const windowPageShowCallback = function (evt) {
+    if (evt.persisted) {
+        setTimeout(function () {
+            window.location.reload();
+        }, 10);
+    }
+};
+
 export default {
     name: "Modal",
     data() {
@@ -93,17 +101,11 @@ export default {
             this.isModalTextCarouselVisible = showTextCarousel;
             this.isModalVisible = true;
             //Force page reload on back button
-            window.addEventListener(
-                "pageshow",
-                function (evt) {
-                    if (evt.persisted) {
-                        setTimeout(function () {
-                            window.location.reload();
-                        }, 10);
-                    }
-                },
-                false
-            );
+            window.addEventListener("pageshow", windowPageShowCallback, false);
+        },
+        hideModal() {
+            this.isModalVisible = false;
+            window.removeEventListener("pageshow", windowPageShowCallback, false);
         },
     },
 };
diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index 5dc83bbe0..d32c03fdc 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -323,6 +323,7 @@ export default {
             return this.$store.getters.order.payment.inactivePromos;
         },
         async revalidatePromos() {
+            this.$refs.loadingModal.showModal();
             const revalidatePromoResponse = await baseMixin.methods.dispatchStoreActionWithLogging(
                 storeActions.REVALIDATE_ORDER_PROMOS_AND_SAVE_SERVER_DATA,
                 {
@@ -344,6 +345,7 @@ export default {
 
             this.lineItems.promos = revalidatePromoResponse.promoLineItems;
             this.inactivePromos = revalidatePromoResponse.errors.map((x) => x.promoCode);
+            this.$refs.loadingModal.hideModal();
         },
         backButtonAction() {
             this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);