Skip to main content
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

MethodTypeDefaultDescription
setIsAudioOnlyCall(isAudioOnly)booleanfalseSet 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

MethodTypeDefaultDescription
setMode(mode)stringDEFAULTCall layout mode
Available modes:
ModeDescription
CometChatCalls.CALL_MODE.DEFAULTGrid layout with all participants visible
CometChatCalls.CALL_MODE.SPOTLIGHTFocus on one participant with others in sidebar
const callSettings = new CometChatCalls.CallSettingsBuilder()
  .setMode(CometChatCalls.CALL_MODE.SPOTLIGHT)
  .build();

UI Controls

MethodTypeDefaultDescription
enableDefaultLayout(enabled)booleantrueShow/hide the default button layout
showEndCallButton(show)booleantrueShow/hide the end call button
showMuteAudioButton(show)booleantrueShow/hide the mute audio button
showPauseVideoButton(show)booleantrueShow/hide the pause video button
showSwitchCameraButton(show)booleantrueShow/hide the switch camera button
showAudioModeButton(show)booleantrueShow/hide the audio mode button
showRecordingButton(show)booleanfalseShow/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

MethodTypeDefaultDescription
startWithAudioMuted(muted)booleanfalseStart call with audio muted
startWithVideoMuted(muted)booleanfalseStart call with video paused
setDefaultAudioMode(mode)string-Set the default audio output mode
Available audio modes:
ModeDescription
CometChatCalls.AUDIO_MODE.SPEAKERPhone speaker
CometChatCalls.AUDIO_MODE.EARPIECEPhone earpiece
CometChatCalls.AUDIO_MODE.BLUETOOTHBluetooth device
CometChatCalls.AUDIO_MODE.HEADPHONESWired headphones
const callSettings = new CometChatCalls.CallSettingsBuilder()
  .startWithAudioMuted(true)
  .startWithVideoMuted(false)
  .setDefaultAudioMode(CometChatCalls.AUDIO_MODE.SPEAKER)
  .build();

Recording

MethodTypeDefaultDescription
showRecordingButton(show)booleanfalseShow/hide the recording button
startRecordingOnCallStart(start)booleanfalseAuto-start recording when call begins
const callSettings = new CometChatCalls.CallSettingsBuilder()
  .showRecordingButton(true)
  .startRecordingOnCallStart(true)
  .build();

Idle Timeout

MethodTypeDefaultDescription
setIdleTimeoutPeriod(seconds)number180Seconds before auto-ending when alone
const callSettings = new CometChatCalls.CallSettingsBuilder()
  .setIdleTimeoutPeriod(300) // 5 minutes
  .build();

Video Tile Interaction

MethodTypeDefaultDescription
enableVideoTileClick(enabled)booleantrueEnable clicking video tiles in Spotlight mode
enableVideoTileDrag(enabled)booleantrueEnable 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