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

Move card details and shipping address to the Redux store

Browse source
This commit is contained in:
Daniel Dudzic 2024-09-24 02:09:38 +02:00
parent 75960fc4a4
commit 5a31fdd183
No known key found for this signature in database
GPG key ID: 31B40D33E3465483
6 changed files with 122 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,4 +1,5 @@
import { useState } from '@wordpress/element';
import { useSelect } from '@wordpress/data';
import { registerPaymentMethod } from '@woocommerce/blocks-registry';
// Hooks
@ -13,6 +14,9 @@ import useHandlePaymentSetup from './hooks/useHandlePaymentSetup';
import { Payment } from './components/Payment/Payment';
import usePaymentSetupEffect from './hooks/usePaymentSetupEffect';
// Store
import { STORE_NAME } from './stores/axoStore';
const gatewayHandle = 'ppcp-axo-gateway';
const ppcpConfig = wc.wcSettings.getSetting( `${ gatewayHandle }_data` );
@ -25,16 +29,20 @@ const axoConfig = window.wc_ppcp_axo;
const Axo = ( props ) => {
const { eventRegistration, emitResponse } = props;
const { onPaymentSetup } = eventRegistration;
const [ shippingAddress, setShippingAddress ] = useState( null );
const [ card, setCard ] = useState( null );
const [ paymentComponent, setPaymentComponent ] = useState( null );
const { cardDetails } = useSelect(
( select ) => ( {
cardDetails: select( STORE_NAME ).getCardDetails(),
} ),
[]
);
const fastlaneSdk = useFastlaneSdk( axoConfig, ppcpConfig );
const tokenizedCustomerData = useTokenizeCustomerData();
const onChangeCardButtonClick = useCardChange( fastlaneSdk, setCard );
const onChangeCardButtonClick = useCardChange( fastlaneSdk );
const handlePaymentSetup = useHandlePaymentSetup(
emitResponse,
card,
paymentComponent,
tokenizedCustomerData
);
@ -43,9 +51,7 @@ const Axo = ( props ) => {
ppcpConfig,
fastlaneSdk,
paymentComponent,
onChangeCardButtonClick,
setShippingAddress,
setCard
onChangeCardButtonClick
);
const { handlePaymentLoad } = usePaymentSetupEffect(
@ -56,22 +62,15 @@ const Axo = ( props ) => {
useAxoCleanup();
const handleCardChange = ( selectedCard ) => {
console.log( 'Card selection changed', selectedCard );
setCard( selectedCard );
};
console.log( 'Rendering Axo component', {
fastlaneSdk,
card,
shippingAddress,
} );
return fastlaneSdk ? (
<Payment
fastlaneSdk={ fastlaneSdk }
card={ card }
onChange={ handleCardChange }
card={ cardDetails }
onChange={ onChangeCardButtonClick }
onPaymentLoad={ handlePaymentLoad }
onChangeButtonClick={ onChangeCardButtonClick }
/>