fix typo issues and centralize the participant info with the "getPart…

…icipantInfoFromJwt" function remove middleware.js from jane-wating-area component add getParticipantType function to return participant type from store. update checkRoomStatus, getRemoteParticipantsReadyStatus & updateParticipantReadyStatus functions.
janeapp · Oct 19, 2020 · bfd4652 · bfd4652
1 parent ed596cf
commit bfd4652
Show file tree

Hide file tree

Showing 11 changed files with 120 additions and 106 deletions.
diff --git a/react/features/base/conference/actions.js b/react/features/base/conference/actions.js
@@ -27,7 +27,7 @@ import {
 import { getLocalTracks, trackAdded, trackRemoved } from '../tracks';
 import {
     getBackendSafeRoomName,
-    getJitsiMeetGlobalNS
+    getJitsiMeetGlobalNS, sendBeaconToJaneRN
 } from '../util';
 
 import {
@@ -417,7 +417,7 @@ export function conferenceWillLeave(conference: Object) {
             if (url && surveyUrl) {
 
                 Linking.openURL(surveyUrl).then(() => {
-                    sendBeaconRn(url, data).then(r => {
+                    sendBeaconToJaneRN(url, data).then(r => {
                         console.log(r, 'response');
                     })
                      .catch(e => {
@@ -434,18 +434,6 @@ export function conferenceWillLeave(conference: Object) {
     };
 }
 
-
-// eslint-disable-next-line require-jsdoc,no-unused-vars,no-empty-function
-export function sendBeaconRn(url, data) {
-    return fetch(url, {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'text/plain; charset=UTF-8'
-        },
-        body: data
-    });
-}
-
 /**
  * Initializes a new conference.
  *

diff --git a/react/features/base/conference/functions.js b/react/features/base/conference/functions.js
@@ -21,6 +21,7 @@ import {
     VIDEO_QUALITY_LEVELS
 } from './constants';
 import logger from './logger';
+import jwtDecode from 'jwt-decode';
 
 /**
  * Attach a set of local tracks to a conference.
@@ -351,3 +352,15 @@ export function sendLocalParticipant(
 
     conference.setDisplayName(name);
 }
+
+export function isJaneTestMode(state) {
+    const { jwt } = state['features/base/jwt'];
+    const jwtPayload = jwt && jwtDecode(jwt) || null;
+    const context = jwtPayload && jwtPayload.context || null;
+    const user = context && context.user || null;
+    const participantId = user && user.participant_id;
+    const videoChatSessionId = context && context.video_chat_session_id;
+    const participantEmail = user && user.email;
+
+    return participantId === 0 && videoChatSessionId === 0 && participantEmail === '[email protected]';
+}
diff --git a/react/features/base/react/components/native/WaitingMessage.js b/react/features/base/react/components/native/WaitingMessage.js
@@ -10,6 +10,7 @@ import { getRemoteTracks } from '../../../tracks';
 import jwtDecode from 'jwt-decode';
 import View from 'react-native-webrtc/RTCView';
 import moment from 'moment';
+import { isJaneTestMode } from '../../../conference';
 
 const watermarkImg = require('../../../../../../images/watermark.png');
 
@@ -115,18 +116,8 @@ class WaitingMessage extends Component<Props, State> {
         );
     }
 
-    _IsTestMode() {
-        const { jwt } = this.props;
-        const jwtPayload = jwt && jwtDecode(jwt) || null;
-        const participantId = jwtPayload && jwtPayload.context && jwtPayload.context.user && jwtPayload.context.user.participant_id;
-        const videoChatSessionId = jwtPayload && jwtPayload.context && jwtPayload.context.video_chat_session_id;
-        const participantEmail = jwtPayload && jwtPayload.context && jwtPayload.context.user && jwtPayload.context.user.email;
-
-        return jwtPayload && participantId === 0 && videoChatSessionId === 0 && participantEmail === '[email protected]';
-    }
-
     getWaitingMessage() {
-        const { waitingMessageFromProps } = this.props;
+        const { waitingMessageFromProps, isJaneTestMode } = this.props;
         const { beforeAppointmentStart, appointmentStartAt } = this.state;
 
         let header = <Text
@@ -149,7 +140,7 @@ class WaitingMessage extends Component<Props, State> {
                         .format('hh:mm A')}</Text>);
         }
 
-        if (this._IsTestMode()) {
+        if (isJaneTestMode) {
             header =
                 <Text style={styles.waitingMessageHeader}>Testing your audio and
                     video...</Text>;
@@ -205,7 +196,8 @@ function _mapStateToProps(state) {
     return {
         jwt,
         appstate: appstate && appstate.appState,
-        conferenceHasStarted: participantCount > 1 && remoteTracks.length > 0
+        conferenceHasStarted: participantCount > 1 && remoteTracks.length > 0,
+        isJaneTestMode: isJaneTestMode(state)
     };
 }
 

diff --git a/react/features/base/util/httpUtils.js b/react/features/base/util/httpUtils.js
@@ -42,3 +42,21 @@ export function doGetJSON(url, retry) {
 
     return fetchPromise;
 }
+
+
+// send beacon to jane
+export function sendBeaconToJaneRN(url, data, errorMsg = null) {
+    return fetch(url, {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'text/plain; charset=UTF-8'
+        },
+        body: data
+    })
+        .then(res => {
+            if (!res.ok) {
+                const errorMsg = errorMsg ? errorMsg : res.statusText;
+                throw Error(errorMsg);
+            }
+        });
+}
diff --git a/react/features/conference/components/native/Conference.js b/react/features/conference/components/native/Conference.js
@@ -39,8 +39,11 @@ import NavigationBar from './NavigationBar';
 import styles, { NAVBAR_GRADIENT_COLORS } from './styles';
 
 import type { AbstractProps } from '../AbstractConference';
-import { updateParticipantReadyStatus } from '../../../jane-waiting-area-native';
-import jwtDecode from 'jwt-decode';
+import {
+    getLocalParticipantFromJwt,
+    getLocalParticipantType,
+    updateParticipantReadyStatus
+} from '../../../jane-waiting-area-native';
 
 /**
  * The type of the React {@code Component} props of {@link Conference}.
@@ -170,13 +173,12 @@ class Conference extends AbstractConference<Props, *> {
      * @returns {void}
      */
     componentDidUpdate(prevProps) {
-        const { _participantType, _jwt, _jwtPayload, _participant } = this.props;
+        const { _participantType, _jwt, _participant } = this.props;
         if (prevProps._appstate !== this.props._appstate && prevProps._appstate.appState === 'active') {
-            updateParticipantReadyStatus(_jwt, _jwtPayload, _participantType, _participant, 'left');
+            updateParticipantReadyStatus(_jwt, _participantType, _participant, 'left');
         }
     }
 
-
     /**
      * Implements React's {@link Component#render()}.
      *
@@ -459,9 +461,6 @@ function _mapStateToProps(state) {
     const connecting_
         = connecting || (connection && (joining || (!conference && !leaving)));
     const { jwt } = state['features/base/jwt'];
-    const jwtPayload = jwt && jwtDecode(jwt) || null;
-    const participant = jwtPayload && jwtPayload.context && jwtPayload.context.user || null;
-    const participantType = participant && participant.participant_type || null;
     const appstate = state['features/background'];
 
     return {
@@ -522,9 +521,8 @@ function _mapStateToProps(state) {
         _toolboxVisible: isToolboxVisible(state),
         _enableJaneWaitingAreaPage: enableJaneWaitingAreaPage,
         _jwt: jwt,
-        _jwtPayload: jwtPayload,
-        _participantType: participantType,
-        _participant: participantType,
+        _participantType: getLocalParticipantType(state),
+        _participant: getLocalParticipantFromJwt(state),
         _appstate: appstate
     };
 }

diff --git a/react/features/jane-waiting-area-native/components/DialogBox.native.js b/react/features/jane-waiting-area-native/components/DialogBox.native.js
@@ -4,7 +4,9 @@ import React, { Component } from 'react';
 import { Image, Text, View } from 'react-native';
 import { connect } from '../../base/redux';
 import {
-    getRemoteParticipantsReadyStatus,
+    checkLocalParticipantCanJoin,
+    checkRoomStatus,
+    getLocalParticipantFromJwt, getLocalParticipantType,
     updateParticipantReadyStatus
 } from '../functions';
 import jwtDecode from 'jwt-decode';
@@ -84,10 +86,13 @@ class DialogBox extends Component<Props, State> {
     }
 
     async _polling() {
-        const { jwt, jwtPayload, participantType, updateRemoteParticipantsStatus } = this.props;
-        const remoteParticipantsStatus = await getRemoteParticipantsReadyStatus(jwt, jwtPayload, participantType);
+        const { jwt, participantType } = this.props;
+        const response = await checkRoomStatus(jwt);
+        const localParticipantCanJoin = response && await checkLocalParticipantCanJoin(response.participant_statuses, participantType);
 
-        updateRemoteParticipantsStatus(remoteParticipantsStatus);
+        this.setState({
+            localParticipantCanJoin
+        });
     }
 
     _pollForReadyStatus() {
@@ -96,10 +101,10 @@ class DialogBox extends Component<Props, State> {
 
     _joinConference() {
         const {
-            startConference, participantType, enableJaneWaitingAreaPage, jwt, jwtPayload, participant
+            startConference, participantType, enableJaneWaitingAreaPage, jwt, participant
         } = this.props;
 
-        updateParticipantReadyStatus(jwt, jwtPayload, participantType, participant, 'joined');
+        updateParticipantReadyStatus(jwt, participantType, participant, 'joined');
         enableJaneWaitingAreaPage(false);
         startConference();
     }
@@ -128,14 +133,14 @@ class DialogBox extends Component<Props, State> {
 
         if (participantType === 'StaffMember') {
             if (!localParticipantCanJoin) {
-                header = 'Waiting for the client...';
+                header = 'Waiting for your client...';
             } else {
-                header = 'The patient is ready to begin your session';
+                header = 'Your patient is ready to begin the session.';
             }
         } else if (!localParticipantCanJoin) {
-            header = 'The pratitioner will let you into the session when they are ready...';
+            header = 'Your practitioner will let you into the session when ready...';
         } else {
-            header = 'The pratitioner is ready to begin your session';
+            header = 'Your practitioner is ready to begin the session.';
         }
 
         return <Text style = { styles.title }>{header}</Text>;
@@ -217,19 +222,20 @@ class DialogBox extends Component<Props, State> {
 
     onMessageUpdate(event) {
         const webViewEvent = this.parseJsonMessage(event.nativeEvent.data);
-
+        const remoteParticipantsStatuses = webViewEvent && webViewEvent.remoteParticipantsStatuses || null
+        const socketRemoteParticipantsEvent = webViewEvent && webViewEvent.socketRemoteParticipantsEvent || null
         console.log(webViewEvent, 'incoming web view event');
-        if (webViewEvent && webViewEvent.socketRemoteParticipantsEvent) {
-            const localParticipantCanJoin = webViewEvent.socketRemoteParticipantsEvent.info
-                && webViewEvent.socketRemoteParticipantsEvent.info.status !== 'left';
 
+        if (socketRemoteParticipantsEvent) {
+            const localParticipantCanJoin = socketRemoteParticipantsEvent.info
+                && socketRemoteParticipantsEvent.info.status !== 'left';
             this.setState({
                 localParticipantCanJoin
             });
         }
-        if (webViewEvent && webViewEvent.remoteParticipantsStatus) {
-            const localParticipantCanJoin = webViewEvent.remoteParticipantsStatus.some(v => v.info && v.info.status !== 'left');
 
+        if (remoteParticipantsStatuses) {
+            const localParticipantCanJoin = remoteParticipantsStatuses.some(v => v.info && v.info.status !== 'left');
             this.setState({
                 localParticipantCanJoin
             });
@@ -312,8 +318,8 @@ class DialogBox extends Component<Props, State> {
 function mapStateToProps(state): Object {
     const { jwt } = state['features/base/jwt'];
     const jwtPayload = jwt && jwtDecode(jwt) || null;
-    const participant = jwtPayload && jwtPayload.context && jwtPayload.context.user || null;
-    const participantType = participant && participant.participant_type || null;
+    const participant = getLocalParticipantFromJwt(state)
+    const participantType = getLocalParticipantType(state)
     const { locationURL } = state['features/base/connection'];
 
     return {

diff --git a/react/features/jane-waiting-area-native/components/JaneWaitingArea.native.js b/react/features/jane-waiting-area-native/components/JaneWaitingArea.native.js
@@ -16,8 +16,8 @@ class JaneWaitingAreaNative extends Component<Props, State> {
     }
 
     render() {
-        return (this.props.appstate.appState === 'active'
-            && <DialogBox />) || null;
+        return (this.props.appstate && this.props.appstate.appState === 'active'
+            && <DialogBox/>) || null;
     }
 }
 

diff --git a/react/features/jane-waiting-area-native/functions.js b/react/features/jane-waiting-area-native/functions.js
@@ -1,13 +1,13 @@
 // @flow
 
 import jwtDecode from 'jwt-decode';
-import { sendBeaconRn } from '../base/conference';
 import { RemoteParticipantStatus } from './RemoteParticipantStatus';
+import { doGetJSON, sendBeaconToJaneRN } from '../base/util';
 
 export function isJaneWaitingAreaPageEnabled(state: Object): boolean {
     const { jwt } = state['features/base/jwt'];
     const jwtPayload = jwt && jwtDecode(jwt) || null;
-    const shouldEnableJaneWaitingAreaPage = jwtPayload && jwtPayload.context && jwtPayload.context.ws_host && jwtPayload.context.ws_token;
+    const shouldEnableJaneWaitingAreaPage = jwtPayload && jwtPayload.context && jwtPayload.context.waiting_area_enabled || false;
 
     return state['features/base/config'].janeWaitingAreaPageEnabled || shouldEnableJaneWaitingAreaPage;
 }
@@ -16,34 +16,35 @@ export function isJaneWaitingAreaPageVisible(state: Object): boolean {
     return isJaneWaitingAreaPageEnabled(state) && state['features/jane-waiting-area-native']?.showJaneWaitingArea;
 }
 
-export async function getAllParticipantsStatus(jwt, jwtPayload) {
-    const url = new URL(jwtPayload.context.check_participants_status_url);
+export async function checkRoomStatus(jwt) {
+    try {
+        const jwtPayload = jwt && jwtDecode(jwt) || null;
+        const roomStatusUrl = jwtPayload && jwtPayload.context && jwtPayload.context.room_status_url || '';
+        const url = new URL(roomStatusUrl);
+        const params = { jwt };
+        url.search = new URLSearchParams(params).toString();
 
-    const params = { jwt };
-
-    url.search = new URLSearchParams(params).toString();
-
-    return fetch(url).then(response => response.json())
-        .then(res => res.participants_status);
+        return doGetJSON(url, true);
+    } catch (e) {
+        console.error(e);
+    }
 }
 
-export async function getRemoteParticipantsReadyStatus(jwt, jwtPayload, participantType) {
-    const allParticipantsStatus = await getAllParticipantsStatus(jwt, jwtPayload);
+export async function getRemoteParticipantsReadyStatus(participantsStatus, participantType) {
     const remoteParticipantType = participantType === 'StaffMember' ? 'Patient' : 'StaffMember';
-    const remoteParticipantStatus = [];
-
-    allParticipantsStatus && allParticipantsStatus.forEach(v => {
+    let remoteParticipantStatus = [];
+    participantsStatus && participantsStatus.forEach((v) => {
         if (v.participant_type === remoteParticipantType) {
             remoteParticipantStatus.push(new RemoteParticipantStatus(v));
         }
     });
-
     return remoteParticipantStatus;
 }
 
-export function updateParticipantReadyStatus(jwt, jwtPayload, participantType, participant, status) {
-    if (jwt && jwtPayload) {
-        const updateParticipantStatusUrl = jwtPayload.context.update_participant_status_url;
+export function updateParticipantReadyStatus(jwt, participantType, participant, status) {
+    try {
+        const jwtPayload = jwt && jwtDecode(jwt) || null;
+        const updateParticipantStatusUrl = jwtPayload && jwtPayload.context && jwtPayload.context.update_participant_status_url || '';
         const info = { status };
         const obj = {
             jwt,
@@ -54,7 +55,28 @@ export function updateParticipantReadyStatus(jwt, jwtPayload, participantType, p
             room_name: jwtPayload.room
         };
         const data = new Blob([ JSON.stringify(obj, null, 2) ], { type: 'text/plain; charset=UTF-8' });
-
-        sendBeaconRn(updateParticipantStatusUrl, data);
+        const errorMsg = 'Can Not Update Current Participant\'s Status.';
+        sendBeaconToJaneRN(updateParticipantStatusUrl, data, errorMsg);
+    } catch (e) {
+        console.error(e);
     }
 }
+
+export function getLocalParticipantFromJwt(state) {
+    const { jwt } = state['features/base/jwt'];
+    const jwtPayload = jwt && jwtDecode(jwt) || null;
+
+    return jwtPayload && jwtPayload.context && jwtPayload.context.user || null;
+}
+
+export function getLocalParticipantType(state) {
+    const participant = getLocalParticipantFromJwt(state);
+
+    return participant && participant.participant_type || null;
+}
+
+export function checkLocalParticipantCanJoin(participant_statuses, participantType) {
+    const remoteParticipantsStatus = participant_statuses && getRemoteParticipantsReadyStatus(participant_statuses, participantType);
+
+    return remoteParticipantsStatus && remoteParticipantsStatus.info && remoteParticipantsStatus.info.status !== 'left' || false;
+}
diff --git a/react/features/jane-waiting-area-native/index.js b/react/features/jane-waiting-area-native/index.js
@@ -3,5 +3,4 @@ export * from './functions';
 
 export { default as JaneWaitingArea } from './components/JaneWaitingArea';
 
-import './middleware';
 import './reducer';
Original file line number	Diff line number	Diff line change
Expand Up		@@ -3,5 +3,4 @@ export * from './functions';

		export { default as JaneWaitingArea } from './components/JaneWaitingArea';

		import './middleware';
		import './reducer';