From b71b4c8c45404b8075064f049abfcf87e6caa334 Mon Sep 17 00:00:00 2001
From: Bhavik Arora <71212695+arorabhavik1001@users.noreply.github.com>
Date: Thu, 9 Jan 2025 21:51:28 +0530
Subject: [PATCH] fix(video-menu): Hide "Mute all" option when all participants
 are moderators (#15461)

* Fixed exception for visibility state of mute all button

* Updated changes as per review: shifted conditional to the toggle

* chore: fix eslint warnings and errors

---------

Co-authored-by: Bhavik Arora <arorabhavik1001>
---
 .../components/AbstractMuteEveryoneDialog.ts  |  9 +++--
 .../components/web/MuteEveryoneDialog.tsx     | 33 ++++++++++---------
 2 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts b/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts
index 0d6136e6a1..613f38f2fa 100644
--- a/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts
+++ b/react/features/video-menu/components/AbstractMuteEveryoneDialog.ts
@@ -2,7 +2,7 @@ import { IReduxState } from '../../app/types';
 import { requestDisableAudioModeration, requestEnableAudioModeration } from '../../av-moderation/actions';
 import { isEnabledFromState, isSupported } from '../../av-moderation/functions';
 import { MEDIA_TYPE } from '../../base/media/constants';
-import { getLocalParticipant, getParticipantDisplayName } from '../../base/participants/functions';
+import { getLocalParticipant, getParticipantDisplayName, isEveryoneModerator } from '../../base/participants/functions';
 import { muteAllParticipants } from '../actions';
 
 import AbstractMuteRemoteParticipantDialog, {
@@ -17,6 +17,7 @@ export interface IProps extends AbstractProps {
     content?: string;
     exclude: Array<string>;
     isAudioModerationEnabled?: boolean;
+    isEveryoneModerator: boolean;
     isModerationSupported?: boolean;
     showAdvancedModerationToggle: boolean;
     title: string;
@@ -119,10 +120,12 @@ export function abstractMapStateToProps(state: IReduxState, ownProps: IProps) {
 
     return whom.length ? {
         content: t('dialog.muteEveryoneElseDialog'),
-        title: t('dialog.muteEveryoneElseTitle', { whom })
+        title: t('dialog.muteEveryoneElseTitle', { whom }),
+        isEveryoneModerator: isEveryoneModerator(state)
     } : {
         title: t('dialog.muteEveryoneTitle'),
         isAudioModerationEnabled: isEnabledFromState(MEDIA_TYPE.AUDIO, state),
-        isModerationSupported: isSupported()(state)
+        isModerationSupported: isSupported()(state),
+        isEveryoneModerator: isEveryoneModerator(state)
     };
 }
diff --git a/react/features/video-menu/components/web/MuteEveryoneDialog.tsx b/react/features/video-menu/components/web/MuteEveryoneDialog.tsx
index bc99cd6e32..0392c8aa54 100644
--- a/react/features/video-menu/components/web/MuteEveryoneDialog.tsx
+++ b/react/features/video-menu/components/web/MuteEveryoneDialog.tsx
@@ -28,21 +28,24 @@ class MuteEveryoneDialog extends AbstractMuteEveryoneDialog<IProps> {
                 onSubmit = { this._onSubmit }
                 title = { this.props.title }>
                 <div className = 'mute-dialog'>
-                    { this.state.content }
-                    { this.props.isModerationSupported && this.props.exclude.length === 0 && (
-                        <>
-                            <div className = 'separator-line' />
-                            <div className = 'control-row'>
-                                <label htmlFor = 'moderation-switch'>
-                                    {this.props.t('dialog.moderationAudioLabel')}
-                                </label>
-                                <Switch
-                                    checked = { !this.state.audioModerationEnabled }
-                                    id = 'moderation-switch'
-                                    onChange = { this._onToggleModeration } />
-                            </div>
-                        </>
-                    )}
+                    {this.state.content}
+                    {
+                        this.props.isModerationSupported
+                        && this.props.exclude.length === 0
+                        && !this.props.isEveryoneModerator && (
+                            <>
+                                <div className = 'separator-line' />
+                                <div className = 'control-row'>
+                                    <label htmlFor = 'moderation-switch'>
+                                        {this.props.t('dialog.moderationAudioLabel')}
+                                    </label>
+                                    <Switch
+                                        checked = { !this.state.audioModerationEnabled }
+                                        id = 'moderation-switch'
+                                        onChange = { this._onToggleModeration } />
+                                </div>
+                            </>
+                        )}
                 </div>
             </Dialog>
         );