woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-06 18:16:38 +08:00
Code Issues Projects Packages Wiki Activity Actions

Refactor the change shipping address and change card buttons to a more modular structure

Browse source
This commit is contained in:
Daniel Dudzic 2024-09-13 17:27:39 +02:00
parent 3315fbe116
commit 90aa261c8b
No known key found for this signature in database
GPG key ID: 31B40D33E3465483
27 changed files with 118 additions and 315 deletions
Download patch file Download diff file Expand all files Collapse all files

131
modules/ppcp-axo-block/resources/js/components/email-button/utils.js
View file

@ -1,131 +0,0 @@
import { createElement, createRoot } from '@wordpress/element';
import { STORE_NAME } from '../../stores/axoStore';
import { EmailButton } from './EmailButton';
let emailInput = null;
let submitButtonReference = {
container: null,
root: null,
unsubscribe: null,
};
let keydownHandler = null;
const getEmailInput = () => {
if ( ! emailInput ) {
emailInput = document.getElementById( 'email' );
}
return emailInput;
};
const setupEmailFunctionality = ( onEmailSubmit ) => {
const input = getEmailInput();
if ( ! input ) {
console.warn(
'Email input element not found. Functionality not added.'
);
return;
}
const handleEmailSubmit = async () => {
const isEmailSubmitted = wp.data
.select( STORE_NAME )
.isEmailSubmitted();
if ( isEmailSubmitted || ! input.value ) {
return;
}
wp.data.dispatch( STORE_NAME ).setIsEmailSubmitted( true );
renderButton();
try {
await onEmailSubmit( input.value );
} catch ( error ) {
console.error( 'Error during email submission:', error );
} finally {
wp.data.dispatch( STORE_NAME ).setIsEmailSubmitted( false );
renderButton();
}
};
keydownHandler = ( event ) => {
const isAxoActive = wp.data.select( STORE_NAME ).getIsAxoActive();
if ( event.key === 'Enter' && isAxoActive ) {
event.preventDefault();
handleEmailSubmit();
}
};
input.addEventListener( 'keydown', keydownHandler );
// Set up submit button
if ( ! submitButtonReference.container ) {
submitButtonReference.container = document.createElement( 'div' );
submitButtonReference.container.setAttribute(
'class',
'wc-block-axo-email-submit-button-container'
);
input.parentNode.insertBefore(
submitButtonReference.container,
input.nextSibling
);
submitButtonReference.root = createRoot(
submitButtonReference.container
);
}
const renderButton = () => {
if ( submitButtonReference.root ) {
submitButtonReference.root.render(
createElement( EmailButton, {
handleSubmit: handleEmailSubmit,
} )
);
} else {
console.warn( 'Submit button root not found' );
}
};
renderButton();
// Subscribe to state changes
submitButtonReference.unsubscribe = wp.data.subscribe( () => {
renderButton();
} );
};
const removeEmailFunctionality = () => {
const input = getEmailInput();
if ( input && keydownHandler ) {
input.removeEventListener( 'keydown', keydownHandler );
}
if ( submitButtonReference.root ) {
submitButtonReference.root.unmount();
}
if ( submitButtonReference.unsubscribe ) {
submitButtonReference.unsubscribe();
}
if (
submitButtonReference.container &&
submitButtonReference.container.parentNode
) {
submitButtonReference.container.parentNode.removeChild(
submitButtonReference.container
);
}
submitButtonReference = { container: null, root: null, unsubscribe: null };
keydownHandler = null;
};
const isEmailFunctionalitySetup = () => {
return !! submitButtonReference.root;
};
export {
setupEmailFunctionality,
removeEmailFunctionality,
isEmailFunctionalitySetup,
};