diff --git a/src/layouts/tpa-search/tpa-search.spec.js b/src/layouts/tpa-search/tpa-search.spec.js index d8185733..ccc056ec 100644 --- a/src/layouts/tpa-search/tpa-search.spec.js +++ b/src/layouts/tpa-search/tpa-search.spec.js @@ -1238,8 +1238,55 @@ describe('TPA search page', () => { }); }); }); + test.each([ + [undefined, ''], + [null, ''], + ['', ''], + ['hello world', 'Hello World'], + ['hello world', 'Hello World'], + ['HEllO worLD', 'Hello World'], + ['a991,,:A froG FAMILY', 'A991,,:a Frog Family'] + ])( + 'toTitleCase given "%p" returns "%p"', + (input, expected) => { + // Arrange + const { wrapper } = getMountedComponent(); + + // Act + const result = wrapper.vm.toTitleCase(input); + + // Assert + expect(result).toEqual(expected); + } + ); }); describe('before route enter', () => { + test('when providers exist at 15 mile radius, filter is set to "15 miles" and providers set to expected', async () => { + // Arrange + const { wrapper } = getMountedComponent(); + const zipCode = '18394'; + useMainStore().order.customer.address.zipCode = zipCode; + const providers = [{ companyName: 'provider' }]; + useMainStore().getTpaProviders = jest.fn().mockImplementation((_, radius) => + ({ data: { shopProviders: radius === 15 ? providers : [] } })); + const expectedFilter = '15 miles'; + + // Act + await tpaSearch.beforeRouteEnter.call( + wrapper.vm, + { query: { issPage: 'tpa-search' } }, + undefined, + (c) => c(wrapper.vm) + ); + + await wrapper.vm.$nextTick(); + await wrapper.vm.$nextTick(); + + // Assert + expect(wrapper.vm.filter).toBe(expectedFilter); + expect(wrapper.vm.providers).toEqual(providers); + expect(useMainStore().getTpaProviders).toBeCalledTimes(1); + }); test('when providers exist at 25 mile radius, filter is set to "25 miles" and providers set to expected', async () => { // Arrange const { wrapper } = getMountedComponent(); @@ -1264,7 +1311,7 @@ describe('TPA search page', () => { // Assert expect(wrapper.vm.filter).toBe(expectedFilter); expect(wrapper.vm.providers).toEqual(providers); - expect(useMainStore().getTpaProviders).toBeCalledTimes(1); + expect(useMainStore().getTpaProviders).toBeCalledTimes(2); }); test('when providers exist at 50 mile radius but not 25, filter is set to "50 miles" and providers set to expected', async () => { // Arrange @@ -1290,7 +1337,7 @@ describe('TPA search page', () => { // Assert expect(wrapper.vm.filter).toBe(expectedFilter); expect(wrapper.vm.providers).toEqual(providers); - expect(useMainStore().getTpaProviders).toBeCalledTimes(2); + expect(useMainStore().getTpaProviders).toBeCalledTimes(3); }); test( 'when providers exist at 100 mile radius but not 50 or 25, filter is set to "100 miles" and providers set to expected', @@ -1318,7 +1365,7 @@ describe('TPA search page', () => { // Assert expect(wrapper.vm.filter).toBe(expectedFilter); expect(wrapper.vm.providers).toEqual(providers); - expect(useMainStore().getTpaProviders).toBeCalledTimes(3); + expect(useMainStore().getTpaProviders).toBeCalledTimes(4); } ); test( @@ -1345,7 +1392,7 @@ describe('TPA search page', () => { // Assert expect(wrapper.vm.filter).toBe(expectedFilter); expect(wrapper.vm.providers).toEqual([]); - expect(useMainStore().getTpaProviders).toBeCalledTimes(3); + expect(useMainStore().getTpaProviders).toBeCalledTimes(4); } ); }); diff --git a/src/layouts/tpa-search/tpa-search.vue b/src/layouts/tpa-search/tpa-search.vue index a2ec4231..5b7d84fc 100644 --- a/src/layouts/tpa-search/tpa-search.vue +++ b/src/layouts/tpa-search/tpa-search.vue @@ -140,14 +140,21 @@ import globalRules from '@/constants/global-rules.js'; import widgetFields from '@/constants/cms-widget-fields.js'; import { shallowRef } from 'vue'; +const radiusFilterPairs = [ + { radius: 15, filter: '15 miles' }, + { radius: 25, filter: '25 miles' }, + { radius: 50, filter: '50 miles' }, + { radius: 100, filter: '100 miles' } +]; + async function getInitialFilterAndProviders() { const { zipCode } = useMainStore().order.customer.address; let pairIndex = 0; let providers = []; let filter = ''; - while (providers.length === 0 && pairIndex < this.radiusFilterPairs.length) { - const pair = this.radiusFilterPairs[pairIndex]; + while (providers.length === 0 && pairIndex < radiusFilterPairs.length) { + const pair = radiusFilterPairs[pairIndex]; const { radius } = pair; filter = pair.filter; // eslint-disable-next-line no-await-in-loop @@ -157,7 +164,7 @@ async function getInitialFilterAndProviders() { pairIndex += 1; } - return {filter, providers}; + return { filter, providers }; } export default { @@ -213,13 +220,7 @@ export default { filter: globalRules.OPTION_REQUIRED, // TODO do we even need this? provider: globalRules.OPTION_REQUIRED }, - shopListButton: shallowRef(shopListButton), - radiusFilterPairs: [ - { radius: 15, filter: '15 miles' }, - { radius: 25, filter: '25 miles' }, - { radius: 50, filter: '50 miles' }, - { radius: 100, filter: '100 miles' } - ] + shopListButton: shallowRef(shopListButton) }; }, computed: { @@ -253,7 +254,7 @@ export default { ); }, radiusInMiles() { - const pair = this.radiusFilterPairs.find((p) => p.filter === this.filter); + const pair = radiusFilterPairs.find((p) => p.filter === this.filter); return pair?.radius ?? 0; }, noNetworkShopsAlertHeaderText() { @@ -302,31 +303,27 @@ export default { this.providers = providers; }, getProviderAddress(provider) { - const city = provider?.address?.city ?? ''; + const city = this.toTitleCase(provider?.address?.city); const state = provider?.address?.state ?? ''; const zipCode = provider?.address?.zipCode ?? ''; let addressLine2 = ''; if (city) { - addressLine2 = city; + addressLine2 += city; if (state || zipCode) { - if (state) { - addressLine2 += ','; - } - addressLine2 += ' '; + addressLine2 += state ? ',' : ' '; } } if (state) { - addressLine2 += `${state}`; - if (zipCode) { - addressLine2 += ' '; - } + addressLine2 += state; + addressLine2 += zipCode ? ' ' : ''; } if (zipCode) { - addressLine2 += `${zipCode}`; + addressLine2 += zipCode; } - return provider?.address?.streetAddress - ? `${provider.address.streetAddress}, ${addressLine2}` - : addressLine2; + + const addressLine1 = this.toTitleCase(provider?.address?.streetAddress); + const joinString = addressLine1.length > 0 && addressLine2.length > 0 ? ', ' : ''; + return [addressLine1, addressLine2].join(joinString); }, async getProviderButtonData() { const getTpaProvidersResult = await useMainStore().getTpaProviders(this.zipCode, this.radiusInMiles); @@ -362,7 +359,7 @@ export default { } }, getShopButtonDataFromProvider(provider) { - const cellNumber = this.getDisplayPhoneNumber(provider?.phoneNumber ?? ''); + const cellNumber = this.getDisplayPhoneNumber(provider?.phoneNumber); const distance = provider?.distanceInMiles !== null && !Number.isNaN(parseFloat(provider?.distanceInMiles)) ? +provider.distanceInMiles.toFixed(1) : null; @@ -378,6 +375,7 @@ export default { }, getDisplayPhoneNumber(phoneNumber) { let result = ''; + if (!phoneNumber) { return result; } let remainingDigits = phoneNumber; if (phoneNumber.length === 11) { result += `${remainingDigits[0]}-`; @@ -387,10 +385,19 @@ export default { result += remainingDigits.replace(/^(\d{3})(\d{3})(\d{4})/, '$1-$2-$3'); } return result; - }// , - // toTitleCase(word) { - // const first = word[0]. - // } + }, + toTitleCase(text) { + if ((text?.length ?? 0) === 0) { + return ''; + } + const wordList = text.split(' '); + const titleCaseWordList = wordList.map((word) => { + const first = word[0].toUpperCase(); + const rest = word.substring(1).toLowerCase(); + return first + rest; + }); + return titleCaseWordList.join(' '); + } } };