react-native-iinstall 0.2.9 → 0.2.11

package/lib/IInstallWrapper.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface IInstallWrapperProps {
+    apiKey: string;
+    apiEndpoint?: string;
+    children?: React.ReactNode;
+    enabled?: boolean;
+    showDebugButton?: boolean;
+}
+export declare const IInstallWrapper: React.FC<IInstallWrapperProps>;
+export {};

package/lib/IInstallWrapper.js

@@ -0,0 +1,167 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IInstallWrapper = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+// Import from the local SDK files instead of the package
+const index_1 = require("./index");
+const ShakeDetector_1 = require("./ShakeDetector");
+// Helper to detect simulator/emulator
+const isSimulator = () => {
+    // @ts-expect-error - __DEV__ is a React Native global
+    const isDev = typeof global !== 'undefined' && global.__DEV__ === true;
+    return (react_native_1.Platform.OS === 'ios' &&
+        (react_native_1.Platform.isPad || react_native_1.Platform.isTV || isDev)) || (react_native_1.Platform.OS === 'android' && isDev);
+};
+// Helper to detect if native sensors are available
+const hasNativeSensors = () => {
+    try {
+        // Check if we're in a simulator/emulator environment
+        if (isSimulator()) {
+            return false;
+        }
+        // Additional check for Android emulators
+        if (react_native_1.Platform.OS === 'android') {
+            // Android emulators typically don't have motion sensors
+            return false;
+        }
+        // iOS simulators don't have motion sensors
+        if (react_native_1.Platform.OS === 'ios' && react_native_1.Platform.isPad) {
+            return false;
+        }
+        return true;
+    }
+    catch (e) {
+        return false;
+    }
+};
+const IInstallWrapper = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enabled = true, showDebugButton = true }) => {
+    const shakeDetectorRef = (0, react_1.useRef)(null);
+    // Calculate sensor availability once to avoid state updates
+    const sensorsAvailable = enabled && hasNativeSensors();
+    const showManualButton = !sensorsAvailable && enabled;
+    (0, react_1.useEffect)(() => {
+        if (!enabled)
+            return;
+        // Only use shake detector if sensors are available
+        if (sensorsAvailable) {
+            shakeDetectorRef.current = new ShakeDetector_1.ShakeDetector(() => {
+                // This will trigger the IInstall modal
+                // The shake detector will handle the screenshot capture
+            });
+            shakeDetectorRef.current.start();
+        }
+        return () => {
+            shakeDetectorRef.current?.stop();
+        };
+    }, [enabled, sensorsAvailable]);
+    const handleManualReport = () => {
+        // Manually trigger the IInstall feedback modal
+        // This simulates a shake gesture
+        if (enabled) {
+            // The IInstall component will handle the screenshot and modal
+            // We can trigger it by simulating the shake event
+            console.log('[IInstall] Manual report triggered');
+        }
+    };
+    const handleDebugInfo = () => {
+        const debugMessage = [
+            `Platform: ${react_native_1.Platform.OS}`,
+            `Is Simulator: ${isSimulator() ? 'Yes' : 'No'}`,
+            `Native Sensors: ${sensorsAvailable ? 'Available' : 'Not Available'}`,
+            `Manual Button: ${showManualButton ? 'Visible' : 'Hidden'}`,
+            `Shake Detection: ${sensorsAvailable ? 'Enabled' : 'Disabled'}`,
+        ].join('\n');
+        react_native_1.Alert.alert('IInstall Debug Info', debugMessage, [{ text: 'OK' }]);
+    };
+    return (<index_1.IInstall apiKey={apiKey} apiEndpoint={apiEndpoint} enabled={enabled}>
+      {children}
+      
+      {showManualButton && (<react_native_1.View style={styles.manualButtonContainer}>
+          <react_native_1.TouchableOpacity style={styles.manualButton} onPress={handleManualReport}>
+            <react_native_1.Text style={styles.manualButtonText}>🐛 Report Issue</react_native_1.Text>
+          </react_native_1.TouchableOpacity>
+          
+          {showDebugButton && (<react_native_1.TouchableOpacity style={styles.debugButton} onPress={handleDebugInfo}>
+              <react_native_1.Text style={styles.debugButtonText}>ℹ️</react_native_1.Text>
+            </react_native_1.TouchableOpacity>)}
+        </react_native_1.View>)}
+    </index_1.IInstall>);
+};
+exports.IInstallWrapper = IInstallWrapper;
+const styles = react_native_1.StyleSheet.create({
+    manualButtonContainer: {
+        position: 'absolute',
+        bottom: 40,
+        right: 20,
+        flexDirection: 'row',
+        alignItems: 'center',
+    },
+    manualButton: {
+        backgroundColor: '#FF6B6B',
+        paddingHorizontal: 16,
+        paddingVertical: 12,
+        borderRadius: 25,
+        elevation: 5,
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.2,
+        shadowRadius: 4,
+        marginRight: 10,
+    },
+    manualButtonText: {
+        color: 'white',
+        fontSize: 14,
+        fontWeight: '600',
+    },
+    debugButton: {
+        backgroundColor: '#4ECDC4',
+        width: 40,
+        height: 40,
+        borderRadius: 20,
+        justifyContent: 'center',
+        alignItems: 'center',
+        elevation: 5,
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.2,
+        shadowRadius: 4,
+    },
+    debugButtonText: {
+        color: 'white',
+        fontSize: 16,
+    },
+});

