fix(av-moderation,breakout-rooms) disable controls on breakout rooms

AV moderation does not work on brerakout rooms.

Since some of the options in the "breakoutRooms" config section no
longer apply, I moved the relevant ones to a new "participantsPane"
section.

config.js

@@ -1108,22 +1108,24 @@ var config = {
     */
     // dynamicBrandingUrl: '',
 
+    // Options related to the participants pane.
+    // participantsPane: {
+    //     // Hides the moderator settings tab.
+    //     hideModeratorSettingsTab: false,
+    //     // Hides the more actions button.
+    //     hideMoreActionsButton: false,
+    //     // Hides the mute all button.
+    //     hideMuteAllButton: false
+    // },
+
     // Options related to the breakout rooms feature.
     // breakoutRooms: {
     //     // Hides the add breakout room button. This replaces `hideAddRoomButton`.
     //     hideAddRoomButton: false,
     //     // Hides the auto assign participants button.
     //     hideAutoAssignButton: false,
-    //     // Hides the participants pane footer menu.
-    //     hideFooterMenu: false,
     //     // Hides the join breakout room button.
-    //     hideJoinRoomButton: false,
-    //     // Hides the moderator settings tab.
-    //     hideModeratorSettingsTab: false,
-    //     // Hides the more actions button.
-    //     hideMoreActionsButton: false,
-    //     // Hides the mute all button.
-    //     hideMuteAllButton: false
+    //     hideJoinRoomButton: false
     // },
 
     // When true the user cannot add more images to be used as virtual background.

react/features/base/config/configWhitelist.js

@@ -192,6 +192,7 @@ export default [
     'openSharedDocumentOnJoin',
     'opusMaxAverageBitrate',
     'p2p',
+    'participantsPane',
     'pcStatsInterval',
     'preferH264',
     'preferredCodec',

react/features/participants-pane/components/native/ParticipantsPane.js

@@ -20,7 +20,7 @@ import {
 import { getKnockingParticipants } from '../../../lobby/functions';
 import MuteEveryoneDialog
     from '../../../video-menu/components/native/MuteEveryoneDialog';
-import { isFooterMenuVisible, isMoreActionsVisible, isMuteAllVisible } from '../../functions';
+import { isMoreActionsVisible, isMuteAllVisible } from '../../functions';
 import {
     AddBreakoutRoomButton,
     AutoAssignButton,
@@ -57,7 +57,6 @@ const ParticipantsPane = () => {
     const inBreakoutRoom = useSelector(isInBreakoutRoom);
     const showAddBreakoutRoom = useSelector(isAddBreakoutRoomButtonVisible);
     const showAutoAssign = useSelector(isAutoAssignParticipantsVisible);
-    const showFooterMenu = useSelector(isFooterMenuVisible);
     const showMoreActions = useSelector(isMoreActionsVisible);
     const showMuteAll = useSelector(isMuteAllVisible);
     const lobbyParticipants = useSelector(getKnockingParticipants);
@@ -88,7 +87,7 @@ const ParticipantsPane = () => {
                 showAddBreakoutRoom && <AddBreakoutRoomButton />
             }
             {
-                showFooterMenu
+                isLocalModerator
                 && <View style = { styles.participantsPaneFooter }>
                     {
                         showMuteAll && (

react/features/participants-pane/components/web/ParticipantsPane.js

@@ -7,6 +7,7 @@ import participantsPaneTheme from '../../../base/components/themes/participantsP
 import { openDialog } from '../../../base/dialog';
 import { translate } from '../../../base/i18n';
 import { Icon, IconClose, IconHorizontalPoints } from '../../../base/icons';
+import { isLocalParticipantModerator } from '../../../base/participants/functions';
 import { connect } from '../../../base/redux';
 import { isAddBreakoutRoomButtonVisible } from '../../../breakout-rooms/functions';
 import { MuteEveryoneDialog } from '../../../video-menu/components/';
@@ -14,7 +15,6 @@ import { close } from '../../actions';
 import {
     findAncestorByClass,
     getParticipantsPaneOpen,
-    isFooterMenuVisible,
     isMoreActionsVisible,
     isMuteAllVisible
 } from '../../functions';
@@ -402,7 +402,7 @@ function _mapStateToProps(state: Object) {
         _isBreakoutRoomsSupported,
         _paneOpen: isPaneOpen,
         _showAddRoomButton: isAddBreakoutRoomButtonVisible(state),
-        _showFooter: isFooterMenuVisible(state),
+        _showFooter: isLocalParticipantModerator(state),
         _showMuteAllButton: isMuteAllVisible(state),
         _showMoreActionsButton: isMoreActionsVisible(state)
     };

react/features/participants-pane/functions.js

@@ -18,7 +18,7 @@ import {
 } from '../base/participants/functions';
 import { toState } from '../base/redux';
 import { normalizeAccents } from '../base/util/strings';
-import { getBreakoutRoomsConfig, isInBreakoutRoom } from '../breakout-rooms/functions';
+import { isInBreakoutRoom } from '../breakout-rooms/functions';
 
 import { QUICK_ACTION_BUTTON, REDUCER_KEY, MEDIA_STATE } from './constants';
 
@@ -141,6 +141,20 @@ export const getComputedOuterHeight = (element: HTMLElement) => {
  */
 const getState = (state: Object) => state[REDUCER_KEY];
 
+/**
+ * Returns the participants pane config.
+ *
+ * @param {Function|Object} stateful - The redux store, the redux
+ * {@code getState} function, or the redux state itself.
+ * @returns {Object}
+ */
+export const getParticipantsPaneConfig = (stateful: Function | Object) => {
+    const state = toState(stateful);
+    const { participantsPane = {} } = state['features/base/config'];
+
+    return participantsPane;
+};
+
 /**
  * Is the participants pane open.
  *
@@ -262,22 +276,6 @@ export function participantMatchesSearch(participant: Object, searchString: stri
     return false;
 }
 
-/**
- * Returns whether the participants pane footer menu is visible.
- *
- * @param {Object} state - Global state.
- * @returns {boolean}
- */
-export const isFooterMenuVisible = (state: Object) => {
-    const isLocalModerator = isLocalParticipantModerator(state);
-    const inBreakoutRoom = isInBreakoutRoom(state);
-    const { hideFooterMenu } = getBreakoutRoomsConfig(state);
-
-    return inBreakoutRoom
-        ? !hideFooterMenu && isLocalModerator
-        : isLocalModerator;
-};
-
 /**
  * Returns whether the more actions button is visible.
  *
@@ -285,12 +283,11 @@ export const isFooterMenuVisible = (state: Object) => {
  * @returns {boolean}
  */
 export const isMoreActionsVisible = (state: Object) => {
+    const isLocalModerator = isLocalParticipantModerator(state);
     const inBreakoutRoom = isInBreakoutRoom(state);
-    const { hideMoreActionsButton } = getBreakoutRoomsConfig(state);
+    const { hideMoreActionsButton } = getParticipantsPaneConfig(state);
 
-    return inBreakoutRoom
-        ? !hideMoreActionsButton
-        : true;
+    return inBreakoutRoom ? false : !hideMoreActionsButton && isLocalModerator;
 };
 
 /**
@@ -300,10 +297,9 @@ export const isMoreActionsVisible = (state: Object) => {
  * @returns {boolean}
  */
 export const isMuteAllVisible = (state: Object) => {
+    const isLocalModerator = isLocalParticipantModerator(state);
     const inBreakoutRoom = isInBreakoutRoom(state);
-    const { hideMuteAllButton } = getBreakoutRoomsConfig(state);
+    const { hideMuteAllButton } = getParticipantsPaneConfig(state);
 
-    return inBreakoutRoom
-        ? !hideMuteAllButton
-        : true;
+    return inBreakoutRoom ? false : !hideMuteAllButton && isLocalModerator;
 };

react/features/settings/functions.js

@@ -11,9 +11,9 @@ import {
 import { toState } from '../base/redux';
 import { getHideSelfView } from '../base/settings';
 import { parseStandardURIString } from '../base/util';
-import { getBreakoutRoomsConfig, isInBreakoutRoom } from '../breakout-rooms/functions';
 import { isStageFilmstripEnabled } from '../filmstrip/functions';
 import { isFollowMeActive } from '../follow-me';
+import { getParticipantsPaneConfig } from '../participants-pane/functions';
 import { isReactionsEnabled } from '../reactions/functions.any';
 
 import { SS_DEFAULT_FRAME_RATE, SS_SUPPORTED_FRAMERATES } from './constants';
@@ -181,16 +181,10 @@ export function getModeratorTabProps(stateful: Object | Function) {
  */
 export function shouldShowModeratorSettings(stateful: Object | Function) {
     const state = toState(stateful);
-    const inBreakoutRoom = isInBreakoutRoom(state);
-    const { hideModeratorSettingsTab } = getBreakoutRoomsConfig(state);
-    const hasModeratorRights = Boolean(
-        isSettingEnabled('moderator')
-        && isLocalParticipantModerator(state)
-    );
-
-    return inBreakoutRoom
-        ? hasModeratorRights && !hideModeratorSettingsTab
-        : hasModeratorRights;
+    const { hideModeratorSettingsTab } = getParticipantsPaneConfig(state);
+    const hasModeratorRights = Boolean(isSettingEnabled('moderator') && isLocalParticipantModerator(state));
+
+    return hasModeratorRights && !hideModeratorSettingsTab;
 }
 
 /**