瀏覽代碼

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

* sdk(react-native-sdk): created IEventListeners interface, alpha sorted props and other updates
factor2
Calinteodor 1 年之前
父節點
當前提交
ae90e96a3e
沒有連結到貢獻者的電子郵件帳戶。
共有 4 個檔案被更改,包括 83 行新增52 行删除
  1. 5
    5
      react-native-sdk/README.md
  2. 56
    37
      react-native-sdk/index.tsx
  3. 19
    7
      react-native-sdk/package-lock.json
  4. 3
    3
      react-native-sdk/package.json

+ 5
- 5
react-native-sdk/README.md 查看文件

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

+ 56
- 37
react-native-sdk/index.tsx 查看文件

@@ -6,49 +6,56 @@ import 'react-native-gesture-handler';
6 6
 import 'react-native-get-random-values';
7 7
 import './react/features/mobile/polyfills';
8 8
 
9
-// @ts-ignore
10 9
 import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
11
-import { View } from 'react-native';
10
+import { View, ViewStyle } from 'react-native';
12 11
 
13 12
 import { appNavigate } from './react/features/app/actions.native';
14 13
 import { App } from './react/features/app/components/App.native';
15 14
 import { setAudioMuted, setVideoMuted } from './react/features/base/media/actions';
16
-// @ts-ignore
17 15
 import JitsiThemePaperProvider from './react/features/base/ui/components/JitsiThemeProvider.native';
18 16
 
19 17
 
18
+interface IEventListeners {
19
+    onConferenceJoined?: Function;
20
+    onConferenceLeft?: Function;
21
+    onConferenceWillJoin?: Function;
22
+    onParticipantJoined?: Function;
23
+    onReadyToClose?: Function;
24
+}
25
+
20 26
 interface IUserInfo {
21
-    email: string,
22
-    displayName: string;
23 27
     avatarURL: string;
28
+    displayName: string;
29
+    email: string;
24 30
 }
25 31
 
26 32
 interface IAppProps {
33
+    config: object;
27 34
     flags: object;
28
-    meetingOptions: {
29
-        domain: string;
30
-        roomName: string;
31
-        onReadyToClose?: Function;
32
-        onConferenceJoined?: Function;
33
-        onConferenceWillJoin?: Function;
34
-        onConferenceLeft?: Function;
35
-        onParticipantJoined?: Function;
36
-        settings?: {
37
-            startWithAudioMuted?: boolean;
38
-            startAudioOnly?: boolean;
39
-            startWithVideoMuted?: boolean;
40
-        },
41
-        userInfo: IUserInfo
42
-    };
35
+    eventListeners: IEventListeners;
36
+    room: string;
37
+    serverURL?: string;
43 38
     style?: Object;
39
+    token?: string;
40
+    userInfo?: IUserInfo;
44 41
 }
45 42
 
46 43
 /**
47 44
  * Main React Native SDK component that displays a Jitsi Meet conference and gets all required params as props
48 45
  */
