How i can get the total recording time? and How i can restrict the recording to 30 second, like after 30 second recording auto stop.

[Mudassar-dev]

Describe the bug
A clear and concise description of what the bug is.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Package info (please complete the following information):

• Version [e.g. 22]

Additional context
Add any other context about the problem here.

[VijayPonni]

@Mudassar-dev I am using this package in my application. I too want to implement the auto stop feature in mine. So, It will be very useful to me if we can achieve this.

Please provide any information to achieve this.

Thanks

[VijayPonni]

Hi @Mudassar-dev we can implement this using the recordingTime property provided by useAudioRecorder hook.

According to the documentation, the recording time property keeps on updating for every seconds. It starts with value 0 and increasing by 1 for every second. We can track this value in useEffect implement logic to check wheather the value reached the desired time limit. If so we can call stopRecording from useAudioRecorder hook.

import { AudioRecorder, useAudioRecorder } from 'react-audio-voice-recorder';
.
.
.

  const recorderControls = useAudioRecorder(
    {
      noiseSuppression: true,
      echoCancellation: true,
      channelCount: 1,
    },
    (err) => enableToastMessage(err.toString(), 'border-red-400') // onNotAllowedOrFound);
  );
  
  .
  .
  .
  .
  
    useEffect(() => {
    if (recorderControls.recordingTime == STT_MAX_RECORDING_TIME_IN_SECONDS) {
      recorderControls.stopRecording();
    }
  }, [recorderControls.recordingTime]);
  
  .
  .
  .
   <AudioRecorder
          onRecordingComplete={hanldeRecording}
          downloadOnSavePress={false}
          downloadFileExtension='mp3'
          recorderControls={recorderControls}
          classes={{
            AudioRecorderClass: `custom-audio-recorder ${
              isTranscriptLoading ? 'disabled' : ''
            }`,
            AudioRecorderTimerClass: 'custom-audio-recorder-timer',
            AudioRecorderStatusClass: 'custom-audio-recorder-status',
            AudioRecorderDiscardClass: 'display-none',
          }}
        />