Update vehicle page

This commit is contained in:
Chloe Herd 2023-09-18 14:16:22 -04:00
parent e7c0703eb4
commit 786f785e79
3 changed files with 106 additions and 47 deletions

View file

@ -127,9 +127,10 @@ export default {
const experimentForLogging = store.getters.applicationUser.experiments.find( const experimentForLogging = store.getters.applicationUser.experiments.find(
(e) => e.universeName === experimentUniverses.CONCEPT_FUNNEL (e) => e.universeName === experimentUniverses.CONCEPT_FUNNEL
); );
const yearQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction( const yearQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_YEARS, storeActions.GET_VEHICLE_YEARS,
{} {},
"vehicle"
); );
var makeQuestionInitialDataPromise = null; var makeQuestionInitialDataPromise = null;
var modelQuestionInitialDataPromise = null; var modelQuestionInitialDataPromise = null;
@ -140,35 +141,38 @@ export default {
store.getters.order.vehicle.model && store.getters.order.vehicle.model &&
store.getters.order.vehicle.style store.getters.order.vehicle.style
) { ) {
makeQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction( makeQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_MAKES, storeActions.GET_VEHICLE_MAKES,
{ {
year: store.getters.order.vehicle.year, year: store.getters.order.vehicle.year,
} },
"vehicle"
); );
modelQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction( modelQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_MODELS, storeActions.GET_VEHICLE_MODELS,
{ {
year: store.getters.order.vehicle.year, year: store.getters.order.vehicle.year,
make: store.getters.order.vehicle.make, make: store.getters.order.vehicle.make,
} },
"vehicle"
); );
styleQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction( styleQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_STYLES, storeActions.GET_VEHICLE_STYLES,
{ {
year: store.getters.order.vehicle.year, year: store.getters.order.vehicle.year,
make: store.getters.order.vehicle.make, make: store.getters.order.vehicle.make,
model: store.getters.order.vehicle.model, model: store.getters.order.vehicle.model,
} },
"vehicle"
); );
} }
// If the concept funnel experiment is found, as it should be when coming from safelite.com, then log the experiment exposure. // If the concept funnel experiment is found, as it should be when coming from safelite.com, then log the experiment exposure.
if (experimentForLogging !== undefined) { if (experimentForLogging !== undefined) {
// Log experiment exposure // Log experiment exposure
baseMixin.methods.dispatchStoreAction( baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.LOG_EXPERIMENT_EXPOSURE, storeActions.LOG_EXPERIMENT_EXPOSURE,
{ {
userId: getDeviceIdValue(), userId: getDeviceIdValue(),
@ -176,6 +180,7 @@ export default {
pageName: to.query.fmgPage, pageName: to.query.fmgPage,
experiment: experimentForLogging, experiment: experimentForLogging,
}, },
"vehicle",
false false
); );
} }
@ -304,12 +309,16 @@ export default {
}, },
methods: { methods: {
getVehicle(year, make, model, style) { getVehicle(year, make, model, style) {
return this.dispatchStoreAction(this.storeActions.GET_VEHICLE, { return this.dispatchStoreActionWithLogging(
year: year, this.storeActions.GET_VEHICLE,
make: make, {
model: model, year: year,
style: style, make: make,
}); model: model,
style: style,
},
"vehicle"
);
}, },
arePagePrerequisitesValid() { arePagePrerequisitesValid() {
return true; return true;
@ -354,24 +363,36 @@ export default {
return store.getters.vehicle.style; return store.getters.vehicle.style;
}, },
async getMakeOptions(year) { async getMakeOptions(year) {
return await baseMixin.methods.dispatchStoreAction(storeActions.GET_VEHICLE_MAKES, { return await baseMixin.methods.dispatchStoreActionWithLogging(
year: year, storeActions.GET_VEHICLE_MAKES,
}); {
year: year,
},
"vehicle"
);
}, },
async getModelOptions(year, make) { async getModelOptions(year, make) {
return await baseMixin.methods.dispatchStoreAction(storeActions.GET_VEHICLE_MODELS, { return await baseMixin.methods.dispatchStoreActionWithLogging(
year: year, storeActions.GET_VEHICLE_MODELS,
make: make, {
}); year: year,
make: make,
},
"vehicle"
);
}, },
async getStyleOptions(year, make, model) { async getStyleOptions(year, make, model) {
return await baseMixin.methods.dispatchStoreAction(storeActions.GET_VEHICLE_STYLES, { return await baseMixin.methods.dispatchStoreActionWithLogging(
year: year, storeActions.GET_VEHICLE_STYLES,
make: make, {
model: model, year: year,
}); make: make,
model: model,
},
"vehicle"
);
}, },
getImagefromStore() { getImagefromStore() {
return store.getters.vehicle.imageUrl; return store.getters.vehicle.imageUrl;

View file

@ -641,19 +641,23 @@ function provisionalTriggersToString(provisionalTriggers) {
// Export Actions // Export Actions
export const actions = { export const actions = {
// Vehicle API Actions // Vehicle API Actions
getVehicleYears(context) { getVehicleYears(context, { pageNameToLog }) {
return globalMethods.callHttpClient({ return globalMethods.callHttpClient({
method: endpoints.GetVehicleYears.method, method: endpoints.GetVehicleYears.method,
endpoint: endpoints.GetVehicleYears.url, endpoint: endpoints.GetVehicleYears.url,
payload: {}, payload: {},
logApiCall: true,
pageNameToLog: pageNameToLog,
}); });
}, },
lookupVehicleByYmms(context, { year, make, model, style }) { lookupVehicleByYmms(context, { payload: { year, make, model, style }, pageNameToLog }) {
return globalMethods.callHttpClient({ return globalMethods.callHttpClient({
method: endpoints.LookupVehicleByYmms.method, method: endpoints.LookupVehicleByYmms.method,
endpoint: `${endpoints.LookupVehicleByYmms.url}/${year}/${make}/${model}/${style}`, endpoint: `${endpoints.LookupVehicleByYmms.url}/${year}/${make}/${model}/${style}`,
payload: {}, payload: {},
logApiCall: true,
pageNameToLog: pageNameToLog,
}); });
}, },
@ -728,36 +732,44 @@ export const actions = {
}); });
}, },
getVehicleMakes(context, { year }) { getVehicleMakes(context, { payload: { year }, pageNameToLog }) {
return globalMethods.callHttpClient({ return globalMethods.callHttpClient({
method: endpoints.GetVehicleMakes.method, method: endpoints.GetVehicleMakes.method,
endpoint: `${endpoints.GetVehicleMakes.url}/${year}`, endpoint: `${endpoints.GetVehicleMakes.url}/${year}`,
payload: {}, payload: {},
logApiCall: true,
pageNameToLog: pageNameToLog,
}); });
}, },
getVehicleModels(context, { year, make }) { getVehicleModels(context, { payload: { year, make }, pageNameToLog }) {
return globalMethods.callHttpClient({ return globalMethods.callHttpClient({
method: endpoints.GetVehicleModels.method, method: endpoints.GetVehicleModels.method,
endpoint: `${endpoints.GetVehicleModels.url}/${year}/${make}`, endpoint: `${endpoints.GetVehicleModels.url}/${year}/${make}`,
payload: {}, payload: {},
logApiCall: true,
pageNameToLog: pageNameToLog,
}); });
}, },
getVehicleStyles(context, { year, make, model }) { getVehicleStyles(context, { payload: { year, make, model }, pageNameToLog }) {
return globalMethods.callHttpClient({ return globalMethods.callHttpClient({
method: endpoints.GetVehicleStyles.method, method: endpoints.GetVehicleStyles.method,
endpoint: `${endpoints.GetVehicleStyles.url}/${year}/${make}/${model}`, endpoint: `${endpoints.GetVehicleStyles.url}/${year}/${make}/${model}`,
payload: {}, payload: {},
logApiCall: true,
pageNameToLog: pageNameToLog,
}); });
}, },
getVehicle(context, { year, make, model, style }) { getVehicle(context, { payload: { year, make, model, style }, pageNameToLog }) {
return globalMethods return globalMethods
.callHttpClient({ .callHttpClient({
methods: endpoints.GetVehicle.method, methods: endpoints.GetVehicle.method,
endpoint: `${endpoints.GetVehicle.url}/${year}/${make}/${model}/${style}`, endpoint: `${endpoints.GetVehicle.url}/${year}/${make}/${model}/${style}`,
payload: {}, payload: {},
logApiCall: true,
pageNameToLog: pageNameToLog,
}) })
.then((response) => { .then((response) => {
return response; return response;
@ -844,11 +856,16 @@ export const actions = {
pageName pageName
), ),
payload: {}, payload: {},
logApiCall: true,
pageNameToLog: pageName,
}); });
}, },
// Analytics Actions // Analytics Actions
logExperimentExposure(context, { userId, sessionKey, pageName, experiment }) { logExperimentExposure(
context,
{ payload: { userId, sessionKey, pageName, experiment }, pageNameToLog }
) {
return globalMethods.callHttpClient({ return globalMethods.callHttpClient({
method: endpoints.LogExperimentExposureIfAssigned.method, method: endpoints.LogExperimentExposureIfAssigned.method,
endpoint: endpoints.LogExperimentExposureIfAssigned.url, endpoint: endpoints.LogExperimentExposureIfAssigned.url,
@ -869,6 +886,8 @@ export const actions = {
pageName: pageName, pageName: pageName,
}, },
}, },
logApiCall: true,
pageNameToLog: pageNameToLog,
}); });
}, },

