mirror of
https://github.com/woocommerce/woocommerce-paypal-payments.git
synced 2025-09-05 08:59:14 +08:00
Add the message on load instead of the card fields
This commit is contained in:
parent
22b34503f5
commit
ae3ad55cde
2 changed files with 18 additions and 7 deletions
|
@ -172,7 +172,7 @@ $fast-transition-duration: 0.5s;
|
|||
}
|
||||
|
||||
// 4.7 Validation Error
|
||||
.wc-block-components-validation-error {
|
||||
.wc-block-components-address-form__email .wc-block-components-validation-error {
|
||||
grid-area: error;
|
||||
width: 100%;
|
||||
margin-top: 4px;
|
||||
|
|
|
@ -8,24 +8,35 @@ export const Payment = ( { fastlaneSdk, card, onPaymentLoad } ) => {
|
|||
select( STORE_NAME ).getIsGuest()
|
||||
);
|
||||
|
||||
// Memoized Fastlane card rendering
|
||||
const isEmailLookupCompleted = useSelect( ( select ) =>
|
||||
select( STORE_NAME ).getIsEmailLookupCompleted()
|
||||
);
|
||||
|
||||
const loadPaymentComponent = useCallback( async () => {
|
||||
if ( isGuest ) {
|
||||
if ( isGuest && isEmailLookupCompleted ) {
|
||||
const paymentComponent = await fastlaneSdk.FastlaneCardComponent(
|
||||
{}
|
||||
);
|
||||
paymentComponent.render( `#fastlane-card` );
|
||||
onPaymentLoad( paymentComponent );
|
||||
}
|
||||
}, [ isGuest, fastlaneSdk, onPaymentLoad ] );
|
||||
}, [ isGuest, isEmailLookupCompleted, fastlaneSdk, onPaymentLoad ] );
|
||||
|
||||
useEffect( () => {
|
||||
loadPaymentComponent();
|
||||
}, [ loadPaymentComponent ] );
|
||||
|
||||
return isGuest ? (
|
||||
<div id="fastlane-card" key="fastlane-card" />
|
||||
) : (
|
||||
if ( isGuest ) {
|
||||
if ( isEmailLookupCompleted ) {
|
||||
return <div id="fastlane-card" key="fastlane-card" />;
|
||||
}
|
||||
return (
|
||||
<div id="ppcp-axo-block-radio-content">
|
||||
Enter your email address above to continue.
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<Card
|
||||
card={ card }
|
||||
fastlaneSdk={ fastlaneSdk }
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue