agora-appbuilder-core 2.2.0 → 2.3.0-beta.2

package/template/src/components/RTMConfigure.tsx

@@ -9,38 +9,35 @@
  information visit https://appbuilder.agora.io. 
 *********************************************
 */
+// @ts-nocheck
 import React, {useState, useContext, useEffect, useRef} from 'react';
-import RtmEngine, {
-  RtmChannelAttribute,
-  RtmAttribute,
-} from 'agora-react-native-rtm';
-import {ClientRole, PropsContext} from '../../agora-rn-uikit';
+import RtmEngine, {RtmAttribute} from 'agora-react-native-rtm';
+import {PropsContext, useLocalUid} from '../../agora-rn-uikit';
 import ChatContext, {controlMessageEnum} from './ChatContext';
 import {RtcContext} from '../../agora-rn-uikit';
-import {
-  messageStoreInterface,
-  messageChannelType,
-  messageSourceType,
-  messageActionType,
-  attrRequestTypes,
-} from './ChatContext';
+import {messageSourceType, messageActionType} from './ChatContext';
 import {Platform} from 'react-native';
 import {backOff} from 'exponential-backoff';
-import events from './RTMEvents';
+import {useString} from '../utils/useString';
+import {isAndroid, isWeb} from '../utils/common';
+import StorageContext from './StorageContext';
+import {useRenderContext} from 'fpe-api';
+import {
+  safeJsonParse,
+  timeNow,
+  hasJsonStructure,
+  getMessageTime,
+  get32BitUid,
+  adjustUID,
+} from '../rtm/utils';
+import {EventUtils, EventsQueue, eventMessageType} from '../rtm-events';
+import RTMEngine from '../rtm/RTMEngine';
 import {filterObject} from '../utils';
 
 export enum UserType {
-  Normal,
-  ScreenShare,
+  ScreenShare = 'screenshare',
 }
 
