Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 57 58 59 60 61 62 63 64 65 66 | 24x 24x 24x 24x 3x 3x 3x 3x 3x 3x 2x 2x 2x 2x 1x 2x 3x 24x | import { PaymentInitializeOptions } from '@bigcommerce/checkout-sdk';
import { noop } from 'lodash';
import React, { useCallback, FunctionComponent } from 'react';
import { Omit } from 'utility-types';
import WalletButtonPaymentMethod, { WalletButtonPaymentMethodProps } from './WalletButtonPaymentMethod';
export type VisaCheckoutPaymentMethodProps = Omit<WalletButtonPaymentMethodProps, 'buttonId' | 'editButtonClassName' | 'shouldShowEditButton' | 'signInButtonClassName'>;
const VisaCheckoutPaymentMethod: FunctionComponent<VisaCheckoutPaymentMethodProps> = ({
deinitializePayment,
initializePayment,
method,
onUnhandledError = noop,
...rest
}) => {
const initializeVisaCheckoutPayment = useCallback((defaultOptions: PaymentInitializeOptions) => {
const reinitializePayment = async (options: PaymentInitializeOptions) => {
try {
await deinitializePayment({
gatewayId: method.gateway,
methodId: method.id,
});
await initializePayment({
...options,
gatewayId: method.gateway,
methodId: method.id,
});
} catch (error) {
onUnhandledError(error);
}
};
const mergedOptions = {
...defaultOptions,
braintreevisacheckout: {
onError: onUnhandledError,
onPaymentSelect: () => reinitializePayment(mergedOptions),
},
};
return initializePayment(mergedOptions);
}, [
deinitializePayment,
initializePayment,
method,
onUnhandledError,
]);
return (
<WalletButtonPaymentMethod
{ ...rest }
buttonId="walletButton"
deinitializePayment={ deinitializePayment }
editButtonClassName="v-button"
initializePayment={ initializeVisaCheckoutPayment }
method={ method }
shouldShowEditButton
signInButtonClassName="v-button"
/>
);
};
export default VisaCheckoutPaymentMethod;
|