Skip to main content
Version: 0.x.x

useMeeting Hook Event Callbacks - React Native

onParticipantJoined()

  • This event callback is trigger when a new participant joins the meeting.

Example

function onParticipantJoined(participant) {
console.log(" onParticipantJoined", participant);
}

const {
meetingId
...
} = useMeeting({
onParticipantJoined,
...
});

onParticipantLeft()

  • This event callback is trigger when a participant leaves the meeting.
  • When onParticipantLeft is triggered, a reason object is also provided.
  • The table below outlines the possible reason codes and their descriptions:
ReasonCodeMessage
WEBSOCKET_DISCONNECTED1001Socket disconnected
REMOVE_PEER1002Participant was removed from the meeting
REMOVE_PEER_VIEWER_MODE_CHANGED1003Participant removed because viewer mode was changed
REMOVE_PEER_MEDIA_RELAY_STOP1004Participant removed because media relay was stopped
SWITCH_ROOM1005Participant switched to a different room
ROOM_CLOSE1006The meeting has been closed
UNKNOWN1007Participant disconnected due to an unknown reason
REMOVE_ALL1008Remove All from the meeting
MEETING_END_API1009Meeting Ended.
REMOVE_PEER_API1010Participant removed from the meeting
MANUAL_LEAVE_CALLED1101Participant manually called the leave() method to exit the meeting
WEBSOCKET_CONNECTION_ATTEMPTS_EXHAUSTED1102Meeting left after multiple failed websocket connection attempts.
JOIN_ROOM_FAILED1103Meeting left due to an error while joining the room.
SWITCH_ROOM_FAILED1104Meeting left due to an error while switching rooms.

Example

function onParticipantLeft(participant,reason) {
if(reason.code === Constants.leaveReason.REMOVE_PEER){
// do - something
}
}

const {
meetingId
...
} = useMeeting({
onParticipantLeft,
...
});

onSpeakerChanged()

  • This event will be emitted when a active speaker changed.
  • If you want to know which participant is actively speaking, then this event will be used.
  • If no participant is actively speaking, then this event will pass null as en event callback parameter.

Example

function onSpeakerChanged(activeSpeakerId) {
console.log(" onSpeakerChanged", activeSpeakerId);
}

const {
meetingId
...
} = useMeeting({
onSpeakerChanged,
...
});

onPresenterChanged()

  • This event will be emitted when any participant starts or stops screen sharing.
  • It will pass participantId as an event callback parameter.
  • If a participant stops screensharing, then this event will pass null as en event callback parameter.

Example

function onPresenterChanged(presenterId) {
console.log(" onPresenterChanged", presenterId);
}

const {
meetingId
...
} = useMeeting({
onPresenterChanged,
...
});

onMainParticipantChanged()

  • This event will be emitted when main participant get changed.
  • It will pass participantId as an event callback parameter.

Example

function onMainParticipantChanged(participantId) {
console.log(" onMainParticipantChanged", participantId);
}

const {
meetingId
...
} = useMeeting({
onMainParticipantChanged,
...
});

onEntryRequested()

  • This event will be triggered when a new participant who is trying to join the meeting, is having permission ask_join in token.
  • This event will only be triggered to the participants in the meeting, who is having the permission allow_join in token.
  • This event will pass following parameters as an event parameters, participantId and name of the new participant who is trying to join the meeting, allow() and deny() to take required actions.

Event callback parameters

  • data: { allow: Function; deny: Function; name: String; participantId: String }
    • allow: Function
    • deny: Function
    • name: String
    • participantId: String

Example

function onEntryRequested(data) {
const { participantId, name, allow, deny } = data;

console.log(`${name} requested to join the meeting.`);

// If you want to allow the entry request
allow();

// if you want to deny the entry request
deny();
}

const {
meetingId
...
} = useMeeting({
onEntryRequested,
...
});

onEntryResponded()

  • This event will be triggered when the join() request is responded.
  • This event will be triggered to the participants in the meeting, who is having the permission allow_join in token.
  • This event will be also triggered to the participant who requested to join the meeting.

Event callback parameters

  • participantId: String
  • decision: "allowed" | "denied"

Example

function onEntryResponded(participantId, decision) {
// participantId will be id of participant who requested to join meeting

if (decision === "allowed") {
// entry allowed
} else {
// entry denied
}
}

const {
meetingId
...
} = useMeeting({
onEntryResponded,
...
});

onRecordingStateChanged()

  • This event will be emitted when the meeting's recording status changed.

Example


import { Constants, useMeeting } from "@videosdk.live/react-native-sdk";

