diff --git a/src/components/views/messages/MessageActionBar.js b/src/components/views/messages/MessageActionBar.js
index d2ac9adcf0..903abfc2d2 100644
--- a/src/components/views/messages/MessageActionBar.js
+++ b/src/components/views/messages/MessageActionBar.js
@@ -102,19 +102,9 @@ export default class MessageActionBar extends React.PureComponent {
}
const ReactionDimension = sdk.getComponent('messages.ReactionDimension');
- const options = [
- {
- key: "agree",
- content: "👍",
- },
- {
- key: "disagree",
- content: "👎",
- },
- ];
return ;
}
@@ -125,19 +115,9 @@ export default class MessageActionBar extends React.PureComponent {
}
const ReactionDimension = sdk.getComponent('messages.ReactionDimension');
- const options = [
- {
- key: "like",
- content: "🙂",
- },
- {
- key: "dislike",
- content: "😔",
- },
- ];
return ;
}
diff --git a/src/components/views/messages/ReactionDimension.js b/src/components/views/messages/ReactionDimension.js
index 015e69d6b6..f7b43a418c 100644
--- a/src/components/views/messages/ReactionDimension.js
+++ b/src/components/views/messages/ReactionDimension.js
@@ -22,6 +22,7 @@ import MatrixClientPeg from '../../../MatrixClientPeg';
export default class ReactionDimension extends React.PureComponent {
static propTypes = {
+ // Array of strings containing the emoji for each option
options: PropTypes.array.isRequired,
title: PropTypes.string,
// The Relations model from the JS SDK for reactions
@@ -68,12 +69,12 @@ export default class ReactionDimension extends React.PureComponent {
}
const { options } = this.props;
let selected = null;
- for (const { key, content } of options) {
+ for (const option of options) {
const reactionExists = myReactions.some(mxEvent => {
if (mxEvent.isRedacted()) {
return false;
}
- return mxEvent.getContent()["m.relates_to"].key === content;
+ return mxEvent.getContent()["m.relates_to"].key === option;
});
if (reactionExists) {
if (selected) {
@@ -81,7 +82,7 @@ export default class ReactionDimension extends React.PureComponent {
// non-Riot clients), then act as if none are selected.
return null;
}
- selected = key;
+ selected = option;
}
}
return selected;
@@ -98,12 +99,12 @@ export default class ReactionDimension extends React.PureComponent {
onOptionClick = (ev) => {
const { key } = ev.target.dataset;
- this.toggleDimensionValue(key);
+ this.toggleDimension(key);
}
- toggleDimensionValue(value) {
+ toggleDimension(key) {
const state = this.state.selected;
- const newState = state !== value ? value : null;
+ const newState = state !== key ? key : null;
this.setState({
selected: newState,
});
@@ -115,16 +116,16 @@ export default class ReactionDimension extends React.PureComponent {
const { options } = this.props;
const items = options.map(option => {
- const disabled = selected && selected !== option.key;
+ const disabled = selected && selected !== option;
const classes = classNames({
mx_ReactionDimension_disabled: disabled,
});
- return
- {option.content}
+ {option}
;
});