Confirmation page is not showing in Google pay integration in React

Question

I am implementing Google pay button with @google-pay/button-react this package, but when i click on "Continue" button pop-up closes. I need to display price confirmation page with email etc. Here is my code, Please let me know what i am doing wrong here is my code:

<GooglePayButton
    environment="TEST"
    paymentRequest={{
        apiVersion: 2,
        apiVersionMinor: 0,
        allowedPaymentMethods: [
            {
                type: 'CARD',
                parameters: {
                    allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
                    allowedCardNetworks: ['MASTERCARD', 'VISA'],
                },
                tokenizationSpecification: {
                    type: 'PAYMENT_GATEWAY',
                    parameters: {
                        gateway: "moneris",
                        gatewayMerchantId: "monca05217"
                    },
                },
            },
        ],
        merchantInfo: {
            merchantId: '12345678901234567890',
            merchantName: 'Demo Merchant',
        },
        transactionInfo: {
            totalPriceStatus: 'FINAL',
            totalPriceLabel: 'Total',
            totalPrice: '50.00',
            currencyCode: 'USD',
            countryCode: 'US',
        },
    }}
    onLoadPaymentData={paymentRequest => {
        console.log('load payment data', paymentRequest);
        props.cardDetail(paymentRequest,endDate);                                        
    }}                                    
    />

Answer 1

I'm not sure if I understand what you are trying to do, but the expected behavior is for the payment sheet to close after you click on continue.

If you want Google Pay to display the total price, one way you can achieve this by handling the payment authorized callback:

1. Add callbackIntents: ['PAYMENT_AUTHORIZATION'] to paymentRequest,
2. Implement onPaymentAuthorized callback.

If you want the user's email, add emailRequired: true to paymentRequest.

Example (https://jsfiddle.net/h1w5c0vk/):

<GooglePayButton
    paymentRequest={{
        // ...
        callbackIntents: ['PAYMENT_AUTHORIZATION'],
        emailRequired: true,
    }}
    onPaymentAuthorized={() => ({ transactionState: 'SUCCESS' })}
    />