Cleanup, switched router over to use aysnc/await

src/layouts/vehicle-style/vehicle-style.vue

@@ -35,7 +35,7 @@ export default {
   },
   computed: {},
 
-  beforeRouteEnter(to, from, next) {
+  async beforeRouteEnter(to, from, next) {
     // Call APIs
     const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
     const styleQuestionInitialDataPromise =

src/mixins/base-mixin.js

@@ -3,8 +3,6 @@ import { storeActions } from "@/constants/store-actions.js";
 import { storeMutations } from "@/constants/store-mutations.js";
 import { navigationScenarios } from "@/router/router-constants/navigation-scenarios";
 import { widgetNames } from "@/constants/widget-names.js";
-import { emitter } from "@/helpers/event-bus/event-bus";
-import { globalEvents } from "@/constants/events";
 
 export default {
   data() {
@@ -21,16 +19,6 @@ export default {
 
       return store.dispatch(type, payload);
     },
-    emitGlobalMessage(headline, copy, isDismissible, type) {
-      emitter.emit(globalEvents.GLOBAL_ALERT, {
-        globalAlertMessage: {
-          messageHeadline: headline,
-          messageCopy: copy,
-          isDismissible: isDismissible,
-          type: type
-        }
-      });
-    }
   },
   computed: {
     storeActions() {

src/router/index.js

@@ -1,11 +1,8 @@
 // Supporting files
 import { createWebHistory, createRouter } from "vue-router";
 import { storeActions } from "@/constants/store-actions";
-import { storeMutations } from "@/constants/store-mutations";
 import { lazyLoadComponent } from "@/router/dynamic-routing/component-loader.js";
 import { routingTable } from "@/router/router-constants/routing-table.js";
-import { globalEventTypes } from "@/constants/events";
-import baseMixin from "@/mixins/base-mixin";
 import store from "@/store";
 
 // Components
@@ -14,10 +11,6 @@ import AddressPOC from "@/layouts/address-poc/address-poc.vue";
 
 const FUNNEL_START_PAGE = 'vehicle-year';
 const routes = [
-  {
-    path: "/:pathMatch(.*)*",
-    name: "NotFound",
-  },
   {
     path: "/component-test", // This is a temporary route for testing.
     name: "ComponentTest",
@@ -30,7 +23,7 @@ const routes = [
   },
   {
     path: "/",
-    beforeEnter(to, from, next) {
+    async beforeEnter(to, from, next) {
       // If we have no query string, or we don't have the FmgPage query string.
       if (to.query.fmgPage === undefined) {
         GoToFunnelStartOn404(next);
@@ -38,28 +31,21 @@ const routes = [
 
         // If we already have our route, go to it.
         if (router.hasRoute(to.query.fmgPage)) {
-          return next({name: to.query.fmgPage,query: to.query});
+          return next({ name: to.query.fmgPage, query: to.query });
         }
 
         // Get route info for the given url. Names will have a 1:1 relationship with names in the Cms.
-        GetRouteInfoFromPageName(to.query.fmgPage)
+        const routeData = await GetRouteInfoFromPageName(to.query.fmgPage);
-          .then((routeData) => {
-            // Add our dynamic route.
-            router.addRoute({
-              path: routeData[0].path, // Always the same path, because we control it with query strings.
-              name: routeData[0].name,
-              component: routeData[0].component,
-            });
 
-            // Assign current query string parameters, as well as our fmgPage one.
+        // Add our dynamic route.
-            next({name: routeData[0].name, query: Object.assign(to.query, { fmgPage: routeData[0].name })});
+        router.addRoute({
-          })
+          path: routeData[0].path, // Always the same path, because we control it with query strings.
-          .catch((error) => {
+          name: routeData[0].name,
-            // If we can't find the route, go to the last known page.
+          component: routeData[0].component,
-            GoToFunnelStartOn404(next);
+        });
 
-            console.log("Cannot find route, navigating to last page:", error);
+        // Assign current query string parameters, as well as our fmgPage one.
-          });
+        next({ name: routeData[0].name, query: Object.assign(to.query, { fmgPage: routeData[0].name }) });
       }
     },
   },
@@ -101,7 +87,7 @@ router.navigate = (
   }
 };
 
-// Get navigation map depeding on the scenario and the current 'page' you're on.
+// Get navigation map depending on the scenario and the current 'page' you're on.
 router.getNavigationMap = (scenario, currentRoute) => {
   const fmgPageValue = currentRoute.query.fmgPage;
   const matchedQueryValue = routingTable
@@ -125,29 +111,22 @@ function navigateToUrl(url) {
 
 // Get route information by page name.
 // This will reach out to the Cms and there is a 1:1 relationship between page names and route names.
-function GetRouteInfoFromPageName(pageName) {
+async function GetRouteInfoFromPageName(pageName) {
-  return new Promise((resolve, reject) => {
+  const response = await store.dispatch(storeActions.GET_ROUTE_INFO_ACTION, { pageName: pageName });
-    store
-      .dispatch(storeActions.GET_ROUTE_INFO_ACTION, { pageName: pageName })
-      .then((response) => {
-        // Add our route data and return our array.
-        let jsonFromResponse = JSON.parse(response.data.Result);
-        let routeData = [];
 
-        Object.keys(jsonFromResponse).forEach((key) => {
+  // Add our route data and return our array.
-          routeData.push({
+  const jsonFromResponse = JSON.parse(response.data.Result);
-            path: "/",
+  let routeData = [];
-            name: `${key}`,
-            component: lazyLoadComponent(jsonFromResponse[key].LayoutName),
-          });
-        });
 
-        resolve(routeData);
+  Object.keys(jsonFromResponse).forEach((key) => {
-      })
+    routeData.push({
-      .catch((error) => {
+      path: "/",
-        reject(error);
+      name: `${key}`,
-      });
+      component: lazyLoadComponent(jsonFromResponse[key].LayoutName),
+    });
   });
+
+  return routeData;
 }
 
 // Go to our start page on a 404.