diff --git a/src/components/structures/RightPanel.js b/src/components/structures/RightPanel.js
index ff83e3c9cc..c58d3c625b 100644
--- a/src/components/structures/RightPanel.js
+++ b/src/components/structures/RightPanel.js
@@ -34,6 +34,7 @@ class HeaderButton extends React.Component {
}
onClick(ev) {
+ Analytics.trackEvent(...this.props.analytics);
dis.dispatch({
action: 'view_right_panel_phase',
phase: this.props.clickPhase,
@@ -60,11 +61,19 @@ class HeaderButton extends React.Component {
}
HeaderButton.propTypes = {
+ // If currentPhase is one of the specified phases, the button will be highlighted
phases: PropTypes.arrayOf(PropTypes.string).isRequired,
+ // The currentPhase of the RightPanel
currentPhase: PropTypes.string.isRequired,
+ // The phase to swap to when the button is clicked
clickPhase: PropTypes.string.isRequired,
+ // The source file of the icon to display
iconSrc: PropTypes.string.isRequired,
+
+ // The badge to display above the icon
badge: PropTypes.node,
+ // The parameters to track the click event
+ analytics: PropTypes.arrayOf(PropTypes.string).isRequired,
};
module.exports = React.createClass({
@@ -112,21 +121,6 @@ module.exports = React.createClass({
}
},
- onMemberListButtonClick: function() {
- Analytics.trackEvent('Right Panel', 'Member List Button', 'click');
- this.setState({ phase: this.Phase.RoomMemberList });
- },
-
- onFileListButtonClick: function() {
- Analytics.trackEvent('Right Panel', 'File List Button', 'click');
- this.setState({ phase: this.Phase.FilePanel });
- },
-
- onNotificationListButtonClick: function() {
- Analytics.trackEvent('Right Panel', 'Notification List Button', 'click');
- this.setState({ phase: this.Phase.NotificationPanel });
- },
-
onCollapseClick: function() {
dis.dispatch({
action: 'hide_right_panel',
@@ -253,16 +247,19 @@ module.exports = React.createClass({
clickPhase={this.Phase.RoomMemberList}
currentPhase={this.state.phase}
badge={membersBadge}
+ analytics={['Right Panel', 'Member List Button', 'click']}
/>,
,
,
];
}