React Native sample applications for integrating Stringee voice, video, live chat, and programmable chat features on Android and iOS.
| Sample | Language | Description |
|---|---|---|
CallSampleHook |
JavaScript | One-to-one voice/video calls using StringeeCall and StringeeCall2, including token persistence, Android FCM/Notifee notifications, and iOS PushKit/CallKeep. |
CallSampleHookTS |
TypeScript | Typed version of the complete one-to-one call flow, including typed SDK listeners, call state, notification payloads, and native modules. |
LiveChatSample |
JavaScript | Live Chat integration with separate Customer and Agent flows. |
StringeeChatSample |
JavaScript | Programmable Chat operations for conversations, participants, messages, user information, typing state, and object-change events. |
All four samples use stringee-react-native-v2 and React Native 0.72.3.
- Node.js 16 or newer and Yarn 1.x.
- Android Studio, JDK 17, and an Android SDK supported by the selected sample.
- Xcode and CocoaPods for iOS builds.
- A Stringee project with the required Call, Live Chat, or Chat features enabled.
- Access tokens generated by a trusted application server.
- A Firebase project for Android incoming-call notifications.
- A physical iOS device for complete PushKit/CallKeep incoming-call testing.
Never generate Stringee access tokens from an API secret inside a React Native application. API secrets must remain on a trusted server.
Each directory is an independent React Native project with its own dependencies and native Android/iOS applications.
react-native-samples/
├── CallSampleHook/ # JavaScript Call and Call2 sample
├── CallSampleHookTS/ # TypeScript Call and Call2 sample
├── LiveChatSample/ # Customer and Agent Live Chat sample
└── StringeeChatSample/ # Programmable Chat API sample
Open only the selected sample directory in your editor, Android Studio, or Xcode. Do not install all projects as one monorepo.
Clone this repository and enter the sample you want to run. For example:
git clone https://github.com/stringeecom/react-native-samples.git
cd react-native-samples/CallSampleHookyarn installFor iOS, install CocoaPods dependencies from the selected sample:
cd ios
pod install
cd ..Generate a Stringee access token on your application server, then enter it in the sample application or replace the documented development placeholder.
See the Stringee authentication documentation for token creation and renewal requirements.
Register application ID com.callsamplehook in Firebase, download
google-services.json, and place it at:
<CallSample>/android/app/google-services.json
Enable Firebase Cloud Messaging and configure the corresponding FCM credential in the Stringee dashboard. Grant microphone, camera, notification, Bluetooth, and full-screen call permissions when requested.
Select a development team and registered bundle identifier in Xcode. Enable Push Notifications and the Voice over IP, Remote notifications, and Audio background modes. Configure the corresponding APNs/VoIP credential in the Stringee dashboard.
Use a physical iOS device for incoming PushKit/CallKeep tests. The simulator can validate compilation, UI, and outgoing-call flows but does not provide the complete VoIP push lifecycle.
Start Metro from the selected sample directory:
yarn startRun Android or iOS from another terminal:
yarn android
# or
yarn iosYou can also open the sample's android/ directory in Android Studio or its
.xcworkspace file in Xcode.
Both call applications expose four independent outgoing-call cases:
| API | Voice | Video |
|---|---|---|
StringeeCall |
Supported | Supported |
StringeeCall2 |
Supported | Supported |
The shared architecture demonstrates:
- Access-token persistence, automatic reconnection, push registration, and logout cleanup.
- A single active-call model shared by Call and Call2.
- Listener installation before call setup and response-aware call transitions.
- Idempotent Answer, Reject, Hangup, and terminal-state cleanup.
- Android foreground, background, and cold-start FCM/Notifee handling.
- Android incoming-call full-screen notifications and an active-call microphone foreground service.
- iOS PushKit delivery before the React Native bridge is ready and CallKeep event reconciliation after JavaScript starts.
- Stringee-style home, incoming, outgoing, voice-call, and video-call views.
See the sample-specific documentation for setup and implementation details:
LiveChatSample demonstrates separate Customer and Agent entry points for a
Live Chat session.
StringeeChatSample demonstrates:
- Connecting a
StringeeClientand handling client events. - Creating, loading, and updating conversations.
- Adding, removing, and updating participants.
- Sending, loading, editing, deleting, and revoking messages.
- Loading and updating user information.
- Typing indicators and conversation/message object-change callbacks.
Both chat projects use a compatibility wrapper that exposes their original
sample callbacks while delegating to the Promise-based stringee-react-native-v2
API. See the sample-specific setup and token configuration:
Run the commands supported by the selected project:
yarn lint
yarn test --runInBand --watchman=falseThe TypeScript call sample also supports:
yarn typecheckBuild the Android debug application:
cd android
./gradlew app:assembleDebugFor iOS, build the application scheme from its .xcworkspace. End-to-end
notification and media validation requires two different Stringee users and
physical Android/iOS devices.
Do not commit:
- Stringee access tokens, API secrets, or server private keys.
- Signing keystores, passwords, provisioning profiles, or private APNs keys.
- Machine-specific development paths or dependency overrides.
Firebase configuration files contain project identifiers and client API keys, not Stringee server secrets. Whether they are committed should still follow the owning Firebase project's repository policy.