@datadog/mobile-react-native-session-replay 2.6.2 → 2.6.4

package/DatadogSDKReactNativeSessionReplay.podspec

@@ -19,7 +19,7 @@ Pod::Spec.new do |s|
   s.dependency "React-Core"
 
   # /!\ Remember to keep the version in sync with DatadogSDKReactNative.podspec
-  s.dependency 'DatadogSessionReplay', '~> 2.22.0'
+  s.dependency 'DatadogSessionReplay', '~> 2.24.0'
   s.dependency 'DatadogSDKReactNative'
 
   s.test_spec 'Tests' do |test_spec|

package/android/build.gradle

@@ -139,6 +139,8 @@ android {
         java.srcDirs += ['src/rn76/kotlin']
       } else if (reactNativeMinorVersion >= 75) {
         java.srcDirs += ['src/rn75/kotlin']
+      } else if (reactNativeMinorVersion >= 69) {
+        java.srcDirs += ['src/rn69/kotlin']
       } else {
         java.srcDirs += ['src/rnlegacy/kotlin']
       }
@@ -197,8 +199,8 @@ dependencies {
     api "com.facebook.react:react-android:$reactNativeVersion"
   }
   implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
-  implementation "com.datadoghq:dd-sdk-android-session-replay:2.17.0"
-  implementation "com.datadoghq:dd-sdk-android-internal:2.17.0"
+  implementation "com.datadoghq:dd-sdk-android-session-replay:2.19.2"
+  implementation "com.datadoghq:dd-sdk-android-internal:2.19.2"
   implementation project(path: ':datadog_mobile-react-native')
 
   testImplementation "org.junit.platform:junit-platform-launcher:1.6.2"

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/DdSessionReplayImplementation.kt

@@ -9,6 +9,7 @@ package com.datadog.reactnative.sessionreplay
 import android.annotation.SuppressLint
 import com.datadog.android.api.feature.FeatureSdkCore
 import com.datadog.android.sessionreplay.SessionReplayConfiguration
+import com.datadog.android.sessionreplay._SessionReplayInternalProxy
 import com.datadog.reactnative.DatadogSDKWrapperStorage
 import com.datadog.reactnative.sessionreplay.utils.text.TextViewUtils
 import com.facebook.react.bridge.Promise
