How to save the transcription in a variable after stoplistening

[iamshubhajit]

I am trying to save the transcription at the end of stop listening. But unable to do it because of infinite loop. Do you have any solution where I can trigger a function after stopListening ?

[JamesBrill]

Hi @iamshubhajit To detect when the microphone stops listening, you can use a useEffect hook that saves the transcript (a) when there is a transcript available and (b) when the listening state is false. Here's a minimal example to get you started:

import React, { useEffect } from 'react'
import SpeechRecognition, { useSpeechRecognition } from 'react-speech-recognition'

const Dictaphone = () => {
  const { transcript, listening, browserSupportsSpeechRecognition } = useSpeechRecognition()
  useEffect(() => {
    if (!listening && transcript) {
      // doSomething(transcript)
    }
  }, [transcript, listening]);

  if (!browserSupportsSpeechRecognition) {
    return <span>No browser support</span>
  }

  return (
    <div>
      <span>listening: {listening ? 'on' : 'off'}</span>
      <button onClick={SpeechRecognition.startListening}>Speak</button>
      <span>{transcript}</span>
    </div>
  )
}

export default Dictaphone