fix(toolbar): Re-add "mute everyone's video" button

lang/main.json

@@ -244,6 +244,7 @@
         "muteEveryoneElsesVideoDialog": "Once the camera is disabled, you won't be able to turn it back on, but they can turn it back on at any time.",
         "muteEveryoneElsesVideoTitle": "Disable everyone's camera except {{whom}}?",
         "muteEveryonesVideoDialog": "Are you sure you want to disable everyone's camera? You won't be able to turn it back on, but they can turn it back on at any time.",
+        "muteEveryonesVideoDialogOk": "Disable",
         "muteEveryonesVideoTitle": "Disable everyone's camera?",
         "muteEveryoneSelf": "yourself",
         "muteEveryoneStartMuted": "Everyone starts muted from now on",

react/features/base/icons/svg/mute-video-everyone.svg

@@ -3,10 +3,10 @@
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
-<path fill="#A4B8D1" d="M3.136,7.1l14.448,14.447l-1.033,1.032l-2.598-2.599c-0.115,0.077-0.307,0.153-0.459,0.153H3.709
+<path d="M3.136,7.1l14.448,14.447l-1.033,1.032l-2.598-2.599c-0.115,0.077-0.307,0.153-0.459,0.153H3.709
 	c-0.458,0-0.803-0.346-0.803-0.804v-8.179c0-0.459,0.344-0.803,0.803-0.803h0.612L2.104,8.131L3.136,7.1z M17.584,10.769v8.714
 	l-9.135-9.134h5.045c0.459,0,0.84,0.344,0.84,0.803v2.866L17.584,10.769z"/>
-<path fill="#A4B8D1" d="M14.688,0.818l8.164,8.165l-0.584,0.583L20.8,8.098c-0.065,0.043-0.174,0.086-0.26,0.086h-5.528
+<path d="M14.688,0.818l8.164,8.165l-0.584,0.583L20.8,8.098c-0.065,0.043-0.174,0.086-0.26,0.086h-5.528
 	c-0.259,0-0.454-0.195-0.454-0.454V3.108c0-0.26,0.195-0.454,0.454-0.454h0.345l-1.253-1.253L14.688,0.818z M22.852,2.892v4.924
 	l-5.162-5.162h2.851c0.26,0,0.476,0.194,0.476,0.454v1.619L22.852,2.892z"/>
 </svg>

react/features/toolbox/components/MuteEveryonesVideoButton.js

@@ -35,7 +35,6 @@ class MuteEveryonesVideoButton extends AbstractButton<Props, *> {
     accessibilityLabel = 'toolbar.accessibilityLabel.muteEveryonesVideo';
     icon = IconMuteVideoEveryone;
     label = 'toolbar.muteEveryonesVideo';
-    tooltip = 'toolbar.muteVideoEveryone';
 
     /**
      * Handles clicking / pressing the button, and opens a confirmation dialog.

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

@@ -21,6 +21,7 @@ import { TileViewButton } from '../../../video-layout';
 import { getMovableButtons } from '../../functions.native';
 import HelpButton from '../HelpButton';
 import MuteEveryoneButton from '../MuteEveryoneButton';
+import MuteEveryonesVideoButton from '../MuteEveryonesVideoButton';
 
 import AudioOnlyButton from './AudioOnlyButton';
 import MoreOptionsButton from './MoreOptionsButton';
@@ -152,6 +153,7 @@ class OverflowMenu extends PureComponent<Props, State> {
                     <ClosedCaptionButton { ...buttonProps } />
                     <SharedDocumentButton { ...buttonProps } />
                     <MuteEveryoneButton { ...buttonProps } />
+                    <MuteEveryonesVideoButton { ...buttonProps } />
                     <HelpButton { ...buttonProps } />
                 </Collapsible>
             </BottomSheet>

react/features/toolbox/components/web/Toolbox.js

@@ -80,6 +80,7 @@ import DownloadButton from '../DownloadButton';
 import HangupButton from '../HangupButton';
 import HelpButton from '../HelpButton';
 import MuteEveryoneButton from '../MuteEveryoneButton';
+import MuteEveryonesVideoButton from '../MuteEveryonesVideoButton';
 
 import AudioSettingsButton from './AudioSettingsButton';
 import OverflowMenuButton from './OverflowMenuButton';
@@ -1008,6 +1009,10 @@ class Toolbox extends Component<Props, State> {
                 && <MuteEveryoneButton
                     key = 'mute-everyone'
                     showLabel = { true } />,
+            this._shouldShowButton('mute-video-everyone')
+                && <MuteEveryonesVideoButton
+                    key = 'mute-everyones-video'
+                    showLabel = { true } />,
             this._shouldShowButton('livestreaming')
                 && <LiveStreamButton
                     key = 'livestreaming'

react/features/video-menu/components/native/MuteEveryonesVideoDialog.js

@@ -0,0 +1,67 @@
+// @flow
+
+import React from 'react';
+import { Text } from 'react-native';
+
+import { ColorSchemeRegistry } from '../../../base/color-scheme';
+import { ConfirmDialog } from '../../../base/dialog';
+import { translate } from '../../../base/i18n';
+import { connect } from '../../../base/redux';
+import { StyleType } from '../../../base/styles';
+import AbstractMuteEveryonesVideoDialog, {
+    abstractMapStateToProps,
+    type Props as AbstractProps } from '../AbstractMuteEveryonesVideoDialog';
+
+type Props = AbstractProps & {
+
+    /**
+     * The color-schemed stylesheet of the base/dialog feature.
+     */
+    _dialogStyles: StyleType
+}
+
+/**
+ * A React Component with the contents for a dialog that asks for confirmation
+ * from the user before muting all remote participants.
+ *
+ * @extends AbstractMuteEveryoneDialog
+ */
+class MuteEveryonesVideoDialog extends AbstractMuteEveryonesVideoDialog<Props> {
+
+    /**
+     * Implements {@code Component#render}.
+     *
+     * @inheritdoc
+     */
+    render() {
+        return (
+            <ConfirmDialog
+                okKey = 'dialog.muteEveryonesVideoDialogOk'
+                onSubmit = { this._onSubmit } >
+                <Text style = { this.props._dialogStyles.text }>
+                    { `${this.props.title} \n\n ${this.props.content}` }
+                </Text>
+            </ConfirmDialog>
+        );
+    }
+
+    _onSubmit: () => boolean;
+}
+
+/**
+ * Maps part of the Redux state to the props of this component.
+ *
+ * @param {Object} state - The Redux state.
+ * @param {Props} ownProps - The own props of the component.
+ * @returns {{
+    *     _dialogStyles: StyleType
+    * }}
+ */
+function _mapStateToProps(state: Object, ownProps: Props) {
+    return {
+        ...abstractMapStateToProps(state, ownProps),
+        _dialogStyles: ColorSchemeRegistry.get(state, 'Dialog')
+    };
+}
+
+export default translate(connect(_mapStateToProps)(MuteEveryonesVideoDialog));

react/features/video-menu/components/native/index.js

@@ -3,5 +3,6 @@
 export { default as GrantModeratorDialog } from './GrantModeratorDialog';
 export { default as KickRemoteParticipantDialog } from './KickRemoteParticipantDialog';
 export { default as MuteEveryoneDialog } from './MuteEveryoneDialog';
+export { default as MuteEveryonesVideoDialog } from './MuteEveryonesVideoDialog';
 export { default as MuteRemoteParticipantDialog } from './MuteRemoteParticipantDialog';
 export { default as RemoteVideoMenu } from './RemoteVideoMenu';