agora-appbuilder-core 4.0.7 → 4.0.8-beta-01

package/template/src/utils/useFocus.tsx

@@ -10,7 +10,7 @@
 *********************************************
 */
 
-import React, {SetStateAction} from 'react';
+import React, {SetStateAction, useState} from 'react';
 import {createHook} from 'customization-implementation';
 
 export interface currentFocus {
@@ -27,12 +27,17 @@ const FocusContext = React.createContext<FocusContextInterface>({
 });
 
 interface FocusProviderProps {
-  value: FocusContextInterface;
   children: React.ReactNode;
 }
 const FocusProvider = (props: FocusProviderProps) => {
+  const [currentFocus, setFocus] = useState<currentFocus>({
+    editName: false,
+  });
+
+  const value = {currentFocus, setFocus};
+
   return (
-    <FocusContext.Provider value={{...props.value}}>
+    <FocusContext.Provider value={value}>
       {props.children}
     </FocusContext.Provider>
   );

package/template/src/utils/useIsLocalUserSpeaking.ts

@@ -5,6 +5,7 @@ import {useAsyncEffect} from './useAsyncEffect';
 import LocalEventEmitter, {
   LocalEventsEnum,
 } from '../rtm-events-api/LocalEvents';
+import {LogSource, logger} from '../logger/AppBuilderLogger';
 import {useIsRecordingBot} from '../subComponents/recording/useIsRecordingBot';
 
 const useIsLocalUserSpeaking = () => {
@@ -60,7 +61,12 @@ const useIsLocalUserSpeaking = () => {
           audioTrackRef.current[0]?.stop();
       }
     } catch (error) {
-      log(' Error on stopping the hark', error);
+      logger.error(
+        LogSource.Internals,
+        'ACTIVE_SPEAKER',
+        'Error on stopping the hark',
+        error,
+      );
     }
     try {
       //detect local user speaking or not
@@ -75,7 +81,12 @@ const useIsLocalUserSpeaking = () => {
       speechRef.current.on('speaking', speakingCallBack);
       speechRef.current.on('stopped_speaking', stoppedSpeakingCallBack);
     } catch (error) {
-      log(' Error on starting the hark', error);
+      logger.error(
+        LogSource.Internals,
+        'ACTIVE_SPEAKER',
+        'Error on starting the hark',
+        error,
+      );
     }
   };
 
@@ -92,7 +103,12 @@ const useIsLocalUserSpeaking = () => {
             audioTrackRef.current[0]?.stop &&
             audioTrackRef.current[0]?.stop();
         } catch (error) {
-          console.log('error couldnt stop the track');
+          logger.error(
+            LogSource.Internals,
+            'ACTIVE_SPEAKER',
+            'couldnt stop the track',
+            error,
+          );
         }
       };
     }

package/template/src/utils/useJoinRoom.ts

@@ -7,6 +7,7 @@ import {GraphQLContext} from '../components/GraphQLProvider';
 import useGetName from './useGetName';
 import useWaitingRoomAPI from '../subComponents/waiting-rooms/useWaitingRoomAPI';
 import {base64ToUint8Array} from '../utils';
+import {LogSource, logger} from '../logger/AppBuilderLogger';
 
 const JOIN_CHANNEL_PHRASE_AND_GET_USER = gql`
   query JoinChannel($passphrase: String!) {
@@ -85,11 +86,21 @@ export default function useJoinRoom() {
     try {
       let response = null;
       if (isWaitingRoomEnabled) {
+        logger.log(
+          LogSource.NetworkRest,
+          'channel_join_request',
+          'API channel_join_request. Trying request to join channel as waiting room is enabled',
+        );
         response = await requestToJoin({
           meetingPhrase: phrase,
           send_event: false,
         });
       } else {
+        logger.log(
+          LogSource.NetworkRest,
+          'joinChannel',
+          'API joinChannel. Trying to join channel. Waiting room is disabled',
+        );
         response = await client.query({
           query:
             store.token === null
@@ -102,10 +113,26 @@ export default function useJoinRoom() {
         });
       }
       if (response?.error) {
+        logger.error(
+          LogSource.NetworkRest,
+          `${isWaitingRoomEnabled ? 'channel_join_request' : 'joinChannel'}`,
+          `API ${
+            isWaitingRoomEnabled ? 'channel_join_request' : 'joinChannel'
+          } failed.`,
+          response?.error,
+        );
         throw response.error;
       } else {
         if ((response && response.data) || isWaitingRoomEnabled) {
           let data = isWaitingRoomEnabled ? response : response.data;
+          logger.log(
+            LogSource.NetworkRest,
+            `${isWaitingRoomEnabled ? 'channel_join_request' : 'joinChannel'}`,
+            `API to ${
+              isWaitingRoomEnabled ? 'channel_join_request' : 'joinChannel'
+            } successful.`,
+            phrase,
+          );
           let roomInfo: Partial<RoomInfoContextInterface['data']> = {};
 
           if (data?.joinChannel?.channel || data?.channel) {

package/template/src/utils/useLayout.tsx

@@ -10,8 +10,10 @@
 *********************************************
 */
 
-import React, {SetStateAction} from 'react';
+import React, {SetStateAction, useState} from 'react';
 import {createHook} from 'customization-implementation';
+import useLayoutsData from '../pages/video-call/useLayoutsData';
+import {isArray} from './common';
 
 export interface LayoutContextInterface {
   currentLayout: string;
@@ -24,12 +26,16 @@ const LayoutContext = React.createContext<LayoutContextInterface>({
 });
 
 interface LayoutProviderProps {
-  value: LayoutContextInterface;
   children: React.ReactNode;
 }
 const LayoutProvider = (props: LayoutProviderProps) => {
+  const layouts = useLayoutsData();
+  const defaultLayoutName = isArray(layouts) ? layouts[0].name : '';
+  const [currentLayout, setLayout] = useState(defaultLayoutName);
+
+  const value = {currentLayout, setLayout};
   return (
-    <LayoutContext.Provider value={{...props.value}}>
+    <LayoutContext.Provider value={value}>
       {props.children}
     </LayoutContext.Provider>
   );

package/template/src/utils/useSidePanel.tsx

@@ -10,9 +10,10 @@
 *********************************************
 */
 
-import React, {SetStateAction} from 'react';
+import React, {useState, SetStateAction, useEffect} from 'react';
 import {SidePanelType} from '../subComponents/SidePanelEnum';
 import {createHook} from 'customization-implementation';
+import {LogSource, logger} from '../logger/AppBuilderLogger';
 
 export interface SidePanelContextInterface {
   sidePanel: SidePanelType;
@@ -25,12 +26,22 @@ const SidePanelContext = React.createContext<SidePanelContextInterface>({
 });
 
 interface SidePanelProviderProps {
-  value: SidePanelContextInterface;
   children: React.ReactNode;
 }
 const SidePanelProvider = (props: SidePanelProviderProps) => {
+  const [sidePanel, setSidePanel] = useState<SidePanelType>(SidePanelType.None);
+
+  useEffect(() => {
+    logger.log(
+      LogSource.Internals,
+      'CONTROLS',
+      `Side panel changed to -> ${SidePanelType[sidePanel]}`,
+    );
+  }, [sidePanel]);
+
+  const value = {sidePanel, setSidePanel};
   return (
-    <SidePanelContext.Provider value={{...props.value}}>
+    <SidePanelContext.Provider value={value}>
       {props.children}
     </SidePanelContext.Provider>
   );