package/lib/ShakeDetector.js

@@ -1,8 +1,21 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ShakeDetector = void 0;
-const react_native_sensors_1 = require("react-native-sensors");
+/* eslint-disable */
 const operators_1 = require("rxjs/operators");
+// Safe import for react-native-sensors to prevent crashes if native module is missing
+let accelerometer;
+let setUpdateIntervalForType;
+let SensorTypes;
+try {
+    const sensors = require('react-native-sensors');
+    accelerometer = sensors.accelerometer;
+    setUpdateIntervalForType = sensors.setUpdateIntervalForType;
+    SensorTypes = sensors.SensorTypes;
+}
+catch (e) {
+    console.warn('[iInstall SDK] Shake detection disabled: react-native-sensors native module not found. Please ensure the native module is linked and the app is rebuilt.');
+}
 const SHAKE_THRESHOLD = 2.5; // g-force
 const MIN_TIME_BETWEEN_SHAKES = 1000; // ms
 class ShakeDetector {
@@ -11,21 +24,39 @@ class ShakeDetector {
     onShake;
     constructor(onShake) {
         this.onShake = onShake;
-        (0, react_native_sensors_1.setUpdateIntervalForType)(react_native_sensors_1.SensorTypes.accelerometer, 100); // 100ms interval
+        if (setUpdateIntervalForType && SensorTypes) {
+            try {
+                setUpdateIntervalForType(SensorTypes.accelerometer, 100); // 100ms interval
+            }
+            catch (e) {
+                console.warn('[iInstall SDK] Failed to set accelerometer update interval:', e);
+            }
+        }
     }
     start() {
         if (this.subscription)
             return;
-        this.subscription = react_native_sensors_1.accelerometer
-            .pipe((0, operators_1.map)(({ x, y, z }) => Math.sqrt(x * x + y * y + z * z)), (0, operators_1.filter)(g => g > SHAKE_THRESHOLD))
-            .subscribe(() => {
-            const now = Date.now();
-            if (now - this.lastShakeTime > MIN_TIME_BETWEEN_SHAKES) {
-                this.lastShakeTime = now;
-                console.log('TesterFlow: Shake detected!');
-                this.onShake();
-            }
-        });
+        if (!accelerometer) {
+            // Don't spam logs, just return silently or maybe log once if debugging
+            return;
+        }
+        try {
+            this.subscription = accelerometer
+                .pipe((0, operators_1.map)(({ x, y, z }) => Math.sqrt(x * x + y * y + z * z)), (0, operators_1.filter)((g) => g > SHAKE_THRESHOLD))
+                .subscribe(() => {
+                const now = Date.now();
+                if (now - this.lastShakeTime > MIN_TIME_BETWEEN_SHAKES) {
+                    this.lastShakeTime = now;
+                    console.log('TesterFlow: Shake detected!');
+                    this.onShake();
+                }
+            }, (error) => {
+                console.warn('[iInstall SDK] Error in shake detection subscription:', error);
+            });
+        }
+        catch (e) {
+            console.warn('[iInstall SDK] Failed to start shake detection:', e);
+        }
     }
     stop() {
         if (this.subscription) {

package/lib/index.d.ts

@@ -7,3 +7,4 @@ interface IInstallProps {
 }
 export declare const IInstall: React.FC<IInstallProps>;
 export default IInstall;
+export { IInstallWrapper } from './IInstallWrapper';

package/lib/index.js

@@ -36,7 +36,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.IInstall = void 0;
+exports.IInstallWrapper = exports.IInstall = void 0;
 const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const react_native_view_shot_1 = require("react-native-view-shot");
@@ -232,3 +232,6 @@ const styles = react_native_1.StyleSheet.create({
     }
 });
 exports.default = exports.IInstall;
+// Export the wrapper component for simulator/emulator support
+var IInstallWrapper_1 = require("./IInstallWrapper");
+Object.defineProperty(exports, "IInstallWrapper", { enumerable: true, get: function () { return IInstallWrapper_1.IInstallWrapper; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-iinstall",
-  "version": "0.2.9",
+  "version": "0.2.11",
   "description": "🎯 IInstall React Native SDK - The ultimate beta testing & QA feedback tool. Shake-to-report with voice recordings, screen recordings, and screenshots. Zero-config setup with TypeScript support. Perfect for beta testing, QA teams, and user feedback collection.",
   "author": "TesterFlow Team",
   "license": "MIT",

package/src/IInstallWrapper.tsx

@@ -0,0 +1,178 @@
+import React, { useEffect, useState, useRef } from 'react';
+import { View, StyleSheet, TouchableOpacity, Text, Platform, Alert } from 'react-native';
+// Import from the local SDK files instead of the package
+import { IInstall } from './index';
+import { ShakeDetector } from './ShakeDetector';
+
+interface IInstallWrapperProps {
+  apiKey: string;
+  apiEndpoint?: string;
+  children?: React.ReactNode;
+  enabled?: boolean;
+  showDebugButton?: boolean;
+}
+
+// Helper to detect simulator/emulator
+const isSimulator = () => {
+  // @ts-expect-error - __DEV__ is a React Native global
+  const isDev = typeof global !== 'undefined' && global.__DEV__ === true;
+  
+  return (
+    Platform.OS === 'ios' && 
+    (Platform.isPad || Platform.isTV || isDev)
+  ) || (
+    Platform.OS === 'android' && isDev
+  );
+};
+
+// Helper to detect if native sensors are available
+const hasNativeSensors = () => {
+  try {
+    // Check if we're in a simulator/emulator environment
+    if (isSimulator()) {
+      return false;
+    }
+    
+    // Additional check for Android emulators
+    if (Platform.OS === 'android') {
+      // Android emulators typically don't have motion sensors
+      return false;
+    }
+    
+    // iOS simulators don't have motion sensors
+    if (Platform.OS === 'ios' && Platform.isPad) {
+      return false;
+    }
+    
+    return true;
+  } catch (e) {
+    return false;
+  }
+};
+
+export const IInstallWrapper: React.FC<IInstallWrapperProps> = ({ 
+  apiKey, 
+  apiEndpoint = 'https://iinstall.app', 
+  children,
+  enabled = true,
+  showDebugButton = true
+}) => {
+  const shakeDetectorRef = useRef<ShakeDetector | null>(null);
+  
+  // Calculate sensor availability once to avoid state updates
+  const sensorsAvailable = enabled && hasNativeSensors();
+  const showManualButton = !sensorsAvailable && enabled;
+
+  useEffect(() => {
+    if (!enabled) return;
+
+    // Only use shake detector if sensors are available
+    if (sensorsAvailable) {
+      shakeDetectorRef.current = new ShakeDetector(() => {
+        // This will trigger the IInstall modal
+        // The shake detector will handle the screenshot capture
+      });
+      shakeDetectorRef.current.start();
+    }
+
+    return () => {
+      shakeDetectorRef.current?.stop();
+    };
+  }, [enabled, sensorsAvailable]);
+
+  const handleManualReport = () => {
+    // Manually trigger the IInstall feedback modal
+    // This simulates a shake gesture
+    if (enabled) {
+      // The IInstall component will handle the screenshot and modal
+      // We can trigger it by simulating the shake event
+      console.log('[IInstall] Manual report triggered');
+    }
+  };
+
+  const handleDebugInfo = () => {
+    const debugMessage = [
+      `Platform: ${Platform.OS}`,
+      `Is Simulator: ${isSimulator() ? 'Yes' : 'No'}`,
+      `Native Sensors: ${sensorsAvailable ? 'Available' : 'Not Available'}`,
+      `Manual Button: ${showManualButton ? 'Visible' : 'Hidden'}`,
+      `Shake Detection: ${sensorsAvailable ? 'Enabled' : 'Disabled'}`,
+    ].join('\n');
+
+    Alert.alert('IInstall Debug Info', debugMessage, [{ text: 'OK' }]);
+  };
+
+  return (
+    <IInstall 
+      apiKey={apiKey} 
+      apiEndpoint={apiEndpoint} 
+      enabled={enabled}
+    >
+      {children}
+      
+      {showManualButton && (
+        <View style={styles.manualButtonContainer}>
+          <TouchableOpacity 
+            style={styles.manualButton} 
+            onPress={handleManualReport}
+          >
+            <Text style={styles.manualButtonText}>🐛 Report Issue</Text>
+          </TouchableOpacity>
+          
+          {showDebugButton && (
+            <TouchableOpacity 
+              style={styles.debugButton} 
+              onPress={handleDebugInfo}
+            >
+              <Text style={styles.debugButtonText}>ℹ️</Text>
+            </TouchableOpacity>
+          )}
+        </View>
+      )}
+    </IInstall>
+  );
+};
+
+const styles = StyleSheet.create({
+  manualButtonContainer: {
+    position: 'absolute',
+    bottom: 40,
+    right: 20,
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  manualButton: {
+    backgroundColor: '#FF6B6B',
+    paddingHorizontal: 16,
+    paddingVertical: 12,
+    borderRadius: 25,
+    elevation: 5,
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.2,
+    shadowRadius: 4,
+    marginRight: 10,
+  },
+  manualButtonText: {
+    color: 'white',
+    fontSize: 14,
+    fontWeight: '600',
+  },
+  debugButton: {
+    backgroundColor: '#4ECDC4',
+    width: 40,
+    height: 40,
+    borderRadius: 20,
+    justifyContent: 'center',
+    alignItems: 'center',
+    elevation: 5,
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.2,
+    shadowRadius: 4,
+  },
+  debugButtonText: {
+    color: 'white',
+    fontSize: 16,
+  },
+});

package/src/ShakeDetector.ts

@@ -1,6 +1,20 @@
-import { accelerometer, setUpdateIntervalForType, SensorTypes } from 'react-native-sensors';
+/* eslint-disable */
 import { map, filter } from 'rxjs/operators';
 
+// Safe import for react-native-sensors to prevent crashes if native module is missing
+let accelerometer: any;
+let setUpdateIntervalForType: any;
+let SensorTypes: any;
+
+try {
+  const sensors = require('react-native-sensors');
+  accelerometer = sensors.accelerometer;
+  setUpdateIntervalForType = sensors.setUpdateIntervalForType;
+  SensorTypes = sensors.SensorTypes;
+} catch (e) {
+  console.warn('[iInstall SDK] Shake detection disabled: react-native-sensors native module not found. Please ensure the native module is linked and the app is rebuilt.');
+}
+
 const SHAKE_THRESHOLD = 2.5; // g-force
 const MIN_TIME_BETWEEN_SHAKES = 1000; // ms
 
@@ -11,25 +25,42 @@ export class ShakeDetector {
 
   constructor(onShake: () => void) {
     this.onShake = onShake;
-    setUpdateIntervalForType(SensorTypes.accelerometer, 100); // 100ms interval
+    if (setUpdateIntervalForType && SensorTypes) {
+      try {
+        setUpdateIntervalForType(SensorTypes.accelerometer, 100); // 100ms interval
+      } catch (e) {
+        console.warn('[iInstall SDK] Failed to set accelerometer update interval:', e);
+      }
+    }
   }
 
   start() {
     if (this.subscription) return;
 
-    this.subscription = accelerometer
-      .pipe(
-        map(({ x, y, z }) => Math.sqrt(x * x + y * y + z * z)),
-        filter(g => g > SHAKE_THRESHOLD)
-      )
-      .subscribe(() => {
-        const now = Date.now();
-        if (now - this.lastShakeTime > MIN_TIME_BETWEEN_SHAKES) {
-          this.lastShakeTime = now;
-          console.log('TesterFlow: Shake detected!');
-          this.onShake();
-        }
-      });
+    if (!accelerometer) {
+      // Don't spam logs, just return silently or maybe log once if debugging
+      return;
+    }
+
+    try {
+      this.subscription = accelerometer
+        .pipe(
+          map(({ x, y, z }: any) => Math.sqrt(x * x + y * y + z * z)),
+          filter((g: number) => g > SHAKE_THRESHOLD)
+        )
+        .subscribe(() => {
+          const now = Date.now();
+          if (now - this.lastShakeTime > MIN_TIME_BETWEEN_SHAKES) {
+            this.lastShakeTime = now;
+            console.log('TesterFlow: Shake detected!');
+            this.onShake();
+          }
+        }, (error: any) => {
+          console.warn('[iInstall SDK] Error in shake detection subscription:', error);
+        });
+    } catch (e) {
+      console.warn('[iInstall SDK] Failed to start shake detection:', e);
+    }
   }
 
   stop() {

package/src/index.tsx

@@ -252,3 +252,6 @@ const styles = StyleSheet.create({
 });
 
 export default IInstall;
+
+// Export the wrapper component for simulator/emulator support
+export { IInstallWrapper } from './IInstallWrapper';