fix(pre-meeting) Hide invite button for JaaS

This commit is contained in:
hmuresan 2021-08-24 16:44:28 +03:00 committed by Horatiu Muresan
parent 4acafebe5f
commit a892d5fed1
5 changed files with 49 additions and 9 deletions

View File

@ -515,6 +515,10 @@ var config = {
// '__end' // '__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 // Stats
// //

View File

@ -134,6 +134,7 @@ export default [
'forceTurnRelay', 'forceTurnRelay',
'gatherStats', 'gatherStats',
'googleApiApplicationClientID', 'googleApiApplicationClientID',
'hiddenPremeetingButtons',
'hideConferenceSubject', 'hideConferenceSubject',
'hideRecordingLabel', 'hideRecordingLabel',
'hideParticipantsStats', 'hideParticipantsStats',

View File

@ -46,3 +46,13 @@ export const TOOLBAR_BUTTONS = [
'toggle-camera', 'toggle-camera',
'videoquality' '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' ];

View File

@ -2,14 +2,21 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { connect } from '../../../../base/redux';
import DeviceStatus from '../../../../prejoin/components/preview/DeviceStatus'; import DeviceStatus from '../../../../prejoin/components/preview/DeviceStatus';
import { Toolbox } from '../../../../toolbox/components/web'; import { Toolbox } from '../../../../toolbox/components/web';
import { PREMEETING_BUTTONS, THIRD_PARTY_PREJOIN_BUTTONS } from '../../../config/constants';
import ConnectionStatus from './ConnectionStatus'; import ConnectionStatus from './ConnectionStatus';
import Preview from './Preview'; import Preview from './Preview';
type Props = { type Props = {
/**
* The list of toolbar buttons to render.
*/
_buttons: Array<string>,
/** /**
* Children component(s) to be rendered on the screen. * Children component(s) to be rendered on the screen.
*/ */
@ -46,9 +53,9 @@ type Props = {
title?: string, title?: string,
/** /**
* Override for default toolbar buttons * Whether it's used in the 3rdParty prejoin screen or not.
*/ */
toolbarButtons?: Array<string>, thirdParty?: boolean,
/** /**
* True if the preview overlay should be muted, false otherwise. * True if the preview overlay should be muted, false otherwise.
@ -61,13 +68,11 @@ type Props = {
videoTrack?: Object 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 * 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). * on the prejoin screen (pre-connection) or lobby (post-connection).
*/ */
export default class PreMeetingScreen extends PureComponent<Props> { class PreMeetingScreen extends PureComponent<Props> {
/** /**
* Default values for {@code Prejoin} component's properties. * Default values for {@code Prejoin} component's properties.
* *
@ -85,12 +90,12 @@ export default class PreMeetingScreen extends PureComponent<Props> {
*/ */
render() { render() {
const { const {
_buttons,
children, children,
className, className,
showDeviceStatus, showDeviceStatus,
skipPrejoinButton, skipPrejoinButton,
title, title,
toolbarButtons,
videoMuted, videoMuted,
videoTrack videoTrack
} = this.props; } = this.props;
@ -107,7 +112,7 @@ export default class PreMeetingScreen extends PureComponent<Props> {
{ title } { title }
</h1> </h1>
{ children } { children }
<Toolbox toolbarButtons = { toolbarButtons || buttons } /> { _buttons.length && <Toolbox toolbarButtons = { _buttons } /> }
{ skipPrejoinButton } { skipPrejoinButton }
{ showDeviceStatus && <DeviceStatus /> } { showDeviceStatus && <DeviceStatus /> }
</div> </div>
@ -120,3 +125,24 @@ export default class PreMeetingScreen extends PureComponent<Props> {
); );
} }
} }
/**
* 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);

View File

@ -37,7 +37,6 @@ type Props = {
videoTrack: ?Object videoTrack: ?Object
}; };
const buttons = [ 'microphone', 'camera', 'select-background' ];
/** /**
* This component is displayed before joining a meeting. * This component is displayed before joining a meeting.
@ -62,7 +61,7 @@ class PrejoinThirdParty extends Component<Props> {
className = { `prejoin-third-party ${className}` } className = { `prejoin-third-party ${className}` }
showDeviceStatus = { deviceStatusVisible } showDeviceStatus = { deviceStatusVisible }
skipPrejoinButton = { false } skipPrejoinButton = { false }
toolbarButtons = { buttons } thirdParty = { true }
videoMuted = { !showCameraPreview } videoMuted = { !showCameraPreview }
videoTrack = { videoTrack } /> videoTrack = { videoTrack } />
); );