Developer Tools

The EnableX React Native SDK includes a set of developer and utility features — real-time session statistics, talker activity notifications, outbound PSTN calling, audio-only mode, background and foreground lifecycle handling, screenshot capture, pre-call diagnostics, client logging, and a proximity sensor control. These features help you build more robust and feature-rich video applications.

The SDK can deliver real-time WebRTC statistics — bitrate, packet loss, jitter, and latency — for both the overall session and for individual participant streams. This is useful for building quality indicators in your UI, debugging connectivity issues during development, or implementing adaptive behaviour that responds to changing network conditions.

There are two levels of stats: room-level stats that cover the overall session, and per-stream stats that report metrics for a specific remote participant's stream.

Room-Level Stats — Enx.enableStats(isEnabled)

Call Enx.enableStats(true) to begin receiving periodic statistics payloads for the overall session. Call it with false to stop. Stats are delivered via the receivedStats callback on an ongoing basis until disabled.

// Start receiving session stats
Enx.enableStats(true);

// Stop receiving session stats
Enx.enableStats(false);

const eventHandlers = {
  acknowledgeStats: (data) => {
    console.log('Stats monitoring:', data.isEnabled ? 'enabled' : 'disabled');
  },
  receivedStats: (stats) => {
    console.log('Session stats:', stats);
    // Use stats to update a quality indicator in your UI
  }
};

Per-Stream Stats — Enx.enablePlayerStats(isEnabled, streamId)

For granular per-participant monitoring, use enablePlayerStats to subscribe to metrics for a specific remote stream. Pass the stream's ID as the second argument. The playerStats callback then fires periodically with stats scoped to that stream — useful for showing per-tile quality badges in a multi-participant grid.

// Start stats for a specific remote stream
Enx.enablePlayerStats(true, remoteStreamId);

// Stop stats for that stream
Enx.enablePlayerStats(false, remoteStreamId);

const eventHandlers = {
  playerStats: (stats) => {
    console.log('Stream stats for', stats.streamId, ':', stats);
  }
};

Enx.subscribeForTalkerNotification(isEnabled) activates a lightweight callback that fires whenever a participant starts or stops speaking. Unlike the active talker list — which reflects a ranked set of currently dominant speakers — talker notifications are event-driven and fire per transition. This makes them ideal for showing audio activity indicators such as the animated ring or glow around a participant's tile, without waiting for the full active talker list to update.

// Start talker notifications
Enx.subscribeForTalkerNotification(true);

// Stop talker notifications
Enx.subscribeForTalkerNotification(false);

const eventHandlers = {
  TalkerNotification: (data) => {
    console.log('Talker update:', data.clientId, '| Speaking:', data.isTalking);
    // Update audio activity indicator in your participant tile
  }
};

The SDK can initiate an outbound PSTN call from within an active video session. When a phone number is called, the recipient's audio is bridged into the video room — they participate via phone audio while video room participants see a phone participant in the stream. This is useful for bringing in participants who cannot install the app, or for connecting external stakeholders into a live meeting without requiring them to have an EnableX account.

Making a Call — Enx.makeOutboundCall(number, callerId)

Pass the destination phone number and the caller ID to display on the recipient's phone. E.164 format is recommended for the destination number.

Enx.makeOutboundCall('+14155552671', '+18005551234');

Cancelling a Call — Enx.cancelOutboundCall()

Call cancelOutboundCall() to abort an in-progress outbound call before it is answered. This is appropriate when the user decides to abort the dial or when a timeout is exceeded in your UI.

Enx.cancelOutboundCall();

Enx.changeToAudioOnly(audioOnlyState) switches the session between full audio and video mode and audio-only mode. In audio-only mode, all video streams are stopped — both the local user's outgoing camera and incoming video from all remote participants. This conserves significant bandwidth and is useful on poor connections or when the user explicitly wants to switch to a phone call-like experience.

Pass true to switch to audio-only; pass false to restore audio and video.

// Switch to audio-only
Enx.changeToAudioOnly(true);

// Restore audio + video
Enx.changeToAudioOnly(false);

