EventTile: add classes to indicate verifiedness

Add a couple of CSS classes to event tiles to reflect whether encrypted events
have been verified or not.
This commit is contained in:
Richard van der Hoff 2016-06-08 17:01:13 +01:00
parent f3e66e6fd2
commit 1616431d27

View file

@ -128,18 +128,25 @@ module.exports = React.createClass({
},
getInitialState: function() {
return {menu: false, allReadAvatars: false};
return {menu: false, allReadAvatars: false, verified: null};
},
componentWillMount: function() {
// don't do RR animations until we are mounted
this._suppressReadReceiptAnimation = true;
this._verifyEvent(this.props.mxEvent);
},
componentDidMount: function() {
this._suppressReadReceiptAnimation = false;
},
componentWillReceiveProps: function (nextProps) {
if (nextProps.mxEvent !== this.props.mxEvent) {
this._verifyEvent(nextProps.mxEvent);
}
},
shouldComponentUpdate: function (nextProps, nextState) {
if (!ObjectUtils.shallowEqual(this.state, nextState)) {
return true;
@ -152,6 +159,18 @@ module.exports = React.createClass({
return false;
},
_verifyEvent: function(mxEvent) {
var verified = null;
if (mxEvent.isEncrypted()) {
verified = MatrixClientPeg.get().isEventSenderVerified(mxEvent);
}
this.setState({
verified: verified
});
},
_propsEqual: function(objA, objB) {
var keysA = Object.keys(objA);
var keysB = Object.keys(objB);
@ -346,6 +365,8 @@ module.exports = React.createClass({
mx_EventTile_last: this.props.last,
mx_EventTile_contextual: this.props.contextual,
menu: this.state.menu,
mx_EventTile_verified: this.state.verified == true,
mx_EventTile_unverified: this.state.verified == false,
});
var timestamp = <a href={ "#/room/" + this.props.mxEvent.getRoomId() +"/"+ this.props.mxEvent.getId() }>
<MessageTimestamp ts={this.props.mxEvent.getTs()} />