commit so I can merge develop again

package.json

@@ -19,6 +19,7 @@
     "pinia-plugin-persistedstate": "^2.2.0",
     "vee-validate": "^4.7.0",
     "vue": "^3.2.13",
+    "vue-plugin-load-script": "^2.1.0",
     "vue-router": "^4.0.3"
   },
   "devDependencies": {

src/constants/states.js

@@ -0,0 +1,53 @@
+export const states = {
+    AL: "Alabama",
+    AK: "Alaska",
+    AZ: "Arizona",
+    AR: "Arkansas",
+    CA: "California",
+    CO: "Colorado",
+    CT: "Connecticut",
+    DE: "Delaware",
+    DC: "District Of Columbia",
+    FL: "Florida",
+    GA: "Georgia",
+    HI: "Hawaii",
+    ID: "Idaho",
+    IL: "Illinois",
+    IN: "Indiana",
+    IA: "Iowa",
+    KS: "Kansas",
+    KY: "Kentucky",
+    LA: "Louisiana",
+    ME: "Maine",
+    MD: "Maryland",
+    MA: "Massachusetts",
+    MI: "Michigan",
+    MN: "Minnesota",
+    MS: "Mississippi",
+    MO: "Missouri",
+    MT: "Montana",
+    NE: "Nebraska",
+    NV: "Nevada",
+    NH: "New Hampshire",
+    NJ: "New Jersey",
+    NM: "New Mexico",
+    NY: "New York",
+    NC: "North Carolina",
+    ND: "North Dakota",
+    OH: "Ohio",
+    OK: "Oklahoma",
+    OR: "Oregon",
+    PA: "Pennsylvania",
+    RI: "Rhode Island",
+    SC: "South Carolina",
+    SD: "South Dakota",
+    TN: "Tennessee",
+    TX: "Texas",
+    UT: "Utah",
+    VT: "Vermont",
+    VA: "Virginia",
+    WA: "Washington",
+    WV: "West Virginia",
+    WI: "Wisconsin",
+    WY: "Wyoming",
+};

src/layouts/address-lookup/address-lookup.vue

@@ -6,12 +6,12 @@
         v-slot="{ meta }"
         autocomplete="off">
         <div class="page-container-grouped-styles">
-            <siteHeader cmsWidgetName="siteHeaderWidget" ref="siteHeader" />
+            <siteHeader cmsWidgetName="SiteHeaderWidget" ref="siteHeader" />
             <vehicleBanner
                 cmsWidgetName="VehicleBannerWidget"
                 ref="vehicleBanner"
                 :displayGenericVehicleImage="false" />
-            <siteSubHeader cmsWidgetName="siteSubHeaderWidget" ref="siteSubHeader" />
+            <siteSubHeader cmsWidgetName="SiteSubHeaderWidget" ref="siteSubHeader" />
             <div class="fade-on-route-transition sub-container make-tall">
                 <customerQuestions ref="customerQuestions" v-model="customerQuestions" />
                 <alert
@@ -68,7 +68,7 @@
                     </div>
                 </transition>
                 <siteFooter
-                    cmsWidgetName="siteFooterWidget"
+                    cmsWidgetName="SiteFooterWidget"
                     ref="siteFooter"
                     :isDisabled="!meta.valid"
                     @ForwardClicked="forwardButtonAction"
@@ -111,7 +111,7 @@ defineRule(
 
 export default {
     name: "address-lookup",
-    mixins: [vinPagesMixin],
+    //mixins: [vinPagesMixin],
     async beforeRouteEnter(to, from, next) {
         // Call APIs
         const cmsContentPromise = fetchCmsContentForPage(to.query.issPage);
@@ -164,7 +164,7 @@ export default {
         },
         backButtonAction() {
             // route to move backwards
-            this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
+            this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
         },
         attachCustomEvents() {
             this.prependActionToMethod(this, this.forwardButtonAction, () => {
@@ -177,28 +177,28 @@ export default {
             });
         },
         getRegistrationAddressFromStore() {
-            return this.mainStore.order.vehicle.registration.address;
+            return useMainStore().order.vehicle.registration.address;
         },
         getRegistrationCityFromStore() {
-            return this.mainStore.order.vehicle.registration.city;
+            return useMainStore().order.vehicle.registration.city;
         },
         getRegistrationStateFromStore() {
-            return this.mainStore.order.vehicle.registration.state;
+            return useMainStore().order.vehicle.registration.state;
         },
         getRegistrationZipFromStore() {
-            return this.mainStore.order.vehicle.registration.zipCode;
+            return useMainStore().order.vehicle.registration.zipCode;
         },
         getRegistrationFirstNameFromStore() {
-            return this.mainStore.order.vehicle.registration.firstName;
+            return useMainStore().order.vehicle.registration.firstName;
         },
         getRegistrationLastNameFromStore() {
-            return this.mainStore.order.vehicle.registration.lastName;
+            return useMainStore().order.vehicle.registration.lastName;
         },
         getEmailFromStore() {
-            return this.mainStore.order.customer.emailAddress;
+            return useMainStore().order.customer.emailAddress;
         },
         getServiceZipFromStore() {
-            return this.mainStore.order.serviceLocation.zipCode;
+            return useMainStore().order.serviceLocation.zipCode;
         },
         async forwardButtonAction() {
             this.resetWarningsAndErrors();

src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue

@@ -78,6 +78,7 @@ import { applicationConfig } from "@/constants/application-config.js";
 import { defineRule } from "vee-validate";
 import { required, regex } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
+import { states } from "@/constants/states"
 
 // DEFINE VALIDATION RULES
 defineRule("street-address-required", required(errorMessages.STREET_ADDRESS_REQUIRED));
@@ -119,59 +120,7 @@ export default {
     computed: {
         stateOptions: {
             get: function () {
-                return {
+                return states;
-                    AL: "Alabama",
-                    AK: "Alaska",
-                    AZ: "Arizona",
-                    AR: "Arkansas",
-                    CA: "California",
-                    CO: "Colorado",
-                    CT: "Connecticut",
-                    DE: "Delaware",
-                    DC: "District Of Columbia",
-                    FL: "Florida",
-                    GA: "Georgia",
-                    HI: "Hawaii",
-                    ID: "Idaho",
-                    IL: "Illinois",
-                    IN: "Indiana",
-                    IA: "Iowa",
-                    KS: "Kansas",
-                    KY: "Kentucky",
-                    LA: "Louisiana",
-                    ME: "Maine",
-                    MD: "Maryland",
-                    MA: "Massachusetts",
-                    MI: "Michigan",
-                    MN: "Minnesota",
-                    MS: "Mississippi",
-                    MO: "Missouri",
-                    MT: "Montana",
-                    NE: "Nebraska",
-                    NV: "Nevada",
-                    NH: "New Hampshire",
-                    NJ: "New Jersey",
-                    NM: "New Mexico",
-                    NY: "New York",
-                    NC: "North Carolina",
-                    ND: "North Dakota",
-                    OH: "Ohio",
-                    OK: "Oklahoma",
-                    OR: "Oregon",
-                    PA: "Pennsylvania",
-                    RI: "Rhode Island",
-                    SC: "South Carolina",
-                    SD: "South Dakota",
-                    TN: "Tennessee",
-                    TX: "Texas",
-                    UT: "Utah",
-                    VT: "Vermont",
-                    VA: "Virginia",
-                    WA: "Washington",
-                    WV: "West Virginia",
-                    WI: "Wisconsin",
-                    WY: "Wyoming",
-                };
             },
         },
         addressModel: {

src/layouts/address-lookup/customer-questions/customer-questions.vue

@@ -22,22 +22,6 @@
                 validationRules="last-name-required" />
         </div>
     </div>
-    <div class="row mt-4">
-        <div class="col">
-            <textboxQuestion
-                cmsWidgetName="EmailAddressQuestionWidget"
-                v-model="customerModel.emailAddress"
-                ref="emailAddress"
-                inputId="00450a91b8964a768ce3992e6feb890f"
-                disableAutoFill
-                validationRules="email-address-required|email-address-format" />
-        </div>
-    </div>
-    <div class="row mb-4">
-        <div class="col">
-            <textBlock cmsWidgetName="QuoteEmailTextBlockWidget" typeStyle="caption" />
-        </div>
-    </div>
 </template>
 
 <script>
@@ -45,21 +29,11 @@ import addressQuestions from "@/layouts/address-lookup/customer-questions/addres
 import textboxQuestion from "@/common-components/textbox-question/textbox-question";
 import { defineRule } from "vee-validate";
 import { required } from "@/helpers/validation-rules";
-import { regex } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
-import textBlock from "@/common-components/text-block/text-block";
 
 // DEFINE VALIDATION RULES
 defineRule("first-name-required", required(errorMessages.FIRST_NAME_REQUIRED));
 defineRule("last-name-required", required(errorMessages.LAST_NAME_REQUIRED));
-defineRule("email-address-required", required(errorMessages.EMAIL_ADDRESS_REQUIRED));
-defineRule(
-    "email-address-format",
-    regex(
-        /^([a-zA-Z0-9_\-.+]+)@([a-zA-Z0-9_\-.]+)\.([a-zA-Z]{2,})$/,
-        errorMessages.EMAIL_ADDRESS_FORMAT
-    )
-);
 
 export default {
     name: "customer-questions",
@@ -96,7 +70,6 @@ export default {
     components: {
         addressQuestions,
         textboxQuestion,
-        textBlock,
     },
 };
 </script>

src/main.js

@@ -7,6 +7,7 @@ import { useMainStore } from '@/store';
 import baseMixin from "@/mixins/base-mixin.js";
 import { createPinia } from 'pinia';
 import Maska from "maska";
+import LoadScript from "vue-plugin-load-script";
 
 import analyticsMixin from "@/mixins/analytics-mixin.js";
 import experimentMixin from "@/mixins/experiment-mixin.js";
@@ -31,6 +32,7 @@ useMainStore().populateInitialState();
 // Additional Vue items to setup
 vueApp.use(router);
 vueApp.use(Maska);
+vueApp.use(LoadScript);
 vueApp.mixin(baseMixin);
 vueApp.mixin(analyticsMixin);
 vueApp.mixin(experimentMixin);

src/mixins/vin-pages-mixin.js

@@ -6,7 +6,7 @@ export default {
         async navigateForwardWithSingleCarMatch() {
             const store = useMainStore();
 
-            const result = await store.getParts();
+            const result = await store.getPartsOrQuestions();
             const partsOrQuestions = result.data.partsOrQuestions;
 
             vehicleQuestionsMixin.methods.navigateForward(partsOrQuestions, this);