From b72ca4e97352ce9cdf2fe9d0155d7ab87f0dcb37 Mon Sep 17 00:00:00 2001 From: hmuresan Date: Tue, 24 Aug 2021 16:44:28 +0300 Subject: [PATCH] fix(pre-meeting) Hide invite button for JaaS --- config.js | 4 ++ react/features/base/config/configWhitelist.js | 1 + react/features/base/config/constants.js | 10 +++++ .../components/web/PreMeetingScreen.js | 40 +++++++++++++++---- .../prejoin/components/PrejoinThirdParty.js | 3 +- 5 files changed, 49 insertions(+), 9 deletions(-) diff --git a/config.js b/config.js index 91a471a199..85c7965709 100644 --- a/config.js +++ b/config.js @@ -507,6 +507,10 @@ var config = { // '__end' // ], + // List of pre meeting screens buttons to hide. The values must be one or more of the 5 allowed buttons: + // 'microphone', 'camera', 'select-background', 'invite', 'settings' + // hiddenPremeetingButtons: [], + // Stats // diff --git a/react/features/base/config/configWhitelist.js b/react/features/base/config/configWhitelist.js index 9ff4357c66..4e0b12e9eb 100644 --- a/react/features/base/config/configWhitelist.js +++ b/react/features/base/config/configWhitelist.js @@ -130,6 +130,7 @@ export default [ 'forceTurnRelay', 'gatherStats', 'googleApiApplicationClientID', + 'hiddenPremeetingButtons', 'hideConferenceSubject', 'hideRecordingLabel', 'hideParticipantsStats', diff --git a/react/features/base/config/constants.js b/react/features/base/config/constants.js index 3abca50b4c..812c908ccd 100644 --- a/react/features/base/config/constants.js +++ b/react/features/base/config/constants.js @@ -46,3 +46,13 @@ export const TOOLBAR_BUTTONS = [ 'toggle-camera', 'videoquality' ]; + +/** + * The toolbar buttons to show on premeeting screens. + */ +export const PREMEETING_BUTTONS = [ 'microphone', 'camera', 'select-background', 'invite', 'settings' ]; + +/** + * The toolbar buttons to show on 3rdParty prejoin screen. + */ +export const THIRD_PARTY_PREJOIN_BUTTONS = [ 'microphone', 'camera', 'select-background' ]; diff --git a/react/features/base/premeeting/components/web/PreMeetingScreen.js b/react/features/base/premeeting/components/web/PreMeetingScreen.js index c4ffc2a094..b3cf4a0a62 100644 --- a/react/features/base/premeeting/components/web/PreMeetingScreen.js +++ b/react/features/base/premeeting/components/web/PreMeetingScreen.js @@ -2,14 +2,21 @@ import React, { PureComponent } from 'react'; +import { connect } from '../../../../base/redux'; import DeviceStatus from '../../../../prejoin/components/preview/DeviceStatus'; import { Toolbox } from '../../../../toolbox/components/web'; +import { PREMEETING_BUTTONS, THIRD_PARTY_PREJOIN_BUTTONS } from '../../../config/constants'; import ConnectionStatus from './ConnectionStatus'; import Preview from './Preview'; type Props = { + /** + * The list of toolbar buttons to render. + */ + _buttons: Array, + /** * Children component(s) to be rendered on the screen. */ @@ -46,9 +53,9 @@ type Props = { title?: string, /** - * Override for default toolbar buttons + * Whether it's used in the 3rdParty prejoin screen or not. */ - toolbarButtons?: Array, + thirdParty?: boolean, /** * True if the preview overlay should be muted, false otherwise. @@ -61,13 +68,11 @@ type Props = { videoTrack?: Object } -const buttons = [ 'microphone', 'camera', 'select-background', 'invite', 'settings' ]; - /** * Implements a pre-meeting screen that can be used at various pre-meeting phases, for example * on the prejoin screen (pre-connection) or lobby (post-connection). */ -export default class PreMeetingScreen extends PureComponent { +class PreMeetingScreen extends PureComponent { /** * Default values for {@code Prejoin} component's properties. * @@ -85,12 +90,12 @@ export default class PreMeetingScreen extends PureComponent { */ render() { const { + _buttons, children, className, showDeviceStatus, skipPrejoinButton, title, - toolbarButtons, videoMuted, videoTrack } = this.props; @@ -107,7 +112,7 @@ export default class PreMeetingScreen extends PureComponent { { title } { children } - + { _buttons.length && } { skipPrejoinButton } { showDeviceStatus && } @@ -120,3 +125,24 @@ export default class PreMeetingScreen extends PureComponent { ); } } + + +/** + * Maps (parts of) the redux state to the React {@code Component} props. + * + * @param {Object} state - The redux state. + * @param {Object} ownProps - The props passed to the component. + * @returns {Object} + */ +function mapStateToProps(state, ownProps): Object { + const hideButtons = state['features/base/config'].hiddenPremeetingButtons || []; + const premeetingButtons = ownProps.thirdParty + ? THIRD_PARTY_PREJOIN_BUTTONS + : PREMEETING_BUTTONS; + + return { + _buttons: premeetingButtons.filter(b => !hideButtons.includes(b)) + }; +} + +export default connect(mapStateToProps)(PreMeetingScreen); diff --git a/react/features/prejoin/components/PrejoinThirdParty.js b/react/features/prejoin/components/PrejoinThirdParty.js index 9e64a506ba..273bc7fc73 100644 --- a/react/features/prejoin/components/PrejoinThirdParty.js +++ b/react/features/prejoin/components/PrejoinThirdParty.js @@ -37,7 +37,6 @@ type Props = { videoTrack: ?Object }; -const buttons = [ 'microphone', 'camera', 'select-background' ]; /** * This component is displayed before joining a meeting. @@ -62,7 +61,7 @@ class PrejoinThirdParty extends Component { className = { `prejoin-third-party ${className}` } showDeviceStatus = { deviceStatusVisible } skipPrejoinButton = { false } - toolbarButtons = { buttons } + thirdParty = { true } videoMuted = { !showCameraPreview } videoTrack = { videoTrack } /> );