How to get onPress event of multiple touchable components that are placed inside the view of custom Marker or Callout?

Question

I am trying to place 2 touchable components inside the custom view of a Marker and Callout. I am not able to get the onPress events of the 2 individual touchable components. I get the onPress of the marker and callout but I cannot get the onPress of the individual touchable component.

Is there a way I can get the onPress event of each touchable component placed inside the custom view?

I use react-native-maps v0.24.2, react-native v0.59.9

This is the code with callout

              <Marker
                coordinate={Coordinates}
              >
                <Callout>
                  <View style={{ width: 200, height: 80, backgroundColor: 'white', borderRadius: 3, }}>
                    <View style={{ alignItems: 'center', justifyContent: 'center', }}>
                      <TouchableOpacity
                        style={{ height: '50%', width: '100%', justifyContent: 'center', alignItems: 'center' }}
                        onPress={() => { alert('Cicked one') }}
                      >
                        <Text style={styles.popOverText}>Click one</Text>
                      </TouchableOpacity>
                      <View style={{ backgroundColor: colors.grey_lbl, width: '85%', height: 1 }} />
                      <TouchableOpacity
                        style={{ height: '50%', width: '100%', justifyContent: 'center', alignItems: 'center' }}
                        onPress={() => alert('Click 2')}
                      >
                        <Text style={styles.popOverText}>Click Two</Text>
                      </TouchableOpacity>
                    </View>
                    <View style={[styles.triangle, { alignSelf: 'center' }]} />
                  </View>
                </Callout>
              </Marker>

This is the code for Custom Marker

             <Marker
                coordinate={this.state.createPoiCoordinates}
              >
                <View style={[{
                  width: 200, height: 80, backgroundColor: 'white', borderRadius: 3,

                }]}>
                  <View style={{ alignItems: 'center', justifyContent: 'center', }}>
                    <TouchableOpacity
                      style={{ height: '50%', width: '100%', justifyContent: 'center', alignItems: 'center' }}
                      onPress={() => { alert('Cicked one') }}
                    >
                      <Text style={styles.popOverText}>Click one</Text>
                    </TouchableOpacity>
                    <View style={{ backgroundColor: colors.grey_lbl, width: '85%', height: 1 }} />
                    <TouchableOpacity
                      style={{ height: '50%', width: '100%', justifyContent: 'center', alignItems: 'center' }}
                      onPress={() => alert('Click 2')}
                    >
                      <Text style={styles.popOverText}>Click Two</Text>
                    </TouchableOpacity>
                  </View>
                  <View style={[styles.triangle, { alignSelf: 'center' }]} />
                </View>
              </Marker>