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

♻️ Extract the GooglePayPreviewButton to own file

Browse source 
Also note the change in line 43 (new file) where we use `new GooglepayButton` instead of `GooglepayButton.createButton`
This commit is contained in:
Philipp Stracker 2024-08-08 14:09:43 +02:00
parent 844cafd9cb
commit 4ca309768e
No known key found for this signature in database
2 changed files with 71 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

68
modules/ppcp-googlepay/resources/js/GooglepayPreviewButton.js Normal file
View file

@ -0,0 +1,68 @@
import PreviewButton from '../../../ppcp-button/resources/js/modules/Renderer/PreviewButton';
import ContextHandlerFactory from './Context/ContextHandlerFactory';
import GooglepayButton from './GooglepayButton';
/**
* A single GooglePay preview button instance.
*/
export default class GooglePayPreviewButton extends PreviewButton {
constructor( args ) {
super( args );
this.selector = `${ args.selector }GooglePay`;
this.defaultAttributes = {
button: {
style: {
type: 'pay',
color: 'black',
language: 'en',
},
},
};
}
createNewWrapper() {
const element = super.createNewWrapper();
element.addClass( 'ppcp-button-googlepay' );
return element;
}
createButton( buttonConfig ) {
const contextHandler = ContextHandlerFactory.create(
'preview',
buttonConfig,
this.ppcpConfig,
null
);
/* Intentionally using `new` keyword, instead of the `.createButton()` factory,
* as the factory is designed to only create a single button per context, while a single
* page can contain multiple instances of a preview button.
*/
const button = new GooglepayButton(
'preview',
null,
buttonConfig,
this.ppcpConfig,
contextHandler
);
button.configure( this.apiConfig, null );
button.init();
}
/**
* Merge form details into the config object for preview.
* Mutates the previewConfig object; no return value.
*
* @param {Object} buttonConfig
* @param {Object} ppcpConfig
*/
dynamicPreviewConfig( buttonConfig, ppcpConfig ) {
// Merge the current form-values into the preview-button configuration.
if ( ppcpConfig.button && buttonConfig.button ) {
Object.assign( buttonConfig.button.style, ppcpConfig.button.style );
}
}
}

68
modules/ppcp-googlepay/resources/js/boot-admin.js
View file

@ -1,7 +1,5 @@
import GooglepayButton from './GooglepayButton';
import PreviewButton from '../../../ppcp-button/resources/js/modules/Renderer/PreviewButton';
import PreviewButtonManager from '../../../ppcp-button/resources/js/modules/Renderer/PreviewButtonManager';
import ContextHandlerFactory from './Context/ContextHandlerFactory';
import GooglePayPreviewButton from './GooglepayPreviewButton';
/**
* Accessor that creates and returns a single PreviewButtonManager instance.
@ -33,7 +31,7 @@ class GooglePayPreviewButtonManager extends PreviewButtonManager {
* method.
*
* @param {{}} payPal - The PayPal SDK object provided by WidgetBuilder.
* @return {Promise<{}>}
* @return {Promise<{}>} Promise that resolves when API configuration is available.
*/
async fetchConfig( payPal ) {
const apiMethod = payPal?.Googlepay()?.config;
@ -59,7 +57,7 @@ class GooglePayPreviewButtonManager extends PreviewButtonManager {
* This method is responsible for creating a new PreviewButton instance and returning it.
*
* @param {string} wrapperId - CSS ID of the wrapper element.
* @return {GooglePayPreviewButton}
* @return {GooglePayPreviewButton} The new preview button instance.
*/
createButtonInstance( wrapperId ) {
return new GooglePayPreviewButton( {
@ -69,65 +67,5 @@ class GooglePayPreviewButtonManager extends PreviewButtonManager {
}
}
/**
* A single GooglePay preview button instance.
*/
class GooglePayPreviewButton extends PreviewButton {
constructor( args ) {
super( args );
this.selector = `${ args.selector }GooglePay`;
this.defaultAttributes = {
button: {
style: {
type: 'pay',
color: 'black',
language: 'en',
},
},
};
}
createNewWrapper() {
const element = super.createNewWrapper();
element.addClass( 'ppcp-button-googlepay' );
return element;
}
createButton( buttonConfig ) {
const contextHandler = ContextHandlerFactory.create(
'preview',
buttonConfig,
this.ppcpConfig,
null
);
const button = GooglepayButton.createButton(
'preview',
null,
buttonConfig,
this.ppcpConfig,
contextHandler
);
button.configure( this.apiConfig, null );
button.init();
}
/**
* Merge form details into the config object for preview.
* Mutates the previewConfig object; no return value.
* @param buttonConfig
* @param ppcpConfig
*/
dynamicPreviewConfig( buttonConfig, ppcpConfig ) {
// Merge the current form-values into the preview-button configuration.
if ( ppcpConfig.button && buttonConfig.button ) {
Object.assign( buttonConfig.button.style, ppcpConfig.button.style );
}
}
}
// Initialize the preview button manager.
buttonManager();