CSR-702 Fix merge conflicts'

jest.config.js

@@ -12,6 +12,7 @@ module.exports = {
     "!src/router/**/*.js",
     "!src/helpers/unit-test-helper.js",
     "!src/layouts/vehicle-damage/windshield-options/windshield-options.vue",
+    "!src/layouts/molding-questions/**/*.vue",
     "!src/layouts/part-questions/**/*.vue",
     "!src/layouts/reveal/**/*.vue",
     "!src/ux-components/text-link/**/*.vue",

src/constants/store-actions.js

@@ -31,6 +31,7 @@ const storeActions = {
   INITIALIZE_SESSION: "initializeSession",
   GET_EXPERIMENTS_BY_USER: "GetExperimentsByUser",
   CLEAR_VIN: "clearVin",
+  RESET_SAVE_ORDER_PROMISE: "resetSaveOrderPromise",
 
   // DEPENDENCY MUTATIONS
   RESET_VEHICLE_STATE_AND_DEPENDENCIES: "resetVehicleAndDependencies",

src/constants/store-mutations.js

@@ -39,7 +39,7 @@ const storeMutations = {
   UPDATE_REFERRAL_DATE: "updateReferralDate",
   UPDATE_REFERRAL_CORRELATION_ID: "updateReferralCorrelationId",
   UPDATE_PARENT_ACCT_NUMBER: "updateParentAcctNumber",
-  UPDATE_SAVE_QUOTE_ID: "updateSaveQuoteId",
+  UPDATE_SAVED_SESSION_ID: "updateSavedSessionId",
   UPDATE_CRM_CUSTOMER_ID: "updateCrmCustomerId",
 
   // EVENT BUS MUTATIONS
@@ -58,6 +58,7 @@ const storeMutations = {
   UPDATE_STATE_WITH_ORDER_INFORMATION: "updateStateWithOrderInformation",
   UPDATE_SAVE_ORDER_PROMISE: "updateSaveOrderPromise",
   UPDATE_LAST_PAGE_VISITED: "updateLastPageVisited",
+  RESET_SAVE_ORDER_PROMISE: "resetSaveOrderPromise",
 };
 
 export { storeMutations };

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

@@ -15,7 +15,7 @@ export function updateOrCreateFunnelCookie() {
     // Set up cookie with all the props.
     setFunnelCookieProperties({
         LastTouched: new Date().toUTCString(),
-        SavedQuoteTimeoutDate: store.getters.applicationUser.savedSessionTimeout,
+        SavedSessionTimeoutDate: store.getters.applicationUser.savedSessionTimeout,
         DidHeritageFunnelUpdateLast: false,
         ShouldResetState: false,
         ReferralNumber: store.getters.order.referralNumber,

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

@@ -309,10 +309,10 @@ describe("navigateToHeritageFunnel", () => {
         const mockCorrelationId = "55";
         const mockReferralDate = "2022";
         const mockAccountNumber = "167132";
-        const mockSaveQuoteId = "xxx-xxx-xxx";
+        const mockSavedSessionId = "xxx-xxx-xxx";
         const mockCrmCustomerId = "xxx-xxx-xxx"
 
-        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, mockAccountNumber, mockSaveQuoteId, mockCrmCustomerId);
+        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, mockAccountNumber, mockSavedSessionId, mockCrmCustomerId);
 
         const mockData = {
             actionList: [{
@@ -344,10 +344,10 @@ describe("navigateToHeritageFunnel", () => {
         const mockCorrelationId = "55";
         const mockReferralDate = "2022";
         const mockAccountNumber = "167132";
-        const mockSaveQuoteId = "xxx-xxx-xxx";
+        const mockSavedSessionId = "xxx-xxx-xxx";
         const mockCrmCustomerId = "xxx-xxx-xxx"
 
-        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, mockAccountNumber, mockSaveQuoteId, mockCrmCustomerId);
+        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, mockAccountNumber, mockSavedSessionId, mockCrmCustomerId);
 
         const mockData = {
             actionList: [{

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

@@ -60,6 +60,8 @@ export async function saveOrder() {
     and returns the response.
 */
 async function loadOrder(referralNumber, referralDate, referralCorrelationId, accountNumber) {
+    // await the saveOrderPromise in the store to make sure we're loading up to date information
+    await store.getters.applicationUser.saveOrderPromise;
     const response = await baseMixin.methods.dispatchStoreAction(storeActions.LOAD_ORDER,
         {
             referralNumber: referralNumber.toString(),
@@ -82,7 +84,7 @@ async function saveOrderHelper() {
         referralCorrelationId: savedOrderInfo.data.referralCorrelationId,
         referralDate: savedOrderInfo.data.referralDate,
         accountNumber: savedOrderInfo.data.accountNumber.toString(),
-        saveQuoteId: savedOrderInfo.data.saveQuoteId,
+        savedSessionId: savedOrderInfo.data.savedSessionId,
         crmCustomerId: savedOrderInfo.data.crmCustomerId.toString(),
     }, false);
 

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

@@ -112,10 +112,10 @@ describe("saveOrder", () => {
         const mockCorrelationId = "55";
         const mockReferralDate = "2022";
         const mockAccountNumber = "167132";
-        const mockSaveQuoteId = "xxx-xxx-xxx";
+        const mockSavedSessionId = "xxx-xxx-xxx";
         const mockCrmCustomerId = "xxx-xxx-xxx"
 
-        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, mockAccountNumber, mockSaveQuoteId, mockCrmCustomerId);
+        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, mockAccountNumber, mockSavedSessionId, mockCrmCustomerId);
 
         const mockData = {
             actionList: [
@@ -141,7 +141,7 @@ describe("saveOrder", () => {
             referralDate: mockReferralDate,
             referralCorrelationId: mockCorrelationId,
             accountNumber: mockAccountNumber,
-            saveQuoteId: mockSaveQuoteId,
+            savedSessionId: mockSavedSessionId,
             crmCustomerId: mockCrmCustomerId,
         }, false);
     });
@@ -152,10 +152,10 @@ describe("saveOrder", () => {
         const mockReferralDate = "2022-03-15T10:56:24.597";
         const mockReferralCorrelationId = "404d2b04-f86e-45c3-b373-127b6217b060";
         const mockAccountNumber = "167132";
-        const mockSaveQuoteId = "xxx-xxx-xxx";
+        const mockSavedSessionId = "xxx-xxx-xxx";
         const mockCrmCustomerId = "xxx-xxx-xxx"
 
-        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockReferralCorrelationId, mockReferralDate, mockAccountNumber, mockSaveQuoteId, mockCrmCustomerId);
+        const mockOrderInfo = getMockOrderInfo(mockReferralNumber, mockReferralCorrelationId, mockReferralDate, mockAccountNumber, mockSavedSessionId, mockCrmCustomerId);
 
         const mockData = {
             actionList: [{

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

@@ -28,7 +28,7 @@ export function isAnalyticsSessionStillActive() {
 */
 export function isSavedSessionStillActive() {
     if (getFunnelCookie() !== null) {
-        const savedSessionTimeStamp = new Date(getFunnelCookie().SavedQuoteTimeoutDate);
+        const savedSessionTimeStamp = new Date(getFunnelCookie().SavedSessionTimeoutDate);
         const isSavedSessionTimedOut = (new Date(new Date().toUTCString()) > savedSessionTimeStamp);
 
         if (isSavedSessionTimedOut) {

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

@@ -41,7 +41,7 @@ describe("isSavedSessionStillActive", () => {
         mockDate.setDate(mockDate.getDate() + 1);
         
         cookieHelper.getFunnelCookie = jest.spyOn(cookieHelper, "getFunnelCookie")
-            .mockReturnValue({ SavedQuoteTimeoutDate: mockDate });
+            .mockReturnValue({ SavedSessionTimeoutDate: mockDate });
 
         // Act
         const result = isSavedSessionStillActive();
@@ -56,7 +56,7 @@ describe("isSavedSessionStillActive", () => {
         mockDate.setDate(mockDate.getDate() - 1)
 
         cookieHelper.getFunnelCookie = jest.spyOn(cookieHelper, "getFunnelCookie")
-            .mockReturnValue({ SavedQuoteTimeoutDate: mockDate });
+            .mockReturnValue({ SavedSessionTimeoutDate: mockDate });
 
         // Act
         const result = isSavedSessionStillActive();

src/helpers/unit-test-helper.js

@@ -90,13 +90,13 @@ export function removeAllTestCookies() {
   });
 }
 
-export function getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, accountNumber = "0", saveQuoteId, crmCustomerId) {
+export function getMockOrderInfo(mockReferralNumber, mockCorrelationId, mockReferralDate, accountNumber = "0", savedSessionId, crmCustomerId) {
   return {
       referralNumber: mockReferralNumber,
       referralCorrelationId: mockCorrelationId,
       referralDate: mockReferralDate,
       accountNumber: accountNumber,
-      saveQuoteId: saveQuoteId,
+      savedSessionId: savedSessionId,
       crmCustomerId: crmCustomerId,
   }
 }

src/layouts/license-plate-lookup/license-plate-lookup.spec.js

@@ -235,7 +235,7 @@ describe("license-plate-lookup.vue", () => {
         expect(wrapper.vm.$router.navigate).toHaveBeenCalled();
       });
 
-      test("navigateToHeritageFunnel should be called if isCarIdDifferent is false or isSelectedGlassAvailableForVehicle is true when navigateForward is called", async () => {
+      test("navigateForwardWithSingleCarMatch should be called if isCarIdDifferent is false or isSelectedGlassAvailableForVehicle is true when navigateForward is called", async () => {
 
         // Arrange
         const { wrapper } = setupMocks({});
@@ -247,11 +247,11 @@ describe("license-plate-lookup.vue", () => {
         wrapper.vm.getCmsContent = jest.fn().mockImplementation(() => {
           return '';
         });
-        navigateToHeritage.navigateToHeritageFunnel = jest.fn();
+        wrapper.vm.navigateForwardWithSingleCarMatch = jest.fn();
         await wrapper.vm.navigateForward();
 
         //Assert
-        expect(navigateToHeritage.navigateToHeritageFunnel).toHaveBeenCalled();
+        expect(wrapper.vm.navigateForwardWithSingleCarMatch).toHaveBeenCalled();
       });
 
       test("carId matches returned vehicle => navigateForwardWithSingleCarMatch", async () => {

src/layouts/molding-questions/molding-questions.vue

@@ -0,0 +1,286 @@
+<template>
+    <Form
+      @submit="onSubmit"
+      @invalid-submit="onInvalidSubmit"
+      ref="theForm"
+      v-slot="{ meta }"
+    >
+        <div class="page-container-grouped-styles molding-questions">
+            <funnelHeader cmsWidgetName="FunnelHeaderWidget" />
+            <vehicleBanner cmsWidgetName="VehicleBannerWidget" :displayGenericVehicleImage=false />
+            <funnelSubHeader cmsWidgetName="FunnelSubHeaderWidget" />
+            <div class="fade-on-route-transition sub-container make-tall">
+                <h1>MOLDING QUESTIONS TEMPORARY PLACEHOLDER</h1>
+                <alert
+                    ref="alertFewMoreQuestions"
+                    class="my-5"
+                    alertClass="alert-warning"
+                    :manualHeadline="AlertFewMoreQuestionsHeader"
+                    :manualCopy="AlertFewMoreQuestionsCopy"
+                    v-bind:isDismissible="false"
+                />
+                <div v-for="(part, i) in moldingQuestionsData" :key="i">
+                    <questionChain
+                        ref="questionChain"
+                        v-model="selectedModel"
+                        :questionData="part"
+                        :partIndex="i"
+                        v-if="showThisPartQuestionChain(part, i)"
+                        validationRules="questions-required"
+                    />
+                </div>
+                <funnel-footer
+                    ref="funnelFooter"
+                    cmsWidgetName="FunnelFooterWidget"
+                    :isForwardActionDisabled="!meta.valid"
+                    @back-clicked="backButtonAction"
+                    @ForwardClicked="forwardButtonAction"
+                />
+            </div>
+        </div>
+    </Form>
+</template>
+
+<script>
+// Components
+import funnelHeader from "@/common-components/funnel-header/funnel-header";
+import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner";
+import alert from "@/ux-components/alert/alert";
+import questionChain from "@/common-components/question-chain/question-chain";
+import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header";
+import funnelFooter from "@/common-components/funnel-footer/funnel-footer";
+
+// Supporting Files
+import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
+import { settleAllPromises } from "@/helpers/layout-helper";
+import store from "@/store";
+import { storeActions } from "@/constants/store-actions";
+import { storeMutations } from "@/constants/store-mutations";
+import { fmgPageValues } from "@/router/router-constants/fmgPage-values";
+import { Form, defineRule } from "vee-validate";
+import { required } from "@/helpers/validation-rules";
+import { errorMessages } from "@/constants/error-messages";
+
+// DEFINE VALIDATION RULES
+defineRule("questions-required", required(errorMessages.OPTION_REQUIRED));
+
+export default {
+    name: "molding-questions",
+    async beforeRouteEnter(to, from, next) {
+        // Call APIs
+        const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
+
+        // Settle promises and get results
+        const promiseResultMap = [
+            {
+                resultKey: "cmsContent",
+                promise: cmsContentPromise,
+            },
+         ];
+
+        const resultMap = await settleAllPromises(promiseResultMap);
+
+        // Call the "next" function to complete the transition to this page.
+        next((vm) => {
+            vm.setCmsContent(resultMap.cmsContent);
+        });
+    },
+    data() {
+        return {
+            selectedModel: [],
+            partsQuestionsData: this.$store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS).partsOrQuestions.filter((p) => {
+                if (Array.isArray(p.partQuestions) && p.partQuestions.length > 0) {
+                    return {
+                        glassName: p.glassName,
+                        glassLocation: p.glassLocation,
+                        partQuestions: p.partQuestions,
+                    };
+                }
+            }),
+            currentPartNum: 0,
+        };
+    },
+    computed: {
+        AlertFewMoreQuestionsHeader() {
+			return this.getCmsContent("AlertPartsQuestions", "HeadlineText");
+		},
+        AlertFewMoreQuestionsCopy() {
+			return this.getCmsContent("AlertPartsQuestions", "BodyText");
+		},
+    },
+    methods: {
+        arePagePrerequisitesValid() {
+            return true;
+            // return Object.keys(store.getters.pageData(fmgPageValues.MOLDING_QUESTIONS)).length > 0;
+        },
+        showThisPartQuestionChain(part, i) {
+            if (part.partQuestions?.length < 1) { return false; } // return false if only one partQuestion
+            if (this.currentPartNum === i || part.answerData?.answerResult.length > 0) { return true; }
+            return false;
+        },
+        backButtonAction() {
+            // route to move backwards
+            this.$router.navigate(
+                this.navigationScenarios.CLICKED_BACK,
+                this.$route
+            );
+        },
+        async forwardButtonAction() {
+            const partQuestionAnswersArray = this.partsQuestionsData.map((item) => {
+                return {
+                    glassLocation: item.glassLocation,
+                    glassName: item.glassName,
+                    result: item.answerData.answerResult,
+                    answeredQuestions: item.answerData.answeredQuestions,
+                };
+            });
+
+            // save to vuex store as order.damage.partQuestionAnswers (array)
+            await this.dispatchStoreAction(this.storeActions.SAVE_PART_QUESTION_ANSWERS, partQuestionAnswersArray, false);
+
+            // call API parts method
+            const partsLookup = await this.dispatchStoreAction(storeActions.GET_PARTS)
+                .catch(() => {
+                    return this.$refs.funnelFooter.removeLoader();
+                });
+
+            const glassNameAndPartsForStore = partsLookup.data.glassNameAndPartsForStore;
+
+            console.log("glassNameAndPartsForStore: ", glassNameAndPartsForStore);
+
+            // HARD CODE RESPONSE FOR NOW...
+
+            this.glassNameAndPartsForStore = [
+                {
+                    "glassName": "Single",
+                    "glassLocation": "Windshield",
+                    "parts": [
+                        {
+                            "partNumber": "FW03861GTYN",
+                            "description": "rain sensor, heated glass, auto dimming mirror, solar, 3rd visor band, condensation sensor",
+                            "color": "Green Tint",
+                            "requiresRecalibration": false,
+                            "requiresCapabilityQuestions": false,
+                            "recalibrationType": null,
+                            "childParts": null,
+                            "childPartQuestions": [
+                                {
+                                "questionSequence": 1,
+                                "questionText": "Does the rubber seal around your windshield have a chrome strip running through it?",
+                                "answers": [
+                                    {
+                                    "answerResult": "WKT D1106 C",
+                                    "answerText": "Yes",
+                                    "nextQuestionSequence": null
+                                    },
+                                    {
+                                    "answerResult": "WKT D1106 B",
+                                    "answerText": "No",
+                                    "nextQuestionSequence": null
+                                    }
+                                ]
+                                }
+                            ]
+                        }
+                    ]
+                },
+                {
+                    "glassName": "Stationary",
+                    "glassLocation": "Rear",
+                    "parts": [
+                        {
+                            "partNumber": "FB25992GTNN",
+                            "description": "heated glass, solar",
+                            "color": "Green Tint",
+                            "requiresRecalibration": false,
+                            "requiresCapabilityQuestions": false,
+                            "recalibrationType": null,
+                            "childParts": null,
+                            "childPartQuestions": []
+                        }
+                    ]
+                }
+            ];
+
+
+
+
+
+
+            // test response data for multiple parts
+            const hasMultipleParts = glassNameAndPartsForStore.some((glass) => glass.parts?.length > 1);
+
+            // loop through all glass items
+            const collectedGlassParts = [];
+            glassNameAndPartsForStore.forEach((glass) => {
+                if (Array.isArray(glass.parts) && glass.parts.length === 1) {
+                    const singlePart = glass.parts[0];
+                    collectedGlassParts.push({
+                        "partNumber": singlePart.partNumber,
+                        "description": singlePart.description,
+                        "color": singlePart.color,
+                        "requiresRecalibration": singlePart.requiresRecalibration,
+                        "childParts": singlePart.childParts,
+                        "price": singlePart.price,
+                    });
+                    // check for and collect any molding questions
+                    if (Array.isArray(singlePart.childPartQuestions) && singlePart.childPartQuestions.length > 0) {
+                        this.moldingQuestionsForStore.push({
+                            "glassName": glass.glassName,
+                            "glassLocation": glass.glassLocation,
+                            "childPartQuestions": singlePart.childPartQuestions,
+                        });
+                    }
+                }
+            });
+            if (!hasMultipleParts) {
+                this.$store.commit(storeMutations.UPDATE_GLASS_PARTS, collectedGlassParts);
+            }
+            this.navigateForward(hasMultipleParts, glassNameAndPartsForStore);
+        },
+        navigateForward(hasMultipleParts, glassNameAndPartsForStore) {
+            if (hasMultipleParts) {
+                // if multiple parts on any glass
+                // go to vehicle-parts page and pass the partsData
+                this.$router.navigate(this.navigationScenarios.ANSWERED_QUESTIONS_WITH_MULTIPLE_PARTS,this.$route,{},{},{partsOrQuestions: glassNameAndPartsForStore});
+            } else {
+                // if single parts only
+                // go to quote page
+                this.$router.navigate(this.navigationScenarios.ANSWERED_QUESTIONS_WITH_SINGLE_PART,this.$route);
+            }
+
+        // TODO - ADD CHECK FOR CAPABILITY QUESTIONS TO SEE IF NAVIGATE TO CAPABILITY-QUESTIONS
+
+        },
+    },
+    watch: {
+        selectedModel(model) {
+            this.moldingQuestionsData[model.partIndex].answerData = {
+                answerResult: model.answerResult,
+                answeredQuestions: model.answeredQuestions,
+            }
+            this.currentPartNum = model.partIndex + 1;
+        },
+    },
+    components: {
+        funnelHeader,
+        vehicleBanner,
+        alert,
+        questionChain,
+        funnelSubHeader,
+        funnelFooter,
+        Form,
+    },
+};
+</script>
+
+<style lang="scss">
+  .molding-questions {
+      .question-text {
+        margin-bottom: .5rem;
+        span {
+            text-align: left;
+        }
+    }
+  }
+</style>

src/layouts/part-questions/part-questions.vue

@@ -142,14 +142,14 @@ export default {
 
             if (!partsLookup) { return }
 
-            const glassNameAndParts = partsLookup.data.glassNameAndParts;
+            const glassNameAndPartsForStore = partsLookup.data.glassNameAndPartsForStore;
 
             // test response data for multiple parts
-            const hasMultipleParts = glassNameAndParts.some((glass) => glass.parts?.length > 1);
+            const hasMultipleParts = glassNameAndPartsForStore.some((glass) => glass.parts?.length > 1);
 
             // loop through all glass items
             const collectedGlassParts = [];
-            glassNameAndParts.forEach((glass) => {
+            glassNameAndPartsForStore.forEach((glass) => {
                 if (Array.isArray(glass.parts) && glass.parts.length === 1) {
                     const singlePart = glass.parts[0];
                     collectedGlassParts.push({
@@ -159,24 +159,37 @@ export default {
                         "requiresRecalibration": singlePart.requiresRecalibration,
                         "childParts": singlePart.childParts,
                         "price": singlePart.price,
-                    })
+                    });
+                    // check for and collect any molding questions
+                    if (Array.isArray(singlePart.childPartQuestions) && singlePart.childPartQuestions.length > 0) {
+                        this.moldingQuestionsForStore.push({
+                            "glassName": glass.glassName,
+                            "glassLocation": glass.glassLocation,
+                            "childPartQuestions": singlePart.childPartQuestions,
+                        });
+                    }
                 }
             });
             if (!hasMultipleParts) {
                 store.commit(storeMutations.UPDATE_GLASS_PARTS, collectedGlassParts);
             }
-            this.navigateForward(hasMultipleParts, glassNameAndParts);
+            this.navigateForward(hasMultipleParts, glassNameAndPartsForStore);
         },
-        async navigateForward(hasMultipleParts, glassNameAndParts) {
+        async navigateForward(hasMultipleParts, glassNameAndPartsForStore) {
             if (hasMultipleParts) {
                 // if multiple parts on any glass
                 // go to vehicle-parts page and pass the partsData
-                this.$router.navigate(this.navigationScenarios.ANSWERED_QUESTIONS_WITH_MULTIPLE_PARTS,this.$route,{},{},{partsOrQuestions: glassNameAndParts});
+                this.$router.navigate(this.navigationScenarios.ANSWERED_QUESTIONS_WITH_MULTIPLE_PARTS,this.$route,{},{},{partsOrQuestions: glassNameAndPartsForStore});
             } else {
                 // if single parts only
                 // go to quote page
                 this.$router.navigate(this.navigationScenarios.ANSWERED_QUESTIONS_WITH_SINGLE_PART,this.$route);
             }
+
+        // TODO - ADD CHECK FOR CAPABILITY QUESTIONS TO SEE IF NAVIGATE TO CAPABILITY-QUESTIONS
+
+
+
         },
         arePagePrerequisitesValid() {
             return Object.keys(store.getters.pageData(fmgPageValues.PART_QUESTIONS)).length > 0;

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

@@ -65,112 +65,90 @@
   import { storeActions } from "@/constants/store-actions";
   import vehicleQuestionsMixin from "@/mixins/vehicle-questions-mixin";
 
-  export default {
+export default {
     name: "vehicle-parts",
     mixins: [vehicleQuestionsMixin],
     async beforeRouteEnter(to, from, next) {
-      // Call APIs
+        // Call APIs
-      const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
+        const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
-      // Settle promises and get results
+        // Settle promises and get results
-      const promiseResultMap = [
+        const promiseResultMap = [
         {
-          resultKey: "cmsContent",
+            resultKey: "cmsContent",
-          promise: cmsContentPromise,
+            promise: cmsContentPromise,
         },
-      ];
+        ];
-      const resultMap = await settleAllPromises(promiseResultMap);
+        const resultMap = await settleAllPromises(promiseResultMap);
-      // Call the "next" function to complete the transition to this page.
+        // Call the "next" function to complete the transition to this page.
-      next((vm) => {
+        next((vm) => {
         vm.setCmsContent(resultMap.cmsContent);
 
         // Glass Part Question dynamic component
         Object.keys(vm.$refs)
-          .filter(
+            .filter((r) => r.includes(vm.RefPrefix) && vm.$refs[r][0] !== undefined)
-            (r) => r.includes(vm.RefPrefix) && vm.$refs[r][0] !== undefined
+            .forEach((c) =>
-          )
-          .forEach((c) =>
             vm.$refs[c][0].initializeComponent({
-              ColorQuestionWidget: resultMap.cmsContent.ColorQuestionWidget,
+                ColorQuestionWidget: resultMap.cmsContent.ColorQuestionWidget,
-              FeatureQuestionWidget: resultMap.cmsContent.FeatureQuestionWidget,
+                FeatureQuestionWidget: resultMap.cmsContent.FeatureQuestionWidget,
             })
-          );
+            );
-      });
+        });
     },
     data() {
-      return {
+        return {
-        glassParts: {},
+            glassParts: {},
-        alertWidgetData: Object,
+            matchedParts: [],
-        alreadyPopulatedPartsData: {},
+            alertWidgetData: Object,
-      };
+            alreadyPopulatedPartsData: {},
-    },
+        };
-    components: {
-      Form,
-      glassPartQuestion,
-      funnelHeader,
-      vehicleBanner,
-      funnelSubHeader,
-      funnelFooter,
-      alert,
     },
     computed: {
-      isForwardActionDisabled() {
+        isForwardActionDisabled() {
-        return (
+            return (
-          Object.keys(this.matchedParts).length !==
+                this.selectedGlassPartNumbers.length !== this.PartsFromApi.partsOrQuestions.length
-          this.PartsFromApi.partsOrQuestions.length
+            );
-        );
+        },
-      },
+        selectedGlassPartNumbers () {
-      matchedParts() {
+            // Compile all selected parts from the page.
-        const matchedParts = [];
+            const numberArray = [];
+            for (let glassPart of Object.values(this.glassParts)) {
+                if (glassPart?.partNumber) { numberArray.push(glassPart.partNumber) }
+            }
+            return numberArray;
+        },
+        PartsOrQuestions() {
+            const partsData = this.PartsFromApi;
 
-        // Match them to the parts from the API.
+            // Map API result data, to vehicle-parts data structure
-        this.PartsFromApi.partsOrQuestions.forEach((part) => {
+            const mappedData = partsData.partsOrQuestions.map((g) => {
-          const selectedPartForGlassLocationAndName =
+                return {
-            this.glassParts[`${part.glassLocation}-${part.glassName}`];
+                    glassName: g.glassName,
-          const selectedPartData = part.parts.filter(
+                    glassLocation: g.glassLocation,
-            (part) =>
+                    colorAnswers: g.parts.reduce((arr, p) => {
-              selectedPartForGlassLocationAndName &&
+                        arr.push({
-              part.partNumber == selectedPartForGlassLocationAndName?.partNumber
+                            ColorAnswerText: p.color,
-          )[0];
+                            FeatureAnswers: [
+                                {
+                                FeatureAnswerText: p.description === "" ? p.color : p.description,
+                                PartNumber: p.partNumber,
+                                },
+                            ],
+                        });
+                        return arr;
+                    }, []),
+                };
+            });
 
-          if (selectedPartData) matchedParts.push(selectedPartData);
+            return mappedData;
-        });
+        },
 
-        return matchedParts;
+        PartsFromApi() {
-      },
+            return store.getters.pageData(fmgPageValues.VEHICLE_PARTS);
-      PartsOrQuestions() {
+        },
-        const partsData = this.PartsFromApi;
 
-        // Map API result data, to vehicle-parts data structure
+        RefPrefix() {
-        const mappedData = partsData.partsOrQuestions.map((g) => {
+            return "partQuestion";
-          return {
+        },
-            glassName: g.glassName,
-            glassLocation: g.glassLocation,
-            colorAnswers: g.parts.reduce((arr, p) => {
-              arr.push({
-                ColorAnswerText: p.color,
-                FeatureAnswers: [
-                  {
-                    FeatureAnswerText:
-                      p.description === "" ? p.color : p.description,
-                    PartNumber: p.partNumber,
-                  },
-                ],
-              });
-              return arr;
-            }, []),
-          };
-        });
-
-        return mappedData;
-      },
-
-      PartsFromApi() {
-        return store.getters.pageData(fmgPageValues.VEHICLE_PARTS);
-      },
-
-      RefPrefix() {
-        return "partQuestion";
-      },
     },
     methods: {
       arePagePrerequisitesValid() {
@@ -191,74 +169,97 @@
       async forwardButtonAction() {
         const selectedGlassPartNumbers = [];
         const matchedParts = [];
-
+        let isMoldingQuestions = false;
-        // Compile all selected parts from the page.
-        for (let [key, value] of Object.entries(this.glassParts)) {
-          for (let [glassKey, glassValue] of Object.entries(value)) {
-            selectedGlassPartNumbers.push(glassValue[0]);
-          }
-        }
 
         // Match them to the parts from the API.
         for (let [key, value] of Object.entries(
-          this.PartsFromApi.partsOrQuestions
+            this.PartsFromApi.partsOrQuestions
         )) {
-          for (let [partKey, partValue] of Object.entries(value.parts)) {
+            for (let [partKey, partValue] of Object.entries(value.parts)) {
-            const currentPart =
-              this.PartsFromApi.partsOrQuestions[key].parts[partKey];
-            const isMatched = selectedGlassPartNumbers.some(
-              (p) => p === currentPart.partNumber
-            );
 
-            if (isMatched) {
+                const currentPart = this.PartsFromApi.partsOrQuestions[key].parts[partKey];
-              matchedParts.push(currentPart);
+
+                const isMatched = this.selectedGlassPartNumbers.some(
+                    (p) => p === currentPart.partNumber
+                );
+
+                if (isMatched) {
+                    this.matchedParts.push(currentPart);
+                    // check if there are childPartQuestions (for molding-questions)
+                    if (Array.isArray(currentPart.childPartQuestions) && currentPart.childPartQuestions.length > 0) { 
+                        isMoldingQuestions = true
+                    }
+                }
             }
-          }
         }
 
-        // If no parts could be matched, throw an error.
+        // If no parts could be matched, throw an error (isForwardActionDisabled is based off of this.matchedParts)
         if (this.isForwardActionDisabled) {
-          this.$refs.funnelFooter.removeLoader();
+            this.$refs.funnelFooter.removeLoader();
-          throw new Error("Could not match any parts to the selected parts");
+            throw new Error("Could not match any parts to the selected parts");
         }
 
-        // Save parts to the store.
+        // Navigate to the next page
-        await this.dispatchStoreAction(
+        if (isMoldingQuestions) {
-          storeActions.SAVE_GLASS_PARTS,
+            this.$router.navigate(
-          matchedParts
+                this.navigationScenarios.HAS_MOLDING_QUESTIONS,
-        );
+                this.$route,
+                {},
+                {},
+                this.moldingQuestionsForStore
+            );
+        }
+        else {
+            // Save parts to the store
+            await this.dispatchStoreAction(
+                storeActions.SAVE_GLASS_PARTS,
+                this.matchedParts,
+                false
+            );
+            // Navigate to the quote page
+            this.$router.navigate(
+                this.navigationScenarios.SELECTED_PARTS,
+                this.$route
+            );
+        }
 
-        // Navigate to the next page.
+        // TODO - ADD CHECK FOR CAPABILITY QUESTIONS TO SEE IF NAVIGATE TO CAPABILITY-QUESTIONS
-        this.$router.navigate(
+
-          this.navigationScenarios.SELECTED_PARTS,
+        },
-          this.$route
-        );
-      },
 
       LoadInitialPartsData() {
-        const partsData = this.PartsFromApi;
+            const partsData = this.PartsFromApi;
-        const alreadyPopulatedPartsData =
+            const alreadyPopulatedPartsData =
-          this.$store.getters.lineItems.glassParts === null
+                this.$store.getters.lineItems.glassParts === null
-            ? {}
+                ? {}
-            : this.$store.getters.lineItems.glassParts;
+                : this.$store.getters.lineItems.glassParts;
 
-        partsData.partsOrQuestions.map((g) => {
+            partsData.partsOrQuestions.map((g) => {
-          // If the part is already populated, use the value from the store and populate the v-model.
+                // If the part is already populated, use the value from the store and populate the v-model.
-          Object.keys(alreadyPopulatedPartsData).forEach((key) => {
+                Object.keys(alreadyPopulatedPartsData).forEach((key) => {
-            const partNumber = alreadyPopulatedPartsData[key].partNumber;
+                const partNumber = alreadyPopulatedPartsData[key].partNumber;
-            g.parts.forEach((p) => {
+                g.parts.forEach((p) => {
-              if (p.partNumber === partNumber) {
+                    if (p.partNumber === partNumber) {
-                this.glassParts[g.glassLocation + "-" + g.glassName] = {
+                    this.glassParts[g.glassLocation + "-" + g.glassName] = {
-                  [g.glassLocation]: [partNumber],
+                        [g.glassLocation]: [partNumber],
-                };
+                    };
-              }
+                    }
+                });
+                });
             });
-          });
+        },
-        });
-      },
     },
     mounted() {
-      this.LoadInitialPartsData();
+        this.LoadInitialPartsData();
     },
-  };
+    components: {
+        Form,
+        glassPartQuestion,
+        funnelHeader,
+        vehicleBanner,
+        funnelSubHeader,
+        funnelFooter,
+        alert,
+    },
+};
 </script>

src/mixins/vehicle-questions-mixin.js

@@ -5,6 +5,11 @@ export default {
         },
         hasGlassLocationWithMultipleParts(partsOrQuestions) {
             return partsOrQuestions.some(pq => pq.parts?.length > 1);
+        },
+        hasChildPartQuestions(partsOrQuestions) {
+            return partsOrQuestions.some(pq => {
+                return pq.parts?.some(part => part.childPartQuestions?.length > 0);
+            });
         }
     }
 }

src/mixins/vin-pages-mixin.js

@@ -9,10 +9,12 @@ export default {
     methods: {
         async navigateForwardWithSingleCarMatch() {
             const result = await this.dispatchStoreAction(storeActions.GET_PARTS_OR_QUESTIONS);
-     
             const partsOrQuestions = result.data.partsOrQuestions;
             const hasPartsQuestions = this.hasPartQuestions(partsOrQuestions);
             const hasGlassLocationWithMultipleParts = this.hasGlassLocationWithMultipleParts(partsOrQuestions);
+            const hasChildPartQuestions = this.hasChildPartQuestions(partsOrQuestions);
+
+            // TODO - ADD CHECK FOR CAPABILITY QUESTIONS TO SEE IF NAVIGATE TO CAPABILITY-QUESTIONS
 
             if (hasPartsQuestions) {
                 this.$router.navigate(this.navigationScenarios.SELECTED_VIN_WITH_PART_QUESTIONS, this.$route, {}, {}, result.data);
@@ -20,6 +22,9 @@ export default {
             else if (hasGlassLocationWithMultipleParts) {
                 this.$router.navigate(this.navigationScenarios.SELECTED_VIN_WITH_MULTIPLE_PARTS, this.$route, {}, {}, result.data);
             }
+            else if (hasChildPartQuestions) {
+                this.$router.navigate(this.navigationScenarios.SELECTED_VIN_WITH_MOLDING_QUESTIONS, this.$route, {}, {}, result.data);
+            }
             else {
                 store.commit(storeMutations.UPDATE_GLASS_PARTS, result.data);
                 this.$refs.loadingModal.showModal();

src/router/index.js

@@ -60,6 +60,9 @@ const routes = [
 
         // On entering the funnel "fresh", read cookie information, decide what to do next.
         if (from.redirectedFrom === undefined) {
+          // clear the saveOrderPromise - if it exists in the vuex store but a new instance was created
+          //   the saveOrderPromise will no longer point to a valid promise
+          baseMixin.methods.dispatchStoreAction(storeActions.RESET_SAVE_ORDER_PROMISE);
           const loadOrderResponse = await loadOrderIfPresent();
           const pageToRedirectTo = await getPageToRouteExistingOrderTo(to, loadOrderResponse);
 

src/router/router-constants/fmgPage-values.js

@@ -8,6 +8,7 @@ const fmgPageValues = {
   VIN_LOOKUP: "vin-lookup",
   VEHICLE_PARTS: "vehicle-parts",
   PART_QUESTIONS: "part-questions",
+  MOLDING_QUESTIONS: "molding-questions",
   LICENSE_PLATE_LOOKUP: "license-plate-lookup",
   REVEAL: "reveal",
   ESTIMATE: "estimate",

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

@@ -10,6 +10,7 @@ const navigationScenarios = {
   SELECTED_PARTS: "SELECTED_PARTS",
   SELECTED_VIN_WITH_PART_QUESTIONS: "SELECTED_VIN_WITH_PART_QUESTIONS",
   SELECTED_VIN_WITH_MULTIPLE_PARTS: "SELECTED_VIN_WITH_MULTIPLE_PARTS",
+  SELECTED_VIN_WITH_MOLDING_QUESTIONS: "SELECTED_VIN_WITH_MOLDING_QUESTIONS",
   CONTINUING_WITH_SINGLE_PART: "CONTINUING_WITH_SINGLE_PART",
   CONTINUING_WITH_MULTIPLE_VEHICLES: "CONTINUING_WITH_MULTIPLE_VEHICLES",
   SELECTED_VIN_HAS_MISMATCHED_GLASS: "SELECTED_VIN_HAS_MISMATCHED_GLASS",
@@ -21,7 +22,8 @@ const navigationScenarios = {
   ANSWERED_QUESTIONS_WITH_MULTIPLE_PARTS: "ANSWERED_QUESTIONS_WITH_MULTIPLE_PARTS",
   SELECTED_PROVIDE_VIN_DIFFERENT_WAY: "SELECTED_PROVIDE_VIN_DIFFERENT_WAY",
   CLICKED_BACK_WITH_PART_QUESTION_ANSWERS: "CLICKED_BACK_WITH_PART_QUESTION_ANSWERS",
-  CLICKED_BACK_WITHOUT_PART_QUESTION_ANSWERS: "CLICKED_BACK_WITHOUT_PART_QUESTION_ANSWERS"
+  CLICKED_BACK_WITHOUT_PART_QUESTION_ANSWERS: "CLICKED_BACK_WITHOUT_PART_QUESTION_ANSWERS",
+  HAS_MOLDING_QUESTIONS: "HAS_MOLDING_QUESTIONS",
 };
 
 export { navigationScenarios };

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

@@ -135,6 +135,10 @@ const routingTable = function(store) {
         {
           scenario: navigationScenarios.SELECTED_VIN_WITH_MULTIPLE_PARTS,
           destinationFmgPageValue: fmgPageValues.VEHICLE_PARTS
+        },
+        {
+          scenario: navigationScenarios.SELECTED_VIN_WITH_MOLDING_QUESTIONS,
+          destinationFmgPageValue: fmgPageValues.MOLDING_QUESTIONS
         }
       ],
     },
@@ -156,6 +160,10 @@ const routingTable = function(store) {
         {
           scenario: navigationScenarios.SELECTED_VIN_WITH_MULTIPLE_PARTS,
           destinationFmgPageValue: fmgPageValues.VEHICLE_PARTS
+        },
+        {
+          scenario: navigationScenarios.SELECTED_VIN_WITH_MOLDING_QUESTIONS,
+          destinationFmgPageValue: fmgPageValues.MOLDING_QUESTIONS
         }
       ],
     },
@@ -181,6 +189,10 @@ const routingTable = function(store) {
         {
           scenario: navigationScenarios.SELECTED_VIN_WITH_MULTIPLE_PARTS,
           destinationFmgPageValue: fmgPageValues.VEHICLE_PARTS
+        },
+        {
+          scenario: navigationScenarios.SELECTED_VIN_WITH_MOLDING_QUESTIONS,
+          destinationFmgPageValue: fmgPageValues.MOLDING_QUESTIONS
         }
       ],
     },
@@ -241,12 +253,25 @@ const routingTable = function(store) {
           scenario: navigationScenarios.ANSWERED_QUESTIONS_WITH_MULTIPLE_PARTS,
           destinationFmgPageValue: fmgPageValues.VEHICLE_PARTS
         },
+        {
+          scenario: navigationScenarios.HAS_MOLDING_QUESTIONS,
+          destinationFmgPageValue: fmgPageValues.MOLDING_QUESTIONS,
+        },
         {
           scenario: navigationScenarios.ANSWERED_QUESTIONS_WITH_SINGLE_PART,
           destinationFmgPageValue: fmgPageValues.QUOTE,
         },
       ]
     },
+    {
+      fmgPageValue: fmgPageValues.MOLDING_QUESTIONS,
+      maps: [
+        {
+          scenario: navigationScenarios.CLICKED_BACK,
+          destinationFmgPageValue: fmgPageValues.VEHICLE_PARTS
+        },
+      ]
+    },
   ];
 }
 

src/store/index.js

@@ -67,7 +67,7 @@ const getDefaultState = () => {
       pageData: {},
       savedSessionTimeout: getDateForSavedSessionTimeout(),
       saveOrderPromise: null,
-      saveQuoteId: null,
+      savedSessionId: null,
       crmCustomerId: null,
       lastPageVisited: null,
       experiments: []
@@ -210,8 +210,8 @@ export const mutations = {
   updateSaveOrderPromise(state, saveOrderPromise){
     state.applicationUser.saveOrderPromise = saveOrderPromise;
   },
-  updateSaveQuoteId(state, saveQuoteId) {
+  updateSavedSessionId(state, savedSessionId) {
-    state.applicationUser.saveQuoteId = saveQuoteId;
+    state.applicationUser.savedSessionId = savedSessionId;
   },
   updateCrmCustomerId(state, crmCustomerId) {
     state.applicationUser.crmCustomerId = crmCustomerId;
@@ -273,7 +273,9 @@ export const mutations = {
   resetState(state) {
     Object.assign(state, getDefaultState());
   },
-
+  resetSaveOrderPromise(state) {
+    state.applicationUser.saveOrderPromise = null;
+  },
   // Misc Mutations
   updateStateWithOrderInformation(state, orderInformation) {
     state.order.referralNumber = orderInformation.referralNumber;
@@ -461,6 +463,9 @@ export const actions = {
   resetState(context) {
     context.commit(storeMutations.RESET_STATE);
   },
+  resetSaveOrderPromise(context) {
+    context.commit(storeMutations.RESET_SAVE_ORDER_PROMISE);
+  },
 
   // Content API Actions
   getRouteInfo(context, { pageName }) {
@@ -501,12 +506,12 @@ export const actions = {
   },
 
   // Misc Actions
-  updateStoreWithSaveOrderResponse(context, { referralNumber, referralDate, referralCorrelationId, accountNumber, saveQuoteId, crmCustomerId }) {
+  updateStoreWithSaveOrderResponse(context, { referralNumber, referralDate, referralCorrelationId, accountNumber, savedSessionId, crmCustomerId }) {
     context.commit(storeMutations.UPDATE_REFERRAL_NUMBER, referralNumber);
     context.commit(storeMutations.UPDATE_REFERRAL_DATE, referralDate);
     context.commit(storeMutations.UPDATE_REFERRAL_CORRELATION_ID, referralCorrelationId);
     context.commit(storeMutations.UPDATE_PARENT_ACCT_NUMBER, accountNumber);
-    context.commit(storeMutations.UPDATE_SAVE_QUOTE_ID, saveQuoteId);
+    context.commit(storeMutations.UPDATE_SAVED_SESSION_ID, savedSessionId);
     context.commit(storeMutations.UPDATE_CRM_CUSTOMER_ID, crmCustomerId);
   },
 
@@ -689,7 +694,7 @@ export const actions = {
         existingPromoCode: null,
         lastPage: applicationUser.lastPageVisited,
         crmCustomerId: applicationUser.crmCustomerId,
-        saveQuoteId: applicationUser.saveQuoteId,
+        savedSessionId: applicationUser.savedSessionId,
 
       },
     });
@@ -705,7 +710,10 @@ export const actions = {
         accountNumber: accountNumber?.toString()
       },
     }).then((response) => {
-      // context.commit(storeMutations.RESET_STATE);
+      // clear the state if the existing referral number does not equal what is returned from loadOrder
+      if (context.state.order.referralNumber != response.data.referralNumber) {
+        context.commit(storeMutations.RESET_STATE);
+      }
       context.commit(storeMutations.UPDATE_STATE_WITH_ORDER_INFORMATION, response.data);
       return response;
     });

src/store/store.spec.js

@@ -574,7 +574,7 @@ describe("Actions", () => {
       applicationUser: {
         lastPageVisited: "test-page",
         crmCustomerId: "xxx-xxx-xxx",
-        saveQuoteId: "xxx-xxx-xxx"
+        savedSessionId: "xxx-xxx-xxx"
       }
     };
     context.state = {
@@ -630,7 +630,7 @@ describe("Actions", () => {
         referralDate: new Date().toUTCString(), 
         referralCorrelationId: "xxx-xxx-xxx", 
         accountNumber: "167132",
-        saveQuoteId: "xxx-xxx-xxx",
+        savedSessionId: "xxx-xxx-xxx",
         crmCustomerId: "xxx-xxx-xxx",
       });
 
@@ -639,7 +639,7 @@ describe("Actions", () => {
     expect(commit).toBeCalledWith(storeMutations.UPDATE_REFERRAL_DATE, new Date().toUTCString());
     expect(commit).toBeCalledWith(storeMutations.UPDATE_REFERRAL_CORRELATION_ID, "xxx-xxx-xxx");
     expect(commit).toBeCalledWith(storeMutations.UPDATE_PARENT_ACCT_NUMBER, "167132");
-    expect(commit).toBeCalledWith(storeMutations.UPDATE_SAVE_QUOTE_ID, "xxx-xxx-xxx");
+    expect(commit).toBeCalledWith(storeMutations.UPDATE_SAVED_SESSION_ID, "xxx-xxx-xxx");
     expect(commit).toBeCalledWith(storeMutations.UPDATE_CRM_CUSTOMER_ID, "xxx-xxx-xxx");
   });