with checkout intent quick checkout not opening

import React, { useEffect, useState } from 'react';
import { FlatList, StyleSheet, TouchableOpacity, View } from 'react-native';
import { usePaymentGatewayMutation } from '../../../../redux/api/paymentGateway/paymentGateway.api';
import { textScale } from '../../../../styles/responsiveStyles';
import { spacing } from '../../../../styles/spacing';
import { fontNames } from '../../../../styles/typography';
import Strings from '../../../../translation/language';
import colors from '../../../../utility/colors';
import { APP_PADDING_HORIZONTAL, CURRENCY, STATUS_BAR_CONSTANTS } from '../../../../utility/constants';
import { Images } from '../../../../utility/imagePaths';
import CommonButton from '../../../common/buttons/CommonButton';
import CommonHeader from '../../../common/header/CommonHeader';
import RegularText from '../../../common/RegularText';
import WalletFloatingCardComponent from '../../../modules/WalletFloatingCardComponent';
import {
    // CFCallback,
    // CFErrorResponse,
    CFPaymentGatewayService,
} from 'react-native-cashfree-pg-sdk';
import {
    CFDropCheckoutPayment,
    CFEnvironment,
    CFPaymentComponentBuilder,
    CFPaymentModes,
    CFSession,
    CFThemeBuilder,
} from 'cashfree-pg-api-contract';
import { navigate } from '../../../../utility/commonFunctions';

function RenderAddMoneySuggestions({ onPressSuggestedValue }) {

    const data = [
        { label: `${CURRENCY} 10.00`, value: 10 },
        { label: `${CURRENCY} 20.00`, value: 20 },
        { label: `${CURRENCY} 50.00`, value: 50 },
        { label: `${CURRENCY} 100.00`, value: 100 },
        { label: `${CURRENCY} 150.00`, value: 150 },
        { label: `${CURRENCY} 200.00`, value: 200 },
        { label: `${CURRENCY} 250.00`, value: 250 },
        { label: `${CURRENCY} 300.00`, value: 300 },
    ]

    return (
        // <View  >
        <FlatList
            data={data}
            renderItem={({ item, index }) => {
                return (
                    <TouchableOpacity
                        onPress={() => onPressSuggestedValue(item)}
                        style={[styles.renderAddMoneySuggestionsRowMainContainer, data.length == (index + 1) && { marginRight: 0 }]}
                    >
                        <RegularText style={styles.suggestionAmountText} >{item.label}</RegularText>
                    </TouchableOpacity>
                )
            }}
            horizontal
            showsHorizontalScrollIndicator={false}
        // style={{ marginHorizontal: -APP_PADDING_HORIZONTAL }}
        />
        // </View>
    )
}

