@fishjam-cloud/react-native-client 0.1.0 → 0.2.0

package/README.md

@@ -0,0 +1,403 @@
+# Fishjam Cloud React Native client
+
+`@fishjam-cloud/react-native-client` is a React Native wrapper for
+[android-client](https://github.com/fishjam-dev/android-client-sdk) and
+[ios-client](https://github.com/fishjam-dev/ios-client-sdk). It allows you to
+quickly and easily create a mobile client app in React Native for a
+[Fishjam](https://github.com/fishjam-dev/fishjam) server.
+
+# Documentation
+
+API documentation is available
+[here](https://fishjam-cloud.github.io/mobile-client-sdk/modules/_fishjam_cloud_react_native_client.html)
+
+# Installation
+
+Firstly install `react-native-client` with `yarn` or `npm`
+
+```
+yarn add @fishjam-cloud/react-native-client
+```
+
+or
+
+```
+npm install @fishjam-cloud/react-native-client
+```
+
+### Expo plugin
+
+If you're using development builds with `eas build` or bare workflow you can try
+using expo plugin to do the configuration below for you. Simply run:
+
+```
+expo install @fishjam-cloud/react-native-client
+```
+
+Add plugin to your `app.json` if it's not already added:
+
+```json
+{
+  "expo": {
+    "name": "example",
+    ...
+    "plugins": [
+      "@fishjam-cloud/react-native-client"
+    ]
+  }
+}
+```
+
+If you want to use screensharing feature, enable the following flag:
+
+```json
+{
+  "expo": {
+    "name": "example",
+    ...
+    "plugins": [
+      [
+        "@fishjam-cloud/react-native-client",
+        {
+          "setUpScreensharing": true,
+        }
+      ]
+    ]
+  }
+}
+```
+
+On bare workflow run `expo prebuild` to configure the app, then run
+`pod install`. On development build `eas build` should take care of it.
+
+### Android
+
+1. Add camera and microphone permissions to your `AndroidManifest.xml`.
+2. Rebuild the app. That's it!
+
+### iOS
+
+On iOS installation is a bit more complicated, because you need to setup a
+screen broadcast app extension for screensharing.
+
+1. Add camera and microphone permissions to your main `Info.plist`.
+   ```xml
+   <key>NSCameraUsageDescription</key>
+   <string>Allow $(PRODUCT_NAME) to use the camera</string>
+   <key>NSMicrophoneUsageDescription</key>
+   <string>Allow $(PRODUCT_NAME) to use the microphone</string>
+   ```
+2. We recommend adding `audio` background mode in `Info.plist` so that the app
+   doesn't disconnect when it's in background:
+
+```xml
+  <key>UIBackgroundModes</key>
+  <array>
+    <string>audio</string>
+  </array>
+```
+
+2. Open your `<your-project>.xcworkspace` in Xcode
+3. Create new Broadcast Upload Extension. Select File → New → Target... →
+   Broadcast Upload Extension → Next. Choose the name for the new target, select
+   Swift language and deselect "Include UI Extension".
+
+   ![New target config](../../.github/images/xcode1.png)
+
+   Press Finish. In the next alert xcode will ask you if you want to activate
+   the new scheme - press Cancel.
+
+4. Configure app group. Go to "Signing & Capabilities" tab, click "+ Capability"
+   button in upper left corner and select "App Groups".
+
+   ![App groups config](../../.github/images/xcode2.png)
+
+   Then in the "App Groups" add a new group or select existing. Usually group
+   name has format `group.<your-bundle-identifier>`. Verify that both app and
+   extension targets have app group and dev team set correctly.
+
+5. A new folder with app extension should appear on the left with contents like
+   this:
+
+   ![App extension files](../../.github/images/xcode3.png)
+
+   Replace `SampleHandler.swift` with `MembraneBroadcastSampleHandler.swift` and
+   this code:
+
+   ```swift
+   import Foundation
+   import MembraneRTC
+   import os.log
+   import ReplayKit
+   import WebRTC
+
+
+   /// App Group used by the extension to exchange buffers with the target application
+   let appGroup = "{{GROUP_IDENTIFIER}}"
+
+   let logger = OSLog(subsystem: "{{BUNDLE_IDENTIFIER}}.MembraneBroadcastSampleHandler", category: "Broadcaster")
+
+   /// An example `SampleHandler` utilizing `BroadcastSampleSource` from `MembraneRTC` sending broadcast samples and necessary notification enabling device's screencast.
+   class MembraneBroadcastSampleHandler: RPBroadcastSampleHandler {
+       let broadcastSource = BroadcastSampleSource(appGroup: appGroup)
+       var started: Bool = false
+
+
+       override func broadcastStarted(withSetupInfo _: [String: NSObject]?) {
+           started = broadcastSource.connect()
+
+           guard started else {
+               os_log("failed to connect with ipc server", log: logger, type: .debug)
+
+               super.finishBroadcastWithError(NSError(domain: "", code: 0, userInfo: nil))
+
+               return
+           }
+
+           broadcastSource.started()
+       }
+
+       override func broadcastPaused() {
+           broadcastSource.paused()
+       }
+
+       override func broadcastResumed() {
+           broadcastSource.resumed()
+       }
+
+       override func broadcastFinished() {
+           broadcastSource.finished()
+       }
+
+       override func processSampleBuffer(_ sampleBuffer: CMSampleBuffer, with sampleBufferType: RPSampleBufferType) {
+           guard started else {
+               return
+           }
+
+           broadcastSource.processFrame(sampleBuffer: sampleBuffer, ofType: sampleBufferType)
+       }
+   }
+   ```
+
+   Replace `{{GROUP_IDENTIFIER}}` and `{{BUNDLE_IDENTIFIER}}` with your group
+   identifier and bundle identifier respectively.
+
+6. In project's Podfile add the following code:
+   ```rb
+   target 'MembraneScreenBroadcastExtension' do
+     pod 'MembraneRTC/Broadcast'
+   end
+   ```
+   > This new dependency should be added outside of your application target.
+   > Example
+   >
+   > ```rb
+   > target 'ReactNativeMembraneExample' do
+   >  ...
+   > end
+   >
+   > target 'MembraneScreenBroadcastExtension' do
+   >  pod 'MembraneRTC/Broadcast'
+   > end
+   > ```
+7. Run `pod install` in your `ios/` directory
+8. Add the following constants in your Info.plist:
+   ```xml
+   <key>AppGroupName</key>
+   <string>{{GROUP_IDENTIFIER}}</string>
+   <key>ScreencastExtensionBundleId</key>
+   <string>{{BUNDLE_IDENTIFIER}}.MembraneBroadcastSampleHandler</string>
+   ```
+   Replace `{{GROUP_IDENTIFIER}}` and `{{BUNDLE_IDENTIFIER}}` with your group
+   identifier and bundle identifier respectively.
+9. Rebuild the app and enjoy!
+
+# Example
+
+We strongly recommend checking out our example app that implements a basic video
+room client. To run the app:
+
+1. Go to Membrane's server demo repo: https://fishjam.io/app/login Follow
+   instructions there to setup and run demo server.
+2. Clone the repo
+3. ```
+   cd `examples/fishjam-chat`
+   yarn
+   ```
+4. In App.ts replace server url with your server's url.
+5. `yarn run android` or `yarn run ios` or run project from Android Studio /
+   Xcode just like every RN project. Note that simulators won't work, you have
+   to test on real device for camera and screensharing to run.
+
+# Usage
+
+> [!CAUTION]
+> This part of documentation is out of date. It will be updated soon.
+
+Connect to the server and join the room using the `connect` function. Use user
+metadata to pass things like usernames etc. to the server.
+
+```ts
+const startServerConnection = () => {
+  try {
+    await connect('http://server_address:5002', 'peer_token', {
+      displayName: 'Annie',
+    });
+  } catch (e) {
+    console.log('error!');
+  }
+};
+```
+
+Remember to gracefully disconnect from the server using the `leaveRoom()`
+function:
+
+```ts
+const stopServerConnection = () => {
+  await leaveRoom();
+};
+```
+
+Start the device's camera and microphone using `useCamera()` and
+`useMicrophone()` hooks. Use `videoTrackMetadata` and `audioTrackMetadata`
+options to send metadata about the tracks (for example whether it's a camera or
+screencast track).
+
+```ts
+const { startCamera } = useCamera();
+const { startMicrophone } = useMicrophone();
+
+await startCamera({
+  quality: VideoQuality.HD_169,
+  videoTrackMetadata: { active: true, type: 'camera' },
+});
+await startMicrophone({ audioTrackMetadata: { active: true, type: 'audio' } });
+```
+
+For more options and functions to control the camera and microphone see the API
+documentation.
+
+If you have the connection set up, then use `useParticipants()` hook to track
+the other participants in the room. One of the participants will be a local
+participant (the one who's using the device). When participants is added or
+removed because an user joins or leaves the room, the participants will be
+updated automatically. Simply call the hook like this:
+
+```ts
+const participants = useParticipants();
+```
+
+When you have the participants all that's left is to render their video tracks.
+Use `<VideoRendererView />` component like this:
+
+```ts
+{
+  endpoint.videoTracks.map((track) => (
+    <VideoRendererView trackId={track.id} />
+  ));
+}
+```
+
+You can style the views to lay out them however you'd like, basic animations
+should work too.
+
+There are also some simple hooks for toggling camera, microphone and
+screensharing. Use them like this:
+
+```ts
+const { isCameraOn, toggleCamera } = useCameraState();
+const { isMicrophoneOn, toggleMicrophone } = useMicrophoneState();
+```
+
+For screencasting use `useScreencast()` hook. The local endpoint will have a new
+video track which you can render just like an ordinary video track with
+<VideoRendererView />:
+
+```ts
+const { isScreencastOn, toggleScreencast } = useScreencast();
+...
+toggleScreencast({screencastMetadata: { displayName: "Annie's desktop" }});
+```
+
+Use track metadata to differentiate between video and screencast tracks.
+
+### Android foreground service
+
+In order for the call to continue running when app is in background, you need to
+set up and start a foreground service. You can use a 3rd party library for this,
+for example [notifee](https://notifee.app/).
+
+In `AndroidManifest.xml` specify necessary permissions:
+
+```xml
+    <uses-permission android:name="android.permission.FOREGROUND_SERVICE_MEDIA_PROJECTION" />
+    <uses-permission android:name="android.permission.FOREGROUND_SERVICE_CAMERA" />
+    <uses-permission android:name="android.permission.FOREGROUND_SERVICE_MICROPHONE" />
+```
+
+And add foreground service:
+
+```xml
+<application
+...
+>
+  ...
+  <service
+    android:name="app.notifee.core.ForegroundService"
+    android:foregroundServiceType="mediaProjection|camera|microphone" />
+</application>
+```
+
+Then to start the foreground service:
+
+```ts
+import notifee, { AndroidImportance } from '@notifee/react-native';
+
+const startForegroundService = async () => {
+  if (Platform.OS === 'android') {
+    const channelId = await notifee.createChannel({
+      id: 'video_call',
+      name: 'Video call',
+      lights: false,
+      vibration: false,
+      importance: AndroidImportance.DEFAULT,
+    });
+
+    await notifee.displayNotification({
+      title: 'Your video call is ongoing',
+      body: 'Tap to return to the call.',
+      android: {
+        channelId,
+        asForegroundService: true,
+        ongoing: true,
+        pressAction: {
+          id: 'default',
+        },
+      },
+    });
+  }
+};
+```
+
+Don't forget to also stop the service when the call has ended:
+
+```ts
+notifee.stopForegroundService();
+```
+
+Also add this code in your `index.js` to register the service:
+
+```js
+notifee.registerForegroundService((notification) => {
+  return new Promise(() => {});
+});
+```
+
+## Copyright and License
+
+Copyright 2024,
+[Software Mansion](https://swmansion.com/?utm_source=git&utm_medium=readme&utm_campaign=react-client)
+
+[![Software Mansion](https://logo.swmansion.com/logo?color=white&variant=desktop&width=200&tag=react-client)](https://swmansion.com/?utm_source=git&utm_medium=readme&utm_campaign=react-client)
+
+Licensed under the [Apache License, Version 2.0](LICENSE)

package/android/build.gradle

@@ -2,8 +2,8 @@ apply plugin: 'com.android.library'
 apply plugin: 'kotlin-android'
 apply plugin: 'maven-publish'
 
-group = 'org.membraneframework.reactnative'
-version = '0.1.0'
+group = 'io.fishjam.reactnative'
+version = '0.2.0'
 
 buildscript {
   def expoModulesCorePlugin = new File(project(":expo-modules-core").projectDir.absolutePath, "ExpoModulesCorePlugin.gradle")
@@ -52,14 +52,14 @@ afterEvaluate {
 }
 
 android {
-  namespace = "org.membraneframework.reactnative"
+  namespace = "io.fishjam.reactnative"
   compileSdk(31)
 
   defaultConfig {
     minSdkVersion safeExtGet("minSdkVersion", 21)
     targetSdkVersion safeExtGet("targetSdkVersion", 31)
     versionCode 1
-    versionName "0.1.0"
+    versionName "0.2.0"
   }
   lintOptions {
     abortOnError false
@@ -81,8 +81,8 @@ dependencies {
   if (findProject(':fishjam-cloud-android-client')) {
     implementation project(':fishjam-cloud-android-client')
   } else {
-//   todo when released, changed repo name etc then update
-    implementation 'com.github.fishjam-cloud:mobile-client-sdk:0.1.0'
+    // update version number when releasing
+    implementation 'com.github.fishjam-cloud:mobile-client-sdk:0.2.0'
   }
   api 'com.github.davidliu:audioswitch:8edf84ee46cdbc84c2b7725aa8f8d66363e19876'
   implementation 'androidx.appcompat:appcompat:1.6.1'

package/app.plugin.js

@@ -1 +1 @@
-module.exports = require('./plugin/build/withMembrane');
+module.exports = require('./plugin/build/withFishjam');

package/build/RNFishjamClientModule.d.ts

@@ -1,7 +1,7 @@
 import { NativeModule } from 'react-native';
 import type { RTCStats } from './stats/types';
-import type { SimulcastConfig } from './types';
-import type { CameraConfigInternal, CaptureDevice } from './hooks/useCamera';
+import type { ForegroundServiceOptions, SimulcastConfig } from './types';
+import type { CameraConfigInternal, Camera } from './hooks/useCamera';
 import type { Participant } from './hooks/useParticipants';
 import type { ScreencastOptionsInternal } from './hooks/useScreencast';
 import type { ConnectionConfig } from './common/client';
@@ -9,7 +9,7 @@ type Metadata = {
     [key: string]: any;
 };
 type RNFishjamClient = {
-    connect: (url: string, peerToken: string, peerMetadata: Metadata, config: ConnectionConfig) => Promise<void>;
+    joinRoom: (url: string, participantToken: string, participantMetadata: Metadata, config: ConnectionConfig) => Promise<void>;
     leaveRoom: () => Promise<void>;
     startCamera: (config: CameraConfigInternal) => Promise<void>;
     isMicrophoneOn: boolean;
@@ -17,8 +17,8 @@ type RNFishjamClient = {
     isCameraOn: boolean;
     toggleCamera: () => Promise<boolean>;
     flipCamera: () => Promise<void>;
-    switchCamera: (captureDeviceId: string) => Promise<void>;
-    getCaptureDevices: () => Promise<CaptureDevice[]>;
+    switchCamera: (cameraId: string) => Promise<void>;
+    cameras: ReadonlyArray<Camera>;
     handleScreencastPermission: () => Promise<'granted' | 'denied'>;
     toggleScreencast: (screencastOptions: Partial<ScreencastOptionsInternal>) => Promise<void>;
     isScreencastOn: boolean;
@@ -41,6 +41,8 @@ type RNFishjamClient = {
     setVideoTrackBandwidth: (bandwidth: number) => Promise<void>;
     changeWebRTCLoggingSeverity: (severity: string) => Promise<void>;
     getStatistics: () => Promise<RTCStats>;
+    startForegroundService: (options: ForegroundServiceOptions) => void;
+    stopForegroundService: () => void;
 };
 declare const _default: RNFishjamClient & NativeModule;
 export default _default;

package/build/RNFishjamClientModule.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RNFishjamClientModule.d.ts","sourceRoot":"","sources":["../src/RNFishjamClientModule.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAC/C,OAAO,KAAK,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAC7E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,uBAAuB,CAAC;AACvE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAExD,KAAK,QAAQ,GAAG;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAAE,CAAC;AAEvC,KAAK,eAAe,GAAG;IACrB,OAAO,EAAE,CACP,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,QAAQ,EACtB,MAAM,EAAE,gBAAgB,KACrB,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,SAAS,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/B,WAAW,EAAE,CAAC,MAAM,EAAE,oBAAoB,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7D,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC;IACzC,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,CAAC;IACrC,UAAU,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,YAAY,EAAE,CAAC,eAAe,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACzD,iBAAiB,EAAE,MAAM,OAAO,CAAC,aAAa,EAAE,CAAC,CAAC;IAClD,0BAA0B,EAAE,MAAM,OAAO,CAAC,SAAS,GAAG,QAAQ,CAAC,CAAC;IAChE,gBAAgB,EAAE,CAChB,iBAAiB,EAAE,OAAO,CAAC,yBAAyB,CAAC,KAClD,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,cAAc,EAAE,OAAO,CAAC;IACxB,QAAQ,EAAE,CAAC,gBAAgB,SAAS,QAAQ,OAAO,OAAO,CACxD,WAAW,CAAC,gBAAgB,CAAC,EAAE,CAChC,CAAC;IACF,kBAAkB,EAAE,CAAC,YAAY,SAAS,QAAQ,EAChD,QAAQ,EAAE,YAAY,KACnB,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,wBAAwB,EAAE,CAAC,YAAY,SAAS,QAAQ,EACtD,QAAQ,EAAE,YAAY,KACnB,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,wBAAwB,EAAE,CAAC,YAAY,SAAS,QAAQ,EACtD,QAAQ,EAAE,YAAY,KACnB,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,6BAA6B,EAAE,CAAC,YAAY,SAAS,QAAQ,EAC3D,QAAQ,EAAE,YAAY,KACnB,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,oBAAoB,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7D,kBAAkB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACxC,iBAAiB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,sBAAsB,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/D,oBAAoB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1C,6BAA6B,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,eAAe,CAAC,CAAC;IAC9E,2BAA2B,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAClE,mCAAmC,EAAE,CACnC,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,MAAM,KACd,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,sBAAsB,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7E,wBAAwB,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,eAAe,CAAC,CAAC;IACzE,8BAA8B,EAAE,CAC9B,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,MAAM,KACd,OAAO,CAAC,IAAI,CAAC,CAAC;IACnB,sBAAsB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7D,2BAA2B,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACjE,aAAa,EAAE,MAAM,OAAO,CAAC,QAAQ,CAAC,CAAC;CACxC,CAAC;wBAI6B,eAAe,GAAG,YAAY;AAA7D,wBAA8D"}
+{"version":3,"file":"RNFishjamClientModule.d.ts","sourceRoot":"","sources":["../src/RNFishjamClientModule.ts"],"names":[],"mappings":"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"}

package/build/RNFishjamClientModule.js.map

@@ -1 +1 @@
-{"version":3,"file":"RNFishjamClientModule.js","sourceRoot":"","sources":["../src/RNFishjamClientModule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAsExD,MAAM,YAAY,GAAG,mBAAmB,CAAC,iBAAiB,CAAC,CAAC;AAE5D,eAAe,YAA8C,CAAC","sourcesContent":["import { requireNativeModule } from 'expo-modules-core';\nimport { NativeModule } from 'react-native';\n\nimport type { RTCStats } from './stats/types';\nimport type { SimulcastConfig } from './types';\nimport type { CameraConfigInternal, CaptureDevice } from './hooks/useCamera';\nimport type { Participant } from './hooks/useParticipants';\nimport type { ScreencastOptionsInternal } from './hooks/useScreencast';\nimport type { ConnectionConfig } from './common/client';\n\ntype Metadata = { [key: string]: any };\n\ntype RNFishjamClient = {\n  connect: (\n    url: string,\n    peerToken: string,\n    peerMetadata: Metadata,\n    config: ConnectionConfig,\n  ) => Promise<void>;\n  leaveRoom: () => Promise<void>;\n  startCamera: (config: CameraConfigInternal) => Promise<void>;\n  isMicrophoneOn: boolean;\n  toggleMicrophone: () => Promise<boolean>;\n  isCameraOn: boolean;\n  toggleCamera: () => Promise<boolean>;\n  flipCamera: () => Promise<void>;\n  switchCamera: (captureDeviceId: string) => Promise<void>;\n  getCaptureDevices: () => Promise<CaptureDevice[]>;\n  handleScreencastPermission: () => Promise<'granted' | 'denied'>;\n  toggleScreencast: (\n    screencastOptions: Partial<ScreencastOptionsInternal>,\n  ) => Promise<void>;\n  isScreencastOn: boolean;\n  getPeers: <PeerMetadataType extends Metadata>() => Promise<\n    Participant<PeerMetadataType>[]\n  >;\n  updatePeerMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  updateVideoTrackMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  updateAudioTrackMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  updateScreencastTrackMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  setOutputAudioDevice: (audioDevice: string) => Promise<void>;\n  startAudioSwitcher: () => Promise<void>;\n  stopAudioSwitcher: () => Promise<void>;\n  selectAudioSessionMode: (sessionMode: string) => Promise<void>;\n  showAudioRoutePicker: () => Promise<void>;\n  toggleScreencastTrackEncoding: (encoding: string) => Promise<SimulcastConfig>;\n  setScreencastTrackBandwidth: (bandwidth: number) => Promise<void>;\n  setScreencastTrackEncodingBandwidth: (\n    encoding: string,\n    bandwidth: number,\n  ) => Promise<void>;\n  setTargetTrackEncoding: (trackId: string, encoding: string) => Promise<void>;\n  toggleVideoTrackEncoding: (encoding: string) => Promise<SimulcastConfig>;\n  setVideoTrackEncodingBandwidth: (\n    encoding: string,\n    bandwidth: number,\n  ) => Promise<void>;\n  setVideoTrackBandwidth: (bandwidth: number) => Promise<void>;\n  changeWebRTCLoggingSeverity: (severity: string) => Promise<void>;\n  getStatistics: () => Promise<RTCStats>;\n};\n\nconst nativeModule = requireNativeModule('RNFishjamClient');\n\nexport default nativeModule as RNFishjamClient & NativeModule;\n"]}
+{"version":3,"file":"RNFishjamClientModule.js","sourceRoot":"","sources":["../src/RNFishjamClientModule.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAwExD,MAAM,YAAY,GAAG,mBAAmB,CAAC,iBAAiB,CAAC,CAAC;AAE5D,eAAe,YAA8C,CAAC","sourcesContent":["import { requireNativeModule } from 'expo-modules-core';\nimport { NativeModule } from 'react-native';\n\nimport type { RTCStats } from './stats/types';\nimport type { ForegroundServiceOptions, SimulcastConfig } from './types';\nimport type { CameraConfigInternal, Camera } from './hooks/useCamera';\nimport type { Participant } from './hooks/useParticipants';\nimport type { ScreencastOptionsInternal } from './hooks/useScreencast';\nimport type { ConnectionConfig } from './common/client';\n\ntype Metadata = { [key: string]: any };\n\ntype RNFishjamClient = {\n  joinRoom: (\n    url: string,\n    participantToken: string,\n    participantMetadata: Metadata,\n    config: ConnectionConfig,\n  ) => Promise<void>;\n  leaveRoom: () => Promise<void>;\n  startCamera: (config: CameraConfigInternal) => Promise<void>;\n  isMicrophoneOn: boolean;\n  toggleMicrophone: () => Promise<boolean>;\n  isCameraOn: boolean;\n  toggleCamera: () => Promise<boolean>;\n  flipCamera: () => Promise<void>;\n  switchCamera: (cameraId: string) => Promise<void>;\n  cameras: ReadonlyArray<Camera>;\n  handleScreencastPermission: () => Promise<'granted' | 'denied'>;\n  toggleScreencast: (\n    screencastOptions: Partial<ScreencastOptionsInternal>,\n  ) => Promise<void>;\n  isScreencastOn: boolean;\n  getPeers: <PeerMetadataType extends Metadata>() => Promise<\n    Participant<PeerMetadataType>[]\n  >;\n  updatePeerMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  updateVideoTrackMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  updateAudioTrackMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  updateScreencastTrackMetadata: <MetadataType extends Metadata>(\n    metadata: MetadataType,\n  ) => Promise<void>;\n  setOutputAudioDevice: (audioDevice: string) => Promise<void>;\n  startAudioSwitcher: () => Promise<void>;\n  stopAudioSwitcher: () => Promise<void>;\n  selectAudioSessionMode: (sessionMode: string) => Promise<void>;\n  showAudioRoutePicker: () => Promise<void>;\n  toggleScreencastTrackEncoding: (encoding: string) => Promise<SimulcastConfig>;\n  setScreencastTrackBandwidth: (bandwidth: number) => Promise<void>;\n  setScreencastTrackEncodingBandwidth: (\n    encoding: string,\n    bandwidth: number,\n  ) => Promise<void>;\n  setTargetTrackEncoding: (trackId: string, encoding: string) => Promise<void>;\n  toggleVideoTrackEncoding: (encoding: string) => Promise<SimulcastConfig>;\n  setVideoTrackEncodingBandwidth: (\n    encoding: string,\n    bandwidth: number,\n  ) => Promise<void>;\n  setVideoTrackBandwidth: (bandwidth: number) => Promise<void>;\n  changeWebRTCLoggingSeverity: (severity: string) => Promise<void>;\n  getStatistics: () => Promise<RTCStats>;\n  startForegroundService: (options: ForegroundServiceOptions) => void;\n  stopForegroundService: () => void;\n};\n\nconst nativeModule = requireNativeModule('RNFishjamClient');\n\nexport default nativeModule as RNFishjamClient & NativeModule;\n"]}

package/build/common/client.d.ts

@@ -14,6 +14,13 @@ export type ConnectionConfig = {
         delayMs?: number;
     };
 };
-export declare function connect<ParticipantMetadata extends GenericMetadata = GenericMetadata>(url: string, peerToken: string, peerMetadata: ParticipantMetadata, config?: ConnectionConfig): Promise<void>;
+/**
+ *
+ * @param url fishjam Url
+ * @param participantToken
+ * @param participantMetadata
+ * @param config
+ */
+export declare function joinRoom<ParticipantMetadata extends GenericMetadata = GenericMetadata>(url: string, participantToken: string, participantMetadata: ParticipantMetadata, config?: ConnectionConfig): Promise<void>;
 export declare function leaveRoom(): Promise<void>;
 //# sourceMappingURL=client.d.ts.map

package/build/common/client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/common/client.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAG3C,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;;;;OAOG;IACH,eAAe,CAAC,EAAE;QAChB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH,CAAC;AAEF,wBAAsB,OAAO,CAC3B,mBAAmB,SAAS,eAAe,GAAG,eAAe,EAE7D,GAAG,EAAE,MAAM,EACX,SAAS,EAAE,MAAM,EACjB,YAAY,EAAE,mBAAmB,EACjC,MAAM,GAAE,gBAAqB,iBAG9B;AAED,wBAAsB,SAAS,kBAE9B"}
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/common/client.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAG3C,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;;;;OAOG;IACH,eAAe,CAAC,EAAE;QAChB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH,CAAC;AAEF;;;;;;GAMG;AACH,wBAAsB,QAAQ,CAC5B,mBAAmB,SAAS,eAAe,GAAG,eAAe,EAE7D,GAAG,EAAE,MAAM,EACX,gBAAgB,EAAE,MAAM,EACxB,mBAAmB,EAAE,mBAAmB,EACxC,MAAM,GAAE,gBAAqB,iBAQ9B;AAED,wBAAsB,SAAS,kBAE9B"}

package/build/common/client.js

@@ -1,6 +1,13 @@
 import RNFishjamClientModule from '../RNFishjamClientModule';
-export async function connect(url, peerToken, peerMetadata, config = {}) {
-    await RNFishjamClientModule.connect(url, peerToken, peerMetadata, config);
+/**
+ *
+ * @param url fishjam Url
+ * @param participantToken
+ * @param participantMetadata
+ * @param config
+ */
+export async function joinRoom(url, participantToken, participantMetadata, config = {}) {
+    await RNFishjamClientModule.joinRoom(url, participantToken, participantMetadata, config);
 }
 export async function leaveRoom() {
     await RNFishjamClientModule.leaveRoom();

package/build/common/client.js.map

@@ -1 +1 @@
-{"version":3,"file":"client.js","sourceRoot":"","sources":["../../src/common/client.ts"],"names":[],"mappings":"AACA,OAAO,qBAAqB,MAAM,0BAA0B,CAAC;AAkB7D,MAAM,CAAC,KAAK,UAAU,OAAO,CAG3B,GAAW,EACX,SAAiB,EACjB,YAAiC,EACjC,SAA2B,EAAE;IAE7B,MAAM,qBAAqB,CAAC,OAAO,CAAC,GAAG,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,CAAC,CAAC;AAC5E,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,SAAS;IAC7B,MAAM,qBAAqB,CAAC,SAAS,EAAE,CAAC;AAC1C,CAAC","sourcesContent":["import { GenericMetadata } from '../types';\nimport RNFishjamClientModule from '../RNFishjamClientModule';\n\nexport type ConnectionConfig = {\n  /**\n   * Configuration for automatic reconnection\n   * sdk uses a linear backoff algorithm, that is the formula\n   * for the delay of the nth attempt is\n   * n * delayMs + initialDelayMs\n   *\n   * Pass 0 for maxAttempts to disable automatic reconnection\n   */\n  reconnectConfig?: {\n    maxAttempts?: number;\n    initialDelayMs?: number;\n    delayMs?: number;\n  };\n};\n\nexport async function connect<\n  ParticipantMetadata extends GenericMetadata = GenericMetadata,\n>(\n  url: string,\n  peerToken: string,\n  peerMetadata: ParticipantMetadata,\n  config: ConnectionConfig = {},\n) {\n  await RNFishjamClientModule.connect(url, peerToken, peerMetadata, config);\n}\n\nexport async function leaveRoom() {\n  await RNFishjamClientModule.leaveRoom();\n}\n"]}
+{"version":3,"file":"client.js","sourceRoot":"","sources":["../../src/common/client.ts"],"names":[],"mappings":"AACA,OAAO,qBAAqB,MAAM,0BAA0B,CAAC;AAkB7D;;;;;;GAMG;AACH,MAAM,CAAC,KAAK,UAAU,QAAQ,CAG5B,GAAW,EACX,gBAAwB,EACxB,mBAAwC,EACxC,SAA2B,EAAE;IAE7B,MAAM,qBAAqB,CAAC,QAAQ,CAClC,GAAG,EACH,gBAAgB,EAChB,mBAAmB,EACnB,MAAM,CACP,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,SAAS;IAC7B,MAAM,qBAAqB,CAAC,SAAS,EAAE,CAAC;AAC1C,CAAC","sourcesContent":["import { GenericMetadata } from '../types';\nimport RNFishjamClientModule from '../RNFishjamClientModule';\n\nexport type ConnectionConfig = {\n  /**\n   * Configuration for automatic reconnection\n   * sdk uses a linear backoff algorithm, that is the formula\n   * for the delay of the nth attempt is\n   * n * delayMs + initialDelayMs\n   *\n   * Pass 0 for maxAttempts to disable automatic reconnection\n   */\n  reconnectConfig?: {\n    maxAttempts?: number;\n    initialDelayMs?: number;\n    delayMs?: number;\n  };\n};\n\n/**\n *\n * @param url fishjam Url\n * @param participantToken\n * @param participantMetadata\n * @param config\n */\nexport async function joinRoom<\n  ParticipantMetadata extends GenericMetadata = GenericMetadata,\n>(\n  url: string,\n  participantToken: string,\n  participantMetadata: ParticipantMetadata,\n  config: ConnectionConfig = {},\n) {\n  await RNFishjamClientModule.joinRoom(\n    url,\n    participantToken,\n    participantMetadata,\n    config,\n  );\n}\n\nexport async function leaveRoom() {\n  await RNFishjamClientModule.leaveRoom();\n}\n"]}

package/build/components/VideoPreviewView.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ViewStyle } from 'react-native';
 import { VideoLayout } from '../types';
-import { CaptureDeviceId } from '../hooks/useCamera';
+import { CameraId } from '../hooks/useCamera';
 export type VideoPreviewViewProps = {
     /**
      * `FILL` or `FIT` - it works just like RN Image component. `FILL` fills the whole view
@@ -12,10 +12,10 @@ export type VideoPreviewViewProps = {
     videoLayout?: VideoLayout;
     style?: ViewStyle;
     /**
-     * Id of the camera used for preview. Get available cameras with `getCaptureDevices()` function.
+     * Id of the camera used for preview. Get available cameras with `cameras` property.
      * @default the first front camera
      */
-    captureDeviceId?: CaptureDeviceId;
+    cameraId?: CameraId;
 };
 export declare const VideoPreviewView: React.ForwardRefExoticComponent<VideoPreviewViewProps & React.RefAttributes<React.ComponentType<VideoPreviewViewProps>>>;
 //# sourceMappingURL=VideoPreviewView.d.ts.map

package/build/components/VideoPreviewView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VideoPreviewView.d.ts","sourceRoot":"","sources":["../../src/components/VideoPreviewView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,MAAM,qBAAqB,GAAG;IAClC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,eAAe,CAAC,EAAE,eAAe,CAAC;CACnC,CAAC;AAKF,eAAO,MAAM,gBAAgB,0HAM3B,CAAC"}
+{"version":3,"file":"VideoPreviewView.d.ts","sourceRoot":"","sources":["../../src/components/VideoPreviewView.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAE9C,MAAM,MAAM,qBAAqB,GAAG;IAClC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;CACrB,CAAC;AAKF,eAAO,MAAM,gBAAgB,0HAM3B,CAAC"}

package/build/components/VideoPreviewView.js

@@ -3,5 +3,5 @@ import * as React from 'react';
 const NativeView = requireNativeViewManager('VideoPreviewViewModule');
 export const VideoPreviewView = React.forwardRef((props, ref) => (
 // @ts-expect-error ref prop needs to be updated
-<NativeView {...props} ref={ref}/>));
+<NativeView {...props} captureDeviceId={props.cameraId} ref={ref}/>));
 //# sourceMappingURL=VideoPreviewView.js.map

package/build/components/VideoPreviewView.js.map

@@ -1 +1 @@
-{"version":3,"file":"VideoPreviewView.js","sourceRoot":"","sources":["../../src/components/VideoPreviewView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,MAAM,UAAU,GACd,wBAAwB,CAAC,wBAAwB,CAAC,CAAC;AAErD,MAAM,CAAC,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAG9C,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC;AAChB,gDAAgD;AAChD,CAAC,UAAU,CAAC,IAAI,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAG,CACpC,CAAC,CAAC","sourcesContent":["import { requireNativeViewManager } from 'expo-modules-core';\nimport * as React from 'react';\nimport { ViewStyle } from 'react-native';\n\nimport { VideoLayout } from '../types';\nimport { CaptureDeviceId } from '../hooks/useCamera';\n\nexport type VideoPreviewViewProps = {\n  /**\n   * `FILL` or `FIT` - it works just like RN Image component. `FILL` fills the whole view\n   * with video and it may cut some parts of the video. `FIT` scales the video so the whole\n   * video is visible, but it may leave some empty space in the view.\n   * @default `FILL`\n   */\n  videoLayout?: VideoLayout;\n  style?: ViewStyle;\n  /**\n   * Id of the camera used for preview. Get available cameras with `getCaptureDevices()` function.\n   * @default the first front camera\n   */\n  captureDeviceId?: CaptureDeviceId;\n};\n\nconst NativeView: React.ComponentType<VideoPreviewViewProps> =\n  requireNativeViewManager('VideoPreviewViewModule');\n\nexport const VideoPreviewView = React.forwardRef<\n  React.ComponentType<VideoPreviewViewProps>,\n  VideoPreviewViewProps\n>((props, ref) => (\n  // @ts-expect-error ref prop needs to be updated\n  <NativeView {...props} ref={ref} />\n));\n"]}
+{"version":3,"file":"VideoPreviewView.js","sourceRoot":"","sources":["../../src/components/VideoPreviewView.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAsB/B,MAAM,UAAU,GACd,wBAAwB,CAAC,wBAAwB,CAAC,CAAC;AAErD,MAAM,CAAC,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAG9C,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE,CAAC;AAChB,gDAAgD;AAChD,CAAC,UAAU,CAAC,IAAI,KAAK,CAAC,CAAC,eAAe,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAG,CACrE,CAAC,CAAC","sourcesContent":["import { requireNativeViewManager } from 'expo-modules-core';\nimport * as React from 'react';\nimport { ViewStyle } from 'react-native';\n\nimport { VideoLayout } from '../types';\nimport { CameraId } from '../hooks/useCamera';\n\nexport type VideoPreviewViewProps = {\n  /**\n   * `FILL` or `FIT` - it works just like RN Image component. `FILL` fills the whole view\n   * with video and it may cut some parts of the video. `FIT` scales the video so the whole\n   * video is visible, but it may leave some empty space in the view.\n   * @default `FILL`\n   */\n  videoLayout?: VideoLayout;\n  style?: ViewStyle;\n  /**\n   * Id of the camera used for preview. Get available cameras with `cameras` property.\n   * @default the first front camera\n   */\n  cameraId?: CameraId;\n};\n\nconst NativeView: React.ComponentType<VideoPreviewViewProps> =\n  requireNativeViewManager('VideoPreviewViewModule');\n\nexport const VideoPreviewView = React.forwardRef<\n  React.ComponentType<VideoPreviewViewProps>,\n  VideoPreviewViewProps\n>((props, ref) => (\n  // @ts-expect-error ref prop needs to be updated\n  <NativeView {...props} captureDeviceId={props.cameraId} ref={ref} />\n));\n"]}

package/build/hooks/useAudioSettings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useAudioSettings.d.ts","sourceRoot":"","sources":["../../src/hooks/useAudioSettings.ts"],"names":[],"mappings":"AAMA,MAAM,MAAM,qBAAqB,GAC7B,WAAW,GACX,SAAS,GACT,SAAS,GACT,UAAU,CAAC;AAEf,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,WAAW,CAAC;AAEzD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,qBAAqB,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AASF;;GAEG;AACH,wBAAgB,gBAAgB;IAyE5B;;OAEG;;IAEH;;OAEG;;sCAhDY,qBAAqB;+CAkBX,gBAAgB;;EAoC5C"}
+{"version":3,"file":"useAudioSettings.d.ts","sourceRoot":"","sources":["../../src/hooks/useAudioSettings.ts"],"names":[],"mappings":"AAMA,MAAM,MAAM,qBAAqB,GAC7B,WAAW,GACX,SAAS,GACT,SAAS,GACT,UAAU,CAAC;AAEf,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,WAAW,CAAC;AAEzD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,qBAAqB,CAAC;IAC5B,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAOF;;GAEG;AACH,wBAAgB,gBAAgB;IAsE5B;;OAEG;;IAEH;;OAEG;;sCAhDY,qBAAqB;+CAkBX,gBAAgB;;EAoC5C"}

package/build/hooks/useAudioSettings.js

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useState } from 'react';
 import { Platform } from 'react-native';
 import RNFishjamClientModule from '../RNFishjamClientModule';
-import { ReceivableEvents, eventEmitter } from '../common/eventEmitter';
+import { ReceivableEvents, useFishjamEvent } from './useFishjamEvent';
 /**
  * This hook manages audio settings.
  */
@@ -9,14 +9,13 @@ export function useAudioSettings() {
     const [selectedAudioOutputDevice, setSelectedAudioOutputDevice] = useState(null);
     const [availableDevices, setAvailableDevices] = useState([]);
     const onAudioDevice = useCallback((event) => {
-        setSelectedAudioOutputDevice(event.AudioDeviceUpdate.selectedDevice);
-        setAvailableDevices(event.AudioDeviceUpdate.availableDevices);
+        setSelectedAudioOutputDevice(event.selectedDevice);
+        setAvailableDevices(event.availableDevices);
     }, []);
+    useFishjamEvent(ReceivableEvents.AudioDeviceUpdate, onAudioDevice);
     useEffect(() => {
-        const eventListener = eventEmitter.addListener(ReceivableEvents.AudioDeviceUpdate, onAudioDevice);
         RNFishjamClientModule.startAudioSwitcher();
         return () => {
-            eventListener.remove();
             if (Platform.OS === 'android') {
                 RNFishjamClientModule.stopAudioSwitcher();
             }