Session Settings

Configure call sessions using the CallSettingsBuilder class. This allows you to customize the call UI, behavior, and event handling.

CallSettingsBuilder

The CallSettingsBuilder provides a fluent API to configure call sessions:

import { CometChatCalls } from '@cometchat/calls-sdk-react-native';

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .enableDefaultLayout(true)
  .setIsAudioOnlyCall(false)
  .setMode(CometChatCalls.CALL_MODE.DEFAULT)
  .showEndCallButton(true)
  .showMuteAudioButton(true)
  .showPauseVideoButton(true)
  .showSwitchCameraButton(true)
  .showAudioModeButton(true)
  .startWithAudioMuted(false)
  .startWithVideoMuted(false)
  .setDefaultAudioMode(CometChatCalls.AUDIO_MODE.SPEAKER)
  .showRecordingButton(false)
  .startRecordingOnCallStart(false)
  .setIdleTimeoutPeriod(180)
  .enableVideoTileClick(true)
  .enableVideoTileDrag(true)
  .setCallEventListener(callListener)
  .build();

Configuration Options

Call Type

Method	Type	Default	Description
`setIsAudioOnlyCall(isAudioOnly)`	boolean	`false`	Set to `true` for audio-only calls

// Audio-only call
const audioCallSettings = new CometChatCalls.CallSettingsBuilder()
  .setIsAudioOnlyCall(true)
  .build();

// Video call (default)
const videoCallSettings = new CometChatCalls.CallSettingsBuilder()
  .setIsAudioOnlyCall(false)
  .build();

Layout Mode

Method	Type	Default	Description
`setMode(mode)`	string	`DEFAULT`	Call layout mode

Available modes:

Mode	Description
`CometChatCalls.CALL_MODE.DEFAULT`	Grid layout with all participants visible
`CometChatCalls.CALL_MODE.SPOTLIGHT`	Focus on one participant with others in sidebar

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .setMode(CometChatCalls.CALL_MODE.SPOTLIGHT)
  .build();

UI Controls

Method	Type	Default	Description
`enableDefaultLayout(enabled)`	boolean	`true`	Show/hide the default button layout
`showEndCallButton(show)`	boolean	`true`	Show/hide the end call button
`showMuteAudioButton(show)`	boolean	`true`	Show/hide the mute audio button
`showPauseVideoButton(show)`	boolean	`true`	Show/hide the pause video button
`showSwitchCameraButton(show)`	boolean	`true`	Show/hide the switch camera button
`showAudioModeButton(show)`	boolean	`true`	Show/hide the audio mode button
`showRecordingButton(show)`	boolean	`false`	Show/hide the recording button

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .enableDefaultLayout(true)
  .showEndCallButton(true)
  .showMuteAudioButton(true)
  .showPauseVideoButton(true)
  .showSwitchCameraButton(true)
  .showAudioModeButton(true)
  .showRecordingButton(true)
  .build();

Initial State

Method	Type	Default	Description
`startWithAudioMuted(muted)`	boolean	`false`	Start call with audio muted
`startWithVideoMuted(muted)`	boolean	`false`	Start call with video paused
`setDefaultAudioMode(mode)`	string	-	Set the default audio output mode

Available audio modes:

Mode	Description
`CometChatCalls.AUDIO_MODE.SPEAKER`	Phone speaker
`CometChatCalls.AUDIO_MODE.EARPIECE`	Phone earpiece
`CometChatCalls.AUDIO_MODE.BLUETOOTH`	Bluetooth device
`CometChatCalls.AUDIO_MODE.HEADPHONES`	Wired headphones

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .startWithAudioMuted(true)
  .startWithVideoMuted(false)
  .setDefaultAudioMode(CometChatCalls.AUDIO_MODE.SPEAKER)
  .build();

Recording

Method	Type	Default	Description
`showRecordingButton(show)`	boolean	`false`	Show/hide the recording button
`startRecordingOnCallStart(start)`	boolean	`false`	Auto-start recording when call begins

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .showRecordingButton(true)
  .startRecordingOnCallStart(true)
  .build();

