React Native Deck Swiper onTapCard

Question

I would like to know how can I get the index of the card that is displayed when I click on a button that is outside of the swiper component using ref and current. I managed to get the cards swiping by clicking on a button but now I want to get the index of the current card when I click on a button. Below is my code:

<View style={[tw('flex-1 -mt-6'), {}]}>
                <Swiper
                    ref={swipeRef}
                    containerStyle={{ backgroundColor: 'transparent' }}
                    stackSize={3}
                    cardIndex={0}
                    animateCardOpacity
                    verticalSwipe={false}
                    onSwipedRight={(index) => match(index)}
                    onTapCard={(index)=> openSheet(index)}
                    overlayLabels={{
                        left: {
                            title: 'NOPE',
                            style: {
                                label: {
                                    textAlign: 'right',
                                    color: 'red',
                                    borderWidth: 3,
                                    borderColor: 'red',
                                    margin: 10,
                                    alignSelf: 'flex-end'
                                },
                            },
                        },
                        right: {
                            title: 'LIKE',
                            style: {
                                label: {
                                    color: '#00FF00',
                                    borderWidth: 3,
                                    borderColor: '#00FF00',
                                    margin: 10,
                                    alignSelf: 'flex-start'
                                },
                            },
                        },
                    }}
                    cards={dates}
                    renderCard={(card) => (
                        <>
                        <View key={card.id} style={tw('relative bg-white h-3/4 rounded-xl')}>
                            <Image
                                style={tw('absolute top-0 h-full w-full rounded-xl')}
                                source={{ uri: `${picUrl}/assets/images/${card.gallery[0].image}` }}
                            />
                            <View style={[tw('absolute bottom-0 bg-white w-full flex-row justify-between items-center h-20 px-6 py-2 rounded-b-xl'), styles.cardShadow]}>
                                <View>
                                    <Text style={tw('text-xl font-bold')}>{card.name}</Text>
                                    <Text>{card.course}</Text>
                                </View>
                                <Text style={tw('text-xl font-bold')}>{moment().diff(card.dob, 'years',false)}</Text>
                            </View>
                        </View>
                        </>
                    )}
                />
            </View>

            <View style={tw('flex flex-row justify-evenly items-center my-10')}>
                <TouchableOpacity
                    style={tw('items-center justify-center')}
                    onPress={() => swipeRef.current.swipeLeft()}
                >
                    <Ionicons name='close-circle-outline' size={80} color='red' />
                </TouchableOpacity>
                <TouchableOpacity
                    style={tw('items-center justify-center')}
                    onPress={() => swipeRef.current.onTapCard()}
                >
                    <Ionicons name='information-circle-outline' size={50} color='grey' />
                </TouchableOpacity>
                <TouchableOpacity
                    style={tw('items-center justify-center')}
                    onPress={() => swipeRef.current.swipeRight()}
                >
                    <Ionicons name='heart-circle-outline' size={80} color='green' />
                </TouchableOpacity>
            </View>