Rework `reactionsCreated` in `EventTile` to use state

This changes to use component state instead of `forceUpdate`, so that it's more
obvious why an update is happening here.
pull/21833/head
J. Ryan Stinnett 2019-05-13 14:52:55 +01:00
parent 24209905e8
commit af9fdbaeeb
1 changed files with 7 additions and 4 deletions

View File

@ -182,6 +182,8 @@ module.exports = withMatrixClient(React.createClass({
verified: null, verified: null,
// Whether onRequestKeysClick has been called since mounting. // Whether onRequestKeysClick has been called since mounting.
previouslyRequestedKeys: false, previouslyRequestedKeys: false,
// The Relations model from the JS SDK for reactions to `mxEvent`
reactions: this.getReactions(),
}; };
}, },
@ -497,7 +499,9 @@ module.exports = withMatrixClient(React.createClass({
return; return;
} }
this.props.mxEvent.removeListener("Event.relationsCreated", this._onReactionsCreated); this.props.mxEvent.removeListener("Event.relationsCreated", this._onReactionsCreated);
this.forceUpdate(); this.setState({
reactions: this.getReactions(),
});
}, },
render: function() { render: function() {
@ -612,11 +616,10 @@ module.exports = withMatrixClient(React.createClass({
} }
} }
const reactions = this.getReactions();
const MessageActionBar = sdk.getComponent('messages.MessageActionBar'); const MessageActionBar = sdk.getComponent('messages.MessageActionBar');
const actionBar = <MessageActionBar const actionBar = <MessageActionBar
mxEvent={this.props.mxEvent} mxEvent={this.props.mxEvent}
reactions={reactions} reactions={this.state.reactions}
permalinkCreator={this.props.permalinkCreator} permalinkCreator={this.props.permalinkCreator}
getTile={this.getTile} getTile={this.getTile}
getReplyThread={this.getReplyThread} getReplyThread={this.getReplyThread}
@ -665,7 +668,7 @@ module.exports = withMatrixClient(React.createClass({
const ReactionsRow = sdk.getComponent('messages.ReactionsRow'); const ReactionsRow = sdk.getComponent('messages.ReactionsRow');
reactionsRow = <ReactionsRow reactionsRow = <ReactionsRow
mxEvent={this.props.mxEvent} mxEvent={this.props.mxEvent}
reactions={reactions} reactions={this.state.reactions}
/>; />;
} }