@@ -42,12 +43,17 @@ class DdSessionReplayImplementation(
         val sdkCore = DatadogSDKWrapperStorage.getSdkCore() as FeatureSdkCore
         val logger = sdkCore.internalLogger
         val textViewUtils = TextViewUtils.create(reactContext, logger)
+        val internalCallback = ReactNativeInternalCallback(reactContext)
         val configuration = SessionReplayConfiguration.Builder(replaySampleRate.toFloat())
             .startRecordingImmediately(startRecordingImmediately)
             .setImagePrivacy(privacySettings.imagePrivacyLevel)
             .setTouchPrivacy(privacySettings.touchPrivacyLevel)
             .setTextAndInputPrivacy(privacySettings.textAndInputPrivacyLevel)
             .addExtensionSupport(ReactNativeSessionReplayExtensionSupport(textViewUtils))
+            .let {
+                _SessionReplayInternalProxy(it).setInternalCallback(internalCallback)
+            }
+
 
         if (customEndpoint != "") {
             configuration.useCustomEndpoint(customEndpoint)

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/ReactNativeInternalCallback.kt

@@ -0,0 +1,23 @@
+/*
+ * Unless explicitly stated otherwise all files in this repository are licensed under the Apache License Version 2.0.
+ * This product includes software developed at Datadog (https://www.datadoghq.com/).
+ * Copyright 2016-Present Datadog, Inc.
+ */
+
+package com.datadog.reactnative.sessionreplay
+
+import android.app.Activity
+import com.datadog.android.sessionreplay.SessionReplayInternalCallback
+import com.facebook.react.bridge.ReactContext
+
+/**
+ * Responsible for defining the internal callback implementation for react-native that will allow
+ * overriding specific parts of the session replay android sdk.
+ */
+class ReactNativeInternalCallback(
+    private val reactContext: ReactContext,
+) : SessionReplayInternalCallback {
+    override fun getCurrentActivity(): Activity? {
+        return reactContext.currentActivity
+    }
+}

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/ReactNativeSessionReplayExtensionSupport.kt

@@ -14,8 +14,10 @@ import com.datadog.reactnative.sessionreplay.mappers.ReactEditTextMapper
 import com.datadog.reactnative.sessionreplay.mappers.ReactNativeImageViewMapper
 import com.datadog.reactnative.sessionreplay.mappers.ReactTextMapper
 import com.datadog.reactnative.sessionreplay.mappers.ReactViewGroupMapper
+import com.datadog.reactnative.sessionreplay.mappers.ReactViewModalMapper
 import com.datadog.reactnative.sessionreplay.utils.text.TextViewUtils
 import com.facebook.react.views.image.ReactImageView
+import com.facebook.react.views.modal.ReactModalHostView
 import com.facebook.react.views.text.ReactTextView
 import com.facebook.react.views.textinput.ReactEditText
 import com.facebook.react.views.view.ReactViewGroup
@@ -34,6 +36,7 @@ internal class ReactNativeSessionReplayExtensionSupport(
             MapperTypeWrapper(ReactViewGroup::class.java, ReactViewGroupMapper()),
             MapperTypeWrapper(ReactTextView::class.java, ReactTextMapper(textViewUtils)),
             MapperTypeWrapper(ReactEditText::class.java, ReactEditTextMapper(textViewUtils)),
+            MapperTypeWrapper(ReactModalHostView::class.java, ReactViewModalMapper()),
         )
     }
 

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/mappers/DefaultMapper.kt

@@ -0,0 +1,65 @@
+/*
+ * Unless explicitly stated otherwise all files in this repository are licensed under the Apache License Version 2.0.
+ * This product includes software developed at Datadog (https://www.datadoghq.com/).
+ * Copyright 2016-Present Datadog, Inc.
+ */
+
+package com.datadog.reactnative.sessionreplay.mappers
+
+import ReactViewBackgroundDrawableUtils
+import android.view.View
+import com.datadog.android.api.InternalLogger
+import com.datadog.android.sessionreplay.model.MobileSegment
+import com.datadog.android.sessionreplay.recorder.MappingContext
+import com.datadog.android.sessionreplay.recorder.mapper.BaseWireframeMapper
+import com.datadog.android.sessionreplay.utils.AsyncJobStatusCallback
+import com.datadog.android.sessionreplay.utils.DefaultColorStringFormatter
+import com.datadog.android.sessionreplay.utils.DefaultViewBoundsResolver
+import com.datadog.android.sessionreplay.utils.DefaultViewBoundsResolver.resolveViewGlobalBounds
+import com.datadog.android.sessionreplay.utils.DefaultViewIdentifierResolver
+import com.datadog.android.sessionreplay.utils.DrawableToColorMapper
+import com.datadog.reactnative.sessionreplay.utils.DrawableUtils
+
+internal open class DefaultMapper<T: View>(
+    private val drawableUtils: DrawableUtils =
+        ReactViewBackgroundDrawableUtils()
+): BaseWireframeMapper<T>(
+    viewIdentifierResolver = DefaultViewIdentifierResolver,
+    colorStringFormatter = DefaultColorStringFormatter,
+    viewBoundsResolver = DefaultViewBoundsResolver,
+    drawableToColorMapper = DrawableToColorMapper.getDefault()
+) {
+    override fun map(
+        view: T,
+        mappingContext: MappingContext,
+        asyncJobStatusCallback: AsyncJobStatusCallback,
+        internalLogger: InternalLogger
+    ): List<MobileSegment.Wireframe> {
+        val pixelDensity = mappingContext.systemInformation.screenDensity
+        val viewGlobalBounds = resolveViewGlobalBounds(view, pixelDensity)
+        val backgroundDrawable = drawableUtils.getReactBackgroundFromDrawable(view.background)
+
+        // view.alpha is the value of the opacity prop on the js side
+        val opacity = view.alpha
+
+        val (shapeStyle, border) =
+            if (backgroundDrawable != null) {
+                drawableUtils
+                    .resolveShapeAndBorder(backgroundDrawable, opacity, pixelDensity)
+            } else {
+                null to null
+            }
+
+        return listOf(
+            MobileSegment.Wireframe.ShapeWireframe(
+                resolveViewId(view),
+                viewGlobalBounds.x,
+                viewGlobalBounds.y,
+                viewGlobalBounds.width,
+                viewGlobalBounds.height,
+                shapeStyle = shapeStyle,
+                border = border
+            )
+        )
+    }
+}

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/mappers/ReactEditTextMapper.kt

@@ -61,7 +61,10 @@ internal class ReactEditTextMapper(
             mappingContext = mappingContext,
             asyncJobStatusCallback = asyncJobStatusCallback,
             internalLogger = internalLogger
-        ).filterNot { it is MobileSegment.Wireframe.ImageWireframe }
+        ).filterNot {
+            it is MobileSegment.Wireframe.ImageWireframe ||
+                    it is MobileSegment.Wireframe.PlaceholderWireframe
+        }
 
         return textViewUtils.mapTextViewToWireframes(
             wireframes = backgroundWireframes,

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/mappers/ReactTextMapper.kt

@@ -39,6 +39,9 @@ internal class ReactTextMapper(
             wireframes = wireframes,
             view = view,
             mappingContext = mappingContext,
-        )
+        ).filterNot {
+            it is MobileSegment.Wireframe.ImageWireframe ||
+                    it is MobileSegment.Wireframe.PlaceholderWireframe
+        }
     }
 }

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/mappers/ReactViewGroupMapper.kt

