Created call to getVehicle, refactored setting vehicle properties, updated tests and removed store-actions (it wasn't being used)

src/constants/endpoints.js

@@ -26,6 +26,10 @@ const endpoints = {
   GetVehicleStyles: {
     url: "/vehicle/api/v1/vehicle/styles",
     method: "GET",
+  },
+  GetVehicle: {
+    url: "/vehicle/api/v1/vehicle/lookup",
+    method: "GET",
   }
 };
   

src/constants/store-actions.js

@@ -1,9 +0,0 @@
-const storeActions = {
-    // Content Actions
-    GET_ROUTE_INFO_ACTION: "getRouteInfo",
-    GET_HOMEPAGE_NAME: "getHomepageName",
-    GET_PAGE_DATA: "getPageData",
-  };
-  
-  export { storeActions };
-  

src/helpers/unit-test-helper.js

@@ -1,4 +1,3 @@
-import { storeActions } from "@/constants/store-actions";
 import { navigationScenarios } from "@/router/router-constants/navigation-scenarios.js";
 import { vehicleCategories } from "@/constants/vehicle-categories.js";
 import { issPageValues } from "@/router/router-constants/issPage-values";
@@ -28,7 +27,6 @@ export function getMountOptions(mockData) {
 
 
   // Mock const files
-  mocks.storeActions = storeActions;
   mocks.navigationScenarios = navigationScenarios;
   mocks.vehicleCategories = vehicleCategories;
   mocks.issPageValues = issPageValues;

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

@@ -77,11 +77,13 @@ export default {
 
     watch: {
         selectedStyle(style) {
-            this.mainStore.updateVehicleStyle(style);
+            this.mainStore.updateVehicle({style})
-            this.$router.navigate(
+            this.mainStore.setVehicle(style).then(() => {
-                this.navigationScenarios.SELECTED_STYLE,
+                this.$router.navigate(
-                this.$route
+                    this.navigationScenarios.SELECTED_STYLE,
-            );
+                    this.$route
+                );
+            });
         },
     },
 

src/mixins/base-mixin.js

@@ -1,4 +1,3 @@
-import { storeActions } from "@/constants/store-actions.js";
 import { navigationScenarios } from "@/router/router-constants/navigation-scenarios";
 import { vehicleCategories } from "@/constants/vehicle-categories.js";
 import { queryStrings } from "@/constants/query-strings";
@@ -27,9 +26,6 @@ export default {
   computed: {
         // store will be accessible globally as its id + 'Store'
     ...mapStores(useMainStore),
-    storeActions() {
-      return storeActions;
-    },
     navigationScenarios() {
       return navigationScenarios;
     },

src/store/index.js

@@ -118,34 +118,24 @@ export const useMainStore = defineStore({
         });
       },
 
-      // Vehicle API Actions
+      setVehicle() {
-      updateVehicleYear(year) 
+        return globalMethods
-      {
+          .callHttpClient({
-        if (this.order.vehicle.year !== year) {
+              methods: endpoints.GetVehicle.method,
-          this.order.vehicle.year = year;
+              endpoint: `${endpoints.GetVehicle.url}/${this.order.vehicle.year}/${this.order.vehicle.make}/${this.order.vehicle.model}/${this.order.vehicle.style}`,
-        }
+              payload: {},
+          })
+          .then((response) => {
+            this.updateVehicle(response.data);
+            return response;
+          });
       },
 
-      updateVehicleMake(make) 
+      updateVehicle(vehicle)
       {
-        if (this.order.vehicle.make !== make) {
+        this.order.vehicle = { ...this.order.vehicle, ...vehicle };
-          this.order.vehicle.make = make;
-        }
-      },
-
-      updateVehicleModel(model) 
-      {
-        if (this.order.vehicle.model !== model) {
-          this.order.vehicle.model = model;
-        }
-      },
-
-      updateVehicleStyle(style) 
-      {
-        if (this.order.vehicle.style !== style) {
-          this.order.vehicle.style = style;
-        }
       },
+     
       addEventToBus (event) {
         this.applicationUser.eventBus.push(event);
       },

src/store/store.spec.js

@@ -1,6 +1,7 @@
 import { useMainStore } from "./"
 import { createApp } from 'vue';
 import { createPinia } from "pinia";
+import globalMethods from "@/global-methods";
 import App from '@/App.vue';
 
 
@@ -18,13 +19,6 @@ describe("Store", () => {
         jest.resetAllMocks();
     })
     
-        
-    it("Should Store Vehicle Year", () => {
-        let testYear = "2001";
-        store.updateVehicleYear(testYear);
-        expect(store.order.vehicle.year).toEqual(testYear);
-    });
-
     it("Should add events to the bus", () => {
         let event = {
             category: "TestCategory",
@@ -82,4 +76,59 @@ describe("Store", () => {
         expect(actual).toEqual(event.eventValue);
     });
 
+    it("UpdateVehicle should merge vehicle with response object", () => {
+        store.order.vehicle = {
+            year: 2020,
+            make: "Honda",
+            model: "Civic",
+            style: "4 door sedan",
+            carId: null,
+            category: null,
+            vin: null,
+            imageUrl: null,
+            imageVifNumber: null,
+            imageColor: null,
+        };
+
+        const response = {
+            "carId": "CR00069299",
+            "category": "CAR",
+            "year": 2020,
+            "make": "Honda",
+            "model": "Civic",
+            "style": "4 door sedan",
+            "imageUrl": "https://dbhdyzvm8lm25.cloudfront.net/color_0320_032/MY2020/13996/13996_cc0320_032_WX.jpg",
+            "imageVifNumber": "13996",
+            "imageVifColor": "white"
+        };
+
+        store.updateVehicle(response);
+
+        expect(store.order.vehicle.imageUrl).toEqual(response.imageUrl);
+        expect(store.order.vehicle.imageVifNumber).toEqual(response.imageVifNumber);
+        expect(store.order.vehicle.imageVifColor).toEqual(response.imageVifColor);
+    });
+
+    it("setVehicle should call globalMethods.callHttpClient", () => {
+        store.order.vehicle = jest.fn();
+
+        const response = {
+            "carId": "CR00069299",
+            "category": "CAR",
+            "year": 2020,
+            "make": "Honda",
+            "model": "Civic",
+            "style": "4 door sedan",
+            "imageUrl": "https://dbhdyzvm8lm25.cloudfront.net/color_0320_032/MY2020/13996/13996_cc0320_032_WX.jpg",
+            "imageVifNumber": "13996",
+            "imageVifColor": "white"
+        };
+
+        globalMethods.callHttpClient = jest.fn().mockReturnValue(Promise.resolve(response));
+        
+        store.setVehicle();
+
+        expect(globalMethods.callHttpClient).toHaveBeenCalled();
+    });
+
 });