Integrating a Countdown timer inside an alert pop up

Question

I am working with react native to develop an App. I would like to implement a down counter in alert pop up in my screen. Here is my code of Alert() :

import CountdownCircle from 'react-native-countdown-circle';

onPressEnter() {
    // Works on both iOS and Android
    Alert.alert(
        'Attention',
        'This is a test!',
        [
            {text: 'cancel', onPress: () => console.log('Cancel Pressed'), style: 'cancel'},
        ],
        { cancelable: false }
    )
}

Here is my down counter code:

<CountdownCircle
    seconds={10}
    radius={30}
    borderWidth={8}
    color="#ff003f"
    bgColor="#fff"
    textStyle={{ fontSize: 20 }}
    onTimeElapsed={() => console.log('Elapsed!')}
/>

I tried to put the CountdownCircle inside the onPressEnter() (which my alert is located) but, I either got a token error or It shows me nothing. Is there any trick for implementing that guys? Is it possible to implement that?

Answer 1

I may be too late, but how I implemented my Countdown circle, was to render it inside a MODAL component. It works like a charm. just Call your inside the Modal and it would do something similar hopefully.