react-native-google-places-autocomplete not working on React native 0.61

I have added react-native-google-places-autocomplete with yarn in my react-native cli project but it is not working. Here are the issues I am facing at the moment.

1. the places drop down is not showing up on IOS, however the input text field allows me to enter a place name but the predictions list does not appear

2. onPress handler is not triggered at all on both IOS and android

3. The Text Input coming from react-native-google-places-autocomplete does not allow me to enter anything on ANDROID. It is like disabled all the time ( although the focus is set to true)

Note: all google location apis are enabled , google maps api, places api and geocode api are enabled and a valid api key is given.

I tried all possible solutions available including the following:

1. setting zIndex: 1000 a high value to avoid it being hidden behind some other view

2. Tried creating new RN App and added only this component to keep the project clean

3. Regenerating the API and even using another api which works with previous versions of REACT NATIVE.

The logs don't show anything on both Xcode and Android Studio. Here is the code snippet:

<View style = {[{zIndex: 2, backgroundColor: 'white'}]}><GooglePlacesAutocomplete                    ref = {ref => setSearchTextRef(ref)}                    placeholder='Search for gym'                    styles={{                        container: {backgroundColor: 'transparent'},                        textInputContainer: styles.viewStyle,                        textInput: styles.textInputStyle,                    }}                    keyboardShouldPersistTaps = {'handled'}                    listUnderlayColor = {'transparent'}                    textInputProps = {{                        onFocus: () => focusInput(),                        onBlur: () => blurInput(),                        onChangeText: (text) => onChange(text)                    }}                    minLength={1} // minimum length of text to search                    returnKeyType={'search'}                    listViewDisplayed={'auto'}   // true/false/undefined                    fetchDetails={true}                    renderDescription={row => row.description} // custom description render                    onPress={(data, details = null) => {                        let coordinates = details.geometry.location;                        sendCoordinates(coordinates, {data, details});                    }}                    getDefaultValue={() => ''}                    query={{                        key: googleAPIKey,                        language: 'en', // language of the results                        // types: '(cities)' // default: 'geocode'                    }}                    nearbyPlacesAPI='GooglePlacesSearch' // Which API to use: GoogleReverseGeocoding or GooglePlacesSearch                    GooglePlacesSearchQuery={{                        rankby: 'distance',                        types: 'gym'                    }}                    filterReverseGeocodingByTypes={['locality', 'administrative_area_level_3']}                     debounce={200}                /></View>

Thank you in advance