mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-24 02:05:45 +03:00
Code Issues Projects Releases Packages Wiki Activity

dedicated dialog box for E2E messages

Browse source
This commit is contained in:
Matthew Hodgson 2016-09-12 23:42:24 +01:00
parent 5a548c3d12
commit 9b7ab46a72
5 changed files with 35 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/component-index.js
View file

@ -49,6 +49,7 @@ module.exports.components['views.create_room.Presets'] = require('./components/v
module.exports.components['views.create_room.RoomAlias'] = require('./components/views/create_room/RoomAlias');
module.exports.components['views.dialogs.ChatInviteDialog'] = require('./components/views/dialogs/ChatInviteDialog');
module.exports.components['views.dialogs.DeactivateAccountDialog'] = require('./components/views/dialogs/DeactivateAccountDialog');
module.exports.components['views.dialogs.EncryptedEventDialog'] = require('./components/views/dialogs/EncryptedEventDialog');
module.exports.components['views.dialogs.ErrorDialog'] = require('./components/views/dialogs/ErrorDialog');
module.exports.components['views.dialogs.LogoutPrompt'] = require('./components/views/dialogs/LogoutPrompt');
module.exports.components['views.dialogs.MultiInviteDialog'] = require('./components/views/dialogs/MultiInviteDialog');

5
src/components/views/dialogs/LogoutPrompt.js
View file

@ -18,6 +18,11 @@ var dis = require("../../../dispatcher");
module.exports = React.createClass({
displayName: 'LogoutPrompt',
propTypes: {
onFinished: React.PropTypes.func,
},
logOut: function() {
dis.dispatch({action: 'logout'});
if (this.props.onFinished) {

57
src/components/views/rooms/EventTile.js
View file

@ -363,62 +363,11 @@ module.exports = React.createClass({
},
onCryptoClicked: function(e) {
var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
var EncryptedEventDialog = sdk.getComponent("dialogs.EncryptedEventDialog");
var event = this.props.mxEvent;
// XXX: gutwrench - is there any reason not to expose this on MatrixClient itself?
var device = MatrixClientPeg.get()._crypto.getDeviceByIdentityKey(
event.getSender(),
event.getWireContent().algorithm,
event.getWireContent().sender_key
);
Modal.createDialog(ErrorDialog, {
title: "End-to-end encryption information",
description: (
<div>
<table>
<tbody>
<tr>
<td>Sent by</td>
<td>{ event.getSender() }</td>
</tr>
<tr>
<td>Sender device name</td>
<td>{ device.getDisplayName() }</td>
</tr>
<tr>
<td>Sender device ID</td>
<td>{ device.deviceId }</td>
</tr>
<tr>
<td>Sender device verification:</td>
<td>{ MatrixClientPeg.get().isEventSenderVerified(event) ? "verified" : <b>NOT verified</b> }</td>
</tr>
<tr>
<td>Sender device ed25519 fingerprint</td>
<td>{ device.getFingerprint() }</td>
</tr>
<tr>
<td>Sender device curve25519 identity key</td>
<td>{ event.getWireContent().sender_key }</td>
</tr>
<tr>
<td>Algorithm</td>
<td>{ event.getWireContent().algorithm }</td>
</tr>
{
event.getContent().msgtype === 'm.bad.encrypted' ? (
<tr>
<td>Decryption error</td>
<td>{ event.getContent().body }</td>
</tr>
) : ''
}
</tbody>
</table>
</div>
)
Modal.createDialog(EncryptedEventDialog, {
event: event,
});
},

40
src/components/views/rooms/MemberDeviceInfo.js
View file

@ -54,33 +54,33 @@ export default class MemberDeviceInfo extends React.Component {
var indicator = null, blockButton = null, verifyButton = null;
if (this.props.device.isBlocked()) {
blockButton = (
<div className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unblock"
<button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unblock"
onClick={this.onUnblockClick}>
Unblock
</div>
</button>
);
} else {
blockButton = (
<div className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_block"
<button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_block"
onClick={this.onBlockClick}>
Block
</div>
</button>
);
}
if (this.props.device.isVerified()) {
verifyButton = (
<div className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unverify"
<button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_unverify"
onClick={this.onUnverifyClick}>
Unverify
</div>
</button>
);
} else {
verifyButton = (
<div className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_verify"
<button className="mx_MemberDeviceInfo_textButton mx_MemberDeviceInfo_verify"
onClick={this.onVerifyClick}>
Verify
</div>
</button>
);
}
@ -101,16 +101,25 @@ export default class MemberDeviceInfo extends React.Component {
var deviceName = this.props.device.getDisplayName() || this.props.device.deviceId;
var info;
if (!this.props.hideInfo) {
info = (
<div>
<div className="mx_MemberDeviceInfo_deviceId">{deviceName}</div>
{indicator}
<div className="mx_MemberDeviceInfo_deviceKey">
{this.props.device.getFingerprint()}
</div>
</div>
);
}
// add the deviceId as a titletext to help with debugging
return (
<div className="mx_MemberDeviceInfo" title={this.props.device.deviceId}>
<div className="mx_MemberDeviceInfo_deviceId">{deviceName}</div>
{indicator}
<div className="mx_MemberDeviceInfo_deviceKey">
{this.props.device.getFingerprint()}
</div>
{verifyButton}
{blockButton}
{ info }
{ verifyButton }
{ blockButton }
</div>
);
}
@ -120,4 +129,5 @@ MemberDeviceInfo.displayName = 'MemberDeviceInfo';
MemberDeviceInfo.propTypes = {
userId: React.PropTypes.string.isRequired,
device: React.PropTypes.object.isRequired,
hideInfo: React.PropTypes.bool,
};

2
src/components/views/rooms/MessageComposer.js
View file

@ -204,7 +204,7 @@ export default class MessageComposer extends React.Component {
if (MatrixClientPeg.get().isRoomEncrypted(this.props.room.roomId)) {
// FIXME: show a /!\ if there are untrusted devices in the room...
controls.push(
<img className="mx_MessageComposer_e2eIcon" src="img/e2e-verified.svg" width="10" height="12" alt="Encrypted room"/>
<img key="e2eIcon" className="mx_MessageComposer_e2eIcon" src="img/e2e-verified.svg" width="10" height="12" alt="Encrypted room"/>
);
}