@@ -7,63 +7,11 @@
 package com.datadog.reactnative.sessionreplay.mappers
 
 import ReactViewBackgroundDrawableUtils
-import com.datadog.android.api.InternalLogger
-import com.datadog.android.sessionreplay.model.MobileSegment
-import com.datadog.android.sessionreplay.recorder.MappingContext
-import com.datadog.android.sessionreplay.recorder.mapper.BaseWireframeMapper
 import com.datadog.android.sessionreplay.recorder.mapper.TraverseAllChildrenMapper
-import com.datadog.android.sessionreplay.utils.AsyncJobStatusCallback
-import com.datadog.android.sessionreplay.utils.DefaultColorStringFormatter
-import com.datadog.android.sessionreplay.utils.DefaultViewBoundsResolver
-import com.datadog.android.sessionreplay.utils.DefaultViewBoundsResolver.resolveViewGlobalBounds
-import com.datadog.android.sessionreplay.utils.DefaultViewIdentifierResolver
-import com.datadog.android.sessionreplay.utils.DrawableToColorMapper
 import com.datadog.reactnative.sessionreplay.utils.DrawableUtils
 import com.facebook.react.views.view.ReactViewGroup
 
 internal class ReactViewGroupMapper(
     private val drawableUtils: DrawableUtils =
         ReactViewBackgroundDrawableUtils()
-) :
-    BaseWireframeMapper<ReactViewGroup>(
-        viewIdentifierResolver = DefaultViewIdentifierResolver,
-        colorStringFormatter = DefaultColorStringFormatter,
-        viewBoundsResolver = DefaultViewBoundsResolver,
-        drawableToColorMapper = DrawableToColorMapper.getDefault()
-    ),
-    TraverseAllChildrenMapper<ReactViewGroup> {
-
-    override fun map(
-        view: ReactViewGroup,
-        mappingContext: MappingContext,
-        asyncJobStatusCallback: AsyncJobStatusCallback,
-        internalLogger: InternalLogger
-    ): List<MobileSegment.Wireframe> {
-        val pixelDensity = mappingContext.systemInformation.screenDensity
-        val viewGlobalBounds = resolveViewGlobalBounds(view, pixelDensity)
-        val backgroundDrawable = drawableUtils.getReactBackgroundFromDrawable(view.background)
-
-        // view.alpha is the value of the opacity prop on the js side
-        val opacity = view.alpha
-
-        val (shapeStyle, border) =
-            if (backgroundDrawable != null) {
-                drawableUtils
-                    .resolveShapeAndBorder(backgroundDrawable, opacity, pixelDensity)
-            } else {
-                null to null
-            }
-
-        return listOf(
-            MobileSegment.Wireframe.ShapeWireframe(
-                resolveViewId(view),
-                viewGlobalBounds.x,
-                viewGlobalBounds.y,
-                viewGlobalBounds.width,
-                viewGlobalBounds.height,
-                shapeStyle = shapeStyle,
-                border = border
-            )
-        )
-    }
-}
+) : DefaultMapper<ReactViewGroup>(drawableUtils), TraverseAllChildrenMapper<ReactViewGroup>

