Merge pull request #2353 from Safelite/rlsmerge/develop-to-heavy.truck

Rlsmerge/develop to heavy.truck
2025-03-13 10:15:02 -04:00 · 2025-03-13 10:15:02 -04:00 · e3787b472a
commit e3787b472a
parent cf280c0dd4 05c361900c
10 changed files with 36 additions and 32 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -8,6 +8,7 @@
      "name": "Safelite",
      "version": "0.1.0",
      "dependencies": {
+        "@iframe-resizer/child": "^5.3.3",
        "axios": "^0.23.0",
        "bootstrap": "^5.3.3",
        "core-js": "^3.38.1",
@ -2162,6 +2163,16 @@
      "dev": true,
      "license": "BSD-3-Clause"
    },
+    "node_modules/@iframe-resizer/child": {
+      "version": "5.3.3",
+      "resolved": "https://registry.npmjs.org/@iframe-resizer/child/-/child-5.3.3.tgz",
+      "integrity": "sha512-A+avzzQ6R5AaK0RQ/v0sxrN/S7zeS0U7TE/Jcc2Wln0gpVHpkEMHLOYVBAS2ho8ZA6yhbyZeNoDCh3RMtCp14w==",
+      "license": "GPL-3.0",
+      "funding": {
+        "type": "individual",
+        "url": "https://iframe-resizer.com/pricing/"
+      }
+    },
    "node_modules/@isaacs/cliui": {
      "version": "8.0.2",
      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
--- a/package.json
+++ b/package.json
@ -11,6 +11,7 @@
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
+    "@iframe-resizer/child": "^5.3.3",
    "axios": "^0.23.0",
    "bootstrap": "^5.3.3",
    "core-js": "^3.38.1",
--- a/src/experiment-components/donation-block.vue
+++ b/src/experiment-components/donation-block.vue
@ -12,7 +12,8 @@
                </div>
                <div>
                    <p class="small subheadline mb-2" v-html="DonationSubHeadline"></p>
-                    <p class="caption mb-0" v-html="DonationBodyText"></p>
+                    <span class="caption mb-0" v-html="DonationBodyText"></span>
+                    &nbsp;
                    <textLink
                        linkType="newWindowLink"
                        text="Learn more"
@ -61,11 +62,11 @@
                <div class="col-12">
                    <div
                        v-if="showDonationSuccess"
-                        class="d-flex justify-content-center align-items-center btn-success w-100 mb-2"
+                        class="d-flex justify-content-center align-items-center btn-success w-100"
                        v-html="DonationThanksAlertWidget"></div>
                </div>
            </div>
-            <div class="row px-4">
+            <div class="row px-4 mt-2">
                <div class="col">
                    <alert
                        v-if="showDonationError"
@ -75,7 +76,7 @@
            </div>
            <div class="row">
                <div class="col-12">
-                    <p class="my-4 mx-0 text-center caption" v-html="DonationFooterText"></p>
+                    <p class="mt-0 mb-4 mx-0 text-center caption" v-html="DonationFooterText"></p>
                </div>
            </div>
        </form>
@ -142,7 +143,7 @@ export default {

 <style lang="scss" scoped>
 .donation-block {
-    padding: 1rem 0;
+    padding: 1rem 0 0 0;
    background-color: $gray-100;
    border-radius: 0;

--- a/src/fmg-components/address-questions/address-questions.vue
+++ b/src/fmg-components/address-questions/address-questions.vue
@ -124,10 +124,6 @@ export default {
            type: Boolean,
            default: false,
        },
-        isAddressFieldFocused: {
-            type: Boolean,
-            default: true,
-        },
    },
    data() {
        return {
@ -229,9 +225,6 @@ export default {
            ).then(() => {
                // When loaded, trigger the setup
                this.initializeAutocomplete();
-                if (this.isAddressFieldFocused) {
-                    this.addressField1.focus();
-                }
            });
        },
        initializeAutocomplete() {
--- a/src/fmg-components/cart/cart.vue
+++ b/src/fmg-components/cart/cart.vue
@ -200,6 +200,7 @@ export default {
        isItac: Boolean,
        isNoComp: Boolean,
        isExpandedOnLoad: Boolean,
+        isMSRFeeApplicable: Boolean,
    },
    data() {
        return {
@ -846,9 +847,6 @@ export default {
        isCashItacNoComp() {
            return !this.isInsurance || this.isITAC || this.isNoComp;
        },
-        getIsMSRFeeApplicableFromStore() {
-            return this.$store.getters.order.isMSRFeeApplicable;
-        },
        mobileFeeCartItemName() {
            return this.getCmsContent("MobileServiceTextWidget", "Text");
        },
@ -865,7 +863,7 @@ export default {
                (mobileFeeLineItem?.sellingPrice ?? 0);

            if (mobileTotal > 0) {
-                if (this.getIsMSRFeeApplicableFromStore) {
+                if (this.isMSRFeeApplicable) {
                    showMobileFeeCartItem = this.isCashItacNoComp;
                } else {
                    showMobileFeeCartItem = true;
--- a/src/layouts/address-lookup/address-lookup.vue
+++ b/src/layouts/address-lookup/address-lookup.vue
@ -19,8 +19,7 @@
                        ref="customerQuestions"
                        v-model="customerQuestions"
                        :validationRules="EmailOrSmsValidationRules"
-                        :isEmailOptional="IsEmailOptional"
-                        :isAddressFieldFocused="IsAddressFieldFocused" />
+                        :isEmailOptional="IsEmailOptional" />
                    <alert
                        ref="alertVinNotFound"
                        v-if="displayVinNotFoundAlert"
@ -465,9 +464,6 @@ export default {
                .replaceAll("{custom:vinYmmFound}", vinYmmFound)
                .replaceAll("{custom:vinYmmExpected}", vinYmmExpected);
        },
-        IsAddressFieldFocused() {
-            return false;
-        },
    },
    watch: {
        customerQuestions: {
--- a/src/layouts/address-lookup/customer-questions/customer-questions.vue
+++ b/src/layouts/address-lookup/customer-questions/customer-questions.vue
@ -1,9 +1,6 @@
 <template>
    <div class="customer-questions">
-        <addressQuestions
-            ref="addressQuestions"
-            v-model="customerModel.addressQuestions"
-            :isAddressFieldFocused="isAddressFieldFocused" />
+        <addressQuestions ref="addressQuestions" v-model="customerModel.addressQuestions" />
        <div class="row mb-4">
            <div class="col">
                <textboxQuestion
@ -90,11 +87,6 @@ export default {
        },
        validationRules: String,
        isEmailOptional: Boolean,
-        isAddressFieldFocused: {
-            required: false,
-            type: Boolean,
-            default: true,
-        },
    },
    computed: {
        customerModel: {
--- a/src/layouts/confirmation/confirmation.vue
+++ b/src/layouts/confirmation/confirmation.vue
@ -62,7 +62,8 @@
                                :shouldHideRecalibration="shouldHideRecalibration"
                                :isExpandedOnLoad="false"
                                :isItac="isItac"
-                                :isNoComp="isNoComp" />
+                                :isNoComp="isNoComp"
+                                :isMSRFeeApplicable="isMSRFeeApplicable" />

                            <div class="mt-3" v-if="DisplayFosterLove">
                                <donationBlock
@ -423,6 +424,9 @@ export default {
        damageInfo() {
            return this.submittedOrder?.damage;
        },
+        isMSRFeeApplicable() {
+            return this.submittedOrder?.isMSRFeeApplicable;
+        },
        isInsurance() {
            return this.submittedOrder?.payment?.isInsurance;
        },
--- a/src/layouts/payment-method/payment-method.vue
+++ b/src/layouts/payment-method/payment-method.vue
@ -36,7 +36,8 @@
                        :shouldHideRecalibration="shouldHideRecalibration"
                        :isItac="isItac"
                        :isNoComp="isNoComp"
-                        :isExpandedOnLoad="false" />
+                        :isExpandedOnLoad="false"
+                        :isMSRFeeApplicable="isMSRFeeApplicable" />

                    <hr />

@ -683,6 +684,9 @@ export default {
        damageInfo() {
            return this.$store.getters.damage;
        },
+        isMSRFeeApplicable() {
+            return this.$store.getters.order.isMSRFeeApplicable;
+        },
        isInsurance() {
            return this.hasSubmittedOrder()
                ? this.getSubmittedOrder()?.payment.isInsurance
--- a/src/layouts/payment-pia-return/payment-pia-return.vue
+++ b/src/layouts/payment-pia-return/payment-pia-return.vue
@ -15,6 +15,10 @@ import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
 import { Form } from "vee-validate";
 import { paymentMethods } from "@/constants/payment-method-constants";
 import { routerParams } from "@/router/router-constants/router-params";
+// iframeResizer IS loaded into the page and necessary for the package to
+//   to auto scale the iFrame this page is loaded in
+// Do not remove despite showing as "unused" CASH-309
+import iframeResizer from "@iframe-resizer/child";

 export default {
    name: "payment-pia-return",