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 7

Axo Block: Correctly reset setIsEmailLookupCompleted state when a different payment method gets selected

Browse source
This commit is contained in:
Daniel Dudzic 2024-10-04 16:13:05 +02:00
parent 12fc44eaa7
commit 769cd3c3f7
No known key found for this signature in database
GPG key ID: 31B40D33E3465483
2 changed files with 22 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

31
modules/ppcp-axo-block/resources/js/components/Payment/Payment.js
View file

@ -1,6 +1,7 @@
import { useEffect, useCallback, useState } from '@wordpress/element';
import { useSelect } from '@wordpress/data';
import { __ } from '@wordpress/i18n';
import { log } from '../../../../../ppcp-axo/resources/js/Helper/Debug';
import { Card } from '../Card';
import { STORE_NAME } from '../../stores/axoStore';
@ -39,14 +40,18 @@ export const Payment = ( { fastlaneSdk, onPaymentLoad } ) => {
( isGuest && isEmailLookupCompleted && isCardElementReady ) ||
( ! isGuest && ! cardDetails )
) {
const paymentComponent = await fastlaneSdk.FastlaneCardComponent(
{}
);
// Check if the container exists before rendering
const cardContainer = document.querySelector( '#fastlane-card' );
if ( cardContainer ) {
paymentComponent.render( `#fastlane-card` );
onPaymentLoad( paymentComponent );
try {
const paymentComponent =
await fastlaneSdk.FastlaneCardComponent( {} );
// Check if the container exists before rendering
const cardContainer =
document.querySelector( '#fastlane-card' );
if ( cardContainer ) {
paymentComponent.render( '#fastlane-card' );
onPaymentLoad( paymentComponent );
}
} catch ( error ) {
log( `Error loading payment component: ${ error }`, 'error' );
}
}
}, [
@ -65,10 +70,12 @@ export const Payment = ( { fastlaneSdk, onPaymentLoad } ) => {
}
}, [ isGuest, isEmailLookupCompleted ] );
// Load payment component when dependencies change
// Load payment component when card element is ready
useEffect( () => {
loadPaymentComponent();
}, [ loadPaymentComponent ] );
if ( isCardElementReady ) {
loadPaymentComponent();
}
}, [ isCardElementReady, loadPaymentComponent ] );
/**
* Determines which component to render based on the current state.
@ -99,7 +106,7 @@ export const Payment = ( { fastlaneSdk, onPaymentLoad } ) => {
( isGuest && isEmailLookupCompleted ) ||
( ! isGuest && ! cardDetails )
) {
return <div id="fastlane-card" key="fastlane-card" />;
return <div id="fastlane-card" />;
}
// Case 4: Authenticated user with card details

4
modules/ppcp-axo-block/resources/js/hooks/useAxoCleanup.js
View file

@ -18,7 +18,8 @@ import useCustomerData from './useCustomerData';
*/
const useAxoCleanup = () => {
// Get dispatch functions from the AXO store
const { setIsAxoActive, setIsGuest } = useDispatch( STORE_NAME );
const { setIsAxoActive, setIsGuest, setIsEmailLookupCompleted } =
useDispatch( STORE_NAME );
// Get functions to update WooCommerce shipping and billing addresses
const {
@ -45,6 +46,7 @@ const useAxoCleanup = () => {
// Reset AXO state
setIsAxoActive( false );
setIsGuest( true );
setIsEmailLookupCompleted( false );
// Remove AXO UI elements
removeShippingChangeButton();