49
-export const JitsiMeeting = forwardRef(({ flags, meetingOptions, style }: IAppProps, ref) => {
46
+export const JitsiMeeting = forwardRef((props: IAppProps, ref) => {
50 47
     const [ appProps, setAppProps ] = useState({});
51 48
     const app = useRef(null);
49
+    const {
50
+        config,
51
+        eventListeners,
52
+        flags,
53
+        room,
54
+        serverURL,
55
+        style,
56
+        token,
57
+        userInfo
58
+    } = props;
52 59
 
53 60
     // eslint-disable-next-line arrow-body-style
54 61
     useImperativeHandle(ref, () => ({
@@ -71,32 +78,44 @@ export const JitsiMeeting = forwardRef(({ flags, meetingOptions, style }: IAppPr
71 78
 
72 79
     useEffect(
73 80
         () => {
74
-            const url = `${meetingOptions.domain}/${meetingOptions.roomName}`;
81
+            const urlObj = {
82
+                config,
83
+                jwt: token
84
+            };
85
+
86
+            let urlProps;
87
+
88
+            if (room.includes('://')) {
89
+                urlProps = {
90
+                    ...urlObj,
91
+                    url: room
92
+                };
93
+            } else {
94
+                urlProps = {
95
+                    ...urlObj,
96
+                    room,
97
+                    serverURL
98
+                };
99
+            }
75 100
 
76 101
             setAppProps({
77
-                'url': {
78
-                    url,
79
-                    config: meetingOptions.settings
80
-                },
102
+                'flags': flags,
81 103
                 'rnSdkHandlers': {
82
-                    onReadyToClose: meetingOptions.onReadyToClose,
83
-                    onConferenceJoined: meetingOptions.onConferenceJoined,
84
-                    onConferenceWillJoin: meetingOptions.onConferenceWillJoin,
85
-                    onConferenceLeft: meetingOptions.onConferenceLeft,
86
-                    onParticipantJoined: meetingOptions.onParticipantJoined
104
+                    onReadyToClose: eventListeners.onReadyToClose,
105
+                    onConferenceJoined: eventListeners.onConferenceJoined,
106
+                    onConferenceWillJoin: eventListeners.onConferenceWillJoin,
107
+                    onConferenceLeft: eventListeners.onConferenceLeft,
108
+                    onParticipantJoined: eventListeners.onParticipantJoined
87 109
                 },
88
-                'flags': { ...flags },
89
-                'userInfo': {
90
-                    ...meetingOptions.userInfo
91
-                }
110
+                'url': urlProps,
111
+                'userInfo': userInfo
92 112
             });
93 113
         }, []
94 114
     );
95 115
 
96 116
     return (
97
-        <View style = { style }>
117
+        <View style = { style as ViewStyle }>
98 118
             <JitsiThemePaperProvider>
99
-                {/* @ts-ignore */}
100 119
                 <App
101 120
                     { ...appProps }
102 121
                     ref = { app } />

+ 19
- 7
react-native-sdk/package-lock.json 查看文件

@@ -1,12 +1,12 @@
1 1
 {
2 2
     "name": "@jitsi/react-native-sdk",
3
-    "version": "0.1.0",
3
+    "version": "0.2.2",
4 4
     "lockfileVersion": 2,
5 5
     "requires": true,
6 6
     "packages": {
7 7
         "": {
8 8
             "name": "@jitsi/react-native-sdk",
9
-            "version": "0.1.0",
9
+            "version": "0.2.2",
10 10
             "hasInstallScript": true,
11 11
             "license": "Apache-2.0",
12 12
             "dependencies": {
@@ -28,7 +28,7 @@
28 28
                 "js-md5": "0.6.1",
29 29
                 "js-sha512": "0.8.0",
30 30
                 "jwt-decode": "2.2.0",
31
-                "lib-jitsi-meet": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1662.0.0+6c4381c8/lib-jitsi-meet.tgz",
31
+                "lib-jitsi-meet": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1670.0.0+10ebc843/lib-jitsi-meet.tgz",
32 32
                 "lodash": "4.17.21",
33 33
                 "moment": "2.29.4",
34 34
                 "moment-duration-format": "2.2.2",
@@ -823,6 +823,11 @@
823 823
                 "@svgr/core": "*"
824 824
             }
825 825
         },
826
+        "node_modules/@testrtc/watchrtc-sdk": {
827
+            "version": "1.36.3",
828
+            "resolved": "https://registry.npmjs.org/@testrtc/watchrtc-sdk/-/watchrtc-sdk-1.36.3.tgz",
829
+            "integrity": "sha512-JtcTvvh20t553n8q5ZHpWQeSUTENkQrZbGNvQ05jD8SA2V5PHBok/7my1ZDuA44sgT0y1OfUA8VT7dhcs0VxWg=="
830
+        },
826 831
         "node_modules/@trysound/sax": {
827 832
             "version": "0.2.0",
828 833
             "resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
@@ -2443,8 +2448,8 @@
2443 2448
         },
2444 2449
         "node_modules/lib-jitsi-meet": {
2445 2450
             "version": "0.0.0",
2446
-            "resolved": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1662.0.0+6c4381c8/lib-jitsi-meet.tgz",
2447
-            "integrity": "sha512-jEQv0imqSPHowBOsd8178fPLUNTj0SavUQnWJIjEjFW4kE4KA+jBlU2C9qryEFwqJ2NjFo7md6H/xz8u+tW1mA==",
2451
+            "resolved": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1670.0.0+10ebc843/lib-jitsi-meet.tgz",
2452
+            "integrity": "sha512-kTHkhQiuLn28wrDhzcgDwJTJ106bgWMgARxgVZpFM1FyRjgJt2e9pn6mZtjEKT5FZeUcUtpy9cDuU6+yLusZEw==",
2448 2453
             "hasInstallScript": true,
2449 2454
             "license": "Apache-2.0",
2450 2455
             "dependencies": {
@@ -2452,6 +2457,7 @@
2452 2457
                 "@jitsi/logger": "2.0.0",
2453 2458
                 "@jitsi/sdp-interop": "git+https://github.com/jitsi/sdp-interop#3d49eb4aa26863a3f8d32d7581cdb4321244266b",
2454 2459
                 "@jitsi/sdp-simulcast": "0.4.0",
2460
+                "@testrtc/watchrtc-sdk": "1.36.3",
2455 2461
                 "async-es": "3.2.4",
2456 2462
                 "base64-js": "1.3.1",
2457 2463
                 "current-executing-script": "0.1.3",
@@ -4200,6 +4206,11 @@
4200 4206
                 "svgo": "^2.8.0"
4201 4207
             }
4202 4208
         },
4209
+        "@testrtc/watchrtc-sdk": {
4210
+            "version": "1.36.3",
4211
+            "resolved": "https://registry.npmjs.org/@testrtc/watchrtc-sdk/-/watchrtc-sdk-1.36.3.tgz",
4212
+            "integrity": "sha512-JtcTvvh20t553n8q5ZHpWQeSUTENkQrZbGNvQ05jD8SA2V5PHBok/7my1ZDuA44sgT0y1OfUA8VT7dhcs0VxWg=="
4213
+        },
4203 4214
         "@trysound/sax": {
4204 4215
             "version": "0.2.0",
4205 4216
             "resolved": "https://registry.npmjs.org/@trysound/sax/-/sax-0.2.0.tgz",
@@ -5349,13 +5360,14 @@
5349 5360
             }
5350 5361
         },
5351 5362
         "lib-jitsi-meet": {
5352
-            "version": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1662.0.0+6c4381c8/lib-jitsi-meet.tgz",
5353
-            "integrity": "sha512-jEQv0imqSPHowBOsd8178fPLUNTj0SavUQnWJIjEjFW4kE4KA+jBlU2C9qryEFwqJ2NjFo7md6H/xz8u+tW1mA==",
5363
+            "version": "https://github.com/jitsi/lib-jitsi-meet/releases/download/v1670.0.0+10ebc843/lib-jitsi-meet.tgz",
5364
+            "integrity": "sha512-kTHkhQiuLn28wrDhzcgDwJTJ106bgWMgARxgVZpFM1FyRjgJt2e9pn6mZtjEKT5FZeUcUtpy9cDuU6+yLusZEw==",
5354 5365
             "requires": {
5355 5366
                 "@jitsi/js-utils": "2.0.0",
5356 5367
                 "@jitsi/logger": "2.0.0",
5357 5368
                 "@jitsi/sdp-interop": "git+https://github.com/jitsi/sdp-interop#3d49eb4aa26863a3f8d32d7581cdb4321244266b",
5358 5369
                 "@jitsi/sdp-simulcast": "0.4.0",
5370
+                "@testrtc/watchrtc-sdk": "1.36.3",
5359 5371
                 "async-es": "3.2.4",
5360 5372
                 "base64-js": "1.3.1",
5361 5373
                 "current-executing-script": "0.1.3",

+ 3
- 3
react-native-sdk/package.json 查看文件

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

Loading…
取消
儲存