View file

@ -370,7 +370,7 @@ describe("Actions", () => {
}); });
// Assert // Assert
const response = await actions.getVehicleYears(context); const response = await actions.getVehicleYears(context, { pageNameToLog: "test" });
expect(response.data).toEqual([2023, 2022, 2021]); expect(response.data).toEqual([2023, 2022, 2021]);
}); });
@ -385,13 +385,15 @@ describe("Actions", () => {
}); });
// Assert // Assert
const response = await actions.lookupVehicleByYmms( const response = await actions.lookupVehicleByYmms(context, {
context, payload: {
"2019", year: "2019",
"Acura", make: "Acura",
"ILX", model: "ILX",
"4 DOOR SEDAN" style: "4 DOOR SEDAN",
); },
pageNameToLog: "test",
});
expect(response.data).toEqual({ carId: "C00000001" }); expect(response.data).toEqual({ carId: "C00000001" });
}); });
@ -406,7 +408,12 @@ describe("Actions", () => {
}); });
// Assert // Assert
const response = await actions.lookupVehicleByVin(context, "12345678901234567"); const response = await actions.lookupVehicleByVin(context, {
payload: {
vin: "12345678901234567",
},
pageNameToLog: "test",
});
expect(response.data).toEqual({ carId: "C0000001" }); expect(response.data).toEqual({ carId: "C0000001" });
}); });
@ -471,7 +478,10 @@ describe("Actions", () => {
}); });
// Assert // Assert
const response = await actions.getVehicleMakes(context, "2019"); const response = await actions.getVehicleMakes(context, {
payload: { year: "2019" },
pageNameToLog: "test",
});
expect(response.data).toEqual(["Acura", "Honda"]); expect(response.data).toEqual(["Acura", "Honda"]);
}); });
@ -486,7 +496,10 @@ describe("Actions", () => {
}); });
// Assert // Assert
const response = await actions.getVehicleModels(context, "2019", "Acura"); const response = await actions.getVehicleModels(context, {
payload: { year: "2019", make: "Acura" },
pageNameToLog: "test",
});
expect(response.data).toEqual(["ILX", "RDX"]); expect(response.data).toEqual(["ILX", "RDX"]);
}); });
@ -501,7 +514,10 @@ describe("Actions", () => {
}); });
// Assert // Assert
const response = await actions.getVehicleStyles(context, "2019", "Acura", "ILX"); const response = await actions.getVehicleStyles(context, {
payload: { year: "2019", make: "Acura", model: "ILX" },
pageNameToLog: "test",
});
expect(response.data).toEqual({ style: "4 DOOR SEDAN" }); expect(response.data).toEqual({ style: "4 DOOR SEDAN" });
}); });
@ -516,7 +532,10 @@ describe("Actions", () => {
}); });
// Assert // Assert
const response = await actions.getVehicle(context, "C00000000"); const response = await actions.getVehicle(context, {
payload: { year: "2019", make: "Acura", model: "IDX", style: "4-door sedan" },
pageNameToLog: "test",
});
expect(response.data).toEqual({ carId: "C00000000", category: "CAR" }); expect(response.data).toEqual({ carId: "C00000000", category: "CAR" });
}); });