adding reloadingProviders flag toggle to getProviderButtonData

This commit is contained in:
Michaela Brydon 2023-11-30 14:11:19 -05:00
parent db8a342986
commit e52046f7ab
3 changed files with 19 additions and 21 deletions

View file

@ -9,7 +9,7 @@ Object {
"filter": "",
"mapZipCode": "12663",
"providers": Array [],
"reloadProviders": false,
"reloadingProviders": false,
"rules": Object {
"filter": "option-required",
"provider": "option-required",

View file

@ -189,10 +189,10 @@ describe('TPA search page', () => {
expect(searchRadiusFilter.props().cmsWidgetName).toBe(expectedWidgetName);
expect(searchRadiusFilter.props().validationRules).toBe(globalRules.OPTION_REQUIRED);
});
test('providers loader when reloadProviders is true', async () => {
test('providers loader when reloadingProviders is true', async () => {
// Arrange
const wrapper = shallowMount(tpaSearch, getMountOptions());
await wrapper.setData({ reloadProviders: true });
await wrapper.setData({ reloadingProviders: true });
// Act
const providersLoader = wrapper.findComponent('#providersLoader');
@ -200,7 +200,7 @@ describe('TPA search page', () => {
// Assert
expect(providersLoader.exists()).toBeTruthy();
});
test('select provider question when reloadProviders are false', async () => {
test('select provider question when reloadingProviders are false', async () => {
// Arrange
const wrapper = shallowMount(tpaSearch, getMountOptions());
await wrapper.setData({
@ -216,7 +216,7 @@ describe('TPA search page', () => {
zipCode: '99230'
}
}],
reloadProviders: false
reloadingProviders: false
});
const expectedAnswers = [{
buttonLabel: 'Shop Auto Glass',
@ -243,14 +243,14 @@ describe('TPA search page', () => {
expect(selectProviderQuestion.props().additionalButtonData).toEqual(expectedAdditionalButtonData);
});
test.each([[], null, undefined])(
'no network providers alert when providers length is 0, undefined, or null and reloadProviders is false',
'no network providers alert when providers length is 0, undefined, or null and reloadingProviders is false',
async (providers) => {
// Arrange
const initialData = {
providers
};
const wrapper = shallowMount(tpaSearch, getMountOptions({}, initialData));
await wrapper.setData({ reloadProviders: false });
await wrapper.setData({ reloadingProviders: false });
// Act
const noNetworkProvidersAlert = wrapper.findComponent('#alertNoNetworkProviders');
@ -262,10 +262,10 @@ describe('TPA search page', () => {
expect(noNetworkProvidersAlert.props().isDismissible).toBeFalsy();
}
);
test('preferred shop not listed link when reloadProviders is false', async () => {
test('preferred shop not listed link when reloadingProviders is false', async () => {
// Arrange
const wrapper = shallowMount(tpaSearch, getMountOptions());
await wrapper.setData({ reloadProviders: false });
await wrapper.setData({ reloadingProviders: false });
// Act
const preferredShopNotListedLink = wrapper.findComponent('#preferredShopNotListedLink');
@ -288,10 +288,10 @@ describe('TPA search page', () => {
});
});
describe('should not render', () => {
test('select provider question when reloadProviders is true', async () => {
test('select provider question when reloadingProviders is true', async () => {
// Arrange
const { wrapper } = getMountedComponent();
await wrapper.setData({ reloadProviders: true });
await wrapper.setData({ reloadingProviders: true });
// Act
const selectProviderQuestion = wrapper.findComponent('#selectProviderQuestion');
@ -311,10 +311,10 @@ describe('TPA search page', () => {
// Assert
expect(noNetworkProvidersAlert.exists()).toBeFalsy();
});
test('when reloadProviders is true', async () => {
test('when reloadingProviders is true', async () => {
// Arrange
const wrapper = shallowMount(tpaSearch, getMountOptions());
await wrapper.setData({ providers: [], reloadProviders: true });
await wrapper.setData({ providers: [], reloadingProviders: true });
// Act
const noNetworkProvidersAlert = wrapper.findComponent('#alertNoNetworkProviders');
@ -323,10 +323,10 @@ describe('TPA search page', () => {
expect(noNetworkProvidersAlert.exists()).toBeFalsy();
});
});
test('preferred shop not listed link when reloadProviders is true', async () => {
test('preferred shop not listed link when reloadingProviders is true', async () => {
// Arrange
const { wrapper } = getMountedComponent();
await wrapper.setData({ reloadProviders: true });
await wrapper.setData({ reloadingProviders: true });
// Act
const preferredShopNotListedLink = wrapper.findComponent('#preferredShopNotListedLink');

View file

@ -59,7 +59,7 @@
disableAutoFill
:validationRules="rules.filter" />
<loader
v-if="reloadProviders"
v-if="reloadingProviders"
id="providersLoader"
loaderPosition="center"
loaderColor="blue"
@ -195,7 +195,7 @@ export default {
filter: '',
providers: [],
selectedProviderNumber: '',
reloadProviders: false,
reloadingProviders: false,
additionalButtonData: {
displayAvailabilityIndicators: false
},
@ -269,12 +269,10 @@ export default {
watch: {
async filter() {
if (this.dataLoaded) {
this.reloadProviders = true;
await this.getProviderButtonData().then((providers) => {
this.providers = providers;
});
this.mapZipCode = this.zipCode;
this.reloadProviders = false;
}
},
providers(newProviders) {
@ -319,7 +317,9 @@ export default {
return [addressLine1, addressLine2].join(joinString);
},
async getProviderButtonData() {
this.reloadingProviders = true;
const getTpaProvidersResult = await useMainStore().getTpaProviders(this.zipCode, this.radiusInMiles);
this.reloadingProviders = false;
return getTpaProvidersResult?.data?.shopProviders ?? [];
},
doNotSeeMyShopLinkClick() {
@ -329,10 +329,8 @@ export default {
);
},
async searchClick() {
this.reloadProviders = true;
this.providers = await this.getProviderButtonData();
this.mapZipCode = this.zipCode;
this.reloadProviders = false;
},
backButtonAction() {
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);