Interactive Video/Audio Calling Feature Development using Zegocloud

Job ID: 38014013

Budget: ₹400 – ₹750 INR

App is completed but in that there is some issue regarding Zegocloud's library. I want only freelancer who can solve this issue. No company will be entertained.


this is my code which show the error of : can not read property 'getPluginType' of null

import {StyleSheet, Text, View} from 'react-native';
import React, {useContext, useRef} from 'react';
import ZegoUIKitPrebuiltLiveStreaming, {
HOST_DEFAULT_CONFIG,
ZegoMenuBarButtonName,
} from '@zegocloud/zego-uikit-prebuilt-live-streaming-rn';
import ZIM from 'zego-zim-react-native';
import {useNavigation, useRoute} from '@react-navigation/native';
import BackButtonHandler from '../BackButtonHandler/BackButtonHandler';
import KeyCenter from '../../utils/KeyCenter';
import {UserType} from '../../UserContext';
const HostPage = () => {
const {userId, setUserId} = useContext(UserType);
const prebuiltRef = useRef();
const navigation = useNavigation();
const route = useRoute();
const data = route.params.data;
const userID = userId;
const liveID = userId;
const userName = 'swapnil';

return (
<BackButtonHandler style={styles.container}>
<ZegoUIKitPrebuiltLiveStreaming
ref={prebuiltRef}
appID={KeyCenter.LiveStreamKey.APP_ID}
appSign={KeyCenter.LiveStreamKey.APP_SIGN}
userID={userID}
userName={userName}
liveID={liveID}
config={{
...HOST_DEFAULT_CONFIG,
onStartLiveButtonPressed: () => {
console.log('########HostPage onStartLiveButtonPressed');
},
onLiveStreamingEnded: () => {
console.log('########HostPage onLiveStreamingEnded');
},
onLeaveLiveStreaming: () => {
console.log('########HostPage onLeaveLiveStreaming');
navigation.navigate('HomePage');
},
durationConfig: {
isVisible: true,
onDurationUpdate: duration => {
console.log('########HostPage onDurationUpdate', duration);
if (duration === 10 * 60) {
prebuiltRef.current.leave();
}
},
},
topMenuBarConfig: {
buttons: [
ZegoMenuBarButtonName.minimizingButton,
ZegoMenuBarButtonName.leaveButton,
],
},
onWindowMinimized: () => {
console.log('[Demo]HostPage onWindowMinimized');
navigation.navigate('HomePage');
},
onWindowMaximized: () => {
console.log('[Demo]HostPage onWindowMaximized');
navigation.navigate('HostPage', {
userID: userID,
userName: userName,
liveID: liveID,
});
},
}}
plugins={[ZIM]}
/>
</BackButtonHandler>
);
};

const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
zIndex: 0,
},
avView: {
flex: 1,
width: '100%',
height: '100%',
zIndex: 1,
position: 'absolute',
right: 0,
top: 0,
backgroundColor: 'red',
},
ctrlBar: {
flex: 1,
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'flex-end',
marginBottom: 50,
width: '100%',
height: 50,
zIndex: 2,
},
ctrlBtn: {
flex: 1,
width: 48,
height: 48,
marginLeft: 37 / 2,
position: 'absolute',
},
});
export default HostPage;
Related categories: JavaScript React Native