feat: Added mute video moderation feature (#8630)

* Added mute video feature

* Fixed export

* Fixed some issues

* Added remote video mute notification

* Fixed import

* Fixed conference event handling

* Fixed some linting issues

* Fixed more linter errors

* turn screenshare off on remote video mute

* Fix linter issue

* translations added for mute video feature

* Added video mute button to interface config

* Updated lib-jitsi-meet

* Fix copy paste error

Co-authored-by: nurjinn jafar <nurjin.jafar@nordeck.net>

react/features/remote-video-menu/components/web/RemoteVideoMenuTriggerButton.js

@@ -3,20 +3,20 @@
 import React, { Component } from 'react';
 
 import { Icon, IconMenuThumb } from '../../../base/icons';
-import { MEDIA_TYPE } from '../../../base/media';
 import { getLocalParticipant, getParticipantById, PARTICIPANT_ROLE } from '../../../base/participants';
 import { Popover } from '../../../base/popover';
 import { connect } from '../../../base/redux';
-import { isRemoteTrackMuted } from '../../../base/tracks';
 import { requestRemoteControl, stopController } from '../../../remote-control';
 import { getCurrentLayout, LAYOUTS } from '../../../video-layout';
 
 import MuteEveryoneElseButton from './MuteEveryoneElseButton';
+import MuteEveryoneElsesVideoButton from './MuteEveryoneElsesVideoButton';
 import { REMOTE_CONTROL_MENU_STATES } from './RemoteControlButton';
 
 import {
     GrantModeratorButton,
     MuteButton,
+    MuteVideoButton,
     KickButton,
     PrivateMessageMenuButton,
     RemoteControlButton,
@@ -43,11 +43,6 @@ type Props = {
      */
     _disableRemoteMute: Boolean,
 
-    /**
-     * Whether or not the participant is currently muted.
-     */
-    _isAudioMuted: boolean,
-
     /**
      * Whether or not the participant is a conference moderator.
      */
@@ -151,7 +146,6 @@ class RemoteVideoMenuTriggerButton extends Component<Props> {
         const {
             _disableKick,
             _disableRemoteMute,
-            _isAudioMuted,
             _isModerator,
             dispatch,
             initialVolumeValue,
@@ -166,7 +160,6 @@ class RemoteVideoMenuTriggerButton extends Component<Props> {
             if (!_disableRemoteMute) {
                 buttons.push(
                     <MuteButton
-                        isAudioMuted = { _isAudioMuted }
                         key = 'mute'
                         participantID = { participantID } />
                 );
@@ -175,6 +168,16 @@ class RemoteVideoMenuTriggerButton extends Component<Props> {
                         key = 'mute-others'
                         participantID = { participantID } />
                 );
+                buttons.push(
+                    <MuteVideoButton
+                        key = 'mute-video'
+                        participantID = { participantID } />
+                );
+                buttons.push(
+                    <MuteEveryoneElsesVideoButton
+                        key = 'mute-others-video'
+                        participantID = { participantID } />
+                );
             }
 
             buttons.push(
@@ -247,7 +250,6 @@ class RemoteVideoMenuTriggerButton extends Component<Props> {
  */
 function _mapStateToProps(state, ownProps) {
     const { participantID } = ownProps;
-    const tracks = state['features/base/tracks'];
     const localParticipant = getLocalParticipant(state);
     const { remoteVideoMenu = {}, disableRemoteMute } = state['features/base/config'];
     const { disableKick } = remoteVideoMenu;
@@ -286,7 +288,6 @@ function _mapStateToProps(state, ownProps) {
     }
 
     return {
-        _isAudioMuted: isRemoteTrackMuted(tracks, MEDIA_TYPE.AUDIO, participantID) || false,
         _isModerator: Boolean(localParticipant?.role === PARTICIPANT_ROLE.MODERATOR),
         _disableKick: Boolean(disableKick),
         _disableRemoteMute: Boolean(disableRemoteMute),