@multiplayer-app/session-recorder-react-native 0.0.1-beta.1 → 0.0.1-beta.10

package/dist/utils/viewHierarchyTracker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewHierarchyTracker.js","sourceRoot":"","sources":["../../src/utils/viewHierarchyTracker.ts"],"names":[],"mappings":"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"}

package/docs/NATIVE_MODULE_SETUP.md

@@ -0,0 +1,177 @@
+# Native Module Setup Guide
+
+This guide explains how to properly set up the Session Recorder React Native library with native modules in both React Native and Expo projects.
+
+## Issues Fixed
+
+### 1. Missing iOS Native Files in NPM Package
+
+**Problem**: The iOS native implementation files (`SessionRecorderNative.m` and `SessionRecorderNative.swift`) were not being included in the published npm package.
+
+**Solution**: Updated `.npmignore` to exclude source files but include the compiled native modules.
+
+### 2. Auto-linking Configuration
+
+**Problem**: The library wasn't properly configured for auto-linking in Expo projects.
+
+**Solution**:
+
+- Added `expo` configuration section to `package.json`
+- Created an Expo plugin for automatic Podfile configuration
+- Updated podspec with proper Expo compatibility settings
+
+### 3. Podspec Configuration
+
+**Problem**: The podspec wasn't optimized for Expo compatibility.
+
+**Solution**: Added proper header search paths and Expo-specific configurations.
+
+## Setup Instructions
+
+### For Expo Projects
+
+1. **Install the package**:
+
+   ```bash
+   npm install @multiplayer-app/session-recorder-react-native
+   ```
+
+2. **Add to app.json/app.config.js**:
+
+   ```json
+   {
+     "expo": {
+       "plugins": ["@multiplayer-app/session-recorder-react-native"]
+     }
+   }
+   ```
+
+   The plugin will automatically be detected via the `app.plugin.js` file in the package root.
+
+3. **Run prebuild** (if using development build):
+
+   ```bash
+   npx expo prebuild --clean
+   ```
+
+4. **Install iOS dependencies**:
+   ```bash
+   cd ios && pod install && cd ..
+   ```
+
+### For React Native CLI Projects
+
+1. **Install the package**:
+
+   ```bash
+   npm install @multiplayer-app/session-recorder-react-native
+   ```
+
+2. **iOS Setup**:
+
+   ```bash
+   cd ios && pod install && cd ..
+   ```
+
+3. **Android Setup**: No additional steps required (auto-linking handles it)
+
+## Troubleshooting
+
+### "Pod SessionRecorderNative files are missing"
+
+This error occurs when the iOS native files aren't properly included in the package or auto-linking fails.
+
+**Solutions**:
+
+1. **Check package installation**:
+
+   ```bash
+   ls node_modules/@multiplayer-app/session-recorder-react-native/ios/
+   ```
+
+   Should show: `SessionRecorderNative.m`, `SessionRecorderNative.podspec`, `SessionRecorderNative.swift`
+
+2. **Clear and reinstall**:
+
+   ```bash
+   rm -rf node_modules
+   npm install
+   cd ios && pod install --repo-update && cd ..
+   ```
+
+3. **For Expo projects, ensure plugin is configured**:
+   ```json
+   {
+     "expo": {
+       "plugins": ["@multiplayer-app/session-recorder-react-native"]
+     }
+   }
+   ```
+
+### Auto-linking Issues
+
+If auto-linking doesn't work:
+
+1. **Check react-native.config.js** (should be automatically created):
+
+   ```javascript
+   module.exports = {
+     dependencies: {
+       '@multiplayer-app/session-recorder-react-native': {
+         platforms: {
+           android: {
+             sourceDir: '../android',
+             packageImportPath: 'import com.multiplayer.sessionrecorder.SessionRecorderPackage;'
+           },
+           ios: {
+             podspecPath: '../ios/SessionRecorderNative.podspec'
+           }
+         }
+       }
+     }
+   }
+   ```
+
+2. **Manual linking** (if auto-linking fails):
+   - iOS: Add to Podfile manually
+   - Android: Add to MainApplication.java manually
+
+## File Structure
+
+The package includes these native files:
+
+```
+ios/
+├── SessionRecorderNative.m          # Objective-C bridge
+├── SessionRecorderNative.podspec    # CocoaPods specification
+└── SessionRecorderNative.swift      # Swift implementation
+
+android/
+├── build.gradle                     # Android build configuration
+└── src/main/java/com/multiplayer/sessionrecorder/
+    ├── SessionRecorderModule.kt      # Main Android module
+    ├── SessionRecorderPackage.kt    # Package registration
+    ├── ScreenMaskingModule.kt        # Screen masking module
+    └── ScreenMaskingPackage.kt      # Screen masking package
+```
+
+## Verification
+
+To verify the setup is working:
+
+1. **Check iOS**:
+
+   ```bash
+   cd ios && pod list | grep SessionRecorderNative
+   ```
+
+2. **Check Android**: Look for the package in `android/app/src/main/java/`
+
+3. **Test in code**:
+
+   ```javascript
+   import { SessionRecorderNative } from '@multiplayer-app/session-recorder-react-native'
+
+   // This should not throw an error
+   console.log('Native module loaded:', SessionRecorderNative)
+   ```

package/ios/SessionRecorderNative.m

@@ -0,0 +1,17 @@
+#import <React/RCTBridgeModule.h>
+
+@interface RCT_EXTERN_MODULE(SessionRecorderNative, NSObject)
+
+RCT_EXTERN_METHOD(captureAndMask:(RCTPromiseResolveBlock)resolve
+                  reject:(RCTPromiseRejectBlock)reject)
+
+RCT_EXTERN_METHOD(captureAndMaskWithOptions:(NSDictionary *)options
+                  resolve:(RCTPromiseResolveBlock)resolve
+                  reject:(RCTPromiseRejectBlock)reject)
+
++ (BOOL)requiresMainQueueSetup
+{
+  return YES;
+}
+
+@end

package/ios/SessionRecorderNative.podspec

@@ -0,0 +1,26 @@
+require "json"
+
+package = JSON.parse(File.read(File.join(__dir__, "..", "package.json")))
+
+Pod::Spec.new do |s|
+  s.name         = "SessionRecorderNative"
+  s.version      = package["version"]
+  s.summary      = "Native session recorder module for React Native"
+  s.description  = "A native module that provides session recording with automatic masking of sensitive UI elements"
+  s.homepage     = "https://github.com/multiplayer-app/multiplayer-session-recorder-javascript"
+  s.license      = "MIT"
+  s.authors      = { "Multiplayer Software, Inc." => "https://www.multiplayer.app" }
+  s.platforms    = { :ios => "12.0" }
+  s.source       = { :git => "https://github.com/multiplayer-app/multiplayer-session-recorder-javascript.git", :tag => "#{s.version}" }
+
+  s.source_files = "ios/**/*.{h,m,mm,swift}"
+  s.requires_arc = true
+
+  s.dependency "React-Core"
+  s.dependency "React"
+
+  # Ensure proper linking for Expo
+  s.pod_target_xcconfig = {
+    "HEADER_SEARCH_PATHS" => "\"$(PODS_ROOT)/React-Core/React\""
+  }
+end

package/ios/SessionRecorderNative.swift

@@ -0,0 +1,205 @@
+import UIKit
+import React
+
+@objc(SessionRecorderNative)
+class SessionRecorderNative: NSObject {
+
+  @objc func captureAndMask(_ resolve: @escaping RCTPromiseResolveBlock, reject: @escaping RCTPromiseRejectBlock) {
+    DispatchQueue.main.async {
+      guard let window = UIApplication.shared.windows.first(where: { $0.isKeyWindow }) else {
+        reject("NO_WINDOW", "Unable to get key window", nil)
+        return
+      }
+
+      UIGraphicsBeginImageContextWithOptions(window.bounds.size, false, UIScreen.main.scale)
+      window.drawHierarchy(in: window.bounds, afterScreenUpdates: true)
+      let screenshot = UIGraphicsGetImageFromCurrentImageContext()
+      UIGraphicsEndImageContext()
+
+      guard let image = screenshot else {
+        reject("CAPTURE_FAILED", "Failed to capture screen", nil)
+        return
+      }
+
+      // Apply masking to sensitive elements
+      let maskedImage = self.applyMasking(to: image, in: window)
+
+      if let data = maskedImage.jpegData(compressionQuality: 0.5) {
+        let base64 = data.base64EncodedString()
+        resolve(base64)
+      } else {
+        reject("ENCODING_FAILED", "Failed to encode image", nil)
+      }
+    }
+  }
+
+  @objc func captureAndMaskWithOptions(_ options: NSDictionary, resolve: @escaping RCTPromiseResolveBlock, reject: @escaping RCTPromiseRejectBlock) {
+    DispatchQueue.main.async {
+      guard let window = UIApplication.shared.windows.first(where: { $0.isKeyWindow }) else {
+        reject("NO_WINDOW", "Unable to get key window", nil)
+        return
+      }
+
+      UIGraphicsBeginImageContextWithOptions(window.bounds.size, false, UIScreen.main.scale)
+      window.drawHierarchy(in: window.bounds, afterScreenUpdates: true)
+      let screenshot = UIGraphicsGetImageFromCurrentImageContext()
+      UIGraphicsEndImageContext()
+
+      guard let image = screenshot else {
+        reject("CAPTURE_FAILED", "Failed to capture screen", nil)
+        return
+      }
+
+      // Apply masking with custom options
+      let maskedImage = self.applyMaskingWithOptions(to: image, in: window, options: options)
+
+      if let data = maskedImage.jpegData(compressionQuality: 0.5) {
+        let base64 = data.base64EncodedString()
+        resolve(base64)
+      } else {
+        reject("ENCODING_FAILED", "Failed to encode image", nil)
+      }
+    }
+  }
+
+  private func applyMasking(to image: UIImage, in window: UIWindow) -> UIImage {
+    return applyMaskingWithOptions(to: image, in: window, options: [:])
+  }
+
+  private func applyMaskingWithOptions(to image: UIImage, in window: UIWindow, options: NSDictionary) -> UIImage {
+    UIGraphicsBeginImageContextWithOptions(image.size, false, image.scale)
+    guard let context = UIGraphicsGetCurrentContext() else { return image }
+
+    // Draw the original image
+    image.draw(in: CGRect(origin: .zero, size: image.size))
+
+    // Find and mask sensitive elements
+    let sensitiveElements = findSensitiveElements(in: window)
+
+    for element in sensitiveElements {
+      let frame = element.frame
+      let maskingType = getMaskingType(for: element)
+
+      switch maskingType {
+      case .blur:
+        applyBlurMask(in: context, frame: frame)
+      case .rectangle:
+        applyRectangleMask(in: context, frame: frame)
+      case .pixelate:
+        applyPixelateMask(in: context, frame: frame, image: image)
+      case .none:
+        break
+      }
+    }
+
+    let maskedImage = UIGraphicsGetImageFromCurrentImageContext() ?? image
+    UIGraphicsEndImageContext()
+
+    return maskedImage
+  }
+
+  private func findSensitiveElements(in view: UIView) -> [UIView] {
+    var sensitiveElements: [UIView] = []
+
+    func traverseView(_ view: UIView) {
+      // Check if this view should be masked
+      if shouldMaskView(view) {
+        sensitiveElements.append(view)
+      }
+
+      // Recursively check subviews
+      for subview in view.subviews {
+        traverseView(subview)
+      }
+    }
+
+    traverseView(view)
+    return sensitiveElements
+  }
+
+  private func shouldMaskView(_ view: UIView) -> Bool {
+    // Check for UITextField - mask all text fields when inputMasking is enabled
+    if view is UITextField {
+      return true
+    }
+
+    // Check for UITextView - mask all text views when inputMasking is enabled
+    if view is UITextView {
+      return true
+    }
+
+    return false
+  }
+
+  private func getMaskingType(for view: UIView) -> MaskingType {
+    // Default masking type for all text inputs
+    return .rectangle
+  }
+
+  private func applyBlurMask(in context: CGContext, frame: CGRect) {
+    // Create a blur effect
+    context.setFillColor(UIColor.black.withAlphaComponent(0.8).cgColor)
+    context.fill(frame)
+
+    // Add some noise to make it look blurred
+    context.setFillColor(UIColor.white.withAlphaComponent(0.3).cgColor)
+    for _ in 0..<20 {
+      let randomX = frame.origin.x + CGFloat.random(in: 0...frame.width)
+      let randomY = frame.origin.y + CGFloat.random(in: 0...frame.height)
+      let randomSize = CGFloat.random(in: 2...8)
+      context.fillEllipse(in: CGRect(x: randomX, y: randomY, width: randomSize, height: randomSize))
+    }
+  }
+
+  private func applyRectangleMask(in context: CGContext, frame: CGRect) {
+    // Simple rectangle fill
+    context.setFillColor(UIColor.gray.cgColor)
+    context.fill(frame)
+
+    // Add some text-like pattern
+    context.setFillColor(UIColor.darkGray.cgColor)
+    let lineHeight: CGFloat = 4
+    let spacing: CGFloat = 8
+
+    for i in stride(from: frame.origin.y + spacing, to: frame.origin.y + frame.height - spacing, by: lineHeight + spacing) {
+      let lineWidth = CGFloat.random(in: frame.width * 0.3...frame.width * 0.8)
+      let lineX = frame.origin.x + CGFloat.random(in: 0...(frame.width - lineWidth))
+      context.fill(CGRect(x: lineX, y: i, width: lineWidth, height: lineHeight))
+    }
+  }
+
+  private func applyPixelateMask(in context: CGContext, frame: CGRect, image: UIImage) {
+    // Create a pixelated effect
+    let pixelSize: CGFloat = 8
+    let pixelCountX = Int(frame.width / pixelSize)
+    let pixelCountY = Int(frame.height / pixelSize)
+
+    for x in 0..<pixelCountX {
+      for y in 0..<pixelCountY {
+        let pixelFrame = CGRect(
+          x: frame.origin.x + CGFloat(x) * pixelSize,
+          y: frame.origin.y + CGFloat(y) * pixelSize,
+          width: pixelSize,
+          height: pixelSize
+        )
+
+        // Use a random color for each pixel
+        let randomColor = UIColor(
+          red: CGFloat.random(in: 0...1),
+          green: CGFloat.random(in: 0...1),
+          blue: CGFloat.random(in: 0...1),
+          alpha: 1.0
+        )
+        context.setFillColor(randomColor.cgColor)
+        context.fill(pixelFrame)
+      }
+    }
+  }
+}
+
+private enum MaskingType {
+  case blur
+  case rectangle
+  case pixelate
+  case none
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@multiplayer-app/session-recorder-react-native",
-  "version": "0.0.1-beta.1",
+  "version": "0.0.1-beta.10",
   "description": "Multiplayer Fullstack Session Recorder for React Native",
   "author": {
     "name": "Multiplayer Software, Inc.",
@@ -21,10 +21,7 @@
       "import": "./dist/index.js",
       "require": "./dist/index.js"
     },
-    "./expo": {
-      "import": "./dist/expo.js",
-      "require": "./dist/expo.js"
-    }
+    "./app.plugin.js": "./app.plugin.js"
   },
   "engines": {
     "node": ">=18",
@@ -86,11 +83,29 @@
   },
   "peerDependencies": {
     "@opentelemetry/api": "^1.9.0",
-    "expo": ">=49.0.0 <54.0.0",
     "react": ">=18.0.0 <20.0.0",
-    "react-native": ">=0.72.0 <0.82.0"
+    "react-native": ">=0.72.0 <0.82.0",
+    "react-native-svg": "^15.13.0"
   },
   "optionalDependencies": {
     "expo-constants": "^15.0.0"
+  },
+  "react-native": {
+    "ios": {
+      "podspecPath": "./SessionRecorderNative.podspec"
+    },
+    "android": {
+      "sourceDir": "./android",
+      "packageImportPath": "import com.multiplayer.sessionrecorder.SessionRecorderPackage;"
+    }
+  },
+  "expo": {
+    "ios": {
+      "podspecPath": "./SessionRecorderNative.podspec"
+    },
+    "android": {
+      "sourceDir": "./android",
+      "packageImportPath": "import com.multiplayer.sessionrecorder.SessionRecorderPackage;"
+    }
   }
 }

package/plugin/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "@multiplayer-app/session-recorder-react-native-plugin",
+  "version": "0.0.1-beta.10",
+  "description": "Expo plugin for Session Recorder React Native",
+  "main": "src/index.js",
+  "keywords": [
+    "expo",
+    "plugin",
+    "session-recorder",
+    "react-native"
+  ],
+  "author": "Multiplayer Software, Inc.",
+  "license": "MIT",
+  "dependencies": {
+    "@expo/config-plugins": "^7.0.0"
+  },
+  "peerDependencies": {
+    "expo": ">=49.0.0"
+  }
+}

package/plugin/src/index.js

@@ -0,0 +1,42 @@
+const { withDangerousMod } = require('@expo/config-plugins')
+const fs = require('fs')
+const path = require('path')
+
+const withSessionRecorder = (config) => {
+  return withDangerousMod(config, [
+    'ios',
+    async (config) => {
+      const projectRoot = config.modRequest.projectRoot
+      const platformRoot = config.modRequest.platformProjectRoot
+
+      // Ensure the Podfile includes our native module
+      const podfilePath = path.join(platformRoot, 'Podfile')
+
+      if (fs.existsSync(podfilePath)) {
+        let podfileContent = fs.readFileSync(podfilePath, 'utf8')
+
+        // Check if our pod is already included
+        if (!podfileContent.includes('SessionRecorderNative')) {
+          // Add our pod to the Podfile
+          const podEntry = `  pod 'SessionRecorderNative', :path => '../node_modules/@multiplayer-app/session-recorder-react-native/ios'\n`
+
+          // Find the target section and add our pod
+          const targetRegex = /(target ['"][^'"]+['"] do)/
+          if (targetRegex.test(podfileContent)) {
+            podfileContent = podfileContent.replace(targetRegex, `$1\n${podEntry}`)
+          } else {
+            // If no target found, add at the end before the end statement
+            podfileContent = podfileContent.replace(/(end\s*$)/, `${podEntry}$1`)
+          }
+
+          fs.writeFileSync(podfilePath, podfileContent)
+          console.log('✅ Added SessionRecorderNative to Podfile')
+        }
+      }
+
+      return config
+    }
+  ])
+}
+
+module.exports = withSessionRecorder

package/react-native.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+  dependencies: {
+    '@multiplayer-app/session-recorder-react-native': {
+      platforms: {
+        android: {
+          sourceDir: './android',
+          packageImportPath: 'import com.multiplayer.sessionrecorder.SessionRecorderPackage;'
+        },
+        ios: {
+          podspecPath: './SessionRecorderNative.podspec'
+        }
+      }
+    }
+  }
+}