react-native-iinstall 0.2.11 → 0.2.13

package/INTEGRATION_GUIDE.md

@@ -48,14 +48,14 @@ yarn add react-native-iinstall
 
 **Note**: The SDK automatically includes necessary dependencies like `react-native-sensors` and `react-native-view-shot`.
 
-### Updating to Latest Version (v0.2.7)
+### Updating to Latest Version (v0.2.13)
 
 If you're using an older version, update to get the latest audio/video improvements:
 
 ```bash
-npm install react-native-iinstall@0.2.7
+npm install react-native-iinstall@0.2.13
 # OR
-yarn add react-native-iinstall@0.2.7
+yarn add react-native-iinstall@0.2.13
 ```
 
 **Key improvements in v0.2.7:**
@@ -98,7 +98,45 @@ export default App;
 
 ---
 
-## 5. Audio & Video Feedback (v0.2.7+)
+## 5. Push Notification Token Registration (v0.2.13+)
+
+If you pass `pushToken`, SDK auto-registers it to the backend using:
+
+`POST /api/notifications/push/register`
+
+```tsx
+import React from 'react';
+import messaging from '@react-native-firebase/messaging';
+import { IInstall } from 'react-native-iinstall';
+
+const App = () => {
+  const [pushToken, setPushToken] = React.useState<string>();
+
+  React.useEffect(() => {
+    messaging().getToken().then(setPushToken).catch(() => undefined);
+  }, []);
+
+  return (
+    <IInstall
+      apiKey="YOUR_COPIED_API_KEY_FROM_STEP_1"
+      apiEndpoint="https://iinstall.app"
+      pushToken={pushToken}
+    >
+      <AppNavigation />
+    </IInstall>
+  );
+};
+```
+
+Manual helpers are also exported:
+
+```tsx
+import { registerPushToken, unregisterPushToken } from 'react-native-iinstall';
+```
+
+---
+
+## 6. Audio & Video Feedback (v0.2.7+)
 
 The SDK now supports **Audio Feedback** (Voice Notes) and **Screen Recording** with enhanced compatibility and reliability.
 
@@ -155,7 +193,7 @@ Add these keys inside the `<dict>` tag:
 
 ---
 
-## 6. Generate & Upload Installer
+## 7. Generate & Upload Installer
 
 1.  **Build your app**:
     *   **Android**: `./gradlew assembleRelease` (outputs `.apk`)

package/README.md

@@ -49,13 +49,24 @@ Wrap your main app component with the `<IInstall>` provider.
 import React from 'react';
 import { IInstall } from 'react-native-iinstall';
 import AppNavigation from './src/AppNavigation';
