useRemoteScreenShare

useRemoteScreenShare

The useRemoteScreenShare hook allows you to receive the media stream for another peer's screen being shared.

NameDescriptionReturn Type
videoStreamThe video stream for remote peer's screen which is being shared. Null if screen not shared yet.MediaStream | null
audioStreamThe audio stream for remote peer's screen which is being shared. Null if screen not shared yet.MediaStream | null
videoTrackThe video stream track for remote peer's screen which is being shared. Null if screen not shared yet.MediaStreamTrack | null
audioTrackThe audio stream track for remote peer's screen which is being shared. Null if screen not shared yet.MediaStreamTrack | null
stateState of the remote peer's screenshare stream."playable" | "unavailable" | "stopped" | "paused" | "available"

Example Usage

import { useRemoteScreenShare } from "@huddle01/react/hooks";
import { MediaStream, RTCView } from "react-native-webrtc";
 
const {
    videoStream,
    audioStream,
    videoTrack,
    audioTrack,
    state,
  } = useRemoteScreenShare({
    peerId: "remote-peer-id",
    onPlayable(data:{
    track: MediaStreamTrack;
    stream: MediaStream;
    label: 'screen-share-video' | 'screen-share-audio';
    }) {},
    onClose() {},
  });
 
return (
  <View>
    <RTCView streamURL={(videoStream as MediaStream | null)?.toURL() ?? ""}/>
    <RTCView streamURL={(audioStream as MediaStream | null)?.toURL() ?? ""}/>
  </View>
);

Props

The useRemoteScreenShare hook accepts an object with the following fields as props.

peerId

Required
DescriptionType
The peerId of the peer whose screenshare stream you want to consume.string

Example Usage

const remoteScreenShare = useRemoteScreenShare({ peerId: "remote-peer-id" });

onPlayable

OptionalAdvanced
DescriptionReturn Type
This function will be called when the other peer has started sharing their screen and it can now be played on your end.void
Parameter NameTypeDescriptionRequired
data{track: MediaStreamTrack; stream: MediaStream; label: 'share-video' | 'share-audio';}The data object containing the media stream and media stream track that can be played.Yes

Example Usage

const remoteScreenShare = useRemoteScreenShare({ peerId: "remote-peer-id", onPlayable: (data) => {
	console.log("Ready to play remote peer's screen being shared!");
    // your code here
}});

onClose

OptionalAdvanced
DescriptionReturn Type
This function will be called when the other peer stops sharing their screen.void

Example Usage

const remoteScreenShare = useRemoteScreenShare({ peerId: "remote-peer-id", onClose: () => {
	console.log("Remote peer has stopped sharing their screen!");
    // your code here
}});
Audio/Video Infrastructure designed for developers to empower them to ship simple yet powerful Audio/Video Apps.
support
company
Copyright © 2024 Graphene 01, Inc. All Rights Reserved.