Tidying coverage statement again

src/constants/coverage-statement-page-variations.js

@@ -0,0 +1,8 @@
+const coverageStatementPageVariations = Object.freeze({
+    DEDUCTIBLE: 0,
+    ITAC: 1,
+    NO_COMP: 2,
+    UNVERIFIED: 3
+});
+
+export default coverageStatementPageVariations;

src/iss-components/cart-dropdown/cart-dropdown.vue

@@ -212,6 +212,7 @@ export default {
         baseServicePrice() {
             return getPriceOfLineItems(this.baseServiceLineItems) ?? 0;
         },
+        // TODO update tests
         isUnverified() {
             return (useMainStore().isNoComp && !useMainStore().issConfig.enableNoCompQuote)
                 || (!useMainStore().isNoComp && !useMainStore().isITAC
@@ -248,7 +249,7 @@ export default {
 
             let result = 0;
 
-            if (useMainStore().payment.insuranceCoverage.isVerified) {
+            if (!this.isUnverified) {
                 if (useMainStore().isITAC || useMainStore().isNoComp) {
                     result += sumTax(this.baseServiceLineItems);
                 } else {
@@ -413,10 +414,6 @@ export default {
         },
         getDisplayed(amount) {
             return this.isUnverified
-                // && ((useMainStore().isNoComp && !useMainStore().issConfig.enableNoCompQuote)
-                //     || (!useMainStore().isNoComp && !useMainStore().policy.isITAC))
-                // && !useMainStore().isNoComp
-                // && !useMainStore().isITAC
                 ? VERIFYING_COVERAGE
                 : formatAmountInDollars(amount);
         },

src/layouts/coverage-statement/coverage-statement.spec.js

@@ -10,7 +10,7 @@ import navigationScenarios from '@/router/router-constants/navigation-scenarios.
 import { getRandomString, getRandomInt } from '@/helpers/data-generation.js';
 import settleAllPromises from '@/helpers/layout-helper.js';
 import { fetchCmsContentForPage } from '@/helpers/cms-content-helper';
-import { useMainStore } from '@/store/index.js';
+import { useMainStore, getDefaultState } from '@/store';
 import getPriceOfLineItems from '@/helpers/price-calculator.js';
 
 jest.mock('@/helpers/layout-helper.js', () => jest.fn());
@@ -90,6 +90,14 @@ function getMountedComponent(mainInitialState = {}, initialData = {}, methodToRu
     return { wrapper };
 }
 
+beforeEach(() => {
+    const store = useMainStore();
+    const defaultState = getDefaultState();
+    Object.keys(defaultState).forEach((key) => {
+        store[key] = defaultState[key];
+    });
+});
+
 describe('coverageStatement.vue-working', () => {
     test('returns the initial data', () => {
         // Arrange
@@ -164,43 +172,67 @@ describe('coverageStatement.vue-working', () => {
     });
     describe('Computed', () => {
         describe('verifiedNoComp', () => {
-            test.each([true, false])('returns false when policyLookupSuccessful false', (isNoComp) => {
+            describe('isNoCompQuoteVisible true', () => {
-                // Arrange
+                const enableNoCompQuote = true;
-                const mainInitialState = {
+                test.each([true, false])('returns false when policyLookupSuccessful false', (isNoComp) => {
-                    order: {
+                    // Arrange
-                        policy: {
+                    const mainInitialState = {
-                            noCoverage: isNoComp,
+                        order: {
-                            policyLookupSuccessful: false
+                            policy: {
-                        }
+                                noCoverage: isNoComp,
-                    }
+                                policyLookupSuccessful: false
-                };
+                            }
-                const { wrapper } = getMountedComponent(mainInitialState);
+                        },
+                        issConfig: { enableNoCompQuote }
+                    };
+                    const { wrapper } = getMountedComponent(mainInitialState);
 
-                // Act
+                    // Act
-                const result = wrapper.vm.verifiedNoComp;
+                    const result = wrapper.vm.isNoCompQuoteVisible;
 
-                // Assert
+                    // Assert
-                expect(result).toBeFalsy();
+                    expect(result).toBeFalsy();
+                });
+                test.each([true, false])('returns false when isNoComp false', (policyLookupSuccessful) => {
+                    // Arrange
+                    const mainInitialState = {
+                        order: {
+                            policy: {
+                                noCoverage: false,
+                                policyLookupSuccessful
+                            }
+                        },
+                        issConfig: { enableNoCompQuote }
+                    };
+                    const { wrapper } = getMountedComponent(mainInitialState);
+
+                    // Act
+                    const result = wrapper.vm.isNoCompQuoteVisible;
+
+                    // Assert
+                    expect(result).toBeFalsy();
+                });
+                test('returns true when policyLookupSuccessful true, noCoverage true, and enableNoCompQuote true', () => {
+                    // Arrange
+                    const mainInitialState = {
+                        order: {
+                            policy: {
+                                noCoverage: true,
+                                policyLookupSuccessful: true
+                            }
+                        },
+                        issConfig: { enableNoCompQuote }
+                    };
+                    const { wrapper } = getMountedComponent(mainInitialState);
+
+                    // Act
+                    const result = wrapper.vm.isNoCompQuoteVisible;
+
+                    // Assert
+                    expect(result).toBeTruthy();
+                });
             });
-            test.each([true, false])('returns false when isNoComp false', (policyLookupSuccessful) => {
+            test('returns false when policyLookupSuccessful true, noCoverage true and enableNoCompQuote false', () => {
-                // Arrange
-                const mainInitialState = {
-                    order: {
-                        policy: {
-                            noCoverage: false,
-                            policyLookupSuccessful
-                        }
-                    }
-                };
-                const { wrapper } = getMountedComponent(mainInitialState);
-
-                // Act
-                const result = wrapper.vm.verifiedNoComp;
-
-                // Assert
-                expect(result).toBeFalsy();
-            });
-            test('returns true when policyLookupSuccessful true and policyLookupSuccessful true', () => {
                 // Arrange
                 const mainInitialState = {
                     order: {
@@ -208,18 +240,21 @@ describe('coverageStatement.vue-working', () => {
                             noCoverage: true,
                             policyLookupSuccessful: true
                         }
+                    },
+                    issConfig: {
+                        enableNoCompQuote: false
                     }
                 };
                 const { wrapper } = getMountedComponent(mainInitialState);
 
                 // Act
-                const result = wrapper.vm.verifiedNoComp;
+                const result = wrapper.vm.isNoCompQuoteVisible;
 
                 // Assert
-                expect(result).toBeTruthy();
+                expect(result).toBeFalsy();
             });
         });
-        describe('verifiedITAC', () => {
+        describe('isITACQuoteVisible', () => {
             const priceOfLineItems = 213;
             test.each([true, false])('returns false when policyLookupSuccessful false', (isNoComp) => {
                 // Arrange
@@ -236,7 +271,7 @@ describe('coverageStatement.vue-working', () => {
                 const { wrapper } = getMountedComponent(mainInitialState);
 
                 // Act
-                const result = wrapper.vm.verifiedITAC;
+                const result = wrapper.vm.isITACQuoteVisible;
 
                 // Assert
                 expect(result).toBeFalsy();
@@ -256,7 +291,7 @@ describe('coverageStatement.vue-working', () => {
                 const { wrapper } = getMountedComponent(mainInitialState);
 
                 // Act
-                const result = wrapper.vm.verifiedITAC;
+                const result = wrapper.vm.isITACQuoteVisible;
 
                 // Assert
                 expect(result).toBeFalsy();
@@ -281,7 +316,7 @@ describe('coverageStatement.vue-working', () => {
                 const { wrapper } = getMountedComponent(mainInitialState);
 
                 // Act
-                const result = wrapper.vm.verifiedITAC;
+                const result = wrapper.vm.isITACQuoteVisible;
 
                 // Assert
                 expect(result).toBeFalsy();
@@ -308,7 +343,7 @@ describe('coverageStatement.vue-working', () => {
                     const { wrapper } = getMountedComponent(mainInitialState);
 
                     // Act
-                    const result = wrapper.vm.verifiedITAC;
+                    const result = wrapper.vm.isITACQuoteVisible;
 
                     // Assert
                     expect(result).toBeFalsy();
@@ -329,13 +364,13 @@ describe('coverageStatement.vue-working', () => {
                 const { wrapper } = getMountedComponent(mainInitialState);
 
                 // Act
-                const result = wrapper.vm.verifiedITAC;
+                const result = wrapper.vm.isITACQuoteVisible;
 
                 // Assert
                 expect(result).toBeTruthy();
             });
         });
-        describe('verifiedDeductible', () => {
+        describe('isDeductibleVisible', () => {
             const servicePrice = 123;
             describe('claim registration required', () => {
                 const issConfig = { isClaimRegistrationRequired: true };
@@ -351,7 +386,7 @@ describe('coverageStatement.vue-working', () => {
                             },
                             policy: {
                                 noCoverage: false,
-                                policyLookupSuccessful: false
+                                policyLookupSuccessful: true
                             },
                             currentDeductible: servicePrice - 1
                         }
@@ -365,7 +400,7 @@ describe('coverageStatement.vue-working', () => {
                     const { wrapper } = getMountedComponent(mainInitialState);
 
                     // Act
-                    const result = wrapper.vm.verifiedDeductible;
+                    const result = wrapper.vm.isDeductibleVisible;
 
                     // Assert
                     expect(result).toBeFalsy();
@@ -377,7 +412,7 @@ describe('coverageStatement.vue-working', () => {
                     const { wrapper } = getMountedComponent(mainInitialState);
 
                     // Act
-                    const result = wrapper.vm.verifiedDeductible;
+                    const result = wrapper.vm.isDeductibleVisible;
 
                     // Assert
                     expect(result).toBeFalsy();
@@ -387,7 +422,7 @@ describe('coverageStatement.vue-working', () => {
                     const { wrapper } = getMountedComponent(verifiedDeductibleStoreState);
 
                     // Act
-                    const result = wrapper.vm.verifiedDeductible;
+                    const result = wrapper.vm.isDeductibleVisible;
 
                     // Assert
                     expect(result).toBeTruthy();
@@ -420,7 +455,7 @@ describe('coverageStatement.vue-working', () => {
                     const { wrapper } = getMountedComponent(mainInitialState);
 
                     // Act
-                    const result = wrapper.vm.verifiedDeductible;
+                    const result = wrapper.vm.isDeductibleVisible;
 
                     // Assert
                     expect(result).toBeFalsy();
@@ -430,7 +465,7 @@ describe('coverageStatement.vue-working', () => {
                     const { wrapper } = getMountedComponent(verifiedDeductibleStoreState);
 
                     // Act
-                    const result = wrapper.vm.verifiedDeductible;
+                    const result = wrapper.vm.isDeductibleVisible;
 
                     // Assert
                     expect(result).toBeTruthy();
@@ -459,7 +494,7 @@ describe('coverageStatement.vue-working', () => {
                 const { wrapper } = getMountedComponent(storeState);
 
                 // Act
-                const result = wrapper.vm.verifiedDeductible;
+                const result = wrapper.vm.isDeductibleVisible;
 
                 // Assert
                 expect(result).toBeFalsy();
@@ -486,7 +521,7 @@ describe('coverageStatement.vue-working', () => {
                 const { wrapper } = getMountedComponent(storeState);
 
                 // Act
-                const result = wrapper.vm.verifiedDeductible;
+                const result = wrapper.vm.isDeductibleVisible;
 
                 // Assert
                 expect(result).toBeFalsy();
@@ -683,7 +718,7 @@ describe('coverageStatement.vue-working', () => {
                     // Assert
                     expect(result).toBeFalsy();
                 });
-                test('returns true when isNoComp true', () => {
+                test('returns false when isNoComp true and enableNoCompQuote false', () => {
                     // Arrange
                     const mainInitialState = {
                         order: {
@@ -692,6 +727,32 @@ describe('coverageStatement.vue-working', () => {
                                 noCoverage: true
                             },
                             currentDeductible: priceOfLineItems
+                        },
+                        issConfig: {
+                            enableNoCompQuote: false
+                        }
+                    };
+                    getPriceOfLineItems.mockImplementationOnce(() => priceOfLineItems);
+                    const { wrapper } = getMountedComponent(mainInitialState);
+
+                    // Act
+                    const result = wrapper.vm.isQuoteDisplayed;
+
+                    // Assert
+                    expect(result).toBeFalsy();
+                });
+                test('returns true when isNoComp true and enableNoCompQuote true', () => {
+                    // Arrange
+                    const mainInitialState = {
+                        order: {
+                            policy: {
+                                policyLookupSuccessful: true,
+                                noCoverage: true
+                            },
+                            currentDeductible: priceOfLineItems
+                        },
+                        issConfig: {
+                            enableNoCompQuote: true
                         }
                     };
                     getPriceOfLineItems.mockImplementationOnce(() => priceOfLineItems);
@@ -1010,6 +1071,9 @@ describe('coverageStatement.vue-working', () => {
                             noCoverage: true,
                             policyLookupSuccessful: true
                         }
+                    },
+                    issConfig: {
+                        enableNoCompQuote: true
                     }
                 };
                 const { wrapper } = getMountedComponent(mainInitialState);
@@ -1038,6 +1102,9 @@ describe('coverageStatement.vue-working', () => {
                             noCoverage: true,
                             policyLookupSuccessful: true
                         }
+                    },
+                    issConfig: {
+                        enableNoCompQuote: true
                     }
                 };
                 const { wrapper } = getMountedComponent(mainInitialState);

src/layouts/coverage-statement/coverage-statement.vue

@@ -33,23 +33,23 @@
                                     v-html="secondaryText">
                                   </div>
                                   <div
-                                    v-if="verifiedDeductible"
+                                    v-if="isDeductibleVisible"
                                     class="d-flex justify-content-center cost">
-                                    {{ deductibleForDisplay }}
+                                    {{ formatAmountInDollars(deductibleValue) }}
                                   </div>
                                   <div
                                     v-if="isQuoteDisplayed"
                                     class="d-flex justify-content-center cost mb-0">
-                                    {{ servicePriceForDisplay }}
+                                    {{ formatAmountInDollars(totalServicePrice) }}
                                   </div>
                                   <div
-                                    v-if="verifiedITAC"
+                                    v-if="isITACQuoteVisible"
                                     class="d-flex justify-content-center mb-4 deductible-text">
                                     {{ deductibleText }}&nbsp;
-                                    <span class="text-success fw-bold">{{ deductibleForDisplay }}</span>
+                                    <span class="text-success fw-bold">{{ formatAmountInDollars(deductibleValue) }}</span>
                                   </div>
                                   <alert
-                                    v-if="verifiedITAC"
+                                    v-if="isITACQuoteVisible"
                                     ref="verifiedITACAlert"
                                     class="mb-5"
                                     cmsWidgetName="VerifiedITACAlert"
@@ -116,6 +116,7 @@ import contentGroupModal from '@/iss-components/content-group-modal/content-grou
 import buttonQuestion from '@/digital-components/button-question/button-question.vue';
 import loadingModal from '@/iss-components/loading-modal/loading-modal.vue';
 import textBlock from '@/digital-components/text-block/text-block.vue';
+import pageVariations from '@/constants/coverage-statement-page-variations';
 
 // Import Supporting Files
 import { fetchCmsContentForPage, setupModalLinks, processIfStatements } from '@/helpers/cms-content-helper.js';
@@ -171,6 +172,8 @@ export default {
         const clonedGlassParts = useMainStore().lineItems.glassParts
             ? JSON.parse(JSON.stringify(useMainStore().lineItems.glassParts))
             : [];
+        // TODO note that recycle fee is being included in this calculation. Assuming
+        // this is an error
         const availableLineItems = [
             ...(resultMap.supportingItems ?? []),
             ...(clonedGlassParts ?? [])
@@ -208,10 +211,10 @@ export default {
     },
     data() {
         const { isRepair } = useMainStore().damage;
-        const { policyLookupSuccessful } = useMainStore().policy;
+        // const { policyLookupSuccessful } = useMainStore().policy;
         return {
             isRepair,
-            policyLookupSuccessful,
+            // policyLookupSuccessful,
             isNoComp: useMainStore().isNoComp,
             baseServiceLineItems: [],
             selectedProvider: '',
@@ -236,6 +239,46 @@ export default {
         };
     },
     computed: {
+        pageVariation() {
+            const {
+                isNoComp,
+                issConfig,
+                policy,
+                payment,
+                isClaimRegistrationRequired
+            } = useMainStore();
+            const registerClaimSuccessful = payment.insuranceCoverage.isVerified;
+
+            if (!policy.policyLookupSuccessful) {
+                return pageVariations.UNVERIFIED;
+            }
+
+            if (isNoComp) {
+                if (issConfig.enableNoCompQuote) {
+                    return pageVariations.NO_COMP;
+                }
+                return pageVariations.UNVERIFIED;
+            }
+
+            if (this.deductibleValue == null) {
+                return pageVariations.UNVERIFIED;
+            }
+
+            // TODO this should be determined based on the result of the ITAC price call
+            // TODO it seems that ITAC now requires claim registration calls. If this call fails
+            // should the page become unverified?
+            if (this.deductibleValue > this.totalServicePrice) {
+                return pageVariations.ITAC;
+            }
+
+            if (isClaimRegistrationRequired) {
+                if (registerClaimSuccessful) {
+                    return pageVariations.DEDUCTIBLE;
+                }
+                return pageVariations.UNVERIFIED;
+            }
+            return pageVariations.DEDUCTIBLE;
+        },
         coverageStatementSubHeader() {
             return this.getTextFromCmsWithCustomIfStatements(
                 this.widget.subheader,
@@ -249,10 +292,14 @@ export default {
             );
         },
         verifiedItacAlertBody() {
+            const itacCostSavings = this.deductibleValue - this.totalServicePrice;
             return this.getCmsContent(
                 this.widget.verifiedItacAlert,
                 widgetFields.ALERT_WIDGET.BODY_TEXT
-            )?.replaceAll('{custom:costSavings}', this.itacCostSavingsForDisplay);
+            )?.replaceAll(
+                '{custom:costSavings}',
+                formatAmountInDollars(itacCostSavings)
+            );
         },
         secondaryText() {
             return this.getTextFromCmsWithCustomIfStatements(
@@ -285,50 +332,25 @@ export default {
         deductibleValue() {
             return useMainStore().order.currentDeductible;
         },
-        deductibleForDisplay() {
+        isNoCompQuoteVisible() {
-            return formatAmountInDollars(this.deductibleValue);
+            return this.pageVariation === pageVariations.NO_COMP;
         },
-        registerClaimSuccessful() {
+        isITACQuoteVisible() {
-            return useMainStore().payment.insuranceCoverage.isVerified;
+            return this.pageVariation === pageVariations.ITAC;
         },
-        verifiedNoComp() {
+        isDeductibleVisible() {
-            return this.policyLookupSuccessful && this.isNoComp && useMainStore().issConfig.enableNoCompQuote;
+            return this.pageVariation === pageVariations.DEDUCTIBLE;
         },
-        verifiedITAC() {
+        isUnverifiedVisible() {
-            return this.policyLookupSuccessful
+            return this.pageVariation === pageVariations.UNVERIFIED;
-                && !this.isNoComp
-                && this.deductibleValue > this.totalServicePrice;
-        },
-        coveredAndServicePriceAboveOrEqualDeductible() {
-            return !this.isNoComp && this.totalServicePrice >= this.deductibleValue;
-        },
-        verifiedDeductible() {
-            return useMainStore().isClaimRegistrationRequired
-                ? this.registerClaimSuccessful
-                    && this.coveredAndServicePriceAboveOrEqualDeductible
-                    && this.deductibleValue !== null
-                : this.policyLookupSuccessful
-                    && this.coveredAndServicePriceAboveOrEqualDeductible;
-        },
-        unverified() {
-            return !this.verifiedDeductible && !this.verifiedITAC && !this.verifiedNoComp;
         },
         isADAS() {
-            const parts = useMainStore().order.lineItems.glassParts;
+            const { glassParts } = useMainStore().order.lineItems;
-            return parts !== null && !!parts.find((part) => part.requiresRecalibration);
+            return glassParts !== null && !!glassParts.find((part) => part.requiresRecalibration);
         },
         totalServicePrice() {
             return getPriceOfLineItems(this.baseServiceLineItems);
         },
-        servicePriceForDisplay() {
-            return formatAmountInDollars(this.totalServicePrice);
-        },
-        itacCostSavings() {
-            return this.deductibleValue - this.totalServicePrice;
-        },
-        itacCostSavingsForDisplay() {
-            return formatAmountInDollars(this.itacCostSavings);
-        },
         serviceProviderQuestionText() {
             return this.getCmsContent(
                 this.widget.serviceProviderQuestion,
@@ -342,15 +364,23 @@ export default {
             );
         },
         isQuoteDisplayed() {
-            return this.verifiedITAC || this.verifiedNoComp;
+            return this.isITACQuoteVisible || this.isNoCompQuoteVisible;
         },
+        // TODO can we simplify this
         shouldRegisterClaim() {
-            return this.policyLookupSuccessful
+            const {
-                && useMainStore().vehicle.policyVehicleId != null
+                policy,
-                && useMainStore().vehicle.policyVehicleId >= 0
+                vehicle,
-                && useMainStore().isClaimRegistrationRequired
+                isClaimRegistrationRequired,
-                && !useMainStore().isClaimAlreadyRegistered
+                isClaimAlreadyRegistered
-                && (this.coveredAndServicePriceAboveOrEqualDeductible || this.verifiedITAC);
+            } = useMainStore();
+            const { policyVehicleId } = vehicle;
+            return policy.policyLookupSuccessful
+                && policyVehicleId != null
+                && policyVehicleId >= 0
+                && isClaimRegistrationRequired
+                && !isClaimAlreadyRegistered
+                && (this.isDeductibleVisible || this.isITACQuoteVisible);
         }
     },
     watch: {
@@ -373,8 +403,9 @@ export default {
             return !!useMainStore().vehicle.carId;
         },
         async initializeComponent() {
-            useMainStore().updatePolicyITACFlag(this.verifiedITAC);
+            useMainStore().updatePolicyITACFlag(this.isITACQuoteVisible);
-            const coverageStatus = this.verifiedITAC || this.verifiedNoComp
+            // TODO how should coverage status be updated
+            const coverageStatus = this.isITACQuoteVisible || this.isNoCompQuoteVisible
                 ? coverageStatuses.VERIFIED
                 : coverageStatuses.PENDING;
             useMainStore().updateCoverageStatus(coverageStatus);
@@ -384,10 +415,10 @@ export default {
             this.$refs.loadingModal.hideModal();
         },
         async navigateForward() {
-            if (this.unverified || this.verifiedDeductible) {
+            if (this.isUnverifiedVisible || this.isDeductibleVisible) {
                 useMainStore().updateSupportingItems(this.supportingItems);
                 this.navigateWithScenario(navigationScenarios.CLICKED_FORWARD);
-            } else if (this.verifiedITAC || this.verifiedNoComp) {
+            } else if (this.isITACQuoteVisible || this.isNoCompQuoteVisible) {
                 useMainStore().updateIsSafeliteProvider(this.selectedProvider === SAFELITE_PROVIDER);
                 if (this.selectedProvider === SAFELITE_PROVIDER) {
                     useMainStore().updateSupportingItems(this.supportingItems);
@@ -411,13 +442,13 @@ export default {
         getCustomValueFromString(str) {
             switch (str) {
                 case 'coverageUnverified':
-                    return this.unverified;
+                    return this.isUnverifiedVisible;
                 case 'verifiedDeductible':
-                    return this.verifiedDeductible;
+                    return this.isDeductibleVisible;
                 case 'verifiedITAC':
-                    return this.verifiedITAC;
+                    return this.isITACQuoteVisible;
                 case 'verifiedNoComp':
-                    return this.verifiedNoComp;
+                    return this.isNoCompQuoteVisible;
                 case 'ADASReplace':
                     return !this.isRepair && this.isADAS;
                 case 'nonADASReplace':
@@ -425,9 +456,9 @@ export default {
                 case 'nonADASRepair':
                     return this.isRepair;
                 case 'deductibleOverZero':
-                    return this.verifiedDeductible && this.deductibleValue !== 0; // TODO what if deductible is negative?
+                    return this.isDeductibleVisible && this.deductibleValue !== 0; // TODO what if deductible is negative?
                 case 'isDeductibleZero':
-                    return this.verifiedDeductible && this.deductibleValue === 0;
+                    return this.isDeductibleVisible && this.deductibleValue === 0;
                 default:
                     return null;
             }
@@ -437,7 +468,8 @@ export default {
         },
         setBaseServiceLineItems(lineItems) {
             this.baseServiceLineItems = lineItems;
-        }
+        },
+        formatAmountInDollars
     }
 };
 </script>