You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

AbstractMuteButton.js 2.6KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. // @flow
  2. import {
  3. createRemoteVideoMenuButtonEvent,
  4. sendAnalytics
  5. } from '../../analytics';
  6. import { rejectParticipantAudio } from '../../av-moderation/actions';
  7. import { IconMicDisabled } from '../../base/icons';
  8. import { MEDIA_TYPE } from '../../base/media';
  9. import { AbstractButton, type AbstractButtonProps } from '../../base/toolbox/components';
  10. import { isRemoteTrackMuted } from '../../base/tracks';
  11. import { muteRemote } from '../actions.any';
  12. export type Props = AbstractButtonProps & {
  13. /**
  14. * Boolean to indicate if the audio track of the participant is muted or
  15. * not.
  16. */
  17. _audioTrackMuted: boolean,
  18. /**
  19. * The redux {@code dispatch} function.
  20. */
  21. dispatch: Function,
  22. /**
  23. * The ID of the participant object that this button is supposed to
  24. * mute/unmute.
  25. */
  26. participantID: string,
  27. /**
  28. * The function to be used to translate i18n labels.
  29. */
  30. t: Function
  31. };
  32. /**
  33. * An abstract remote video menu button which mutes the remote participant.
  34. */
  35. export default class AbstractMuteButton extends AbstractButton<Props, *> {
  36. accessibilityLabel = 'toolbar.accessibilityLabel.remoteMute';
  37. icon = IconMicDisabled;
  38. label = 'videothumbnail.domute';
  39. toggledLabel = 'videothumbnail.muted';
  40. /**
  41. * Handles clicking / pressing the button, and mutes the participant.
  42. *
  43. * @private
  44. * @returns {void}
  45. */
  46. _handleClick() {
  47. const { dispatch, participantID } = this.props;
  48. sendAnalytics(createRemoteVideoMenuButtonEvent(
  49. 'mute',
  50. {
  51. 'participant_id': participantID
  52. }));
  53. dispatch(muteRemote(participantID, MEDIA_TYPE.AUDIO));
  54. dispatch(rejectParticipantAudio(participantID));
  55. }
  56. /**
  57. * Renders the item disabled if the participant is muted.
  58. *
  59. * @inheritdoc
  60. */
  61. _isDisabled() {
  62. return this.props._audioTrackMuted;
  63. }
  64. /**
  65. * Renders the item toggled if the participant is muted.
  66. *
  67. * @inheritdoc
  68. */
  69. _isToggled() {
  70. return this.props._audioTrackMuted;
  71. }
  72. }
  73. /**
  74. * Function that maps parts of Redux state tree into component props.
  75. *
  76. * @param {Object} state - Redux state.
  77. * @param {Object} ownProps - Properties of component.
  78. * @private
  79. * @returns {{
  80. * _audioTrackMuted: boolean
  81. * }}
  82. */
  83. export function _mapStateToProps(state: Object, ownProps: Props) {
  84. const tracks = state['features/base/tracks'];
  85. return {
  86. _audioTrackMuted: isRemoteTrackMuted(
  87. tracks, MEDIA_TYPE.AUDIO, ownProps.participantID)
  88. };
  89. }