@multiplayer-app/session-recorder-react-native 1.0.1-beta.1 → 1.0.1-beta.11

package/src/services/api.service.ts

@@ -0,0 +1,216 @@
+import {
+  type IResourceAttributes,
+  type ISessionAttributes,
+  type ApiServiceConfig,
+} from '../types';
+
+export interface StartSessionRequest {
+  name?: string;
+  stoppedAt?: string | number;
+  sessionAttributes?: ISessionAttributes;
+  resourceAttributes?: IResourceAttributes;
+  debugSessionData?: Record<string, any>;
+  tags?: { key?: string; value: string }[];
+}
+
+export interface StopSessionRequest {
+  sessionAttributes?: ISessionAttributes;
+  stoppedAt: string | number;
+}
+
+export class ApiService {
+  private config?: ApiServiceConfig;
+  private baseUrl: string = 'https://api.multiplayer.app';
+
+  constructor() {
+    this.config = {
+      apiKey: '',
+      apiBaseUrl: '',
+      exporterEndpoint: '',
+    };
+  }
+
+  init(config: ApiServiceConfig): void {
+    this.config = {
+      ...this.config,
+      ...config,
+    };
+    if (config.apiBaseUrl) {
+      this.baseUrl = config.apiBaseUrl;
+    }
+  }
+
+  /**
+   * Update the API service configuration
+   * @param config - Partial configuration to update
+   */
+  public updateConfigs(config: Partial<ApiServiceConfig>) {
+    if (this.config) {
+      this.config = { ...this.config, ...config };
+    }
+  }
+
+  /**
+   * Set the API key
+   * @param apiKey - The API key to set
+   */
+  setApiKey(apiKey: string): void {
+    if (this.config) {
+      this.config.apiKey = apiKey;
+    }
+  }
+
+  /**
+   * Make a request to the session debugger API
+   * @param path - API endpoint path (relative to the base URL)
+   * @param method - HTTP method (GET, POST, PATCH, etc.)
+   * @param body - request payload
+   * @param signal - AbortSignal to set request's signal
+   */
+  private async makeRequest(
+    path: string,
+    method: string,
+    body?: any,
+    signal?: AbortSignal
+  ): Promise<any> {
+    const url = `${this.baseUrl}/v0/radar${path}`;
+    const params = {
+      method,
+      body: body ? JSON.stringify(body) : null,
+      headers: {
+        'Content-Type': 'application/json',
+        ...(this.config?.apiKey && { 'X-Api-Key': this.config.apiKey }),
+      },
+    };
+
+    try {
+      const response = await fetch(url, {
+        ...params,
+        signal,
+      });
+
+      if (!response.ok) {
+        throw new Error('Network response was not ok: ' + response.statusText);
+      }
+
+      if (response.status === 204) {
+        return null;
+      }
+
+      return await response.json();
+    } catch (error: any) {
+      if (error?.name === 'AbortError') {
+        throw new Error('Request aborted');
+      }
+      throw new Error('Error making request: ' + error.message);
+    }
+  }
+
+  /**
+   * Start a new debug session
+   * @param request - Session start request data
+   * @param signal - Optional AbortSignal for request cancellation
+   */
+  async startSession(
+    request: StartSessionRequest,
+    signal?: AbortSignal
+  ): Promise<any> {
+    try {
+      const res = await this.makeRequest(
+        '/debug-sessions/start',
+        'POST',
+        request,
+        signal
+      );
+      return res;
+    } catch (error: any) {
+      throw error;
+    }
+  }
+
+  /**
+   * Stop an active debug session
+   * @param sessionId - ID of the session to stop
+   * @param request - Session stop request data
+   */
+  async stopSession(
+    sessionId: string,
+    request: StopSessionRequest
+  ): Promise<any> {
+    return this.makeRequest(
+      `/debug-sessions/${sessionId}/stop`,
+      'PATCH',
+      request
+    );
+  }
+
+  /**
+   * Cancel an active debug session
+   * @param sessionId - ID of the session to cancel
+   */
+  async cancelSession(sessionId: string): Promise<any> {
+    return this.makeRequest(`/debug-sessions/${sessionId}/cancel`, 'DELETE');
+  }
+
+  /**
+   * Start a new continuous debug session
+   * @param request - Session start request data
+   * @param signal - Optional AbortSignal for request cancellation
+   */
+  async startContinuousDebugSession(
+    request: StartSessionRequest,
+    signal?: AbortSignal
+  ): Promise<any> {
+    return this.makeRequest(
+      '/continuous-debug-sessions/start',
+      'POST',
+      request,
+      signal
+    );
+  }
+
+  /**
+   * Save a continuous debug session
+   * @param sessionId - ID of the session to save
+   * @param request - Session save request data
+   * @param signal - Optional AbortSignal for request cancellation
+   */
+  async saveContinuousDebugSession(
+    sessionId: string,
+    request: StartSessionRequest,
+    signal?: AbortSignal
+  ): Promise<any> {
+    return this.makeRequest(
+      `/continuous-debug-sessions/${sessionId}/save`,
+      'POST',
+      request,
+      signal
+    );
+  }
+
+  /**
+   * Stop an active continuous debug session
+   * @param sessionId - ID of the session to stop
+   */
+  async stopContinuousDebugSession(sessionId: string): Promise<any> {
+    return this.makeRequest(
+      `/continuous-debug-sessions/${sessionId}/cancel`,
+      'DELETE'
+    );
+  }
+
+  /**
+   * Check debug session should be started remotely
+   */
+  async checkRemoteSession(
+    requestBody: StartSessionRequest,
+    signal?: AbortSignal
+  ): Promise<{ state: 'START' | 'STOP' }> {
+    return this.makeRequest(
+      '/remote-debug-session/check',
+      'POST',
+      requestBody,
+      signal
+    );
+  }
+}

