Leave or End Meeting - React Native

Participant can choose to leave the meeting without removing all the other participants. This is typically done by Leave Meeting.

Alternatively, if the participant is the host or the last person remaining in the session, they can choose End Meeting by removing all other participants, which will end the session for everyone.

leave()

To leave the meeting without removing all the participant you need to call leave() which is the part of the useMeeting hook of React SDK.

end()

To leave the meeting by removing all the participant you need to call end() which is the part of the useMeeting hook of React SDK.

note

This methods can be called after the meeting is joined successfully.

Example

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

const MeetingView = () => {
  //Getting the leave and end method from hook and assigning event callbacks
  const { leave, end } = useMeeting({
    onMeetingLeft,
    onParticipantLeft,
  });

  const handleLeaveMeeting = () => {
    // Leaving Meeting
    leave();
  };

  const handleEndMeeting = () => {
    // Ending Meeting
    end();
  };

  return (
    <>
      <TouchableOpacity
        onPress={() => {
          handleLeaveMeeting();
        }}
      >
        <Text>Leave Meeting</Text>
      </TouchableOpacity>

      <TouchableOpacity
        onPress={() => {
          handleEndMeeting();
        }}
      >
        <Text>End Meeting</Text>
      </TouchableOpacity>
    </>
  );
};

tip

You should call the leave() method on the unmount of your main meeting component so that meeting is left once the view is unmounted.

Events associated with Leave

Following callbacks are received when a participant leaves the meeting.

• Local Participant will receive a callback ononMeetingLeft of useMeeting() hook.
• All remote participants will receive a callback onParticipantLeft with Participant object.

Events associated with End

Following callbacks are received when a participant ends the meeting.

• All remote participants and local participant will receive a callback on onMeetingLeft of useMeeting() hook.

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

const MeetingView = () => {
  //Event to know meeting is left
  function onMeetingLeft() {
    console.log("onMeetingLeft");
  }

  //Event to know some other participant left
  function onParticipantLeft(participant) {
    console.log(" onParticipantLeft", participant);
  }

  //Getting the leave and end method from hook and assigning event callbacks
  const { leave, end } = useMeeting({
    onMeetingLeft,
    onParticipantLeft,
  });

  return <>...</>;
};

API Reference

The API references for all the methods and events utilised in this guide are provided below.

• leave()
• end()
• onMeetingLeft()
• onParticipantLeft()