agora-appbuilder-core 4.0.0-beta.29 → 4.0.0-beta.30

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agora-appbuilder-core",
-  "version": "4.0.0-beta.29",
+  "version": "4.0.0-beta.30",
   "description": "React Native template for RTE app builder",
   "main": "index.js",
   "files": [

package/template/agora-rn-uikit/src/Controls/Icons.ts

@@ -18,9 +18,12 @@ export interface IconsInterface {
   'turn-off-stt': string;
   'live-caption-mode': string;
   done: string;
+  warning: string;
 }
 
 const icons: IconsInterface = {
+  warning:
+    'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAACXBIWXMAACE4AAAhOAFFljFgAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAM1SURBVHgB7Zo9TBNhGMefUoUiPT+iEXAgDshGtAEXbWKiJCVxAxZd2sWpLrrIYuLA4Ohg4qiTUxlNWNy6oQnRTZ1Y0EGl9IDWD/B9Ds9ctPd+Pu+LXO+XvM2lfZvev89zz9dd5srE8C50ET3QZaSCk04qOOmkgpNOKtgF+b7dYO0Hh8AxlWKTLT84flbPs+WBS5xaeHp8649YBI8vjHwDlzgVHBUbcu/6ulP3diYYXXno2M9/3h9m781d9MEVTgSj0LnJzdjPZye2nFnZiWC0bj4XL8jr34HqVANcYF0wWnd6fFu4D/e4CGDWBT+6+VlqX4atMvME21gVjGmoU6CKo8AsjN+xiTXBKLRTGhJRvdq0GsCsCVa1bggGMJtpyopgXeuGzE7q/VkyWBFcMQw+Xm4nqMBsQC4YXVkmDYnAFGUjTZELNnHlKJimbFiZVDCWjzLXXv1dLlgi9ursTaCErB8ekjy5xy+PQm15IDhGlxUVJuVLPiy9OQJ+OwMUkFk4rhv6Gzz5kJXVXuF+TFOUFRiJYNl6GdGxFHoOVQAjEbww8wVsQllnGwvGNDQ6+ANsgxYunmuBKcaCqdKQCLRydWrDuM42EiwbqKigGAdpCzatl3UxrbO1BVccNOudwDr79rUN0EVL8Ojgd5J6WZfLYy3tNKUleGHmK+gSPVFd18QAputhyoJ1G/uQedYQFEbawTL943Tq7IzKUzwoFGtfl5GZR7PVAzeenFaq3pQsLNsNyUAxtcIAppqmpAXLdkMi1hpZePjiONxfPBEcm1JmqVHFCNKCqdLQnecnYeltP9Tf5+DW01Pgt8zaPvz2vMKgQEow1dgG+Rixqs+uQb9t3r+cVxgHSf0aZUVViJwYlooUMUFlHJQ9e8Z7wNuArlwcawMV6CkoEi1yt9SAXqKZi/f7Zt3Kah93H/fnVBp7FWxVaVhn15bz3DTFdWnX3ZApQZ0tuO0aK9iWdW1TEtx2jRXMu2P/P4POXOLcgYwVTDUW3Q/87fgrNfaT2quBoBLC2HdgFntZW8/C4uu9uXcnhM2D6+eoTECv/PDpMHePMAvKDMsPEunDpUknFZx0UsFJp+sE/wKxVEJyoyLawQAAAABJRU5ErkJggg==',
   vb: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAEfSURBVHgB7VNbEcIwELwwCCgOkIADggMcgAQcVAI4KBJAARLAQeugdXBc6KVzpE2a5Ls7szNtsrebywNgQSoQsSWe+XtLrIlvYsFjJ+xhNQXPD5q5gJD5kfgKmZsFxISMzD26cqq7LHNe7YVYmQ6Mzo5Lc9tdKGDK3IZK1CIkzpzFsmVrUOE0Xjx/k+cyF2DNS1HkQ+vU/A4dIroo2UDzfxsKkOazAcL8LMbunoDKNY/ZosGcCwth8Lf/YmuyHpo1vYg5jf0V1W4NJj40e+c1JAAnHpqaKTCrOhL3xB1xSzRjHbEhfohPpdSD9dpo6P8OER2UgdvjojZ6SGi1wjxcXS/lCUDIQ0fbs5EDK58Q8jC6pmuP8AD9oaaigQWp+AKsAoDF7uWeIAAAAABJRU5ErkJggg==',
   'vb-image':
     'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABmJLR0QA/wD/AP+gvaeTAAAB20lEQVRIie2UPWsUURSGn2siwcRsdgU/EkjnT5BgsZVgxCaNCiqIIi4WRrD1F6RQxMKAgTRWahkIikktRtzSD1IpCIIEsfAjCQQei5zRyZDdmVjnheHcc+5733fuzLkXdrFTqJ/UEzE+pLbVp+reqF1Rv6rjkTfUl+ozdV8Vg4mIh9W36kK2UG2qi+qZnHhbfaXWona5iskR9V1evANvqiiurlcRf18UV/vVlno3Yr/aow7kxdULZQYfthEfVpfdxK+Iy+pwzF+qJB7k/DcfjPhE/aE2I29G/jjyO5m42igzyMSvqedjvKJOF3jT6kr2+SLW1Td53p6iQUppVW0BD4CPUV4DagVqDViNNb/VOrAAWLaDlrqWtWvU7qsb6g31aMQN9V7MD6mv46mXGfwVjz4/qA6o827FfNR74qAtqUNdxUM0L95WJ3NzY9ExY4U1FzNx9VwVk/3qLePKqAr1bPGgpQ7ElFIyOuo0cAo4BowAfcA68AVoAy+A59EcJ4GRlNKjMoM+4DZwEzgAfAeWgM8xbgCjwPEYf2Oz66ZSSt2vijCYiR85p06ovR14vTE/F/yHRU6nHfwEFoGrpW/zD7PAeEppsIpB98PSBSmlLZrbbh24/r8Gu9gx/gBohhCCgI16xQAAAABJRU5ErkJggg==',

package/template/global.d.ts

@@ -103,11 +103,10 @@ interface ConfigInterface {
   ENABLE_IDP_AUTH: boolean;
   PROJECT_ID: string;
   ENABLE_STT: boolean;
-  ENABLE_AINS: boolean;
+  ENABLE_NOISE_CANCELLATION: boolean;
   ENABLE_VIRTUAL_BACKGROUND: boolean;
   ENABLE_WHITEBOARD: boolean;
-  ENABLE_CHAT_NOTIFICATION: boolean;
-  WAITING_ROOM: boolean;
+  ENABLE_WAITING_ROOM: boolean;
   WHITEBOARD_APPIDENTIFIER: string;
   WHITEBOARD_REGION: string;
 }

package/template/src/app-state/useNoiseSupression.native.tsx

@@ -21,7 +21,7 @@ export function NoiseSupressionProvider(props) {
   );
 
   useEffect(() => {
-    if ($config.ENABLE_AINS) {
+    if ($config.ENABLE_NOISE_CANCELLATION) {
     }
   }, []);
 

package/template/src/app-state/useNoiseSupression.tsx

@@ -33,7 +33,7 @@ export function NoiseSupressionProvider(props) {
   let processor = useRef(null);
 
   useEffect(() => {
-    if ($config.ENABLE_AINS) {
+    if ($config.ENABLE_NOISE_CANCELLATION) {
       const denoiserExtension = new AIDenoiserExtension({assetsPath: 'wasm'});
       AgoraRTC.registerExtensions([denoiserExtension]);
       processor.current = denoiserExtension.createProcessor();
@@ -42,7 +42,7 @@ export function NoiseSupressionProvider(props) {
   }, []);
 
   const enableNoiseSuppression = async () => {
-    if (!$config.ENABLE_AINS) {
+    if (!$config.ENABLE_NOISE_CANCELLATION) {
       throw new Error('AINS disabled in config');
     }
     //@ts-ignore

package/template/src/components/Controls.tsx

@@ -116,7 +116,7 @@ const MoreButton = () => {
   const {isNoiseSupressionEnabled, setNoiseSupression} = useNoiseSupression();
 
   //AINS
-  if ($config.ENABLE_AINS) {
+  if ($config.ENABLE_NOISE_CANCELLATION) {
     actionMenuitems.push({
       toggleStatus: isNoiseSupressionEnabled === ToggleState.enabled,
       disabled:
@@ -148,7 +148,7 @@ const MoreButton = () => {
     }
     setIsVBActive(prev => !prev);
   };
-  if ($config.ENABLE_VIRTUAL_BACKGROUND) {
+  if ($config.ENABLE_VIRTUAL_BACKGROUND && !$config.AUDIO_ROOM) {
     actionMenuitems.push({
       isBase64Icon: true,
       //@ts-ignore
@@ -185,13 +185,13 @@ const MoreButton = () => {
   useEffect(() => {
     whiteboardActive && currentLayout !== 'pinned' && setLayout('pinned');
 
-    // if (!$config.WAITING_ROOM) {
+    // if (!$config.ENABLE_WAITING_ROOM) {
     //   events.on('WhiteBoardStopped', WhiteboardStoppedCallBack);
     //   events.on('WhiteBoardStarted', WhiteboardStartedCallBack);
     // }
 
     // return () => {
-    //   if (!$config.WAITING_ROOM) {
+    //   if (!$config.ENABLE_WAITING_ROOM) {
     //     events.off('WhiteBoardStopped', WhiteboardStoppedCallBack);
     //     events.off('WhiteBoardStarted', WhiteboardStartedCallBack);
     //   }
@@ -659,7 +659,7 @@ export const MoreButtonToolbarItem = () => {
   return (
     (width < BREAKPOINTS.md ||
       $config.ENABLE_STT ||
-      $config.ENABLE_AINS ||
+      $config.ENABLE_NOISE_CANCELLATION ||
       $config.ENABLE_VIRTUAL_BACKGROUND ||
       $config.ENABLE_WHITEBOARD) && (
       <ToolbarItem testID="more-btn">

package/template/src/components/ParticipantsView.tsx

@@ -117,7 +117,11 @@ const ParticipantView = props => {
                    */
                   <>
                     {/* c) Waiting Room View */}
-                    {$config.WAITING_ROOM ? <WaitingRoomParticipants /> : <></>}
+                    {$config.ENABLE_WAITING_ROOM ? (
+                      <WaitingRoomParticipants />
+                    ) : (
+                      <></>
+                    )}
                     {/* a) Live streaming view */}
 
                     <CurrentLiveStreamRequestsView userList={liveStreamData} />
@@ -218,7 +222,7 @@ const ParticipantView = props => {
           </>
         ) : (
           <>
-            {$config.WAITING_ROOM && isHost ? (
+            {$config.ENABLE_WAITING_ROOM && isHost ? (
               <WaitingRoomParticipants />
             ) : (
               <></>

package/template/src/components/Precall.native.tsx

@@ -109,7 +109,8 @@ const JoinRoomInputView = ({isDesktop}) => {
               ? style.btnContainerStyle
               : {width: '100%'}
           }>
-          {$config.WAITING_ROOM && rtcProps.role === ClientRole.Audience ? (
+          {$config.ENABLE_WAITING_ROOM &&
+          rtcProps.role === ClientRole.Audience ? (
             <JoinWaitingRoomBtn />
           ) : (
             <JoinButton />

package/template/src/components/Precall.tsx

@@ -114,7 +114,8 @@ const JoinRoomInputView = ({isDesktop}) => {
               ? style.btnContainerStyle
               : {width: '100%'}
           }>
-          {$config.WAITING_ROOM && rtcProps.role === ClientRole.Audience ? (
+          {$config.ENABLE_WAITING_ROOM &&
+          rtcProps.role === ClientRole.Audience ? (
             <JoinWaitingRoomBtn />
           ) : (
             <JoinButton />
@@ -201,7 +202,8 @@ const JoinRoomButton = () => {
     return components;
   });
 
-  return $config.WAITING_ROOM && rtcProps.role === ClientRole.Audience ? (
+  return $config.ENABLE_WAITING_ROOM &&
+    rtcProps.role === ClientRole.Audience ? (
     <JoinWaitingRoomBtn />
   ) : (
     <JoinButton />

package/template/src/components/RTMConfigure.tsx

@@ -503,7 +503,7 @@ const RtmConfigure = (props: any) => {
 
   useAsyncEffect(async () => {
     //waiting room attendee -> rtm login will happen on page load
-    if ($config.WAITING_ROOM) {
+    if ($config.ENABLE_WAITING_ROOM) {
       //attendee
       if (!isHost && !callActive) {
         await init();
@@ -513,7 +513,7 @@ const RtmConfigure = (props: any) => {
         await init();
       }
     }
-    if (!$config.WAITING_ROOM) {
+    if (!$config.ENABLE_WAITING_ROOM) {
       //host and attendee
       if (callActive) {
         await init();

package/template/src/components/chat-messages/useChatMessages.tsx

@@ -156,9 +156,6 @@ const ChatMessagesProvider = (props: ChatMessagesProviderProps) => {
       isPrivateMessage: boolean = false,
       forceStop: boolean = false,
     ) => {
-      if (!$config.ENABLE_CHAT_NOTIFICATION) {
-        return;
-      }
       //don't show group message notification if group chat is open
       if (!isPrivateMessage && groupActiveRef.current) {
         return;
@@ -209,7 +206,7 @@ const ChatMessagesProvider = (props: ChatMessagesProviderProps) => {
       EventNames.PUBLIC_CHAT_MESSAGE,
       data => {
         const forceStop =
-          $config.WAITING_ROOM &&
+          $config.ENABLE_WAITING_ROOM &&
           !isHostRef.current.isHost &&
           !callActiveRef.current.callActive;
         const payload = JSON.parse(data.payload);

package/template/src/components/participants/UserActionMenuOptions.tsx

@@ -187,46 +187,6 @@ export default function UserActionMenuOptionsOptions(
           },
         });
       }
-
-      if ($config.DISABLE_CHAT_OPTION) {
-        console.log('disable chat uids', disableChatUids);
-        const isDisableChat = disableChatUids[user.uid]?.disableChat || false;
-        items.push({
-          icon: 'chat-outlined',
-          onHoverIcon: 'chat-filled',
-          iconColor: $config.SECONDARY_ACTION_COLOR,
-          textColor: $config.SECONDARY_ACTION_COLOR,
-          title: `${isDisableChat ? 'Enable' : 'Disable'} Chat`,
-          callback: () => {
-            // send l2 custom events
-            console.warn('sending1 custom events for disable-chat');
-            //    setDisableChat(prev => !prev); // for local user
-
-            setDisableChatUids(prevState => {
-              // upate disable uids
-              const isDisabled = prevState[user.uid]
-                ? prevState[user.uid].disableChat
-                : false;
-              return {
-                ...prevState,
-                [user.uid]: {
-                  disableChat: !isDisableChat,
-                },
-              };
-            });
-            setActionMenuVisible(false);
-            customEvents.send(
-              'DisableChat',
-              JSON.stringify({
-                disableChatUid: user.uid,
-                disableChat: !isDisableChat,
-              }), // uid for chat disabled user
-              PersistanceLevel.Session,
-            );
-          },
-        });
-      }
-
       /**
        * Only host can see this menu item - request/mute - video/audio, promote to co host,demote to audience,remove form meeting
        */

package/template/src/components/precall/LocalMute.tsx

@@ -135,21 +135,26 @@ const PreCallLocalMute = (props: PreCallProps) => {
           <PreCallSettings />
         </>
       )}
-      {$config.ENABLE_VIRTUAL_BACKGROUND && !isMobileUA() && (
-        <>
-          <Spacer size={isMobileView ? 24 : 16} horizontal={true} />{' '}
-          <VBButton isVBOpen={isVBOpen} setIsVBOpen={setIsVBOpen} />
-        </>
-      )}
-      {$config.ENABLE_VIRTUAL_BACKGROUND && !isMobileView && !isNative && (
-        <>
-          <Spacer size={isMobileView ? 24 : 16} horizontal={true} />{' '}
-          <SettingsButton
-            isSettingsOpen={isSettingsOpen}
-            setIsSettingsOpen={setIsSettingsOpen}
-          />
-        </>
-      )}
+      {$config.ENABLE_VIRTUAL_BACKGROUND &&
+        !isMobileUA() &&
+        !$config.AUDIO_ROOM && (
+          <>
+            <Spacer size={isMobileView ? 24 : 16} horizontal={true} />{' '}
+            <VBButton isVBOpen={isVBOpen} setIsVBOpen={setIsVBOpen} />
+          </>
+        )}
+      {$config.ENABLE_VIRTUAL_BACKGROUND &&
+        !$config.AUDIO_ROOM &&
+        !isMobileView &&
+        !isNative && (
+          <>
+            <Spacer size={isMobileView ? 24 : 16} horizontal={true} />{' '}
+            <SettingsButton
+              isSettingsOpen={isSettingsOpen}
+              setIsSettingsOpen={setIsSettingsOpen}
+            />
+          </>
+        )}
     </View>
   );
 };

package/template/src/components/precall/joinWaitingRoomBtn.native.tsx

@@ -72,7 +72,7 @@ const JoinWaitingRoomBtn = (props: PreCallJoinWaitingRoomBtnProps) => {
   } = useRoomInfo();
 
   useEffect(() => {
-    if ($config.WAITING_ROOM && !isHost && token) {
+    if ($config.ENABLE_WAITING_ROOM && !isHost && token) {
       setCallActive(true);
     }
   }, [token]);

package/template/src/components/precall/joinWaitingRoomBtn.tsx

@@ -85,7 +85,7 @@ const JoinWaitingRoomBtn = (props: PreCallJoinWaitingRoomBtnProps) => {
   } = useRoomInfo();
 
   useEffect(() => {
-    if ($config.WAITING_ROOM && !isHost && token) {
+    if ($config.ENABLE_WAITING_ROOM && !isHost && token) {
       setCallActive(true);
     }
   }, [token]);

package/template/src/subComponents/recording/useRecording.tsx

@@ -152,7 +152,7 @@ const RecordingProvider = (props: RecordingProviderProps) => {
     if (prevRecordingState) {
       if (prevRecordingState?.isRecordingActive === isRecordingActive) return;
 
-      if ($config.WAITING_ROOM && !isHost && !callActive) {
+      if ($config.ENABLE_WAITING_ROOM && !isHost && !callActive) {
         return;
       }
 

package/template/src/utils/useJoinRoom.ts

@@ -70,7 +70,7 @@ export default function useJoinRoom() {
   const {client} = useContext(GraphQLContext);
   const username = useGetName();
   const {request: requestToJoin} = useWaitingRoomAPI();
-  const isWaitingRoomEnabled = $config.WAITING_ROOM;
+  const isWaitingRoomEnabled = $config.ENABLE_WAITING_ROOM;
 
   return async (phrase: string) => {
     setRoomInfo(prevState => {