function onRecordingStateChanged(data) {
const { status } = data;

if (status === Constants.recordingEvents.RECORDING_STARTING) {
console.log("Meeting recording is starting");
} else if (status === Constants.recordingEvents.RECORDING_STARTED) {
console.log("Meeting recording is started");
} else if (status === Constants.recordingEvents.RECORDING_STOPPING) {
console.log("Meeting recording is stopping");
} else if (status === Constants.recordingEvents.RECORDING_STOPPED) {
console.log("Meeting recording is stopped");
} else {
//
}
}

const {
meetingId
...
} = useMeeting({
onRecordingStateChanged,
...
});


onRecordingStarted()

  • This event callback is trigger when meeting recording is started.

Example

function onRecordingStarted() {
console.log("onRecordingStarted");
}

const {
meetingId
...
} = useMeeting({
onRecordingStarted,
...
});

onRecordingStopped()

  • This event callback is trigger when meeting recording is stopped.

Example

function onRecordingStopped() {
console.log("onRecordingStopped");
}

const {
meetingId
...
} = useMeeting({
onRecordingStopped,
...
});

onMeetingJoined()

  • This event callback is trigger when a local participant joins the meeting.

Example

function onMeetingJoined() {
console.log("onMeetingJoined");
}

const {
meetingId
...
} = useMeeting({
onMeetingJoined,
...
});

onMeetingLeft()

  • This event callback is trigger when local participant leaves the meeting.
  • When onMeetingLeft() is triggered, a reason object is also provided.
  • The table below outlines the possible reason codes and their descriptions:
ReasonCodeMessage
WEBSOCKET_DISCONNECTED1001Socket disconnected
REMOVE_PEER1002Participant was removed from the meeting
REMOVE_PEER_VIEWER_MODE_CHANGED1003Participant removed because viewer mode was changed
REMOVE_PEER_MEDIA_RELAY_STOP1004Participant removed because media relay was stopped
SWITCH_ROOM1005Participant switched to a different room
ROOM_CLOSE1006The meeting has been closed
UNKNOWN1007Participant disconnected due to an unknown reason
REMOVE_ALL1008Remove All from the meeting
MEETING_END_API1009Meeting Ended.
REMOVE_PEER_API1010Participant removed from the meeting
MANUAL_LEAVE_CALLED1101Participant manually called the leave() method to exit the meeting
WEBSOCKET_CONNECTION_ATTEMPTS_EXHAUSTED1102Meeting left after multiple failed websocket connection attempts.
JOIN_ROOM_FAILED1103Meeting left due to an error while joining the room.
SWITCH_ROOM_FAILED1104Meeting left due to an error while switching rooms.

Example

function onMeetingLeft(reason) {
if(reason.code === Constants.leaveReason.MANUAL_LEAVE_CALLED){
// do - something
}
}

const {
meetingId
...
} = useMeeting({
onMeetingLeft,
...
});

onLivestreamStateChanged()

  • This event will be emitted when the meeting's livestream status changed.

Example


import { Constants, useMeeting } from "@videosdk.live/react-native-sdk";

function onLivestreamStateChanged(data) {
const { status } = data;

if (status === Constants.livestreamEvents.LIVESTREAM_STARTING) {
console.log("Meeting Livestream is starting");
} else if (status === Constants.livestreamEvents.LIVESTREAM_STARTED) {
const { downstreamUrl } = data;
console.log("Meeting Livestream is started");
} else if (status === Constants.livestreamEvents.LIVESTREAM_STOPPING) {
console.log("Meeting Livestream is stopping");
} else if (status === Constants.livestreamEvents.LIVESTREAM_STOPPED) {
console.log("Meeting Livestream is stopped");
} else {
//
}
}

const {
meetingId
...
} = useMeeting({
onLivestreamStateChanged,
...
});


onLiveStreamStarted()

  • This event callback is trigger when meeting live stream is started.

Example

function onLiveStreamStarted(){
console.log("onLiveStreamStarted");
}

const {
meetingId
...
} = useMeeting({
onLiveStreamStarted,
...
});

onLiveStreamStopped()

  • This event callback is trigger when meeting live stream is stopped.

Example

function onLiveStreamStopped(){
console.log("onLiveStreamStopped");
}

const {
meetingId
...
} = useMeeting({
onLiveStreamStopped,
...
});

onHlsStateChanged()

  • This event will be emitted when the meeting's HLS(Http Livestreaming) status changed.

Example


import { Constants, useMeeting } from "@videosdk.live/react-native-sdk";

