diff --git a/react/features/conference/components/native/Conference.js b/react/features/conference/components/native/Conference.js index f77012ca0..bb656f3c5 100644 --- a/react/features/conference/components/native/Conference.js +++ b/react/features/conference/components/native/Conference.js @@ -6,7 +6,6 @@ import LinearGradient from 'react-native-linear-gradient'; import { appNavigate } from '../../../app'; import { PIP_ENABLED, getFeatureFlag } from '../../../base/flags'; -import { getParticipantCount } from '../../../base/participants'; import { Container, LoadingIndicator, TintedView } from '../../../base/react'; import { connect } from '../../../base/redux'; import { @@ -27,7 +26,7 @@ import { LargeVideo } from '../../../large-video'; import { BackButtonRegistry } from '../../../mobile/back-button'; import { AddPeopleDialog, CalleeInfoContainer } from '../../../invite'; import { Captions } from '../../../subtitles'; -import { setToolboxVisible, Toolbox } from '../../../toolbox'; +import { isToolboxVisible, setToolboxVisible, Toolbox } from '../../../toolbox'; import { AbstractConference, @@ -73,13 +72,6 @@ type Props = AbstractProps & { */ _largeVideoParticipantId: string, - /** - * The number of participants in the conference. - * - * @private - */ - _participantCount: number, - /** * Whether Picture-in-Picture is enabled. * @@ -147,35 +139,6 @@ class Conference extends AbstractConference { */ componentDidMount() { BackButtonRegistry.addListener(this._onHardwareBackPress); - - // Show the toolbox if we are the only participant; otherwise, the whole - // UI looks too unpopulated the LargeVideo visible. - this.props._participantCount === 1 && this._setToolboxVisible(true); - } - - /** - * Implements React's {@link Component#componentDidUpdate()}. - * - * @inheritdoc - */ - componentDidUpdate(prevProps: Props) { - const { - _participantCount: oldParticipantCount - } = prevProps; - const { - _participantCount: newParticipantCount, - _toolboxVisible - } = this.props; - - if (oldParticipantCount === 1 - && newParticipantCount > 1 - && _toolboxVisible) { - this._setToolboxVisible(false); - } else if (oldParticipantCount > 1 - && newParticipantCount === 1 - && !_toolboxVisible) { - this._setToolboxVisible(true); - } } /** @@ -418,7 +381,6 @@ function _mapStateToProps(state) { leaving } = state['features/base/conference']; const { reducedUI } = state['features/base/responsive-ui']; - const { visible } = state['features/toolbox']; // XXX There is a window of time between the successful establishment of the // XMPP connection and the subsequent commencement of joining the MUC during @@ -464,14 +426,6 @@ function _mapStateToProps(state) { */ _largeVideoParticipantId: state['features/large-video'].participantId, - /** - * The number of participants in the conference. - * - * @private - * @type {number} - */ - _participantCount: getParticipantCount(state), - /** * Whether Picture-in-Picture is enabled. * @@ -495,7 +449,7 @@ function _mapStateToProps(state) { * @private * @type {boolean} */ - _toolboxVisible: visible + _toolboxVisible: isToolboxVisible(state) }; } diff --git a/react/features/toolbox/functions.native.js b/react/features/toolbox/functions.native.js index 4b24a01cc..27a90ea7d 100644 --- a/react/features/toolbox/functions.native.js +++ b/react/features/toolbox/functions.native.js @@ -10,8 +10,9 @@ import { toState } from '../base/redux'; * @returns {boolean} */ export function isToolboxVisible(stateful: Object | Function) { - const { alwaysVisible, enabled, visible } - = toState(stateful)['features/toolbox']; + const state = toState(stateful); + const { alwaysVisible, enabled, visible } = state['features/toolbox']; + const { length: participantCount } = state['features/base/participants']; - return enabled && (alwaysVisible || visible); + return enabled && (alwaysVisible || visible || participantCount === 1); }