@revrag-ai/embed-react-native 1.0.5 → 1.0.7

package/lib/module/hooks/voiceagent.js

@@ -0,0 +1,353 @@
+"use strict";
+
+import { ConnectionState, Room } from 'livekit-client';
+import { useEffect, useState } from 'react';
+import { EventKeys } from "../events/embed.event.js";
+import { APIService } from "../api/api.js";
+import { getAgentData } from "../store/store.key.js";
+// Create a singleton instance of Room that persists across hook instances
+// This ensures we don't create multiple Room instances that could conflict
+let roomInstance = null;
+let isConnecting = false;
+let isDisconnecting = false;
+let hasListeners = false;
+let connectionAttempts = 0;
+let stableConnectionTimerId = null;
+const MAX_CONNECTION_ATTEMPTS = 3;
+const STABLE_CONNECTION_TIMEOUT = 5000; // 5 seconds
+
+// Create getters for the room instance
+const getRoomInstance = () => {
+  if (!roomInstance) {
+    console.log('Creating new Room instance');
+    // Configure the room with the right options at creation time
+    roomInstance = new Room({
+      adaptiveStream: true,
+      dynacast: true,
+      // Using the most stable configuration for React Native
+      publishDefaults: {
+        simulcast: false // Disable simulcast to reduce SDP complexity
+      }
+    });
+  }
+  return roomInstance;
+};
+
+// Reset connection attempt counter
+const resetConnectionAttempts = () => {
+  connectionAttempts = 0;
+
+  // Clear any pending stable connection timer
+  if (stableConnectionTimerId) {
+    clearTimeout(stableConnectionTimerId);
+    stableConnectionTimerId = null;
+  }
+};
+
+// Cleanup function to reset the room state
+const resetRoomState = () => {
+  if (roomInstance) {
+    try {
+      console.log('Resetting room state');
+      console.log('isDisconnecting', isDisconnecting);
+
+      // Only disconnect if currently connected
+      if (roomInstance.state !== ConnectionState.Disconnected && !isDisconnecting) {
+        isDisconnecting = true;
+        roomInstance.disconnect().finally(() => {
+          isDisconnecting = false;
+        });
+      }
+
+      // Don't destroy the room instance, just reset its state
+      hasListeners = false;
+      resetConnectionAttempts();
+    } catch (e) {
+      console.error('Error resetting room state:', e);
+    }
+  }
+};
+export const useVoiceAgent = () => {
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [tokenDetails, setTokenDetails] = useState(null);
+  const [isMicMuted, setIsMicMuted] = useState(false);
+  const [connectionState, setConnectionState] = useState(() => {
+    // Initialize with the current room state if it exists
+    const room = getRoomInstance();
+    return room ? room.state : ConnectionState.Disconnected;
+  });
+  const [stableConnection, setStableConnection] = useState(false);
+  console.log('ConnectionState_connected', connectionState
+  // tokenDetails?.token
+  );
+
+  // Setup event listeners for the room
+  const setupRoomListeners = () => {
+    if (hasListeners || !roomInstance) return;
+    console.log('Setting up room listeners');
+    const handleConnectionChange = state => {
+      console.log('Connection state changed:', state);
+      // Use a function to ensure we're setting with the latest state
+      setConnectionState(() => state);
+
+      // Handle connection state changes
+      if (state === ConnectionState.Connected) {
+        // Reset connection attempts when connected successfully
+        resetConnectionAttempts();
+
+        // Set up a timer to mark the connection as stable after a few seconds
+        // This prevents immediate disconnections from being treated as stable
+        if (stableConnectionTimerId) {
+          clearTimeout(stableConnectionTimerId);
+        }
+        stableConnectionTimerId = setTimeout(() => {
+          console.log('Connection marked as stable');
+          setStableConnection(true);
+        }, STABLE_CONNECTION_TIMEOUT);
+      } else if (state === ConnectionState.Disconnected) {
+        // Mark connection as unstable
+        setStableConnection(false);
+
+        // Clear any pending stable connection timer
+        if (stableConnectionTimerId) {
+          clearTimeout(stableConnectionTimerId);
+          stableConnectionTimerId = null;
+        }
+
+        // If disconnected unexpectedly and we have token details, don't automatically reconnect
+        // This prevents connection loops
+        if (tokenDetails && !isDisconnecting) {
+          console.log('Room disconnected unexpectedly - not auto-reconnecting');
+        }
+      }
+    };
+    const handleTrackSubscribed = track => {
+      if (track.kind === 'audio') {
+        track.setVolume(1.0);
+      }
+    };
+
+    // Handle participant disconnected - this could be helpful to detect server-side kicks
+    roomInstance.on('participantDisconnected', () => {
+      console.log('Participant disconnected from room');
+    });
+    roomInstance.on('connectionStateChanged', handleConnectionChange);
+    roomInstance.on('trackSubscribed', handleTrackSubscribed);
+
+    // Listen for SDP negotiation errors to handle them better
+    roomInstance.on('mediaDevicesError', e => {
+      console.log('Media devices error:', e.message);
+    });
+    hasListeners = true;
+  };
+
+  // Initialize room and listeners
+  useEffect(() => {
+    const room = getRoomInstance();
+    setupRoomListeners();
+
+    // Sync local state with room state
+    setConnectionState(room.state);
+    return () => {
+      // Do NOT disconnect or destroy the room on component unmount
+      // This ensures the singleton persists across component lifecycle
+      // But we do want to update local state if the component is unmounted
+      if (!tokenDetails) {
+        setTokenDetails(null);
+      }
+    };
+  }, []);
+
+  // Connect to LiveKit when token is set
+  useEffect(() => {
+    const room = getRoomInstance();
+    if (!tokenDetails || isConnecting) return;
+
+    // Always sync our state with the room's current state
+    setConnectionState(room.state);
+    const connectToRoom = async () => {
+      // Prevent multiple connection attempts
+      if (isConnecting) return;
+
+      // Limit connection attempts to prevent infinite loops
+      if (connectionAttempts >= MAX_CONNECTION_ATTEMPTS) {
+        console.log(`Maximum connection attempts (${MAX_CONNECTION_ATTEMPTS}) reached. Not trying again.`);
+        setError(`Failed to connect after ${MAX_CONNECTION_ATTEMPTS} attempts`);
+        return;
+      }
+      connectionAttempts++;
+      try {
+        isConnecting = true;
+        console.log(`Connecting to LiveKit room... (attempt ${connectionAttempts})`);
+
+        // Only attempt to connect if we're disconnected
+        if (room.state === ConnectionState.Disconnected) {
+          // Update state before connection attempt
+          setConnectionState(ConnectionState.Connecting);
+          await room.connect(tokenDetails.server_url, tokenDetails.token, {
+            autoSubscribe: true // Ensure we subscribe to tracks automatically
+          });
+
+          // Explicitly set to connected if connection was successful
+          setConnectionState(room.state);
+          console.log('Connected to LiveKit room');
+        } else if (room.state === ConnectionState.Connected) {
+          console.log('Room is already connected');
+          // Ensure our state matches
+          setConnectionState(ConnectionState.Connected);
+        } else {
+          console.log('Room is in transition state:', room.state);
+          // Sync our state with the room's current state
+          setConnectionState(room.state);
+        }
+      } catch (err) {
+        const message = err instanceof Error ? err.message : 'Failed to connect to room';
+        setError(message);
+        console.error('Connection error:', message);
+
+        // Sync state to disconnected if we failed to connect
+        setConnectionState(room.state);
+
+        // Don't keep retrying if we hit an SDP error
+        if (message.includes('SDP') || message.includes('sdp')) {
+          console.log('SDP error detected, will not retry automatically');
+        }
+      } finally {
+        isConnecting = false;
+      }
+    };
+    connectToRoom();
+
+    // No cleanup here - we don't want to disconnect when token changes or component unmounts
+  }, [tokenDetails]);
+
+  // Log connection status periodically for debugging
+  useEffect(() => {
+    const debugInterval = setInterval(() => {
+      if (roomInstance) {
+        const state = roomInstance.state;
+        const participantCount = roomInstance.numParticipants;
+        console.log(`[DEBUG] Room state: ${state}, Participants: ${participantCount}, Stable: ${stableConnection}`);
+      }
+    }, 10000); // Every 10 seconds
+
+    return () => clearInterval(debugInterval);
+  }, [stableConnection]);
+
+  // Generate token and connect
+  const generateVoiceToken = async () => {
+    console.log('generateVoiceToken');
+
+    // Don't generate a new token if we're already connecting/connected
+    if (isConnecting || isLoading) {
+      console.log('Already connecting or loading, skipping token generation');
+      return;
+    }
+
+    // Reset connection attempts when starting fresh
+    resetConnectionAttempts();
+    setStableConnection(false);
+    const userData = await getAgentData(EventKeys.USER_DATA);
+    setIsLoading(true);
+    setError(null);
+    console.log('userData', userData);
+    try {
+      const apiService = APIService.getInstance();
+      const response = await apiService.getTokenDetails({
+        app_user_id: userData?.app_user_id,
+        call_type: 'EMBEDDED'
+      });
+      if (!response.data) throw new Error('No voice token found');
+
+      // Only set token details if we're not already connected
+      const room = getRoomInstance();
+      if (room.state !== ConnectionState.Connected) {
+        setTokenDetails(response.data);
+      } else {
+        console.log('Room already connected, skipping token update');
+      }
+    } catch (err) {
+      const message = err instanceof Error ? err.message : 'Failed to generate voice token';
+      setError(message);
+      throw new Error(message);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  // End call
+  const endCall = async () => {
+    if (isDisconnecting) {
+      console.log('Already disconnecting, skipping');
+      return;
+    }
+    try {
+      console.log('Ending call');
+      isDisconnecting = true;
+      setTokenDetails(null);
+      setIsMicMuted(false);
+      resetConnectionAttempts();
+      setStableConnection(false);
+      const room = getRoomInstance();
+      if (room.state !== ConnectionState.Disconnected) {
+        // Update state before disconnection
+        setConnectionState(ConnectionState.Connecting);
+        await room.disconnect();
+
+        // Update state after disconnection
+        setConnectionState(ConnectionState.Disconnected);
+      }
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to end call');
+      // Make sure state is correctly reflected even if there's an error
+      const room = getRoomInstance();
+      setConnectionState(room.state);
+    } finally {
+      isDisconnecting = false;
+    }
+  };
+
+  // Mute microphone
+  const muteMic = () => {
+    const room = getRoomInstance();
+    if (room.localParticipant) {
+      room.localParticipant.setMicrophoneEnabled(false);
+      setIsMicMuted(true);
+      console.log('Microphone muted');
+    }
+  };
+
+  // Unmute microphone
+  const unmuteMic = () => {
+    const room = getRoomInstance();
+    if (room.localParticipant) {
+      room.localParticipant.setMicrophoneEnabled(true);
+      setIsMicMuted(false);
+      console.log('Microphone unmuted');
+    }
+  };
+
+  // Clean up everything (use only when the app is shutting down)
+  const cleanup = () => {
+    endCall();
+    resetRoomState();
+  };
+  return {
+    initializeVoiceAgent: generateVoiceToken,
+    endCall,
+    muteMic,
+    unmuteMic,
+    isMicMuted,
+    connectionState,
+    room: getRoomInstance(),
+    tokenDetails,
+    isLoading,
+    error,
+    roomRef: {
+      current: getRoomInstance()
+    },
+    cleanup
+  };
+};
+//# sourceMappingURL=voiceagent.js.map

package/lib/module/index.js

@@ -1,61 +1,7 @@
 "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.useInitialize = exports.registerAgent = exports.onwid = exports.EventKeys = void 0;
-exports.OnwidButton = OnwidButton;
-const jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * @file index.tsx
- * @description Main entry point for the Onwid React Native library.
- * This file exports the core components and utilities for the Onwid SDK.
- */
-const OnwidButton_1 = require("./component/OnwidButton");
-const onwid_1 = __importStar(require("./Event/onwid"));
-exports.onwid = onwid_1.default;
-Object.defineProperty(exports, "EventKeys", { enumerable: true, get: function () { return onwid_1.EventKeys; } });
-const initialize_1 = require("./hooks/initialize");
-Object.defineProperty(exports, "useInitialize", { enumerable: true, get: function () { return initialize_1.useInitialize; } });
-const initializelivekit_1 = __importDefault(require("./hooks/initializelivekit"));
-exports.registerAgent = initializelivekit_1.default;
-/**
- * OnwidButton component that provides a customizable button with menu functionality
- * @returns React component
- */
-function OnwidButton() {
-    return (0, jsx_runtime_1.jsx)(OnwidButton_1.OnwidButton, {});
-}
+
+import { EmbedButton } from "./components/Embed/EmbedButton.js";
+import { useInitialize } from "./hooks/initialize.js";
+import Embed, { EventKeys } from "./events/embed.event.js";
+export { EmbedButton, useInitialize, Embed, EventKeys as EmbedEventKeys };
+//# sourceMappingURL=index.js.map

package/lib/module/index.types.js

@@ -0,0 +1,23 @@
+"use strict";
+
+/* eslint-disable */
+/**
+ * @file index.d.ts
+ * @description TypeScript declarations for the Onwid React Native library.
+ */
+
+// Component declarations
+
+// Hook type declarations
+
+// Hook declarations
+
+// API type declarations
+
+// Event system declarations
+export let EventKeys = /*#__PURE__*/function (EventKeys) {
+  EventKeys["USER_DATA"] = "user_data";
+  EventKeys["SCREEN_STATE"] = "state_data";
+  return EventKeys;
+}({});
+//# sourceMappingURL=index.types.js.map

package/lib/module/store/store.key.js

@@ -0,0 +1,38 @@
+"use strict";
+
+import AsyncStorage from '@react-native-async-storage/async-storage';
+const STORAGE_KEY = '@user_data';
+export const setAgentData = async (data, key = STORAGE_KEY) => {
+  try {
+    const jsonString = JSON.stringify(data);
+    await AsyncStorage.setItem(key, jsonString);
+    console.log('Data saved to storage successfully');
+  } catch (error) {
+    console.error('Storage save error:', error);
+    throw error; // Re-throw to allow caller to handle
+  }
+};
+export const getAgentData = async (key = STORAGE_KEY) => {
+  try {
+    const jsonString = await AsyncStorage.getItem(key);
+    if (!jsonString) {
+      console.log('No data stored');
+      return null;
+    }
+    const data = JSON.parse(jsonString);
+    return data;
+  } catch (error) {
+    console.error('Storage fetch error:', error);
+    throw error; // Re-throw to allow caller to handle
+  }
+};
+export const deleteFromDetail = async key => {
+  try {
+    await AsyncStorage.removeItem(key);
+    console.log('Storage data reset successfully');
+  } catch (error) {
+    console.error('Storage reset error:', error);
+    throw error; // Re-throw to allow caller to handle
+  }
+};
+//# sourceMappingURL=store.key.js.map

package/lib/module/utils/reanimated.helper.js

@@ -0,0 +1,94 @@
+"use strict";
+
+/**
+ * @file reanimatedHelpers.ts
+ * @description Utility functions to handle react-native-reanimated configuration and provide fallbacks
+ */
+
+let reanimatedAPI;
+
+/**
+ * Safely loads react-native-reanimated and provides fallbacks if not available
+ */
+export function getReanimatedAPI() {
+  if (reanimatedAPI) {
+    return reanimatedAPI;
+  }
+  try {
+    const reanimated = require('react-native-reanimated');
+
+    // Check if makeMutable is available (this is what was causing the original error)
+    if (!reanimated.makeMutable) {
+      throw new Error('makeMutable not found - react-native-reanimated may not be properly configured');
+    }
+    reanimatedAPI = {
+      useSharedValue: reanimated.useSharedValue,
+      useAnimatedStyle: reanimated.useAnimatedStyle,
+      withTiming: reanimated.withTiming,
+      withSpring: reanimated.withSpring,
+      withRepeat: reanimated.withRepeat,
+      withSequence: reanimated.withSequence,
+      runOnJS: reanimated.runOnJS,
+      Easing: reanimated.Easing,
+      Animated: reanimated.default,
+      isAvailable: true
+    };
+    console.log('✅ react-native-reanimated loaded successfully');
+    return reanimatedAPI;
+  } catch (error) {
+    console.warn('⚠️ react-native-reanimated is not properly installed or configured:', error);
+    console.warn('📚 Please follow the setup guide: https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started');
+
+    // Provide fallback implementations
+    const {
+      View
+    } = require('react-native');
+    reanimatedAPI = {
+      useSharedValue: value => ({
+        value
+      }),
+      useAnimatedStyle: () => ({}),
+      withTiming: value => value,
+      withSpring: value => value,
+      withRepeat: value => value,
+      withSequence: (...args) => args[args.length - 1],
+      runOnJS: fn => fn,
+      Easing: {
+        inOut: easing => easing,
+        ease: t => t
+      },
+      Animated: View,
+      isAvailable: false
+    };
+    return reanimatedAPI;
+  }
+}
+
+/**
+ * Check if react-native-reanimated is properly configured
+ */
+export function checkReanimatedSetup() {
+  const api = getReanimatedAPI();
+  return api.isAvailable;
+}
+
+/**
+ * Display a helpful error message if reanimated is not configured
+ */
+export function showReanimatedSetupError() {
+  console.error(`
+  🚨 React Native Reanimated Setup Required
+  
+  The OnwidButton component requires react-native-reanimated to be properly installed and configured.
+  
+  Quick Fix:
+  1. Install: npm install react-native-reanimated
+  2. Add to babel.config.js:
+     plugins: ['react-native-reanimated/plugin']
+  3. Rebuild your app
+  
+  For detailed setup instructions, visit:
+  https://docs.swmansion.com/react-native-reanimated/docs/fundamentals/getting-started
+    `);
+}
+//# sourceMappingURL=reanimated.helper.js.map

package/lib/typescript/commonjs/package.json

@@ -0,0 +1 @@
+{"type":"commonjs"}

package/lib/typescript/module/package.json

@@ -0,0 +1 @@
+{"type":"module"}