function onHlsStateChanged(data) {
const { status } = data;

if (status === Constants.hlsEvents.HLS_STARTING) {
console.log("Meeting Hls is starting");
} else if (status === Constants.hlsEvents.HLS_STARTED) {
console.log("Meeting Hls is started");
} else if (status === Constants.hlsEvents.HLS_PLAYABLE) {
// on hlsStateChanged started you will receive downstreamUrl
const {downstreamUrl}=data;
console.log("Meeting Hls is playable");
} else if (status === Constants.hlsEvents.HLS_STOPPING) {
console.log("Meeting Hls is stopping");
} else if (status === Constants.hlsEvents.HLS_STOPPED) {
console.log("Meeting Hls is stopped");
} else {
//
}
}

const {
meetingId
...
} = useMeeting({
onHlsStateChanged,
...
});


onHlsStarted()

  • This event callback is trigger when meeting HLS is started.

Event callback parameters

  • data: { downstreamUrl: String; }
    • downstreamUrl: String

Example

function onHlsStarted({ downstreamUrl }) {
console.log("onHlsStarted", downstreamUrl);
}

onHlsStopped()

  • This event callback is trigger when meeting HLS is stopped.

Example

function onHlsStopped(){
console.log("onHlsStopped");
}

const {
meetingId
...
} = useMeeting({
onHlsStopped,
...
});

onVideoStateChanged()

  • This event callback is trigger when state of the external video change during the meeting.

Example

function onVideoStateChanged(data){
console.log("onVideoStateChanged", data);
}

const {
meetingId
...
} = useMeeting({
onVideoStateChanged,
...
});

onVideoSeeked()

  • This event callback is trigger when video playing the meeting is seeked to a particular time interval.

Example

function onVideoSeeked(data){
console.log("onVideoSeeked", data);
}

const {
meetingId
...
} = useMeeting({
onVideoSeeked,
...
});

onPinStateChanged()

  • This event will be triggered when any participant got pinned or unpinned by any participant got pinned or unpinned by any participant.

  • data: { peerId: String; state: JSONObject; pinnedBy: String }

    • peerId: String
    • state: JSONObject
    • pinnedBy: String

Example

function onPinStateChanged(data) {
const { peerId, state, pinnedBy } = data;
}

const {
meetingId
...
} = useMeeting({
onPinStateChanged,
...
});

onWebcamRequested()

  • This event will be triggered to the participant B when any other participant A requests to enable webcam of participant B.
  • On accepting the request, webcam of participant B will be enabled.

Event callback parameters

  • data: { accept: Function; participantId: String; reject: Function }
    • accept: Function
    • participantId: String
    • reject: Function

Example

function onWebcamRequested(data) {
const { participantId, accept, reject } = data;

// participantId, will be the id of participant who requested to enable webcam

// if accept request
accept();

// if reject request
reject();
}

const {
meetingId
...
} = useMeeting({
onWebcamRequested,
...
});

onMicRequested()

  • This event will be triggered to the participant B when any other participant A requests to enable mic of participant B.
  • On accepting the request, mic of participant B will be enabled.

Event callback parameters

  • data: { accept: Function; participantId: String; reject: Function }
    • accept: Function
    • participantId: String
    • reject: Function

Example

function onMicRequested(data) {
const { participantId, accept, reject } = data;

// participantId, will be the id of participant who requested to enable mic

// if accept request
accept();

// if reject request
reject();
}

const {
meetingId
...
} = useMeeting({
onMicRequested,
...
});

onError()

  • This event will be triggered when any error occured.
  • It will pass code and message, as an event callback parameter.
  • To see all available error codes from SDK. Meeting Error Codes

Event callback parameters

  • data: { code: Number; message: String }
    • code: Number
    • message: String

Example

function onError(data) {
const { code, message } = data;
}

const {
meetingId
...
} = useMeeting({
onError,
...
});

onMeetingStateChanged()

  • This event will be triggered when state of meeting changes.
  • It will pass state as an event callback parameter which will indicate current state of the meeting.
  • All available states are CONNECTING, CONNECTED, FAILED, DISCONNECTED, CLOSING, CLOSED.

Event callback parameters

  • data: { state: String }
    • state: String

Example

function onMeetingStateChanged(data) {
const { state } = data;

switch(state){
case 'CONNECTING':
console.log("Meeting is Connecting" );
break;
case 'CONNECTED':
console.log("Meeting is Connected" );
break;
case 'FAILED':
console.log("Meeting connection failed" );
break;
case 'DISCONNECTED':
console.log("Meeting connection disconnected abruptly" );
break;
case 'CLOSING':
console.log("Meeting is closing" );
break;
case 'CLOSED':
console.log("Meeting connection closed" );
break;
}
}

const {
meetingId
...
} = useMeeting({
onMeetingStateChanged,
...
});

