@fishjam-cloud/react-native-client 0.4.1 → 0.6.0

package/android/build.gradle

@@ -2,7 +2,7 @@ apply plugin: 'com.android.library'
 apply plugin: 'kotlin-android'
 apply plugin: 'maven-publish'
 
-def packageVersion = '0.4.1'
+def packageVersion = '0.6.0'
 
 group = 'io.fishjam.reactnative'
 version = "${packageVersion}"

package/android/src/main/java/io/fishjam/reactnative/EmitableEvents.kt

@@ -1,28 +1,112 @@
 package io.fishjam.reactnative
 
-@Suppress("ktlint:standard:enum-entry-name-case")
-enum class PeerStatus {
-  connecting,
-  connected,
-  error,
-  idle
+import com.fishjamcloud.client.ReconnectionStatus
+import com.fishjamcloud.client.models.SimulcastConfig
+import com.twilio.audioswitch.AudioDevice
+import io.fishjam.reactnative.extensions.LocalCamera
+
+enum class PeerStatus(
+  val status: String
+) {
+  Connecting("connecting"),
+  Connected("connected"),
+  Idle("idle"),
+  Error("error")
 }
 
-enum class EmitableEvents {
-  IsCameraOn,
-  IsMicrophoneOn,
-  IsScreenShareOn,
-  SimulcastConfigUpdate,
-  PeersUpdate,
-  AudioDeviceUpdate,
-  BandwidthEstimation,
-  ReconnectionRetriesLimitReached,
-  ReconnectionStarted,
-  Reconnected,
-  Warning,
-  PeerStatusChanged;
+class EmitableEvent private constructor(
+  private val event: EventName,
+  private val eventContent: Any? = null
+) {
+  enum class EventName {
+    IsMicrophoneOn,
+    IsScreenShareOn,
+    SimulcastConfigUpdate,
+    PeersUpdate,
+    AudioDeviceUpdate,
+    BandwidthEstimation,
+    Warning,
+    PeerStatusChanged,
+    ReconnectionStatusChanged,
+    CurrentCameraChanged
+  }
+
+  val name: String
+    get() = event.name
+
+  val data: Map<String, Any?>
+    get() = mapOf(event.name to eventContent)
 
   companion object {
-    val allEvents = EmitableEvents.entries.map { it.name }.toTypedArray()
+    fun isMicrophoneOn(enabled: Boolean) = EmitableEvent(EventName.IsMicrophoneOn, enabled)
+
+    fun isScreenShareOn(enabled: Boolean) = EmitableEvent(EventName.IsScreenShareOn, enabled)
+
+    fun bandwidthEstimation(estimation: Long) = EmitableEvent(EventName.BandwidthEstimation, estimation.toFloat())
+
+    fun warning(message: String) = EmitableEvent(EventName.Warning, message)
+
+    fun peerStatusChanged(peerStatus: PeerStatus) = EmitableEvent(EventName.PeerStatusChanged, peerStatus.status)
+
+    fun reconnectionStatusChanged(reconnectionStatus: ReconnectionStatus) =
+      EmitableEvent(EventName.ReconnectionStatusChanged, reconnectionStatus.status)
+
+    fun currentCameraChanged(
+      localCamera: LocalCamera?,
+      isCameraOn: Boolean
+    ) = EmitableEvent(
+      EventName.CurrentCameraChanged,
+      mapOf(
+        "currentCamera" to localCamera,
+        "isCameraOn" to isCameraOn
+      )
+    )
+
+    fun simulcastConfigUpdate(simulcastConfig: SimulcastConfig) =
+      EmitableEvent(
+        EventName.SimulcastConfigUpdate,
+        mapOf(
+          "enabled" to simulcastConfig.enabled,
+          "activeEncodings" to simulcastConfig.activeEncodings.map { it.rid }
+        )
+      )
+
+    fun peersUpdate(peersData: List<Map<String, Any?>>) = EmitableEvent(EventName.PeersUpdate, peersData)
+
+    fun audioDeviceUpdate(
+      audioDevices: List<AudioDevice>,
+      selectedDevice: AudioDevice?
+    ): EmitableEvent {
+      val audioDeviceAsMap = { audioDevice: AudioDevice ->
+        mapOf(
+          "name" to audioDevice.name,
+          "type" to AudioDeviceKind.fromAudioDevice(audioDevice)?.typeName
+        )
+      }
+
+      return EmitableEvent(
+        EventName.AudioDeviceUpdate,
+        mapOf(
+          "selectedDevice" to (
+            if (selectedDevice != null) {
+              audioDeviceAsMap(
+                selectedDevice
+              )
+            } else {
+              null
+            }
+          ),
+          "availableDevices" to
+            audioDevices.map { audioDevice ->
+              audioDeviceAsMap(
+                audioDevice
+              )
+            }
+        )
+      )
+    }
+
+    val allEvents: Array<String>
+      get() = EventName.entries.map { it.name }.toTypedArray()
   }
 }

package/android/src/main/java/io/fishjam/reactnative/RNFishjamClient.kt

@@ -7,6 +7,9 @@ import android.media.projection.MediaProjectionManager
 import androidx.appcompat.app.AppCompatActivity
 import com.fishjamcloud.client.FishjamClient
 import com.fishjamcloud.client.FishjamClientListener
+import com.fishjamcloud.client.ReconnectionStatus
+import com.fishjamcloud.client.media.CaptureDevice
+import com.fishjamcloud.client.media.CaptureDeviceChangedListener
 import com.fishjamcloud.client.media.LocalAudioTrack
 import com.fishjamcloud.client.media.LocalScreenShareTrack
 import com.fishjamcloud.client.media.LocalVideoTrack
@@ -27,6 +30,8 @@ import com.twilio.audioswitch.AudioDevice
 import expo.modules.kotlin.AppContext
 import expo.modules.kotlin.Promise
 import expo.modules.kotlin.exception.CodedException
+import fishjam.media_events.server.Server
+import io.fishjam.reactnative.extensions.toLocalCamera
 import io.fishjam.reactnative.foregroundService.ForegroundServiceManager
 import io.fishjam.reactnative.managers.LocalCameraTracksChangedListenersManager
 import io.fishjam.reactnative.managers.LocalTracksSwitchListenersManager
@@ -40,7 +45,8 @@ import org.webrtc.Logging
 
 class RNFishjamClient(
   val sendEvent: (name: String, data: Map<String, Any?>) -> Unit
-) : FishjamClientListener {
+) : FishjamClientListener,
+  CaptureDeviceChangedListener {
   private val SCREENSHARE_REQUEST = 1
 
   var isMicrophoneOn = false
@@ -68,14 +74,21 @@ class RNFishjamClient(
 
   var appContext: AppContext? = null
 
-  var peerStatus = PeerStatus.idle
+  var peerStatus = PeerStatus.Idle
     private set(value) {
       field = value
-      val event = EmitableEvents.PeerStatusChanged
-      emitEvent(event, mapOf(event.name to value))
+      emitEvent(EmitableEvent.peerStatusChanged(value))
     }
 
-  private var foregroundServiceManager: ForegroundServiceManager? = null
+  var reconnectionStatus = ReconnectionStatus.Idle
+    private set(value) {
+      field = value
+      emitEvent(EmitableEvent.reconnectionStatusChanged(value))
+    }
+
+  private val foregroundServiceManager by lazy {
+    ForegroundServiceManager(appContext ?: throw CodedException("appContext not found"))
+  }
 
   companion object {
     val trackUpdateListenersManager = TracksUpdateListenersManager()
@@ -236,7 +249,7 @@ class RNFishjamClient(
     CoroutineScope(Dispatchers.Main).launch {
       connectPromise?.reject(ConnectionError(reason))
       connectPromise = null
-      peerStatus = PeerStatus.error
+      peerStatus = PeerStatus.Error
     }
   }
 
@@ -247,14 +260,14 @@ class RNFishjamClient(
     config: ConnectConfig,
     promise: Promise
   ) {
-    peerStatus = PeerStatus.connecting
+    peerStatus = PeerStatus.Connecting
     connectPromise = promise
     localUserMetadata = mapOf("server" to emptyMap(), "peer" to peerMetadata)
     fishjamClient.connect(
       com.fishjamcloud.client.ConnectConfig(
         url,
         peerToken,
-        localUserMetadata,
+        peerMetadata,
         ReconnectConfig(
           config.reconnectConfig.maxAttempts,
           config.reconnectConfig.initialDelayMs,
@@ -278,20 +291,22 @@ class RNFishjamClient(
     }
   }
 
-  suspend fun startCamera(config: CameraConfig) {
+  suspend fun startCamera(config: CameraConfig): Boolean {
     if (isCameraInitialized) {
-      emitWarning("Camera already started. You may only call startCamera once before leaveRoom is called.")
-      return
+      emitEvent(EmitableEvent.warning("Camera already started. You may only call startCamera once before leaveRoom is called."))
+      return true
     }
     if (!PermissionUtils.requestCameraPermission(appContext)) {
-      emitWarning("Camera permission not granted.")
-      return
+      emitEvent(EmitableEvent.warning("Camera permission not granted."))
+      return false
     }
 
     val cameraTrack = createCameraTrack(config)
+    cameraTrack.captureDeviceChangedListener = this
     setCameraTrackState(cameraTrack, config.cameraEnabled)
     emitEndpoints()
     isCameraInitialized = true
+    return true
   }
 
   private suspend fun createCameraTrack(config: CameraConfig): LocalVideoTrack {
@@ -310,8 +325,7 @@ class RNFishjamClient(
   ) {
     cameraTrack.setEnabled(isEnabled)
     isCameraOn = isEnabled
-    val event = EmitableEvents.IsCameraOn
-    emitEvent(event, mapOf(event.name to isEnabled))
+    emitEvent(EmitableEvent.currentCameraChanged(cameraTrack.getCaptureDevice()?.toLocalCamera(), isEnabled))
     localCameraTracksChangedListenersManager.notifyListeners()
   }
 
@@ -337,7 +351,7 @@ class RNFishjamClient(
 
   private suspend fun startMicrophone() {
     if (!PermissionUtils.requestMicrophonePermission(appContext)) {
-      emitWarning("Microphone permission not granted.")
+      emitEvent(EmitableEvent.warning("Microphone permission not granted."))
       return
     }
 
@@ -352,8 +366,7 @@ class RNFishjamClient(
   ) {
     microphoneTrack.setEnabled(isEnabled)
     isMicrophoneOn = isEnabled
-    val event = EmitableEvents.IsMicrophoneOn
-    emitEvent(event, mapOf(event.name to isEnabled))
+    emitEvent(EmitableEvent.isMicrophoneOn(isEnabled))
   }
 
   suspend fun toggleMicrophone(): Boolean {
@@ -362,6 +375,15 @@ class RNFishjamClient(
     } else {
       getLocalAudioTrack()?.let { setMicrophoneTrackState(it, !isMicrophoneOn) }
     }
+
+    updateLocalAudioTrackMetadata(
+      mapOf(
+        "active" to isMicrophoneOn,
+        "paused" to !isMicrophoneOn, // TODO: FCE-711,
+        "type" to "microphone"
+      )
+    )
+
     return isMicrophoneOn
   }
 
@@ -380,22 +402,13 @@ class RNFishjamClient(
     }
   }
 
-  fun configureForegroundService(config: ForegroundServiceNotificationConfig) {
-    if (foregroundServiceManager == null) {
-      foregroundServiceManager = ForegroundServiceManager(appContext!!, config)
-    }
-  }
-
-  suspend fun startForegroundService(config: ForegroundServicePermissionsConfig) {
-    if (foregroundServiceManager == null) {
-      throw CodedException("Foreground service not configured.")
-    }
-
-    foregroundServiceManager?.startForegroundService(config)
+  suspend fun startForegroundService(config: ForegroundServiceConfig) {
+    foregroundServiceManager.updateServiceWithConfig(config)
+    foregroundServiceManager.start()
   }
 
   fun stopForegroundService() {
-    foregroundServiceManager?.stopForegroundService()
+    foregroundServiceManager.stop()
   }
 
   suspend fun toggleScreenShare(screenShareOptions: ScreenShareOptions) {
@@ -408,6 +421,7 @@ class RNFishjamClient(
         screenShareOptions.maxBandwidthMap,
         screenShareOptions.maxBandwidthInt
       )
+
     if (!isScreenShareOn) {
       ensureConnected()
       startScreenShare()
@@ -421,7 +435,6 @@ class RNFishjamClient(
       mapOf(
         "id" to endpoint.id,
         "isLocal" to (endpoint.id == fishjamClient.getLocalEndpoint().id),
-        "type" to endpoint.type,
         "metadata" to endpoint.metadata,
         "tracks" to
           endpoint.tracks.values.mapNotNull { track ->
@@ -440,7 +453,11 @@ class RNFishjamClient(
                   "id" to track.id(),
                   "type" to "Audio",
                   "metadata" to track.metadata,
-                  "vadStatus" to track.vadStatus.value
+                  "vadStatus" to
+                    when (track.vadStatus) {
+                      Server.MediaEvent.VadNotification.Status.STATUS_SPEECH -> "speech"
+                      else -> "silence"
+                    }
                 )
 
               is LocalVideoTrack ->
@@ -475,19 +492,12 @@ class RNFishjamClient(
   fun getCaptureDevices(): List<Map<String, Any>> {
     val devices = LocalVideoTrack.getCaptureDevices(appContext?.reactContext!!)
     return devices.map { device ->
-      mapOf<String, Any>(
-        "id" to device.deviceName,
-        "name" to device.deviceName,
-        "facingDirection" to
-          when (true) {
-            device.isFrontFacing -> "front"
-            device.isBackFacing -> "back"
-            else -> "unspecified"
-          }
-      )
+      device.toLocalCamera()
     }
   }
 
+  fun getCurrentCaptureDevice(): Map<String, Any>? = getLocalVideoTrack()?.getCaptureDevice()?.toLocalCamera()
+
   fun updatePeerMetadata(metadata: Metadata) {
     ensureConnected()
     fishjamClient.updatePeerMetadata(metadata)
@@ -508,7 +518,7 @@ class RNFishjamClient(
     }
   }
 
-  fun updateLocalAudioTrackMetadata(metadata: Metadata) {
+  private fun updateLocalAudioTrackMetadata(metadata: Metadata) {
     ensureAudioTrack()
     getLocalAudioTrack()?.let {
       updateTrackMetadata(it.id(), metadata)
@@ -606,13 +616,15 @@ class RNFishjamClient(
     fishjamClient.setTargetTrackEncoding(trackId, encoding.toTrackEncoding())
   }
 
-  fun toggleVideoTrackEncoding(encoding: String): Map<String, Any> {
+  fun toggleVideoTrackEncoding(encoding: String): Map<String, Any?> {
     ensureVideoTrack()
     val trackId = getLocalVideoTrack()?.id() ?: return emptyMap()
     videoSimulcastConfig = toggleTrackEncoding(encoding, trackId, videoSimulcastConfig)
-    val eventName = EmitableEvents.SimulcastConfigUpdate
-    emitEvent(eventName, getSimulcastConfigAsRNMap(videoSimulcastConfig))
-    return getSimulcastConfigAsRNMap(videoSimulcastConfig)
+
+    val event = EmitableEvent.simulcastConfigUpdate(videoSimulcastConfig)
+    emitEvent(event)
+
+    return event.data
   }
 
   fun setVideoTrackEncodingBandwidth(
@@ -712,6 +724,10 @@ class RNFishjamClient(
     if (mediaProjectionIntent == null) {
       throw MissingScreenSharePermission()
     }
+
+    foregroundServiceManager.updateService { screenSharingEnabled = true }
+    foregroundServiceManager.start()
+
     fishjamClient.createScreenShareTrack(
       mediaProjectionIntent!!,
       videoParameters,
@@ -743,13 +759,14 @@ class RNFishjamClient(
 
   private fun setScreenShareTrackState(isEnabled: Boolean) {
     isScreenShareOn = isEnabled
-    val event = EmitableEvents.IsScreenShareOn
-    emitEvent(event, mapOf(event.name to isEnabled))
+    emitEvent(EmitableEvent.isScreenShareOn(isEnabled))
   }
 
   private fun stopScreenShare() {
     ensureScreenShareTrack()
     coroutineScope.launch {
+      foregroundServiceManager.updateService { screenSharingEnabled = false }
+      foregroundServiceManager.start()
       val screenShareTrack =
         fishjamClient.getLocalEndpoint().tracks.values.first { track ->
           track is LocalScreenShareTrack
@@ -762,58 +779,21 @@ class RNFishjamClient(
     }
   }
 
-  private fun emitEvent(
-    event: EmitableEvents,
-    data: Map<String, Any?> = mapOf()
-  ) {
+  private fun emitEvent(event: EmitableEvent) {
     CoroutineScope(Dispatchers.Main).launch {
-      sendEvent(event.name, data)
+      sendEvent(event.name, event.data)
     }
   }
 
-  fun emitWarning(warning: String) {
-    emitEvent(EmitableEvents.Warning, mapOf("message" to warning))
-  }
-
   private fun emitEndpoints() {
-    val event = EmitableEvents.PeersUpdate
-    emitEvent(event, mapOf(event.name to getPeers()))
+    emitEvent(EmitableEvent.peersUpdate(getPeers()))
   }
 
-  private fun audioDeviceAsRNMap(audioDevice: AudioDevice): Map<String, String?> =
-    mapOf(
-      "name" to audioDevice.name,
-      "type" to AudioDeviceKind.fromAudioDevice(audioDevice)?.typeName
-    )
-
   private fun emitAudioDeviceEvent(
     audioDevices: List<AudioDevice>,
     selectedDevice: AudioDevice?
   ) {
-    val event = EmitableEvents.AudioDeviceUpdate
-    emitEvent(
-      event,
-      mapOf(
-        event.name to
-          mapOf(
-            "selectedDevice" to (
-              if (selectedDevice != null) {
-                audioDeviceAsRNMap(
-                  selectedDevice
-                )
-              } else {
-                null
-              }
-            ),
-            "availableDevices" to
-              audioDevices.map { audioDevice ->
-                audioDeviceAsRNMap(
-                  audioDevice
-                )
-              }
-          )
-      )
-    )
+    emitEvent(EmitableEvent.audioDeviceUpdate(audioDevices, selectedDevice))
   }
 
   private fun getSimulcastConfigAsRNMap(simulcastConfig: SimulcastConfig): Map<String, Any> =
@@ -834,7 +814,7 @@ class RNFishjamClient(
       connectPromise?.resolve(null)
       connectPromise = null
       emitEndpoints()
-      peerStatus = PeerStatus.connected
+      peerStatus = PeerStatus.Connected
     }
   }
 
@@ -885,12 +865,11 @@ class RNFishjamClient(
   override fun onPeerUpdated(peer: Peer) {}
 
   override fun onBandwidthEstimationChanged(estimation: Long) {
-    val event = EmitableEvents.BandwidthEstimation
-    emitEvent(event, mapOf(event.name to estimation.toFloat()))
+    emitEvent(EmitableEvent.bandwidthEstimation(estimation))
   }
 
   override fun onDisconnected() {
-    peerStatus = PeerStatus.idle
+    peerStatus = PeerStatus.Idle
   }
 
   override fun onSocketClose(
@@ -900,7 +879,7 @@ class RNFishjamClient(
     CoroutineScope(Dispatchers.Main).launch {
       connectPromise?.reject(SocketClosedError(code, reason))
       connectPromise = null
-      peerStatus = PeerStatus.error
+      peerStatus = PeerStatus.Idle
     }
   }
 
@@ -908,18 +887,23 @@ class RNFishjamClient(
     CoroutineScope(Dispatchers.Main).launch {
       connectPromise?.reject(SocketError(t.message ?: t.toString()))
       connectPromise = null
+      peerStatus = PeerStatus.Error
     }
   }
 
   override fun onReconnected() {
-    emitEvent(EmitableEvents.Reconnected)
+    reconnectionStatus = ReconnectionStatus.Reconnecting
   }
 
   override fun onReconnectionStarted() {
-    emitEvent(EmitableEvents.ReconnectionStarted)
+    reconnectionStatus = ReconnectionStatus.Idle
   }
 
   override fun onReconnectionRetriesLimitReached() {
-    emitEvent(EmitableEvents.ReconnectionRetriesLimitReached)
+    reconnectionStatus = ReconnectionStatus.Error
+  }
+
+  override fun onCaptureDeviceChanged(captureDevice: CaptureDevice?) {
+    emitEvent(EmitableEvent.currentCameraChanged(captureDevice?.toLocalCamera(), isCameraOn))
   }
 }

package/android/src/main/java/io/fishjam/reactnative/RNFishjamClientModule.kt

@@ -81,7 +81,7 @@ class ConnectConfig : Record {
   val reconnectConfig: ReconnectConfig = ReconnectConfig()
 }
 
-class ForegroundServiceNotificationConfig : Record {
+class ForegroundServiceConfig : Record {
   @Field
   val channelId: String? = null
 
@@ -93,17 +93,12 @@ class ForegroundServiceNotificationConfig : Record {
 
   @Field
   val notificationTitle: String? = null
-}
-
-class ForegroundServicePermissionsConfig : Record {
-  @Field
-  val enableCamera: Boolean = false
 
   @Field
-  val enableMicrophone: Boolean = false
+  val enableCamera: Boolean? = null
 
   @Field
-  val enableScreenSharing: Boolean = false
+  val enableMicrophone: Boolean? = null
 }
 
 class RNFishjamClientModule : Module() {
@@ -118,7 +113,7 @@ class RNFishjamClientModule : Module() {
 
       Name("RNFishjamClient")
 
-      Events(EmitableEvents.allEvents)
+      Events(EmitableEvent.allEvents)
 
       OnCreate {
         rnFishjamClient.onModuleCreate(appContext)
@@ -148,12 +143,24 @@ class RNFishjamClientModule : Module() {
         return@Property rnFishjamClient.getCaptureDevices()
       }
 
+      Property("currentCamera") {
+        return@Property rnFishjamClient.getCurrentCaptureDevice()
+      }
+
       Property("isScreenShareOn") {
         return@Property rnFishjamClient.isScreenShareOn
       }
 
       Property("peerStatus") {
-        return@Property rnFishjamClient.peerStatus
+        return@Property rnFishjamClient.peerStatus.status
+      }
+
+      Property("reconnectionStatus") {
+        return@Property rnFishjamClient.reconnectionStatus.status
+      }
+
+      Function("getPeers") {
+        return@Function rnFishjamClient.getPeers()
       }
 
       AsyncFunction(
@@ -171,8 +178,8 @@ class RNFishjamClientModule : Module() {
       }
 
       AsyncFunction("startCamera") Coroutine { config: CameraConfig ->
-        withContext(Dispatchers.Main) {
-          rnFishjamClient.startCamera(config)
+        return@Coroutine withContext(Dispatchers.Main) {
+          return@withContext rnFishjamClient.startCamera(config)
         }
       }
 
@@ -216,12 +223,6 @@ class RNFishjamClientModule : Module() {
         }
       }
 
-      AsyncFunction("getPeers") Coroutine { ->
-        withContext(Dispatchers.Main) {
-          rnFishjamClient.getPeers()
-        }
-      }
-
       AsyncFunction("updatePeerMetadata") Coroutine { metadata: Map<String, Any> ->
         withContext(Dispatchers.Main) {
           rnFishjamClient.updatePeerMetadata(metadata)
@@ -234,12 +235,6 @@ class RNFishjamClientModule : Module() {
         }
       }
 
-      AsyncFunction("updateAudioTrackMetadata") Coroutine { metadata: Map<String, Any> ->
-        withContext(Dispatchers.Main) {
-          rnFishjamClient.updateLocalAudioTrackMetadata(metadata)
-        }
-      }
-
       AsyncFunction("updateScreenShareTrackMetadata") Coroutine { metadata: Map<String, Any> ->
         withContext(Dispatchers.Main) {
           rnFishjamClient.updateLocalScreenShareTrackMetadata(metadata)
@@ -301,18 +296,14 @@ class RNFishjamClientModule : Module() {
       }
 
       AsyncFunction("changeWebRTCLoggingSeverity") Coroutine { severity: String ->
-        CoroutineScope(Dispatchers.Main).launch {
+        withContext(Dispatchers.Main) {
           rnFishjamClient.changeWebRTCLoggingSeverity(severity)
         }
       }
 
       AsyncFunction("getStatistics") { rnFishjamClient.getStatistics() }
 
-      Function("configureForegroundService") { config: ForegroundServiceNotificationConfig ->
-        return@Function rnFishjamClient.configureForegroundService(config)
-      }
-
-      AsyncFunction("startForegroundService") Coroutine { config: ForegroundServicePermissionsConfig ->
+      AsyncFunction("startForegroundService") Coroutine { config: ForegroundServiceConfig ->
         rnFishjamClient.startForegroundService(config)
       }
 

package/android/src/main/java/io/fishjam/reactnative/VideoRendererViewModule.kt

@@ -15,13 +15,17 @@ class VideoRendererViewModule : Module() {
           RNFishjamClient.localTracksSwitchListenerManager.remove(view)
         }
 
-        Prop("trackId") { view: VideoRendererView, trackId: String ->
+        Prop("trackId") { view, trackId: String ->
           view.init(trackId)
         }
 
-        Prop("videoLayout") { view: VideoRendererView, videoLayout: String ->
+        Prop("videoLayout") { view, videoLayout: String ->
           view.setVideoLayout(videoLayout)
         }
+
+        Prop("skipRenderOutsideVisibleArea") { view, skipRenderOutsideVisibleArea: Boolean ->
+          view.checkVisibilityDelayMillis = if (skipRenderOutsideVisibleArea) 1000 else null
+        }
       }
     }
 }