agora-appbuilder-core 3.0.10 → 3.0.12

package/template/agora-rn-uikit/src/Contexts/LocalUserContext.tsx

@@ -16,10 +16,6 @@ interface LocalUserContextInterface {
 
 const LocalUserContext: React.FC<LocalUserContextInterface> = (props) => {
   const {renderList} = useContext(RenderContext);
-  if (!props?.localUid) {
-    console.error('Error: local user id is empty');
-    return null;
-  }
   let localUser: RenderInterface = renderList[props?.localUid];
   if (!localUser) {
     console.error("Error: we couldn't find the local user data");

package/template/agora-rn-uikit/src/Contexts/PropsContext.tsx

@@ -32,16 +32,6 @@ export enum ToggleState {
   enabling, // disabled -> enabling -> enabled
 }
 
-export enum PermissionState {
-  NOT_REQUESTED,
-  REQUESTED,
-  GRANTED_FOR_CAM_AND_MIC,
-  GRANTED_FOR_CAM_ONLY,
-  GRANTED_FOR_MIC_ONLY,
-  REJECTED,
-  CANCELLED,
-}
-
 export const toggleHelper = (state: ToggleState) =>
   state === ToggleState.enabled ? ToggleState.disabled : ToggleState.enabled;
 
@@ -51,9 +41,6 @@ export interface DefaultRenderInterface {
   video: ToggleState;
   streamType: 'high' | 'low';
   type: 'rtc';
-  permissionStatus?: PermissionState;
-  //applicable only to the screenshare
-  parentUid?: UidType;
 }
 export interface CustomRenderInterface<T> {
   type: T extends DefaultRenderInterface['type'] ? never : T;
@@ -135,16 +122,11 @@ export interface CallbacksInterface {
   UserMuteRemoteVideo(uid: UidType, muted: RenderInterface['video']): void;
   LocalMuteAudio(muted: ToggleState): void;
   LocalMuteVideo(muted: ToggleState): void;
-  LocalPermissionState(
-    permissionState: RenderInterface['permissionStatus'],
-  ): void;
   RemoteAudioStateChanged: RtcEngineEvents['RemoteAudioStateChanged'];
   RemoteVideoStateChanged: RtcEngineEvents['RemoteVideoStateChanged'];
-  ActiveSpeakerDetected: RtcEngineEvents['ActiveSpeaker'];
   JoinChannelSuccess: RtcEngineEvents['JoinChannelSuccess'];
   UpdateRenderList(uid: UidType, user: Partial<RenderInterface>): void;
   AddCustomContent(uid: UidType, data: any): void;
-  UserPin(Uid: UidType): void;
 }
 
 export type CustomCallbacksInterface = CallbacksInterface;

package/template/agora-rn-uikit/src/Contexts/RtcContext.tsx

@@ -12,8 +12,6 @@ export interface RenderObjects {
 export interface RenderStateInterface {
   renderList: RenderObjects;
   activeUids: Array<UidType>;
-  activeSpeaker?: UidType;
-  pinnedUid?: UidType;
   lastJoinedUid?: UidType;
 }
 

package/template/agora-rn-uikit/src/Controls/BtnTemplate.tsx

@@ -5,11 +5,9 @@ import {
   StyleProp,
   TouchableOpacityProps,
   ViewStyle,
-  TextStyle,
   Text,
   View,
   Platform,
-  ImageStyle,
 } from 'react-native';
 import PropsContext from '../Contexts/PropsContext';
 import styles from '../Style';
@@ -18,10 +16,9 @@ import useImageDelay from '../hooks/useImageDelay';
 import {Either} from './types';
 
 interface BtnTemplateBasicInterface {
+  color?: string;
   onPress?: TouchableOpacityProps['onPress'];
   style?: StyleProp<ViewStyle>;
-  styleText?: TextStyle;
-  styleIcon?: ImageStyle;
   btnText?: string;
   disabled?: boolean;
 }
@@ -44,41 +41,40 @@ const BtnTemplate: React.FC<BtnTemplateInterface> = (props) => {
   const imageRef = React.useRef(null);
 
   // This fixes the tint issue in safari browser
-  // useImageDelay(imageRef, 10, '', props?.color || '');
+  useImageDelay(imageRef, 10, '', props?.color || '');
 
   return (
     <TouchableOpacity
-      style={props.style}
+      style={{width: '100%', height: '100%'}}
       disabled={disabled}
       onPress={props.onPress}>
-      <Image
-        ref={Platform.OS === 'web' ? imageRef : undefined}
+      <View
         style={[
-          {
+          {...styles.controlBtn, ...(BtnTemplateStyles as object)},
+          props.style as object,
+        ]}>
+        <Image
+          ref={Platform.OS === 'web' ? imageRef : undefined}
+          style={{
             width: '100%',
             height: '100%',
-            //opacity: disabled ? 0.4 : 1,
-            //In new design all icons comes with filled color. so don't apply the tintColor
-            //tintColor: disabled ? 'grey' : props.color || theme || '#fff',
-          },
-          props?.styleIcon,
-        ]}
-        resizeMode={'contain'}
-        source={{
-          uri:
-            props?.name && icons[props.name] ? icons[props.name] : props.icon,
-        }}
-      />
+            opacity: disabled ? 0.4 : 1,
+            tintColor: disabled ? 'grey' : props.color || theme || '#fff',
+          }}
+          resizeMode={'contain'}
+          source={{
+            uri:
+              props.name && icons[props.name] ? icons[props.name] : props.icon,
+          }}
+        />
+      </View>
       <Text
-        style={[
-          {
-            textAlign: 'center',
-            marginTop: 5,
-            //color: disabled ? 'grey' : props.color || theme || '#fff',
-            //opacity: disabled ? 0.4 : 1,
-          },
-          props?.styleText,
-        ]}>
+        style={{
+          textAlign: 'center',
+          marginTop: 5,
+          color: disabled ? 'grey' : props.color || theme || '#fff',
+          opacity: disabled ? 0.4 : 1,
+        }}>
         {props.btnText}
       </Text>
     </TouchableOpacity>