diff --git a/code/frontend/src/components/QuestionInput/QuestionInput.tsx b/code/frontend/src/components/QuestionInput/QuestionInput.tsx index 4cf363d97..0adb5ca7e 100644 --- a/code/frontend/src/components/QuestionInput/QuestionInput.tsx +++ b/code/frontend/src/components/QuestionInput/QuestionInput.tsx @@ -35,12 +35,14 @@ export const QuestionInput = ({ const [liveRecognizedText, setLiveRecognizedText] = useState(""); const [microphoneIconActive, setMicrophoneIconActive] = useState(false); - + const [isTextAreaDisabled, setIsTextAreaDisabled] = useState(false); useEffect(() => { if (isRecognizing) { setLiveRecognizedText(recognizedText); + setIsTextAreaDisabled(true) setMicrophoneIconActive(true); // Set microphone icon to active (blue) } else { + setIsTextAreaDisabled(false) setMicrophoneIconActive(false); // Set microphone icon to inactive } }, [recognizedText, isRecognizing]); @@ -81,6 +83,8 @@ export const QuestionInput = ({ {/* Text Input Field */} { return abortController.abort(); }; + // Buffer to store recognized text + let recognizedTextBuffer = ""; + let currentSentence = ""; const startSpeechRecognition = async () => { if (!isRecognizing) { setIsRecognizing(true); - recognizerRef.current = await multiLingualSpeechRecognizer(); // Store the recognizer in the ref recognizerRef.current.recognized = (s, e) => { if (e.result.reason === ResultReason.RecognizedSpeech) { - const recognized = e.result.text; - setUserMessage(recognized); - setRecognizedText(recognized); + let recognizedText = e.result.text.trim(); + // Append current sentence to buffer if it's not empty + if (currentSentence) { + recognizedTextBuffer += ` ${currentSentence.trim()}`; + currentSentence = ""; + } + // Start new sentence + currentSentence += ` ${recognizedText}`; + //set text in textarea + setUserMessage((recognizedTextBuffer + currentSentence).trim()); + setRecognizedText((recognizedTextBuffer + currentSentence).trim()); } }; - recognizerRef.current.startContinuousRecognitionAsync(() => { - setIsRecognizing(true); - setIsListening(true); - }); + recognizerRef.current.startContinuousRecognitionAsync( + () => { + setIsRecognizing(true); + setIsListening(true); + }, + error => { + console.error(`Error starting recognition: ${error}`); + } + ); } };