From a7f9fdda2276da027e0388a48f0f0c46ee78d33c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Guillermo=20Guti=C3=A9rrez?= Date: Thu, 6 Jun 2024 10:21:22 -0600 Subject: [PATCH] [5.3] MSTR-308: Show credit card not accepted dialog on login and refresh (#1201) --- src/apps/myaccount/i18n/de-DE.json | 25 ++++++++-- src/apps/myaccount/i18n/en-US.json | 4 +- src/apps/myaccount/i18n/fr-FR.json | 7 ++- src/apps/myaccount/i18n/nl-NL.json | 7 ++- src/apps/myaccount/i18n/ru-RU.json | 7 ++- .../myaccount/submodules/billing/billing.scss | 8 ---- .../submodules/creditCard/creditCard.js | 35 +++++++++----- .../submodules/creditCard/creditCard.scss | 46 ++++++++++++++----- .../creditCard/views/disclaimerDialog.html | 21 +++++++-- 9 files changed, 114 insertions(+), 46 deletions(-) diff --git a/src/apps/myaccount/i18n/de-DE.json b/src/apps/myaccount/i18n/de-DE.json index 7817a2d07..852a9e836 100644 --- a/src/apps/myaccount/i18n/de-DE.json +++ b/src/apps/myaccount/i18n/de-DE.json @@ -220,7 +220,7 @@ "noAch": "*Based on the Billing Address above, the ACH payment method is not available." }, "bigNotices": { - "noCard": "The option to use a Credit Card is not available in the following states: NY, CT, MA, ME. Debit cards are also not a valid method. Please use ACH Direct Debit" + "noCard": "We can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption. Note: ACH payment setup may take up to 4 days to process." } }, @@ -284,9 +284,13 @@ }, "status": { "pending": "Verification pending...", - "verified": "Verified" + "verified": "Verified", + "failed": "Failed" } }, + "awaitingSettlement": { + "description": "We have confirmed the deposit amounts. Please check again later." + }, "addFailure": "Unable to store this bank account information", "addSuccess": "Bank account was succesfully stored", "removeSuccess": "Verified bank account and payment method removed.", @@ -295,6 +299,13 @@ "verificationFailure": { "title": "Incorrect Amount(s)", "message": "The amounts provided above do NOT match the verification records. Please double check your inputs below and try again. You have up to 4 attempts." + }, + "verificationDeclined": { + "title": "Bank account cannot be verified", + "message": { + "gateway_rejected": "You have reached the maximum amount of confirmation attempts", + "processor_declined": "Verification was declined by the processor" + } } }, @@ -331,7 +342,15 @@ "removeSuccess": "Credit card ending in {{variable}} removed as payment method.", "removeFailure": "Failed to remove credit card ending in {{variable}} as payment method.", "surchargeNotice": "NOTICE: We impose a surcharge of up to 2.6% of the transaction amount on Visa and Mastercard credit card products, which is not greater than our cost of acceptance, in states where such surcharges are permitted.", - "debitCardError": "We do not accept debit card payments. Please use ACH, or a Visa/Mastercard credit card." + "debitCardError": "We do not accept debit card payments. Please use ACH, or a Visa/Mastercard credit card.", + "disclaimer": { + "title": "Changes to credit card payments", + "noCardTitle": "Important Update to 2600Hz Payment Options", + "message": "In order to continue using your current credit card as a valid payment method, you must acknowledge and agree to this surcharge. If not, you will need to update to a different payment method.", + "noCardMessage": "We've introduced ACH Direct Deposit as a new payment method. However, we can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption.", + "updatePaymentMethod": "Update payment method", + "saveAndContinue": "Save & continue" + } }, "trunks": { diff --git a/src/apps/myaccount/i18n/en-US.json b/src/apps/myaccount/i18n/en-US.json index ec075bfe2..0252a0076 100644 --- a/src/apps/myaccount/i18n/en-US.json +++ b/src/apps/myaccount/i18n/en-US.json @@ -238,7 +238,7 @@ "noAch": "*Based on the Billing Address above, the ACH payment method is not available." }, "bigNotices": { - "noCard": "The option to use a Credit Card is not available in the following states: NY, CT, MA, ME. Debit cards are also not a valid method. Please use ACH Direct Debit" + "noCard": "We can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption. Note: ACH payment setup may take up to 4 days to process." } }, @@ -363,7 +363,9 @@ "debitCardError": "We do not accept debit card payments. Please use ACH, or a Visa/Mastercard credit card.", "disclaimer": { "title": "Changes to credit card payments", + "noCardTitle": "Important Update to 2600Hz Payment Options", "message": "In order to continue using your current credit card as a valid payment method, you must acknowledge and agree to this surcharge. If not, you will need to update to a different payment method.", + "noCardMessage": "We've introduced ACH Direct Deposit as a new payment method. However, we can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption.", "updatePaymentMethod": "Update payment method", "saveAndContinue": "Save & continue" } diff --git a/src/apps/myaccount/i18n/fr-FR.json b/src/apps/myaccount/i18n/fr-FR.json index 0d6177f5c..66a7aec1f 100644 --- a/src/apps/myaccount/i18n/fr-FR.json +++ b/src/apps/myaccount/i18n/fr-FR.json @@ -152,7 +152,7 @@ "noAch": "*Based on the Billing Address above, the ACH payment method is not available." }, "bigNotices": { - "noCard": "The option to use a Credit Card is not available in the following states: NY, CT, MA, ME. Debit cards are also not a valid method. Please use ACH Direct Debit" + "noCard": "We can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption. Note: ACH payment setup may take up to 4 days to process." } }, @@ -216,7 +216,8 @@ }, "status": { "pending": "Verification pending...", - "verified": "Verified" + "verified": "Verified", + "failed": "Failed" } }, "awaitingSettlement": { @@ -276,7 +277,9 @@ "debitCardError": "We do not accept debit card payments. Please use ACH, or a Visa/Mastercard credit card.", "disclaimer": { "title": "Changes to credit card payments", + "noCardTitle": "Important Update to 2600Hz Payment Options", "message": "In order to continue using your current credit card as a valid payment method, you must acknowledge and agree to this surcharge. If not, you will need to update to a different payment method.", + "noCardMessage": "We've introduced ACH Direct Deposit as a new payment method. However, we can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption.", "updatePaymentMethod": "Update payment method", "saveAndContinue": "Save & continue" } diff --git a/src/apps/myaccount/i18n/nl-NL.json b/src/apps/myaccount/i18n/nl-NL.json index 349f464b6..4e755cf2e 100644 --- a/src/apps/myaccount/i18n/nl-NL.json +++ b/src/apps/myaccount/i18n/nl-NL.json @@ -142,7 +142,7 @@ "noAch": "*Based on the Billing Address above, the ACH payment method is not available." }, "bigNotices": { - "noCard": "The option to use a Credit Card is not available in the following states: NY, CT, MA, ME. Debit cards are also not a valid method. Please use ACH Direct Debit" + "noCard": "We can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption. Note: ACH payment setup may take up to 4 days to process." } }, @@ -206,7 +206,8 @@ }, "status": { "pending": "Verification pending...", - "verified": "Verified" + "verified": "Verified", + "failed": "Failed" } }, "awaitingSettlement": { @@ -266,7 +267,9 @@ "debitCardError": "We do not accept debit card payments. Please use ACH, or a Visa/Mastercard credit card.", "disclaimer": { "title": "Changes to credit card payments", + "noCardTitle": "Important Update to 2600Hz Payment Options", "message": "In order to continue using your current credit card as a valid payment method, you must acknowledge and agree to this surcharge. If not, you will need to update to a different payment method.", + "noCardMessage": "We've introduced ACH Direct Deposit as a new payment method. However, we can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption.", "updatePaymentMethod": "Update payment method", "saveAndContinue": "Save & continue" } diff --git a/src/apps/myaccount/i18n/ru-RU.json b/src/apps/myaccount/i18n/ru-RU.json index 8435ec6d3..e69c495d8 100644 --- a/src/apps/myaccount/i18n/ru-RU.json +++ b/src/apps/myaccount/i18n/ru-RU.json @@ -178,7 +178,7 @@ "noAch": "*Based on the Billing Address above, the ACH payment method is not available." }, "bigNotices": { - "noCard": "The option to use a Credit Card is not available in the following states: NY, CT, MA, ME. Debit cards are also not a valid method. Please use ACH Direct Debit" + "noCard": "We can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption. Note: ACH payment setup may take up to 4 days to process." } }, @@ -242,7 +242,8 @@ }, "status": { "pending": "Verification pending...", - "verified": "Verified" + "verified": "Verified", + "failed": "Failed" } }, "awaitingSettlement": { @@ -302,7 +303,9 @@ "debitCardError": "We do not accept debit card payments. Please use ACH, or a Visa/Mastercard credit card.", "disclaimer": { "title": "Changes to credit card payments", + "noCardTitle": "Important Update to 2600Hz Payment Options", "message": "In order to continue using your current credit card as a valid payment method, you must acknowledge and agree to this surcharge. If not, you will need to update to a different payment method.", + "noCardMessage": "We've introduced ACH Direct Deposit as a new payment method. However, we can no longer accept debit or credit card payments in your state. Please update your payment method to ACH Direct Deposit by July 1, 2024, to avoid service interruption.", "updatePaymentMethod": "Update payment method", "saveAndContinue": "Save & continue" } diff --git a/src/apps/myaccount/submodules/billing/billing.scss b/src/apps/myaccount/submodules/billing/billing.scss index 64e55c5d3..14ac2572c 100644 --- a/src/apps/myaccount/submodules/billing/billing.scss +++ b/src/apps/myaccount/submodules/billing/billing.scss @@ -176,14 +176,6 @@ .no-payment-available-small-notices { margin-bottom: 1rem; - - &.no-payment-available-small-notices-card .no-card-available { - display: none; - } - - &.no-payment-available-small-notices-ach .no-ach-available { - display: none; - } } .no-card-available-hidden, .no-ach-available-hidden { diff --git a/src/apps/myaccount/submodules/creditCard/creditCard.js b/src/apps/myaccount/submodules/creditCard/creditCard.js index c1c7cb121..e6c1d81a3 100644 --- a/src/apps/myaccount/submodules/creditCard/creditCard.js +++ b/src/apps/myaccount/submodules/creditCard/creditCard.js @@ -308,11 +308,6 @@ define(function(require) { var card = _.get(args, ['cards', 0]); - if (!expiredMode && country === 'US' && _.includes(self.appFlags.billing.usStatesDeniedCreditCards, region)) { - $container.find('.no-card-available') - .removeClass('no-card-available-hidden'); - } - monster.waterfall([ function createClientInstance(next) { braintreeClient.create({ @@ -361,6 +356,11 @@ define(function(require) { } })); + if (!expiredMode && country === 'US' && _.includes(self.appFlags.billing.usStatesDeniedCreditCards, region)) { + $template.filter('.no-card-available') + .removeClass('no-card-available-hidden'); + } + $template.find('#credit_card_delete').on('click', function(event) { event.preventDefault(); @@ -605,26 +605,32 @@ define(function(require) { hasCreditCards = !_.chain(billing).get('credit_cards', []).isEmpty().value(), country = _.get(account, ['contact', 'billing', 'country']), region = _.get(account, ['contact', 'billing', 'region']), - surcharge = self.billingGetCreditCardSurcharge(country, region); + surcharge = self.billingGetCreditCardSurcharge(country, region), + isCardAccepted = !!surcharge; - if (!hasCreditCards || isSurchargeAccepted || country !== 'US') { + if (!hasCreditCards || country !== 'US' || (isCardAccepted && isSurchargeAccepted)) { return; } var $template = $(self.getTemplate({ name: 'disclaimerDialog', - submodule: 'creditCard' + submodule: 'creditCard', + data: { + isCardAccepted: isCardAccepted + } })), $acceptButton = $template.find('#myaccount_creditcard_disclaimer_accept'), $checkbox = $template.find('input[name="credit_card_accept_agreement"]'), $dialog = monster.ui.dialog($template, { - dialogClass: 'myaccount-creditcard-dialog', - title: self.i18n.active().creditCard.disclaimer.title, + dialogClass: isCardAccepted ? 'myaccount-creditcard-dialog' : 'myaccount-creditcard-dialog-no-card', + title: self.i18n.active().creditCard.disclaimer[isCardAccepted ? 'title' : 'noCardTitle'], isPersistent: true, hideClose: true, - closeOnEscape: false + closeOnEscape: !isCardAccepted }), - $icon = monster.ui.getSvgIconTemplate({ id: 'telicon2--warning--triangle' }); + $icon = isCardAccepted + ? monster.ui.getSvgIconTemplate({ id: 'telicon2--warning--triangle' }) + : monster.ui.getSvgIconTemplate({ id: 'telicon2--x--circle' }); if (surcharge) { $template.find('.disclaimer-dialog-notice span').text(surcharge); @@ -669,6 +675,11 @@ define(function(require) { }); }); + $template.find('#myaccount_creditcard_disclaimer_cancel') + .on('click', function() { + $dialog.dialog('close'); + }); + $dialog .siblings('.ui-dialog-titlebar') .addClass('disclaimer-dialog-title') diff --git a/src/apps/myaccount/submodules/creditCard/creditCard.scss b/src/apps/myaccount/submodules/creditCard/creditCard.scss index 3e6d10815..9224add85 100644 --- a/src/apps/myaccount/submodules/creditCard/creditCard.scss +++ b/src/apps/myaccount/submodules/creditCard/creditCard.scss @@ -81,19 +81,28 @@ } } -.myaccount-creditcard-dialog { - .disclaimer-dialog-title { - background-color: var(--sds_theme_color_warning); - } - .svg-icon { - float: left; - padding-top: 0.75rem; - padding-right: 0.5rem; +.myaccount-creditcard-dialog, .myaccount-creditcard-dialog-no-card { + .disclaimer-dialog-title.ui-dialog-titlebar { + background: $white; + padding: 1.5rem; + + .ui-dialog-title { + font-size: 22px; + line-height: 2rem; + color: #333; + } + + .svg-icon { + float: left; + padding-right: 1rem; + width: 2rem; + height: 2rem; + } } #myaccount_creditcard_disclaimer_dialog { - max-width: 560px; - padding: 1rem; + max-width: 510px; + padding: 0 1.5rem 1.5rem 1.5rem; .disclaimer-dialog-notice { margin-bottom: 1rem; @@ -102,15 +111,30 @@ .disclaimer-dialog-agreement { margin-bottom: 1rem; + label { + font-size: 15.4px; + line-height: 20px; + } + a { color: $primary-color; } } .disclaimer-dialog-footer { - .monster-button-small { + margin-top: 2rem; + + .monster-button { margin-left: 0.5rem; } } } } + +.myaccount-creditcard-dialog .disclaimer-dialog-title.ui-dialog-titlebar .svg-icon { + color: $warning-color; +} + +.myaccount-creditcard-dialog-no-card .disclaimer-dialog-title.ui-dialog-titlebar .svg-icon { + color: $danger-color; +} diff --git a/src/apps/myaccount/submodules/creditCard/views/disclaimerDialog.html b/src/apps/myaccount/submodules/creditCard/views/disclaimerDialog.html index 818e7f672..88c932aaa 100644 --- a/src/apps/myaccount/submodules/creditCard/views/disclaimerDialog.html +++ b/src/apps/myaccount/submodules/creditCard/views/disclaimerDialog.html @@ -1,16 +1,27 @@
- {{{i18n.creditCard.surchargeNotice}}} -

- {{{i18n.creditCard.disclaimer.message}}} + {{#if isCardAccepted}} + {{{i18n.creditCard.surchargeNotice}}} +

+ {{{i18n.creditCard.disclaimer.message}}} + {{else}} + {{{i18n.creditCard.disclaimer.noCardMessage}}} + {{/if}}
+{{#if isCardAccepted}}
{{#monsterCheckbox "raw-label" i18n.creditCard.add.agreement}} {{/monsterCheckbox}}
+{{/if}}
- - + {{#if isCardAccepted}} + + {{/if}} + + {{#unless isCardAccepted}} + + {{/unless}}