React Native: @react-native-voice/voice not working, not showing any response or results

Question

Does anyone know what could be the issue?

Previously, I was using @react-native-community/voice and it was working. But as I continue developing the application and come back to test the function, it is not working anymore. When I click on the button which initiates Voice.Start(), nothing happened. I thought it could be because it is obsolete. So I changed to @react-native-voice/voice but it is still not working. I tried reinstalling node-module, cleaning the gradle ./gradlew clean but it still doesn't work.

Below is the code I used which was working, but now it isn't. I got this code from the example shown in the @react-native-community/voice example code:

import Voice, {
  SpeechRecognizedEvent,
  SpeechResultsEvent,
  SpeechErrorEvent,} 
from '@react-native-voice/voice';
class VoiceTest extends Component{
    
constructor(props) {
  super(props);
  this.state = {
    pitch: '',
    error: '',
    end: '',
    started: '',
    results: [],
    partialResults: [],
    recognized: '',      
  }

  Voice.onSpeechStart = this.onSpeechStart;
  Voice.onSpeechEnd = this.onSpeechEnd;
  Voice.onSpeechError = this.onSpeechError;
  Voice.onSpeechResults = this.onSpeechResults;
  Voice.onSpeechPartialResults = this.onSpeechPartialResults;
  Voice.onSpeechVolumeChanged = this.onSpeechVolumeChanged;

}

componentWillUnmount() {
  Voice.destroy().then(Voice.removeAllListeners);
}

onSpeechStart = (e) => {
  console.log('onSpeechStart: ', e);
};

onSpeechEnd = (e) => {
  console.log('onSpeechEnd: ', e);
};

onSpeechError = (e) => {
  console.log('onSpeechError: ', e);
};

onSpeechResults = (e) => {
  console.log('onSpeechResults: ', e);
};

onSpeechPartialResults = (e) => {
  console.log('onSpeechPartialResults: ', e);
};

onSpeechVolumeChanged = (e) => {
  console.log('onSpeechVolumeChanged: ', e);
};

_startRecognizing = async () =>  {
  this.setState({
    recognized: '',
    pitch: '',
    error: '',
    started: '',
    results: [],
    partialResults: [],
    end: '',
  });

  try {
  await Voice.start('en-US');
};

_stopRecognizing = async () => {
  await Voice.stop();
};

_cancelRecognizing = async () =>{
  await Voice.cancel();
};

_destroyRecognizer = async () => {
  await Voice.destroy();
  this.setState({
    recognized: '',
    pitch: '',
    error: '',
    started: '',
    results: [],
    partialResults: [],
    end: '',
  });
};

render() {
  return (
    <View style={styles.container}>
      <Text style={styles.welcome}>Welcome to React Native Voice!</Text>
      <Text style={styles.instructions}>
        Press the button and start speaking.
      </Text>
      <Text style={styles.stat}>{`Started: ${this.state.started}`}</Text>
      <Text style={styles.stat}>{`Recognized: ${
        this.state.recognized
      }`}</Text>
      <Text style={styles.stat}>{`Pitch: ${this.state.pitch}`}</Text>
      <Text style={styles.stat}>{`Error: ${this.state.error}`}</Text>
      <Text style={styles.stat}>Results</Text>
      {this.state.results.map((result, index) => {
        return (
          <Text key={`result-${index}`} style={styles.stat}>
            {result}
          </Text>
        );
      })}
      <Text style={styles.stat}>Partial Results</Text>
      {this.state.partialResults.map((result, index) => {
        return (
          <Text key={`partial-result-${index}`} style={styles.stat}>
            {result}
          </Text>
        );
      })}
      <Text style={styles.stat}>{`End: ${this.state.end}`}</Text>
      <TouchableHighlight onPress={this._startRecognizing}>
        <Text style={{fontSize:36, backgroundColor: '#ccc'}}>Button</Text>
        {/* <Image style={styles.button} source={require('./button.png')} /> */}
      </TouchableHighlight>
      <TouchableHighlight onPress={this._stopRecognizing}>
        <Text style={styles.action}>Stop Recognizing</Text>
      </TouchableHighlight>
      <TouchableHighlight onPress={this._cancelRecognizing}>
        <Text style={styles.action}>Cancel</Text>
      </TouchableHighlight>
      <TouchableHighlight onPress={this._destroyRecognizer}>
        <Text style={styles.action}>Destroy</Text>
      </TouchableHighlight>
    </View>
  );
}

}

Versions Used:

"react-native": "0.63.4",
buildToolsVersion = "29.0.2"
minSdkVersion = 19
compileSdkVersion = 29
targetSdkVersion = 31
kotlinVersion = "1.6.0"