const AddMoney = ({ }) => {

    const [money, setMoney] = useState(`${CURRENCY} `)

    const [paymentGateway] = usePaymentGatewayMutation()

    useEffect(() => {
        console.log('MOUNTED');
        CFPaymentGatewayService.setEventSubscriber({
            onReceivedEvent(eventName, map) {
                console.log('Event recieved on screen: ' +
                    eventName +
                    ' map: ' +
                    JSON.stringify(map));
            },
        });
        CFPaymentGatewayService.setCallback({
            onVerify(orderID) {
                console.log('orderId is :' + orderID);
            },
            onError(error, orderID) {
                console.log('exception is : ' + JSON.stringify(error) + '\norderId is :' + orderID);
            },
        });

        return () => {
            console.log('UNMOUNTED');
            CFPaymentGatewayService.removeCallback();
            CFPaymentGatewayService.removeEventSubscriber();
        }
    }, [])

    function onChangeMoney(money) {
        if (money == CURRENCY) return
        setMoney(`${money}`)
    }

    function onPressSuggestedValue(item) {
        setMoney(` ${item.value}`)
    }

    async function onPressAddMoney() {
        const payload = {
            customer_details: {
                customer_id: JSON.stringify(Date.now()),
                customer_email: "tesdwst@gmail.com",
                customer_phone: "8983980024"
            },
            order_amount: parseInt(money),
            order_currency: "INR",
            order_id: `order_${JSON.stringify(Date.now())}`
        }
        try {
            const paymentGatewayRes = await paymentGateway(payload)
            console.log(paymentGatewayRes);

            const session = new CFSession(paymentGatewayRes?.data?.payment_session_id, paymentGatewayRes?.data?.order_id, CFEnvironment.SANDBOX);
            const paymentModes = new CFPaymentComponentBuilder()
                .add(CFPaymentModes.CARD)
                .add(CFPaymentModes.UPI)
                .add(CFPaymentModes.WALLET)
                .build();
            const theme = new CFThemeBuilder()
                .setNavigationBarBackgroundColor(colors.theme)
                .setNavigationBarTextColor('#FFFFFF')
                .setButtonBackgroundColor(colors.theme)
                .setButtonTextColor('#FFFFFF')
                .setPrimaryTextColor('#212121')
                .setSecondaryTextColor('#757575')
                .build();
            const dropPayment = new CFDropCheckoutPayment(session, paymentModes, theme);
            CFPaymentGatewayService.doPayment(dropPayment);
            console.log(JSON.stringify(dropPayment));
        }
        catch (e) {
            console.log(e.message);
        }
    }

    return (
        <View style={styles.mainContainer} >
            <CommonHeader backgroundColor={colors.theme} hideWallet={true} backArrowTintColor={colors.white} statusBartheme={STATUS_BAR_CONSTANTS.LIGHT} />
            <WalletFloatingCardComponent
                title={Strings.my_wallet}
                subTitle={Strings.total_balance}
                hasAddMoneyButton={true}
                icon={Images.IMG_MY_WALLET}
                hasAddMoneyComponent
                // money={(userWalletRes?.data?.bonusMoney + userWalletRes?.data?.redeemableMoney)}
                // onPressAddMoney={onPressAddMoney}
                money={`${money}`}
                onChangeMoney={onChangeMoney}
                addMoneyPlaceholder={`${CURRENCY} Amount`}
                bottomComponent={<RenderAddMoneySuggestions onPressSuggestedValue={onPressSuggestedValue} />}
            />
            <View style={{ flex: 1 }} />
            <CommonButton
                title={'Add money'}
                buttonStyle={styles.buttonStyle}
                onPressButton={onPressAddMoney}
            />
        </View>
    )
}

const styles = StyleSheet.create({
    mainContainer: {
        flex: 1
    },
    renderAddMoneySuggestionsRowMainContainer: {
        borderWidth: spacing.WIDTH_1,
        borderColor: colors.grey300,
        borderRadius: spacing.RADIUS_90,
        paddingHorizontal: spacing.PADDING_12,
        paddingVertical: spacing.PADDING_6,
        marginRight: spacing.MARGIN_8
    },
    suggestionAmountText: {
        fontSize: textScale(14),
        fontFamily: fontNames.OPEN_SANS_MEDIUM

    },
    buttonStyle: {
        marginHorizontal: APP_PADDING_HORIZONTAL,
        marginVertical: spacing.MARGIN_20
    }
})

export default AddMoney;``
System: OS: Windows 10 10.0.22621 CPU: (8) x64 Intel(R) Core(TM) i5-10300H CPU @ 2.50GHz Memory: 550.82 MB / 7.84 GB Binaries: Node: 16.17.1 - C:\Program Files\nodejs\node.EXE Yarn: Not Found npm: 8.19.2 - C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: Not Found Windows SDK: Not Found IDEs: Android Studio: Not Found Visual Studio: Not Found Languages: Java: 11.0.16.1 npmPackages: @react-native-community/cli: Not Found react: 18.1.0 => 18.1.0 react-native: 0.70.2 => 0.70.2 react-native-windows: Not Found npmGlobalPackages: react-native: Not Found
cashfree / react-native-cashfree-pg-sdk

with checkout intent quick checkout not opening #21
