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(
(e) => e.universeName === experimentUniverses.CONCEPT_FUNNEL
);
const yearQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction(
const yearQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_YEARS,
{}
{},
"vehicle"
);
var makeQuestionInitialDataPromise = null;
var modelQuestionInitialDataPromise = null;
@ -140,35 +141,38 @@ export default {
store.getters.order.vehicle.model &&
store.getters.order.vehicle.style
) {
makeQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction(
makeQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_MAKES,
{
year: store.getters.order.vehicle.year,
}
},
"vehicle"
);
modelQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction(
modelQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_MODELS,
{
year: store.getters.order.vehicle.year,
make: store.getters.order.vehicle.make,
}
},
"vehicle"
);
styleQuestionInitialDataPromise = baseMixin.methods.dispatchStoreAction(
styleQuestionInitialDataPromise = baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_STYLES,
{
year: store.getters.order.vehicle.year,
make: store.getters.order.vehicle.make,
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 (experimentForLogging !== undefined) {
// Log experiment exposure
baseMixin.methods.dispatchStoreAction(
baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.LOG_EXPERIMENT_EXPOSURE,
{
userId: getDeviceIdValue(),
@ -176,6 +180,7 @@ export default {
pageName: to.query.fmgPage,
experiment: experimentForLogging,
},
"vehicle",
false
);
}
@ -304,12 +309,16 @@ export default {
},
methods: {
getVehicle(year, make, model, style) {
return this.dispatchStoreAction(this.storeActions.GET_VEHICLE, {
year: year,
make: make,
model: model,
style: style,
});
return this.dispatchStoreActionWithLogging(
this.storeActions.GET_VEHICLE,
{
year: year,
make: make,
model: model,
style: style,
},
"vehicle"
);
},
arePagePrerequisitesValid() {
return true;
@ -354,24 +363,36 @@ export default {
return store.getters.vehicle.style;
},
async getMakeOptions(year) {
return await baseMixin.methods.dispatchStoreAction(storeActions.GET_VEHICLE_MAKES, {
year: year,
});
return await baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_MAKES,
{
year: year,
},
"vehicle"
);
},
async getModelOptions(year, make) {
return await baseMixin.methods.dispatchStoreAction(storeActions.GET_VEHICLE_MODELS, {
year: year,
make: make,
});
return await baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_MODELS,
{
year: year,
make: make,
},
"vehicle"
);
},
async getStyleOptions(year, make, model) {
return await baseMixin.methods.dispatchStoreAction(storeActions.GET_VEHICLE_STYLES, {
year: year,
make: make,
model: model,
});
return await baseMixin.methods.dispatchStoreActionWithLogging(
storeActions.GET_VEHICLE_STYLES,
{
year: year,
make: make,
model: model,
},
"vehicle"
);
},
getImagefromStore() {
return store.getters.vehicle.imageUrl;

View file

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

View file

@ -370,7 +370,7 @@ describe("Actions", () => {
});
// Assert
const response = await actions.getVehicleYears(context);
const response = await actions.getVehicleYears(context, { pageNameToLog: "test" });
expect(response.data).toEqual([2023, 2022, 2021]);
});
@ -385,13 +385,15 @@ describe("Actions", () => {
});
// Assert
const response = await actions.lookupVehicleByYmms(
context,
"2019",
"Acura",
"ILX",
"4 DOOR SEDAN"
);
const response = await actions.lookupVehicleByYmms(context, {
payload: {
year: "2019",
make: "Acura",
model: "ILX",
style: "4 DOOR SEDAN",
},
pageNameToLog: "test",
});
expect(response.data).toEqual({ carId: "C00000001" });
});
@ -406,7 +408,12 @@ describe("Actions", () => {
});
// 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" });
});
@ -471,7 +478,10 @@ describe("Actions", () => {
});
// 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"]);
});
@ -486,7 +496,10 @@ describe("Actions", () => {
});
// 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"]);
});
@ -501,7 +514,10 @@ describe("Actions", () => {
});
// 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" });
});
@ -516,7 +532,10 @@ describe("Actions", () => {
});
// 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" });
});