-const adjustUID = (number: number) => {
-  if (number < 0) {
-    number = 0xffffffff + number + 1;
-  }
-  return number;
-};
-
 const stringifyPayload = (
   source: messageSourceType,
   type: messageActionType,
@@ -57,45 +54,72 @@ const parsePayload = (data: string) => {
   return JSON.parse(data);
 };
 
-function hasJsonStructure(str: string) {
-  if (typeof str !== 'string') return false;
-  try {
-    const result = JSON.parse(str);
-    const type = Object.prototype.toString.call(result);
-    return type === '[object Object]' || type === '[object Array]';
-  } catch (err) {
-    return false;
-  }
-}
-function safeJsonParse(str: string) {
-  try {
-    return [null, JSON.parse(str)];
-  } catch (err) {
-    return [err];
-  }
-}
-const timeNow = () => new Date().getTime();
-
 const RtmConfigure = (props: any) => {
-  const {setRecordingActive, callActive, name} = props;
+  const localUid = useLocalUid();
+  const {callActive} = props;
   const {rtcProps} = useContext(PropsContext);
   const {RtcEngine, dispatch} = useContext(RtcContext);
-  const [messageStore, setMessageStore] = useState<messageStoreInterface[]>([]);
-  const [privateMessageStore, setPrivateMessageStore] = useState({});
+  const {renderList, renderPosition} = useRenderContext();
+  const renderListRef = useRef({renderList: renderList});
+  const renderPositionRef = useRef({renderPosition: renderPosition});
+
+  /**
+   * inside event callback state won't have latest value.
+   * so creating ref to access the state
+   */
+  useEffect(() => {
+    renderPositionRef.current.renderPosition = renderPosition;
+  }, [renderPosition]);
+
+  useEffect(() => {
+    renderListRef.current.renderList = renderList;
+  }, [renderList]);
+
+  const {store, setStore} = useContext(StorageContext);
+  const getInitialUsername = () =>
+    store?.displayName ? store.displayName : '';
+  const [displayName, setDisplayName] = useState(getInitialUsername());
+
+  //Update the store displayName value if the state is changed
+  useEffect(() => {
+    setStore((prevState) => {
+      return {
+        ...prevState,
+        displayName,
+      };
+    });
+  }, [displayName]);
+
   const [login, setLogin] = useState<boolean>(false);
-  const [userList, setUserList] = useState<{[key: string]: any}>({});
+
+  const [hasUserJoinedRTM, setHasUserJoinedRTM] = useState<boolean>(false);
   const [onlineUsersCount, setTotalOnlineUsers] = useState<number>(0);
 
+  //commented for v1 release
+  // const userText = useString('remoteUserDefaultLabel')();
+  const userText = 'User';
+  const pstnUserLabel = useString('pstnUserLabel')();
+  //commented for v1 release
+  //const getScreenShareName = useString('screenshareUserName');
+  const getScreenShareName = (name: string) => `${name}'s screenshare`;
+
   let engine = useRef<RtmEngine>(null!);
-  let localUid = useRef<string>('');
   const timerValueRef: any = useRef(5);
 
+  React.useEffect(() => {
+    setTotalOnlineUsers(
+      Object.keys(
+        filterObject(renderList, ([k, v]) => v?.type === 'rtc' && !v.offline),
+      ).length,
+    );
+  }, [renderList]);
+
   React.useEffect(() => {
     const handBrowserClose = () => {
       engine.current.leaveChannel(rtcProps.channel);
     };
 
-    if (Platform.OS !== 'web') return;
+    if (!isWeb) return;
     window.addEventListener('beforeunload', handBrowserClose);
     // cleanup this component
     return () => {
@@ -103,52 +127,10 @@ const RtmConfigure = (props: any) => {
     };
   }, []);
 
-  React.useEffect(() => {
-    setTotalOnlineUsers(
-      Object.keys(
-        filterObject(
-          userList,
-          ([k, v]) => v?.type === UserType.Normal && !v.offline,
-        ),
-      ).length,
-    );
-  }, [userList]);
-
-  const addMessageToStore = (uid: string, msg: {body: string; ts: string}) => {
-    setMessageStore((m: messageStoreInterface[]) => {
-      return [...m, {ts: msg.ts, uid: uid, msg: msg.body}];
-    });
-  };
-
-  const addMessageToPrivateStore = (
-    uid: string,
-    msg: {
-      body: string;
-      ts: string;
-    },
-    local: boolean,
-  ) => {
-    setPrivateMessageStore((state: any) => {
-      let newState = {...state};
-      newState[uid] !== undefined
-        ? (newState[uid] = [
-            ...newState[uid],
-            {ts: msg.ts, uid: local ? localUid.current : uid, msg: msg.body},
-          ])
-        : (newState = {
-            ...newState,
-            [uid]: [
-              {ts: msg.ts, uid: local ? localUid.current : uid, msg: msg.body},
-            ],
-          });
-      return {...newState};
-    });
-  };
-
   const doLoginAndSetupRTM = async () => {
     try {
       await engine.current.login({
-        uid: localUid.current,
+        uid: localUid.toString(),
         token: rtcProps.rtm,
       });
       timerValueRef.current = 5;
@@ -162,13 +144,12 @@ const RtmConfigure = (props: any) => {
   };
 
   const setAttribute = async () => {
+    const rtmAttributes = [
+      {key: 'name', value: displayName || userText},
+      {key: 'screenUid', value: String(rtcProps.screenShareUid)},
+    ];
     try {
-      await engine.current.setLocalUserAttributes([
-        {key: 'name', value: name || 'User'},
-        {key: 'screenUid', value: String(rtcProps.screenShareUid)},
-        {key: 'role', value: String(rtcProps?.role)},
-        {key: 'requests', value: attrRequestTypes.none}, // stores Uid who have raised a request
-      ]);
+      await engine.current.setLocalUserAttributes(rtmAttributes);
       timerValueRef.current = 5;
       joinChannel();
     } catch (error) {
@@ -179,19 +160,13 @@ const RtmConfigure = (props: any) => {
     }
   };
 
-  const addOrUpdateLocalUserAttributes = async (attributes: RtmAttribute[]) => {
-    try {
-      await engine.current.addOrUpdateLocalUserAttributes(attributes);
-    } catch (error) {
-      console.log('error while local user addOrUpdateAttributes: ', error);
-    }
-  };
-
   const joinChannel = async () => {
     try {
       await engine.current.joinChannel(rtcProps.channel);
       timerValueRef.current = 5;
-      getMembers();
+      await getMembers();
+      setHasUserJoinedRTM(true);
+      await runQueuedCustomEvents();
     } catch (error) {
       setTimeout(async () => {
         timerValueRef.current = timerValueRef.current + timerValueRef.current;
@@ -200,62 +175,102 @@ const RtmConfigure = (props: any) => {
     }
   };
 
+  const updateRenderListState = (
+    uid: number,
+    data: Partial<RenderInterface>,
+  ) => {
+    dispatch({type: 'UpdateRenderList', value: [uid, data]});
+  };
+
   const getMembers = async () => {
     try {
       await engine.current
         .getChannelMembersBychannelId(rtcProps.channel)
-        .then((data) => {
-          data.members.map(async (member: any) => {
-            const backoffAttributes = backOff(
-              async () => {
-                const attr = await engine.current.getUserAttributesByUid(
-                  member.uid,
-                );
-                if (
-                  attr?.attributes?.name &&
-                  attr?.attributes?.screenUid &&
-                  attr?.attributes?.role &&
-                  attr?.attributes?.requests
-                ) {
-                  return attr;
-                } else {
-                  throw attr;
-                }
-              },
-              {
-                retry: (e, idx) => {
-                  console.log(
-                    `[retrying] Attempt ${idx}. Fetching ${member.uid}'s name`,
-                    e,
+        .then(async (data) => {
+          await Promise.all(
+            data.members.map(async (member: any) => {
+              const backoffAttributes = backOff(
+                async () => {
+                  const attr = await engine.current.getUserAttributesByUid(
+                    member.uid,
                   );
-                  return true;
+                  for (const key in attr.attributes) {
+                    if (
+                      attr.attributes.hasOwnProperty(key) &&
+                      attr.attributes[key]
+                    ) {
+                      return attr;
+                    } else {
+                      throw attr;
+                    }
+                  }
                 },
-              },
-            );
-            try {
-              const attr = await backoffAttributes;
-              console.log('[user attributes]:', {attr});
-              setUserList((prevState) => {
-                return {
-                  ...prevState,
-                  [member.uid]: {
-                    name: attr?.attributes?.name || 'User',
-                    type: UserType.Normal,
-                    role: parseInt(attr?.attributes?.role),
-                    screenUid: parseInt(attr?.attributes?.screenUid),
-                    offline: false,
-                    requests: attr?.attributes?.requests,
-                  },
-                  [parseInt(attr?.attributes?.screenUid)]: {
-                    name: `${attr?.attributes?.name || 'User'}'s screenshare`,
-                    type: UserType.ScreenShare,
+                {
+                  retry: (e, idx) => {
+                    console.log(
+                      `[retrying] Attempt ${idx}. Fetching ${member.uid}'s name`,
+                      e,
+                    );
+                    return true;
                   },
+                },
+              );
+              try {
+                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 = {
+                  name:
+                    String(member.uid)[0] === '1'
+                      ? pstnUserLabel
+                      : attr?.attributes?.name || userText,
+                  screenUid: screenUid,
+                  //below thing for livestreaming
+                  type: 'rtc',
                 };
-              });
-            } catch (e) {
-              console.error(`Could not retrieve name of ${member.uid}`, e);
-            }
-          });
+                updateRenderListState(uid, userData);
+                //end- updating user data in rtc
+
+                //start - updating screenshare data in rtc
+                const screenShareUser = {
+                  name: getScreenShareName(attr?.attributes?.name || userText),
+                  type: UserType.ScreenShare,
+                };
+                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
+                for (const [key, value] of Object.entries(attr?.attributes)) {
+                  if (hasJsonStructure(value as string)) {
+                    const [err, result] = safeJsonParse(value as string);
+                    const payloadValue = result?.value || '';
+                    const payloadAction = result?.action || '';
+                    const data = {
+                      evt: key,
+                      payload: {
+                        ...result,
+                        value: payloadValue,
+                        action: payloadAction,
+                      },
+                    };
+                    // Todo:EVENTSUP 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) {
+                console.error(`Could not retrieve name of ${member.uid}`, e);
+              }
+            }),
+          );
           setLogin(true);
           console.log('RTM init done');
         });
@@ -263,15 +278,15 @@ const RtmConfigure = (props: any) => {
     } catch (error) {
       setTimeout(async () => {
         timerValueRef.current = timerValueRef.current + timerValueRef.current;
-        getMembers();
+        await getMembers();
       }, timerValueRef.current * 1000);
     }
   };
+
   const init = async () => {
-    engine.current = new RtmEngine();
-    rtcProps.uid
-      ? (localUid.current = rtcProps.uid + '')
-      : (localUid.current = '' + timeNow());
+    engine.current = RTMEngine.getInstance().engine;
+    RTMEngine.getInstance().setLoginInfo(localUid.toString(), rtcProps.channel);
+
     engine.current.on('connectionStateChanged', (evt: any) => {
       //console.log(evt);
     });
@@ -282,15 +297,12 @@ const RtmConfigure = (props: any) => {
       const backoffAttributes = backOff(
         async () => {
           const attr = await engine.current.getUserAttributesByUid(data.uid);
-          if (
-            attr?.attributes?.name &&
-            attr?.attributes?.screenUid &&
-            attr?.attributes?.role &&
-            attr?.attributes?.requests
-          ) {
-            return attr;
-          } else {
-            throw attr;
+          for (const key in attr.attributes) {
+            if (attr.attributes.hasOwnProperty(key) && attr.attributes[key]) {
+              return attr;
+            } else {
+              throw attr;
+            }
           }
         },
         {
@@ -307,23 +319,28 @@ const RtmConfigure = (props: any) => {
         try {
           const attr = await backoffAttributes;
           console.log('[user attributes]:', {attr});
-          setUserList((prevState) => {
-            return {
-              ...prevState,
-              [data.uid]: {
-                name: attr?.attributes?.name || 'User',
-                type: UserType.Normal,
-                role: parseInt(attr?.attributes?.role),
-                screenUid: parseInt(attr?.attributes?.screenUid),
-                offline: false,
-                requests: attr?.attributes?.requests,
-              },
-              [parseInt(attr?.attributes?.screenUid)]: {
-                name: `${attr?.attributes?.name || 'User'}'s screenshare`,
-                type: UserType.ScreenShare,
-              },
-            };
-          });
+          const uid = parseInt(data.uid);
+          const screenUid = parseInt(attr?.attributes?.screenUid);
+          //start - updating user data in rtc
+          const userData = {
+            name:
+              String(data.uid)[0] === '1'
+                ? pstnUserLabel
+                : attr?.attributes?.name || userText,
+            screenUid: screenUid,
+            //below thing for livestreaming
+            type: 'rtc',
+          };
+          updateRenderListState(uid, userData);
+          //end- updating user data in rtc
+
+          //start - updating screenshare data in rtc
+          const screenShareUser = {
+            name: getScreenShareName(attr?.attributes?.name || userText),
+            type: UserType.ScreenShare,
+          };
+          updateRenderListState(screenUid, screenShareUser);
+          //end - updating screenshare data in rtc
         } catch (e) {
           console.error(`Could not retrieve name of ${data.uid}`, e);
         }
@@ -334,17 +351,11 @@ const RtmConfigure = (props: any) => {
     engine.current.on('channelMemberLeft', (data: any) => {
       console.log('user left', data);
       // Chat of left user becomes undefined. So don't cleanup
-      const {uid} = data;
+      const uid = data?.uid ? parseInt(data?.uid) : undefined;
       if (!uid) return;
-      setUserList((prevState) => {
-        return {
-          ...prevState,
-          [uid]: {
-            ...prevState[uid],
-            requests: attrRequestTypes.none,
-            offline: true,
-          },
-        };
+      //updating the rtc data
+      updateRenderListState(uid, {
+        offline: true,
       });
     });
 
@@ -353,84 +364,60 @@ const RtmConfigure = (props: any) => {
       const textObj = parsePayload(text);
       const {type, msg} = textObj;
 
-      let arr = new Int32Array(1);
-      arr[0] = parseInt(peerId);
-
-      const timestamp = timeNow();
+      const timestamp = getMessageTime(ts);
 
-      const userUID = Platform.OS === 'android' ? arr[0] : peerId;
+      const sender = isAndroid ? get32BitUid(peerId) : peerId;
 
       if (type === messageActionType.Control) {
-        try {
-          switch (msg) {
-            case controlMessageEnum.muteVideo:
-              RtcEngine.muteLocalVideoStream(true);
-              dispatch({
-                type: 'LocalMuteVideo',
-                value: [0],
-              });
-              break;
-            case controlMessageEnum.muteAudio:
-              RtcEngine.muteLocalAudioStream(true);
-              dispatch({
-                type: 'LocalMuteAudio',
-                value: [0],
-              });
-              break;
-            case controlMessageEnum.kickUser:
-              dispatch({
-                type: 'EndCall',
-                value: [],
-              });
-              break;
-            default:
-              break;
-            //   throw new Error('Unsupported message type');
-          }
-        } catch (e) {
-          events.emit(messageChannelType.Private, null, {
-            msg: `Error while dispatching ${messageChannelType.Private} control message`,
-            cause: e,
-          });
-          return;
+        switch (msg) {
+          case controlMessageEnum.muteVideo:
+            RtcEngine.muteLocalVideoStream(true);
+            dispatch({
+              type: 'LocalMuteVideo',
+              value: [0],
+            });
+            break;
+          case controlMessageEnum.muteAudio:
+            RtcEngine.muteLocalAudioStream(true);
+            dispatch({
+              type: 'LocalMuteAudio',
+              value: [0],
+            });
+            break;
+          case controlMessageEnum.kickUser:
+            dispatch({
+              type: 'EndCall',
+              value: [],
+            });
+            break;
+          default:
+            break;
         }
-      } else if (type === messageActionType.Normal) {
+      } else if (type === eventMessageType.CUSTOM_EVENT) {
+        console.log('CUSTOM_EVENT_API: inside custom event type ', evt);
         try {
-          addMessageToPrivateStore(
-            userUID,
-            {
-              body: `${type}${msg}`,
-              ts: timestamp,
-            },
-            false,
-          );
-        } catch (e) {
-          events.emit(messageChannelType.Private, null, {
-            msg: `Error while adding ${messageChannelType.Private} message to store`,
-            cause: e,
-          });
-          return;
+          customEventDispatcher(msg, sender, timestamp);
+        } catch (error) {
+          console.log('error while dispacthing', error);
         }
       }
-      events.emit(messageChannelType.Private, {
-        uid: userUID,
-        ts: timestamp,
-        ...textObj,
-      });
     });
 
     engine.current.on('channelMessageReceived', (evt) => {
       const {uid, channelId, text, ts} = evt;
       const textObj = parsePayload(text);
+      const [err, result] = safeJsonParse(text);
       const {type, msg} = textObj;
-      let arr = new Int32Array(1);
-      arr[0] = parseInt(uid);
 
-      const userUID = Platform.OS ? arr[0] : uid;
-      const timestamp = ts === 0 ? timeNow() : ts;
+      const timestamp = getMessageTime(ts);
+
+      const sender = Platform.OS ? get32BitUid(uid) : uid;
 
       if (channelId === rtcProps.channel) {
-        if (type === messageActionType.Control) {
+        if (
+          type === eventMessageType.CONTROL_GROUP ||
+          type === messageActionType.Control
+        ) {
           let actionMsg = '';
           if (hasJsonStructure(msg)) {
             const [err, result] = safeJsonParse(msg);
@@ -441,91 +428,85 @@ const RtmConfigure = (props: any) => {
           } else {
             actionMsg = msg;
           }
-          try {
-            switch (actionMsg) {
-              case controlMessageEnum.muteVideo:
-                RtcEngine.muteLocalVideoStream(true);
-                dispatch({
-                  type: 'LocalMuteVideo',
-                  value: [0],
-                });
-                break;
-              case controlMessageEnum.muteAudio:
-                RtcEngine.muteLocalAudioStream(true);
-                dispatch({
-                  type: 'LocalMuteAudio',
-                  value: [0],
-                });
-                break;
-              case controlMessageEnum.cloudRecordingActive:
-                setRecordingActive(true);
-                break;
-              case controlMessageEnum.cloudRecordingUnactive:
-                setRecordingActive(false);
-                break;
-              case controlMessageEnum.clientRoleChanged:
-                const {payload} = JSON.parse(msg);
-                if (payload && payload?.role) {
-                  if (
-                    payload.role.trim() !== '' &&
-                    payload.role in ClientRole
-                  ) {
-                    setUserList((prevState) => {
-                      return {
-                        ...prevState,
-                        [uid]: {
-                          ...prevState[uid],
-                          role: parseInt(payload.role),
-                        },
-                      };
-                    });
-                  }
-                }
-                break;
-              default:
-                break;
-              //   throw new Error('Unsupported message type');
-            }
-          } catch (e) {
-            events.emit(messageChannelType.Public, null, {
-              msg: `Error while dispatching ${messageChannelType.Public} control message`,
-              cause: e,
-            });
-            return;
+          switch (actionMsg) {
+            case controlMessageEnum.muteVideo:
+              RtcEngine.muteLocalVideoStream(true);
+              dispatch({
+                type: 'LocalMuteVideo',
+                value: [0],
+              });
+              break;
+            case controlMessageEnum.muteAudio:
+              RtcEngine.muteLocalAudioStream(true);
+              dispatch({
+                type: 'LocalMuteAudio',
+                value: [0],
+              });
+              break;
+            default:
+              break;
+            //   throw new Error('Unsupported message type');
           }
-        } else if (type === messageActionType.Normal) {
+        } else if (type === eventMessageType.CUSTOM_EVENT) {
+          console.log('CUSTOM_EVENT_API: inside custom event type ', evt);
           try {
-            addMessageToStore(userUID, {body: `${type}${msg}`, ts: timestamp});
-          } catch (e) {
-            events.emit(messageChannelType.Public, null, {
-              msg: `Error while adding ${messageChannelType.Public}  message to store`,
-              cause: e,
-            });
-            return;
+            customEventDispatcher(msg, sender, timestamp);
+          } catch (error) {
+            console.log('error while dispacthing', error);
           }
         }
       }
-      events.emit(messageChannelType.Public, {
-        uid: userUID,
-        ts: timestamp,
-        ...textObj,
-      });
     });
+    doLoginAndSetupRTM();
+  };
 
-    engine.current.addListener(
-      'ChannelAttributesUpdated',
-      (attributes: RtmChannelAttribute[]) => {
-        /**
-         * a) The following piece of code is commented for future reference.
-         * b) To be used in future implementations of channel attributes
-         * c) Kindly note the agora-react-native-rtm does not return the attributes with
-         *    additional lastUpdateUserId and lastUpdateTs as mentioned in RtmChannelAttribute type
-         */
-      },
-    );
+  const runQueuedCustomEvents = async () => {
+    try {
+      const eventsInQueue = EventsQueue.printQueue();
+      if (eventsInQueue.length !== 0) {
+        for (const queuedEvents of eventsInQueue) {
+          await customEventDispatcher(
+            queuedEvents.data,
+            queuedEvents.uid,
+            queuedEvents.ts,
+          );
+          EventsQueue.dequeue();
+        }
+      }
+    } catch (error) {
+      throw Error(
+        'CUSTOM_EVENTS_API: error while running queued events ',
+        error,
+      );
+    }
+  };
 
-    await engine.current.createClient(rtcProps.appId);
-    doLoginAndSetupRTM();
+  const customEventDispatcher = async (
+    data: {
+      evt: string;
+      payload: {
+        level: 1 | 2 | 3;
+        action: string;
+        value: string;
+      };
+    },
+    sender: string,
+    ts: number,
+  ) => {
+    console.log('CUSTOM_EVENT_API: inside customEventDispatcher ', data);
+    const {evt, payload} = data;
+    // Step 1: Set local attributes
+    if (payload?.level === 3) {
+      const rtmAttribute = {key: evt, value: JSON.stringify(data.payload)};
+      await engine.current.addOrUpdateLocalUserAttributes([rtmAttribute]);
+    }
+    // Step 2: Emit the event
+    try {
+      console.log('CUSTOM_EVENT_API:  emiting event: ');
+      EventUtils.emitEvent(evt, {payload, sender, ts});
+    } catch (error) {
+      console.log('CUSTOM_EVENT_API: error while emiting event: ', error);
+    }
   };
 
   const sendMessage = async (msg: string) => {
@@ -539,18 +520,13 @@ const RtmConfigure = (props: any) => {
       rtcProps.channel,
       text,
     );
-    addMessageToStore(localUid.current, {
-      body: messageActionType.Normal + msg,
-      ts: timeNow(),
-    });
   };
 
-  const sendMessageToUid = async (msg: string, uid: number) => {
+  const sendMessageToUid = async (msg: string, uid: UidType) => {
     if (msg.trim() === '') return;
-    let adjustedUID = uid;
-    if (adjustedUID < 0) {
-      adjustedUID = adjustUID(uid);
-    }
+
+    const adjustedUID = adjustUID(uid);
+
     const text = stringifyPayload(
       messageSourceType.Core,
       messageActionType.Normal,
@@ -561,14 +537,6 @@ const RtmConfigure = (props: any) => {
       offline: false,
       text,
     });
-    addMessageToPrivateStore(
-      uid,
-      {
-        body: messageActionType.Normal + msg,
-        ts: timeNow(),
-      },
-      true,
-    );
   };
 
   const sendControlMessage = async (msg: string) => {
@@ -583,17 +551,18 @@ const RtmConfigure = (props: any) => {
     );
   };
 
-  const sendControlMessageToUid = async (msg: string, uid: number) => {
-    if (uid < 0) {
-      uid = adjustUID(uid);
-    }
+  const sendControlMessageToUid = async (msg: string, uid: UidType) => {
+    if (msg.trim() === '') return;
+
+    const adjustedUID = adjustUID(uid);
+
     const text = stringifyPayload(
       messageSourceType.Core,
       messageActionType.Control,
       msg,
     );
     await (engine.current as RtmEngine).sendMessageToPeer({
-      peerId: uid.toString(),
+      peerId: adjustedUID.toString(),
       offline: false,
       text,
     });
@@ -608,24 +577,6 @@ const RtmConfigure = (props: any) => {
       : {};
   };
 
-  const updateChannelAttributes = async (attributes: RtmChannelAttribute[]) => {
-    /**
-     * a) The following piece of code is commented for future reference.
-     * b) To be used in future implementations of channel attributes
-     * c) attributes should be an array of key value [{key:"keyTobeUsed", value; 'valueToBeUsed}]
-     *    following the type RtmChannelAttribute
-     */
-    // try {
-    //   await (engine.current as RtmEngine).addOrUpdateChannelAttributes(
-    //     rtcProps.channel,
-    //     [...attributes],
-    //     {enableNotificationToChannelMembers: true},
-    //   );
-    // } catch (error) {
-    //   console.log('AttributesUpdated error', error);
-    // }
-  };
-
   useEffect(() => {
     callActive ? init() : (console.log('waiting to init RTM'), setLogin(true));
     return () => {
@@ -634,58 +585,19 @@ const RtmConfigure = (props: any) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [rtcProps.channel, rtcProps.appId, callActive]);
 
-  const broadcastUserAttributes = async (
-    attributes: RtmAttribute[],
-    ctrlMsg: controlMessageEnum,
-  ) => {
-    // 1. Update my attributes in attribute-list
-    await addOrUpdateLocalUserAttributes(attributes);
-
-    let formattedAttributes: any = {};
-    // Transform the array into object of key value pair
-    attributes.map((attribute) => {
-      let key = Object.values(attribute)[0];
-      let value = Object.values(attribute)[1];
-      formattedAttributes[key] = value;
-    });
-    // 2. Update my attributes in user-list
-    setUserList((prevState) => {
-      return {
-        ...prevState,
-        [localUid.current]: {
-          ...prevState[localUid.current],
-          ...formattedAttributes,
-        },
-      };
-    });
-
-    /**
-     * 3. Broadcast my updated attributes to everyone
-     * send payload and control message as string
-     */
-    const msgAsString = JSON.stringify({
-      action: ctrlMsg,
-      payload: {...formattedAttributes},
-    });
-    sendControlMessage(msgAsString);
-  };
-
   return (
     <ChatContext.Provider
       value={{
-        messageStore,
-        privateMessageStore,
+        hasUserJoinedRTM,
         sendControlMessage,
         sendControlMessageToUid,
         sendMessage,
         sendMessageToUid,
-        broadcastUserAttributes,
-        addOrUpdateLocalUserAttributes,
         engine: engine.current,
-        localUid: localUid.current,
-        userList: userList,
+        localUid: localUid,
         onlineUsersCount,
-        events,
+        setDisplayName,
+        displayName,
       }}>
       {login ? props.children : <></>}
     </ChatContext.Provider>