feat(mobile) adds feature flags for audioMute, videoMute and overflow… (#8537)

react/features/base/flags/constants.js

@@ -6,6 +6,12 @@
  */
 export const ADD_PEOPLE_ENABLED = 'add-people.enabled';
 
+/**
+ * Flag indicating if the audio mute button should be displayed.
+ * Default: enabled (true).
+ */
+export const AUDIO_MUTE_BUTTON_ENABLED = 'audio-mute.enabled';
+
 /**
  * Flag indicating if calendar integration should be enabled.
  * Default: enabled (true) on Android, auto-detected on iOS.
@@ -81,13 +87,18 @@ export const MEETING_NAME_ENABLED = 'meeting-name.enabled';
  */
 export const MEETING_PASSWORD_ENABLED = 'meeting-password.enabled';
 
-
 /**
  * Flag indicating if the notifications should be enabled.
  * Default: enabled (true).
  */
 export const NOTIFICATIONS_ENABLED = 'notifications.enabled';
 
+/**
+ * Flag indicating if the audio overflow menu button should be displayed.
+ * Default: enabled (true).
+ */
+export const OVERFLOW_MENU_ENABLED = 'overflow-menu.enabled';
+
 /**
  * Flag indicating if Picture-in-Picture should be enabled.
  * Default: auto-detected.
@@ -137,6 +148,12 @@ export const TOOLBOX_ALWAYS_VISIBLE = 'toolbox.alwaysVisible';
  */
 export const TOOLBOX_ENABLED = 'toolbox.enabled';
 
+/**
+ * Flag indicating if the video mute button should be displayed.
+ * Default: enabled (true).
+ */
+export const VIDEO_MUTE_BUTTON_ENABLED = 'video-mute.enabled';
+
 /**
  * Flag indicating if the video share button should be enabled
  * Default: enabled (true).

react/features/toolbox/components/AudioMuteButton.js

@@ -6,6 +6,7 @@ import {
     createShortcutEvent,
     sendAnalytics
 } from '../../analytics';
+import { getFeatureFlag, AUDIO_MUTE_BUTTON_ENABLED } from '../../base/flags';
 import { translate } from '../../base/i18n';
 import { MEDIA_TYPE } from '../../base/media';
 import { connect } from '../../base/redux';
@@ -151,10 +152,12 @@ class AudioMuteButton extends AbstractAudioMuteButton<Props, *> {
 function _mapStateToProps(state): Object {
     const _audioMuted = isLocalTrackMuted(state['features/base/tracks'], MEDIA_TYPE.AUDIO);
     const _disabled = state['features/base/config'].startSilent;
+    const enabledFlag = getFeatureFlag(state, AUDIO_MUTE_BUTTON_ENABLED, true);
 
     return {
         _audioMuted,
-        _disabled
+        _disabled,
+        visible: enabledFlag
     };
 }
 

react/features/toolbox/components/VideoMuteButton.js

@@ -9,6 +9,7 @@ import {
     sendAnalytics
 } from '../../analytics';
 import { setAudioOnly } from '../../base/audio-only';
+import { getFeatureFlag, VIDEO_MUTE_BUTTON_ENABLED } from '../../base/flags';
 import { translate } from '../../base/i18n';
 import {
     VIDEO_MUTISM_AUTHORITY,
@@ -187,12 +188,14 @@ class VideoMuteButton extends AbstractVideoMuteButton<Props, *> {
 function _mapStateToProps(state): Object {
     const { enabled: audioOnly } = state['features/base/audio-only'];
     const tracks = state['features/base/tracks'];
+    const enabledFlag = getFeatureFlag(state, VIDEO_MUTE_BUTTON_ENABLED, true);
 
     return {
         _audioOnly: Boolean(audioOnly),
         _videoDisabled: isVideoMuteButtonDisabled(state),
         _videoMediaType: getLocalVideoType(tracks),
-        _videoMuted: isLocalCameraTrackMuted(tracks)
+        _videoMuted: isLocalCameraTrackMuted(tracks),
+        visible: enabledFlag
     };
 }
 

react/features/toolbox/components/native/OverflowMenuButton.js

@@ -1,6 +1,7 @@
 // @flow
 
 import { openDialog } from '../../../base/dialog';
+import { getFeatureFlag, OVERFLOW_MENU_ENABLED } from '../../../base/flags';
 import { translate } from '../../../base/i18n';
 import { IconMenuThumb } from '../../../base/icons';
 import { connect } from '../../../base/redux';
@@ -38,4 +39,20 @@ class OverflowMenuButton extends AbstractButton<Props, *> {
     }
 }
 
-export default translate(connect()(OverflowMenuButton));
+/**
+ * Maps (parts of) the redux state to the associated props for the
+ * {@code OverflowMenuButton} component.
+ *
+ * @param {Object} state - The Redux state.
+ * @private
+ * @returns {Props}
+ */
+function _mapStateToProps(state): Object {
+    const enabledFlag = getFeatureFlag(state, OVERFLOW_MENU_ENABLED, true);
+
+    return {
+        visible: enabledFlag
+    };
+}
+
+export default translate(connect(_mapStateToProps)(OverflowMenuButton));