package/src/services/network.service.ts

@@ -0,0 +1,191 @@
+import { Platform } from 'react-native';
+import { logger } from '../utils';
+import { sessionRecorderStore } from '../context/SessionRecorderStore';
+
+// Safe import for NetInfo with web fallback
+let NetInfo: any = null;
+const isWeb = Platform.OS === 'web';
+
+if (!isWeb) {
+  try {
+    NetInfo = require('@react-native-community/netinfo').default;
+  } catch (error) {
+    console.warn('NetInfo not available:', error);
+  }
+} else {
+  // Web fallback using navigator.onLine
+  NetInfo = {
+    fetch: () =>
+      Promise.resolve({
+        isConnected: true, // Default to connected for web
+        type: 'unknown',
+        isInternetReachable: true,
+      }),
+    addEventListener: (_callback: (state: any) => void) => {
+      // Return a no-op function for web
+      return () => {};
+    },
+  };
+}
+
+export interface NetworkState {
+  isConnected: boolean;
+  type: string | null;
+  isInternetReachable: boolean | null;
+}
+
+export type NetworkStateChangeCallback = (state: NetworkState) => void;
+
+export class NetworkService {
+  private static instance: NetworkService | null = null;
+  private _isOnline = true;
+  private unsubscribe: (() => void) | null = null;
+  private callbacks: NetworkStateChangeCallback[] = [];
+
+  private constructor() {
+    // Private constructor for singleton
+  }
+
+  static getInstance(): NetworkService {
+    if (!NetworkService.instance) {
+      NetworkService.instance = new NetworkService();
+    }
+    return NetworkService.instance;
+  }
+
+  /**
+   * Initialize network monitoring
+   */
+  async init(): Promise<void> {
+    try {
+      // Get initial network state
+      const initialState = await NetInfo.fetch();
+      this._isOnline = initialState.isConnected ?? true;
+
+      // Update store with initial state
+      sessionRecorderStore.setState({ isOnline: this._isOnline });
+
+      // Notify callbacks
+      this.notifyCallbacks({
+        isConnected: this._isOnline,
+        type: initialState.type,
+        isInternetReachable: initialState.isInternetReachable,
+      });
+
+      // Listen for network state changes
+      this.unsubscribe = NetInfo.addEventListener((state: any) => {
+        const wasOnline = this._isOnline;
+        this._isOnline = state.isConnected ?? true;
+
+        // Update store
+        sessionRecorderStore.setState({ isOnline: this._isOnline });
+
+        // Notify callbacks
+        this.notifyCallbacks({
+          isConnected: this._isOnline,
+          type: state.type,
+          isInternetReachable: state.isInternetReachable,
+        });
+
+        // Log state changes
+        if (wasOnline && !this._isOnline) {
+          logger.info('NetworkService', 'Network went offline');
+        } else if (!wasOnline && this._isOnline) {
+          logger.info('NetworkService', 'Network came back online');
+        }
+      });
+
+      logger.info('NetworkService', 'Network monitoring initialized');
+    } catch (error) {
+      logger.error(
+        'NetworkService',
+        'Failed to initialize network monitoring',
+        error
+      );
+    }
+  }
+
+  /**
+   * Get current network state
+   */
+  getCurrentState(): NetworkState {
+    return {
+      isConnected: this._isOnline,
+      type: null, // We don't store this in the service
+      isInternetReachable: null, // We don't store this in the service
+    };
+  }
+
+  /**
+   * Check if device is online
+   */
+  isOnline(): boolean {
+    return this._isOnline;
+  }
+
+  /**
+   * Add callback for network state changes
+   */
+  addCallback(callback: NetworkStateChangeCallback): void {
+    this.callbacks.push(callback);
+  }
+
+  /**
+   * Remove callback for network state changes
+   */
+  removeCallback(callback: NetworkStateChangeCallback): void {
+    this.callbacks = this.callbacks.filter((cb) => cb !== callback);
+  }
+
+  /**
+   * Notify all callbacks of network state change
+   */
+  private notifyCallbacks(state: NetworkState): void {
+    this.callbacks.forEach((callback) => {
+      try {
+        callback(state);
+      } catch (error) {
+        logger.error(
+          'NetworkService',
+          'Error in network state callback',
+          error
+        );
+      }
+    });
+  }
+
+  /**
+   * Cleanup network monitoring
+   */
+  cleanup(): void {
+    if (this.unsubscribe) {
+      this.unsubscribe();
+      this.unsubscribe = null;
+    }
+    this.callbacks = [];
+    logger.info('NetworkService', 'Network monitoring cleaned up');
+  }
+
+  /**
+   * Force refresh network state
+   */
+  async refresh(): Promise<NetworkState> {
+    try {
+      const state = await NetInfo.fetch();
+      this._isOnline = state.isConnected ?? true;
+      sessionRecorderStore.setState({ isOnline: this._isOnline });
+
+      const networkState: NetworkState = {
+        isConnected: this._isOnline,
+        type: state.type,
+        isInternetReachable: state.isInternetReachable,
+      };
+
+      this.notifyCallbacks(networkState);
+      return networkState;
+    } catch (error) {
+      logger.error('NetworkService', 'Failed to refresh network state', error);
+      throw error;
+    }
+  }
+}

