logoBMates

useBMates

useBMates is a hook provided by BmatesContext, which can be used within the BmatesProvider. This hook allows access to the state and methods of the BmatesContext.

Usage

To use useBMates, the component must be wrapped in a BmatesProvider. Here is an example of usage:

import React from 'react';
import { useBMates } from './path/to/BmatesContext';

const MyComponent: React.FC = () => {
  const { download, togglePlay, isPlaying } = useBMates();

  return (
    <div>
      <button onClick={togglePlay}>
        {isPlaying ? 'Pause' : 'Play'}
      </button>
      <button onClick={download}>Download</button>
    </div>
  );
};

Return Values

This hook simply provides only the main functions.

If you want detailed usage, access the Editor directly using editorRef.current.

useBMates returns the following values:

download ()

A function to download the current audio.

  • Return: void

togglePlay ()

A function to toggle the play/pause state.

  • Return: Promise<void>

toggleStopPlay ()

A function to stop the playback of the current track.

  • Return: Promise<void>

isPlaying

A state indicating whether the audio is currently playing.

  • Type: boolean

toggleMuteTrack (trackId)

A function to toggle the mute state of a specific track.

NameTypeDescription
trackIdstringThe ID of the track to mute.

removeTrack (trackId)

A function to remove a specific track from the editor.

NameTypeDescription
trackIdstringThe ID of the track to remove.

handleFileUpload (event)

A function to handle file uploads.

NameTypeDescription
eventReact.ChangeEvent<HTMLInputElement>The file input change event.

editorRef

A reference to the Editor instance, allowing direct manipulation or access to its methods.

  • Type: React.RefObject<Editor>

Notes

useBMates can only be used within a BmatesProvider, and using it outside of that context will result in an error.

if (!context) {
  throw new Error('useBMates must be used within a BmatesProvider');
}
PREVBMatesNEXTEditor
logoBMates