From a71f602a30431e77eda99e1c2337a2bbf5b3eeab Mon Sep 17 00:00:00 2001 From: Terrin Nuismer Date: Mon, 11 Jul 2022 14:34:43 -0400 Subject: [PATCH] Add feature to make the annual and quarterly frequencies optional. --- README.md | 6 ++++- branded-checkout.html | 2 +- src/app/branded/branded-checkout.component.js | 4 ++- src/app/branded/branded-checkout.tpl.html | 4 ++- .../branded-checkout-step-1.component.js | 4 ++- .../step-1/branded-checkout-step-1.tpl.html | 2 ++ .../productConfigForm.component.js | 25 ++++++++++++++++++- .../productConfigForm.component.spec.js | 10 ++++++-- 8 files changed, 49 insertions(+), 8 deletions(-) diff --git a/README.md b/README.md index aeed6dadf..89ad44d8e 100644 --- a/README.md +++ b/README.md @@ -60,7 +60,9 @@ Add the following code to your page where appropriate. See the [Branded checkout on-order-failed="$event.$window.onOrderFailed($event.donorDetails)" radio-station-api-url="https://api.domain.com/getStations" radio-station-radius="100" - hide-spouse-details="true"> + hide-spouse-details="true" + hide-annual="true" + hide-quarterly="true"> @@ -134,6 +136,8 @@ The `` element is where the branded checkout Angular app will - `radio-station-api-url` - Provides a URL path for fetching a list of radio stations in the donor's vicinity. If you plan to use this feature, contact Cru's Digital Products and Services (DPS) department ([help@cru.org](mailto:help@cru.org)) to have your URL domain whitelisted to interact with our API - *Optional* - `radio-station-radius` - Provides a radius (in miles) for fetching a list of radio stations in the donor's vicinity - *Optional* - `hide-spouse-details` - Hides the spouse detail line initially, and adds a link to toggle the spouse details. If you don't want this feature, do not add this attribute at all. - *Optional* +- `hide-annual` - Hides the annual frequency option. If you don't want this feature, do not add this attribute at all. - *Optional* +- `hide-quarterly` - Hides the quarterly frequency option. If you don't want this feature, do not add this attribute at all. - *Optional* #### Server-side configuration for a new branded checkout domain diff --git a/branded-checkout.html b/branded-checkout.html index ff2e6db51..73feb5ef6 100644 --- a/branded-checkout.html +++ b/branded-checkout.html @@ -11,7 +11,7 @@ - + diff --git a/src/app/branded/branded-checkout.component.js b/src/app/branded/branded-checkout.component.js index 340bdd9a1..d23480b58 100644 --- a/src/app/branded/branded-checkout.component.js +++ b/src/app/branded/branded-checkout.component.js @@ -141,6 +141,8 @@ export default angular onOrderFailed: '&', language: '@', showCoverFees: '@', - hideSpouseDetails: '@' + hideSpouseDetails: '@', + hideAnnual: '@', + hideQuarterly: '@' } }) diff --git a/src/app/branded/branded-checkout.tpl.html b/src/app/branded/branded-checkout.tpl.html index b6ff0ec21..ba97a9656 100644 --- a/src/app/branded/branded-checkout.tpl.html +++ b/src/app/branded/branded-checkout.tpl.html @@ -18,7 +18,9 @@ on-payment-failed="$ctrl.onPaymentFailed($event.donorDetails)" radio-station-api-url="$ctrl.radioStationApiUrl" radio-station-radius="$ctrl.radioStationRadius" - hide-spouse-details="$ctrl.hideSpouseDetails"> + hide-spouse-details="$ctrl.hideSpouseDetails" + hide-quarterly="$ctrl.hideQuarterly" + hide-annual="$ctrl.hideAnnual"> diff --git a/src/app/productConfig/productConfigForm/productConfigForm.component.js b/src/app/productConfig/productConfigForm/productConfigForm.component.js index 55e42a506..4d09f11a7 100644 --- a/src/app/productConfig/productConfigForm/productConfigForm.component.js +++ b/src/app/productConfig/productConfigForm/productConfigForm.component.js @@ -118,6 +118,9 @@ class ProductConfigFormController { this.productData = productData this.setDefaultAmount() this.setDefaultFrequency() + if (this.envService.read('isBrandedCheckout')) { + this.filterChosenFrequencies() + } }) const nextDrawDateObservable = this.commonService.getNextDrawDate() @@ -238,6 +241,9 @@ class ProductConfigFormController { .subscribe(data => { this.itemConfigForm.$setDirty() this.productData = data + if (this.envService.read('isBrandedCheckout')) { + this.filterChosenFrequencies() + } this.changingFrequency = false this.onStateChange({ state: 'unsubmitted' }) }, @@ -252,6 +258,21 @@ class ProductConfigFormController { } } + filterChosenFrequencies () { + let filteredFrequencies = this.productData.frequencies + if (this.hideQuarterly) { + filteredFrequencies = filteredFrequencies.filter((value) => { + return value.name !== 'QUARTERLY' + }) + } + if (this.hideAnnual) { + filteredFrequencies = filteredFrequencies.filter((value) => { + return value.name !== 'ANNUAL' + }) + } + this.productData.frequencies = filteredFrequencies + } + changeAmount (amount, retainCoverFees) { this.itemConfigForm.$setDirty() this.checkAmountChanged(amount) @@ -384,6 +405,8 @@ export default angular disableSessionRestart: '@', updateQueryParam: '&', submitted: '<', - onStateChange: '&' + onStateChange: '&', + hideAnnual: '<', + hideQuarterly: '<' } }) diff --git a/src/app/productConfig/productConfigForm/productConfigForm.component.spec.js b/src/app/productConfig/productConfigForm/productConfigForm.component.spec.js index aca4513f5..09e232563 100644 --- a/src/app/productConfig/productConfigForm/productConfigForm.component.spec.js +++ b/src/app/productConfig/productConfigForm/productConfigForm.component.spec.js @@ -348,8 +348,14 @@ describe('product config form component', function () { it('orders frequency by name', () => { expect($ctrl.frequencyOrder({ name: 'NA' })).toEqual(0) expect($ctrl.frequencyOrder({ name: 'MON' })).toEqual(1) - expect($ctrl.frequencyOrder({ name: 'QUARTERLY' })).toEqual(2) - expect($ctrl.frequencyOrder({ name: 'ANNUAL' })).toEqual(3) + if (!this.hideQuarterly) { + expect($ctrl.frequencyOrder({ name: 'QUARTERLY' })).toEqual(2) + } + if (this.hideAnnual === true && !this.hideQuarterly) { + expect($ctrl.frequencyOrder({ name: 'ANNUAL' })).toEqual(3) + } else if (this.hideAnnual === true) { + expect($ctrl.frequencyOrder({ name: 'ANNUAL' })).toEqual(2) + } }) })