agora-appbuilder-core 4.1.9 → 4.1.11-beta.2

package/template/src/components/RTMConfigure.tsx

@@ -9,32 +9,21 @@
  information visit https://appbuilder.agora.io. 
 *********************************************
 */
-
+// @ts-nocheck
 import React, {useState, useContext, useEffect, useRef} from 'react';
-import {
-  type GetChannelMetadataResponse,
-  type GetOnlineUsersResponse,
-  type LinkStateEvent,
-  type MessageEvent,
-  type Metadata,
-  type PresenceEvent,
-  type SetOrUpdateUserMetadataOptions,
-  type StorageEvent,
-  type RTMClient,
-  type GetUserMetadataResponse,
-} from 'agora-react-native-rtm';
+import RtmEngine, {RtmChannelAttribute} from 'agora-react-native-rtm';
 import {
   ContentInterface,
   DispatchContext,
   PropsContext,
-  UidType,
   useLocalUid,
 } from '../../agora-rn-uikit';
 import ChatContext from './ChatContext';
 import {Platform} from 'react-native';
 import {backOff} from 'exponential-backoff';
+import {useString} from '../utils/useString';
 import {isAndroid, isIOS, isWeb, isWebInternal} from '../utils/common';
-import {useContent} from 'customization-api';
+import {useContent, useIsAttendee, useUserName} from 'customization-api';
 import {
   safeJsonParse,
   timeNow,
@@ -42,8 +31,8 @@ import {
   getMessageTime,
   get32BitUid,
 } from '../rtm/utils';
-import {EventUtils, EventsQueue} from '../rtm-events';
-import {PersistanceLevel} from '../rtm-events-api';
+import {EventUtils, EventsQueue, EventNames} from '../rtm-events';
+import events, {PersistanceLevel} from '../rtm-events-api';
 import RTMEngine from '../rtm/RTMEngine';
 import {filterObject} from '../utils';
 import SDKEvents from '../utils/SdkEvents';
@@ -56,79 +45,60 @@ import {
 import LocalEventEmitter, {
   LocalEventsEnum,
 } from '../rtm-events-api/LocalEvents';
+import {PSTNUserLabel} from '../language/default-labels/videoCallScreenLabels';
 import {controlMessageEnum} from '../components/ChatContext';
 import {LogSource, logger} from '../logger/AppBuilderLogger';
 import {RECORDING_BOT_UID} from '../utils/constants';
-import {
-  nativeChannelTypeMapping,
-  nativeLinkStateMapping,
-  nativePresenceEventTypeMapping,
-  nativeStorageEventTypeMapping,
-} from '../../bridge/rtm/web/Types';
 
 export enum UserType {
   ScreenShare = 'screenshare',
 }
 
-const eventTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
-
 const RtmConfigure = (props: any) => {
-  let engine = useRef<RTMClient>(null!);
   const rtmInitTimstamp = new Date().getTime();
   const localUid = useLocalUid();
   const {callActive} = props;
   const {rtcProps} = useContext(PropsContext);
   const {dispatch} = useContext(DispatchContext);
   const {defaultContent, activeUids} = useContent();
+  const defaultContentRef = useRef({defaultContent: defaultContent});
+  const activeUidsRef = useRef({activeUids: activeUids});
+
   const {
     waitingRoomStatus,
     data: {isHost},
   } = useRoomInfo();
-  const [hasUserJoinedRTM, setHasUserJoinedRTM] = useState<boolean>(false);
-  const [isInitialQueueCompleted, setIsInitialQueueCompleted] = useState(false);
-  const [onlineUsersCount, setTotalOnlineUsers] = useState<number>(0);
-  const timerValueRef: any = useRef(5);
-  // Track RTM connection state (equivalent to v1.5x connectionState check)
-  const [rtmConnectionState, setRtmConnectionState] = useState<number>(0); // 0=IDLE, 2=CONNECTED
+  const waitingRoomStatusRef = useRef({waitingRoomStatus: waitingRoomStatus});
 
-  /**
-   * inside event callback state won't have latest value.
-   * so creating ref to access the state
-   */
   const isHostRef = useRef({isHost: isHost});
+
   useEffect(() => {
     isHostRef.current.isHost = isHost;
   }, [isHost]);
 
-  const waitingRoomStatusRef = useRef({waitingRoomStatus: waitingRoomStatus});
   useEffect(() => {
     waitingRoomStatusRef.current.waitingRoomStatus = waitingRoomStatus;
   }, [waitingRoomStatus]);
 
-  const activeUidsRef = useRef({activeUids: activeUids});
+  /**
+   * inside event callback state won't have latest value.
+   * so creating ref to access the state
+   */
   useEffect(() => {
     activeUidsRef.current.activeUids = activeUids;
   }, [activeUids]);
 
-  const defaultContentRef = useRef({defaultContent: defaultContent});
   useEffect(() => {
     defaultContentRef.current.defaultContent = defaultContent;
   }, [defaultContent]);
 
-  // Eventdispatcher timeout refs clean
-  const isRTMMounted = useRef(true);
-  useEffect(() => {
-    return () => {
-      isRTMMounted.current = false;
-      // Clear all pending timeouts on unmount
-      for (const timeout of eventTimeouts.values()) {
-        clearTimeout(timeout);
-      }
-      eventTimeouts.clear();
-    };
-  }, []);
+  const [hasUserJoinedRTM, setHasUserJoinedRTM] = useState<boolean>(false);
+  const [isInitialQueueCompleted, setIsInitialQueueCompleted] = useState(false);
+  const [onlineUsersCount, setTotalOnlineUsers] = useState<number>(0);
+
+  let engine = useRef<RtmEngine>(null!);
+  const timerValueRef: any = useRef(5);
 
-  // Set online users
   React.useEffect(() => {
     setTotalOnlineUsers(
       Object.keys(
@@ -137,42 +107,31 @@ const RtmConfigure = (props: any) => {
           ([k, v]) =>
             v?.type === 'rtc' &&
             !v.offline &&
-            activeUidsRef.current.activeUids.indexOf(v?.uid) !== -1,
+            activeUids.indexOf(v?.uid) !== -1,
         ),
       ).length,
     );
   }, [defaultContent]);
 
   React.useEffect(() => {
-    // If its not a convo ai project and
-    // the platform is web execute the window listeners
-    if (!$config.ENABLE_CONVERSATIONAL_AI && isWebInternal()) {
+    if (!$config.ENABLE_CONVERSATIONAL_AI) {
       const handBrowserClose = ev => {
         ev.preventDefault();
         return (ev.returnValue = 'Are you sure you want to exit?');
       };
       const logoutRtm = () => {
-        try {
-          if (engine.current && RTMEngine.getInstance().channelUid) {
-            // First unsubscribe from channel (like v1.5x leaveChannel)
-            engine.current.unsubscribe(RTMEngine.getInstance().channelUid);
-            // Then logout
-            engine.current.logout();
-          }
-        } catch (error) {
-          console.error('Error during browser close RTM cleanup:', error);
-        }
+        engine.current.leaveChannel(rtcProps.channel);
       };
 
-      // Set up window listeners
+      if (!isWebInternal()) return;
       window.addEventListener(
         'beforeunload',
         isWeb() && !isSDK() ? handBrowserClose : () => {},
       );
 
       window.addEventListener('pagehide', logoutRtm);
+      // cleanup this component
       return () => {
-        // Remove listeners on unmount
         window.removeEventListener(
           'beforeunload',
           isWeb() && !isSDK() ? handBrowserClose : () => {},
@@ -182,303 +141,23 @@ const RtmConfigure = (props: any) => {
     }
   }, []);
 
-  const init = async (rtcUid: UidType) => {
-    //on sdk due to multiple re-render we are getting rtm error code 8
-    //you are joining the same channel too frequently, exceeding the allowed rate of joining the same channel multiple times within a short period
-    //so checking rtm connection state before proceed
-
-    // Check if already connected (equivalent to v1.5x connectionState === 'CONNECTED')
-    if (
-      rtmConnectionState === nativeLinkStateMapping.CONNECTED &&
-      RTMEngine.getInstance().isEngineReady
-    ) {
-      logger.log(
-        LogSource.AgoraSDK,
-        'Log',
-        '🚫 RTM already connected, skipping initialization',
-      );
-      return;
-    }
-
-    try {
-      if (!RTMEngine.getInstance().isEngineReady) {
-        RTMEngine.getInstance().setLocalUID(rtcUid);
-        logger.log(LogSource.AgoraSDK, 'API', 'RTM local Uid set', rtcUid);
-      }
-      engine.current = RTMEngine.getInstance().engine;
-      // Logout any opened sessions if any
-      engine.current.logout();
-      logger.log(LogSource.AgoraSDK, 'Log', 'RTM client creation done');
-    } catch (error) {
-      logger.error(
-        LogSource.AgoraSDK,
-        'Log',
-        'RTM engine initialization failed:',
-        {error},
-      );
-      throw error;
-    }
-
-    engine.current.addEventListener(
-      'linkState',
-      async (data: LinkStateEvent) => {
-        // Update connection state for duplicate initialization prevention
-        setRtmConnectionState(data.currentState);
-        logger.log(
-          LogSource.AgoraSDK,
-          'Event',
-          `RTM linkState changed: ${data.previousState} -> ${data.currentState}`,
-          data,
-        );
-        if (data.currentState === nativeLinkStateMapping.CONNECTED) {
-          // CONNECTED state
-          logger.log(LogSource.AgoraSDK, 'Event', 'RTM connected', {
-            previousState: data.previousState,
-            currentState: data.currentState,
-          });
-        }
-        if (data.currentState === nativeLinkStateMapping.FAILED) {
-          // FAILED state
-          logger.error(LogSource.AgoraSDK, 'Event', 'RTM connection failed', {
-            error: {
-              reasonCode: data.reasonCode,
-              currentState: data.currentState,
-            },
-          });
-        }
-      },
-    );
-
-    engine.current.addEventListener('storage', (storage: StorageEvent) => {
-      // when remote user sets/updates metadata - 3
-      if (
-        storage.eventType === nativeStorageEventTypeMapping.SET ||
-        storage.eventType === nativeStorageEventTypeMapping.UPDATE
-      ) {
-        const storageTypeStr = storage.storageType === 1 ? 'user' : 'channel';
-        const eventTypeStr = storage.eventType === 2 ? 'SET' : 'UPDATE';
-        logger.log(
-          LogSource.AgoraSDK,
-          'Event',
-          `RTM storage event of type: [${eventTypeStr} ${storageTypeStr} metadata]`,
-          storage,
-        );
-        try {
-          if (storage.data?.items && Array.isArray(storage.data.items)) {
-            storage.data.items.forEach(item => {
-              try {
-                if (!item || !item.key) {
-                  logger.warn(
-                    LogSource.Events,
-                    'CUSTOM_EVENTS',
-                    'Invalid storage item:',
-                    item,
-                  );
-                  return;
-                }
-
-                const {key, value, authorUserId, updateTs} = item;
-                const timestamp = getMessageTime(updateTs);
-                const sender = Platform.OS
-                  ? get32BitUid(authorUserId)
-                  : parseInt(authorUserId, 10);
-                eventDispatcher(
-                  {
-                    evt: key,
-                    value,
-                  },
-                  `${sender}`,
-                  timestamp,
-                );
-              } catch (error) {
-                logger.error(
-                  LogSource.Events,
-                  'CUSTOM_EVENTS',
-                  `Failed to process storage item: ${JSON.stringify(item)}`,
-                  {error},
-                );
-              }
-            });
-          }
-        } catch (error) {
-          logger.error(
-            LogSource.Events,
-            'CUSTOM_EVENTS',
-            'error while dispatching through eventDispatcher',
-            {error},
-          );
-        }
-      }
-    });
-
-    engine.current.addEventListener(
-      'presence',
-      async (presence: PresenceEvent) => {
-        if (`${localUid}` === presence.publisher) {
-          return;
-        }
-        // remoteJoinChannel
-        if (presence.type === nativePresenceEventTypeMapping.REMOTE_JOIN) {
-          logger.log(
-            LogSource.AgoraSDK,
-            'Event',
-            'RTM presenceEvent of type [3 - remoteJoin] (channelMemberJoined)',
-          );
-          const backoffAttributes = await fetchUserAttributesWithBackoffRetry(
-            presence.publisher,
-          );
-          await processUserUidAttributes(backoffAttributes, presence.publisher);
-        }
-        // remoteLeaveChannel
-        if (presence.type === nativePresenceEventTypeMapping.REMOTE_LEAVE) {
-          logger.log(
-            LogSource.AgoraSDK,
-            'Event',
-            'RTM presenceEvent of type [4 - remoteLeave] (channelMemberLeft)',
-            presence,
-          );
-          // Chat of left user becomes undefined. So don't cleanup
-          const uid = presence?.publisher
-            ? parseInt(presence.publisher, 10)
-            : undefined;
-
-          if (!uid) {
-            return;
-          }
-          SDKEvents.emit('_rtm-left', uid);
-          // updating the rtc data
-          updateRenderListState(uid, {
-            offline: true,
-          });
-        }
-      },
-    );
-
-    engine.current.addEventListener('message', (message: MessageEvent) => {
-      if (`${localUid}` === message.publisher) {
-        return;
-      }
-      // message - 1 (channel)
-      if (message.channelType === nativeChannelTypeMapping.MESSAGE) {
-        logger.debug(
-          LogSource.Events,
-          'CUSTOM_EVENTS',
-          'messageEvent of type [1 - CHANNEL] (channelMessageReceived)',
-          message,
-        );
-        const {
-          publisher: uid,
-          channelName: channelId,
-          message: text,
-          timestamp: ts,
-        } = message;
-        //whiteboard upload
-        if (parseInt(uid, 10) === 1010101) {
-          const [err, res] = safeJsonParse(text);
-          if (err) {
-            logger.error(
-              LogSource.Events,
-              'CUSTOM_EVENTS',
-              'JSON payload incorrect, Error while parsing the payload',
-              {error: err},
-            );
-          }
-          if (res?.data?.data?.images) {
-            LocalEventEmitter.emit(
-              LocalEventsEnum.WHITEBOARD_FILE_UPLOAD,
-              res?.data?.data?.images,
-            );
-          }
-        } else {
-          const [err, msg] = safeJsonParse(text);
-          if (err) {
-            logger.error(
-              LogSource.Events,
-              'CUSTOM_EVENTS',
-              'JSON payload incorrect, Error while parsing the payload',
-              {error: err},
-            );
-          }
-
-          const timestamp = getMessageTime(ts);
-          const sender = Platform.OS ? get32BitUid(uid) : parseInt(uid, 10);
-
-          if (channelId === rtcProps.channel) {
-            try {
-              eventDispatcher(msg, `${sender}`, timestamp);
-            } catch (error) {
-              logger.error(
-                LogSource.Events,
-                'CUSTOM_EVENTS',
-                'error while dispatching through eventDispatcher',
-                {error},
-              );
-            }
-          }
-        }
-      }
-
-      // message - 3 (user)
-      if (message.channelType === nativeChannelTypeMapping.USER) {
-        logger.debug(
-          LogSource.Events,
-          'CUSTOM_EVENTS',
-          'messageEvent of type [3- USER] (messageReceived)',
-          message,
-        );
-        const {publisher: peerId, timestamp: ts, message: text} = message;
-        const [err, msg] = safeJsonParse(text);
-        if (err) {
-          logger.error(
-            LogSource.Events,
-            'CUSTOM_EVENTS',
-            'JSON payload incorrect, Error while parsing the payload',
-            {error: err},
-          );
-        }
-
-        const timestamp = getMessageTime(ts);
-
-        const sender = isAndroid() ? get32BitUid(peerId) : parseInt(peerId, 10);
-
-        try {
-          eventDispatcher(msg, `${sender}`, timestamp);
-        } catch (error) {
-          logger.error(
-            LogSource.Events,
-            'CUSTOM_EVENTS',
-            'error while dispatching through eventDispatcher',
-            {error},
-          );
-        }
-      }
-    });
-
-    await doLoginAndSetupRTM();
-  };
-
   const doLoginAndSetupRTM = async () => {
     try {
       logger.log(LogSource.AgoraSDK, 'API', 'RTM login starts');
       await engine.current.login({
-        // @ts-ignore
+        uid: localUid.toString(),
         token: rtcProps.rtm,
       });
       logger.log(LogSource.AgoraSDK, 'API', 'RTM login done');
+      RTMEngine.getInstance().setLocalUID(localUid.toString());
+      logger.log(LogSource.AgoraSDK, 'API', 'RTM local Uid set');
       timerValueRef.current = 5;
-      // waiting for login to be fully connected
-      await new Promise(resolve => setTimeout(resolve, 500));
       await setAttribute();
+      logger.log(LogSource.AgoraSDK, 'Log', 'RTM setting attribute done');
     } catch (error) {
-      logger.error(
-        LogSource.AgoraSDK,
-        'Log',
-        'RTM login failed..Trying again',
-        {error},
-      );
+      logger.error(LogSource.AgoraSDK, 'Log', 'RTM login failed..Trying again');
       setTimeout(async () => {
-        // Cap the timer to prevent excessive delays (max 30 seconds)
-        timerValueRef.current = Math.min(timerValueRef.current * 2, 30);
+        timerValueRef.current = timerValueRef.current + timerValueRef.current;
         doLoginAndSetupRTM();
       }, timerValueRef.current * 1000);
     }
@@ -490,13 +169,7 @@ const RtmConfigure = (props: any) => {
       {key: 'isHost', value: String(isHostRef.current.isHost)},
     ];
     try {
-      const data: Metadata = {
-        items: rtmAttributes,
-      };
-      const options: SetOrUpdateUserMetadataOptions = {
-        userId: `${localUid}`,
-      };
-      await engine.current.storage.setUserMetadata(data, options);
+      await engine.current.setLocalUserAttributes(rtmAttributes);
       logger.log(
         LogSource.AgoraSDK,
         'API',
@@ -506,15 +179,10 @@ const RtmConfigure = (props: any) => {
         },
       );
       timerValueRef.current = 5;
-      await subscribeChannel();
-      logger.log(
-        LogSource.AgoraSDK,
-        'Log',
-        'RTM subscribe, fetch members, reading channel atrributes all done',
-        {
-          data: rtmAttributes,
-        },
-      );
+      await joinChannel();
+      logger.log(LogSource.AgoraSDK, 'Log', 'RTM join channel done', {
+        data: rtmAttributes,
+      });
       setHasUserJoinedRTM(true);
       await runQueuedEvents();
       setIsInitialQueueCompleted(true);
@@ -531,138 +199,184 @@ const RtmConfigure = (props: any) => {
         LogSource.AgoraSDK,
         'Log',
         'RTM setAttribute failed..Trying again',
-        {error},
       );
       setTimeout(async () => {
-        // Cap the timer to prevent excessive delays (max 30 seconds)
-        timerValueRef.current = Math.min(timerValueRef.current * 2, 30);
+        timerValueRef.current = timerValueRef.current + timerValueRef.current;
         setAttribute();
       }, timerValueRef.current * 1000);
     }
   };
 
-  const subscribeChannel = async () => {
+  const joinChannel = async () => {
     try {
-      if (RTMEngine.getInstance().channelUid === rtcProps.channel) {
-        logger.debug(
-          LogSource.AgoraSDK,
-          'Log',
-          '🚫  RTM already subscribed channel skipping',
-          rtcProps.channel,
-        );
-      } else {
-        await engine.current.subscribe(rtcProps.channel, {
-          withMessage: true,
-          withPresence: true,
-          withMetadata: true,
-          withLock: false,
-        });
-        logger.log(LogSource.AgoraSDK, 'API', 'RTM subscribeChannel', {
+      if (RTMEngine.getInstance().channelUid !== rtcProps.channel) {
+        await engine.current.joinChannel(rtcProps.channel);
+        logger.log(LogSource.AgoraSDK, 'API', 'RTM joinChannel', {
           data: rtcProps.channel,
         });
-
-        // Set channel ID AFTER successful subscribe (like v1.5x)
         RTMEngine.getInstance().setChannelId(rtcProps.channel);
         logger.log(
           LogSource.AgoraSDK,
           'API',
-          'RTM setChannelId as subscribe is successful',
+          'RTM setChannelId',
           rtcProps.channel,
         );
-
         logger.debug(
           LogSource.SDK,
           'Event',
           'Emitting rtm joined',
           rtcProps.channel,
         );
-        // @ts-ignore
         SDKEvents.emit('_rtm-joined', rtcProps.channel);
-        timerValueRef.current = 5;
-        await getMembers();
-        await readAllChannelAttributes();
-        logger.log(
+      } else {
+        logger.debug(
           LogSource.AgoraSDK,
           'Log',
-          'RTM readAllChannelAttributes and getMembers done',
+          'RTM already joined channel skipping',
+          rtcProps.channel,
         );
       }
+      timerValueRef.current = 5;
+      await getMembers();
+      await readAllChannelAttributes();
+      logger.log(LogSource.AgoraSDK, 'Log', 'RTM getMembers done');
     } catch (error) {
       logger.error(
         LogSource.AgoraSDK,
         'Log',
-        'RTM subscribeChannel failed..Trying again',
-        {error},
+        'RTM joinChannel failed..Trying again',
       );
       setTimeout(async () => {
-        // Cap the timer to prevent excessive delays (max 30 seconds)
-        timerValueRef.current = Math.min(timerValueRef.current * 2, 30);
-        subscribeChannel();
+        timerValueRef.current = timerValueRef.current + timerValueRef.current;
+        joinChannel();
       }, timerValueRef.current * 1000);
     }
   };
 
+  const updateRenderListState = (
+    uid: number,
+    data: Partial<ContentInterface>,
+  ) => {
+    dispatch({type: 'UpdateRenderList', value: [uid, data]});
+  };
+
   const getMembers = async () => {
     try {
       logger.log(
         LogSource.AgoraSDK,
         'API',
-        'RTM presence.getOnlineUsers(getMembers) start',
+        'RTM getChannelMembersByID(getMembers) start',
       );
-      await engine.current.presence
-        .getOnlineUsers(rtcProps.channel, 1)
-        .then(async (data: GetOnlineUsersResponse) => {
+      await engine.current
+        .getChannelMembersBychannelId(rtcProps.channel)
+        .then(async data => {
           logger.log(
             LogSource.AgoraSDK,
             'API',
-            'RTM presence.getOnlineUsers data received',
+            'RTM getChannelMembersByID data received',
             data,
           );
           await Promise.all(
-            data.occupants?.map(async member => {
+            data.members.map(async (member: any) => {
+              const backoffAttributes = backOff(
+                async () => {
+                  logger.log(
+                    LogSource.AgoraSDK,
+                    'API',
+                    `RTM fetching getUserAttributesByUid for member ${member.uid}`,
+                  );
+                  const attr = await engine.current.getUserAttributesByUid(
+                    member.uid,
+                  );
+                  if (!attr || !attr.attributes) {
+                    logger.log(
+                      LogSource.AgoraSDK,
+                      'API',
+                      'RTM attributes for member not found',
+                    );
+                    throw attr;
+                  }
+                  logger.log(
+                    LogSource.AgoraSDK,
+                    'API',
+                    `RTM getUserAttributesByUid for member ${member.uid} received`,
+                    {
+                      attr,
+                    },
+                  );
+                  for (const key in attr.attributes) {
+                    if (
+                      attr.attributes.hasOwnProperty(key) &&
+                      attr.attributes[key]
+                    ) {
+                      return attr;
+                    } else {
+                      throw attr;
+                    }
+                  }
+                },
+                {
+                  retry: (e, idx) => {
+                    logger.debug(
+                      LogSource.AgoraSDK,
+                      'Log',
+                      `[retrying] Attempt ${idx}. Fetching ${member.uid}'s name`,
+                      e,
+                    );
+                    return true;
+                  },
+                },
+              );
               try {
-                const backoffAttributes =
-                  await fetchUserAttributesWithBackoffRetry(member.userId);
+                const attr = await backoffAttributes;
+                console.log('[user attributes]:', {attr});
+                //RTC layer uid type is number. so doing the parseInt to convert to number
+                //todo hari check android uid comparsion
+                const uid = parseInt(member.uid);
+                const screenUid = parseInt(attr?.attributes?.screenUid);
+                //start - updating user data in rtc
+                const userData = {
+                  screenUid: screenUid,
+                  //below thing for livestreaming
+                  type: uid === parseInt(RECORDING_BOT_UID) ? 'bot' : 'rtc',
+                  uid,
+                  offline: false,
+                  isHost: attr?.attributes?.isHost,
+                  lastMessageTimeStamp: 0,
+                };
+                updateRenderListState(uid, userData);
+                //end- updating user data in rtc
 
-                await processUserUidAttributes(
-                  backoffAttributes,
-                  member.userId,
-                );
+                //start - updating screenshare data in rtc
+                const screenShareUser = {
+                  type: UserType.ScreenShare,
+                  parentUid: uid,
+                };
+                updateRenderListState(screenUid, screenShareUser);
+                //end - updating screenshare data in rtc
                 // setting screenshare data
                 // name of the screenUid, isActive: false, (when the user starts screensharing it becomes true)
                 // isActive to identify all active screenshare users in the call
-                backoffAttributes?.items?.forEach(item => {
-                  try {
-                    if (hasJsonStructure(item.value as string)) {
-                      const data = {
-                        evt: item.key, // Use item.key instead of key
-                        value: item.value, // Use item.value instead of value
-                      };
-                      // TODOSUP: Add the data to queue, dont add same mulitple events, use set so as to not repeat events
-                      EventsQueue.enqueue({
-                        data: data,
-                        uid: member.userId,
-                        ts: timeNow(),
-                      });
-                    }
-                  } catch (error) {
-                    logger.error(
-                      LogSource.AgoraSDK,
-                      'Log',
-                      `RTM Failed to process user attribute item for ${
-                        member.userId
-                      }: ${JSON.stringify(item)}`,
-                      {error},
-                    );
-                    // Continue processing other items
+                for (const [key, value] of Object.entries(attr?.attributes)) {
+                  if (hasJsonStructure(value as string)) {
+                    const data = {
+                      evt: key,
+                      value: value,
+                    };
+                    // TODOSUP: Add the data to queue, dont add same mulitple events, use set so as to not repeat events
+                    EventsQueue.enqueue({
+                      data: data,
+                      uid: member.uid,
+                      ts: timeNow(),
+                    });
                   }
-                });
+                }
               } catch (e) {
                 logger.error(
                   LogSource.AgoraSDK,
                   'Log',
-                  `RTM Could not retrieve name of ${member.userId}`,
-                  {error: e},
+                  `Could not retrieve name of ${member.uid}`,
+                  e,
                 );
               }
             }),
@@ -676,8 +390,7 @@ const RtmConfigure = (props: any) => {
       timerValueRef.current = 5;
     } catch (error) {
       setTimeout(async () => {
-        // Cap the timer to prevent excessive delays (max 30 seconds)
-        timerValueRef.current = Math.min(timerValueRef.current * 2, 30);
+        timerValueRef.current = timerValueRef.current + timerValueRef.current;
         await getMembers();
       }, timerValueRef.current * 1000);
     }
@@ -685,169 +398,286 @@ const RtmConfigure = (props: any) => {
 
   const readAllChannelAttributes = async () => {
     try {
-      await engine.current.storage
-        .getChannelMetadata(rtcProps.channel, 1)
-        .then(async (data: GetChannelMetadataResponse) => {
-          for (const item of data.items) {
-            try {
-              const {key, value, authorUserId, updateTs} = item;
-              if (hasJsonStructure(value as string)) {
-                const evtData = {
-                  evt: key,
-                  value,
-                };
-                // TODOSUP: Add the data to queue, dont add same mulitple events, use set so as to not repeat events
-                EventsQueue.enqueue({
-                  data: evtData,
-                  uid: authorUserId,
-                  ts: updateTs,
-                });
-              }
-            } catch (error) {
-              logger.error(
-                LogSource.AgoraSDK,
-                'Log',
-                `RTM Failed to process channel attribute item: ${JSON.stringify(
-                  item,
-                )}`,
-                {error},
-              );
-              // Continue processing other items
+      await engine.current
+        .getChannelAttributes(rtcProps.channel)
+        .then(async data => {
+          for (const item of data) {
+            const {key, value, lastUpdateTs, lastUpdateUserId} = item;
+            if (hasJsonStructure(value as string)) {
+              const evtData = {
+                evt: key,
+                value,
+              };
+              // TODOSUP: Add the data to queue, dont add same mulitple events, use set so as to not repeat events
+              EventsQueue.enqueue({
+                data: evtData,
+                uid: lastUpdateUserId,
+                ts: lastUpdateTs,
+              });
             }
           }
           logger.log(
             LogSource.AgoraSDK,
             'API',
-            'RTM storage.getChannelMetadata data received',
+            'RTM getChannelAttributes data received',
             data,
           );
         });
       timerValueRef.current = 5;
     } catch (error) {
       setTimeout(async () => {
-        // Cap the timer to prevent excessive delays (max 30 seconds)
-        timerValueRef.current = Math.min(timerValueRef.current * 2, 30);
+        timerValueRef.current = timerValueRef.current + timerValueRef.current;
         await readAllChannelAttributes();
       }, timerValueRef.current * 1000);
     }
   };
 
-  const fetchUserAttributesWithBackoffRetry = async (
-    userId: string,
-  ): Promise<GetUserMetadataResponse> => {
-    return backOff(
-      async () => {
-        logger.log(
-          LogSource.AgoraSDK,
-          'API',
-          `RTM fetching getUserMetadata for member ${userId}`,
-        );
-
-        const attr: GetUserMetadataResponse =
-          await engine.current.storage.getUserMetadata({
-            userId: userId,
-          });
+  const init = async () => {
+    //on sdk due to multiple re-render we are getting rtm error code 8
+    //you are joining the same channel too frequently, exceeding the allowed rate of joining the same channel multiple times within a short period
+    //so checking rtm connection state before proceed
+    if (engine?.current?.client?.connectionState === 'CONNECTED') {
+      return;
+    }
+    logger.log(LogSource.AgoraSDK, 'Log', 'RTM creating engine...');
+    engine.current = RTMEngine.getInstance().engine;
+    RTMEngine.getInstance();
+    logger.log(LogSource.AgoraSDK, 'Log', 'RTM engine creation done');
 
-        if (!attr || !attr.items) {
+    engine.current.on('connectionStateChanged', (evt: any) => {
+      //console.log(evt);
+    });
+    engine.current.on('error', (evt: any) => {
+      // console.log(evt);
+    });
+    engine.current.on('channelMemberJoined', (data: any) => {
+      logger.log(LogSource.AgoraSDK, 'Event', 'channelMemberJoined', data);
+      const backoffAttributes = backOff(
+        async () => {
+          logger.log(
+            LogSource.AgoraSDK,
+            'API',
+            `RTM fetching getUserAttributesByUid for member ${data.uid}`,
+          );
+          const attr = await engine.current.getUserAttributesByUid(data.uid);
+          if (!attr || !attr.attributes) {
+            logger.log(
+              LogSource.AgoraSDK,
+              'API',
+              'RTM attributes for member not found',
+            );
+            throw attr;
+          }
           logger.log(
             LogSource.AgoraSDK,
             'API',
-            'RTM attributes for member not found',
+            `RTM getUserAttributesByUid for member ${data.uid} received`,
+            {
+              attr,
+            },
+          );
+          for (const key in attr.attributes) {
+            if (attr.attributes.hasOwnProperty(key) && attr.attributes[key]) {
+              return attr;
+            } else {
+              throw attr;
+            }
+          }
+        },
+        {
+          retry: (e, idx) => {
+            logger.debug(
+              LogSource.AgoraSDK,
+              'Log',
+              `[retrying] Attempt ${idx}. Fetching ${data.uid}'s name`,
+              e,
+            );
+            return true;
+          },
+        },
+      );
+      async function getname() {
+        try {
+          const attr = await backoffAttributes;
+          console.log('[user attributes]:', {attr});
+          const uid = parseInt(data.uid);
+          const screenUid = parseInt(attr?.attributes?.screenUid);
+
+          //start - updating user data in rtc
+          const userData = {
+            screenUid: screenUid,
+            //below thing for livestreaming
+            type: uid === parseInt(RECORDING_BOT_UID) ? 'bot' : 'rtc',
+            uid,
+            offline: false,
+            lastMessageTimeStamp: 0,
+            isHost: attr?.attributes?.isHost,
+          };
+          updateRenderListState(uid, userData);
+          //end- updating user data in rtc
+
+          //start - updating screenshare data in rtc
+          const screenShareUser = {
+            type: UserType.ScreenShare,
+            parentUid: uid,
+          };
+          updateRenderListState(screenUid, screenShareUser);
+          //end - updating screenshare data in rtc
+        } catch (e) {
+          logger.error(
+            LogSource.AgoraSDK,
+            'Event',
+            `Failed to retrive name of ${data.uid}`,
+            e,
           );
-          throw attr;
         }
+      }
+      getname();
+    });
 
-        logger.log(
-          LogSource.AgoraSDK,
-          'API',
-          `RTM getUserMetadata for member ${userId} received`,
-          {attr},
-        );
+    engine.current.on('channelMemberLeft', (data: any) => {
+      logger.debug(LogSource.AgoraSDK, 'Event', 'channelMemberLeft', data);
+      // Chat of left user becomes undefined. So don't cleanup
+      const uid = data?.uid ? parseInt(data?.uid) : undefined;
+      if (!uid) return;
+      SDKEvents.emit('_rtm-left', uid);
+      // updating the rtc data
+      updateRenderListState(uid, {
+        offline: true,
+      });
+    });
 
-        if (attr.items && attr.items.length > 0) {
-          return attr;
-        } else {
-          throw attr;
-        }
-      },
-      {
-        retry: (e, idx) => {
-          logger.debug(
-            LogSource.AgoraSDK,
-            'Log',
-            `RTM [retrying] Attempt ${idx}. Fetching ${userId}'s attributes`,
-            e,
+    engine.current.addListener(
+      'ChannelAttributesUpdated',
+      (attributeList: RtmChannelAttribute[]) => {
+        try {
+          attributeList.map((attribute: RtmChannelAttribute) => {
+            const {key, value, lastUpdateTs, lastUpdateUserId} = attribute;
+            const timestamp = getMessageTime(lastUpdateTs);
+            const sender = Platform.OS
+              ? get32BitUid(lastUpdateUserId)
+              : parseInt(lastUpdateUserId);
+            eventDispatcher(
+              {
+                evt: key,
+                value,
+              },
+              sender,
+              timestamp,
+            );
+          });
+        } catch (error) {
+          logger.error(
+            LogSource.Events,
+            'CUSTOM_EVENTS',
+            'error while dispatching through eventDispatcher',
+            error,
           );
-          return true;
-        },
+        }
       },
     );
-  };
 
-  const processUserUidAttributes = async (
-    attr: GetUserMetadataResponse,
-    userId: string,
-  ) => {
-    try {
-      console.log('[user attributes]:', {attr});
-      const uid = parseInt(userId, 10);
-      const screenUidItem = attr?.items?.find(item => item.key === 'screenUid');
-      const isHostItem = attr?.items?.find(item => item.key === 'isHost');
-      const screenUid = screenUidItem?.value
-        ? parseInt(screenUidItem.value, 10)
-        : undefined;
+    engine.current.on('messageReceived', (evt: any) => {
+      logger.debug(LogSource.Events, 'CUSTOM_EVENTS', 'messageReceived', evt);
+      const {peerId, ts, text} = evt;
+      const [err, msg] = safeJsonParse(text);
+      if (err) {
+        logger.error(
+          LogSource.Events,
+          'CUSTOM_EVENTS',
+          'JSON payload incorrect, Error while parsing the payload',
+          err,
+        );
+      }
 
-      //start - updating user data in rtc
-      const userData = {
-        screenUid: screenUid,
-        //below thing for livestreaming
-        type: uid === parseInt(RECORDING_BOT_UID, 10) ? 'bot' : 'rtc',
-        uid,
-        offline: false,
-        isHost: isHostItem?.value || false,
-        lastMessageTimeStamp: 0,
-      };
-      updateRenderListState(uid, userData);
-      //end- updating user data in rtc
+      const timestamp = getMessageTime(ts);
 
-      //start - updating screenshare data in rtc
-      if (screenUid) {
-        const screenShareUser = {
-          type: UserType.ScreenShare,
-          parentUid: uid,
-        };
-        updateRenderListState(screenUid, screenShareUser);
+      const sender = isAndroid() ? get32BitUid(peerId) : parseInt(peerId);
+
+      try {
+        eventDispatcher(msg, sender, timestamp);
+      } catch (error) {
+        logger.error(
+          LogSource.Events,
+          'CUSTOM_EVENTS',
+          'error while dispatching through eventDispatcher',
+          err,
+        );
       }
-      //end - updating screenshare data in rtc
-    } catch (e) {
-      logger.error(
-        LogSource.AgoraSDK,
-        'Event',
-        `RTM Failed to process user data for ${userId}`,
-        {error: e},
+    });
+
+    engine.current.on('channelMessageReceived', evt => {
+      logger.debug(
+        LogSource.Events,
+        'CUSTOM_EVENTS',
+        'channelMessageReceived',
+        evt,
       );
-    }
-  };
 
-  const updateRenderListState = (
-    uid: number,
-    data: Partial<ContentInterface>,
-  ) => {
-    dispatch({type: 'UpdateRenderList', value: [uid, data]});
+      const {uid, channelId, text, ts} = evt;
+      //whiteboard upload
+      if (uid == 1010101) {
+        const [err, res] = safeJsonParse(text);
+        if (err) {
+          logger.error(
+            LogSource.Events,
+            'CUSTOM_EVENTS',
+            'JSON payload incorrect, Error while parsing the payload',
+            err,
+          );
+        }
+
+        if (res?.data?.data?.images) {
+          LocalEventEmitter.emit(
+            LocalEventsEnum.WHITEBOARD_FILE_UPLOAD,
+            res?.data?.data?.images,
+          );
+        }
+      } else {
+        const [err, msg] = safeJsonParse(text);
+        if (err) {
+          logger.error(
+            LogSource.Events,
+            'CUSTOM_EVENTS',
+            'JSON payload incorrect, Error while parsing the payload',
+            err,
+          );
+        }
+
+        const timestamp = getMessageTime(ts);
+
+        const sender = Platform.OS ? get32BitUid(uid) : parseInt(uid);
+
+        if (channelId === rtcProps.channel) {
+          try {
+            eventDispatcher(msg, sender, timestamp);
+          } catch (error) {
+            logger.error(
+              LogSource.Events,
+              'CUSTOM_EVENTS',
+              'error while dispatching through eventDispatcher',
+              error,
+            );
+          }
+        }
+      }
+    });
+
+    await doLoginAndSetupRTM();
   };
 
   const runQueuedEvents = async () => {
     try {
       while (!EventsQueue.isEmpty()) {
         const currEvt = EventsQueue.dequeue();
-        await eventDispatcher(currEvt.data, `${currEvt.uid}`, currEvt.ts);
+        await eventDispatcher(currEvt.data, currEvt.uid, currEvt.ts);
       }
     } catch (error) {
       logger.error(
         LogSource.Events,
         'CUSTOM_EVENTS',
         'error while running queue events',
-        {error},
+        error,
       );
     }
   };
@@ -856,13 +686,11 @@ const RtmConfigure = (props: any) => {
     data: {
       evt: string;
       value: string;
-      feat?: string;
-      etyp?: string;
     },
     sender: string,
     ts: number,
   ) => {
-    console.log(
+    console.debug(
       LogSource.Events,
       'CUSTOM_EVENTS',
       'inside eventDispatcher ',
@@ -870,10 +698,10 @@ const RtmConfigure = (props: any) => {
     );
 
     let evt = '',
-      value = '';
+      value = {};
 
-    if (data?.feat === 'WAITING_ROOM') {
-      if (data?.etyp === 'REQUEST') {
+    if (data.feat === 'WAITING_ROOM') {
+      if (data.etyp === 'REQUEST') {
         const outputData = {
           evt: `${data.feat}_${data.etyp}`,
           payload: JSON.stringify({
@@ -887,7 +715,7 @@ const RtmConfigure = (props: any) => {
         evt = data.feat + '_' + data.etyp; //rename if client side RTM meessage is to be sent for approval
         value = formattedData;
       }
-      if (data?.etyp === 'RESPONSE') {
+      if (data.etyp === 'RESPONSE') {
         const outputData = {
           evt: `${data.feat}_${data.etyp}`,
           payload: JSON.stringify({
@@ -928,65 +756,32 @@ const RtmConfigure = (props: any) => {
     }
 
     try {
-      let parsedValue;
-      try {
-        parsedValue = typeof value === 'string' ? JSON.parse(value) : value;
-      } catch (error) {
-        logger.error(
-          LogSource.Events,
-          'CUSTOM_EVENTS',
-          'RTM Failed to parse event value in event dispatcher:',
-          {error},
-        );
-        return;
-      }
-      const {payload, persistLevel, source} = parsedValue;
+      const {payload, persistLevel, source} = JSON.parse(value);
       // Step 1: Set local attributes
       if (persistLevel === PersistanceLevel.Session) {
         const rtmAttribute = {key: evt, value: value};
-        const options: SetOrUpdateUserMetadataOptions = {
-          userId: `${localUid}`,
-        };
-        await engine.current.storage.setUserMetadata(
-          {
-            items: [rtmAttribute],
-          },
-          options,
-        );
+        await engine.current.addOrUpdateLocalUserAttributes([rtmAttribute]);
       }
       // Step 2: Emit the event
-      console.log(LogSource.Events, 'CUSTOM_EVENTS', 'emiting event..: ');
+      console.debug(LogSource.Events, 'CUSTOM_EVENTS', 'emiting event..: ');
       EventUtils.emitEvent(evt, source, {payload, persistLevel, sender, ts});
       // Because async gets evaluated in a different order when in an sdk
       if (evt === 'name') {
-        // 1. Cancel existing timeout for this sender
-        if (eventTimeouts.has(sender)) {
-          clearTimeout(eventTimeouts.get(sender)!);
-        }
-        // 2. Create new timeout with tracking
-        const timeout = setTimeout(() => {
-          // 3. Guard against unmounted component
-          if (!isRTMMounted.current) {
-            return;
-          }
+        setTimeout(() => {
           EventUtils.emitEvent(evt, source, {
             payload,
             persistLevel,
             sender,
             ts,
           });
-          // 4. Clean up after execution
-          eventTimeouts.delete(sender);
         }, 200);
-        // 5. Track the timeout for cleanup
-        eventTimeouts.set(sender, timeout);
       }
     } catch (error) {
       console.error(
         LogSource.Events,
         'CUSTOM_EVENTS',
         'error while emiting event:',
-        {error},
+        error,
       );
     }
   };
@@ -995,58 +790,45 @@ const RtmConfigure = (props: any) => {
     if (!callActive) {
       return;
     }
-    // Destroy and clean up RTM state
     await RTMEngine.getInstance().destroy();
-    // Set the engine as null
-    engine.current = null;
     logger.log(LogSource.AgoraSDK, 'API', 'RTM destroy done');
     if (isIOS() || isAndroid()) {
       EventUtils.clear();
     }
     setHasUserJoinedRTM(false);
-    setIsInitialQueueCompleted(false);
     logger.debug(LogSource.AgoraSDK, 'Log', 'RTM cleanup done');
   };
 
   useAsyncEffect(async () => {
     //waiting room attendee -> rtm login will happen on page load
-    try {
-      if ($config.ENABLE_WAITING_ROOM) {
-        //attendee
-        //for waiting room attendee rtm login will happen on mount
-        if (!isHost && !callActive) {
-          await init(localUid);
-        }
-        //host
-        if (
-          isHost &&
-          ($config.AUTO_CONNECT_RTM ||
-            (!$config.AUTO_CONNECT_RTM && callActive))
-        ) {
-          await init(localUid);
-        }
-      } else {
-        //non waiting room case
-        //host and attendee
-        if (
-          $config.AUTO_CONNECT_RTM ||
-          (!$config.AUTO_CONNECT_RTM && callActive)
-        ) {
-          await init(localUid);
-        }
+    if ($config.ENABLE_WAITING_ROOM) {
+      //attendee
+      //for waiting room attendee rtm login will happen on mount
+      if (!isHost && !callActive) {
+        await init();
+      }
+      //host
+      if (
+        isHost &&
+        ($config.AUTO_CONNECT_RTM || (!$config.AUTO_CONNECT_RTM && callActive))
+      ) {
+        await init();
+      }
+    } else {
+      //non waiting room case
+      //host and attendee
+      if (
+        $config.AUTO_CONNECT_RTM ||
+        (!$config.AUTO_CONNECT_RTM && callActive)
+      ) {
+        await init();
       }
-    } catch (error) {
-      logger.error(LogSource.AgoraSDK, 'Log', 'RTM init failed', {error});
     }
     return async () => {
-      logger.log(
-        LogSource.AgoraSDK,
-        'Log',
-        'RTM unmounting calling end(destroy) ',
-      );
       await end();
     };
-  }, [rtcProps.channel, rtcProps.appId, callActive, localUid]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [rtcProps.channel, rtcProps.appId, callActive]);
 
   return (
     <ChatContext.Provider