From b0b31df8b0ea823737527c9df342bc42247e530d Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Wed, 21 Jan 2026 15:09:10 -0500 Subject: [PATCH 1/9] INSR-7772: tpa-submit parity updates - Rearrange/style tpa-submit page - Update supporting components to better match heritage - DeductibleBox - ReviewBlock - Alert - Update store logic to actually handle extension - Add/update recal modal and contact details modal - Update titleCase to treat dashes like spaces --- src/constants/progress-bar-mapper.js | 3 + src/helpers/text-helper.js | 7 +- .../contact-details-drawer.vue | 91 +++-- .../deductible-box/deductible-box.vue | 29 +- .../tpa-submit/review-block/review-block.vue | 66 ++-- src/layouts/tpa-submit/tpa-submit.vue | 316 ++++++++++-------- src/store/index.js | 5 + src/store/store.spec.js | 5 +- src/ux-components/alert/alert.vue | 3 +- 9 files changed, 299 insertions(+), 226 deletions(-) diff --git a/src/constants/progress-bar-mapper.js b/src/constants/progress-bar-mapper.js index b9f3af77..6d39bbaf 100644 --- a/src/constants/progress-bar-mapper.js +++ b/src/constants/progress-bar-mapper.js @@ -71,6 +71,9 @@ export const pageProgressMapper = { 'tpa-search': { percent: 85 }, + 'tpa-submit': { + percent: 95 + }, 'tpa-confirmation': { percent: 100 }, diff --git a/src/helpers/text-helper.js b/src/helpers/text-helper.js index 13e65e11..b35f4803 100644 --- a/src/helpers/text-helper.js +++ b/src/helpers/text-helper.js @@ -34,11 +34,8 @@ export function createOrderedListFromStringOfParagraphs(stringOfParagraphs) { * @returns {string} */ export function toTitleCase(text) { - const temp = text?.toLowerCase()?.split(' ') ?? []; - for (let i = 0; i < temp.length; i++) { - temp[i] = temp[i].charAt(0).toUpperCase() + temp[i].slice(1); - } - return temp.join(' '); + let temp = text.toLowerCase(); + return temp.replace(/(^|\s|-)\S/g, (letter) => letter.toUpperCase()); } /** diff --git a/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue b/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue index 334ba86a..931b950e 100644 --- a/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue +++ b/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue @@ -1,6 +1,7 @@ @@ -51,10 +60,11 @@ import modal from '@/digital-components/modal/modal.vue'; import textboxQuestion from '@/digital-components/textbox-question/textbox-question.vue'; // Supporting Files -import { useMainStore } from '@/store/index.js'; +import { useMainStore } from '@/store'; import globalRules from '@/constants/global-rules.js'; import MaskaFormattedMasks from '@/constants/maska-masks'; import widgetFields from '@/constants/cms-widget-fields.js'; +import { modalPositions } from '@/constants/component-variants'; export default { name: 'contact-details-drawer', @@ -67,27 +77,39 @@ export default { const { firstName, lastName, emailAddress, - servicePhone } = useMainStore().contactInfo; + servicePhone, + extension } = useMainStore().contactInfo; + console.log('Initial contact info loaded:', { + firstName, + lastName, + emailAddress, + servicePhone, + extension + }); return { isModalOpened: false, firstName, lastName, emailAddress, phoneNumber: servicePhone, + extension: extension, widget: { title: 'ContactDetailsDrawerHeaderWidget', firstNameQuestion: 'FirstNameQuestionWidget', lastNameQuestion: 'LastNameQuestionWidget', emailQuestion: 'EmailQuestionWidget', phoneNumberQuestion: 'PhoneNumberQuestionWidget', + extensionQuestion: 'ExtensionQuestionWidget', drawerFooter: 'ContactDetailsDrawerFooterWidget' }, rules: { firstName: globalRules.FIRST_NAME_REQUIRED, lastName: globalRules.LAST_NAME_REQUIRED, emailAddress: `${globalRules.EMAIL_ADDRESS_REQUIRED}|${globalRules.EMAIL_ADDRESS_FORMAT}`, - phoneNumber: `${globalRules.PHONE_NUMBER_REQUIRED}|${globalRules.PHONE_NUMBER_FORMAT}` - } + phoneNumber: `${globalRules.PHONE_NUMBER_REQUIRED}|${globalRules.PHONE_NUMBER_FORMAT}`, + extension: `${globalRules.EXTENSION_FORMAT}` + }, + modalPositions }; }, computed: { @@ -121,10 +143,11 @@ export default { lastName: this.lastName, emailAddress: this.emailAddress }; - useMainStore().updateContactInfo(contactInfo); - useMainStore().updatePhoneNumbers({ + this.mainStore.updateContactInfo(contactInfo); + this.mainStore.updatePhoneNumbers({ home: this.phoneNumber, - service: this.phoneNumber + service: this.phoneNumber, + extension: this.extension }); this.$emit('update-contact-details'); }, @@ -132,11 +155,20 @@ export default { const { firstName, lastName, emailAddress, - servicePhone } = useMainStore().contactInfo; + servicePhone, + extension } = this.mainStore.contactInfo; + console.log('Resetting form values to:', { + firstName, + lastName, + emailAddress, + servicePhone, + extension + }); this.firstName = firstName; this.lastName = lastName; this.emailAddress = emailAddress; this.phoneNumber = servicePhone; + this.extension = extension; }, openModal() { this.modal.openModal(); @@ -155,5 +187,14 @@ export default { font-size: $h5-font-size; font-weight: $font-weight-normal !important; } + .textbox-question { + margin-bottom: 1.25rem; + :deep(label:has(b)) { + font-weight: $font-weight-normal; + b { + font-weight: 600; + } + } + } } diff --git a/src/layouts/tpa-submit/deductible-box/deductible-box.vue b/src/layouts/tpa-submit/deductible-box/deductible-box.vue index 756f7da0..fd1ea4bd 100644 --- a/src/layouts/tpa-submit/deductible-box/deductible-box.vue +++ b/src/layouts/tpa-submit/deductible-box/deductible-box.vue @@ -1,17 +1,9 @@ @@ -28,12 +20,17 @@ export default { diff --git a/src/layouts/tpa-submit/review-block/review-block.vue b/src/layouts/tpa-submit/review-block/review-block.vue index 4f5af710..63e6efa4 100644 --- a/src/layouts/tpa-submit/review-block/review-block.vue +++ b/src/layouts/tpa-submit/review-block/review-block.vue @@ -1,29 +1,28 @@ @@ -36,14 +35,13 @@ export default { props: { customHeaderText: String, editScreenReaderTextCmsWidgetName: String, - lines: Array + lines: Array, + editLinkText: { + type: String, + default: 'Edit' + }, }, emits: ['click-edit'], - data() { - return { - editLinkText: 'Edit' - }; - }, methods: { editClicked() { this.$emit('click-edit'); @@ -59,12 +57,16 @@ export default { } .review-block__header { color: $black; + font-weight: $font-weight-bold; + margin-bottom: .625rem; } - .review-block__body--line { - color: $gray-600; + + .review-body { + margin-bottom: .625rem } + .link { - text-underline-offset: 1px; + font-weight: $font-weight-normal } } diff --git a/src/layouts/tpa-submit/tpa-submit.vue b/src/layouts/tpa-submit/tpa-submit.vue index 181fa0aa..aa334adf 100644 --- a/src/layouts/tpa-submit/tpa-submit.vue +++ b/src/layouts/tpa-submit/tpa-submit.vue @@ -13,53 +13,52 @@
- + + class="tpa-submit-title"/> - - -
+ :customText="subHeaderBodyOne" /> + + +
{{ recalModalContent.subHeaderText }}
+ +
+ +
- -
-
-
- -
+
+
+
-
+
@@ -67,17 +66,10 @@ id="tpaSubmitOrderDetailsTitle" ref="tpaSubmitOrderDetailsTitle" :customText="orderDetailsTitle" - :marginTopSizeOverride="4" - class="fw-bold text-color--black" /> - + :marginTopSizeOverride="0" + class="fw-bold order-details-title" />
v != null && v !== '') - .join(' '); - return [line]; - }, - locationAnswers() { - return this.getInputQuestionWidgetAnswersNullSafe(this.widget.damageLocations); - }, - driverSideDamageAnswers() { - const answerContent = getLocationAnswer( - damageLocationsSelected.DRIVER, - this.locationAnswers - ); - return this.getInputQuestionWidgetAnswersNullSafe(answerContent?.SubWidgetName); - }, - passengerSideDamageAnswers() { - const answerContent = getLocationAnswer( - damageLocationsSelected.PASSENGER, - this.locationAnswers - ); - return this.getInputQuestionWidgetAnswersNullSafe(answerContent?.SubWidgetName); - }, - getDamageLines() { - const { glassToReplace, isRepair } = useMainStore().order.damage; - return getDamageDisplayContent( - this.locationAnswers, - this.driverSideDamageAnswers, - this.passengerSideDamageAnswers, - glassToReplace, - isRepair - ); + getPreferredShopTitle() { + return toTitleCase(this.mainStore.order.serviceLocation.provider.companyName ?? ''); }, getPreferredShopLines() { - const { phoneNumber, address } = - useMainStore().order.serviceLocation.provider; + const { phoneNumber, address } = this.mainStore.order.serviceLocation.provider; const { streetAddress, city, state, zipCode } = address; const displayAddress = formatAddress( streetAddress, @@ -284,58 +235,82 @@ export default { ); const displayPhoneNumber = toDisplayPhoneNumber(phoneNumber); return [ - toTitleCase(this.companyName ?? ''), displayAddress, displayPhoneNumber ]; }, + getEditShopLinkText() { + return this.getCmsContent( + this.widget.editShopLinkText, + widgetFields.TEXT_BLOCK_WIDGET.TEXT + ); + }, + getContactInfoTitle() { + const cmsContent = this.getCmsContent( + this.widget.contactDetails, + widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT + ); + return getStringWithCustomValues(cmsContent, this.customValueMap); + }, getContactInfoLines() { - const { firstName, lastName, emailAddress, servicePhone } = - useMainStore().contactInfo; + const cmsContent = this.getCmsContent( + this.widget.contactDetails, + widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT + ); return [ - `${firstName} ${lastName}`, - emailAddress ?? '', - toDisplayPhoneNumber(servicePhone) + getStringWithCustomValues(cmsContent, this.customValueMap) ]; + }, + getEditContactInfoLinkText() { + return this.getCmsContent( + this.widget.contactDetails, + widgetFields.CONTENT_GROUP_WIDGET.FOOTER_TEXT + ); + }, + recalModalContent() { + const widgetName = 'RecalModal'; + return { + headerText: this.getCmsContent(widgetName, widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT), + subHeaderText: this.getCmsContent(widgetName, widgetFields.CONTENT_GROUP_WIDGET.SUBHEADER_TEXT), + bodyText: this.getCmsContent(widgetName, widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT), + footerButtonText: this.getCmsContent(widgetName, widgetFields.CONTENT_GROUP_WIDGET.FOOTER_TEXT), + image: this.getCmsContent(widgetName, widgetFields.CONTENT_GROUP_WIDGET.IMAGE) + } + }, + recalibrationRequired() { + return this.mainStore.hasRecalibrationPart; + }, + customValueMap() { + return { + glassShop: this.getPreferredShopTitle, + contactPhone: toDisplayPhoneNumber(this.mainStore.contactInfo.servicePhone), + contactEmail: this.mainStore.contactInfo.emailAddress + } } }, methods: { setSections() { - const vehicleScenario = useMainStore().isPolicyVehicle - ? this.navigationScenarios.EDIT_POLICY_VEHICLE - : this.navigationScenarios.EDIT_VEHICLE; this.sections = [ this.getSection( - this.widget.subheader.vehicle, - this.getVehicleLines, - () => this.navigate(vehicleScenario) - ), - // eslint-disable-next-line max-len - this.getSection( - this.widget.subheader.damage, - this.getDamageLines, - () => this.navigate(this.navigationScenarios.EDIT_DAMAGE) - ), - this.getSection( - this.widget.subheader.shop, + this.getPreferredShopTitle, this.getPreferredShopLines, - () => this.navigate(this.navigationScenarios.EDIT_PREFERRED_SHOP) + this.getEditShopLinkText, + () => this.navigate(this.navigationScenarios.EDIT_PREFERRED_SHOP), ), // eslint-disable-next-line max-len this.getSection( - this.widget.subheader.contactInfo, + this.getContactInfoTitle, this.getContactInfoLines, + this.getEditContactInfoLinkText, this.openContactDetailsModal ) ]; }, - getSection(widgetName, lines, onClick) { + getSection(title, lines, editLinkText, onClick) { return { - title: this.getCmsContent( - widgetName, - widgetFields.TEXT_BLOCK_WIDGET.TEXT - ), + title: title, lines, + editLinkText, onClickEdit: onClick }; }, @@ -344,7 +319,7 @@ export default { await submitWorkOrder({ submitType: submitType.TPA }).then(() => { this.navigate(this.navigationScenarios.CLICKED_FORWARD); }).catch((submitError) => { - useMainStore().setBailout(bailoutMessage.saveSessionError(submitError.data)); + this.mainStore.setBailout(bailoutMessage.saveSessionError(submitError.data)); this.navigate( this.navigationScenarios.SAVE_SESSION_FAILED, this.$route, @@ -372,6 +347,12 @@ export default { }, openContactDetailsModal() { this.$refs.contactDetailsDrawer.openModal(); + }, + openRecalModal() { + this.$refs.recalModal.openModal(); + }, + closeRecalModal() { + this.$refs.recalModal.closeModal(); } } }; @@ -387,26 +368,69 @@ export default { } .tpa-submit { - #tpaSubmitOrderDetailsBody { - p { - font-size: .875rem; - } - } - .tpa-submit__title--line-height { - line-height: map-get($spacers, 6); + .alert-warning { + margin-top: 1.25rem; + margin-bottom: 0rem; } - .text-color--darker-gray { - color: $darker-gray; + .tpa-submit-title { + font-size: 1.25rem; + color: $black; + font-weight: 400; + margin-top: 1.25rem; + margin-bottom: .625rem; } - .text-color--black { + .recal-alert { + margin-bottom: 4rem; + } + + b { + font-weight: $font-weight-bold; color: $black; } hr { - opacity: 1; - color: $gray-350; + margin: 1.875rem 0rem; + } + + .fw-bold { + color: $black; + } + + .order-details-title { + margin-bottom: .625rem; + } + + .modal.recal-modal .modal-dialog { + .modal-header { + justify-content: start; + margin: 0rem; + padding: 1.25rem 1.25rem .625rem 1.25rem; + .modal-title { + font-weight: $font-weight-bolder; + font-size: .875rem; + line-height: 1.25rem; + text-align: start; + justify-content: start; + } + .btn-close { + display: none; + } + } + .modal-body { + padding: 0rem 1.25rem 1.25rem 1.25rem; + b { + font-weight: 600; + } + } + .recal-modal-subheader { + font-weight: $font-weight-bold; + color: $black; + } + .recal-modal-image { + margin: 1.25rem 0rem + } } } diff --git a/src/store/index.js b/src/store/index.js index 05927b17..3959bd62 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -197,6 +197,7 @@ export const getDefaultState = () => ({ homePhone: null, alternativePhone: null, servicePhone: null, + extension: null, requestTextUpdates: false, notesForTechnician: '' }, @@ -354,6 +355,7 @@ export const useMainStore = defineStore({ homePhone: s.order.contactInfo.homePhone, alternativePhone: s.order.contactInfo.alternativePhone, servicePhone: s.order.contactInfo.servicePhone, + extension: s.order.contactInfo.extension, requestTextUpdates: s.order.contactInfo.requestTextUpdates ?? false, notesForTechnician: s.order.contactInfo.notesForTechnician }), @@ -2572,9 +2574,12 @@ export const useMainStore = defineStore({ updatePhoneNumbers(phoneNumbers) { const contact = this.order.contactInfo; + console.log('Updating phone numbers with:', phoneNumbers); + console.log('Current contact info before update:', contact); contact.homePhone = phoneNumbers.home !== undefined ? phoneNumbers.home : contact.homePhone; contact.alternativePhone = phoneNumbers.alternative !== undefined ? phoneNumbers.alternative : contact.alternativePhone; contact.servicePhone = phoneNumbers.service !== undefined ? phoneNumbers.service : contact.servicePhone; + contact.extension = phoneNumbers.extension !== undefined ? phoneNumbers.extension : contact.extension; }, GetExperimentsByUser(userId) { diff --git a/src/store/store.spec.js b/src/store/store.spec.js index 154776b2..239589ee 100644 --- a/src/store/store.spec.js +++ b/src/store/store.spec.js @@ -494,18 +494,21 @@ describe('Store', () => { const homePhone = getRandomInt(1000000000, 9999999999); const servicePhone = getRandomInt(1000000000, 9999999999); const altPhone = getRandomInt(1000000000, 9999999999); + const extension = getRandomInt(10000, 99999); // Act store.updatePhoneNumbers({ home: homePhone, service: servicePhone, - alternative: altPhone + alternative: altPhone, + extension: extension }); // Assert expect(store.contactInfo.homePhone).toEqual(homePhone); expect(store.contactInfo.servicePhone).toEqual(servicePhone); expect(store.contactInfo.alternativePhone).toEqual(altPhone); + expect(store.contactInfo.extension).toEqual(extension); }); it('All null values => contact info set in store to all nulls', () => { // Act diff --git a/src/ux-components/alert/alert.vue b/src/ux-components/alert/alert.vue index 00b3e91f..cda82a85 100644 --- a/src/ux-components/alert/alert.vue +++ b/src/ux-components/alert/alert.vue @@ -226,6 +226,7 @@ export default { padding: 0rem .625rem; } .btn-collapse { + display: flex; border: none; background: none; min-width: 1rem; @@ -242,7 +243,7 @@ export default { } } a { - text-decoration: none; + font-weight: $font-weight-normal; } border-color: transparent; .btn-close { From 86c6b231b65584a457aadea4e365283e5410ed45 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Wed, 21 Jan 2026 16:09:28 -0500 Subject: [PATCH 2/9] Address test failures --- src/helpers/text-helper.js | 2 +- .../__snapshots__/tpa-submit.spec.js.snap | 18 +- .../contact-details-drawer.spec.js.snap | 7 + .../contact-details-drawer.spec.js | 22 ++- .../deductible-box/deductible-box.spec.js | 8 +- .../deductible-box/deductible-box.vue | 4 +- .../review-block/review-block.spec.js | 4 +- src/layouts/tpa-submit/tpa-submit.spec.js | 180 ++++-------------- src/layouts/tpa-submit/tpa-submit.vue | 6 - 9 files changed, 72 insertions(+), 179 deletions(-) diff --git a/src/helpers/text-helper.js b/src/helpers/text-helper.js index b35f4803..c16f2143 100644 --- a/src/helpers/text-helper.js +++ b/src/helpers/text-helper.js @@ -34,7 +34,7 @@ export function createOrderedListFromStringOfParagraphs(stringOfParagraphs) { * @returns {string} */ export function toTitleCase(text) { - let temp = text.toLowerCase(); + let temp = text?.toLowerCase() ?? ''; return temp.replace(/(^|\s|-)\S/g, (letter) => letter.toUpperCase()); } diff --git a/src/layouts/tpa-submit/__snapshots__/tpa-submit.spec.js.snap b/src/layouts/tpa-submit/__snapshots__/tpa-submit.spec.js.snap index 42ed6d08..7eeae7cd 100644 --- a/src/layouts/tpa-submit/__snapshots__/tpa-submit.spec.js.snap +++ b/src/layouts/tpa-submit/__snapshots__/tpa-submit.spec.js.snap @@ -2,24 +2,20 @@ exports[`tpa-submit returns the initial data 1`] = ` Object { - "companyName": "Frederick Jones", - "customValueMap": Object { - "glassShop": "Frederick Jones", + "modalPositions": Object { + "center": "center", + "edge": "edge", }, "sections": Array [], "widget": Object { - "damageLocations": "DamageLocationsWidget", + "alertIncomplete": "AlertIncompleteWidget", + "alertRecalWarning": "AlertRecalWarningWidget", + "contactDetails": "ContactDetailsSectionWidget", + "editShopLinkText": "EditShopLinkTextWidget", "footer": "SiteFooterWidget", "orderDetails": "OrderDetailsContent", - "serviceSummary": "ServiceSummaryContent", "siteHeader": "SiteHeaderWidget", "siteSubHeader": "SiteSubHeaderWidget", - "subheader": Object { - "contactInfo": "ContactDetailsSubTitle", - "damage": "DamageSubTitle", - "shop": "PreferredShopSubTitle", - "vehicle": "VehicleSubTitle", - }, }, } `; diff --git a/src/layouts/tpa-submit/contact-details-drawer/__snapshots__/contact-details-drawer.spec.js.snap b/src/layouts/tpa-submit/contact-details-drawer/__snapshots__/contact-details-drawer.spec.js.snap index 3b814991..842c5af2 100644 --- a/src/layouts/tpa-submit/contact-details-drawer/__snapshots__/contact-details-drawer.spec.js.snap +++ b/src/layouts/tpa-submit/contact-details-drawer/__snapshots__/contact-details-drawer.spec.js.snap @@ -3,12 +3,18 @@ exports[`contact-details-drawer snapshot matches returns the initial data 1`] = ` Object { "emailAddress": "fred.tay@gmail.com", + "extension": null, "firstName": "Frederick", "isModalOpened": false, "lastName": "Taylor", + "modalPositions": Object { + "center": "center", + "edge": "edge", + }, "phoneNumber": "606-009-2943", "rules": Object { "emailAddress": "email-required|email-address-format", + "extension": "extension-format", "firstName": "first-name-required", "lastName": "last-name-required", "phoneNumber": "phone-number-required|phone-number-format", @@ -16,6 +22,7 @@ Object { "widget": Object { "drawerFooter": "ContactDetailsDrawerFooterWidget", "emailQuestion": "EmailQuestionWidget", + "extensionQuestion": "ExtensionQuestionWidget", "firstNameQuestion": "FirstNameQuestionWidget", "lastNameQuestion": "LastNameQuestionWidget", "phoneNumberQuestion": "PhoneNumberQuestionWidget", diff --git a/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.spec.js b/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.spec.js index 9c579dbc..901effe9 100644 --- a/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.spec.js +++ b/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.spec.js @@ -65,15 +65,16 @@ describe('contact-details-drawer', () => { describe('method', () => { describe('saveContactDetails', () => { test.each([ - ['Sarah', 'Jones', 's.jones@gmail.com', '724-996-0909'], - [null, 'Jones', 's.jones@gmail.com', '724-996-0909'], - ['Sarah', null, 's.jones@gmail.com', '724-996-0909'], - ['Sarah', 'Jones', null, '724-996-0909'], - ['Sarah', 'Jones', 's.jones@gmail.com', null] + ['Sarah', 'Jones', 's.jones@gmail.com', '724-996-0909', '12345'], + [null, 'Jones', 's.jones@gmail.com', '724-996-0909', '12345'], + ['Sarah', null, 's.jones@gmail.com', '724-996-0909', '12345'], + ['Sarah', 'Jones', null, '724-996-0909', '12345'], + ['Sarah', 'Jones', 's.jones@gmail.com', null, '12345'], + ['Sarah', 'Jones', 's.jones@gmail.com', '724-996-0909', null], ])( - 'when first name data "%p", last name "%p", email "%p", and phone number "%p", updateContactInfo called with expected', - (firstName, lastName, emailAddress, phoneNumber) => { + 'when first name data "%p", last name "%p", email "%p", phone number "%p", and extension "%p", updateContactInfo called with expected', + (firstName, lastName, emailAddress, phoneNumber, extension) => { // Arrange const mainInitialState = { order: { @@ -81,12 +82,13 @@ describe('contact-details-drawer', () => { firstName: 'Frederick', lastName: 'Taylor', emailAddress: 'fred.tay@gmail.com', - servicePhone: '606-009-2943' + servicePhone: '606-009-2943', + extension: '11111' } } }; const initialData = { - firstName, lastName, emailAddress, phoneNumber + firstName, lastName, emailAddress, phoneNumber, extension }; const { wrapper } = getMountedComponent(mainInitialState, initialData); @@ -98,7 +100,7 @@ describe('contact-details-drawer', () => { expect(useMainStore().updateContactInfo).toBeCalledTimes(1); expect(useMainStore().updateContactInfo).toBeCalledWith({ firstName, lastName, emailAddress }); expect(useMainStore().updatePhoneNumbers).toBeCalledTimes(1); - expect(useMainStore().updatePhoneNumbers).toBeCalledWith({ home: phoneNumber, service: phoneNumber }); + expect(useMainStore().updatePhoneNumbers).toBeCalledWith({ home: phoneNumber, service: phoneNumber, extension: extension }); } ); }); diff --git a/src/layouts/tpa-submit/deductible-box/deductible-box.spec.js b/src/layouts/tpa-submit/deductible-box/deductible-box.spec.js index eda7c873..cf0b7b1f 100644 --- a/src/layouts/tpa-submit/deductible-box/deductible-box.spec.js +++ b/src/layouts/tpa-submit/deductible-box/deductible-box.spec.js @@ -18,7 +18,7 @@ describe('deductible-box', () => { it('renders the correct deductible label', () => { const labelElement = wrapper.find('#deductibleLabel'); - expect(labelElement.text()).toBe('Deductible'); + expect(labelElement.text()).toBe('Deductible:'); }); it('has the correct id', () => { @@ -26,12 +26,8 @@ describe('deductible-box', () => { }); it('has the correct classes', () => { - expect(wrapper.classes().length).toBe(5); + expect(wrapper.classes().length).toBe(1); expect(wrapper.classes()).toContain('deductible-box'); - expect(wrapper.classes()).toContain('d-flex'); - expect(wrapper.classes()).toContain('justify-content-between'); - expect(wrapper.classes()).toContain('align-items-center'); - expect(wrapper.classes()).toContain('py-2'); }); it.each([ ['', ''], diff --git a/src/layouts/tpa-submit/deductible-box/deductible-box.vue b/src/layouts/tpa-submit/deductible-box/deductible-box.vue index fd1ea4bd..797cd941 100644 --- a/src/layouts/tpa-submit/deductible-box/deductible-box.vue +++ b/src/layouts/tpa-submit/deductible-box/deductible-box.vue @@ -2,8 +2,8 @@
- Deductible: - {{ value }} + Deductible: + {{ value }}
diff --git a/src/layouts/tpa-submit/review-block/review-block.spec.js b/src/layouts/tpa-submit/review-block/review-block.spec.js index 82f3c4e5..f7f6d514 100644 --- a/src/layouts/tpa-submit/review-block/review-block.spec.js +++ b/src/layouts/tpa-submit/review-block/review-block.spec.js @@ -20,12 +20,12 @@ describe('ReviewBlock.vue', () => { }); it('renders the correct number of lines', () => { - const lineElements = wrapper.findAll('.review-block__body--line'); + const lineElements = wrapper.findAll('.review-body p'); expect(lineElements.length).toBe(lines.length); }); it('renders the correct line text', () => { - const lineElements = wrapper.findAll('.review-block__body--line'); + const lineElements = wrapper.findAll('.review-body p'); lines.forEach((line, index) => { expect(lineElements.at(index).text()).toBe(line); }); diff --git a/src/layouts/tpa-submit/tpa-submit.spec.js b/src/layouts/tpa-submit/tpa-submit.spec.js index 7dd6920b..6470f241 100644 --- a/src/layouts/tpa-submit/tpa-submit.spec.js +++ b/src/layouts/tpa-submit/tpa-submit.spec.js @@ -18,7 +18,15 @@ import coverageStatuses from '@/constants/coverage-statuses'; jest.mock('@/helpers/cms-content-helper', () => ({ fetchCmsContentForPage: jest.fn(), doesCopyContainRouterLink: jest.fn(), - getStringWithCustomValues: jest.fn(), + getStringWithCustomValues: jest.fn((str, customValueMap) => { + let newString = str ?? ''; + if (customValueMap != null) { + Object.keys(customValueMap).forEach((key) => { + newString = newString.replaceAll(`{custom:${key}}`, customValueMap[key]); + }); + } + return newString; + }), processIfStatements: jest.fn() })); @@ -129,11 +137,7 @@ describe('tpa-submit', () => { // Assert expect(subHeader.exists()).toBeTruthy(); - expect(subHeader.props().justifyText).toBe('center'); - expect(subHeader.props().marginTopSizeOverride).toBe(4); - expect(subHeader.classes()).toContain('text-color--black'); - expect(subHeader.classes()).toContain('fs-5'); - expect(subHeader.classes()).toContain('tpa-submit__title--line-height'); + expect(subHeader.classes()).toContain('tpa-submit-title'); }); test('sub header body one', () => { // Arrange @@ -144,34 +148,6 @@ describe('tpa-submit', () => { // Assert expect(subHeaderBodyOne.exists()).toBeTruthy(); - expect(subHeaderBodyOne.classes()).toContain('small'); - expect(subHeaderBodyOne.classes()).toContain('text-color--darker-gray'); - }); - test('sub header body two', () => { - // Arrange - const wrapper = shallowMount(tpaSubmit, getMountOptions()); - - // Act - const subHeaderBodyTwo = wrapper.findComponent({ ref: 'tpaSubmitSubHeaderBodyTwo' }); - - // Assert - expect(subHeaderBodyTwo.exists()).toBeTruthy(); - expect(subHeaderBodyTwo.classes()).toContain('mb-4'); - expect(subHeaderBodyTwo.classes()).toContain('small'); - expect(subHeaderBodyTwo.classes()).toContain('text-color--darker-gray'); - }); - test('main button one', () => { - // Arrange - const wrapper = shallowMount(tpaSubmit, getMountOptions()); - - // Act - const mainButton = wrapper.findComponent({ ref: 'buttonMainOne' }); - - // Assert - expect(mainButton.exists()).toBeTruthy(); - expect(mainButton.props().variant).toBe('success'); - expect(mainButton.classes()).toContain('w-100'); - expect(mainButton.classes()).toContain('mb-5'); }); test('service summary section', () => { // Arrange @@ -183,21 +159,6 @@ describe('tpa-submit', () => { // Assert expect(serviceSummarySection.exists()).toBeTruthy(); }); - test('service summary title', () => { - // Arrange - const wrapper = shallowMount(tpaSubmit, getMountOptions()); - - // Act - const serviceSummaryTitle = wrapper.findComponent({ ref: 'tpaSubmitServiceSummaryTitle' }); - - // Assert - expect(serviceSummaryTitle.exists()).toBeTruthy(); - expect(serviceSummaryTitle.props().marginTopSizeOverride).toBe(4); - expect(serviceSummaryTitle.classes()).toContain('fw-bold'); - expect(serviceSummaryTitle.classes()).toContain('fs-1'); - expect(serviceSummaryTitle.classes()).toContain('lh-lg'); - expect(serviceSummaryTitle.classes()).toContain('text-color--black'); - }); describe('review blocks', () => { const title1 = 'Section 1'; const title2 = 'Another Section'; @@ -253,24 +214,8 @@ describe('tpa-submit', () => { // Assert expect(submitOrderDetailsTitle.exists()).toBeTruthy(); - expect(submitOrderDetailsTitle.props().marginTopSizeOverride).toBe(4); expect(submitOrderDetailsTitle.classes()).toContain('fw-bold'); - expect(submitOrderDetailsTitle.classes()).toContain('text-color--black'); - }); - test('submit order details body', () => { - // Arrange - const wrapper = shallowMount(tpaSubmit, getMountOptions()); - - // Act - const submitOrderDetailsTitle = wrapper.findComponent({ ref: 'tpaSubmitOrderDetailsBody' }); - - // Assert - expect(submitOrderDetailsTitle.exists()).toBeTruthy(); - expect(submitOrderDetailsTitle.props().marginTopSizeOverride).toBe(4); - expect(submitOrderDetailsTitle.classes()).toContain('mb-4'); - expect(submitOrderDetailsTitle.classes()).toContain('px-4'); - expect(submitOrderDetailsTitle.classes()).toContain('small'); - expect(submitOrderDetailsTitle.classes()).toContain('text-color--darker-gray'); + expect(submitOrderDetailsTitle.classes()).toContain('order-details-title'); }); test('deductible box', () => { // Arrange @@ -306,7 +251,7 @@ describe('tpa-submit', () => { }); }); describe('before route enter', () => { - test('produces 4 sections', async () => { + test('produces 2 sections', async () => { // Arrange const { wrapper } = getMountedComponent(); expect(wrapper.vm.sections.length).toBe(0); @@ -320,65 +265,13 @@ describe('tpa-submit', () => { ); // Assert - expect(wrapper.vm.sections.length).toBe(4); - }); - test.each([ - ['2004', 'Honda', 'Civic', '2004 Honda Civic'], - [null, 'Honda', 'Civic', 'Honda Civic'], - ['2004', '', 'Civic', '2004 Civic'], - ['2004', 'Honda', null, '2004 Honda'], - ['2004', null, undefined, '2004'], - [null, null, null, ''] - ])( - 'when store vehicle has year %p, make %p, and model %p, has line %p', - async (year, make, model, line) => { - // Arrange - const initialStore = { - order: { - vehicle: { year, make, model } - } - }; - const { wrapper } = getMountedComponent(initialStore); - const vehicleSectionIndex = 0; - const expectedLines = [line]; - - // Act - await tpaSubmit.beforeRouteEnter.call( - wrapper.vm, - { query: { issPage: 'tpa-submit' } }, - undefined, - (c) => c(wrapper.vm) - ); - - // Assert - const vehicleSection = wrapper.vm.sections[vehicleSectionIndex]; - expect(vehicleSection.lines).toStrictEqual(expectedLines); - } - ); - test('damage section lines equal result from getDamageDisplayContent', async () => { - // Arrange - const { wrapper } = getMountedComponent(); - const damageSectionIndex = 1; - const expectedLines = ['hi', 'potato', 'vehicle 3']; - getDamageDisplayContent.mockImplementationOnce(() => expectedLines); - - // Act - await tpaSubmit.beforeRouteEnter.call( - wrapper.vm, - { query: { issPage: 'tpa-submit' } }, - undefined, - (c) => c(wrapper.vm) - ); - - // Assert - const damageSection = wrapper.vm.sections[damageSectionIndex]; - expect(damageSection.lines).toEqual(expectedLines); + expect(wrapper.vm.sections.length).toBe(2); }); describe('preferred shop section', () => { - test('has three lines', async () => { + test('has two lines', async () => { // Arrange const { wrapper } = getMountedComponent(); - const preferredShopSectionIndex = 2; + const preferredShopSectionIndex = 0; // Act await tpaSubmit.beforeRouteEnter.call( @@ -390,15 +283,15 @@ describe('tpa-submit', () => { // Assert const preferredShopSection = wrapper.vm.sections[preferredShopSectionIndex]; - expect(preferredShopSection.lines.length).toBe(3); + expect(preferredShopSection.lines.length).toBe(2); }); - test('first line is value returned from toTitleCase method', async () => { + test('title is value returned from toTitleCase method', async () => { // Arrange const initialData = { companyName: 'some value' }; const { wrapper } = getMountedComponent({}, initialData); const expectedName = 'some expected name'; toTitleCase.mockImplementationOnce(() => expectedName); - const preferredShopSectionIndex = 2; + const preferredShopSectionIndex = 0; // Act await tpaSubmit.beforeRouteEnter.call( @@ -410,9 +303,9 @@ describe('tpa-submit', () => { // Assert const preferredShopSection = wrapper.vm.sections[preferredShopSectionIndex]; - expect(preferredShopSection.lines[0]).toBe(expectedName); + expect(preferredShopSection.title).toBe(expectedName); }); - test('second line is expected and formatAddress called', async () => { + test('first line is expected and formatAddress called', async () => { // Arrange const address = { streetAddress: '123 South Ln', @@ -430,7 +323,7 @@ describe('tpa-submit', () => { const { wrapper } = getMountedComponent(initialStore); const line = 'some returned line'; formatAddress.mockImplementationOnce(() => line); - const preferredShopSectionIndex = 2; + const preferredShopSectionIndex = 0; // Act await tpaSubmit.beforeRouteEnter.call( @@ -442,7 +335,7 @@ describe('tpa-submit', () => { // Assert const preferredShopSection = wrapper.vm.sections[preferredShopSectionIndex]; - expect(preferredShopSection.lines[1]).toBe(line); + expect(preferredShopSection.lines[0]).toBe(line); expect(formatAddress).toHaveBeenCalledTimes(1); expect(formatAddress).toHaveBeenCalledWith( address.streetAddress, @@ -452,7 +345,7 @@ describe('tpa-submit', () => { address.zipCode ); }); - test('third line is expected and toDisplayPhoneNumber called', async () => { + test('second line is expected and toDisplayPhoneNumber called', async () => { // Arrange const phoneNumber = '9998887777'; const initialStore = { @@ -465,7 +358,7 @@ describe('tpa-submit', () => { const { wrapper } = getMountedComponent(initialStore); const expectedLine = 'returned from to display phone num'; toDisplayPhoneNumber.mockImplementationOnce(() => expectedLine); - const preferredShopSectionIndex = 2; + const preferredShopSectionIndex = 0; // Act await tpaSubmit.beforeRouteEnter.call( @@ -477,7 +370,7 @@ describe('tpa-submit', () => { // Assert const preferredShopSection = wrapper.vm.sections[preferredShopSectionIndex]; - expect(preferredShopSection.lines[2]).toBe(expectedLine); + expect(preferredShopSection.lines[1]).toBe(expectedLine); expect(toDisplayPhoneNumber).toHaveBeenCalledWith(phoneNumber); }); }); @@ -487,8 +380,14 @@ describe('tpa-submit', () => { const lastName = 'Eddison'; const emailAddress = 'myname@gmail.com'; const servicePhone = '0001112222'; + const providerCompanyName = 'Some Provider LLC'; const initialStore = { order: { + serviceLocation: { + provider: { + companyName: providerCompanyName + } + }, contactInfo: { firstName, lastName, @@ -498,11 +397,11 @@ describe('tpa-submit', () => { } }; const { wrapper } = getMountedComponent(initialStore); - const expectedLine1 = 'Jones Eddison'; - const expectedLine2 = emailAddress; - const expectedLine3 = 'some value returned'; - toDisplayPhoneNumber.mockImplementation((number) => (number === servicePhone ? expectedLine3 : '')); - const contactInfoSectionIndex = 3; + const expectedEmail = emailAddress; + const expectedPhone = 'some value returned'; + toDisplayPhoneNumber.mockImplementation((number) => (number === servicePhone ? expectedPhone : '')); + const contactInfoSectionIndex = 1; + wrapper.vm.getCmsContent.mockImplementation(() => '{custom:contactPhone} or {custom:contactEmail}'); // Act await tpaSubmit.beforeRouteEnter.call( @@ -511,12 +410,12 @@ describe('tpa-submit', () => { undefined, (c) => c(wrapper.vm) ); + wrapper.vm.setSections(); // Assert const contactInfoSection = wrapper.vm.sections[contactInfoSectionIndex]; - expect(contactInfoSection.lines[0]).toBe(expectedLine1); - expect(contactInfoSection.lines[1]).toBe(expectedLine2); - expect(contactInfoSection.lines[2]).toBe(expectedLine3); + expect(contactInfoSection.lines[0]).toContain(expectedEmail); + expect(contactInfoSection.lines[0]).toContain(expectedPhone); expect(toDisplayPhoneNumber).toHaveBeenCalledWith(servicePhone); }); }); @@ -524,7 +423,6 @@ describe('tpa-submit', () => { test.each([ ['subHeaderTitle', 'SiteSubHeaderWidget', widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT, 'site sub header'], ['subHeaderBodyOne', 'SiteSubHeaderWidget', widgetFields.CONTENT_GROUP_WIDGET.BODY_TEXT, 'sub header body one'], - ['serviceSummaryText', 'ServiceSummaryContent', widgetFields.TEXT_BLOCK_WIDGET.TEXT, 'service summary text'], ['orderDetailsTitle', 'OrderDetailsContent', widgetFields.CONTENT_GROUP_WIDGET.HEADER_TEXT, 'order details title'], ['forwardButtonText', 'SiteFooterWidget', widgetFields.FOOTER_WIDGET.FORWARD_BUTTON_TEXT, 'forward button text'] ])('computed %p returns expected value', (computedName, widgetLabel, fieldLabel, expected) => { diff --git a/src/layouts/tpa-submit/tpa-submit.vue b/src/layouts/tpa-submit/tpa-submit.vue index aa334adf..ff3824bc 100644 --- a/src/layouts/tpa-submit/tpa-submit.vue +++ b/src/layouts/tpa-submit/tpa-submit.vue @@ -180,12 +180,6 @@ export default { ); return getStringWithCustomValues(cmsContent, this.customValueMap); }, - serviceSummaryText() { - return this.getCmsContent( - this.widget.serviceSummary, - widgetFields.TEXT_BLOCK_WIDGET.TEXT - ); - }, orderDetailsTitle() { return this.getCmsContent( this.widget.orderDetails, From 2750d98f36f1e7a2ff3eb8ada135aafcba21f45b Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Wed, 21 Jan 2026 16:11:37 -0500 Subject: [PATCH 3/9] Remove debug console.logs --- .../contact-details-drawer.vue | 14 -------------- src/store/index.js | 2 -- 2 files changed, 16 deletions(-) diff --git a/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue b/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue index 931b950e..9c94782a 100644 --- a/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue +++ b/src/layouts/tpa-submit/contact-details-drawer/contact-details-drawer.vue @@ -79,13 +79,6 @@ export default { emailAddress, servicePhone, extension } = useMainStore().contactInfo; - console.log('Initial contact info loaded:', { - firstName, - lastName, - emailAddress, - servicePhone, - extension - }); return { isModalOpened: false, firstName, @@ -157,13 +150,6 @@ export default { emailAddress, servicePhone, extension } = this.mainStore.contactInfo; - console.log('Resetting form values to:', { - firstName, - lastName, - emailAddress, - servicePhone, - extension - }); this.firstName = firstName; this.lastName = lastName; this.emailAddress = emailAddress; diff --git a/src/store/index.js b/src/store/index.js index 3959bd62..dafc9402 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -2574,8 +2574,6 @@ export const useMainStore = defineStore({ updatePhoneNumbers(phoneNumbers) { const contact = this.order.contactInfo; - console.log('Updating phone numbers with:', phoneNumbers); - console.log('Current contact info before update:', contact); contact.homePhone = phoneNumbers.home !== undefined ? phoneNumbers.home : contact.homePhone; contact.alternativePhone = phoneNumbers.alternative !== undefined ? phoneNumbers.alternative : contact.alternativePhone; contact.servicePhone = phoneNumbers.service !== undefined ? phoneNumbers.service : contact.servicePhone; From d4530ca4cf229f48b5dd85b08d9dbb0a8582de67 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Wed, 21 Jan 2026 17:17:20 -0500 Subject: [PATCH 4/9] Add extension to save/load session --- src/layouts/tpa-submit/tpa-submit.spec.js | 47 +++++++++++++++++++++++ src/layouts/tpa-submit/tpa-submit.vue | 6 ++- src/store/index.js | 5 ++- 3 files changed, 56 insertions(+), 2 deletions(-) diff --git a/src/layouts/tpa-submit/tpa-submit.spec.js b/src/layouts/tpa-submit/tpa-submit.spec.js index 6470f241..ab42d2f5 100644 --- a/src/layouts/tpa-submit/tpa-submit.spec.js +++ b/src/layouts/tpa-submit/tpa-submit.spec.js @@ -418,6 +418,53 @@ describe('tpa-submit', () => { expect(contactInfoSection.lines[0]).toContain(expectedPhone); expect(toDisplayPhoneNumber).toHaveBeenCalledWith(servicePhone); }); + test('contact info section has expected content with extension', async () => { + // Arrange + const firstName = 'Jones'; + const lastName = 'Eddison'; + const emailAddress = 'myname@gmail.com'; + const servicePhone = '0001112222'; + const extension = '12345'; + const providerCompanyName = 'Some Provider LLC'; + const initialStore = { + order: { + serviceLocation: { + provider: { + companyName: providerCompanyName + } + }, + contactInfo: { + firstName, + lastName, + emailAddress, + servicePhone, + extension + } + } + }; + const { wrapper } = getMountedComponent(initialStore); + const expectedEmail = emailAddress; + const expectedPhone = 'some value returned'; + toDisplayPhoneNumber.mockImplementation((number) => (number === servicePhone ? expectedPhone : '')); + const contactInfoSectionIndex = 1; + wrapper.vm.getCmsContent.mockImplementation(() => '{custom:contactPhone} or {custom:contactEmail}'); + + // Act + await tpaSubmit.beforeRouteEnter.call( + wrapper.vm, + { query: { issPage: 'tpa-submit' } }, + undefined, + (c) => c(wrapper.vm) + ); + wrapper.vm.setSections(); + + // Assert + const contactInfoSection = wrapper.vm.sections[contactInfoSectionIndex]; + expect(contactInfoSection.lines[0]).toContain(expectedEmail); + expect(contactInfoSection.lines[0]).toContain(expectedPhone); + expect(contactInfoSection.lines[0]).toContain(`Ext. ${extension}`); + expect(toDisplayPhoneNumber).toHaveBeenCalledWith(servicePhone); + }); }); describe('computed', () => { test.each([ diff --git a/src/layouts/tpa-submit/tpa-submit.vue b/src/layouts/tpa-submit/tpa-submit.vue index ff3824bc..eba5129a 100644 --- a/src/layouts/tpa-submit/tpa-submit.vue +++ b/src/layouts/tpa-submit/tpa-submit.vue @@ -275,9 +275,13 @@ export default { return this.mainStore.hasRecalibrationPart; }, customValueMap() { + let contactPhone = toDisplayPhoneNumber(this.mainStore.contactInfo.servicePhone); + if (this.mainStore.contactInfo.extension) { + contactPhone += ` Ext. ${this.mainStore.contactInfo.extension}`; + } return { glassShop: this.getPreferredShopTitle, - contactPhone: toDisplayPhoneNumber(this.mainStore.contactInfo.servicePhone), + contactPhone: contactPhone, contactEmail: this.mainStore.contactInfo.emailAddress } } diff --git a/src/store/index.js b/src/store/index.js index dafc9402..9f710b03 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1457,7 +1457,7 @@ export const useMainStore = defineStore({ emailAddress: contactInfo.emailAddress || customer.emailAddress, firstName: contactInfo.firstName || customer.firstName, lastName: contactInfo.lastName || customer.lastName, - homePhone: contactInfo.homePhone, + homePhone: contactInfo.extension ? contactInfo.servicePhone + contactInfo.extension : contactInfo.homePhone, servicePhone: contactInfo.servicePhone, alternativePhone: contactInfo.alternativePhone, isSmsOptIn: contactInfo.requestTextUpdates ?? false @@ -1592,6 +1592,7 @@ export const useMainStore = defineStore({ order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; order.contactInfo.homePhone = data?.customer?.homePhone; + order.contactInfo.extension = data?.customer?.homePhone?.length > 10 ? data.customer.homePhone.slice(10) : ''; order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn; @@ -1660,6 +1661,7 @@ export const useMainStore = defineStore({ order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; order.contactInfo.homePhone = data?.customer?.homePhone; + order.contactInfo.extension = data?.customer?.homePhone?.length > 10 ? data.customer.homePhone.slice(10) : ''; order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn; @@ -2097,6 +2099,7 @@ export const useMainStore = defineStore({ this.order.contactInfo.homePhone = null; this.order.contactInfo.alternativePhone = null; this.order.contactInfo.servicePhone = null; + this.order.contactInfo.extension = null; this.order.contactInfo.requestTextUpdates = false; this.order.contactInfo.notesForTechnician = ''; }, From 36771caca30d5acd14a3e0968b8662c8476b6603 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Wed, 21 Jan 2026 17:24:34 -0500 Subject: [PATCH 5/9] Properly split extension from homePhone on load --- src/store/index.js | 20 ++++++++++++++++---- 1 file changed, 16 insertions(+), 4 deletions(-) diff --git a/src/store/index.js b/src/store/index.js index 9f710b03..15b51802 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1591,8 +1591,14 @@ export const useMainStore = defineStore({ order.contactInfo.firstName = data?.customer?.firstName; order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; - order.contactInfo.homePhone = data?.customer?.homePhone; - order.contactInfo.extension = data?.customer?.homePhone?.length > 10 ? data.customer.homePhone.slice(10) : ''; + if (data?.customer?.homePhone?.length > 10) { + order.contactInfo.extension = data.customer.homePhone.slice(10); + order.contactInfo.homePhone = data.customer.homePhone.slice(0, 10); + } + else { + order.contactInfo.homePhone = data?.customer?.homePhone; + order.contactInfo.extension = ''; + } order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn; @@ -1660,8 +1666,14 @@ export const useMainStore = defineStore({ order.contactInfo.firstName = data?.customer?.firstName; order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; - order.contactInfo.homePhone = data?.customer?.homePhone; - order.contactInfo.extension = data?.customer?.homePhone?.length > 10 ? data.customer.homePhone.slice(10) : ''; + if (data?.customer?.homePhone?.length > 10) { + order.contactInfo.extension = data.customer.homePhone.slice(10); + order.contactInfo.homePhone = data.customer.homePhone.slice(0, 10); + } + else { + order.contactInfo.homePhone = data?.customer?.homePhone; + order.contactInfo.extension = ''; + } order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn; From 7965fe9137f89d279e7dfdfe7683480e97acbcf8 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Thu, 22 Jan 2026 09:13:46 -0500 Subject: [PATCH 6/9] Fix issues raised by bugbot --- src/layouts/tpa-submit/tpa-submit.vue | 2 +- src/store/index.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/layouts/tpa-submit/tpa-submit.vue b/src/layouts/tpa-submit/tpa-submit.vue index eba5129a..85a85d52 100644 --- a/src/layouts/tpa-submit/tpa-submit.vue +++ b/src/layouts/tpa-submit/tpa-submit.vue @@ -282,7 +282,7 @@ export default { return { glassShop: this.getPreferredShopTitle, contactPhone: contactPhone, - contactEmail: this.mainStore.contactInfo.emailAddress + contactEmail: this.mainStore.contactInfo.emailAddress ?? '' } } }, diff --git a/src/store/index.js b/src/store/index.js index 15b51802..9923c99a 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1457,7 +1457,7 @@ export const useMainStore = defineStore({ emailAddress: contactInfo.emailAddress || customer.emailAddress, firstName: contactInfo.firstName || customer.firstName, lastName: contactInfo.lastName || customer.lastName, - homePhone: contactInfo.extension ? contactInfo.servicePhone + contactInfo.extension : contactInfo.homePhone, + homePhone: contactInfo.extension && contactInfo.homePhone ? contactInfo.homePhone + contactInfo.extension : contactInfo.homePhone, servicePhone: contactInfo.servicePhone, alternativePhone: contactInfo.alternativePhone, isSmsOptIn: contactInfo.requestTextUpdates ?? false From 09f6d39f18e8da73d7419ef65d2220b74463c8d4 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Thu, 22 Jan 2026 09:43:47 -0500 Subject: [PATCH 7/9] Simplify home phone/extension slicing --- src/store/index.js | 20 ++++---------------- 1 file changed, 4 insertions(+), 16 deletions(-) diff --git a/src/store/index.js b/src/store/index.js index 9923c99a..2bc88be8 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1591,14 +1591,8 @@ export const useMainStore = defineStore({ order.contactInfo.firstName = data?.customer?.firstName; order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; - if (data?.customer?.homePhone?.length > 10) { - order.contactInfo.extension = data.customer.homePhone.slice(10); - order.contactInfo.homePhone = data.customer.homePhone.slice(0, 10); - } - else { - order.contactInfo.homePhone = data?.customer?.homePhone; - order.contactInfo.extension = ''; - } + order.contactInfo.extension = data.customer.homePhone?.slice(10); + order.contactInfo.homePhone = data.customer.homePhone?.slice(0, 10); order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn; @@ -1666,14 +1660,8 @@ export const useMainStore = defineStore({ order.contactInfo.firstName = data?.customer?.firstName; order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; - if (data?.customer?.homePhone?.length > 10) { - order.contactInfo.extension = data.customer.homePhone.slice(10); - order.contactInfo.homePhone = data.customer.homePhone.slice(0, 10); - } - else { - order.contactInfo.homePhone = data?.customer?.homePhone; - order.contactInfo.extension = ''; - } + order.contactInfo.extension = data.customer.homePhone?.slice(10); + order.contactInfo.homePhone = data.customer.homePhone?.slice(0, 10); order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn; From c0672a0abc9cd1d49fa23fd64d4290a62fef898f Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Thu, 22 Jan 2026 10:04:21 -0500 Subject: [PATCH 8/9] bugfix --- src/store/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/store/index.js b/src/store/index.js index 2bc88be8..ba0bae56 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1591,8 +1591,8 @@ export const useMainStore = defineStore({ order.contactInfo.firstName = data?.customer?.firstName; order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; - order.contactInfo.extension = data.customer.homePhone?.slice(10); - order.contactInfo.homePhone = data.customer.homePhone?.slice(0, 10); + order.contactInfo.extension = data?.customer?.homePhone?.slice(10); + order.contactInfo.homePhone = data?.customer?.homePhone?.slice(0, 10); order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn; From 58f55554f5e25c2b77fd6f6f7a00864d4bab4217 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Thu, 22 Jan 2026 10:22:09 -0500 Subject: [PATCH 9/9] bugfix --- src/store/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/store/index.js b/src/store/index.js index ba0bae56..d27f0f2d 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1660,8 +1660,8 @@ export const useMainStore = defineStore({ order.contactInfo.firstName = data?.customer?.firstName; order.contactInfo.lastName = data?.customer?.lastName; order.contactInfo.emailAddress = data?.customer?.emailAddress; - order.contactInfo.extension = data.customer.homePhone?.slice(10); - order.contactInfo.homePhone = data.customer.homePhone?.slice(0, 10); + order.contactInfo.extension = data?.customer?.homePhone?.slice(10); + order.contactInfo.homePhone = data?.customer?.homePhone?.slice(0, 10); order.contactInfo.servicePhone = data?.customer?.servicePhone; order.contactInfo.alternativePhone = data?.customer?.alternativePhone; order.contactInfo.requestTextUpdates = data?.customer?.isSmsOptIn;