useTranscribe

A React hook for recording audio or taking in an audio file as input, along with a utility function for audio transcription using OpenAI's API in a Next.js API route handler.

Installation

npm install usetranscribe

Usage

useTranscribe Hook

Import the hook:

import { useTranscribe } from 'usetranscribe';

Destructure the values you need from the hook:

const {
  startRecording,
  stopRecording,
  recording,
  result,
  audioUrl,
  transcribing,
  selectAudioFile,
  transcribeFile,
  handleFileChange,
  error
} = useTranscribe();

Destructured values and functions:

• startRecording: Function to start recording audio.
• stopRecording: Function to stop the ongoing audio recording.
• recording: Boolean indicating if currently recording.
• result: The transcribed result string or undefined.
• audioUrl: URL of the recorded or selected audio.
• transcribing: Boolean indicating if transcription is in progress.
• selectAudioFile: Function to manually select an audio file.
• transcribeFile: Function to transcribe a manually selected audio file.
• handleFileChange: Function to handle the file input change event.
• error: Any errors that occur during the process.

transcribeAudio Function

This function transcribes an audio file using OpenAI's API.

Note: This function is designed to be used in a Next.js API route handler.

Import the function:

import { transcribeAudio } from 'usetranscribe';

Use the function in your Next.js API route:

const result = await transcribeAudio(audioFile);

Requirements

• Ensure you have set the OPENAI_API_KEY in your environment variables to use the transcribeAudio function.
• The hook relies on the browser's MediaDevices API, so ensure that your application is running in a browser environment with this API available.