useRemoteMedia

The useRemoteMedia hook is used to fetch media from a remote peers. It gives an ability to stop and start consuming.

Name	Description	Return Type
state	The current state of the media from remote peer	'playable' \| 'unavailable' \| 'stopped' \| 'paused' \| 'available'
track	MediaStreamTrack of the remote peer	MediaStreamTrack \| null
stream	MediaStream of the remote peer	MediaStream \| null
stopConsuming	Method to stop consuming media from remote peer	void
startConsuming	Method to start consuming media from remote peer	Promise<void>

Example usage

import { useRemoteMedia } from '@huddle01/react/hooks';
 
const { 
    state, 
    track, 
    stream, 
    stopConsuming, 
    startConsuming 
  } = useRemoteMedia({
    peerId: 'YOUR_PEER_ID',
    label: 'YOUR_MEDIA_LABEL',
    onClose() (),
    onPlayable(data: {
        track: MediaStreamTrack;
        stream: MediaStream;
        label: string;
    }) (),
    onStopped(reason: {
        code: number;
        tag: string;
        message: string;
    }) ()
  })
 
// Stop consuming media from remote peer
const stop = (peerId: string) => {
  stopConsuming(peerId);
}
 
// Start consuming media from remote peer
const start = async (peerId: string) => {
  await startConsuming();
}

Props

The useRemoteMedia hook accepts the following props:

peerId

Required

Description	Type
PeerId of the remote peer	string

Example usage

// Get state of media from remote peer
const { state } = useRemoteMedia({
    peerId,
    label: 'YOUR_MEDIA_LABEL',
})

label

Required

Description	Type
Label of the media to consume from remote peer	string

Example usage

// Get state of media from remote peer
const { state } = useRemoteMedia({
    peerId: 'YOUR_PEER_ID',
    label,
})

onClose

Optional

Description	Type
Callback function to be called when the media is closed	void

Example usage

useRemoteMedia({
    peerId: 'YOUR_PEER_ID',
    label: 'YOUR_MEDIA_LABEL',
    onClose() {
        console.log('Media closed')
        // Your code here
    }
})

onPlayable

Optional

Description	Type
Callback function to be called when the media is playable, i.e. start consuming	void

Example usage

useRemoteMedia({
    peerId: 'YOUR_PEER_ID',
    label: 'YOUR_MEDIA_LABEL',
    onPlayable(data: {
        track: MediaStreamTrack;
        stream: MediaStream;
        label: string;
    }) {
        console.log('Media is playable')
        // Your code here
    }
})

onStopped

Optional

Description	Type
Callback function to be called when we stop consuming media	void

Example usage

useRemoteMedia({
    peerId: 'YOUR_PEER_ID',
    label: 'YOUR_MEDIA_LABEL',
    onStopped(reason: {
        code: number;
        tag: string;
        message: string;
    }) {
        console.log('Media is stopped')
        // Your code here
    }
})

useLocalMedia Components