From 56422e5459cceda119e0e9e25df05aac326117bd Mon Sep 17 00:00:00 2001 From: Katie Kroell Date: Thu, 19 Feb 2026 16:14:40 -0500 Subject: [PATCH 01/18] modal updates WIP --- src/digital-components/modal/modal.vue | 46 ++++++------------- .../content-group-modal.vue | 2 +- 2 files changed, 16 insertions(+), 32 deletions(-) diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue index d4be7797..1f410236 100644 --- a/src/digital-components/modal/modal.vue +++ b/src/digital-components/modal/modal.vue @@ -13,14 +13,13 @@ }">
- - + Date: Thu, 26 Feb 2026 13:46:21 -0500 Subject: [PATCH 09/18] ADAS recal modal --- .../coverage-statement/coverage-statement.vue | 9 +--- .../recal-modal/recal-modal.vue | 51 +++++++++++++++---- 2 files changed, 43 insertions(+), 17 deletions(-) diff --git a/src/layouts/coverage-statement/coverage-statement.vue b/src/layouts/coverage-statement/coverage-statement.vue index 3cc519bf..a79c11fa 100644 --- a/src/layouts/coverage-statement/coverage-statement.vue +++ b/src/layouts/coverage-statement/coverage-statement.vue @@ -10,7 +10,7 @@ cmsWidgetName="SiteHeaderWidget" />
-
-
+ ref="recalModal" + :footerButtonText="modalCloseButtonText" + @footerButtonEvent="footerButtonClick">
@@ -9,7 +11,7 @@ :src="modalImage" class="mw-100 d-flex" alt="" /> -
+
@@ -34,15 +36,18 @@ export default { }, modalImage() { return this.getCmsContent('RecalModal', 'Image'); + }, + modalCloseButtonText() { + return this.getCmsContent('RecalModal', 'FooterText'); } }, methods: { - // openModal() { - // this.$refs['RecalModal'].openModal(); - // }, - // closeModal() { - // this.$refs['RecalModal'].closeModal(); - // }, + openModal() { + this.$refs.recalModal.openModal(); + }, + footerButtonClick() { + this.$refs.recalModal.closeModal(); + }, } }; @@ -50,8 +55,34 @@ export default { From ae76220e847a99b012891dba87612a011fa3092e Mon Sep 17 00:00:00 2001 From: Katie Kroell Date: Thu, 26 Feb 2026 14:15:33 -0500 Subject: [PATCH 10/18] update --- src/layouts/coverage-statement/recal-modal/recal-modal.vue | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/layouts/coverage-statement/recal-modal/recal-modal.vue b/src/layouts/coverage-statement/recal-modal/recal-modal.vue index d7b82c09..6419ff33 100644 --- a/src/layouts/coverage-statement/recal-modal/recal-modal.vue +++ b/src/layouts/coverage-statement/recal-modal/recal-modal.vue @@ -39,6 +39,9 @@ export default { }, modalCloseButtonText() { return this.getCmsContent('RecalModal', 'FooterText'); + }, + vehicleMake() { + return this.mainStore.order.vehicle.make.toUpperCase(); } }, methods: { From 2f8650174d2ab216851ead5b55046b5818453510 Mon Sep 17 00:00:00 2001 From: Katie Kroell Date: Thu, 26 Feb 2026 14:47:14 -0500 Subject: [PATCH 11/18] updates/remove unneeded code --- .../recal-modal/recal-modal.vue | 2 +- .../provider-preference.vue | 21 ++++++------------- 2 files changed, 7 insertions(+), 16 deletions(-) diff --git a/src/layouts/coverage-statement/recal-modal/recal-modal.vue b/src/layouts/coverage-statement/recal-modal/recal-modal.vue index 6419ff33..0edfcdae 100644 --- a/src/layouts/coverage-statement/recal-modal/recal-modal.vue +++ b/src/layouts/coverage-statement/recal-modal/recal-modal.vue @@ -26,7 +26,7 @@ export default { }, computed: { modalBodyText() { - return this.getCmsContent('RecalModal', 'BodyText'); + return this.getCmsContent('RecalModal', 'BodyText').replaceAll('{custom:vehicleMake}', this.vehicleMake); }, modalHeaderText() { return this.getCmsContent('RecalModal', 'HeaderText'); diff --git a/src/layouts/provider-preference/provider-preference.vue b/src/layouts/provider-preference/provider-preference.vue index 27e38ff8..21a6bc20 100644 --- a/src/layouts/provider-preference/provider-preference.vue +++ b/src/layouts/provider-preference/provider-preference.vue @@ -58,11 +58,11 @@ // Import Supporting Files import { fetchCmsContentForPage, + processIfStatements, setupModalLinks } from '@/helpers/cms-content-helper'; import settleAllPromises from '@/helpers/layout-helper'; import errorMessages from '@/constants/error-messages'; -import buttonQuestion from '@/digital-components/button-question/button-question.vue'; import showIssLoadingModal from '@/helpers/loading-modal-helper'; import bailoutMessage from '@/constants/bailoutMessage'; import baseFormMixin from '@/mixins/base-form-mixin'; @@ -133,26 +133,14 @@ export default { return this.getCmsContent('ScheduleWithSafeliteText', 'BodyText'); }, scheduleWithOtherText() { - return this.getCmsContent('ScheduleWithOtherText', 'BodyText'); + const text = this.getCmsContent('ScheduleWithOtherText', 'BodyText'); + return processIfStatements(text, 'custom', this.getStateSpecificText); } }, mounted() { setupModalLinks(this); }, methods: { - getHeaderTextFromCms(cmsWidgetName) { - const headerText = this.getCmsContent(cmsWidgetName, 'HeaderText'); - return headerText?.replace( - '{custom:SafeliteLogo}', - "" - ); - }, - getSubheaderTextFromCms(cmsWidgetName) { - return this.getCmsContent(cmsWidgetName, 'SubheaderText'); - }, - getBodyTextFromCms(cmsWidgetName) { - return this.getCmsContent(cmsWidgetName, 'BodyText'); - }, arePagePrerequisiteValid() { return true; }, @@ -191,6 +179,9 @@ export default { }, openStateSteeringModal() { this.$refs[STEERING_MODAL_REF_NAME].openModal(); + }, + getStateSpecificText(value) { + return this.mainStore.order.customer.address.state?.toLowerCase() === value?.toLowerCase(); } } }; From 216815c853d04c00c4477bd65b9c55bfebb088d8 Mon Sep 17 00:00:00 2001 From: Katie Kroell Date: Thu, 26 Feb 2026 15:33:00 -0500 Subject: [PATCH 12/18] move recal modal to iss components --- .../recal-modal/recal-modal.vue | 1 + src/layouts/coverage-statement/coverage-statement.vue | 2 +- .../provider-preference/provider-preference.spec.js | 5 +++-- .../service-location/service-location.spec.js | 2 +- .../schedule-page/service-location/service-location.vue | 9 ++++----- 5 files changed, 10 insertions(+), 9 deletions(-) rename src/{layouts/coverage-statement => iss-components}/recal-modal/recal-modal.vue (98%) diff --git a/src/layouts/coverage-statement/recal-modal/recal-modal.vue b/src/iss-components/recal-modal/recal-modal.vue similarity index 98% rename from src/layouts/coverage-statement/recal-modal/recal-modal.vue rename to src/iss-components/recal-modal/recal-modal.vue index 0edfcdae..fc5df201 100644 --- a/src/layouts/coverage-statement/recal-modal/recal-modal.vue +++ b/src/iss-components/recal-modal/recal-modal.vue @@ -84,6 +84,7 @@ export default { p { strong { font-weight: 600; + color: $black; } } } diff --git a/src/layouts/coverage-statement/coverage-statement.vue b/src/layouts/coverage-statement/coverage-statement.vue index a79c11fa..4e31fa37 100644 --- a/src/layouts/coverage-statement/coverage-statement.vue +++ b/src/layouts/coverage-statement/coverage-statement.vue @@ -121,7 +121,7 @@ import textLink from '@/ux-components/text-link/text-link.vue'; import buttonMain from '@/ux-components/button-main/button-main.vue'; import siteFooter from '@/iss-components/site-footer/site-footer.vue'; import afterpayModalBanner from '@/layouts/coverage-statement/afterpay-modal-banner/afterpay-modal-banner.vue'; -import recalModal from '@/layouts/coverage-statement/recal-modal/recal-modal.vue'; +import recalModal from '@/iss-components/recal-modal/recal-modal.vue'; // Import Supporting Files import { diff --git a/src/layouts/provider-preference/provider-preference.spec.js b/src/layouts/provider-preference/provider-preference.spec.js index 0d93ed3a..d00c9183 100644 --- a/src/layouts/provider-preference/provider-preference.spec.js +++ b/src/layouts/provider-preference/provider-preference.spec.js @@ -2,7 +2,7 @@ import ProviderPreference from '@/layouts/provider-preference/provider-preferenc import { shallowMount } from '@vue/test-utils'; import settleAllPromises from '@/helpers/layout-helper.js'; -import { fetchCmsContentForPage } from '@/helpers/cms-content-helper'; +import { fetchCmsContentForPage, processIfStatements } from '@/helpers/cms-content-helper'; import { getMountOptions } from '@/helpers/unit-test-helper.js'; import { useMainStore } from '@/store'; import navigationScenarios from '@/router/router-constants/navigation-scenarios'; @@ -13,7 +13,8 @@ jest.mock('@/helpers/layout-helper.js', () => jest.fn()); // Mock fetchCmsContentForPage jest.mock('@/helpers/cms-content-helper', () => ({ fetchCmsContentForPage: jest.fn(), - setupModalLinks: jest.fn() + setupModalLinks: jest.fn(), + processIfStatements: jest.fn() })); /** @ignore */ diff --git a/src/layouts/schedule-page/service-location/service-location.spec.js b/src/layouts/schedule-page/service-location/service-location.spec.js index 6a50fe05..cda30da8 100644 --- a/src/layouts/schedule-page/service-location/service-location.spec.js +++ b/src/layouts/schedule-page/service-location/service-location.spec.js @@ -124,7 +124,7 @@ const mountOptions = { alert: true, textBlock: true, appointmentTypeQuestion: true, - contentGroupModal: true, + recalModal: true, siteFooter: true, siteHeader: true, siteSubHeader: true, diff --git a/src/layouts/schedule-page/service-location/service-location.vue b/src/layouts/schedule-page/service-location/service-location.vue index 601a1e5d..cbce93d2 100644 --- a/src/layouts/schedule-page/service-location/service-location.vue +++ b/src/layouts/schedule-page/service-location/service-location.vue @@ -117,9 +117,8 @@ cmsWidgetName="MobileFeeDisclaimerWidget" typeStyle="disclaimer" />
-
@@ -140,10 +139,10 @@ import alert from '@/ux-components/alert/alert.vue'; import textBlock from '@/digital-components/text-block/text-block.vue'; import appointmentTypeQuestion from '@/layouts/schedule-page/service-location/appointment-type-question/appointment-type-question.vue'; import baseFormMixin from '@/mixins/base-form-mixin'; -import contentGroupModal from '@/iss-components/content-group-modal/content-group-modal.vue'; import shopAddress from '@/layouts/schedule-page/service-location/shop-address/shop-address.vue'; import serviceZipQuestion from '@/layouts/schedule-page/service-location/service-zip-question/service-zip-question.vue'; import widgetFields from '@/constants/cms-widget-fields'; +import recalModal from '@/iss-components/recal-modal/recal-modal.vue'; const RECAL_MODAL_REF_NAME = 'RecalModal'; @@ -153,9 +152,9 @@ export default { alert, textBlock, appointmentTypeQuestion, - contentGroupModal, shopAddress, - serviceZipQuestion + serviceZipQuestion, + recalModal }, mixins: [baseFormMixin], emits: ['appointment-type-changed', 'city-updated', 'clear-mobile-data', 'in-shop-zip-updated', 'mobile-zip-updated', 'provider-changed'], From 8db41a1e102507cc9b1f2ff7dafb61515ff4c8e1 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Fri, 27 Feb 2026 11:21:57 -0500 Subject: [PATCH 13/18] INSR-8561: Fix default "enter" key behavior This specifically fixes an issue where hitting "enter" on the welcome page was triggering the "finish filing existing claim" button, even in cases where that modal was not visible. --- src/iss-components/site-footer/site-footer.vue | 3 ++- src/ux-components/button-main/button-main.vue | 4 +++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/src/iss-components/site-footer/site-footer.vue b/src/iss-components/site-footer/site-footer.vue index a694015e..386147aa 100644 --- a/src/iss-components/site-footer/site-footer.vue +++ b/src/iss-components/site-footer/site-footer.vue @@ -22,8 +22,9 @@ 'hide-button': isForwardButtonHidden }" :aria-disabled="disableForwardAction || isForwardActionDisabled" - :isDisabled="disableForwardAction || isForwardActionDisabled" + :isDisabled="disableForwardAction || isForwardActionDisabled || isForwardButtonHidden" data-test-id="site-footer-main-button" + buttonType="submit" @clickEvent="buttonClick" />
{{ buttonText }} @@ -21,7 +22,8 @@ export default { isDisabled: Boolean, isOutline: Boolean, pushToGA: Boolean, - canOverride: { type: Boolean, required: false, default: true } + canOverride: { type: Boolean, required: false, default: true }, + buttonType: { type: String, required: false, default: 'button' } }, emits: ['click-event'], computed: { From 2c810282fda7e926471f96b154215d60f27341c4 Mon Sep 17 00:00:00 2001 From: Katie Kroell Date: Fri, 27 Feb 2026 11:57:18 -0500 Subject: [PATCH 14/18] copilot fixes --- src/digital-components/modal/modal.vue | 3 ++- src/iss-components/recal-modal/recal-modal.vue | 16 +++++++++++----- .../cancel-claim-modal/cancel-claim-modal.vue | 2 +- 3 files changed, 14 insertions(+), 7 deletions(-) diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue index 6ad8bb08..83e07ccb 100644 --- a/src/digital-components/modal/modal.vue +++ b/src/digital-components/modal/modal.vue @@ -45,6 +45,7 @@ class="w-100" :buttonText="footerButtonText" pushToGA + :variant="buttonVariant" :class="[ (isButtonDisabled || isFooterButtonDisabled) && 'form-test-invalid' @@ -55,7 +56,7 @@ class="mt-4 mb-0" linkType="text" text="Close window" - href="#" + href="#!" @click="closeModal" />
diff --git a/src/iss-components/recal-modal/recal-modal.vue b/src/iss-components/recal-modal/recal-modal.vue index fc5df201..c6638b14 100644 --- a/src/iss-components/recal-modal/recal-modal.vue +++ b/src/iss-components/recal-modal/recal-modal.vue @@ -24,21 +24,27 @@ export default { components: { modal }, + props: { + cmsWidgetName: { + type: String, + default: 'RecalModal' + } + }, computed: { modalBodyText() { - return this.getCmsContent('RecalModal', 'BodyText').replaceAll('{custom:vehicleMake}', this.vehicleMake); + return this.getCmsContent(this.cmsWidgetName, 'BodyText').replaceAll('{custom:vehicleMake}', this.vehicleMake); }, modalHeaderText() { - return this.getCmsContent('RecalModal', 'HeaderText'); + return this.getCmsContent(this.cmsWidgetName, 'HeaderText'); }, modalFooterText() { - return this.getCmsContent('RecalModal', 'FooterText'); + return this.getCmsContent(this.cmsWidgetName, 'FooterText'); }, modalImage() { - return this.getCmsContent('RecalModal', 'Image'); + return this.getCmsContent(this.cmsWidgetName, 'Image'); }, modalCloseButtonText() { - return this.getCmsContent('RecalModal', 'FooterText'); + return this.getCmsContent(this.cmsWidgetName, 'FooterText'); }, vehicleMake() { return this.mainStore.order.vehicle.make.toUpperCase(); diff --git a/src/layouts/coverage-statement/cancel-claim-modal/cancel-claim-modal.vue b/src/layouts/coverage-statement/cancel-claim-modal/cancel-claim-modal.vue index 57bae07e..5aa96972 100644 --- a/src/layouts/coverage-statement/cancel-claim-modal/cancel-claim-modal.vue +++ b/src/layouts/coverage-statement/cancel-claim-modal/cancel-claim-modal.vue @@ -21,7 +21,7 @@ class="cancel-link" linkType="text" text="No, I want to cancel" - href="#" + href="#!" @clickEvent="cancelClaimConfirmation"> From bf93a57dce8efd86ef846bf7144e58b347216b47 Mon Sep 17 00:00:00 2001 From: Katie Kroell Date: Fri, 27 Feb 2026 11:58:00 -0500 Subject: [PATCH 15/18] missed one --- src/iss-components/recal-modal/recal-modal.vue | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/iss-components/recal-modal/recal-modal.vue b/src/iss-components/recal-modal/recal-modal.vue index c6638b14..311c4f82 100644 --- a/src/iss-components/recal-modal/recal-modal.vue +++ b/src/iss-components/recal-modal/recal-modal.vue @@ -37,9 +37,6 @@ export default { modalHeaderText() { return this.getCmsContent(this.cmsWidgetName, 'HeaderText'); }, - modalFooterText() { - return this.getCmsContent(this.cmsWidgetName, 'FooterText'); - }, modalImage() { return this.getCmsContent(this.cmsWidgetName, 'Image'); }, From e1e7ee086e42e3b6dca213042e8454bfec112e8d Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Fri, 27 Feb 2026 12:49:52 -0500 Subject: [PATCH 16/18] Remove redundant aria-disabled --- src/iss-components/site-footer/site-footer.vue | 1 - 1 file changed, 1 deletion(-) diff --git a/src/iss-components/site-footer/site-footer.vue b/src/iss-components/site-footer/site-footer.vue index 386147aa..cd2fc531 100644 --- a/src/iss-components/site-footer/site-footer.vue +++ b/src/iss-components/site-footer/site-footer.vue @@ -21,7 +21,6 @@ 'form-test-invalid': (disableForwardAction || isForwardActionDisabled), 'hide-button': isForwardButtonHidden }" - :aria-disabled="disableForwardAction || isForwardActionDisabled" :isDisabled="disableForwardAction || isForwardActionDisabled || isForwardButtonHidden" data-test-id="site-footer-main-button" buttonType="submit" From 1cd6bdc43292ae6e2b58a61fc0f153f7adaf857d Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Fri, 27 Feb 2026 12:58:13 -0500 Subject: [PATCH 17/18] Add validator and unit tests related to button type --- .../button-main/button-main.spec.js | 33 +++++++++++++++++++ src/ux-components/button-main/button-main.vue | 2 +- 2 files changed, 34 insertions(+), 1 deletion(-) diff --git a/src/ux-components/button-main/button-main.spec.js b/src/ux-components/button-main/button-main.spec.js index c6825826..1f2b3863 100644 --- a/src/ux-components/button-main/button-main.spec.js +++ b/src/ux-components/button-main/button-main.spec.js @@ -192,4 +192,37 @@ describe('buttonMain.vue', () => { // Expect expect(spy).not.toHaveBeenCalled(); }); + + describe('Button Types', () => { + it('Should set button type to submit', async () => { + // Act + const wrapper = shallowMount( + buttonMain, + setupMocks({ + propsData: { + buttonType: 'submit' + } + }) + ); + + // Assert + const button = wrapper.find('button'); + + // Expect + expect(button.attributes('type')).toEqual('submit'); + }); + it('Should default button type to button', async () => { + // Act + const wrapper = shallowMount( + buttonMain, + setupMocks() + ); + + // Assert + const button = wrapper.find('button'); + + // Expect + expect(button.attributes('type')).toEqual('button'); + }); + }); }); diff --git a/src/ux-components/button-main/button-main.vue b/src/ux-components/button-main/button-main.vue index 7ffb7759..e88a4b74 100644 --- a/src/ux-components/button-main/button-main.vue +++ b/src/ux-components/button-main/button-main.vue @@ -23,7 +23,7 @@ export default { isOutline: Boolean, pushToGA: Boolean, canOverride: { type: Boolean, required: false, default: true }, - buttonType: { type: String, required: false, default: 'button' } + buttonType: { type: String, required: false, default: 'button', validator: (val) => ['button', 'submit', 'reset'].includes(val) } }, emits: ['click-event'], computed: { From f8aa275aac337b50c580c18499d0e9f631b91214 Mon Sep 17 00:00:00 2001 From: Alex Humphries Date: Fri, 27 Feb 2026 13:20:38 -0500 Subject: [PATCH 18/18] INSR-8544: Fix some error/alert differences --- src/constants/error-messages.js | 2 +- src/layouts/vehicle-damage/vehicle-damage.vue | 3 ++- .../vehicle-damage/windshield-options/windshield-options.vue | 3 ++- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/src/constants/error-messages.js b/src/constants/error-messages.js index 62e79340..2fa565e2 100644 --- a/src/constants/error-messages.js +++ b/src/constants/error-messages.js @@ -10,7 +10,7 @@ const errorMessages = Object.freeze({ PASSENGER_SIDE_OPTIONS_REQUIRED: 'Please select window', WINDSHIELD_DAMAGE_TYPE_REQUIRED: 'Please select windshield damage', WINDSHIELD_CHIP_COUNT_REQUIRED: 'Please select chip(s)', - WINDSHIELD_REPLACE_OPTIONS_REQUIRED: 'Please select windshield part', + WINDSHIELD_REPLACE_OPTIONS_REQUIRED: 'Select all windshield parts that need to be replaced', REPLACE_OPTIONS_REQUIRED: 'Please select rear window type', STREET_ADDRESS_REQUIRED: 'Street Address is required.', CITY_REQUIRED: 'City is required.', diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index a27e3655..47f7463d 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -46,7 +46,8 @@ class="my-5" cmsWidgetName="HasReplacementConflict" alertClass="alert-danger" - :isDismissible="false" /> + :isDismissible="false" + :isCollapsible="true" />
diff --git a/src/layouts/vehicle-damage/windshield-options/windshield-options.vue b/src/layouts/vehicle-damage/windshield-options/windshield-options.vue index bee1bc28..dc529605 100644 --- a/src/layouts/vehicle-damage/windshield-options/windshield-options.vue +++ b/src/layouts/vehicle-damage/windshield-options/windshield-options.vue @@ -34,7 +34,8 @@ class="mt-5" cmsWidgetName="SplitSingleConflict" alertClass="alert-danger" - :isDismissible="false" /> + :isDismissible="false" + :isCollapsible="true" />