mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-08-30 05:00:51 +08:00
Migrate Google Pay to the new script loader
This commit is contained in:
parent
07bedc4460
commit
869a47f3cd
5 changed files with 59 additions and 36 deletions
|
@ -4,7 +4,7 @@ import {
|
|||
registerPaymentMethod,
|
||||
} from '@woocommerce/blocks-registry';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import { loadPaypalScript } from '../../../ppcp-button/resources/js/modules/Helper/ScriptLoading';
|
||||
import UnifiedScriptLoader from '../../../ppcp-button/resources/js/modules/Helper/UnifiedScriptLoader';
|
||||
import GooglepayManager from './GooglepayManager';
|
||||
import { loadCustomScript } from '@paypal/paypal-js';
|
||||
import GooglepayManagerBlockEditor from './GooglepayManagerBlockEditor';
|
||||
|
@ -14,7 +14,7 @@ const ppcpConfig = ppcpData.scriptData;
|
|||
|
||||
const buttonData = wc.wcSettings.getSetting( 'ppcp-googlepay_data' );
|
||||
const buttonConfig = buttonData.scriptData;
|
||||
const dataNamespace = 'ppcpBlocksEditorPaypalGooglepay';
|
||||
const namespace = 'ppcpBlocksPaypalGooglepay';
|
||||
|
||||
if ( typeof window.PayPalCommerceGateway === 'undefined' ) {
|
||||
window.PayPalCommerceGateway = ppcpConfig;
|
||||
|
@ -24,14 +24,7 @@ const GooglePayComponent = ( props ) => {
|
|||
const [ bootstrapped, setBootstrapped ] = useState( false );
|
||||
const [ paypalLoaded, setPaypalLoaded ] = useState( false );
|
||||
const [ googlePayLoaded, setGooglePayLoaded ] = useState( false );
|
||||
|
||||
const bootstrap = function () {
|
||||
const ManagerClass = props.isEditing
|
||||
? GooglepayManagerBlockEditor
|
||||
: GooglepayManager;
|
||||
const manager = new ManagerClass( buttonConfig, ppcpConfig );
|
||||
manager.init();
|
||||
};
|
||||
const [ manager, setManager ] = useState( null );
|
||||
|
||||
useEffect( () => {
|
||||
// Load GooglePay SDK
|
||||
|
@ -41,22 +34,36 @@ const GooglePayComponent = ( props ) => {
|
|||
|
||||
ppcpConfig.url_params.components += ',googlepay';
|
||||
|
||||
if ( props.isEditing ) {
|
||||
ppcpConfig.data_namespace = dataNamespace;
|
||||
}
|
||||
|
||||
// Load PayPal
|
||||
loadPaypalScript( ppcpConfig, () => {
|
||||
setPaypalLoaded( true );
|
||||
} );
|
||||
UnifiedScriptLoader.loadPayPalScript( namespace, ppcpConfig )
|
||||
.then( () => {
|
||||
setPaypalLoaded( true );
|
||||
} )
|
||||
.catch( ( error ) => {
|
||||
console.error( 'Failed to load PayPal script: ', error );
|
||||
} );
|
||||
}, [] );
|
||||
|
||||
useEffect( () => {
|
||||
if ( ! bootstrapped && paypalLoaded && googlePayLoaded ) {
|
||||
setBootstrapped( true );
|
||||
bootstrap();
|
||||
if ( paypalLoaded && googlePayLoaded && ! manager ) {
|
||||
const ManagerClass = props.isEditing
|
||||
? GooglepayManagerBlockEditor
|
||||
: GooglepayManager;
|
||||
const newManager = new ManagerClass(
|
||||
namespace,
|
||||
buttonConfig,
|
||||
ppcpConfig
|
||||
);
|
||||
setManager( newManager );
|
||||
}
|
||||
}, [ paypalLoaded, googlePayLoaded ] );
|
||||
}, [ paypalLoaded, googlePayLoaded, props.isEditing ] );
|
||||
|
||||
useEffect( () => {
|
||||
if ( manager && ! bootstrapped ) {
|
||||
setBootstrapped( true );
|
||||
manager.init();
|
||||
}
|
||||
}, [ manager, bootstrapped ] );
|
||||
|
||||
return (
|
||||
<div
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue