sdk(react-native-sdk): rnsdk updates fixes (#13627)

* sdk(react-native-sdk): created IEventListeners interface, alpha sorted props and other updates
This commit is contained in:
Calinteodor
2023-07-31 22:01:06 +03:00
committed by GitHub
parent c05a49567d
commit ae90e96a3e
4 changed files with 83 additions and 52 deletions

View File

@@ -79,11 +79,11 @@ https://github.com/jitsi/jitsi-meet-sdk-samples/tree/master/react-native
### Using JWT tokens
- If you are planning to use tokens you can update your domain and room name inside meeting options.
- If you are planning to use tokens or another domain you can do that by updating the following props, as shown below.
- For example:
```javascript
const meetingOptions = {
domain: 'YOUR_DOMAIN',
roomName: 'ROOM_NAME?jwt=JWT_TOKEN'
}
<JitsiMeeting
room={'ThisIsNotATestRoomName'}
serverURL={'https://meet.jit.si/'}
token={'dkhalhfajhflahlfaahalhfahfsl'} />
```

View File

@@ -6,49 +6,56 @@ import 'react-native-gesture-handler';
import 'react-native-get-random-values';
import './react/features/mobile/polyfills';
// @ts-ignore
import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
import { View } from 'react-native';
import { View, ViewStyle } from 'react-native';
import { appNavigate } from './react/features/app/actions.native';
import { App } from './react/features/app/components/App.native';
import { setAudioMuted, setVideoMuted } from './react/features/base/media/actions';
// @ts-ignore
import JitsiThemePaperProvider from './react/features/base/ui/components/JitsiThemeProvider.native';
interface IEventListeners {
onConferenceJoined?: Function;
onConferenceLeft?: Function;
onConferenceWillJoin?: Function;
onParticipantJoined?: Function;
onReadyToClose?: Function;
}
interface IUserInfo {
email: string,
displayName: string;
avatarURL: string;
displayName: string;
email: string;
}
interface IAppProps {
config: object;
flags: object;
meetingOptions: {
domain: string;
roomName: string;
onReadyToClose?: Function;
onConferenceJoined?: Function;
onConferenceWillJoin?: Function;
onConferenceLeft?: Function;
onParticipantJoined?: Function;
settings?: {
startWithAudioMuted?: boolean;
startAudioOnly?: boolean;
startWithVideoMuted?: boolean;
},
userInfo: IUserInfo
};
eventListeners: IEventListeners;
room: string;
serverURL?: string;
style?: Object;
token?: string;
userInfo?: IUserInfo;
}
/**
* Main React Native SDK component that displays a Jitsi Meet conference and gets all required params as props
*/
export const JitsiMeeting = forwardRef(({ flags, meetingOptions, style }: IAppProps, ref) => {
export const JitsiMeeting = forwardRef((props: IAppProps, ref) => {
const [ appProps, setAppProps ] = useState({});
const app = useRef(null);
const {
config,
eventListeners,
flags,
room,
serverURL,
style,
token,
userInfo
} = props;
// eslint-disable-next-line arrow-body-style
useImperativeHandle(ref, () => ({
@@ -71,32 +78,44 @@ export const JitsiMeeting = forwardRef(({ flags, meetingOptions, style }: IAppPr
useEffect(
() => {
const url = `${meetingOptions.domain}/${meetingOptions.roomName}`;
const urlObj = {
config,
jwt: token
};
let urlProps;
if (room.includes('://')) {
urlProps = {
...urlObj,
url: room
};
} else {
urlProps = {
...urlObj,
room,
serverURL
};
}
setAppProps({
'url': {
url,
config: meetingOptions.settings
},
'flags': flags,
'rnSdkHandlers': {
onReadyToClose: meetingOptions.onReadyToClose,
onConferenceJoined: meetingOptions.onConferenceJoined,
onConferenceWillJoin: meetingOptions.onConferenceWillJoin,
onConferenceLeft: meetingOptions.onConferenceLeft,
onParticipantJoined: meetingOptions.onParticipantJoined
onReadyToClose: eventListeners.onReadyToClose,
onConferenceJoined: eventListeners.onConferenceJoined,
onConferenceWillJoin: eventListeners.onConferenceWillJoin,
onConferenceLeft: eventListeners.onConferenceLeft,
onParticipantJoined: eventListeners.onParticipantJoined
},
'flags': { ...flags },
'userInfo': {
...meetingOptions.userInfo
}
'url': urlProps,
'userInfo': userInfo
});
}, []
);
return (
<View style = { style }>
<View style = { style as ViewStyle }>
<JitsiThemePaperProvider>
{/* @ts-ignore */}
<App
{ ...appProps }
ref = { app } />

View File

@@ -1,12 +1,12 @@
{
"name": "@jitsi/react-native-sdk",
"version": "0.1.0",
"version": "0.2.2",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "@jitsi/react-native-sdk",
"version": "0.1.0",
"version": "0.2.2",
"hasInstallScript": true,
"license": "Apache-2.0",
"dependencies": {
@@ -28,7 +28,7 @@
"js-md5": "0.6.1",
"js-sha512": "0.8.0",
"jwt-decode": "2.2.0",
"lib-jitsi-meet": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1662.0.0+6c4381c8/lib-jitsi-meet.tgz",
"lib-jitsi-meet": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1670.0.0+10ebc843/lib-jitsi-meet.tgz",
"lodash": "4.17.21",
"moment": "2.29.4",
"moment-duration-format": "2.2.2",
@@ -823,6 +823,11 @@
"@svgr/core": "*"
}
},
"node_modules/@testrtc/watchrtc-sdk": {
"version": "1.36.3",
"resolved": "https://registry.npmjs.org/@testrtc/watchrtc-sdk/-/watchrtc-sdk-1.36.3.tgz",
"integrity": "sha512-JtcTvvh20t553n8q5ZHpWQeSUTENkQrZbGNvQ05jD8SA2V5PHBok/7my1ZDuA44sgT0y1OfUA8VT7dhcs0VxWg=="
},
"node_modules/@trysound/sax": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
@@ -2443,8 +2448,8 @@
},
"node_modules/lib-jitsi-meet": {
"version": "0.0.0",
"resolved": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1662.0.0+6c4381c8/lib-jitsi-meet.tgz",
"integrity": "sha512-jEQv0imqSPHowBOsd8178fPLUNTj0SavUQnWJIjEjFW4kE4KA+jBlU2C9qryEFwqJ2NjFo7md6H/xz8u+tW1mA==",
"resolved": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1670.0.0+10ebc843/lib-jitsi-meet.tgz",
"integrity": "sha512-kTHkhQiuLn28wrDhzcgDwJTJ106bgWMgARxgVZpFM1FyRjgJt2e9pn6mZtjEKT5FZeUcUtpy9cDuU6+yLusZEw==",
"hasInstallScript": true,
"license": "Apache-2.0",
"dependencies": {
@@ -2452,6 +2457,7 @@
"@jitsi/logger": "2.0.0",
"@jitsi/sdp-interop": "git+https://github.com/jitsi/sdp-interop#3d49eb4aa26863a3f8d32d7581cdb4321244266b",
"@jitsi/sdp-simulcast": "0.4.0",
"@testrtc/watchrtc-sdk": "1.36.3",
"async-es": "3.2.4",
"base64-js": "1.3.1",
"current-executing-script": "0.1.3",
@@ -4200,6 +4206,11 @@
"svgo": "^2.8.0"
}
},
"@testrtc/watchrtc-sdk": {
"version": "1.36.3",
"resolved": "https://registry.npmjs.org/@testrtc/watchrtc-sdk/-/watchrtc-sdk-1.36.3.tgz",
"integrity": "sha512-JtcTvvh20t553n8q5ZHpWQeSUTENkQrZbGNvQ05jD8SA2V5PHBok/7my1ZDuA44sgT0y1OfUA8VT7dhcs0VxWg=="
},
"@trysound/sax": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
@@ -5349,13 +5360,14 @@
}
},
"lib-jitsi-meet": {
"version": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1662.0.0+6c4381c8/lib-jitsi-meet.tgz",
"integrity": "sha512-jEQv0imqSPHowBOsd8178fPLUNTj0SavUQnWJIjEjFW4kE4KA+jBlU2C9qryEFwqJ2NjFo7md6H/xz8u+tW1mA==",
"version": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1670.0.0+10ebc843/lib-jitsi-meet.tgz",
"integrity": "sha512-kTHkhQiuLn28wrDhzcgDwJTJ106bgWMgARxgVZpFM1FyRjgJt2e9pn6mZtjEKT5FZeUcUtpy9cDuU6+yLusZEw==",
"requires": {
"@jitsi/js-utils": "2.0.0",
"@jitsi/logger": "2.0.0",
"@jitsi/sdp-interop": "git+https://github.com/jitsi/sdp-interop#3d49eb4aa26863a3f8d32d7581cdb4321244266b",
"@jitsi/sdp-simulcast": "0.4.0",
"@testrtc/watchrtc-sdk": "1.36.3",
"async-es": "3.2.4",
"base64-js": "1.3.1",
"current-executing-script": "0.1.3",

View File

@@ -1,6 +1,6 @@
{
"name": "@jitsi/react-native-sdk",
"version": "0.1.0",
"version": "0.3.0",
"description": "React Native SDK for Jitsi Meet.",
"main": "index.tsx",
"license": "Apache-2.0",
@@ -29,7 +29,7 @@
"js-md5": "0.6.1",
"js-sha512": "0.8.0",
"jwt-decode": "2.2.0",
"lib-jitsi-meet": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1662.0.0+6c4381c8/lib-jitsi-meet.tgz",
"lib-jitsi-meet": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1670.0.0+10ebc843/lib-jitsi-meet.tgz",
"lodash": "4.17.21",
"moment": "2.29.4",
"moment-duration-format": "2.2.2",
@@ -98,4 +98,4 @@
"keywords": [
"react-native"
]
}
}