diff --git a/react/features/participants-pane/components/web/FooterContextMenu.js b/react/features/participants-pane/components/web/FooterContextMenu.js
index aafc8e3b3..86e08ab15 100644
--- a/react/features/participants-pane/components/web/FooterContextMenu.js
+++ b/react/features/participants-pane/components/web/FooterContextMenu.js
@@ -27,7 +27,11 @@ import {
getParticipantCount,
isEveryoneModerator
} from '../../../base/participants';
-import { openSettingsDialog, SETTINGS_TABS } from '../../../settings';
+import {
+ SETTINGS_TABS,
+ openSettingsDialog,
+ shouldShowModeratorSettings
+} from '../../../settings';
import { MuteEveryonesVideoDialog } from '../../../video-menu/components';
const useStyles = makeStyles(theme => {
@@ -81,6 +85,7 @@ export const FooterContextMenu = ({ isOpen, onDrawerClose, onMouseLeave }: Props
const dispatch = useDispatch();
const isModerationSupported = useSelector(isAvModerationSupported());
const allModerators = useSelector(isEveryoneModerator);
+ const isModeratorSettingsTabEnabled = useSelector(shouldShowModeratorSettings);
const participantCount = useSelector(getParticipantCount);
const isAudioModerationEnabled = useSelector(isAvModerationEnabled(MEDIA_TYPE.AUDIO));
const isVideoModerationEnabled = useSelector(isAvModerationEnabled(MEDIA_TYPE.VIDEO));
@@ -146,14 +151,16 @@ export const FooterContextMenu = ({ isOpen, onDrawerClose, onMouseLeave }: Props
)}
-
+ {isModeratorSettingsTabEnabled && (
+
+ )}
);
};
diff --git a/react/features/settings/functions.js b/react/features/settings/functions.js
index 1a1789c61..d61a9937b 100644
--- a/react/features/settings/functions.js
+++ b/react/features/settings/functions.js
@@ -153,16 +153,11 @@ export function getModeratorTabProps(stateful: Object | Function) {
} = state['features/base/conference'];
const { disableReactionsModeration } = state['features/base/config'];
const followMeActive = isFollowMeActive(state);
- const configuredTabs = interfaceConfig.SETTINGS_SECTIONS || [];
-
- const showModeratorSettings = Boolean(
- conference
- && configuredTabs.includes('moderator')
- && isLocalParticipantModerator(state));
+ const showModeratorSettings = shouldShowModeratorSettings(state);
// The settings sections to display.
return {
- showModeratorSettings,
+ showModeratorSettings: Boolean(conference && showModeratorSettings),
disableReactionsModeration: Boolean(disableReactionsModeration),
followMeActive: Boolean(conference && followMeActive),
followMeEnabled: Boolean(conference && followMeEnabled),
@@ -172,6 +167,21 @@ export function getModeratorTabProps(stateful: Object | Function) {
};
}
+/**
+ * Returns true if moderator tab in settings should be visible/accessible.
+ *
+ * @param {(Function|Object)} stateful - The (whole) redux state, or redux's
+ * {@code getState} function to be used to retrieve the state.
+ * @returns {boolean} True to indicate that moderator tab should be visible, false otherwise.
+ */
+export function shouldShowModeratorSettings(stateful: Object | Function) {
+ const state = toState(stateful);
+
+ return Boolean(
+ isSettingEnabled('moderator')
+ && isLocalParticipantModerator(state));
+}
+
/**
* Returns the properties for the "Profile" tab from settings dialog from Redux
* state.