OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

correctly reflect verify/blacklist state in UI

pull/21833/head
Matthew Hodgson 2017-02-03 01:49:22 +00:00
parent 5de84f845a
commit 28d28b55d1
1 changed files with 31 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/components/views/elements/DeviceVerifyButtons.js
View File

@ -27,6 +27,28 @@ export default React.createClass({
device: React.PropTypes.object.isRequired, device: React.PropTypes.object.isRequired,
}, },
getInitialState: function() {
return {
device: this.props.device
};
},
componentWillMount: function() {
const cli = MatrixClientPeg.get();
cli.on("deviceVerificationChanged", this.onDeviceVerificationChanged);
},
componentWillUnmount: function() {
const cli = MatrixClientPeg.get();
cli.removeListener("deviceVerificationChanged", this.onDeviceVerificationChanged);
},
onDeviceVerificationChanged: function(userId, deviceId) {
if (userId === this.props.userId && deviceId === this.props.device.deviceId) {
this.setState({ device: MatrixClientPeg.get().getStoredDevice(userId, deviceId) });
}
},
onVerifyClick: function() { onVerifyClick: function() {
var QuestionDialog = sdk.getComponent("dialogs.QuestionDialog"); var QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
Modal.createDialog(QuestionDialog, { Modal.createDialog(QuestionDialog, {
@ -41,9 +63,9 @@ export default React.createClass({
</p> </p>
<div className="mx_UserSettings_cryptoSection"> <div className="mx_UserSettings_cryptoSection">
<ul> <ul>
<li><label>Device name:</label> <span>{ this.props.device.getDisplayName() }</span></li> <li><label>Device name:</label> <span>{ this.state.device.getDisplayName() }</span></li>
<li><label>Device ID:</label> <span><code>{ this.props.device.deviceId}</code></span></li> <li><label>Device ID:</label> <span><code>{ this.state.device.deviceId}</code></span></li>
<li><label>Device key:</label> <span><code><b>{ this.props.device.getFingerprint() }</b></code></span></li> <li><label>Device key:</label> <span><code><b>{ this.state.device.getFingerprint() }</b></code></span></li>
</ul> </ul>
</div> </div>
<p> <p>
@ -60,7 +82,7 @@ export default React.createClass({
onFinished: confirm=>{ onFinished: confirm=>{
if (confirm) { if (confirm) {
MatrixClientPeg.get().setDeviceVerified( MatrixClientPeg.get().setDeviceVerified(
this.props.userId, this.props.device.deviceId, true this.props.userId, this.state.device.deviceId, true
); );
} }
}, },
@ -69,26 +91,26 @@ export default React.createClass({
onUnverifyClick: function() { onUnverifyClick: function() {
MatrixClientPeg.get().setDeviceVerified( MatrixClientPeg.get().setDeviceVerified(
this.props.userId, this.props.device.deviceId, false this.props.userId, this.state.device.deviceId, false
); );
}, },
onBlacklistClick: function() { onBlacklistClick: function() {
MatrixClientPeg.get().setDeviceBlocked( MatrixClientPeg.get().setDeviceBlocked(
this.props.userId, this.props.device.deviceId, true this.props.userId, this.state.device.deviceId, true
); );
}, },
onUnblacklistClick: function() { onUnblacklistClick: function() {
MatrixClientPeg.get().setDeviceBlocked( MatrixClientPeg.get().setDeviceBlocked(
this.props.userId, this.props.device.deviceId, false this.props.userId, this.state.device.deviceId, false
); );
}, },
render: function() { render: function() {
var blacklistButton = null, verifyButton = null; var blacklistButton = null, verifyButton = null;
if (this.props.device.isBlocked()) { if (this.state.device.isBlocked()) {
blacklistButton = ( blacklistButton = (
<button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unblacklist" <button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unblacklist"
onClick={this.onUnblacklistClick}> onClick={this.onUnblacklistClick}>
@ -104,7 +126,7 @@ export default React.createClass({
); );
} }
if (this.props.device.isVerified()) { if (this.state.device.isVerified()) {
verifyButton = ( verifyButton = (
<button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unverify" <button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unverify"
onClick={this.onUnverifyClick}> onClick={this.onUnverifyClick}>