From d61825dc20ee477fb9b9d57c598a34fd6b793da8 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Tue, 7 Nov 2023 13:45:30 -0500
Subject: [PATCH 01/16] CSR-1728 set width to prevent copy going past Edit
 button on review page.

---
 src/layouts/review/review-block/review-block.vue | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/layouts/review/review-block/review-block.vue b/src/layouts/review/review-block/review-block.vue
index 0580a617d..c831c86da 100644
--- a/src/layouts/review/review-block/review-block.vue
+++ b/src/layouts/review/review-block/review-block.vue
@@ -55,4 +55,7 @@ export default {
 :deep(.review-block-content > ul) {
     margin-bottom: 0rem;
 }
+.review-block-content {
+    width: 90%;
+}
 </style>

From f51817033d82396500180da483965c396983b310 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Tue, 7 Nov 2023 14:17:48 -0500
Subject: [PATCH 02/16] CSR-1722 fix font weight and spacing issues.

---
 src/fmg-components/cart/cart.vue                      | 11 +++++++++--
 .../payment-method-question.vue                       |  1 +
 src/layouts/payment-method/payment-method.vue         |  2 +-
 3 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/fmg-components/cart/cart.vue b/src/fmg-components/cart/cart.vue
index a6290e46c..a5ab80faa 100644
--- a/src/fmg-components/cart/cart.vue
+++ b/src/fmg-components/cart/cart.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="cart mb-4">
+    <div class="cart mb-5">
         <div class="px-0">
             <div
                 class="row vin-toggle flex align-items-center"
@@ -33,7 +33,6 @@
                 </div>
 
                 <!-- Nonpackaged Cart Items -->
-                <hr style="background: red" />
                 <div
                     class="premium-appt-cart-item"
                     v-for="(cartItem, i) in nonpackageCartItems"
@@ -802,4 +801,12 @@ export default {
         }
     }
 }
+.payment-method-question {
+    .question-text {
+        margin: 1rem 0 0.5rem 0;
+    }
+    span {
+        line-height: 24px;
+    }
+}
 </style>
