diff --git a/changelog.txt b/changelog.txt index f10c27c88..13d91aea4 100644 --- a/changelog.txt +++ b/changelog.txt @@ -6,6 +6,7 @@ * Tweak - Redirect to the settings tab after an account is connected. * Tweak - Prompt message when navigating out Stripe settings with unsaved changes * Tweak - Show toast when payment methods list is updated with new payment methods. +* Tweak - Use the newly exposed LoadableMask component provided by WooCommerce Blocks to trigger the loading state for Payment Request Buttons. * Fix - JS error on checkout when Boleto method was not active. * Fix - Fixed bug that show "Use new payment method" on pay order page when there were no saved card was. * Tweak - Autocomplete for account keys and webhooks fields were disabled. diff --git a/client/blocks/payment-request/payment-request-express.js b/client/blocks/payment-request/payment-request-express.js index 4f7192b2f..14f0d321f 100644 --- a/client/blocks/payment-request/payment-request-express.js +++ b/client/blocks/payment-request/payment-request-express.js @@ -1,3 +1,4 @@ +import { __ } from '@wordpress/i18n'; import { Elements, PaymentRequestButtonElement, @@ -38,6 +39,7 @@ import { getBlocksConfiguration } from 'wcstripe/blocks/utils'; */ const PaymentRequestExpressComponent = ( { billing, + components, shippingData, onClick, onClose, @@ -91,49 +93,41 @@ const PaymentRequestExpressComponent = ( { return null; } + const { LoadingMask } = components; + if ( isCustom ) { return ( -
{ onPaymentRequestButtonClick( evt, paymentRequest ); } } /> -
+ ); } if ( isBranded && shouldUseGooglePayBrand() ) { return ( -
{ onPaymentRequestButtonClick( evt, paymentRequest ); } } /> -
+ ); } @@ -146,30 +140,21 @@ const PaymentRequestExpressComponent = ( { } return ( - // The classNames here manually trigger the loading state for the PRB. Hopefully we'll - // see an API introduced to WooCommerce Blocks that will let us control this without - // relying on a CSS class. - // - @reykjalin -
-
+ ); }; diff --git a/readme.txt b/readme.txt index 3cce296c6..697d1213e 100644 --- a/readme.txt +++ b/readme.txt @@ -131,6 +131,7 @@ If you get stuck, you can ask for help in the Plugin Forum. = 6.x.x - 2022-xx-xx = * Fix - Fixed capitalization for payment method names: iDEAL, giropay, and Sofort. * Add - Text to explain how to enable webhooks when manually entering your API keys in the new Stripe settings. +* Tweak - Use the newly exposed LoadableMask component provided by WooCommerce Blocks to trigger the loading state for Payment Request Buttons. * Tweak - Redirect to the settings tab after an account is connected * Tweak - Prompt message when navigating out Stripe settings with unsaved changes * Tweak - Show toast when payment methods list is updated with new payment methods.