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.

[wangyujiaoflag]

me too，It also doesn't work on foldable phones.