diff --git a/src/layouts/payment-method/payment-method-question/payment-method-question.vue b/src/layouts/payment-method/payment-method-question/payment-method-question.vue
index 1544cede7..b960f60f5 100644
--- a/src/layouts/payment-method/payment-method-question/payment-method-question.vue
+++ b/src/layouts/payment-method/payment-method-question/payment-method-question.vue
@@ -77,6 +77,7 @@ export default {
 .payment-method-question {
     .question-text span {
         text-align: left;
+        line-height: 24px;
     }
 }
 </style>
diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index 8a5f3a21d..b9838fd30 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -30,7 +30,7 @@
                         @cart-remove="cartRemove"
                         recyclingModalCmsWidgetName="RecycleModal" />
 
-                    <hr />
+                    <hr class="my-5"/>
 
                     <div>
                         <alert

From 4dec7a3df7b386906d722be525978c6c6417126e Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Tue, 7 Nov 2023 14:27:01 -0500
Subject: [PATCH 03/16] Format code.

---
 src/layouts/payment-method/payment-method.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index b9838fd30..be7cac978 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -30,7 +30,7 @@
                         @cart-remove="cartRemove"
                         recyclingModalCmsWidgetName="RecycleModal" />
 
-                    <hr class="my-5"/>
+                    <hr class="my-5" />
 
                     <div>
                         <alert

From fa2bccb5189c3a6fa6e3c8afacbd4d2348b2c5fa Mon Sep 17 00:00:00 2001
From: Scott Kiener <scott.kiener@safelite.com>
Date: Tue, 7 Nov 2023 15:34:31 -0500
Subject: [PATCH 04/16] CSR-1452 | More promo logic

Watch lineItems to automatically run revalidate when the cart changes
Add in auto add of addable vaps in beforeRouteEnter
Create adding of addableVaps to order in promo helper
---
 src/helpers/promotions-helper.js              | 26 ++++++++++++
 .../add-vaps-modal-buttons.vue                | 14 +++++--
 src/layouts/payment-method/payment-method.vue | 40 ++++++++++++++++++-
 3 files changed, 75 insertions(+), 5 deletions(-)

diff --git a/src/helpers/promotions-helper.js b/src/helpers/promotions-helper.js
index a5d94789b..1689d9550 100644
--- a/src/helpers/promotions-helper.js
+++ b/src/helpers/promotions-helper.js
@@ -1,6 +1,7 @@
 import store from "@/store";
 import { storeActions } from "@/constants/store-actions";
 import { partTypeStrings } from "@/constants/part-type-strings";
+import { deepClone } from "@/helpers/object-helper";
 import baseMixin from "@/mixins/base-mixin.js";
 
 export const promoPartNumberStrings = {
@@ -126,6 +127,31 @@ export function getPromosThatMatchLineItemsOnOrder(promos, lineItemsOnOrder) {
     return matchingPromos;
 }
 
+// Returns the vaps that the provided <promos> requires to be on the order to satisfy
+//  Items that are already in <lineItemsOnOrder> will not be returned
+export function getVapsThatNeedToBeAddedToSatisfyPromos(
+    promos,
+    availableLineItems,
+    lineItemsOnOrder
+) {
+    const clonedVaps = deepClone(lineItemsOnOrder.vaps ?? []);
+    const promosWithAddableVaps = getPromosWithAddableVaps(promos);
+    if (promosWithAddableVaps.length) {
+        const matchingLineItems = getLineItemsThatMatchPromos(
+            promosWithAddableVaps,
+            availableLineItems
+        );
+        // Check if matching items are already in the order
+        const idsOfVapsAlreadyInOrder = clonedVaps.map((lineItem) => lineItem.id);
+        const vapsToAddToCart = matchingLineItems.filter(
+            (lineItem) => !idsOfVapsAlreadyInOrder.includes(lineItem.id)
+        );
+        return vapsToAddToCart;
+    } else {
+        return [];
+    }
+}
+
 export function shouldStripPromoQueryString(fmgPageQueryValue) {
     return pagesToStripPromoQueryStringFrom.includes(fmgPageQueryValue);
 }
diff --git a/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue b/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
index bb378c619..b4fa7a3b0 100644
--- a/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
+++ b/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
@@ -97,7 +97,11 @@ export default {
             this.$refs[modalName].closeModal();
         },
         addRainDefenseToCart(modalName, part) {
-            this.currentCartItems.vaps.push(part);
+            // Clone vaps array, then replace this.currentCartItems.vaps with it at the end
+            //  in order to successfully trigger parent's watcher
+            const clonedVaps = this.currentCartItems.vaps.slice(0);
+            clonedVaps.push(part);
+            this.currentCartItems.vaps = clonedVaps;
             this.closeModal(modalName);
             const message = this.getRainDefenseAddedMessage();
             this.$emit("added-to-cart", {
@@ -133,19 +137,23 @@ export default {
                     this.selectedWipers = ["REAR"];
                 }
             }
+            // Clone vaps array, then replace this.currentCartItems.vaps with it at the end
+            //  in order to successfully trigger parent's watcher
+            const clonedVaps = this.currentCartItems.vaps.slice(0);
 
             itemsForCart.forEach((type) => {
                 if (type === wipersOfferedStrings.FRONT) {
                     part.frontWiperLineItems.forEach((part) => {
-                        this.currentCartItems.vaps.push(part);
+                        clonedVaps.push(part);
                     });
                 }
                 if (type === wipersOfferedStrings.REAR) {
                     part.rearWiperLineItems.forEach((part) => {
-                        this.currentCartItems.vaps.push(part);
+                        clonedVaps.push(part);
                     });
                 }
             });
+            this.currentCartItems.vaps = clonedVaps;
 
             this.closeModal(modalName);
 
diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index 8a5f3a21d..6e87235b0 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -88,7 +88,8 @@ import { paymentMethods } from "@/constants/payment-method-constants";
 import { experimentSettings } from "@/constants/experiments";
 import {
     revalidatePromosAndValidateNewPromo,
-    getAddableVapsFromAvailableLineItems,
+    getPromosWithAddableVaps,
+    getVapsThatNeedToBeAddedToSatisfyPromos,
 } from "@/helpers/promotions-helper";
 import { queryStrings } from "@/constants/query-strings";
 import { getQuerystringParameter } from "@/helpers/querystring-helper";
@@ -177,7 +178,9 @@ export default {
                 "payment-method"
             );
 
-        availableLineItems.push(...(validatePromoResponse?.orderPromos ?? []));
+        const newValidatedPromos = validatePromoResponse?.orderPromos ?? [];
+
+        availableLineItems.push(...newValidatedPromos);
         // End of promo logic
 
         const taxedAvailableLineItems = await baseMixin.methods.dispatchStoreActionWithLogging(
@@ -201,6 +204,15 @@ export default {
             availableLineItems,
             lineItemsFromStore
         );
+        // Add items that were not in the store yet but added via query string promo validation
+        lineItems.promos = lineItems.promos ?? [];
+        lineItems.promos.push(...newValidatedPromos);
+        const vapsToAddToCart = getVapsThatNeedToBeAddedToSatisfyPromos(
+            newValidatedPromos,
+            availableLineItems,
+            lineItems
+        );
+        lineItems.vaps.push(...vapsToAddToCart);
 
         // Call the "next" function to complete the transition to this page.
         next((vm) => {
@@ -412,11 +424,35 @@ export default {
         shouldDisplayPiaAlert() {
             return this.$route.params[this.routerParams.DISPLAY_PIA_ALERT];
         },
+        // Necessary to make the watcher of lineItems work
+        // JavaScript does not keep a record of the old value, only a reference to it's location in the memory.
+        //  This creates a separate location for oldValue/newValue so they can be compared
+        // See Vue github issue #2164
+        lineItemsCloneForWatcher() {
+            return Object.assign({}, this.lineItems);
+        },
     },
     watch: {
         customCtaCopy(newValue) {
             this.updateFooterButtonText(newValue);
         },
+        lineItemsCloneForWatcher: {
+            handler(newValue, oldValue) {
+                if (
+                    !oldValue ||
+                    oldValue.length == 0 ||
+                    !oldValue.vaps ||
+                    !newValue ||
+                    newValue.length == 0
+                ) {
+                    return;
+                }
+                if (oldValue.vaps.length != newValue.vaps.length) {
+                    this.revalidatePromos();
+                }
+            },
+            deep: true,
+        },
     },
     components: {
         funnelHeader,

From ccbb9b18efc4d277e5efa7f4b179265cd9fb4cf6 Mon Sep 17 00:00:00 2001
From: hiteshkumar87 <hitesh.kumar@safelite.com>
Date: Wed, 8 Nov 2023 16:38:18 +0530
Subject: [PATCH 05/16] Appointment EndTime

Appointment end time for Inshop and Dropoff Schedules
---
 src/layouts/confirmation/confirmation.vue     | 6 +++++-
 src/layouts/payment-method/payment-method.vue | 2 +-
 src/layouts/payment/payment.vue               | 2 +-
 src/layouts/review/review.vue                 | 2 +-
 4 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/layouts/confirmation/confirmation.vue b/src/layouts/confirmation/confirmation.vue
index 177e0ff93..1cd2fa4fb 100644
--- a/src/layouts/confirmation/confirmation.vue
+++ b/src/layouts/confirmation/confirmation.vue
@@ -238,7 +238,11 @@ export default {
             const schedule = store.getters.order.schedule;
             const scheduleReqs = !!(schedule.date && schedule.startTime && schedule.endTime);
 
-            return serviceLocationReqs && scheduleReqs;
+            // Customer
+            const customer = store.getters.order.customer;
+            const customerReqs = !!customer.emailAddress;
+
+            return serviceLocationReqs && scheduleReqs && customerReqs;
         },
         forwardButtonAction() {
             window.location.assign("//www.safelite.com/");
diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index 867dbb3fd..9f9df5f52 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -266,7 +266,7 @@ export default {
             const scheduleReqs = !!(
                 schedule.date &&
                 schedule.startTime &&
-                (!isMobile || schedule.endTime) &&
+                schedule.endTime &&
                 schedule.jobMaxMinutes &&
                 schedule.jobMinMinutes
             );
diff --git a/src/layouts/payment/payment.vue b/src/layouts/payment/payment.vue
index 6cae579ce..a6340b5db 100644
--- a/src/layouts/payment/payment.vue
+++ b/src/layouts/payment/payment.vue
@@ -312,7 +312,7 @@ export default {
             const scheduleReqs = !!(
                 schedule.date &&
                 schedule.startTime &&
-                (!isMobile || schedule.endTime) &&
+                schedule.endTime &&
                 schedule.jobMaxMinutes &&
                 schedule.jobMinMinutes
             );
diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue
index 0011e79f7..d6ad0aa82 100644
--- a/src/layouts/review/review.vue
+++ b/src/layouts/review/review.vue
@@ -207,7 +207,7 @@ export default {
             const scheduleReqs = !!(
                 schedule.date &&
                 schedule.startTime &&
-                (!isMobile || schedule.endTime) &&
+                schedule.endTime &&
                 schedule.jobMaxMinutes &&
                 schedule.jobMinMinutes
             );

From 1f602079838d246fbb48961f09fcade73ab67fe2 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Wed, 8 Nov 2023 10:20:11 -0500
Subject: [PATCH 06/16] CSR-1391 update window height and styles for Afterpay.

---
 public/css/site-2020Styling.css   | 15 +++++++++++++++
 public/scss/site-2020Styling.scss | 19 +++++++++++++++++++
 src/layouts/payment/payment.vue   |  2 +-
 3 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/public/css/site-2020Styling.css b/public/css/site-2020Styling.css
index d42d3a81d..beb4c3ec5 100644
--- a/public/css/site-2020Styling.css
+++ b/public/css/site-2020Styling.css
@@ -87,6 +87,21 @@
   display: none;
 }
 
+#afterpay__iframe-checkout-container {
+  width: 100%;
+}
+#afterpay__iframe-checkout-container .style_closeWrapper__lIHJe {
+  display: none;
+}
+
+.buy-container-closer {
+  display: none;
+}
+
+.buy-backdrop {
+  background-color: rgba(0, 0, 0, 0.3) !important;
+}
+
 @keyframes rotate {
   0% {
     transform: rotate(0);
diff --git a/public/scss/site-2020Styling.scss b/public/scss/site-2020Styling.scss
index fd716f6ee..395eebcb2 100644
--- a/public/scss/site-2020Styling.scss
+++ b/public/scss/site-2020Styling.scss
@@ -90,6 +90,25 @@
     }
 }
 
+// AfterPay Styles
+
+#afterpay__iframe-checkout-container {
+    width: 100%;
+    .style_closeWrapper__lIHJe {
+        display: none;
+    }
+}
+
+.buy-container-closer {
+    display: none;
+}
+
+.buy-backdrop {
+    background-color: rgba(0,0,0,.3)!important;
+}
+
+// Modal Spinner
+
 @keyframes rotate {
     0% {  transform: rotate(0)}
     100% { transform: rotate(360deg)}
diff --git a/src/layouts/payment/payment.vue b/src/layouts/payment/payment.vue
index a6340b5db..513a9318e 100644
--- a/src/layouts/payment/payment.vue
+++ b/src/layouts/payment/payment.vue
@@ -474,7 +474,7 @@ export default {
 <style lang="scss">
 .hop-iframe {
     position: relative;
-    min-height: 1120px;
+    min-height: 650px;
     width: 100%;
     border: 0 none;
 }

From b7f8dd48460892b4a1ad5eb7784fa93f39b83162 Mon Sep 17 00:00:00 2001
From: Bryan Mauger <bryan.mauger@safelite.com>
Date: Wed, 8 Nov 2023 10:25:28 -0500
Subject: [PATCH 07/16] Code cleanup.

---
 public/css/site-2020Styling.css   | 11 +++++------
 public/scss/site-2020Styling.scss | 15 +++++++--------
 2 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/public/css/site-2020Styling.css b/public/css/site-2020Styling.css
index beb4c3ec5..07d331589 100644
--- a/public/css/site-2020Styling.css
+++ b/public/css/site-2020Styling.css
@@ -87,10 +87,13 @@
   display: none;
 }
 
-#afterpay__iframe-checkout-container {
+.buy-backdrop {
+  background-color: rgba(0, 0, 0, 0.3) !important;
+}
+.buy-backdrop #afterpay__iframe-checkout-container {
   width: 100%;
 }
-#afterpay__iframe-checkout-container .style_closeWrapper__lIHJe {
+.buy-backdrop #afterpay__iframe-checkout-container .style_closeWrapper__lIHJe {
   display: none;
 }
 
@@ -98,10 +101,6 @@
   display: none;
 }
 
-.buy-backdrop {
-  background-color: rgba(0, 0, 0, 0.3) !important;
-}
-
 @keyframes rotate {
   0% {
     transform: rotate(0);
diff --git a/public/scss/site-2020Styling.scss b/public/scss/site-2020Styling.scss
index 395eebcb2..3cd0839bc 100644
--- a/public/scss/site-2020Styling.scss
+++ b/public/scss/site-2020Styling.scss
@@ -92,10 +92,13 @@
 
 // AfterPay Styles
 
-#afterpay__iframe-checkout-container {
-    width: 100%;
-    .style_closeWrapper__lIHJe {
-        display: none;
+.buy-backdrop {
+    background-color: rgba(0,0,0,.3)!important;
+    #afterpay__iframe-checkout-container {
+        width: 100%;
+        .style_closeWrapper__lIHJe {
+            display: none;
+        }
     }
 }
 
@@ -103,10 +106,6 @@
     display: none;
 }
 
-.buy-backdrop {
-    background-color: rgba(0,0,0,.3)!important;
-}
-
 // Modal Spinner
 
 @keyframes rotate {

From 854885b6d92c43ac786efe9a5a80a2c4780fdf22 Mon Sep 17 00:00:00 2001
From: Chloe Herd <chloe.herd@safelite.com>
Date: Wed, 8 Nov 2023 14:03:48 -0500
Subject: [PATCH 08/16] Tie vehicle banner to submitted order on confirmation

---
 src/layouts/confirmation/confirmation.vue | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/layouts/confirmation/confirmation.vue b/src/layouts/confirmation/confirmation.vue
index 1cd2fa4fb..94a7054e7 100644
--- a/src/layouts/confirmation/confirmation.vue
+++ b/src/layouts/confirmation/confirmation.vue
@@ -14,6 +14,7 @@
                                 <div>
                                     <vehicleBanner
                                         cmsWidgetName="VehicleBannerWidget"
+                                        :displayVehicleImage="vehicleBannerImageUrl"
                                         :displayGenericVehicleImage="false" />
                                 </div>
                                 <div class="scheduleText">
@@ -205,6 +206,9 @@ export default {
                 return `at ${get12HourTimeFormat(this.ScheduleStartTime)}`;
             }
         },
+        vehicleBannerImageUrl() {
+            return store.getters.submittedOrder?.vehicle.imageUrl;
+        },
     },
     methods: {
         arePagePrerequisitesValid() {

From 68c89b97d8f3743f32aaf641a6a9a5b110a01054 Mon Sep 17 00:00:00 2001
From: Matt Caimi <matt.caimi@safelite.com>
Date: Wed, 8 Nov 2023 14:52:36 -0500
Subject: [PATCH 09/16] CSR-1391 add cart to payment page

---
 src/layouts/payment/payment.vue | 116 +++++++++++++++++++++++++++++++-
 1 file changed, 115 insertions(+), 1 deletion(-)

diff --git a/src/layouts/payment/payment.vue b/src/layouts/payment/payment.vue
index 6cae579ce..7c6d3ba73 100644
--- a/src/layouts/payment/payment.vue
+++ b/src/layouts/payment/payment.vue
@@ -21,6 +21,19 @@
                             scrolling="no">
                         </iframe>
                     </div>
+
+                    <hr />
+
+                    <cart
+                        :damage="damageInfo"
+                        :availableLineItems="availableLineItems"
+                        :allowItemRemoval="false"
+                        v-model="lineItems"
+                        servicePackageOptionsCmsName="ServicePackageTitle"
+                        recyclingModalCmsWidgetName="RecycleModal" />
+
+                    <hr />
+
                     <paymentSwitch
                         cmsWidgetName="PaymentMethodWidget"
                         :paymentType="paymentType"
@@ -163,7 +176,7 @@
 import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
 import navbar from "@/fmg-components/nav-bar/nav-bar";
 import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
-
+import cart from "@/fmg-components/cart/cart";
 import paymentSwitch from "./payment-switch/payment-switch.vue";
 
 import { storeActions } from "@/constants/store-actions";
@@ -175,6 +188,13 @@ import { applicationConfig } from "@/constants/application-config";
 import { paymentMethods } from "@/constants/payment-method-constants";
 import { AppointmentTypeStrings } from "@/constants/schedule-constants";
 import baseMixin from "@/mixins/base-mixin.js";
+import { mapTaxedAvailableLineItemsToStoreFormat } from "../../store";
+import {
+    revalidatePromosAndValidateNewPromo,
+    getAddableVapsFromAvailableLineItems,
+} from "@/helpers/promotions-helper";
+import { queryStrings } from "@/constants/query-strings";
+import { getQuerystringParameter } from "@/helpers/querystring-helper";
 
 import iframeResize from "../../../node_modules/iframe-resizer/js/iframeResizer.js";
 
@@ -207,6 +227,8 @@ export default {
             displayAmount: this.getDisplayAmountDue(),
             piaLineItems: this.getPiaLineItems(),
             paypalPayment: this.isPaypal(),
+            lineItems: [],
+            availableLineItems: [],
         };
     },
     directives: {
@@ -231,6 +253,24 @@ export default {
             "payment"
         );
 
+        const wipersPromise = baseMixin.methods.dispatchStoreActionWithLogging(
+            storeActions.GET_WIPERS,
+            null,
+            "payment"
+        );
+
+        const rainDefensePromise = baseMixin.methods.dispatchStoreActionWithLogging(
+            storeActions.GET_RAIN_DEFENSE,
+            null,
+            "payment"
+        );
+
+        const supportingItemsPromise = baseMixin.methods.dispatchStoreActionWithLogging(
+            storeActions.GET_SUPPORTING_ITEMS,
+            null,
+            "payment"
+        );
+
         // TODO: Data fetching Promise declarations
 
         const promiseResultMap = [
@@ -242,14 +282,84 @@ export default {
                 resultKey: "signature",
                 promise: signaturePromise,
             },
+            {
+                resultKey: "wipers",
+                promise: wipersPromise,
+            },
+            {
+                resultKey: "rainDefense",
+                promise: rainDefensePromise,
+            },
+            {
+                resultKey: "supportingItems",
+                promise: supportingItemsPromise,
+            },
         ];
 
         const resultMap = await settleAllPromises(promiseResultMap);
 
+        const glassParts = store.getters.order.lineItems.glassParts ?? [];
+
+        let availableLineItems = [
+            resultMap.rainDefense,
+            ...resultMap.supportingItems,
+            ...resultMap.wipers,
+            ...glassParts,
+        ];
+
+        const lineItemsFromStore = store.getters.order.lineItems;
+
+        await baseMixin.methods.dispatchStoreActionWithLogging(
+            storeActions.PRICE_ORDER_ITEMS_AND_SAVE_SERVER_DATA,
+            {
+                availableLineItems: availableLineItems,
+            },
+            "payment",
+            false
+        );
+
+        // Promo logic
+        const promoCodeFromQueryString = getQuerystringParameter(queryStrings.PROMO);
+
+        const { validatePromoResponse, revalidatePromoResponse } =
+            await revalidatePromosAndValidateNewPromo(
+                promoCodeFromQueryString,
+                availableLineItems,
+                "payment-method"
+            );
+
+        availableLineItems.push(...(validatePromoResponse?.orderPromos ?? []));
+        // End of promo logic
+
+        const taxedAvailableLineItems = await baseMixin.methods.dispatchStoreActionWithLogging(
+            storeActions.TAX_ORDER_ITEMS_AND_SAVE_SERVER_DATA,
+            {
+                billToAccountNumber: "87291",
+                providerNumber: store.getters.order.serviceLocation.provider.providerNumber,
+                appointmentType: store.getters.order.serviceLocation.appointmentType,
+                serviceLocationCity: store.getters.order.serviceLocation.city,
+                serviceLocationState: store.getters.order.serviceLocation.state,
+                serviceLocationZipCode: store.getters.order.serviceLocation.zipCode,
+                pricedAvailableLineItems: availableLineItems,
+            },
+            "payment-method",
+            false
+        );
+
+        // Match all available line items to the line items as they are in the store
+        // and rebuild the original structure.
+        const lineItems = mapTaxedAvailableLineItemsToStoreFormat(
+            availableLineItems,
+            lineItemsFromStore
+        );
+
         // Call the "next" function to complete the transition to this page.
         next(async (vm) => {
             vm.setCmsContent(resultMap.cmsContent);
             vm.fetchSignatureInfo(resultMap.signature);
+
+            vm.availableLineItems = taxedAvailableLineItems;
+            vm.lineItems = lineItems;
         });
     },
     computed: {
@@ -276,6 +386,9 @@ export default {
         switchPaymentText() {
             return this.getCmsContent("PaymentMethodWidget", "QuestionText");
         },
+        damageInfo() {
+            return this.$store.getters.damage;
+        },
     },
     methods: {
         arePagePrerequisitesValid() {
@@ -466,6 +579,7 @@ export default {
         funnelHeader,
         navbar,
         loadingModal,
+        cart,
         paymentSwitch,
     },
 };

From cae80fa8137ca13dbab32ffe47efb1d4c3f6020e Mon Sep 17 00:00:00 2001
From: Chloe Herd <chloe.herd@safelite.com>
Date: Wed, 8 Nov 2023 15:04:26 -0500
Subject: [PATCH 10/16] Also check for "PIA Required"

---
 src/layouts/payment-method/payment-method.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index 9f9df5f52..6946b4168 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -409,10 +409,11 @@ export default {
             }
         },
         isPiaDisabled() {
-            const piaExperience =
-                this.getSettingValue(experimentSettings.PIA_EXPERIENCE) === "PIA Optional";
+            const piaExperience = this.getSettingValue(experimentSettings.PIA_EXPERIENCE);
 
-            return !piaExperience;
+            const isEnabled = piaExperience === "PIA Optional" || piaExperience === "PIA Required";
+
+            return !isEnabled;
         },
         paymentMethod() {
             if (this.isPiaDisabled) {

From d5a748cacd4d668e52a05be53e73433f3eac7225 Mon Sep 17 00:00:00 2001
From: Chloe Herd <chloe.herd@safelite.com>
Date: Wed, 8 Nov 2023 15:55:08 -0500
Subject: [PATCH 11/16] Update ctu when updating zip on service-location

---
 src/layouts/service-location/service-location.vue               | 2 ++
 .../service-zip-modal-question/service-zip-modal-question.vue   | 1 +
 2 files changed, 3 insertions(+)

diff --git a/src/layouts/service-location/service-location.vue b/src/layouts/service-location/service-location.vue
index a2aa0813b..f8efc8c25 100644
--- a/src/layouts/service-location/service-location.vue
+++ b/src/layouts/service-location/service-location.vue
@@ -245,6 +245,7 @@ export default {
                 return {
                     state: this.state,
                     zipCode: this.zipCode,
+                    zipCodeCtu: this.zipCodeCtu,
                 };
             },
             set: function (newValue) {
@@ -256,6 +257,7 @@ export default {
 
                 this.state = newValue.state;
                 this.zipCode = newValue.zipCode;
+                this.zipCodeCtu = newValue.zipCodeCtu;
 
                 this.$nextTick();
             },
diff --git a/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue b/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue
index 35276228d..ea6f07818 100644
--- a/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue
+++ b/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue
@@ -141,6 +141,7 @@ export default {
                     this.resetModalButtonStyle();
                 } else {
                     this.internalModel.state = zipCodeData.state;
+                    this.internalModel.zipCodeCtu = zipCodeData.zipCodeCtu;
 
                     // retrieve mobile fee part
                     const serviceZipCode = this.internalModel.zipCode;

From a56abad9627e0a8479b0a4dc292d39941dd558d0 Mon Sep 17 00:00:00 2001
From: Chloe Herd <chloe.herd@safelite.com>
Date: Wed, 8 Nov 2023 15:55:19 -0500
Subject: [PATCH 12/16] Unit test changes

---
 src/layouts/service-location/service-location.spec.js    | 6 ++++++
 .../service-zip-modal-question.spec.js                   | 9 ++++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/layouts/service-location/service-location.spec.js b/src/layouts/service-location/service-location.spec.js
index 55ca775c4..eea946b89 100644
--- a/src/layouts/service-location/service-location.spec.js
+++ b/src/layouts/service-location/service-location.spec.js
@@ -286,6 +286,7 @@ describe("service-location.vue", () => {
             const newServiceZipCodeQuestion = {
                 zipCode: "61606",
                 state: "IL",
+                zipCodeCtu: "01526",
             };
 
             const serviceZipCodeComponent = wrapper.findComponent({
@@ -316,6 +317,7 @@ describe("service-location.vue", () => {
             const newServiceZipCodeQuestion = {
                 zipCode: "61606",
                 state: "IL",
+                zipCodeCtu: "01526",
             };
 
             const mobileLocationQuestions = {
@@ -365,6 +367,7 @@ describe("service-location.vue", () => {
             const newServiceZipCodeQuestion = {
                 zipCode: "61606",
                 state: "IL",
+                zipCodeCtu: "01526",
             };
 
             wrapper.vm.selectedAppointmentType = "Inshop";
@@ -395,6 +398,7 @@ describe("service-location.vue", () => {
             const newServiceZipCodeQuestion = {
                 zipCode: "45433",
                 state: "OH",
+                zipCodeCtu: "01526",
             };
 
             // Act
@@ -511,11 +515,13 @@ describe("service-location.vue", () => {
             wrapper.vm.serviceZipCodeQuestion = {
                 zipCode: "61606",
                 state: "IL",
+                zipCodeCtu: "01526",
             };
 
             const newServiceZipCodeInfo = {
                 state: "OH",
                 zipCode: "43081",
+                zipCodeCtu: "01526",
             };
 
             // Act
diff --git a/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.spec.js b/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.spec.js
index c1ebd65af..7c09836fe 100644
--- a/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.spec.js
+++ b/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.spec.js
@@ -113,6 +113,7 @@ describe("service-zip-modal-question.vue", () => {
         let serviceZipCodeQuestion = {
             state: "",
             zipCode: "",
+            zipCodeCtu: "",
         };
 
         // Arrange
@@ -135,6 +136,7 @@ describe("service-zip-modal-question.vue", () => {
         let serviceZipCodeQuestion = {
             state: "OH",
             zipCode: "43235",
+            zipCodeCtu: "01820",
         };
 
         const wrapper = mount(serviceZipModalQuestion, {
@@ -156,6 +158,7 @@ describe("service-zip-modal-question.vue", () => {
         let serviceZipCodeQuestion = {
             state: "IL",
             zipCode: "61606",
+            zipCodeCtu: "01526",
         };
 
         const zip = "43235";
@@ -176,7 +179,7 @@ describe("service-zip-modal-question.vue", () => {
 
         await wrapper.vm.setZipCode();
 
-        let expectedEmit = [[{ state: "OH", zipCode: "43235" }]];
+        let expectedEmit = [[{ state: "OH", zipCode: "43235", zipCodeCtu: "01820" }]];
 
         // Assert
         expect(wrapper.emitted("update:modelValue")).toEqual(expectedEmit);
@@ -187,6 +190,7 @@ describe("service-zip-modal-question.vue", () => {
         let serviceZipCodeQuestion = {
             state: "IL",
             zipCode: "61606",
+            zipCodeCtu: "01526",
         };
 
         const zip = "";
@@ -214,6 +218,7 @@ describe("service-zip-modal-question.vue", () => {
         let serviceZipCodeQuestion = {
             state: "IL",
             zipCode: "61606",
+            zipCodeCtu: "01526",
         };
 
         const zip = "11111";
@@ -241,6 +246,7 @@ describe("service-zip-modal-question.vue", () => {
         let serviceZipCodeQuestion = {
             state: "IL",
             zipCode: "61606",
+            zipCodeCtu: "01526",
         };
 
         const zip = "";
@@ -269,6 +275,7 @@ describe("service-zip-modal-question.vue", () => {
         let serviceZipCodeQuestion = {
             state: "IL",
             zipCode: "61606",
+            zipCodeCtu: "01526",
         };
 
         const zip = "123";

From afb2cbae739386bac3bf446411a53e7117f91846 Mon Sep 17 00:00:00 2001
From: Adam Caouette <adam.caouette@safelite.com>
Date: Wed, 8 Nov 2023 16:31:25 -0500
Subject: [PATCH 13/16] CSR-1384: refactor updates from tech review

---
 src/fmg-components/cart/cart.spec.js          | 28 +++++-----
 src/fmg-components/cart/cart.vue              | 12 ++++-
 .../add-vaps-modal-buttons.vue                |  8 +--
 src/layouts/payment-method/payment-method.vue | 54 ++++++++-----------
 src/store/index.js                            | 13 ++---
 5 files changed, 55 insertions(+), 60 deletions(-)

diff --git a/src/fmg-components/cart/cart.spec.js b/src/fmg-components/cart/cart.spec.js
index ae84083e6..bd0a2b096 100644
--- a/src/fmg-components/cart/cart.spec.js
+++ b/src/fmg-components/cart/cart.spec.js
@@ -37,13 +37,13 @@ describe("cart.vue", () => {
                 promos: [],
             };
 
-            const availableLineItems = [];
+            const availableVaps = [];
 
             // Act
             const { wrapper } = setupMocks({
                 props: {
                     modelValue: lineItems,
-                    availableLineItems: availableLineItems,
+                    availableVaps: availableVaps,
                 },
             });
 
@@ -89,13 +89,13 @@ describe("cart.vue", () => {
                 promos: [],
             };
 
-            const availableLineItems = [];
+            const availableVaps = [];
 
             // Act
             const { wrapper } = setupMocks({
                 props: {
                     modelValue: lineItems,
-                    availableLineItems: availableLineItems,
+                    availableVaps: availableVaps,
                 },
             });
 
@@ -132,13 +132,13 @@ describe("cart.vue", () => {
                 promos: [],
             };
 
-            const availableLineItems = [];
+            const availableVaps = [];
 
             // Act
             const { wrapper } = setupMocks({
                 props: {
                     modelValue: lineItems,
-                    availableLineItems: availableLineItems,
+                    availableVaps: availableVaps,
                 },
             });
 
@@ -189,13 +189,13 @@ describe("cart.vue", () => {
         //         promos: [],
         //     };
 
-        //     const availableLineItems = [];
+        //     const availableVaps = [];
 
         //     // Act
         //     const { wrapper } = setupMocks({
         //         props: {
         //             modelValue: lineItems,
-        //             availableLineItems: availableLineItems,
+        //             availableVaps: availableVaps,
         //         },
         //     });
 
@@ -234,13 +234,13 @@ describe("cart.vue", () => {
                 promos: [],
             };
 
-            const availableLineItems = [];
+            const availableVaps = [];
 
             // Act
             const { wrapper } = setupMocks({
                 props: {
                     modelValue: lineItems,
-                    availableLineItems: availableLineItems,
+                    availableVaps: availableVaps,
                 },
             });
 
@@ -277,13 +277,13 @@ describe("cart.vue", () => {
                 promos: [],
             };
 
-            const availableLineItems = [];
+            const availableVaps = [];
 
             // Act
             const { wrapper } = setupMocks({
                 props: {
                     modelValue: lineItems,
-                    availableLineItems: availableLineItems,
+                    availableVaps: availableVaps,
                 },
             });
 
@@ -321,13 +321,13 @@ describe("cart.vue", () => {
                 promos: [],
             };
 
-            const availableLineItems = [];
+            const availableVaps = [];
 
             // Act
             const { wrapper } = setupMocks({
                 props: {
                     modelValue: lineItems,
-                    availableLineItems: availableLineItems,
+                    availableVaps: availableVaps,
                 },
             });
 
diff --git a/src/fmg-components/cart/cart.vue b/src/fmg-components/cart/cart.vue
index ca784edd4..e34e9a4c4 100644
--- a/src/fmg-components/cart/cart.vue
+++ b/src/fmg-components/cart/cart.vue
@@ -121,7 +121,7 @@ export default {
         modelValue: Object,
         damage: Object,
         servicePackageOptionsCmsName: String,
-        availableLineItems: Object,
+        availableVaps: Object,
     },
     data() {
         return {
@@ -189,6 +189,16 @@ export default {
         },
     },
     computed: {
+        availableLineItems() {
+            if (!this.lineItems || this.lineItems.length < 1) {
+                return [];
+            }
+            return [
+                ...this.lineItems.glassParts,
+                ...this.lineItems.supportingItems,
+                ...this.availableVaps,
+            ];
+        },
         cartItems: {
             get: function () {
                 let cartItems = [];
diff --git a/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue b/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
index bb378c619..3eaf6a42e 100644
--- a/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
+++ b/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
@@ -76,7 +76,7 @@ export default {
     name: "add-vaps-modal-buttons",
     props: {
         vapsTilesCmsName: String,
-        availableLineItems: Object,
+        availableVaps: Object,
         modelValue: Object,
     },
     data() {
@@ -198,7 +198,7 @@ export default {
             return modelValue;
         },
         rainDefenseModal() {
-            const lineItem = this.availableLineItems.find((item) => {
+            const lineItem = this.availableVaps.find((item) => {
                 return item.partType === partTypeStrings.RAIN_DEFENSE;
             });
             if (lineItem)
@@ -209,10 +209,10 @@ export default {
         },
         wipersModal() {
             // create a single wiper item for modal
-            const frontWiperLineItems = this.availableLineItems.filter((item) => {
+            const frontWiperLineItems = this.availableVaps.filter((item) => {
                 return item.partType.includes(partTypeStrings.FRONT_WIPER);
             });
-            const rearWiperLineItems = this.availableLineItems.filter((item) => {
+            const rearWiperLineItems = this.availableVaps.filter((item) => {
                 return item.partType.includes(partTypeStrings.REAR_WIPER);
             });
             let wipersModal;
diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index 9a788bd70..a7313ddc7 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -23,7 +23,7 @@
 
                     <cart
                         :damage="damageInfo"
-                        :availableLineItems="availableLineItems"
+                        :availableVaps="availableVaps"
                         v-model="lineItems"
                         servicePackageOptionsCmsName="ServicePackageTitle"
                         @cart-remove="cartRemove" />
@@ -42,7 +42,7 @@
 
                     <add-vaps-modal-buttons
                         v-model="lineItems"
-                        :availableLineItems="availableLineItems"
+                        :availableVaps="availableVaps"
                         vapsTilesCmsName="VapsProductTiles"
                         @added-to-cart="showAlert" />
 
@@ -90,13 +90,14 @@ import {
 } from "@/helpers/promotions-helper";
 import { queryStrings } from "@/constants/query-strings";
 import { getQuerystringParameter } from "@/helpers/querystring-helper";
+import { deepClone } from "@/helpers/object-helper";
 
 import { Form } from "vee-validate";
 import { defineRule } from "vee-validate";
 import { required } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
 import { AppointmentTypeStrings } from "@/constants/schedule-constants";
-import { mapTaxedAvailableLineItemsToStoreFormat } from "../../store";
+import { mapTaxedLineItemsToStoreFormat } from "../../store";
 
 defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
 
@@ -118,12 +119,6 @@ export default {
             "payment-method"
         );
 
-        const supportingItemsPromise = baseMixin.methods.dispatchStoreActionWithLogging(
-            storeActions.GET_SUPPORTING_ITEMS,
-            null,
-            "payment-method"
-        );
-
         const promiseResultMap = [
             {
                 resultKey: "cmsContent",
@@ -137,29 +132,25 @@ export default {
                 resultKey: "rainDefense",
                 promise: rainDefensePromise,
             },
-            {
-                resultKey: "supportingItems",
-                promise: supportingItemsPromise,
-            },
         ];
 
         const resultMap = await settleAllPromises(promiseResultMap);
+        const lineItemsFromStore = deepClone(store.getters.order.lineItems);
+        const glassParts = lineItemsFromStore.glassParts ?? [];
+        const supportingItems = lineItemsFromStore.supportingItems ?? [];
 
-        const glassParts = store.getters.order.lineItems.glassParts ?? [];
-
-        let availableLineItems = [
+        const lineItemsToTax = [
             resultMap.rainDefense,
-            ...resultMap.supportingItems,
+            ...supportingItems,
             ...resultMap.wipers,
             ...glassParts,
         ];
+        const availableVaps = [resultMap.rainDefense, ...resultMap.wipers];
 
-        const lineItemsFromStore = store.getters.order.lineItems;
-
-        await baseMixin.methods.dispatchStoreActionWithLogging(
+        const pricedLineItemsToTax = await baseMixin.methods.dispatchStoreActionWithLogging(
             storeActions.PRICE_ORDER_ITEMS_AND_SAVE_SERVER_DATA,
             {
-                availableLineItems: availableLineItems,
+                availableLineItems: lineItemsToTax,
             },
             "payment-method",
             false
@@ -171,14 +162,14 @@ export default {
         const { validatePromoResponse, revalidatePromoResponse } =
             await revalidatePromosAndValidateNewPromo(
                 promoCodeFromQueryString,
-                availableLineItems,
+                pricedLineItemsToTax,
                 "payment-method"
             );
 
-        availableLineItems.push(...(validatePromoResponse?.orderPromos ?? []));
+        pricedLineItemsToTax.push(...(validatePromoResponse?.orderPromos ?? []));
         // End of promo logic
 
-        const taxedAvailableLineItems = await baseMixin.methods.dispatchStoreActionWithLogging(
+        const taxedLineItems = await baseMixin.methods.dispatchStoreActionWithLogging(
             storeActions.TAX_ORDER_ITEMS_AND_SAVE_SERVER_DATA,
             {
                 billToAccountNumber: "87291",
@@ -187,32 +178,29 @@ export default {
                 serviceLocationCity: store.getters.order.serviceLocation.city,
                 serviceLocationState: store.getters.order.serviceLocation.state,
                 serviceLocationZipCode: store.getters.order.serviceLocation.zipCode,
-                pricedAvailableLineItems: availableLineItems,
+                pricedLineItems: pricedLineItemsToTax,
             },
             "payment-method",
             false
         );
 
-        // Match all available line items to the line items as they are in the store
+        // Match all line items to the line items as they are in the store
         // and rebuild the original structure.
-        const lineItems = mapTaxedAvailableLineItemsToStoreFormat(
-            availableLineItems,
-            lineItemsFromStore
-        );
+        const lineItems = mapTaxedLineItemsToStoreFormat(taxedLineItems, lineItemsFromStore);
+        const taxedVaps = mapTaxedLineItemsToStoreFormat(taxedLineItems, availableVaps);
 
         // Call the "next" function to complete the transition to this page.
         next((vm) => {
             vm.setCmsContent(resultMap.cmsContent);
-            vm.availableLineItems = taxedAvailableLineItems;
+            vm.availableVaps = taxedVaps;
             vm.lineItems = lineItems;
-
             vm.updateFooterButtonText(vm.customCtaCopy);
         });
     },
     data() {
         return {
             lineItems: [],
-            availableLineItems: [],
+            availableVaps: [],
             paymentMethodInternalModel: this.getPaymentMethodFromStore(),
             inactivePromos: this.getInactivePromosFromStore(),
         };
diff --git a/src/store/index.js b/src/store/index.js
index e2915a1af..5251950c1 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -2180,13 +2180,13 @@ export const actions = {
                 serviceLocationCity,
                 serviceLocationState,
                 serviceLocationZipCode,
-                pricedAvailableLineItems,
+                pricedLineItems,
             },
             pageNameToLog,
         }
     ) {
         const flattenedLineItemsWithChildParts =
-            getFlattenedArrayOfLineItemsWithChildParts(pricedAvailableLineItems);
+            getFlattenedArrayOfLineItemsWithChildParts(pricedLineItems);
 
         const lineItemsWithOnlyPriceInfo = flattenedLineItemsWithChildParts.map((lineItem) => ({
             partNumber: lineItem.partNumber,
@@ -2235,12 +2235,9 @@ export const actions = {
 
         context.commit(storeMutations.UPDATE_LINE_ITEMS_SERVER_DATA, response.data.serverData);
 
-        pricedAvailableLineItems = addTaxesToPricedLineItems(
-            pricedAvailableLineItems,
-            response.data.taxedLineItems
-        );
+        pricedLineItems = addTaxesToPricedLineItems(pricedLineItems, response.data.taxedLineItems);
 
-        return pricedAvailableLineItems;
+        return pricedLineItems;
     },
 
     // The <addableVaps> parameter is an array of ALL available front wipers and rain defense
@@ -2610,7 +2607,7 @@ function addTaxesToPricedLineItems(pricedLineItems, taxingLineItems = []) {
     return pricedLineItems;
 }
 
-export function mapTaxedAvailableLineItemsToStoreFormat(availableLineItems, storeLineItems) {
+export function mapTaxedLineItemsToStoreFormat(availableLineItems, storeLineItems) {
     // clone the lineItems array because what we're passing in is referencing the store directly
     const lineItems = deepClone(storeLineItems);
 

From 84948b5cc16ff3252a0af93e920f90125ec1be1b Mon Sep 17 00:00:00 2001
From: Adam Caouette <adam.caouette@safelite.com>
Date: Wed, 8 Nov 2023 18:02:48 -0500
Subject: [PATCH 14/16] CSR-1484: formatting :-/

---
 src/layouts/payment-method/payment-method.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue
index b2539301d..8e5ad18d6 100644
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@@ -169,9 +169,8 @@ export default {
                 "payment-method"
             );
 
-            
         const newValidatedPromos = validatePromoResponse?.orderPromos ?? [];
-        
+
         pricedLineItemsToTax.push(...newValidatedPromos);
         // End of promo logic
 

From e2ad3594083fd730b4e38b624a20ed18da48dc90 Mon Sep 17 00:00:00 2001
From: Adam Caouette <adam.caouette@safelite.com>
Date: Wed, 8 Nov 2023 19:45:34 -0500
Subject: [PATCH 15/16] CSR-1384: update naming on payment page too

---
 src/layouts/payment/payment.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/layouts/payment/payment.vue b/src/layouts/payment/payment.vue
index ba396f952..cc8b911eb 100644
--- a/src/layouts/payment/payment.vue
+++ b/src/layouts/payment/payment.vue
@@ -188,7 +188,7 @@ import { applicationConfig } from "@/constants/application-config";
 import { paymentMethods } from "@/constants/payment-method-constants";
 import { AppointmentTypeStrings } from "@/constants/schedule-constants";
 import baseMixin from "@/mixins/base-mixin.js";
-import { mapTaxedAvailableLineItemsToStoreFormat } from "../../store";
+import { mapTaxedLineItemsToStoreFormat } from "../../store";
 import {
     revalidatePromosAndValidateNewPromo,
     getAddableVapsFromAvailableLineItems,
@@ -348,7 +348,7 @@ export default {
 
         // Match all available line items to the line items as they are in the store
         // and rebuild the original structure.
-        const lineItems = mapTaxedAvailableLineItemsToStoreFormat(
+        const lineItems = mapTaxedLineItemsToStoreFormat(
             availableLineItems,
             lineItemsFromStore
         );

From 929cf3e314bf1c937d4fea2303f5caebd3778dd0 Mon Sep 17 00:00:00 2001
From: Adam Caouette <adam.caouette@safelite.com>
Date: Wed, 8 Nov 2023 19:47:16 -0500
Subject: [PATCH 16/16] CSR-1384: another tech-review refactor - make
 wipersOffered a computed

---
 .../add-vaps-modal-buttons.vue                | 78 +++++++++++--------
 src/layouts/payment/payment.vue               |  5 +-
 2 files changed, 48 insertions(+), 35 deletions(-)

diff --git a/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue b/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
index 9d138d95a..c822fa318 100644
--- a/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
+++ b/src/layouts/payment-method/add-vaps-modal-buttons/add-vaps-modal-buttons.vue
@@ -82,7 +82,6 @@ export default {
     data() {
         return {
             addVapsButton: addVapsButton,
-            wipersOffered: null,
             isModalOpened: false,
             selectedWipers: this.getSelectedWipers(),
         };
@@ -249,20 +248,38 @@ export default {
         answersCmsData() {
             return this.getCmsContent(this.vapsTilesCmsName, "Answers");
         },
+        rainDefenseInCart() {
+            return this.currentCartItems.vaps?.some((vap) => {
+                return vap?.partType === partTypeStrings.RAIN_DEFENSE;
+            });
+        },
+        frontWipersInCart() {
+            return this.currentCartItems.vaps?.some((vap) => {
+                return vap?.partType?.includes(partTypeStrings.FRONT_WIPER);
+            });
+        },
+        rearWipersInCart() {
+            return this.currentCartItems.vaps?.some((vap) => {
+                return vap?.partType?.includes(partTypeStrings.REAR_WIPER);
+            });
+        },
+        wipersOffered() {
+            let result;
+            if (!this.frontWipersInCart) {
+                if (!this.rearWipersInCart && this.wipersModal?.rearWiperLineItems.length > 0) {
+                    result = wipersOfferedStrings.BOTH;
+                } else {
+                    result = wipersOfferedStrings.FRONT;
+                }
+            } else if (!this.rearWipersInCart && this.wipersModal?.rearWiperLineItems.length > 0) {
+                result = wipersOfferedStrings.REAR;
+            }
+            return result;
+        },
         buttonsToDisplay() {
             const buttons = [];
             if (!this.answersCmsData) return buttons;
 
-            const rainDefenseInCart = this.currentCartItems.vaps?.some((vap) => {
-                return vap?.partType === partTypeStrings.RAIN_DEFENSE;
-            });
-            const frontWipersInCart = this.currentCartItems.vaps?.some((vap) => {
-                return vap?.partType?.includes(partTypeStrings.FRONT_WIPER);
-            });
-            const rearWipersInCart = this.currentCartItems.vaps?.some((vap) => {
-                return vap?.partType?.includes(partTypeStrings.REAR_WIPER);
-            });
-
             const getAnswer = (name, answers) => {
                 const answerIndex = answers.findIndex((answer) => {
                     return answer.Name === name;
@@ -270,7 +287,7 @@ export default {
                 return answers[answerIndex];
             };
 
-            if (!rainDefenseInCart) {
+            if (!this.rainDefenseInCart) {
                 // NO RAIN DEFENSE IN CART; SHOW RAIN DEFENSE BUTTON
                 const modalData = getAnswer("RainDefenseModal", this.answersCmsData);
                 modalData.SubText = "+$" + this.rainDefenseModal?.listPrice;
@@ -278,27 +295,26 @@ export default {
             }
 
             const modalData = getAnswer("WipersModal", this.answersCmsData);
-            if (!frontWipersInCart) {
-                if (!rearWipersInCart && this.wipersModal?.rearWiperLineItems.length > 0) {
-                    // NO REAR WIPERS or FRONT WIPERS IN CART; SHOW COMBO BUTTON
-                    const prices = [
-                        this.wipersModal?.totalFrontPrice,
-                        this.wipersModal?.totalRearPrice,
-                    ];
-                    prices.sort((a, b) => a - b);
-                    modalData.SubText = "+$" + prices[0] + " - $" + prices[prices.length - 1];
-                    this.updateWipersOffered(wipersOfferedStrings.BOTH);
-                    buttons.push(modalData);
-                } else {
-                    // NO FRONT WIPERS IN CART; SHOW ONLY FRONT WIPERS BUTTON
-                    modalData.SubText = "+$" + this.wipersModal?.totalFrontPrice;
-                    this.updateWipersOffered(wipersOfferedStrings.FRONT);
-                    buttons.push(modalData);
-                }
-            } else if (!rearWipersInCart && this.wipersModal?.rearWiperLineItems.length > 0) {
+            if (this.wipersOffered === wipersOfferedStrings.BOTH) {
+                // NO REAR WIPERS or FRONT WIPERS IN CART; SHOW COMBO BUTTON
+                const prices = [
+                    this.wipersModal?.totalFrontPrice,
+                    this.wipersModal?.totalRearPrice,
+                ];
+                prices.sort((a, b) => a - b);
+                modalData.SubText = "+$" + prices[0] + " - $" + prices[prices.length - 1];
+                buttons.push(modalData);
+            }
+
+            if (this.wipersOffered === wipersOfferedStrings.FRONT) {
+                // NO FRONT WIPERS IN CART; SHOW ONLY FRONT WIPERS BUTTON
+                modalData.SubText = "+$" + this.wipersModal?.totalFrontPrice;
+                buttons.push(modalData);
+            }
+
+            if (this.wipersOffered === wipersOfferedStrings.REAR) {
                 // NO REAR WIPERS IN CART; SHOW ONLY REAR WIPERS BUTTON
                 modalData.SubText = "+$" + this.wipersModal?.totalRearPrice;
-                this.updateWipersOffered(wipersOfferedStrings.REAR);
                 buttons.push(modalData);
             }
 
diff --git a/src/layouts/payment/payment.vue b/src/layouts/payment/payment.vue
index cc8b911eb..fa8d91676 100644
--- a/src/layouts/payment/payment.vue
+++ b/src/layouts/payment/payment.vue
@@ -348,10 +348,7 @@ export default {
 
         // Match all available line items to the line items as they are in the store
         // and rebuild the original structure.
-        const lineItems = mapTaxedLineItemsToStoreFormat(
-            availableLineItems,
-            lineItemsFromStore
-        );
+        const lineItems = mapTaxedLineItemsToStoreFormat(availableLineItems, lineItemsFromStore);
 
         // Call the "next" function to complete the transition to this page.
         next(async (vm) => {