npm uninstall react-native-callkeep react-native-voip-push-notification
# or using yarn
yarn remove react-native-callkeep react-native-voip-push-notification1.32.0
Ringing functionality has been revamped bringing calling experience with CallKit and Telecom integration.
🔨 What changed?
The SDK does not depend on react-native-callkeep for CallKit integration and on react-native-voip-push-notification for handling VoIP push notifications. From now we're using internal package which provides CallKit and Android Telecom integration for both platforms - @stream-io/react-native-callingx.
💡 How to migrate?
Setup
Remove the react-native-callkeep library from your app's dependencies
Optional: remove @notifee/react-native from your dependencies if it was used only for the ringing flow:
npm uninstall @notifee/react-native
# or using yarn
yarn remove @notifee/react-nativeThis step is optional. @notifee/react-native is not required for ringing functionality to work with @stream-io/react-native-callingx.
If your app still uses @notifee/react-native for other notifications, keep it installed and skip this step. You should remove it only when it was used exclusively for the old ringing flow.
Install the @stream-io/react-native-callingx library
npm install @stream-io/react-native-callingx
# or using yarn
yarn add @stream-io/react-native-callingxThe ringing flow with @stream-io/react-native-callingx requires @stream-io/react-native-webrtc version 137.1.2 or higher. Please make sure to update the dependency if you are using an older version.
React Native CLI setup
After installing dependencies, run npx pod-install to link the new native modules on iOS.
If your Android project has a manual implementation dependency on react-native-callkeep in your build.gradle, you need to remove it:
dependencies {
implementation (project(':react-native-callkeep'))
// ...
}You also need to make changes to your AppDelegate file. Below you will see exact changes that need to be done:
Note: If your AppDelegate previously had
CXProviderdelegate methods (didActivateAudioSession/didDeactivateAudioSession) for CallKit audio session handling, these are now managed internally by@stream-io/react-native-callingxand can be removed.
#import "RNCallKeep.h"
#import "RNVoipPushNotificationManager.h"
//...
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
NSString *localizedAppName = [[[NSBundle mainBundle] localizedInfoDictionary] objectForKey:@"CFBundleDisplayName"];
NSString *appName = [[[NSBundle mainBundle] infoDictionary]objectForKey :@"CFBundleDisplayName"];
[RNCallKeep setup:@{
@"appName": localizedAppName != nil ? localizedAppName : appName,
@"supportsVideo": @YES,
@"includesCallsInRecents": @NO,
}];
[RNVoipPushNotificationManager voipRegistration];
[StreamVideoReactNative voipRegistration];
// the rest
}
// ...
- (void)pushRegistry:(PKPushRegistry *)registry didUpdatePushCredentials:(PKPushCredentials *)credentials forType:(PKPushType)type {
[RNVoipPushNotificationManager didUpdatePushCredentials:credentials forType:(NSString *)type];
[StreamVideoReactNative didUpdatePushCredentials:credentials forType:(NSString *)type];
}
//...
- (void)pushRegistry:(PKPushRegistry *)registry didReceiveIncomingPushWithPayload:(PKPushPayload *)payload forType:(PKPushType)type withCompletionHandler:(void (^)(void))completion {
NSDictionary *stream = payload.dictionaryPayload[@"stream"];
NSString *uuid = [[NSUUID UUID] UUIDString];
NSString *createdByDisplayName = stream[@"created_by_display_name"];
NSString *cid = stream[@"call_cid"];
NSString *videoIncluded = stream[@"video"]; // [!code --]
BOOL hasVideo = [videoIncluded isEqualToString:@"false"] ? NO : YES;
[StreamVideoReactNative registerIncomingCall:cid uuid:uuid];
// set the completion handler - this one is called by the JS SDK
[RNVoipPushNotificationManager addCompletionHandler:cid completionHandler:completion];
// send event to JS - the JS SDK will handle the rest and call the 'completionHandler'
[RNVoipPushNotificationManager didReceiveIncomingPushWithPayload:payload forType:(NSString *)type];
// display the incoming call notification
[RNCallKeep reportNewIncomingCall: uuid
handle: createdCallerName
handleType: @"generic"
hasVideo: hasVideo
localizedCallerName: createdCallerName
supportsHolding: NO
supportsDTMF: NO
supportsGrouping: NO
supportsUngrouping: NO
fromPushKit: YES
payload: stream
withCompletionHandler: nil];
[StreamVideoReactNative didReceiveIncomingPush:payload forType:(NSString *)type completionHandler:completion];
}Expo setup
Remove the @config-plugins/react-native-callkeep package:
npm uninstall @config-plugins/react-native-callkeep
# or using yarn
yarn remove @config-plugins/react-native-callkeepRemove @config-plugins/react-native-callkeep from the plugins array in your app.json:
{
"expo": {
"plugins": [
"@config-plugins/react-native-callkeep"
// ... other plugins
]
}
}After all dependency changes, regenerate your native projects:
npx expo prebuild --cleanExpo users do not need to make any native iOS or Android changes manually. The @stream-io/video-react-native-sdk package includes an Expo config plugin that handles the native setup automatically.
Usage
From the usage perspective there are no significant changes - you still need to call StreamVideoRN.setPushConfig. CallKit/Telecom integration will work with no changes in configurations that are passed to StreamVideoRN.setPushConfig method by using default parameters.
However there some changes in StreamVideoConfig type itself. For exploring new parameters please check push notification configuration section. Below you'll see the list of fields that are deprecated and not supported from this version:
push.android.incomingCallChannelpush.android.incomingCallNotificationTextGetterspush.navigateAcceptCallpush.navigateToIncomingCall
Please visit our Ringing Setup page for more detailed information.
✨ New Features
- CallKit support for both incoming and outgoing calls
- CallKit muting capabilities
- Android Telecom support for both incoming and outgoing calls
- Android system unified notifications for displaying incoming/outgoing calls