+import messaging from '@react-native-firebase/messaging';
 
 const App = () => {
+  const [pushToken, setPushToken] = React.useState<string>();
+
+  React.useEffect(() => {
+    messaging()
+      .getToken()
+      .then(setPushToken)
+      .catch(() => undefined);
+  }, []);
+
   return (
     // Get your API Key from the IInstall Dashboard (Project Settings)
     <IInstall 
       apiKey="YOUR_PROJECT_API_KEY" 
       apiEndpoint="https://iinstall.app" // Optional, defaults to production
+      pushToken={pushToken} // Optional: auto-registers token to iinstall backend
       enabled={__DEV__} // Optional: Only enable in dev/test builds
     >
       <AppNavigation />
@@ -131,6 +142,26 @@ Add to `Info.plist`:
 </IInstall>
 ```
 
+### Push Token Registration Helpers
+
+You can also register/unregister tokens manually:
+
+```tsx
+import { registerPushToken, unregisterPushToken } from 'react-native-iinstall';
+
+await registerPushToken({
+  token: fcmToken,
+  apiKey: 'YOUR_PROJECT_API_KEY',
+  apiEndpoint: 'https://iinstall.app',
+});
+
+await unregisterPushToken({
+  token: fcmToken,
+  apiKey: 'YOUR_PROJECT_API_KEY',
+  apiEndpoint: 'https://iinstall.app',
+});
+```
+
 ### Custom Triggers (Coming Soon)
 - Button-based feedback
 - Screenshot-only mode

package/lib/IInstallWrapper.d.ts

@@ -5,6 +5,12 @@ interface IInstallWrapperProps {
     children?: React.ReactNode;
     enabled?: boolean;
     showDebugButton?: boolean;
+    showFloatingButtonOnEmulator?: boolean;
+    floatingButtonLabel?: string;
+    pushToken?: string;
+    autoRegisterPushToken?: boolean;
+    projectId?: string;
+    onPushTokenRegisterError?: (error: string) => void;
 }
 export declare const IInstallWrapper: React.FC<IInstallWrapperProps>;
-export {};
+export default IInstallWrapper;

package/lib/IInstallWrapper.js

@@ -1,167 +1,18 @@
 "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;
-    };
-})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 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 react_1 = __importDefault(require("react"));
 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}>
+// Backward-compatible wrapper. The core IInstall component now handles:
+// - shake gesture on real devices
+// - floating manual trigger button on simulator/emulator
+const IInstallWrapper = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enabled = true, showDebugButton: _showDebugButton = false, showFloatingButtonOnEmulator = true, floatingButtonLabel = 'Report Issue', pushToken, autoRegisterPushToken = true, projectId, onPushTokenRegisterError, }) => {
+    return (<index_1.IInstall apiKey={apiKey} apiEndpoint={apiEndpoint} enabled={enabled} showFloatingButtonOnEmulator={showFloatingButtonOnEmulator} floatingButtonLabel={floatingButtonLabel} pushToken={pushToken} autoRegisterPushToken={autoRegisterPushToken} projectId={projectId} onPushTokenRegisterError={onPushTokenRegisterError}>
       {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,
-    },
-});
+exports.default = exports.IInstallWrapper;

package/lib/index.d.ts

@@ -4,7 +4,14 @@ interface IInstallProps {
     apiEndpoint?: string;
     children?: React.ReactNode;
     enabled?: boolean;
+    showFloatingButtonOnEmulator?: boolean;
+    floatingButtonLabel?: string;
+    pushToken?: string;
+    autoRegisterPushToken?: boolean;
+    projectId?: string;
+    onPushTokenRegisterError?: (error: string) => void;
 }
 export declare const IInstall: React.FC<IInstallProps>;
 export default IInstall;
 export { IInstallWrapper } from './IInstallWrapper';
+export { registerPushToken, unregisterPushToken, type RegisterPushTokenParams, type UnregisterPushTokenParams, type PushRegistrationResult, type PushPlatform, } from './pushRegistration';

package/lib/index.js

@@ -36,19 +36,23 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.IInstallWrapper = exports.IInstall = void 0;
+exports.unregisterPushToken = exports.registerPushToken = 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");
 const ShakeDetector_1 = require("./ShakeDetector");
 const FeedbackModal_1 = require("./FeedbackModal");
 const react_native_record_screen_1 = __importDefault(require("react-native-record-screen"));
-const IInstall = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enabled = true }) => {
+const react_native_device_info_1 = __importDefault(require("react-native-device-info"));
+const pushRegistration_1 = require("./pushRegistration");
+const IInstall = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enabled = true, showFloatingButtonOnEmulator = true, floatingButtonLabel = 'Report Issue', pushToken, autoRegisterPushToken = true, projectId, onPushTokenRegisterError, }) => {
     const [modalVisible, setModalVisible] = (0, react_1.useState)(false);
     const [screenshotUri, setScreenshotUri] = (0, react_1.useState)(null);
     const [videoUri, setVideoUri] = (0, react_1.useState)(null);
     const [isRecording, setIsRecording] = (0, react_1.useState)(false);
+    const [isEmulator, setIsEmulator] = (0, react_1.useState)(false);
     const shakeDetectorRef = (0, react_1.useRef)(null);
+    const lastRegisteredPushTokenRef = (0, react_1.useRef)(null);
     // Refs for stable access in shake callback
     const isRecordingRef = (0, react_1.useRef)(isRecording);
     const modalVisibleRef = (0, react_1.useRef)(modalVisible);
@@ -56,6 +60,23 @@ const IInstall = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enab
         isRecordingRef.current = isRecording;
         modalVisibleRef.current = modalVisible;
     }, [isRecording, modalVisible]);
+    (0, react_1.useEffect)(() => {
+        let mounted = true;
+        react_native_device_info_1.default.isEmulator()
+            .then((value) => {
+            if (mounted) {
+                setIsEmulator(value);
+            }
+        })
+            .catch(() => {
+            if (mounted) {
+                setIsEmulator(false);
+            }
+        });
+        return () => {
+            mounted = false;
+        };
+    }, []);
     const handleShake = async () => {
         if (modalVisibleRef.current || isRecordingRef.current)
             return;
@@ -80,7 +101,7 @@ const IInstall = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enab
         handleShakeCallback.current = handleShake;
     });
     (0, react_1.useEffect)(() => {
-        if (!enabled)
+        if (!enabled || isEmulator)
             return;
         // Use a wrapper to call the current handleShake
         shakeDetectorRef.current = new ShakeDetector_1.ShakeDetector(() => handleShakeCallback.current());
@@ -88,7 +109,64 @@ const IInstall = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enab
         return () => {
             shakeDetectorRef.current?.stop();
         };
-    }, [enabled]);
+    }, [enabled, isEmulator]);
+    (0, react_1.useEffect)(() => {
+        if (!enabled || !autoRegisterPushToken || !pushToken)
+            return;
+        if (lastRegisteredPushTokenRef.current === pushToken)
+            return;
+        let cancelled = false;
+        const syncPushToken = async () => {
+            const deviceUdid = await react_native_device_info_1.default.getUniqueId().catch(() => undefined);
+            const result = await (0, pushRegistration_1.registerPushToken)({
+                token: pushToken,
+                apiKey,
+                apiEndpoint,
+                deviceUdid,
+                projectId,
+            });
+            if (cancelled)
+                return;
+            if (result.success) {
+                lastRegisteredPushTokenRef.current = pushToken;
+            }
+            else {
+                const message = result.error || 'Failed to register push token';
+                console.warn('IInstall: push token registration failed', message);
+                if (onPushTokenRegisterError) {
+                    onPushTokenRegisterError(message);
+                }
+            }
+        };
+        syncPushToken().catch((error) => {
+            if (cancelled)
+                return;
+            const message = error instanceof Error ? error.message : 'Failed to register push token';
+            console.warn('IInstall: push token registration failed', message);
+            if (onPushTokenRegisterError) {
+                onPushTokenRegisterError(message);
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [
+        enabled,
+        autoRegisterPushToken,
+        pushToken,
+        apiKey,
+        apiEndpoint,
+        projectId,
+        onPushTokenRegisterError,
+    ]);
+    const handleFloatingButtonPress = async () => {
+        await handleShakeCallback.current();
+    };
+    const shouldShowFloatingButton = enabled &&
+        isEmulator &&
+        showFloatingButtonOnEmulator &&
+        !modalVisible &&
+        !isRecording;
     const normalizeVideoUri = (value) => {
         if (react_native_1.Platform.OS === 'ios' && value.startsWith('/')) {
             return `file://${value}`;
@@ -173,6 +251,12 @@ const IInstall = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enab
       <react_native_1.View style={react_native_1.StyleSheet.absoluteFill}>
         {children}
       </react_native_1.View>
+
+      {shouldShowFloatingButton && (<react_native_1.View style={styles.floatingButtonContainer} pointerEvents="box-none">
+          <react_native_1.TouchableOpacity accessibilityRole="button" accessibilityLabel="Open feedback menu" onPress={handleFloatingButtonPress} style={styles.floatingButton}>
+            <react_native_1.Text style={styles.floatingButtonText}>{floatingButtonLabel}</react_native_1.Text>
+          </react_native_1.TouchableOpacity>
+        </react_native_1.View>)}
       
       {isRecording && (<react_native_1.SafeAreaView style={styles.recordingOverlay} pointerEvents="box-none">
               <react_native_1.View style={styles.recordingContainer}>
@@ -193,6 +277,30 @@ const IInstall = ({ apiKey, apiEndpoint = 'https://iinstall.app', children, enab
 };
 exports.IInstall = IInstall;
 const styles = react_native_1.StyleSheet.create({
+    floatingButtonContainer: {
+        position: 'absolute',
+        right: 16,
+        bottom: 28,
+        zIndex: 9998,
+        elevation: 20,
+    },
+    floatingButton: {
+        backgroundColor: '#0f172a',
+        borderColor: '#2563eb',
+        borderWidth: 1,
+        borderRadius: 24,
+        paddingHorizontal: 14,
+        paddingVertical: 10,
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.35,
+        shadowRadius: 4,
+    },
+    floatingButtonText: {
+        color: '#FFF',
+        fontWeight: '700',
+        fontSize: 13,
+    },
     recordingOverlay: {
         position: 'absolute',
         top: 50,
@@ -235,3 +343,6 @@ 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; } });
+var pushRegistration_2 = require("./pushRegistration");
+Object.defineProperty(exports, "registerPushToken", { enumerable: true, get: function () { return pushRegistration_2.registerPushToken; } });
+Object.defineProperty(exports, "unregisterPushToken", { enumerable: true, get: function () { return pushRegistration_2.unregisterPushToken; } });

package/lib/pushRegistration.d.ts

@@ -0,0 +1,22 @@
+export type PushPlatform = 'IOS' | 'ANDROID';
+export interface RegisterPushTokenParams {
+    token: string;
+    apiKey: string;
+    apiEndpoint?: string;
+    deviceUdid?: string;
+    projectId?: string;
+    platform?: PushPlatform;
+}
+export interface UnregisterPushTokenParams {
+    token: string;
+    apiKey: string;
+    apiEndpoint?: string;
+}
+export interface PushRegistrationResult {
+    success: boolean;
+    data?: any;
+    error?: string;
+    status: number;
+}
+export declare function registerPushToken({ token, apiKey, apiEndpoint, deviceUdid, projectId, platform, }: RegisterPushTokenParams): Promise<PushRegistrationResult>;
+export declare function unregisterPushToken({ token, apiKey, apiEndpoint, }: UnregisterPushTokenParams): Promise<PushRegistrationResult>;

package/lib/pushRegistration.js

@@ -0,0 +1,70 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.registerPushToken = registerPushToken;
+exports.unregisterPushToken = unregisterPushToken;
+const react_native_1 = require("react-native");
+function normalizeApiEndpoint(apiEndpoint) {
+    return apiEndpoint.replace(/\/+$/, '');
+}
+function resolvePlatform(platform) {
+    if (platform)
+        return platform;
+    return react_native_1.Platform.OS === 'ios' ? 'IOS' : 'ANDROID';
+}
+async function registerPushToken({ token, apiKey, apiEndpoint = 'https://iinstall.app', deviceUdid, projectId, platform, }) {
+    try {
+        const response = await fetch(`${normalizeApiEndpoint(apiEndpoint)}/api/notifications/push/register`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({
+                token,
+                apiKey,
+                deviceUdid,
+                projectId,
+                platform: resolvePlatform(platform),
+            }),
+        });
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const data = await response.json().catch(() => ({}));
+        return {
+            success: response.ok,
+            status: response.status,
+            data,
+            error: response.ok ? undefined : data?.error || 'Failed to register push token',
+        };
+    }
+    catch (error) {
+        return {
+            success: false,
+            status: 500,
+            error: error instanceof Error ? error.message : 'Unknown register push error',
+        };
+    }
+}
+async function unregisterPushToken({ token, apiKey, apiEndpoint = 'https://iinstall.app', }) {
+    try {
+        const response = await fetch(`${normalizeApiEndpoint(apiEndpoint)}/api/notifications/push/register`, {
+            method: 'DELETE',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({
+                token,
+                apiKey,
+            }),
+        });
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const data = await response.json().catch(() => ({}));
+        return {
+            success: response.ok,
+            status: response.status,
+            data,
+            error: response.ok ? undefined : data?.error || 'Failed to unregister push token',
+        };
+    }
+    catch (error) {
+        return {
+            success: false,
+            status: 500,
+            error: error instanceof Error ? error.message : 'Unknown unregister push error',
+        };
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-iinstall",
-  "version": "0.2.11",
+  "version": "0.2.13",
   "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

@@ -1,178 +1,52 @@
-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 React from 'react';
 import { IInstall } from './index';
-import { ShakeDetector } from './ShakeDetector';
 
 interface IInstallWrapperProps {
   apiKey: string;
   apiEndpoint?: string;
   children?: React.ReactNode;
   enabled?: boolean;
+  // Backward compatibility only. No longer used.
   showDebugButton?: boolean;
+  showFloatingButtonOnEmulator?: boolean;
+  floatingButtonLabel?: string;
+  pushToken?: string;
+  autoRegisterPushToken?: boolean;
+  projectId?: string;
+  onPushTokenRegisterError?: (error: string) => void;
 }
 
-// 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', 
+// Backward-compatible wrapper. The core IInstall component now handles:
+// - shake gesture on real devices
+// - floating manual trigger button on simulator/emulator
+export const IInstallWrapper: React.FC<IInstallWrapperProps> = ({
+  apiKey,
+  apiEndpoint = 'https://iinstall.app',
   children,
   enabled = true,
-  showDebugButton = true
+  showDebugButton: _showDebugButton = false,
+  showFloatingButtonOnEmulator = true,
+  floatingButtonLabel = 'Report Issue',
+  pushToken,
+  autoRegisterPushToken = true,
+  projectId,
+  onPushTokenRegisterError,
 }) => {
-  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} 
+    <IInstall
+      apiKey={apiKey}
+      apiEndpoint={apiEndpoint}
       enabled={enabled}
+      showFloatingButtonOnEmulator={showFloatingButtonOnEmulator}
+      floatingButtonLabel={floatingButtonLabel}
+      pushToken={pushToken}
+      autoRegisterPushToken={autoRegisterPushToken}
+      projectId={projectId}
+      onPushTokenRegisterError={onPushTokenRegisterError}
     >
       {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,
-  },
-});
+export default IInstallWrapper;

package/src/index.tsx

@@ -4,26 +4,42 @@ import { captureScreen } from 'react-native-view-shot';
 import { ShakeDetector } from './ShakeDetector';
 import { FeedbackModal } from './FeedbackModal';
 import RecordScreen from 'react-native-record-screen';
+import DeviceInfo from 'react-native-device-info';
+import { registerPushToken } from './pushRegistration';
 
 interface IInstallProps {
   apiKey: string;
   apiEndpoint?: string; // e.g. https://iinstall.app
   children?: React.ReactNode;
   enabled?: boolean;
+  showFloatingButtonOnEmulator?: boolean;
+  floatingButtonLabel?: string;
+  pushToken?: string;
+  autoRegisterPushToken?: boolean;
+  projectId?: string;
+  onPushTokenRegisterError?: (error: string) => void;
 }
 
 export const IInstall: React.FC<IInstallProps> = ({ 
   apiKey, 
   apiEndpoint = 'https://iinstall.app', 
   children,
-  enabled = true 
+  enabled = true,
+  showFloatingButtonOnEmulator = true,
+  floatingButtonLabel = 'Report Issue',
+  pushToken,
+  autoRegisterPushToken = true,
+  projectId,
+  onPushTokenRegisterError,
 }) => {
   const [modalVisible, setModalVisible] = useState(false);
   const [screenshotUri, setScreenshotUri] = useState<string | null>(null);
   const [videoUri, setVideoUri] = useState<string | null>(null);
   const [isRecording, setIsRecording] = useState(false);
+  const [isEmulator, setIsEmulator] = useState(false);
   
   const shakeDetectorRef = useRef<ShakeDetector | null>(null);
+  const lastRegisteredPushTokenRef = useRef<string | null>(null);
   
   // Refs for stable access in shake callback
   const isRecordingRef = useRef(isRecording);
@@ -34,6 +50,26 @@ export const IInstall: React.FC<IInstallProps> = ({
     modalVisibleRef.current = modalVisible;
   }, [isRecording, modalVisible]);
 
+  useEffect(() => {
+    let mounted = true;
+
+    DeviceInfo.isEmulator()
+      .then((value) => {
+        if (mounted) {
+          setIsEmulator(value);
+        }
+      })
+      .catch(() => {
+        if (mounted) {
+          setIsEmulator(false);
+        }
+      });
+
+    return () => {
+      mounted = false;
+    };
+  }, []);
+
   const handleShake = async () => {
     if (modalVisibleRef.current || isRecordingRef.current) return;
 
@@ -59,7 +95,7 @@ export const IInstall: React.FC<IInstallProps> = ({
   });
 
   useEffect(() => {
-    if (!enabled) return;
+    if (!enabled || isEmulator) return;
 
     // Use a wrapper to call the current handleShake
     shakeDetectorRef.current = new ShakeDetector(() => handleShakeCallback.current());
@@ -68,7 +104,70 @@ export const IInstall: React.FC<IInstallProps> = ({
     return () => {
       shakeDetectorRef.current?.stop();
     };
-  }, [enabled]);
+  }, [enabled, isEmulator]);
+
+  useEffect(() => {
+    if (!enabled || !autoRegisterPushToken || !pushToken) return;
+    if (lastRegisteredPushTokenRef.current === pushToken) return;
+
+    let cancelled = false;
+
+    const syncPushToken = async () => {
+      const deviceUdid = await DeviceInfo.getUniqueId().catch(() => undefined);
+      const result = await registerPushToken({
+        token: pushToken,
+        apiKey,
+        apiEndpoint,
+        deviceUdid,
+        projectId,
+      });
+
+      if (cancelled) return;
+
+      if (result.success) {
+        lastRegisteredPushTokenRef.current = pushToken;
+      } else {
+        const message = result.error || 'Failed to register push token';
+        console.warn('IInstall: push token registration failed', message);
+        if (onPushTokenRegisterError) {
+          onPushTokenRegisterError(message);
+        }
+      }
+    };
+
+    syncPushToken().catch((error) => {
+      if (cancelled) return;
+      const message =
+        error instanceof Error ? error.message : 'Failed to register push token';
+      console.warn('IInstall: push token registration failed', message);
+      if (onPushTokenRegisterError) {
+        onPushTokenRegisterError(message);
+      }
+    });
+
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    enabled,
+    autoRegisterPushToken,
+    pushToken,
+    apiKey,
+    apiEndpoint,
+    projectId,
+    onPushTokenRegisterError,
+  ]);
+
+  const handleFloatingButtonPress = async () => {
+    await handleShakeCallback.current();
+  };
+
+  const shouldShowFloatingButton =
+    enabled &&
+    isEmulator &&
+    showFloatingButtonOnEmulator &&
+    !modalVisible &&
+    !isRecording;
 
   const normalizeVideoUri = (value: string) => {
     if (Platform.OS === 'ios' && value.startsWith('/')) {
@@ -181,6 +280,19 @@ export const IInstall: React.FC<IInstallProps> = ({
       <View style={StyleSheet.absoluteFill}>
         {children}
       </View>
+
+      {shouldShowFloatingButton && (
+        <View style={styles.floatingButtonContainer} pointerEvents="box-none">
+          <TouchableOpacity
+            accessibilityRole="button"
+            accessibilityLabel="Open feedback menu"
+            onPress={handleFloatingButtonPress}
+            style={styles.floatingButton}
+          >
+            <Text style={styles.floatingButtonText}>{floatingButtonLabel}</Text>
+          </TouchableOpacity>
+        </View>
+      )}
       
       {isRecording && (
           <SafeAreaView style={styles.recordingOverlay} pointerEvents="box-none">
@@ -212,6 +324,30 @@ export const IInstall: React.FC<IInstallProps> = ({
 };
 
 const styles = StyleSheet.create({
+    floatingButtonContainer: {
+        position: 'absolute',
+        right: 16,
+        bottom: 28,
+        zIndex: 9998,
+        elevation: 20,
+    },
+    floatingButton: {
+        backgroundColor: '#0f172a',
+        borderColor: '#2563eb',
+        borderWidth: 1,
+        borderRadius: 24,
+        paddingHorizontal: 14,
+        paddingVertical: 10,
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 2 },
+        shadowOpacity: 0.35,
+        shadowRadius: 4,
+    },
+    floatingButtonText: {
+        color: '#FFF',
+        fontWeight: '700',
+        fontSize: 13,
+    },
     recordingOverlay: {
         position: 'absolute',
         top: 50,
@@ -255,3 +391,11 @@ export default IInstall;
 
 // Export the wrapper component for simulator/emulator support
 export { IInstallWrapper } from './IInstallWrapper';
+export {
+  registerPushToken,
+  unregisterPushToken,
+  type RegisterPushTokenParams,
+  type UnregisterPushTokenParams,
+  type PushRegistrationResult,
+  type PushPlatform,
+} from './pushRegistration';

package/src/pushRegistration.ts

@@ -0,0 +1,111 @@
+import { Platform } from 'react-native';
+
+export type PushPlatform = 'IOS' | 'ANDROID';
+
+export interface RegisterPushTokenParams {
+  token: string;
+  apiKey: string;
+  apiEndpoint?: string;
+  deviceUdid?: string;
+  projectId?: string;
+  platform?: PushPlatform;
+}
+
+export interface UnregisterPushTokenParams {
+  token: string;
+  apiKey: string;
+  apiEndpoint?: string;
+}
+
+export interface PushRegistrationResult {
+  success: boolean;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  data?: any;
+  error?: string;
+  status: number;
+}
+
+function normalizeApiEndpoint(apiEndpoint: string): string {
+  return apiEndpoint.replace(/\/+$/, '');
+}
+
+function resolvePlatform(platform?: PushPlatform): PushPlatform {
+  if (platform) return platform;
+  return Platform.OS === 'ios' ? 'IOS' : 'ANDROID';
+}
+
+export async function registerPushToken({
+  token,
+  apiKey,
+  apiEndpoint = 'https://iinstall.app',
+  deviceUdid,
+  projectId,
+  platform,
+}: RegisterPushTokenParams): Promise<PushRegistrationResult> {
+  try {
+    const response = await fetch(
+      `${normalizeApiEndpoint(apiEndpoint)}/api/notifications/push/register`,
+      {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          token,
+          apiKey,
+          deviceUdid,
+          projectId,
+          platform: resolvePlatform(platform),
+        }),
+      }
+    );
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const data: any = await response.json().catch(() => ({}));
+    return {
+      success: response.ok,
+      status: response.status,
+      data,
+      error: response.ok ? undefined : data?.error || 'Failed to register push token',
+    };
+  } catch (error) {
+    return {
+      success: false,
+      status: 500,
+      error: error instanceof Error ? error.message : 'Unknown register push error',
+    };
+  }
+}
+
+export async function unregisterPushToken({
+  token,
+  apiKey,
+  apiEndpoint = 'https://iinstall.app',
+}: UnregisterPushTokenParams): Promise<PushRegistrationResult> {
+  try {
+    const response = await fetch(
+      `${normalizeApiEndpoint(apiEndpoint)}/api/notifications/push/register`,
+      {
+        method: 'DELETE',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          token,
+          apiKey,
+        }),
+      }
+    );
+
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const data: any = await response.json().catch(() => ({}));
+    return {
+      success: response.ok,
+      status: response.status,
+      data,
+      error: response.ok ? undefined : data?.error || 'Failed to unregister push token',
+    };
+  } catch (error) {
+    return {
+      success: false,
+      status: 500,
+      error: error instanceof Error ? error.message : 'Unknown unregister push error',
+    };
+  }
+}