package/android/src/main/kotlin/com/datadog/reactnative/sessionreplay/mappers/ReactViewModalMapper.kt

@@ -0,0 +1,16 @@
+/*
+ * Unless explicitly stated otherwise all files in this repository are licensed under the Apache License Version 2.0.
+ * This product includes software developed at Datadog (https://www.datadoghq.com/).
+ * Copyright 2016-Present Datadog, Inc.
+ */
+
+package com.datadog.reactnative.sessionreplay.mappers
+
+import ReactViewBackgroundDrawableUtils
+import com.datadog.reactnative.sessionreplay.utils.DrawableUtils
+import com.facebook.react.views.modal.ReactModalHostView
+
+internal class ReactViewModalMapper(
+    private val drawableUtils: DrawableUtils =
+        ReactViewBackgroundDrawableUtils()
+) : DefaultMapper<ReactModalHostView>(drawableUtils)

package/android/src/rn69/kotlin/com.datadog.reactnative.sessionreplay/utils/ReactViewBackgroundDrawableUtils.kt

@@ -0,0 +1,88 @@
+/*
+ * Unless explicitly stated otherwise all files in this repository are licensed under the Apache License Version 2.0.
+ * This product includes software developed at Datadog (https://www.datadoghq.com/).
+ * Copyright 2016-Present Datadog, Inc.
+ */
+import android.graphics.drawable.Drawable
+import android.graphics.drawable.InsetDrawable
+import android.graphics.drawable.LayerDrawable
+import com.datadog.android.sessionreplay.model.MobileSegment
+import com.datadog.reactnative.sessionreplay.utils.DrawableUtils
+import com.datadog.reactnative.sessionreplay.utils.formatAsRgba
+import com.facebook.react.uimanager.Spacing
+import com.facebook.react.views.view.ReactViewBackgroundDrawable
+
+internal class ReactViewBackgroundDrawableUtils() : DrawableUtils() {
+    override fun resolveShapeAndBorder(
+        drawable: Drawable,
+        opacity: Float,
+        pixelDensity: Float
+    ): Pair<MobileSegment.ShapeStyle?, MobileSegment.ShapeBorder?> {
+        if (drawable !is ReactViewBackgroundDrawable) {
+            return null to null
+        }
+
+        val borderProps = resolveBorder(drawable, pixelDensity)
+        val cornerRadius = (drawable.fullBorderRadius / pixelDensity).toLong()
+
+        val backgroundColor = getBackgroundColor(drawable)
+        val colorHexString = if (backgroundColor != null) {
+            formatAsRgba(backgroundColor)
+        } else {
+            return null to borderProps
+        }
+
+        return MobileSegment.ShapeStyle(
+            colorHexString,
+            opacity,
+            cornerRadius
+        ) to borderProps
+    }
+
+    override fun getReactBackgroundFromDrawable(drawable: Drawable?): Drawable? {
+        if (drawable is ReactViewBackgroundDrawable) {
+            return drawable
+        }
+
+        if (drawable is InsetDrawable) {
+            return getReactBackgroundFromDrawable(drawable.drawable)
+        }
+
+        if (drawable is LayerDrawable) {
+            for (layerNumber in 0 until drawable.numberOfLayers) {
+                val layer = drawable.getDrawable(layerNumber)
+                if (layer is ReactViewBackgroundDrawable) {
+                    return layer
+                }
+            }
+        }
+
+        return null
+    }
+
+    private fun resolveBorder(
+        backgroundDrawable: ReactViewBackgroundDrawable,
+        pixelDensity: Float
+    ): MobileSegment.ShapeBorder {
+        val borderWidth = (backgroundDrawable.fullBorderWidth / pixelDensity).toLong()
+        val borderColor = formatAsRgba(backgroundDrawable.getBorderColor(Spacing.ALL))
+
+        return MobileSegment.ShapeBorder(
+            color = borderColor,
+            width = borderWidth
+        )
+    }
+
+    private fun getBackgroundColor(
+        backgroundDrawable: ReactViewBackgroundDrawable
+    ): Int? {
+        return reflectionUtils.getDeclaredField(
+            backgroundDrawable,
+            COLOR_FIELD_NAME
+        ) as Int?
+    }
+
+    private companion object {
+        private const val COLOR_FIELD_NAME = "mColor"
+    }
+}

