[React native] How to use Browser Call SDK

We incorporate the browser SDK into the React Native kit.

Its implementation is straightforward and does not require modifications at the native level.

Explore the browser SDK at https://vsee.atlassian.net/wiki/spaces/VD/pages/30605327

Within the React Native kit, we offer support for two types of browser call embedding:

Pure Browser calling

To utilize the Pure Browser Calling SDK from the VSee Clinic Kit in your React Native application, follow these steps:

import { BrowserCalling } from 'vsee-clinic-rn'; ... //Then include the component to your screen <BrowserCalling style={StyleSheet.absoluteFill} authToken={VSeeClinicKit.loggedInUser.vsee.token} userName={VSeeClinicKit.loggedInUser.vsee.id} roomName={meeting_id} onMessage={(event) => { console.log('RECEIVED EVENT: ', event); if (event.type === 'readyToClose') { //Navigate to home screen navigation.navigate(ScreenKeys.home); } }} />

Required params:

  • authToken: The VSee token obtained after login.

  • userName: The VSee username obtained after login.

  • roomName: The room name that the participant will join.

Clinic browser calling

The Clinic Browser Calling feature launches the patient video page from the clinic, incorporating additional logic such as post-visit surveys and an end-call thank-you page. To integrate Clinic Browser Calling from the VSee Clinic Kit, follow these steps:

import { VSeeClinicBrowserCalling } from 'vsee-clinic-rn'; ... // Include the component in your screen <VSeeClinicBrowserCalling style={StyleSheet.absoluteFill} visit_id={visit_id} token={VSeeClinicKit.getUserToken()} domain={account?.domain} onMessage={(event) => { console.log('RECEIVED EVENT: ', event); if (event.name === 'visit.ended') { // Navigate to the home screen navigation.navigate(ScreenKeys.home); } }} />

Required params:

  • visit_id: The visit ID to launch.

  • token: The token of the logged-in user.

  • domain: The domain obtained from account.domain.