Not working on multiple screen

[Skvitthani]

import React, { useEffect, useState } from "react"; import Voice from "@react-native-voice/voice"; import { PERMISSIONS, RESULTS, openSettings, request, } from "react-native-permissions"; import { Alert, Keyboard, Platform } from "react-native"; import { showMessage } from "react-native-flash-message";

let timer;

export const useHandleSpeechToText = () => { const [stopRecording, setStopRecording] = useState(false); const [recognizedText, setRecognizedText] = useState(); const [speechRecognized, setSpeechRecognized] = useState(false); const [isMicOn, setIsMicOn] = useState(false); const [timerSeconds, setTimerSeconds] = useState(0); const [text, setText] = useState('')

const startTimer = () => { timer = setInterval( () => setTimerSeconds((timerSeconds) => timerSeconds + 1), 1000 ); };

const resetTimer = () => { if (timer) { clearInterval(timer); timer = null; } setTimerSeconds(0); };

useEffect(() => { let isMounted = true;

Voice.onSpeechResults = (e) => {
  if (isMounted) {
    setRecognizedText(e.value?.[0]);
    setSpeechRecognized(true);
  }
};

return () => {
  isMounted = false;
  Voice.destroy()?.then(Voice.removeAllListeners);
};

}, []);

useEffect(() => { if (speechRecognized && recognizedText && recognizedText !== "" && stopRecording) { setSpeechRecognized(false); setStopRecording(false);

  setText(prevText => {
    const trimmedText = prevText.trim();
    const trimmedRecognizedText = recognizedText.trim();

    if (trimmedText === "") {
      return trimmedRecognizedText;
    } else {
      return trimmedText + " " + trimmedRecognizedText;
    }
  });
}

}, [speechRecognized, recognizedText, stopRecording]);

const checkForPermission = async (callBack) => { request( Platform.OS === "ios" ? PERMISSIONS.IOS.SPEECH_RECOGNITION : PERMISSIONS.ANDROID.RECORD_AUDIO ) .then((result) => { if (result == RESULTS.GRANTED) { callBack(true); } else { callBack(false); } }) .catch(() => { callBack(false); }); }; const handleSpeechToText = async () => { resetTimer(); setText('') if (!isMicOn) { Keyboard.dismiss(); checkForPermission((success) => { if (!success) { const permissionText = Platform.OS === "ios" ? "Speech Recognition Permission" : "Mic Permission"; Alert.alert( ${permissionText} Needed, Please allow ${permissionText} from settings to enable speech to text, [ { text: "OK", onPress: () => openSettings(), style: "OK", }, ] ); } else { try { Voice.start("en-US") .then(() => { setRecognizedText(); setStopRecording(false); setIsMicOn(!isMicOn); startTimer(); }) .catch(() => { showMessage({ message: "Error starting speech recognition", description: "Please try again.", type: "danger", backgroundColor: "red", }); }); } catch (e) { setIsMicOn(false); showMessage({ message: "Error starting speech recognition", description: "Please try again.", type: "danger", backgroundColor: "red", }); } } }); } else { setIsMicOn(!isMicOn); setStopRecording(true); try { await Voice.stop(); } catch (e) { } } };

return { handleSpeechToText, setIsMicOn, isMicOn, timerSeconds, text }; };

"@react-native-voice/voice": "^3.2.4",

"react": "17.0.2", "react-native": "0.68.5",

I'm using the above common function on multiple screens but it's working only the first time if I use the same function on another screen it's not working.