package/android/src/rnlegacy/kotlin/com.datadog.reactnative.sessionreplay/utils/ReactViewBackgroundDrawableUtils.kt

@@ -1,3 +1,4 @@
+import android.graphics.Color
 import android.graphics.drawable.Drawable
 import android.graphics.drawable.InsetDrawable
 import android.graphics.drawable.LayerDrawable
@@ -60,7 +61,7 @@ internal class ReactViewBackgroundDrawableUtils() : DrawableUtils() {
         pixelDensity: Float
     ): MobileSegment.ShapeBorder {
         val borderWidth = (backgroundDrawable.fullBorderWidth / pixelDensity).toLong()
-        val borderColor = formatAsRgba(backgroundDrawable.getBorderColor(Spacing.ALL))
+        val borderColor = formatAsRgba(getBorderColor(backgroundDrawable))
 
         return MobileSegment.ShapeBorder(
             color = borderColor,
@@ -68,6 +69,26 @@ internal class ReactViewBackgroundDrawableUtils() : DrawableUtils() {
         )
     }
 
+    private fun getBorderColor(backgroundDrawable: ReactViewBackgroundDrawable): Int {
+        val borderRgb = reflectionUtils.getDeclaredField(
+            backgroundDrawable,
+            BORDER_RGB_FIELD_NAME
+        ) as Spacing?
+
+        val borderAlpha = reflectionUtils.getDeclaredField(
+            backgroundDrawable,
+            BORDER_ALPHA_FIELD_NAME
+        ) as Spacing?
+
+        val rgb = borderRgb?.get(Spacing.ALL) ?: DEFAULT_BORDER_RGB
+        val alpha = borderAlpha?.get(Spacing.ALL) ?: DEFAULT_BORDER_ALPHA
+
+        val rgbComponent = 0x00FFFFFF and rgb.toInt()
+        val alphaComponent = -0x1000000 and ((alpha.toInt()) shl 24)
+
+        return rgbComponent or alphaComponent
+    }
+
     private fun getBackgroundColor(
         backgroundDrawable: ReactViewBackgroundDrawable
     ): Int? {
@@ -79,5 +100,9 @@ internal class ReactViewBackgroundDrawableUtils() : DrawableUtils() {
 
     private companion object {
         private const val COLOR_FIELD_NAME = "mColor"
+        private const val BORDER_RGB_FIELD_NAME = "mBorderRGB"
+        private const val BORDER_ALPHA_FIELD_NAME = "mBorderAlpha"
+        private const val DEFAULT_BORDER_RGB: Int = 0x00FFFFFF and Color.BLACK
+        private const val DEFAULT_BORDER_ALPHA: Int = -0x1000000 and Color.BLACK
     }
 }

package/android/src/test/kotlin/com/datadog/reactnative/sessionreplay/ReactNativeSessionReplayExtensionSupportTest.kt

@@ -11,6 +11,7 @@ import com.datadog.reactnative.sessionreplay.mappers.ReactEditTextMapper
 import com.datadog.reactnative.sessionreplay.mappers.ReactNativeImageViewMapper
 import com.datadog.reactnative.sessionreplay.mappers.ReactTextMapper
 import com.datadog.reactnative.sessionreplay.mappers.ReactViewGroupMapper
+import com.datadog.reactnative.sessionreplay.mappers.ReactViewModalMapper
 import com.datadog.reactnative.sessionreplay.utils.text.TextViewUtils
 import com.facebook.react.bridge.NativeModule
 import com.facebook.react.bridge.ReactContext
@@ -62,7 +63,7 @@ internal class ReactNativeSessionReplayExtensionSupportTest {
         val customViewMappers = testedExtensionSupport.getCustomViewMappers()
 
         // Then
-        assertThat(customViewMappers).hasSize(4)
+        assertThat(customViewMappers).hasSize(5)
 
         assertThat(customViewMappers[0].getUnsafeMapper())
             .isInstanceOf(ReactNativeImageViewMapper::class.java)
@@ -75,5 +76,8 @@ internal class ReactNativeSessionReplayExtensionSupportTest {
 
         assertThat(customViewMappers[3].getUnsafeMapper())
             .isInstanceOf(ReactEditTextMapper::class.java)
+
+        assertThat(customViewMappers[4].getUnsafeMapper())
+            .isInstanceOf(ReactViewModalMapper::class.java)
     }
 }

package/lib/commonjs/specs/NativeDdSessionReplay.js

@@ -14,6 +14,6 @@ var _reactNative = require("react-native");
 /**
  * Do not import this Spec directly, use NativeSessionReplayType instead.
  */
-// eslint-disable-next-line func-names
+// eslint-disable-next-line import/no-default-export
 var _default = exports.default = _reactNative.TurboModuleRegistry.get('DdSessionReplay');
 //# sourceMappingURL=NativeDdSessionReplay.js.map

package/lib/module/specs/NativeDdSessionReplay.js

@@ -12,6 +12,6 @@ import { TurboModuleRegistry } from 'react-native';
  * Do not import this Spec directly, use NativeSessionReplayType instead.
  */
 
-// eslint-disable-next-line func-names
+// eslint-disable-next-line import/no-default-export
 export default TurboModuleRegistry.get('DdSessionReplay');
 //# sourceMappingURL=NativeDdSessionReplay.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@datadog/mobile-react-native-session-replay",
-    "version": "2.6.2",
+    "version": "2.6.4",
     "description": "A client-side React Native module to enable session replay with Datadog",
     "keywords": [
         "datadog",
@@ -90,5 +90,5 @@
             "javaPackageName": "com.datadog.reactnative.sessionreplay"
         }
     },
-    "gitHead": "d6ff835a3572d9897b0c1c8ed47fbbba9bc2f4df"
+    "gitHead": "8c31bf4d2a3fb6e1f1596b36cd61fa27c41b8576"
 }

package/src/specs/NativeDdSessionReplay.ts

@@ -45,5 +45,5 @@ export interface Spec extends TurboModule {
     stopRecording(): Promise<void>;
 }
 
-// eslint-disable-next-line func-names
+// eslint-disable-next-line import/no-default-export
 export default TurboModuleRegistry.get<Spec>('DdSessionReplay');