Readability and generate answers refactor

This commit is contained in:
Scott Kiener 2025-07-16 15:58:50 -04:00
parent 33c2401392
commit fa0d988335

View file

@ -109,7 +109,7 @@ export default {
localZipCode: this.zipCodeFromParent,
answers: [],
shopListButton: shopListButton,
indexOfLastShopToBeDisplayed: 0,
numberOfShopsToDisplay: 0,
localShopProviderData: this.shopProviderDataFromParent, // Why does parent manage this sometimes, but not all of the time A: to prevent another call to get providers on initial load
localSelectedProviderNumber: null, // Revisit this, maybe not too hard
displayInvalidZipAlert: false, // part of big refactor of asyn calls
@ -156,7 +156,7 @@ export default {
displaySeeMoreLocationsLink() {
if (!this.shopProviders.length)
return false;
return this.indexOfLastShopToBeDisplayed < this.shopProviders.length;
return this.numberOfShopsToDisplay < this.shopProviders.length;
},
},
@ -175,9 +175,9 @@ export default {
);
if (selectedProviderNumberFromParentIndex > -1) {
this.indexOfLastShopToBeDisplayed = Math.ceil((selectedProviderNumberFromParentIndex + 1) / 3) * 3;
this.numberOfShopsToDisplay = Math.ceil((selectedProviderNumberFromParentIndex + 1) / 3) * 3;
} else {
this.indexOfLastShopToBeDisplayed = 3;
this.numberOfShopsToDisplay = 3;
}
this.updateShopsForZip(this.localZipCode);
@ -187,33 +187,28 @@ export default {
updateSelectedAnswer() {
this.localSelectedProviderNumber = this.selectedProviderNumberFromParent;
},
toTitleCase(str) {
return str.replace(/\w\S*/g, function (txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
},
isModalFooterButtonDisabled() {
return this.displayInvalidZipAlert || this.displayNoShopsAlert || !this.localSelectedProviderNumber;
},
updateShopListWithNextShops(numberToGet = 3) {
//gaAction = this.GaActions.SHOPS_FIRST_DISPLAYED; --This needs to actually fire on initial display, can never happen here
const nextShopListAnswers = this.getNextShopAnswersFromList();
this.pushShopsDisplayedGAEvent(nextShopListAnswers);
nextShopListAnswers.forEach((shop) => {
this.answers.push(shop);
});
this.updateShopAnswersFromProviderList({extraShopsToDisplay:3});
this.pushShopsDisplayedGAEvent(this.answers);
},
getNextShopAnswersFromList(numberOfShopsToGet = 3) {
const toTitleCase = (str) => {
return str.replace(/\w\S*/g, function (txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
};
updateShopAnswersFromProviderList({extraShopsToDisplay}) {
const indexOfLastShopToReturn = this.numberOfShopsToDisplay + extraShopsToDisplay;
const updatedProvidersToDisplay = this.shopProviders.slice(0, indexOfLastShopToReturn);
this.numberOfShopsToDisplay = updatedProvidersToDisplay.length;
const indexOfLastShopToReturn = this.indexOfLastShopToBeDisplayed + numberOfShopsToGet;
const nextShopProvidersFromList = this.shopProviders.slice(this.indexOfLastShopToBeDisplayed, indexOfLastShopToReturn);
this.indexOfLastShopToBeDisplayed = indexOfLastShopToReturn < this.shopProviders.length ? indexOfLastShopToReturn : this.shopProviders.length;
const nextShopAnswersFromList = nextShopProvidersFromList.map((shopProvider) => {
const streetAddress = toTitleCase(shopProvider.address.streetAddress);
const city = toTitleCase(shopProvider.address.city);
const shopAnswersToDisplayFromProviderList = updatedProvidersToDisplay.map((shopProvider) => {
const streetAddress = this.toTitleCase(shopProvider.address.streetAddress);
const city = this.toTitleCase(shopProvider.address.city);
const state = shopProvider.address.state;
const zipCode = shopProvider.address.zipCode;
const distanceInMiles = Math.round(shopProvider.distanceInMiles * 2) / 2;
@ -227,7 +222,7 @@ export default {
};
});
return nextShopAnswersFromList;
this.answers = shopAnswersToDisplayFromProviderList;
},
pushShopsDisplayedGAEvent(nextShopListAnswers) {
var shops = nextShopListAnswers.map((shop) => {
@ -280,7 +275,7 @@ export default {
getShopProviderData(this.localZipCode).then(async (result) => {
this.displayNoShopsAlert = false;
this.localShopProviderData = result.data;
this.indexOfLastShopToBeDisplayed = 3;
this.numberOfShopsToDisplay = 3;
this.updateShopsForZip(this.localZipCode);
});
}
@ -298,35 +293,11 @@ export default {
return;
}
const sortedShops = this.getShopsByZip(zipCode, this.shopProviders, this.indexOfLastShopToBeDisplayed);
const toTitleCase = (str) => {
return str.replace(/\w\S*/g, function (txt) {
return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
});
};
const mappedData = sortedShops.map((shopProvider) => {
const streetAddress = toTitleCase(shopProvider.address.streetAddress);
const city = toTitleCase(shopProvider.address.city);
const state = shopProvider.address.state;
const zipCode = shopProvider.address.zipCode;
const distanceInMiles = Math.round(shopProvider.distanceInMiles * 2) / 2;
return {
buttonLabel: city,
buttonLabelSubCopy: `${distanceInMiles} mi`,
buttonBodyCopy: `${streetAddress}, ${city}, ${state} ${zipCode}`,
additionalButtonData: this.additionalButtonData,
value: shopProvider.providerNumber,
};
});
this.answers = mappedData;
this.updateShopAnswersFromProviderList({extraShopsToDisplay:0})
if (!this.answers.some((a) => String(a.value) === String(this.localSelectedProviderNumber))) {
this.localSelectedProviderNumber = null;
}
// I think we should call our new pushGA Event here with new mapped data
this.indexOfLastShopToBeDisplayed = mappedData.length;
this.displayNoShopsAlert = this.answers.length === 0;
},
resetModalButtonStyle() {