All files / app/payment/paymentMethod PaypalPaymentsProPaymentMethod.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
24x
 
24x
24x
 
24x
24x
 
24x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
24x
2x
2x
 
2x
1x
 
 
1x
 
 
 
 
 
2x
2x
 
2x
2x
2x
 
2x
 
 
 
 
 
 
24x
 
import React, { FunctionComponent } from 'react';
 
import { withCheckout, CheckoutContextProps } from '../../checkout';
import { EMPTY_ARRAY } from '../../common/utility';
 
import HostedCreditCardPaymentMethod, { HostedCreditCardPaymentMethodProps } from './HostedCreditCardPaymentMethod';
import HostedPaymentMethod, { HostedPaymentMethodProps } from './HostedPaymentMethod';
import { PaymentMethodProps } from './PaymentMethod';
import PaymentMethodProviderType from './PaymentMethodProviderType';
 
export type PaypalPaymentsProPaymentMethodProps = HostedPaymentMethodProps | HostedCreditCardPaymentMethodProps;
 
interface WithCheckoutPaypalPaymentsProPaymentMethodProps {
    isHostedPayment: boolean;
}
 
/**
 * Paypal Payments Pro is a snowflake payment method - it can be a hosted
 * payment method or a credit card payment method depending on where the
 * checkout process is initiated. If it is started from the cart page via the
 * PayPal button, it behaves as a hosted payment method. But if it is started
 * from the checkout page, it behaves as a credit card payment method.
 */
const PaypalPaymentsProPaymentMethod: FunctionComponent<
    PaypalPaymentsProPaymentMethodProps &
    WithCheckoutPaypalPaymentsProPaymentMethodProps
> = ({
    isHostedPayment,
    ...props
}) => {
    if (isHostedPayment) {
        return <HostedPaymentMethod { ...props } />;
    }
 
    return (
        <HostedCreditCardPaymentMethod { ...props } />
    );
};
 
function mapToPaypalPaymentsProPaymentMethodProps(
    { checkoutState }: CheckoutContextProps,
    { method }: PaymentMethodProps
): WithCheckoutPaypalPaymentsProPaymentMethodProps {
    const { data: { getCheckout } } = checkoutState;
    const { payments = EMPTY_ARRAY } = getCheckout() || {};
    const selectedHostedMethod = payments.find(({ providerType }) => providerType === PaymentMethodProviderType.Hosted);
 
    return {
        isHostedPayment: selectedHostedMethod ?
            selectedHostedMethod.providerId === method.id && selectedHostedMethod.gatewayId === method.gateway :
            false,
    };
}
 
export default withCheckout(mapToPaypalPaymentsProPaymentMethodProps)(PaypalPaymentsProPaymentMethod);