diff --git a/react/features/remote-video-menu/components/KickButton.js b/react/features/remote-video-menu/components/KickButton.js index 19540cbf4..e375880d5 100644 --- a/react/features/remote-video-menu/components/KickButton.js +++ b/react/features/remote-video-menu/components/KickButton.js @@ -3,6 +3,7 @@ import React, { Component } from 'react'; import { connect } from 'react-redux'; import { translate } from '../../base/i18n'; +import JitsiMeetJS from '../../base/lib-jitsi-meet'; import { kickParticipant } from '../../base/participants'; import RemoteVideoMenuButton from './RemoteVideoMenuButton'; @@ -82,6 +83,13 @@ class KickButton extends Component { _onClick() { const { dispatch, onClick, participantID } = this.props; + JitsiMeetJS.analytics.sendEvent( + 'remotevideomenu.kick', + { + value: 1, + label: participantID + } + ); dispatch(kickParticipant(participantID)); if (onClick) { diff --git a/react/features/remote-video-menu/components/MuteButton.js b/react/features/remote-video-menu/components/MuteButton.js index 932cdae21..36b43bd6e 100644 --- a/react/features/remote-video-menu/components/MuteButton.js +++ b/react/features/remote-video-menu/components/MuteButton.js @@ -3,6 +3,7 @@ import React, { Component } from 'react'; import { connect } from 'react-redux'; import { translate } from '../../base/i18n'; +import JitsiMeetJS from '../../base/lib-jitsi-meet'; import { muteRemoteParticipant } from '../../base/participants'; import RemoteVideoMenuButton from './RemoteVideoMenuButton'; @@ -96,6 +97,14 @@ class MuteButton extends Component { _onClick() { const { dispatch, onClick, participantID } = this.props; + JitsiMeetJS.analytics.sendEvent( + 'remotevideomenu.mute', + { + value: 1, + label: participantID + } + ); + dispatch(muteRemoteParticipant(participantID)); if (onClick) { diff --git a/react/features/remote-video-menu/components/RemoteControlButton.js b/react/features/remote-video-menu/components/RemoteControlButton.js index 6a0549697..d7e20af9f 100644 --- a/react/features/remote-video-menu/components/RemoteControlButton.js +++ b/react/features/remote-video-menu/components/RemoteControlButton.js @@ -1,6 +1,7 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import JitsiMeetJS from '../../base/lib-jitsi-meet'; import { translate } from '../../base/i18n'; import RemoteVideoMenuButton from './RemoteVideoMenuButton'; @@ -50,6 +51,19 @@ class RemoteControlButton extends Component { t: PropTypes.func }; + /** + * Initializes a new {@code RemoteControlButton} instance. + * + * @param {Object} props - The read-only React Component props with which + * the new instance is to be initialized. + */ + constructor(props) { + super(props); + + // Bind event handlers so they are only bound once for every instance. + this._onClick = this._onClick.bind(this); + } + /** * Implements React's {@link Component#render()}. * @@ -58,7 +72,6 @@ class RemoteControlButton extends Component { */ render() { const { - onClick, participantID, remoteControlState, t @@ -92,9 +105,44 @@ class RemoteControlButton extends Component { displayClass = { className } iconClass = { icon } id = { `remoteControl_${participantID}` } - onClick = { onClick } /> + onClick = { this._onClick } /> ); } + + /** + * Sends analytics event for pressing the button and executes the passed + * onClick handler. + * + * @private + * @returns {void} + */ + _onClick() { + const { onClick, participantID, remoteControlState } = this.props; + + let eventName; + + if (remoteControlState === REMOTE_CONTROL_MENU_STATES.STARTED) { + eventName = 'stop'; + } + + if (remoteControlState === REMOTE_CONTROL_MENU_STATES.NOT_STARTED) { + eventName = 'start'; + } + + if (eventName) { + JitsiMeetJS.analytics.sendEvent( + `remotevideomenu.remotecontrol.${eventName}`, + { + value: 1, + label: participantID + } + ); + } + + if (onClick) { + onClick(); + } + } } export default translate(RemoteControlButton);