When a React Native app moves to the background — because the user switches to another app or locks the screen — active media streams should be paused to conserve resources and comply with platform media permission policies. When the app returns to the foreground, streams should resume. Failing to manage this transition correctly can result in frozen or black video for remote participants, or in the OS terminating the app on iOS for holding media resources while backgrounded.

The SDK provides Enx.onPause() and Enx.onResume() for this purpose. Both accept two boolean parameters that independently control what happens to the local and remote streams during the background period.

Enx.onPause(localMuteState, remoteMuteState)

Call when the app moves to the background. Both parameters are booleans:

• localMuteState — true to mute the local stream while in the background.
• remoteMuteState — true to mute incoming remote streams while in the background.

Enx.onResume(localUnmuteState, remoteUnmuteState)

Call when the app returns to the foreground to restore streams:

• localUnmuteState — true to restore the local stream.
• remoteUnmuteState — true to restore incoming remote streams.

Wire these calls to React Native's AppState API to respond automatically to app lifecycle transitions:

import { AppState } from 'react-native';

componentDidMount() {
  this.appStateSubscription = AppState.addEventListener('change', this.handleAppStateChange);
}

componentWillUnmount() {
  this.appStateSubscription?.remove();
}

handleAppStateChange = (nextAppState) => {
  if (nextAppState === 'background') {
    Enx.onPause(true, true);
  } else if (nextAppState === 'active') {
    Enx.onResume(true, true);
  }
};

Enx.captureScreenShot(streamId) captures a still image from a specific stream at the current moment. The captured frame is returned asynchronously via the capturedView callback as a Base64-encoded bitmap string. You can use this to implement in-app snapshot features — for example, saving a frame from a participant's stream or capturing an image of shared content for later reference.

// Capture a screenshot of a specific stream
Enx.captureScreenShot(streamId);

Handle the result in the capturedView callback. The data.bitmap field contains the Base64-encoded image:

const eventHandlers = {
  capturedView: (data) => {
    // data.bitmap is a Base64-encoded image string
    const imageBase64 = data.bitmap;
    this.setState({ screenshot: `data:image/png;base64,${imageBase64}` });
  }
};

Once you have the Base64 string, display it using React Native's <Image> component:

<Image
  source={{ uri: this.state.screenshot }}
  style={{ width: 200, height: 150 }}
/>

Enx.clientDiagnostics(clientOptions) runs connectivity and media access checks before a session starts. Use this on a pre-call or lobby screen to verify that the user's camera, microphone, and network can support a video call. Surfacing these issues before the session begins gives users a chance to fix problems — rather than discovering them mid-call.

Pass a configuration object specifying which checks to run:

Enx.clientDiagnostics({
  checkCamera: true,
  checkMicrophone: true,
  checkNetwork: true
});

Results are returned through the diagnosticsResult callback once all requested checks have completed. The payload contains a pass or fail status for each individual check along with any relevant diagnostic detail.

The SDK includes two logging utilities. The first toggles verbose SDK logging to your development console, which is useful during development. The second uploads the SDK's internal log buffer to the EnableX platform — useful when diagnosing production issues that users report.

Enable SDK Logs — Enx.enableLogs(loggingState)

Turns verbose logging from the SDK on or off. When enabled, detailed SDK activity — connection events, media negotiation, state transitions — is written to your console. Disable this in production builds to reduce noise and avoid exposing session metadata in logs.

// Enable verbose logging (useful during development)
Enx.enableLogs(true);

// Disable logging (for production)
Enx.enableLogs(false);

Upload Client Logs — Enx.postClientLogs()

Sends the SDK's internal log buffer to the EnableX platform for remote analysis. This is the recommended approach when a user reports a problem in production — call postClientLogs() at the end of the session, or immediately after the issue is reported, and then share the session details with EnableX support. The uploaded logs allow the support team to diagnose the issue without requiring a reproduction.

Enx.postClientLogs();

Enx.enableProximitySensor(boolean) controls the device's proximity sensor during a call. When enabled, the screen dims and touch input is disabled when the device is held close to the user's face — the same behaviour as a native phone call when held to the ear. This prevents accidental taps on the screen while the user is speaking in earpiece mode.

// Enable proximity sensor (recommended when using earpiece audio)
Enx.enableProximitySensor(true);

// Disable proximity sensor
Enx.enableProximitySensor(false);