onPausedAllStreams()

  • This callback is triggered when all or specified media streams within the meeting are successfully paused

Parameters

  • kind: Specifies the type of media stream that was paused.
    • Type: String
    • Possible values:
      • "audio": Indicates that audio streams have been paused.
      • "video": Indicates that video streams have been paused.
      • "share": Indicates that screen-sharing video streams have been paused
      • "shareAudio": Indicates that screen-sharing audio streams have been paused

Example

function onPausedAllStreams(data) {
const { kind } = data;
}

const {
meetingId
...
} = useMeeting({
onPausedAllStreams,
...
});

onResumedAllStreams()

  • This callback is triggered when all or specified media streams within the meeting are successfully resumed

Parameters

  • kind: Specifies the type of media stream that was resumed.
    • Type: String
    • Possible values:
      • "audio": Indicates that audio streams have been resumed.
      • "video": Indicates that video streams have been resumed.
      • "share": Indicates that screen-sharing video streams have been resumed
      • "shareAudio": Indicates that screen-sharing audio streams have been paused

Example

function onResumedAllStreams(data) {
const { kind } = data;
}

const {
meetingId
...
} = useMeeting({
onResumedAllStreams,
...
});

onMediaRelayRequestReceived()

  • This callback is triggered when a request is recieved for media relay in the destination meeting.

Parameters

  • participantId - (String): Specifies the participantId who requested the media relay.

  • meetingId - (String): Specifies the meeting from where the media relay request was made.

  • displayName - (String): Specifies the displayName of the participant who requested the media relay.

  • accept - (Function): Specifies the function to accept the media relay request.

  • reject - (Function): Specifies the function to reject the media relay request..

Example

function onMediaRelayRequestReceived(
participantId,
meetingId,
displayName,
accept,
reject
) {
console.log(
`Relay request from ${displayName} (${participantId}) in meeting ${meetingId}`
);
}

const {
meetingId
...
} = useMeeting({
onMediaRelayRequestReceived,
...
});

onMediaRelayRequestResponse()

  • This callback is triggered when a response is recieved for media relay request in the source meeting.

Parameters

  • participantId - (String): Specifies the participantId who responded the request for the media relay.

  • decision - (String): Specifies the decision whether the request for media relay was accepted or not.

Example

function onMediaRelayRequestResponse(
participantId,
decision
) {
console.log(
`Relay response from (${participantId}) : ${decision} `
);
}

const {
meetingId
...
} = useMeeting({
onMediaRelayRequestResponse,
...
});

onMediaRelayStarted()

  • This callback is triggered when the media relay to the destination meeting succesfully starts.

Parameters

  • meetingId - (String): Specifies the meeting where the media relay started.

Example

function onMediaRelayStarted(meetingId) {
console.log(`Media relay started to ${meetingId}`);
}

const {
meetingId
...
} = useMeeting({
onMediaRelayStarted,
...
});

onMediaRelayStopped()

  • This callback is triggered when the media relay to the destination meeting stops for any reason.

Parameters

  • meetingId - (String): Specifies the meeting where the media relay stopped.

  • reason - (String): Specifies the reason why the media relay stopped

Example

function onMediaRelayStopped(meetingId) {
console.log(`Relay to ${meetingId} stopped. Reason: ${reason}`);
}

const {
meetingId
...
} = useMeeting({
onMediaRelayStopped,
...
});

onMediaRelayError()

  • This callback is triggered when an error occurs during media relay to the destination meeting.

Parameters

  • meetingId - (String): Specifies the meeting where the media relay stopped.

  • error - (String): Specifies the error that occured.

Example

function onMediaRelayError(meetingId, error) {
console.error(`Relay error to ${meetingId}: ${error}`);
}

const {
meetingId
...
} = useMeeting({
onMediaRelayError,
...
});

onQualityLimitation()

  • This callback is triggered when a quality limitation is detected or resolved during the meeting.

Parameters

  • type: Specifies the type of limitation.

    • Type: String
    • Possible values:
      • "congestion": Network congestion detected.
      • "bandwidth": Insufficient network bandwidth.
      • "cpu": High CPU usage on the device.
  • state: Specifies whether the limitation is currently active or resolved.

    • Type: String
    • Possible values:
      • "detected": Limitation has been detected.
      • "resolved": Limitation has been resolved.
  • timestamp: The time (in milliseconds since epoch) when the event occurred.

    • Type: Number

Example

function onQualityLimitation({ type, state, timestamp }){
console.log(`onQualityLimitation: ${type}-${state}`);
};


const {
meetingId
...
} = useMeeting({
onQualityLimitation,
...
});

Got a Question? Ask us on discord