Merge branch 'develop' into refactor/linting9

.eslintrc.js

@@ -33,6 +33,7 @@ module.exports = {
         'jsdoc/check-tag-names': ['error', {
             definedTags: ['store', 'endpoint', 'category', 'subcategory', 'remarks']
         }],
+        'jsdoc/require-jsdoc': 0,
         'vue/html-self-closing': ['error', {
             html: {
                 void: 'any',

src/layouts/access-denied/access-denied.vue

@@ -0,0 +1,29 @@
+<template>
+    <div class="page-container-grouped-styles access-denied">
+        <div class="fade-on-route-transition position-relative">
+            <div class="container-fluid px-5">
+                <div class="row mt-5">
+                    <div class="col d-flex justify-content-center">
+                        <span>Unauthorized Access</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+// Supporting files
+import BaseFormMixin from '@/mixins/base-form-mixin.js';
+
+export default {
+    name: 'access-denied',
+    mixins: [BaseFormMixin],
+    data() {
+        return {};
+    },
+    methods: {}
+};
+</script>
+
+<style lang="scss"></style>

src/layouts/coverage-statement/coverage-statement.vue

@@ -442,7 +442,7 @@ export default {
     line-height: 1.5rem;
 }
 
-::v-deep p {
+:deep p {
     line-height: 1.5rem;
     font-size: 0.875rem;
     margin-bottom: 0.5rem;
@@ -451,7 +451,7 @@ export default {
     }
 }
 
-::v-deep .question-text {
+:deep .question-text {
     margin-top: 1.5rem;
     margin-bottom: 0.5rem;
     font-size: 1rem;
@@ -461,7 +461,7 @@ export default {
     }
 }
 
-::v-deep .deductible-modal {
+:deep .deductible-modal {
   p {
     margin-bottom: 0 !important;
     font-size: 1rem;

src/layouts/coverage-statement/recal-modal/recal-modal.vue

@@ -74,7 +74,7 @@ export default {
 
 <style lang="scss" scoped>
 
-::v-deep .recal-modal-body {
+:deep .recal-modal-body {
     h5 {
         color: $black;
     }

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

@@ -230,7 +230,7 @@ export default {
     },
     methods: {
         arePagePrerequisitesValid() {
-            if (this.mainStore.order.vehicle.carId) {
+            if (useMainStore().order.vehicle.carId) {
                 return true;
             }
             return false;

src/router/index.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-use-before-define */
 import { createWebHistory, createRouter } from 'vue-router';
 import lazyLoadComponent from '@/router/dynamic-routing/component-loader';
 import issPageValues from '@/router/router-constants/issPage-values';
@@ -6,11 +7,8 @@ import { useMainStore } from '@/store';
 import eventBus from '@/helpers/event-bus/event-bus';
 import { globalEvents, globalEventTypes } from '@/constants/events';
 import baseMixin from '@/mixins/base-mixin';
-import {
+import { isSavedSessionStillActive } from '@/helpers/session-helper';
-    getDeviceIdValue,
+import { getDeviceIdValue, getISSCookie, updateOrCreateISSCookie, updateSessionIdCookie } from '@/helpers/cookie-helper';
-    updateOrCreateISSCookie,
-    updateSessionIdCookie
-} from '@/helpers/cookie-helper';
 import { experimentTriggers } from '@/constants/experiments';
 import applicationConfig from '@/constants/application-config';
 
@@ -23,29 +21,52 @@ const routes = [
         name: 'root',
         async beforeEnter(to, from, next) {
             try {
-                to.query.issPage = !to.query.issPage
+                const issPageToUse = !to.query.issPage ? issPageValues.WELCOME_PAGE : to.query.issPage;
-                    ? issPageValues.WELCOME_PAGE
+
-                    : to.query.issPage;
+                if ((issPageToUse === issPageValues.ACCESS_DENIED
+                    || (issPageToUse !== issPageValues.ENTRY_PAGE && !useMainStore().issConfig.accountNumber))
+                    && process.env.VUE_APP_CURRENT_ENVIRONMENT !== 'Localhost'
+                ) {
+                    return await GoToAccessIsDenied(next);
+                }
 
                 // Do not run these for the main entry page - as it is not part of the user flow.
-                if (to.query.issPage !== issPageValues.ENTRY_PAGE) {
+                if (issPageToUse !== issPageValues.ENTRY_PAGE) {
                     if (analyticsMixin.methods.noSession()) {
                         await analyticsMixin.methods.initSession();
                     } else {
                         updateSessionIdCookie();
                     }
 
-                    await runExperiments(to.query.issPage);
+                    await runExperiments(issPageToUse); // fmg has this further down
+                }
+
+                // If the saved session has timed out, clear the session, execute 404 logic.
+                if (getISSCookie() !== null && !isSavedSessionStillActive()) {
+                    // await baseMixin.methods.dispatchStoreAction(storeActions.RESET_STATE);
+                    await GoToStartOn404(next);
                 }
 
                 // Process ISS cookie.
                 updateOrCreateISSCookie();
 
-                if (router.hasRoute(to.query.issPage)) {
+                if (router.hasRoute(issPageToUse)) {
-                    return next({ name: to.query.issPage, query: to.query, params: to.params });
+                    // Since our route is already in scope, we can grab the component and call the arePagePrerequisitesValid function.
+                    let component = router.getRoutes().filter((x) => x.name === issPageToUse)[0].components;
+
+                    // If the component hasn't been loaded fully, load it before we check prerequisites.
+                    if (component.default.methods === undefined) {
+                        component = await component.default();
+                    }
+
+                    if (!arePagePrerequisitesValid(component)) {
+                        await GoToStartOn404(next);
+                    }
+
+                    return next({ name: issPageToUse, query: to.query, params: to.params });
                 }
 
-                const routeData = await GetRouteInfoFromPageName(to.query.issPage);
+                const routeData = await GetRouteInfoFromPageName(issPageToUse);
 
                 if (routeData[0].name.toLowerCase() === 'error') {
                     throw new Error('Page not found!');
@@ -58,6 +79,19 @@ const routes = [
                     component: routeData[0].component
                 });
 
+                // Call the next components arePagePrerequisitesValid method before load.
+                // If it returns false, use the 404 logic.
+                const nextComponent = await router
+                    .getRoutes()
+                    .filter((x) => x.name === routeData[0].name)[0]
+                    .components.default();
+
+                if (!arePagePrerequisitesValid(nextComponent)) {
+                    const tempMsgCopy = 'Pre Requisites failed, need to handle.  Default is Welcome Page.';
+                    const tempMsgHeadline = `${issPageToUse}: pre-req failed...`;
+                    await GoToStartOn404(next, tempMsgCopy, tempMsgHeadline);
+                }
+
                 // Assign current query string parameters, as well as our issPage one.
                 next({
                     name: routeData[0].name,
@@ -66,7 +100,7 @@ const routes = [
                 });
             } catch (error) {
                 window.console.warn(error);
-                GoToStartOn404(next);
+                await GoToStartOn404(next);
             }
             return null;
         }
@@ -76,15 +110,13 @@ const routes = [
 const router = createRouter({
     history: createWebHistory('/'),
     routes,
-    scrollBehavior(to, from, savedPosition) {
+    scrollBehavior() {
         // always scroll to top
         return { top: 0 };
     }
 });
 
-router.afterEach((to, from) => {
+router.afterEach((to) => {
-    /*eslint-disable-line*/
-
     const store = useMainStore();
     // Update lastPageVisited in the store
     store.updateLastPageVisited(to.name);
@@ -202,7 +234,7 @@ function navigate(
 function navigateToUrl(url, optionalQuery = {}) {
     // possibly show some loading screen in the future here.
     const externalUrl = new URL(url);
-    // eslint-disable-next-line no-restricted-syntax
+    // eslint-disable-next-line no-restricted-syntax, guard-for-in
     for (const queryKey in optionalQuery) {
         externalUrl.searchParams.append(queryKey, optionalQuery[queryKey]);
     }
@@ -215,9 +247,7 @@ function getNavigationMap(scenario, currentRoute) {
     const issPageValue = currentRoute.query.issPage;
     try {
         const matchedQueryValue = routingTable(useMainStore())
-            .filter((item) =>
+            .filter((item) => item.issPageValue === issPageValue && item.maps.filter((map) => map.scenario === scenario).length > 0);
-                item.issPageValue === issPageValue
-                && item.maps.filter((map) => map.scenario === scenario).length > 0);
 
         const maps = matchedQueryValue ? matchedQueryValue.map((m) => m.maps.filter((map) => map.scenario === scenario))[0] : undefined;
 
@@ -228,7 +258,21 @@ function getNavigationMap(scenario, currentRoute) {
     }
 }
 
-function GoToStartOn404(next) {
+async function GoToAccessIsDenied(next) {
+    const errorPageName = issPageValues.ACCESS_DENIED;
+    router.addRoute({
+        path: '/',
+        name: errorPageName,
+        component: lazyLoadComponent(errorPageName)
+    });
+
+    next({
+        name: errorPageName,
+        query: { issPage: errorPageName }
+    });
+}
+
+async function GoToStartOn404(next, msgCopy = null, msgHeadline = null) {
     const errorPageName = issPageValues.WELCOME_PAGE;
     router.addRoute({
         path: '/',
@@ -237,16 +281,12 @@ function GoToStartOn404(next) {
     });
 
     // Put item on the bus
-    eventBus.addEventToBus(
+    eventBus.addEventToBus(globalEvents.Categories.GLOBAL_ALERT, globalEvents.SubCategories.PAGE_NOT_FOUND, {
-        globalEvents.Categories.GLOBAL_ALERT,
+        isDismissible: true,
-        globalEvents.SubCategories.PAGE_NOT_FOUND,
+        messageCopy: msgCopy ?? 'You can get a quote by starting on this page.',
-        {
+        messageHeadline: msgHeadline ?? "We're sorry, something went wrong.",
-            isDismissible: true,
+        type: globalEventTypes.Danger
-            messageCopy: 'You can get a quote by starting on this page.',
+    });
-            messageHeadline: "We're sorry, something went wrong.",
-            type: globalEventTypes.Danger
-        }
-    );
 
     next({
         name: errorPageName,
@@ -254,6 +294,11 @@ function GoToStartOn404(next) {
     });
 }
 
+// Checks arePagePrerequisitesValid on the component passed in.
+function arePagePrerequisitesValid(component) {
+    return component.default.methods.arePagePrerequisitesValid === undefined || component.default.methods.arePagePrerequisitesValid();
+}
+
 // Run SiteEntry and PageEntry triggers for experiments
 async function runExperiments(nextPage) {
     const store = useMainStore();

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

@@ -1,4 +1,5 @@
 const issPageValues = Object.freeze({
+    ACCESS_DENIED: 'access-denied',
     ENTRY_PAGE: 'entry-page',
     WELCOME_PAGE: 'welcome-page',
 

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

@@ -319,6 +319,15 @@ const routingTable = () => [
             }
         ]
     },
+    {
+        issPageValue: issPageValues.ACCESS_DENIED,
+        maps: [
+            {
+                scenario: navigationScenarios.CLICKED_BACK,
+                destinationIssPageValue: issPageValues.ACCESS_DENIED
+            }
+        ]
+    },
     {
         issPageValue: issPageValues.ENTRY_PAGE,
         maps: [

vue.config.js

@@ -1,14 +1,14 @@
+/* eslint-disable max-len */
 process.env.VUE_APP_CONSUMER_CF_DISTRO = 'https://digitalapi.dev.safelite.io';
 process.env.VUE_APP_CURRENT_ENVIRONMENT = 'Localhost';
-process.env.VUE_APP_GOOGLE_PLACES_API_KEY
+process.env.VUE_APP_GOOGLE_PLACES_API_KEY = 'AIzaSyCuLhQcDdZTTb4JzpUFms1OCch2dk5lHF0';
-  = 'AIzaSyCuLhQcDdZTTb4JzpUFms1OCch2dk5lHF0';
 
 // GA & GTM
 // NOTE: Using the old ISS site GTM Cotnainer ID for now, will create a new one soon.
-process.env.VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY
+process.env.VUE_APP_GOOGLE_TAG_MANAGER_SCRIPT_BODY =
-    = "(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-KKNWZ3');";
+    "(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src='https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);})(window,document,'script','dataLayer','GTM-KKNWZ3');";
-process.env.VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC
+process.env.VUE_APP_GOOGLE_TAG_MANAGER_NOSCRIPT_FRAME_SRC =
-    = 'https://www.googletagmanager.com/ns.html?id=GTM-KKNWZ3&gtm_auth=amlAYNhxUxuskQo7jmjadg&gtm_preview=env-38&gtm_cookies_win=x';
+    'https://www.googletagmanager.com/ns.html?id=GTM-KKNWZ3&gtm_auth=amlAYNhxUxuskQo7jmjadg&gtm_preview=env-38&gtm_cookies_win=x';
 
 module.exports = {
     publicPath: '/',