package/src/services/screenMaskingService.ts

@@ -0,0 +1,153 @@
+import SessionRecorderNative, {
+  type MaskingOptions,
+} from '../SessionRecorderNativeSpec';
+import { logger } from '../utils';
+
+export interface ScreenMaskingConfig {
+  /** Whether screen masking is enabled */
+  enabled: boolean;
+  /** Whether to mask text inputs (UITextField, UITextView, React Native text components) */
+  maskTextInputs?: boolean;
+  /** Whether to mask images (UIImageView, React Native Image components) */
+  maskImages?: boolean;
+  /** Whether to mask buttons (UIButton) */
+  maskButtons?: boolean;
+  /** Whether to mask labels (UILabel) */
+  maskLabels?: boolean;
+  /** Whether to mask web views (WKWebView) */
+  maskWebViews?: boolean;
+  /** Whether to mask sandboxed views (system views that don't belong to current process) */
+  maskSandboxedViews?: boolean;
+}
+
+export class ScreenMaskingService {
+  private config: ScreenMaskingConfig;
+  private isAvailable: boolean = false;
+
+  constructor(
+    config: ScreenMaskingConfig = {
+      enabled: true,
+      maskTextInputs: true,
+      maskImages: false,
+      maskButtons: false,
+      maskLabels: false,
+      maskWebViews: false,
+      maskSandboxedViews: false,
+    }
+  ) {
+    this.config = config;
+    this.checkAvailability();
+  }
+
+  /**
+   * Check if the native masking module is available
+   */
+  private checkAvailability(): void {
+    try {
+      // Try to access the native module to check if it's available
+      if (
+        SessionRecorderNative &&
+        typeof SessionRecorderNative.captureAndMask === 'function'
+      ) {
+        this.isAvailable = true;
+        logger.info(
+          'ScreenMaskingService',
+          'Screen masking native module is available'
+        );
+      } else {
+        this.isAvailable = false;
+        logger.warn(
+          'ScreenMaskingService',
+          'Screen masking native module is not available - auto-linking may still be in progress'
+        );
+      }
+    } catch (error) {
+      this.isAvailable = false;
+      logger.error(
+        'ScreenMaskingService',
+        'Error checking screen masking availability:',
+        error
+      );
+    }
+  }
+
+  /**
+   * Capture screen with masking applied
+   */
+  async captureMaskedScreen(options: MaskingOptions): Promise<string | null> {
+    if (!this.isAvailable || !this.config.enabled) {
+      logger.warn(
+        'ScreenMaskingService',
+        'Screen masking is not available or disabled'
+      );
+      return null;
+    }
+
+    try {
+      const maskingOptions: MaskingOptions = {
+        ...this.config,
+        ...options,
+      };
+      const maskedImageBase64 =
+        await SessionRecorderNative.captureAndMaskWithOptions(maskingOptions);
+      return maskedImageBase64;
+    } catch (error) {
+      logger.error(
+        'ScreenMaskingService',
+        'Failed to capture masked screen:',
+        error
+      );
+      return null;
+    }
+  }
+
+  /**
+   * Capture screen with basic masking (no custom options)
+   */
+  async captureMaskedScreenBasic(): Promise<string | null> {
+    if (!this.isAvailable || !this.config.enabled) {
+      logger.warn(
+        'ScreenMaskingService',
+        'Screen masking is not available or disabled'
+      );
+      return null;
+    }
+
+    try {
+      const maskedImageBase64 = await SessionRecorderNative.captureAndMask();
+      return maskedImageBase64;
+    } catch (error) {
+      logger.error(
+        'ScreenMaskingService',
+        'Failed to capture masked screen (basic):',
+        error
+      );
+      return null;
+    }
+  }
+
+  /**
+   * Update the masking configuration
+   */
+  updateConfig(config: Partial<ScreenMaskingConfig>): void {
+    this.config = { ...this.config, ...config };
+    logger.info('ScreenMaskingService', 'Screen masking configuration updated');
+  }
+
+  /**
+   * Check if screen masking is available
+   */
+  isScreenMaskingAvailable(): boolean {
+    return this.isAvailable && this.config.enabled;
+  }
+
+  /**
+   * Get the current configuration
+   */
+  getConfig(): ScreenMaskingConfig {
+    return { ...this.config };
+  }
+}
+
+// Create a singleton instance
+export const screenMaskingService = new ScreenMaskingService();