Idle Timeout

Method	Type	Default	Description
`setIdleTimeoutPeriod(seconds)`	number	`180`	Seconds before auto-ending when alone

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .setIdleTimeoutPeriod(300) // 5 minutes
  .build();

Video Tile Interaction

Method	Type	Default	Description
`enableVideoTileClick(enabled)`	boolean	`true`	Enable clicking video tiles in Spotlight mode
`enableVideoTileDrag(enabled)`	boolean	`true`	Enable dragging video tiles in Spotlight mode

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .enableVideoTileClick(true)
  .enableVideoTileDrag(true)
  .build();

Event Listener

Set up an event listener to handle call events:

const callListener = new CometChatCalls.OngoingCallListener({
  onUserJoined: (user) => {
    console.log('User joined:', user);
  },
  onUserLeft: (user) => {
    console.log('User left:', user);
  },
  onUserListUpdated: (userList) => {
    console.log('User list updated:', userList);
  },
  onCallEnded: () => {
    console.log('Call ended');
  },
  onCallEndButtonPressed: () => {
    console.log('End call button pressed');
  },
  onError: (error) => {
    console.error('Call error:', error);
  },
  onAudioModesUpdated: (audioModes) => {
    console.log('Audio modes updated:', audioModes);
  },
  onRecordingStarted: (data) => {
    console.log('Recording started:', data);
  },
  onRecordingStopped: (data) => {
    console.log('Recording stopped:', data);
  },
  onUserMuted: (user) => {
    console.log('User muted:', user);
  },
  onSessionTimeout: () => {
    console.log('Session timed out');
  },
});

const callSettings = new CometChatCalls.CallSettingsBuilder()
  .setCallEventListener(callListener)
  .build();

Complete Example

import { CometChatCalls } from '@cometchat/calls-sdk-react-native';

function createCallSettings(isAudioOnly: boolean = false) {
  const callListener = new CometChatCalls.OngoingCallListener({
    onUserJoined: (user) => {
      console.log('User joined:', user.name);
    },
    onUserLeft: (user) => {
      console.log('User left:', user.name);
    },
    onCallEnded: () => {
      console.log('Call ended');
      // Navigate back or update UI
    },
    onError: (error) => {
      console.error('Call error:', error.errorDescription);
    },
  });

  return new CometChatCalls.CallSettingsBuilder()
    .enableDefaultLayout(true)
    .setIsAudioOnlyCall(isAudioOnly)
    .setMode(CometChatCalls.CALL_MODE.DEFAULT)
    .showEndCallButton(true)
    .showMuteAudioButton(true)
    .showPauseVideoButton(!isAudioOnly)
    .showSwitchCameraButton(!isAudioOnly)
    .showAudioModeButton(true)
    .startWithAudioMuted(false)
    .startWithVideoMuted(false)
    .setDefaultAudioMode(CometChatCalls.AUDIO_MODE.SPEAKER)
    .showRecordingButton(true)
    .setIdleTimeoutPeriod(180)
    .setCallEventListener(callListener)
    .build();
}

// Create video call settings
const videoCallSettings = createCallSettings(false);

// Create audio call settings
const audioCallSettings = createCallSettings(true);

Join Session - Start a call with these settings
Events - Detailed event documentation
Actions - Control the call programmatically

Overview

Getting Started

Call Session

Features

Advanced

Migration Guide

Resources

CallSettingsBuilder

Configuration Options

Call Type

Layout Mode

UI Controls

Initial State

Recording

Idle Timeout

Video Tile Interaction

Event Listener

Complete Example

​CallSettingsBuilder

​Configuration Options

​Call Type

​Layout Mode

​UI Controls

​Initial State

​Recording

​Idle Timeout

​Video Tile Interaction

​Event Listener

​Complete Example

​Related Documentation

CallSettingsBuilder

Configuration Options

Call Type

Layout Mode

UI Controls

Initial State

Recording

Idle Timeout

Video Tile Interaction

Event Listener

Complete Example

Related Documentation