Merge pull request #866 from Safelite/feature/CSR-747

Feature/csr 747

src/constants/store-actions.js

@@ -65,6 +65,7 @@ const storeActions = {
         "resetMoldingAndCapabilityQuestionAnswersIfNeeded",
     SAVE_MOLDING_QUESTION_ANSWERS: "saveMoldingQuestionAnswers",
     SAVE_CAPABILITY_QUESTION_ANSWERS: "saveCapabilityQuestionAnswers",
+    SAVE_QUOTE_PAGE_SELECTIONS: "saveQuotePageSelections",
     SAVE_PAYMENT_TYPE: "savePaymentType",
     SAVE_SUPPORTING_ITEMS: "saveSupportingItems",
     SAVE_VAPS: "saveVaps",

src/constants/tint-mapper.js

@@ -78,7 +78,7 @@ const tintMap = {
 // Returns undefined if no items are found.
 export function getTintImage(glassLocation, colorString) {
     // Windshield glass has special images, all other glass uses the same though.
-    if (glassLocation.toLowerCase() !== "windshield") {
+    if (glassLocation?.toLowerCase() !== "windshield") {
         glassLocation = "other";
     }
 

src/helpers/damage-helper.js

@@ -37,7 +37,9 @@ export function getDamageString() {
 export function getIsWindshieldOnly() {
     const damageLocations = store.getters.damage.glassToReplace;
     const returnString =
-        damageLocations.length === 1 && damageLocations[0]?.glassLocation === "Windshield"
+        damageLocations &&
+        damageLocations.length === 1 &&
+        damageLocations[0]?.glassLocation === "Windshield"
             ? "windshield"
             : "glass";
     return returnString;

src/helpers/heritage-integration/navigation-helper.js

@@ -43,16 +43,21 @@ export async function getPageToRouteExistingOrderTo(toRoute = {}, existingHerita
     Used to navigate to the heritage funnel with the correct query string and url.
 */
 
-export async function navigateToHeritageFunnel(shouldSaveSession = true) {
+export async function navigateToHeritageFunnel({ shouldSaveSession = true, loadingModal }) {
     // Create the order (or save existing order) when navigating to Heritage Funnel.
     if (shouldSaveSession) {
         await saveSession();
     }
 
+    if (loadingModal && loadingModal.showModal) {
+        loadingModal.showModal();
+    }
+
     router.navigateToExternalUrl(externalUrls.HERITAGE_FUNNEL, {
         corid: store.getters.order.referralCorrelationId,
         src: "concept-funnel",
         conceptsqid: store.getters.applicationUser.savedSessionId,
+        isInsurance: store.getters.payment.isInsurance,
     });
 }
 

src/helpers/heritage-integration/navigation-helper.spec.js

@@ -377,7 +377,7 @@ describe("navigateToHeritageFunnel", () => {
         router.navigateToExternalUrl = jest.fn();
 
         // Act
-        await navigateToHeritageFunnel();
+        await navigateToHeritageFunnel({});
 
         // Assert
         expect(saveSessionFunction).toHaveBeenCalled();
@@ -424,7 +424,7 @@ describe("navigateToHeritageFunnel", () => {
         router.navigateToExternalUrl = jest.fn();
 
         // Act
-        await navigateToHeritageFunnel();
+        await navigateToHeritageFunnel({});
 
         // Assert
         expect(router.navigateToExternalUrl).toHaveBeenCalled();
@@ -436,7 +436,7 @@ describe("navigateToHeritageFunnel", () => {
         );
     });
 
-    test("should not save session, but should still navigate", async () => {
+    test("shouldSaveSession is false => should not save session, but should still navigate", async () => {
         // Arrange
         const mockReferralNumber = "2";
         const mockCorrelationId = "55";
@@ -462,7 +462,7 @@ describe("navigateToHeritageFunnel", () => {
         router.navigateToExternalUrl = jest.fn();
 
         // Act
-        await navigateToHeritageFunnel(false);
+        await navigateToHeritageFunnel({ shouldSaveSession: false });
 
         // Assert
         expect(saveSessionFunction).not.toHaveBeenCalled();

src/helpers/heritage-integration/order-helper.js

@@ -30,7 +30,14 @@ export async function loadSessionIfPresent() {
     }
 
     // Loads session including referral if there is a cookie, and it doesn't indicate it needs a state reset.
-    return (await loadSession(funnelCookie.SavedSessionId)).data;
+    return (
+        await loadSession(
+            funnelCookie.SavedSessionId,
+            funnelCookie.ReferralNumber,
+            funnelCookie.ReferralParentAccountNumber,
+            funnelCookie.ReferralCorrelationId
+        )
+    ).data;
 }
 
 /*
@@ -61,13 +68,16 @@ export async function saveSession() {
     Calls API to load session given the referral number, referralDate, and referralCorrelationId
     and returns the response.
 */
-async function loadSession(savedSessionId) {
+async function loadSession(savedSessionId, referralNumber, accountNumber, referralCorrelationId) {
     // await the saveSessionPromise in the store to make sure we're loading up to date information
     await store.getters.applicationUser.saveSessionPromise;
     const response = await baseMixin.methods.dispatchStoreAction(
         storeActions.LOAD_SESSION,
         {
             savedSessionId: savedSessionId?.toString(),
+            referralNumber,
+            accountNumber,
+            referralCorrelationId,
         },
         false
     );
@@ -84,12 +94,12 @@ async function saveSessionHelper() {
     await baseMixin.methods.dispatchStoreAction(
         storeActions.UPDATE_STORE_WITH_SAVE_SESSION_RESPONSE,
         {
-            referralNumber: savedSessionInfo.data.referralNumber.toString(),
+            referralNumber: savedSessionInfo.data.referralNumber?.toString(),
             referralCorrelationId: savedSessionInfo.data.referralCorrelationId,
             referralDate: savedSessionInfo.data.referralDate,
-            accountNumber: savedSessionInfo.data.accountNumber.toString(),
+            accountNumber: savedSessionInfo.data.accountNumber?.toString(),
             savedSessionId: savedSessionInfo.data.savedSessionId,
-            crmCustomerId: savedSessionInfo.data.crmCustomerId.toString(),
+            crmCustomerId: savedSessionInfo.data.crmCustomerId?.toString(),
         },
         false
     );

src/layouts/capability-questions/capability-questions.spec.js

@@ -103,6 +103,7 @@ const baseStoreGettersDamage = () => {
 store.getters = {
     pageData: baseStoreGettersPageData,
     damage: baseStoreGettersDamage,
+    payment: { insuranceCoverage: {} },
 };
 store.commit = jest.fn();
 
@@ -111,6 +112,7 @@ afterEach(() => {
     store.getters = {
         pageData: baseStoreGettersPageData,
         damage: baseStoreGettersDamage,
+        payment: { insuranceCoverage: {} },
     };
 });
 

src/layouts/estimate/estimate.vue

@@ -1,6 +1,7 @@
 <template>
     <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
         <div class="page-container-grouped-styles">
+            <loadingModal ref="loadingModal" />
             <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
             <vehicleBanner cmsWidgetName="VehicleBannerWidget" />
             <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
@@ -91,6 +92,7 @@ import buttonQuestion from "@/common-components/button-question/button-question"
 import alert from "@/ux-components/alert/alert";
 import textboxQuestion from "@/common-components/textbox-question/textbox-question";
 import textBlock from "@/common-components/text-block/text-block";
+import loadingModal from "@/common-components/loading-modal/loading-modal.vue";
 
 //Supporting Files
 import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
@@ -205,7 +207,12 @@ export default {
                 }
                 this.displayNonServiceableZipAlert = false;
 
-                if (this.isRepair) {
+                const payment = this.$store.getters.payment;
+                const vehicleChangedDuringPolicyLookupInHeritage =
+                    payment.isInsurance && payment.insuranceCoverage.coverageStatus;
+                if (vehicleChangedDuringPolicyLookupInHeritage) {
+                    navigateToHeritageFunnel({ loadingModal: this.$refs.loadingModal });
+                } else if (this.isRepair) {
                     return this.$router.navigateWithSaving(
                         this.navigationScenarios.CLICKED_FORWARD_WITH_NO_QUESTIONS,
                         this.$route
@@ -292,6 +299,7 @@ export default {
         alert,
         textboxQuestion,
         textBlock,
+        loadingModal,
     },
 };
 </script>

src/layouts/molding-questions/molding-questions.spec.js

@@ -115,6 +115,7 @@ afterEach(() => {
     store.getters = {
         pageData: baseStoreGettersPageData,
         damage: baseStoreGettersDamage,
+        payment: { insuranceCoverage: {} },
     };
 });
 

src/layouts/part-questions/part-questions.spec.js

@@ -220,6 +220,9 @@ describe("partQuestions.vue...", () => {
     describe("forwardButtonAction", () => {
         test("Should clear out answerData", async () => {
             // Arrange
+            store.getters.payment = {
+                insuranceCoverage: null,
+            };
             const { wrapper } = setupMocks({});
 
             await wrapper.setData({

src/layouts/quote/quote.vue

@@ -1,6 +1,7 @@
 <template>
     <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
         <div class="page-container-grouped-styles">
+            <loadingModal ref="loadingModal" />
             <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
             <vehicleBanner
                 cmsWidgetName="VehicleBannerWidget"
@@ -56,6 +57,7 @@ import cashOrInsuranceQuestion from "./cash-or-insurance-question/cash-or-insura
 import servicePackageQuestion from "./service-package-question/service-package-question";
 import textBlock from "@/common-components/text-block/text-block";
 import modal from "@/common-components/modal/modal";
+import loadingModal from "@/common-components/loading-modal/loading-modal.vue";
 import baseMixin from "@/mixins/base-mixin.js";
 import vehicleQuestionsMixin from "../../mixins/vehicle-questions-mixin";
 import { settleAllPromises } from "@/helpers/layout-helper";
@@ -63,6 +65,7 @@ import { storeActions } from "@/constants/store-actions";
 import store from "@/store";
 import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
 import { Form } from "vee-validate";
+import { navigateToHeritageFunnel } from "@/helpers/heritage-integration/navigation-helper";
 
 export default {
     name: "quote",
@@ -110,6 +113,7 @@ export default {
         // Call the "next" function to complete the transition to this page.
         next((vm) => {
             vm.setCmsContent(cmsContent);
+
             vm.supportingItems = resultMap.supportingItems;
             vm.availableLineItems = pricingResults;
             vm.isInsuranceSelected = vm.getDefaultIsInsuranceSelectedValue();
@@ -160,7 +164,7 @@ export default {
             );
             this.dispatchStoreAction(this.storeActions.SAVE_VAPS, this.selectedVaps, false);
 
-            //return this.navigateForward();
+            navigateToHeritageFunnel({ loadingModal: this.$refs.loadingModal });
         },
     },
     components: {
@@ -173,6 +177,7 @@ export default {
         cashOrInsuranceQuestion,
         servicePackageQuestion,
         modal,
+        loadingModal,
     },
 };
 </script>

src/layouts/quote/service-package-question/service-package-question.vue

@@ -314,9 +314,10 @@ export default {
             return !!partTypeMatches.length;
         },
         glassToReplaceContainsGlassLocation(glassLocation) {
-            const glassLocationMatches = this.$store.getters.order.damage.glassToReplace.filter(
+            const glassLocationMatches =
-                (glassToReplace) => glassToReplace.glassLocation === glassLocation
+                this.$store.getters.order.damage.glassToReplace?.filter(
-            );
+                    (glassToReplace) => glassToReplace.glassLocation === glassLocation
+                ) ?? [];
             return !!glassLocationMatches.length;
         },
     },

src/layouts/vehicle-damage/vehicle-damage.spec.js

@@ -75,7 +75,7 @@ describe("vehicle-damage.vue", () => {
             expect(wrapper.vm.$router.navigateWithoutSaving).toHaveBeenCalled();
         });
 
-        test("Replace several pieces of glass on ForwardButtonAction triggers a router.navigate and saves selections to store", async () => {
+        test("Replace several pieces of glass on first pass through concept on ForwardButtonAction triggers a router.navigate and saves selections to store", async () => {
             //Arrange
             const partsData = {
                 partsOrQuestions: [

src/layouts/vehicle-damage/vehicle-damage.vue

@@ -328,8 +328,28 @@ export default {
         },
 
         navigateForward() {
+            const payment = this.$store.getters.payment;
+            console.log(payment);
+            const vehicleChangedDuringPolicyLookupInHeritage =
+                payment.isInsurance &&
+                payment.insuranceCoverage.coverageStatus &&
+                payment.insuranceCoverage.coverageStatus !== "";
+            if (vehicleChangedDuringPolicyLookupInHeritage) {
+                if (store.getters.damage.isRepair) {
+                    this.$router.navigateWithSaving(
+                        this.navigationScenarios.CLICKED_FORWARD_WITH_REPAIR_AND_VERIFIED_INSURANCE,
+                        this.$route
+                    );
+                } else {
+                    this.$router.navigateWithSaving(
+                        this.navigationScenarios
+                            .CLICKED_FORWARD_WITH_REPLACE_AND_VERIFIED_INSURANCE,
+                        this.$route
+                    );
+                }
+            }
             // If vin already exists, navigate directly to vin-lookup
-            if (store.getters.vehicle.vin) {
+            else if (store.getters.vehicle.vin) {
                 this.$router.navigateWithSaving(
                     this.navigationScenarios.CLICKED_FORWARD_WITH_VIN,
                     this.$route

src/layouts/vehicle-parts/vehicle-parts.spec.js

@@ -459,6 +459,7 @@ describe("vehicle-parts.vue", () => {
         store.getters.pageData.mockReturnValueOnce(basePartResponse);
         store.getters.lineItems = { glassParts: {} };
         store.getters.vehicle = { carId: "TEST_CAR_ID" };
+        store.getters.payment = { insuranceCoverage: {} };
 
         const { wrapper } = setupMocks({
             mountOptionsMockData: {
@@ -541,6 +542,7 @@ function setupMocks({ pageHeaderWidgetHeaderText = {}, mountOptionsMockData = {}
 
     wrapper.vm.setCmsContent = baseMixin.methods.setCmsContent;
     wrapper.vm.$refs.funnelFooter.removeLoader = jest.fn();
+    wrapper.vm.$refs.loadingModal.showModal = jest.fn();
     // wrapper.vm.$refs.onSubmit = jest.fn();
     // wrapper.vm.$refs.onInvalidSubmit = jest.fn();
 

src/layouts/vehicle-parts/vehicle-parts.vue

@@ -1,6 +1,7 @@
 <template>
     <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm">
         <div class="page-container-grouped-styles vehicle-parts">
+            <loadingModal ref="loadingModal" />
             <funnelHeader ref="funnelHeader" cmsWidgetName="FunnelHeaderWidget" />
             <vehicleBanner
                 ref="vehicleBanner"
@@ -50,6 +51,7 @@ import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
 import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header";
 import funnelFooter from "@/common-components/funnel-footer/funnel-footer";
 import alert from "@/ux-components/alert/alert";
+import loadingModal from "@/common-components/loading-modal/loading-modal.vue";
 // Supporting Files
 import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
 import { settleAllPromises } from "@/helpers/layout-helper";
@@ -224,6 +226,7 @@ export default {
         funnelSubHeader,
         funnelFooter,
         alert,
+        loadingModal,
     },
 };
 </script>

src/layouts/vin-lookup/vin-lookup.vue

@@ -1,6 +1,7 @@
 <template>
     <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
         <div class="page-container-grouped-styles">
+            <loadingModal ref="loadingModal" />
             <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
             <vehicleBanner
                 cmsWidgetName="VehicleBannerWidget"
@@ -117,6 +118,7 @@ import alert from "@/ux-components/alert/alert";
 import textboxQuestion from "@/common-components/textbox-question/textbox-question";
 import vinInformation from "@/layouts/vin-lookup/vin-information/vin-information";
 import textBlock from "@/common-components/text-block/text-block";
+import loadingModal from "@/common-components/loading-modal/loading-modal.vue";
 
 // Supporting files
 import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
@@ -460,6 +462,7 @@ export default {
         vinInformation,
         textBlock,
         Form,
+        loadingModal,
     },
 };
 </script>

src/mixins/vehicle-questions-mixin.js

@@ -449,8 +449,10 @@ export default {
                 // save to store lineItems.glassParts
                 self.$store.commit(storeMutations.UPDATE_GLASS_PARTS, collectedGlassParts);
 
-                shouldGoToHeritageQuote
+                const payment = store.getters.payment;
-                    ? navigateToHeritageFunnel()
+                shouldGoToHeritageQuote ||
+                (payment.isInsurance && payment.insuranceCoverage.isVerified)
+                    ? navigateToHeritageFunnel({ loadingModal: self.$refs.loadingModal })
                     : self.$router.navigateWithSaving(
                           self.navigationScenarios.CLICKED_FORWARD_WITH_NO_MORE_QUESTIONS,
                           self.$route

src/router/index.js

@@ -51,7 +51,7 @@ const routes = [
                 }
 
                 if (getFunnelCookie()?.SuppressConceptFunnel) {
-                    await navigateToHeritageFunnel(false);
+                    await navigateToHeritageFunnel({ shouldSaveSession: false });
                     return next(false);
                 }
 
@@ -66,6 +66,7 @@ const routes = [
                     // clear the saveSessionPromise - if it exists in the vuex store but a new instance was created
                     //   the saveSessionPromise will no longer point to a valid promise
                     baseMixin.methods.dispatchStoreAction(storeActions.RESET_SAVE_SESSION_PROMISE);
+
                     const loadSessionResponse = await loadSessionIfPresent();
                     const pageToRedirectTo = await getPageToRouteExistingOrderTo(
                         to,

src/router/router-constants/navigation-scenarios.js

@@ -20,6 +20,10 @@ const navigationScenarios = {
     // Vin selection
     CLICKED_BACK_WITH_VIN: "CLICKED_BACK_WITH_VIN",
     CLICKED_FORWARD_WITH_VIN: "CLICKED_FORWARD_WITH_VIN",
+    CLICKED_FORWARD_WITH_REPAIR_AND_VERIFIED_INSURANCE:
+        "CLICKED_FORWARD_WITH_REPAIR_AND_VERIFIED_INSURANCE",
+    CLICKED_FORWARD_WITH_REPLACE_AND_VERIFIED_INSURANCE:
+        "CLICKED_FORWARD_WITH_REPLACE_AND_VERIFIED_INSURANCE",
     CLICKED_FORWARD_WITHOUT_VIN: "CLICKED_FORWARD_WITHOUT_VIN",
     CLICKED_FORWARD_WITH_MULTIPLE_VEHICLES: "CLICKED_FORWARD_WITH_MULTIPLE_VEHICLES",
     SELECTED_VIN_WITH_MISMATCHED_GLASS: "SELECTED_VIN_WITH_MISMATCHED_GLASS",

src/router/router-constants/routing-table.js

@@ -67,6 +67,16 @@ const routingTable = function (store) {
                     scenario: navigationScenarios.CLICKED_FORWARD_WITHOUT_VIN,
                     destinationFmgPageValue: fmgPageValues.ESTIMATE,
                 },
+                {
+                    scenario:
+                        navigationScenarios.CLICKED_FORWARD_WITH_REPAIR_AND_VERIFIED_INSURANCE,
+                    destinationFmgPageValue: fmgPageValues.ESTIMATE,
+                },
+                {
+                    scenario:
+                        navigationScenarios.CLICKED_FORWARD_WITH_REPLACE_AND_VERIFIED_INSURANCE,
+                    destinationFmgPageValue: fmgPageValues.VIN_LOOKUP,
+                },
             ],
         },
         {

src/store/index.js

@@ -9,6 +9,7 @@ import { applicationConfig } from "@/constants/application-config";
 import { experimentTriggers } from "@/constants/experiments";
 import { damageLocationsSelected } from "@/constants/damage-locations-selected";
 import { fmgPageValues } from "@/router/router-constants/fmgPage-values";
+import router from "@/router";
 
 // Export State
 const getDefaultState = () => {
@@ -62,6 +63,7 @@ const getDefaultState = () => {
                 isInsurance: null,
                 insuranceCoverage: {
                     isVerified: null,
+                    coverageStatus: null,
                 },
             },
             referralNumber: null,
@@ -81,12 +83,6 @@ const getDefaultState = () => {
             experiments: [],
             triggeredSiteEntry: false,
         },
-        // gaClickInformation: {
-        //   currentlySelectedValues: {},
-        //   firedGaClickEventValues: {},
-        //   lastFocusedInputGroup: "",
-        //   wasLastFocusedInputMultiselect: undefined,
-        // },
     };
 };
 
@@ -364,6 +360,8 @@ export const mutations = {
         state.order.payment.isInsurance = sessionInformation.order.payment.isInsurance;
         state.order.payment.insuranceCoverage.isVerified =
             sessionInformation?.order.payment.insuranceCoverage.isVerified;
+        state.order.payment.insuranceCoverage.coverageStatus =
+            sessionInformation?.insuranceInfo?.coverageStatus;
 
         state.order.customer.emailAddress = sessionInformation.order.customer.emailAddress;
         state.order.existingPromoCode = sessionInformation.order.existingPromoCode;
@@ -1029,12 +1027,21 @@ export const actions = {
             },
         });
     },
-    loadSession(context, { savedSessionId }) {
+    loadSession(context, { savedSessionId, referralNumber, referralCorrelationId, accountNumber }) {
+        const order = context.state.order;
+
         return globalMethods
             .callHttpClient({
                 method: endpoints.LoadSession.method,
-                endpoint:
+                endpoint: `${
-                    endpoints.LoadSession.url + "?savedSessionId=" + savedSessionId?.toString(),
+                    endpoints.LoadSession.url
+                }?savedSessionId=${savedSessionId?.toString()}&referralNumber=${
+                    referralNumber && referralNumber !== "" ? referralNumber : order.referralNumber
+                }&accountNumber=${accountNumber}&referralCorrelationId=${
+                    referralCorrelationId !== ""
+                        ? referralCorrelationId
+                        : order.referralCorrelationId
+                }`,
             })
             .then((response) => {
                 // Flatten location and name properties
@@ -1412,7 +1419,6 @@ export const actions = {
     clearVin(context) {
         context.commit(storeMutations.UPDATE_VEHICLE_VIN, null);
     },
-
     isVinOptionalVehicle(context) {
         switch (context.state.order.vehicle.make.toLowerCase()) {
             case "mercedes benz":