mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-08-30 05:00:51 +08:00
💄 Enhance SettingsToggleBlock with loading state
This commit is contained in:
parent
4af29a5dc2
commit
d9a82948f7
2 changed files with 14 additions and 3 deletions
|
@ -1,6 +1,8 @@
|
|||
import { ToggleControl, Spinner } from '@wordpress/components';
|
||||
import { ToggleControl } from '@wordpress/components';
|
||||
import { useRef } from '@wordpress/element';
|
||||
|
||||
import SpinnerOverlay from './SpinnerOverlay';
|
||||
|
||||
const SettingsToggleBlock = ( {
|
||||
isToggled,
|
||||
setToggled,
|
||||
|
@ -15,9 +17,10 @@ const SettingsToggleBlock = ( {
|
|||
}
|
||||
|
||||
const handleLabelClick = () => {
|
||||
if ( ! toggleRef.current ) {
|
||||
if ( ! toggleRef.current || isLoading ) {
|
||||
return;
|
||||
}
|
||||
|
||||
toggleRef.current.click();
|
||||
toggleRef.current.focus();
|
||||
};
|
||||
|
@ -55,7 +58,7 @@ const SettingsToggleBlock = ( {
|
|||
</div>
|
||||
{ props.children && isToggled && (
|
||||
<div className="ppcp-r-toggle-block__toggled-content">
|
||||
{ isLoading && <Spinner /> }
|
||||
{ isLoading && <SpinnerOverlay /> }
|
||||
{ props.children }
|
||||
</div>
|
||||
) }
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue