@multiplayer-app/session-recorder-react-native 1.0.1-beta.4 → 1.0.1-beta.6

package/src/utils/rrweb-events.ts

@@ -1,6 +1,13 @@
-import { Dimensions } from 'react-native'
-import { EventType, type eventWithTime, NodeType, type serializedNodeWithId, IncrementalSource, type mutationData } from '@rrweb/types'
-import { getAppMetadata } from './platform'
+import { Dimensions } from 'react-native';
+import {
+  EventType,
+  type eventWithTime,
+  NodeType,
+  type serializedNodeWithId,
+  IncrementalSource,
+  type mutationData,
+} from '@rrweb/types';
+import { getAppMetadata } from './platform';
 
 /**
  * Creates a meta event to mark the start of recording
@@ -10,18 +17,19 @@ import { getAppMetadata } from './platform'
  * @returns MetaEvent object
  */
 export function createRecordingMetaEvent(): eventWithTime {
-  const screenDimensions = Dimensions.get('window')
-  const metadata = getAppMetadata()
+  const screenDimensions = Dimensions.get('window');
+  const metadata = getAppMetadata();
 
   return {
     type: EventType.Meta,
     data: {
-      href: metadata.bundleId || metadata.name || 'https://native.multiplayer.app',
+      href:
+        metadata.bundleId || metadata.name || 'https://native.multiplayer.app',
       width: screenDimensions.width,
       height: screenDimensions.height,
     },
     timestamp: Date.now(),
-  }
+  };
 }
 
 /**
@@ -40,7 +48,7 @@ export function createFullSnapshotEvent(
   height: number,
   captureFormat: string = 'jpg',
   nodeIdCounter: { current: number },
-  timestamp?: number,
+  timestamp?: number
 ): eventWithTime {
   // Create a virtual DOM node representing the screen as an image
   const imageNode: serializedNodeWithId = {
@@ -54,7 +62,7 @@ export function createFullSnapshotEvent(
       style: `width: ${width}px; height: ${height}px;`,
     },
     childNodes: [],
-  }
+  };
 
   // Create the root container
   const rootNode: serializedNodeWithId = {
@@ -65,7 +73,7 @@ export function createFullSnapshotEvent(
       style: `width: ${width}px; height: ${height}px; position: relative;`,
     },
     childNodes: [imageNode],
-  }
+  };
 
   const domNode: serializedNodeWithId = {
     type: NodeType.Document,
@@ -99,7 +107,8 @@ export function createFullSnapshotEvent(
                 tagName: 'meta',
                 attributes: {
                   name: 'viewport',
-                  content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no',
+                  content:
+                    'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no',
                 },
                 childNodes: [],
                 id: nodeIdCounter.current++,
@@ -121,7 +130,7 @@ export function createFullSnapshotEvent(
       },
     ],
     id: nodeIdCounter.current++,
-  }
+  };
 
   return {
     type: EventType.FullSnapshot,
@@ -130,7 +139,7 @@ export function createFullSnapshotEvent(
       initialOffset: { left: 0, top: 0 },
     },
     timestamp: timestamp || Date.now(),
-  }
+  };
 }
 
 /**
@@ -143,7 +152,7 @@ export function createFullSnapshotEvent(
 export function createIncrementalSnapshotWithImageUpdate(
   base64Image: string,
   captureFormat: string = 'jpg',
-  timestamp?: number,
+  timestamp?: number
 ): eventWithTime {
   const mutationData: mutationData = {
     source: IncrementalSource.Mutation,
@@ -158,13 +167,13 @@ export function createIncrementalSnapshotWithImageUpdate(
     ],
     removes: [],
     adds: [],
-  }
+  };
 
   return {
     type: EventType.IncrementalSnapshot,
     data: mutationData,
     timestamp: timestamp || Date.now(),
-  }
+  };
 }
 
 /**
@@ -181,7 +190,7 @@ export function createImageNode(
   width: number,
   height: number,
   captureFormat: string = 'jpg',
-  nodeId: number,
+  nodeId: number
 ): serializedNodeWithId {
   return {
     type: NodeType.Element,
@@ -194,7 +203,7 @@ export function createImageNode(
       style: `width: ${width}px; height: ${height}px;`,
     },
     childNodes: [],
-  }
+  };
 }
 
 /**
@@ -209,7 +218,7 @@ export function createDocumentNode(
   imageNode: serializedNodeWithId,
   width: number,
   height: number,
-  nodeIdCounter: { current: number },
+  nodeIdCounter: { current: number }
 ): serializedNodeWithId {
   // Create the root container
   const rootNode: serializedNodeWithId = {
@@ -220,7 +229,7 @@ export function createDocumentNode(
       style: `width: ${width}px; height: ${height}px; position: relative;`,
     },
     childNodes: [imageNode],
-  }
+  };
 
   return {
     type: NodeType.Document,
@@ -254,7 +263,8 @@ export function createDocumentNode(
                 tagName: 'meta',
                 attributes: {
                   name: 'viewport',
-                  content: 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no',
+                  content:
+                    'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no',
                 },
                 childNodes: [],
                 id: nodeIdCounter.current++,
@@ -274,7 +284,7 @@ export function createDocumentNode(
       },
     ],
     id: nodeIdCounter.current++,
-  }
+  };
 }
 
 /**
@@ -285,19 +295,22 @@ export function createDocumentNode(
  * @param sampleSize - Number of characters to sample from each part
  * @returns Hash string for comparison
  */
-export function generateScreenHash(base64Image: string, sampleSize: number = 100): string {
+export function generateScreenHash(
+  base64Image: string,
+  sampleSize: number = 100
+): string {
   // Use a simple hash that samples the beginning, middle, and end of the base64 string
   // This is much faster than comparing the entire string
-  const start = base64Image.substring(0, sampleSize)
+  const start = base64Image.substring(0, sampleSize);
   const middle = base64Image.substring(
     Math.floor(base64Image.length / 2) - sampleSize / 2,
-    Math.floor(base64Image.length / 2) + sampleSize / 2,
-  )
-  const end = base64Image.substring(base64Image.length - sampleSize)
+    Math.floor(base64Image.length / 2) + sampleSize / 2
+  );
+  const end = base64Image.substring(base64Image.length - sampleSize);
 
   // Combine samples and create a simple hash
-  const combined = start + middle + end
-  return simpleHash(combined)
+  const combined = start + middle + end;
+  return simpleHash(combined);
 }
 
 /**
@@ -306,11 +319,11 @@ export function generateScreenHash(base64Image: string, sampleSize: number = 100
  * @returns Hash value as string
  */
 export function simpleHash(str: string): string {
-  let hash = 0
+  let hash = 0;
   for (let i = 0; i < str.length; i++) {
-    const char = str.charCodeAt(i)
-    hash = (hash << 5) - hash + char
-    hash = hash & hash // Convert to 32-bit integer
+    const char = str.charCodeAt(i);
+    hash = (hash << 5) - hash + char;
+    hash = hash & hash; // Convert to 32-bit integer
   }
-  return Math.abs(hash).toString(36)
+  return Math.abs(hash).toString(36);
 }

package/src/utils/session.ts

@@ -1,19 +1,22 @@
-import { SessionType } from '@multiplayer-app/session-recorder-common'
-import { DEBUG_SESSION_MAX_DURATION_SECONDS } from '../config/constants'
+import { SessionType } from '@multiplayer-app/session-recorder-common';
+import { DEBUG_SESSION_MAX_DURATION_SECONDS } from '../config/constants';
 
 /**
  * Session-related utility functions for React Native
  */
 
-export const isSessionActive = (session: any, sessionType: SessionType | null): boolean => {
-  if (!session) return false
-  if (sessionType === SessionType.CONTINUOUS) return true
-  const startedAt = new Date(session.startedAt || session.createdAt)
-  const now = new Date()
-  const diff = now.getTime() - startedAt.getTime()
-  return diff < DEBUG_SESSION_MAX_DURATION_SECONDS * 1000
-}
+export const isSessionActive = (
+  session: any,
+  sessionType: SessionType | null
+): boolean => {
+  if (!session) return false;
+  if (sessionType === SessionType.CONTINUOUS) return true;
+  const startedAt = new Date(session.startedAt || session.createdAt);
+  const now = new Date();
+  const diff = now.getTime() - startedAt.getTime();
+  return diff < DEBUG_SESSION_MAX_DURATION_SECONDS * 1000;
+};
 
 export const isConsoleEvent = (event: any): boolean => {
-  return event.type === 'Plugin' && event.data?.plugin === 'rrweb/console@1'
-}
+  return event.type === 'Plugin' && event.data?.plugin === 'rrweb/console@1';
+};

package/src/utils/shallowEqual.ts

@@ -1,14 +1,20 @@
-export function shallowEqual<T extends Record<string, any>>(a: T, b: T): boolean {
-  if (Object.is(a, b)) return true
-  if (!a || !b) return false
-  const aKeys = Object.keys(a)
-  const bKeys = Object.keys(b)
-  if (aKeys.length !== bKeys.length) return false
+export function shallowEqual<T extends Record<string, any>>(
+  a: T,
+  b: T
+): boolean {
+  if (Object.is(a, b)) return true;
+  if (!a || !b) return false;
+  const aKeys = Object.keys(a);
+  const bKeys = Object.keys(b);
+  if (aKeys.length !== bKeys.length) return false;
   for (let i = 0; i < aKeys.length; i++) {
-    const key = aKeys[i]
-    if (!Object.prototype.hasOwnProperty.call(b, key!) || !Object.is(a[key!], b[key!])) {
-      return false
+    const key = aKeys[i];
+    if (
+      !Object.prototype.hasOwnProperty.call(b, key!) ||
+      !Object.is(a[key!], b[key!])
+    ) {
+      return false;
     }
   }
-  return true
+  return true;
 }

package/src/utils/time.ts

@@ -2,7 +2,10 @@
  * Time and date utility functions for React Native
  */
 
-export const getFormattedDate = (date: number | Date, options?: any): string => {
+export const getFormattedDate = (
+  date: number | Date,
+  options?: any
+): string => {
   return new Date(date).toLocaleDateString(
     'en-US',
     options || {
@@ -12,6 +15,6 @@ export const getFormattedDate = (date: number | Date, options?: any): string =>
       hour: 'numeric',
       minute: '2-digit',
       second: '2-digit',
-    },
-  )
-}
+    }
+  );
+};

package/src/utils/type-utils.ts

@@ -1,75 +1,75 @@
-const nativeIsArray = Array.isArray
-const ObjProto = Object.prototype
-export const hasOwnProperty = ObjProto.hasOwnProperty
-const toString = ObjProto.toString
+const nativeIsArray = Array.isArray;
+const ObjProto = Object.prototype;
+export const hasOwnProperty = ObjProto.hasOwnProperty;
+const toString = ObjProto.toString;
 
 export const isArray =
   nativeIsArray ||
   function (obj: any): obj is any[] {
-    return toString.call(obj) === '[object Array]'
-  }
+    return toString.call(obj) === '[object Array]';
+  };
 export const isUint8Array = function (x: unknown): x is Uint8Array {
-  return toString.call(x) === '[object Uint8Array]'
-}
+  return toString.call(x) === '[object Uint8Array]';
+};
 // from a comment on http://dbj.org/dbj/?p=286
 // fails on only one very rare and deliberate custom object:
 // let bomb = { toString : undefined, valueOf: function(o) { return "function BOMBA!"; }};
 export const isFunction = function (f: any): f is (...args: any[]) => any {
-  return typeof f === 'function'
-}
+  return typeof f === 'function';
+};
 // Underscore Addons
 export const isObject = function (x: unknown): x is Record<string, any> {
-  return x === Object(x) && !isArray(x)
-}
+  return x === Object(x) && !isArray(x);
+};
 export const isEmptyObject = function (x: unknown): x is Record<string, any> {
   if (isObject(x)) {
     for (const key in x) {
       if (hasOwnProperty.call(x, key)) {
-        return false
+        return false;
       }
     }
-    return true
+    return true;
   }
-  return false
-}
+  return false;
+};
 export const isUndefined = function (x: unknown): x is undefined {
-  return x === void 0
-}
+  return x === void 0;
+};
 
 export const isString = function (x: unknown): x is string {
-  return toString.call(x) == '[object String]'
-}
+  return toString.call(x) == '[object String]';
+};
 
 export const isEmptyString = function (x: unknown): boolean {
-  return isString(x) && x.trim().length === 0
-}
+  return isString(x) && x.trim().length === 0;
+};
 
 export const isNull = function (x: unknown): x is null {
-  return x === null
-}
+  return x === null;
+};
 
 /*
     sometimes you want to check if something is null or undefined
     that's what this is for
  */
 export const isNullish = function (x: unknown): x is null | undefined {
-  return isUndefined(x) || isNull(x)
-}
+  return isUndefined(x) || isNull(x);
+};
 
 export const isDate = function (x: unknown): x is Date {
-  return toString.call(x) == '[object Date]'
-}
+  return toString.call(x) == '[object Date]';
+};
 export const isNumber = function (x: unknown): x is number {
-  return toString.call(x) == '[object Number]'
-}
+  return toString.call(x) == '[object Number]';
+};
 export const isBoolean = function (x: unknown): x is boolean {
-  return toString.call(x) === '[object Boolean]'
-}
+  return toString.call(x) === '[object Boolean]';
+};
 
 export const isFormData = (x: unknown): x is FormData => {
-  return x instanceof FormData
-}
+  return x instanceof FormData;
+};
 
 export const isFile = (x: unknown): x is File => {
-  return x instanceof File
-}
+  return x instanceof File;
+};

package/src/version.ts

@@ -1 +1 @@
-export const version = "1.0.1-beta.3"
+export const version = '1.0.1-beta.3';

package/android/src/main/java/com/multiplayer/sessionrecordernative/SessionRecorderNativeModuleSpec.kt

@@ -1,51 +0,0 @@
-package com.multiplayer.sessionrecordernative
-
-import com.facebook.react.bridge.ReactApplicationContext
-import com.facebook.react.bridge.ReactMethod
-import com.facebook.react.bridge.Promise
-import com.facebook.react.bridge.Callback
-import com.facebook.react.bridge.ReadableMap
-import com.facebook.react.bridge.Arguments
-import com.facebook.react.bridge.WritableMap
-import com.facebook.react.modules.core.DeviceEventManagerModule
-import com.facebook.react.bridge.TurboModule
-
-abstract class SessionRecorderNativeModuleSpec : TurboModule {
-
-  @ReactMethod
-  abstract fun captureAndMask(promise: Promise)
-
-  @ReactMethod
-  abstract fun captureAndMaskWithOptions(options: ReadableMap, promise: Promise)
-
-  @ReactMethod
-  abstract fun startGestureRecording(promise: Promise)
-
-  @ReactMethod
-  abstract fun stopGestureRecording(promise: Promise)
-
-  @ReactMethod
-  abstract fun isGestureRecordingActive(promise: Promise)
-
-  @ReactMethod
-  abstract fun setGestureCallback(callback: Callback)
-
-  @ReactMethod
-  abstract fun recordGesture(
-    gestureType: String,
-    x: Double,
-    y: Double,
-    target: String?,
-    metadata: ReadableMap?
-  )
-
-  @ReactMethod
-  fun addListener(eventName: String) {
-    // Required for RN event emitter contracts
-  }
-
-  @ReactMethod
-  fun removeListeners(count: Int) {
-    // Required for RN event emitter contracts
-  }
-}

package/android/src/main/java/com/xxx/XxxModule.kt

@@ -1,23 +0,0 @@
-package com.xxx
-
-import com.facebook.react.bridge.ReactApplicationContext
-import com.facebook.react.module.annotations.ReactModule
-
-@ReactModule(name = XxxModule.NAME)
-class XxxModule(reactContext: ReactApplicationContext) :
-  NativeXxxSpec(reactContext) {
-
-  override fun getName(): String {
-    return NAME
-  }
-
-  // Example method
-  // See https://reactnative.dev/docs/native-modules-android
-  override fun multiply(a: Double, b: Double): Double {
-    return a * b
-  }
-
-  companion object {
-    const val NAME = "Xxx"
-  }
-}

package/ios/Xxx.h

@@ -1,5 +0,0 @@
-#import <XxxSpec/XxxSpec.h>
-
-@interface Xxx : NSObject <NativeXxxSpec>
-
-@end

package/ios/Xxx.mm

@@ -1,21 +0,0 @@
-#import "Xxx.h"
-
-@implementation Xxx
-- (NSNumber *)multiply:(double)a b:(double)b {
-    NSNumber *result = @(a * b);
-
-    return result;
-}
-
-- (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:
-    (const facebook::react::ObjCTurboModule::InitParams &)params
-{
-    return std::make_shared<facebook::react::NativeXxxSpecJSI>(params);
-}
-
-+ (NSString *)moduleName
-{
-  return @"Xxx";
-}
-
-@end