woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-05 08:59:14 +08:00
Code Issues Projects Packages Wiki Activity Actions 11

Merge pull request #2464 from woocommerce/PCP-3374-google-pay-button-not-displayed-in-the-word-press-editor

Browse source 
Fix the Google Pay button in the block Checkout in the editor (3374)
This commit is contained in:
Emili Castells 2024-10-03 10:39:01 +02:00 • committed by GitHub
commit 8592213b9a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 100 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

59
modules/ppcp-googlepay/resources/js/GooglepayManagerBlockEditor.js Normal file
View file

@ -0,0 +1,59 @@
import GooglepayButton from './GooglepayButton';
import ContextHandlerFactory from './Context/ContextHandlerFactory';
class GooglepayManagerBlockEditor {
constructor( buttonConfig, ppcpConfig ) {
this.buttonConfig = buttonConfig;
this.ppcpConfig = ppcpConfig;
this.googlePayConfig = null;
this.transactionInfo = null;
this.contextHandler = null;
}
init() {
( async () => {
await this.config();
} )();
}
async config() {
try {
// Gets GooglePay configuration of the PayPal merchant.
this.googlePayConfig = await ppcpBlocksEditorPaypalGooglepay.Googlepay().config();
// Fetch transaction information.
this.transactionInfo = await this.fetchTransactionInfo();
const button = new GooglepayButton(
this.ppcpConfig.context,
null,
this.buttonConfig,
this.ppcpConfig,
this.contextHandler
);
button.init( this.googlePayConfig, this.transactionInfo );
} catch ( error ) {
console.error( 'Failed to initialize Google Pay:', error );
}
}
async fetchTransactionInfo() {
try {
if ( ! this.contextHandler ) {
this.contextHandler = ContextHandlerFactory.create(
this.ppcpConfig.context,
this.buttonConfig,
this.ppcpConfig,
null
);
}
return null;
} catch ( error ) {
console.error( 'Error fetching transaction info:', error );
throw error;
}
}
}
export default GooglepayManagerBlockEditor;

15
modules/ppcp-googlepay/resources/js/boot-block.js
View file

@ -7,24 +7,29 @@ import { __ } from '@wordpress/i18n';
import { loadPaypalScript } from '../../../ppcp-button/resources/js/modules/Helper/ScriptLoading';
import GooglepayManager from './GooglepayManager';
import { loadCustomScript } from '@paypal/paypal-js';
import GooglepayManagerBlockEditor from './GooglepayManagerBlockEditor';
const ppcpData = wc.wcSettings.getSetting( 'ppcp-gateway_data' );
const ppcpConfig = ppcpData.scriptData;
const buttonData = wc.wcSettings.getSetting( 'ppcp-googlepay_data' );
const buttonConfig = buttonData.scriptData;
const dataNamespace = 'ppcpBlocksEditorPaypalGooglepay';
if ( typeof window.PayPalCommerceGateway === 'undefined' ) {
window.PayPalCommerceGateway = ppcpConfig;
}
const GooglePayComponent = () => {
const GooglePayComponent = ( props ) => {
const [ bootstrapped, setBootstrapped ] = useState( false );
const [ paypalLoaded, setPaypalLoaded ] = useState( false );
const [ googlePayLoaded, setGooglePayLoaded ] = useState( false );
const bootstrap = function () {
const manager = new GooglepayManager( buttonConfig, ppcpConfig );
const ManagerClass = props.isEditing
? GooglepayManagerBlockEditor
: GooglepayManager;
const manager = new ManagerClass( buttonConfig, ppcpConfig );
manager.init();
};
@ -34,6 +39,12 @@ const GooglePayComponent = () => {
setGooglePayLoaded( true );
} );
ppcpConfig.url_params.components += ',googlepay';
if ( props.isEditing ) {
ppcpConfig.data_namespace = dataNamespace;
}
// Load PayPal
loadPaypalScript( ppcpConfig, () => {
setPaypalLoaded( true );