From 496dfc618781186a0b3d43eda687e819e9996488 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Thu, 30 Jan 2020 18:50:14 +0100 Subject: [PATCH 01/20] send a .request and open it in the right panel on new session verify --- .../views/dialogs/NewSessionReviewDialog.js | 27 ++++++++++++++++--- 1 file changed, 23 insertions(+), 4 deletions(-) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index 2d2bcc8f35..58cb1d7cec 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -14,6 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ +import dis from "../../../dispatcher"; import React from 'react'; import PropTypes from 'prop-types'; import { _t } from '../../../languageHandler'; @@ -22,6 +23,9 @@ import { replaceableComponent } from '../../../utils/replaceableComponent'; import DeviceVerifyDialog from './DeviceVerifyDialog'; import BaseDialog from './BaseDialog'; import DialogButtons from '../elements/DialogButtons'; +import {verificationMethods} from 'matrix-js-sdk/src/crypto'; +import {MatrixClientPeg} from "../../../MatrixClientPeg"; +import {RIGHT_PANEL_PHASES} from "../../../stores/RightPanelStorePhases"; @replaceableComponent("views.dialogs.NewSessionReviewDialog") export default class NewSessionReviewDialog extends React.PureComponent { @@ -35,12 +39,27 @@ export default class NewSessionReviewDialog extends React.PureComponent { this.props.onFinished(false); } - onContinueClick = () => { + onContinueClick = async () => { const { userId, device } = this.props; - Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { + const cli = MatrixClientPeg.get(); + const request = await cli.requestVerification( userId, - device, - }, null, /* priority = */ false, /* static = */ true); + [verificationMethods.SAS], + [device.deviceId], + ); + dis.dispatch({ + action: "set_right_panel_phase", + phase: RIGHT_PANEL_PHASES.EncryptionPanel, + refireParams: { + verificationRequest: request, + member: cli.getUser(request.otherUserId), + }, + }); + + // Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { + // userId, + // device, + // }, null, /* priority = */ false, /* static = */ true); } render() { From 6b85ca2fb93d46767c6dfaade17f5043ff3e367f Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 10 Feb 2020 16:17:49 +0100 Subject: [PATCH 02/20] add qr code method to new session dialog --- src/components/views/dialogs/NewSessionReviewDialog.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index 58cb1d7cec..da12bbed62 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -26,6 +26,7 @@ import DialogButtons from '../elements/DialogButtons'; import {verificationMethods} from 'matrix-js-sdk/src/crypto'; import {MatrixClientPeg} from "../../../MatrixClientPeg"; import {RIGHT_PANEL_PHASES} from "../../../stores/RightPanelStorePhases"; +import {SHOW_QR_CODE_METHOD} from "matrix-js-sdk/src/crypto/verification/QRCode"; @replaceableComponent("views.dialogs.NewSessionReviewDialog") export default class NewSessionReviewDialog extends React.PureComponent { @@ -44,7 +45,7 @@ export default class NewSessionReviewDialog extends React.PureComponent { const cli = MatrixClientPeg.get(); const request = await cli.requestVerification( userId, - [verificationMethods.SAS], + [verificationMethods.SAS, SHOW_QR_CODE_METHOD], [device.deviceId], ); dis.dispatch({ From 5866d67c883f1c1ce7398a92fbd5482feb0b7f9f Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 10 Feb 2020 16:18:44 +0100 Subject: [PATCH 03/20] Alterations to DeviceVerifyDialog to support picking QR code --- .../views/dialogs/DeviceVerifyDialog.js | 68 ++++++++++++--- .../VerificationQREmojiOptions.js | 84 +++++++++++++++++++ src/i18n/strings/en_EN.json | 7 +- 3 files changed, 146 insertions(+), 13 deletions(-) create mode 100644 src/components/views/verification/VerificationQREmojiOptions.js diff --git a/src/components/views/dialogs/DeviceVerifyDialog.js b/src/components/views/dialogs/DeviceVerifyDialog.js index d78ef3ca83..0b2470c92b 100644 --- a/src/components/views/dialogs/DeviceVerifyDialog.js +++ b/src/components/views/dialogs/DeviceVerifyDialog.js @@ -27,16 +27,19 @@ import {verificationMethods} from 'matrix-js-sdk/src/crypto'; import {ensureDMExists} from "../../../createRoom"; import dis from "../../../dispatcher"; import SettingsStore from '../../../settings/SettingsStore'; +import {SHOW_QR_CODE_METHOD} from "matrix-js-sdk/src/crypto/verification/QRCode"; +import VerificationQREmojiOptions from "../verification/VerificationQREmojiOptions"; const MODE_LEGACY = 'legacy'; const MODE_SAS = 'sas'; const PHASE_START = 0; const PHASE_WAIT_FOR_PARTNER_TO_ACCEPT = 1; -const PHASE_SHOW_SAS = 2; -const PHASE_WAIT_FOR_PARTNER_TO_CONFIRM = 3; -const PHASE_VERIFIED = 4; -const PHASE_CANCELLED = 5; +const PHASE_PICK_VERIFICATION_OPTION = 2; +const PHASE_SHOW_SAS = 3; +const PHASE_WAIT_FOR_PARTNER_TO_CONFIRM = 4; +const PHASE_VERIFIED = 5; +const PHASE_CANCELLED = 6; export default class DeviceVerifyDialog extends React.Component { static propTypes = { @@ -49,6 +52,7 @@ export default class DeviceVerifyDialog extends React.Component { super(); this._verifier = null; this._showSasEvent = null; + this._request = null; this.state = { phase: PHASE_START, mode: MODE_SAS, @@ -80,6 +84,25 @@ export default class DeviceVerifyDialog extends React.Component { this.props.onFinished(false); } + _onUseSasClick = async () => { + try { + this._verifier = this._request.beginKeyVerification(verificationMethods.SAS); + this._verifier.on('show_sas', this._onVerifierShowSas); + // throws upon cancellation + await this._verifier.verify(); + this.setState({phase: PHASE_VERIFIED}); + this._verifier.removeListener('show_sas', this._onVerifierShowSas); + this._verifier = null; + } catch (e) { + console.log("Verification failed", e); + this.setState({ + phase: PHASE_CANCELLED, + }); + this._verifier = null; + this._request = null; + } + }; + _onLegacyFinished = (confirm) => { if (confirm) { MatrixClientPeg.get().setDeviceVerified( @@ -108,11 +131,20 @@ export default class DeviceVerifyDialog extends React.Component { } else { this._verifier = request.verifier; } + } else if (verifyingOwnDevice && SettingsStore.isFeatureEnabled("feature_cross_signing")) { + this._request = await client.requestVerification(this.props.userId,[ + verificationMethods.SAS, + SHOW_QR_CODE_METHOD, + ]); + + await this._request.waitFor(r => r.ready || r.started); + this.setState({phase: PHASE_PICK_VERIFICATION_OPTION}); } else { this._verifier = client.beginKeyVerification( verificationMethods.SAS, this.props.userId, this.props.device.deviceId, ); } + if (!this._verifier) return; this._verifier.on('show_sas', this._onVerifierShowSas); // throws upon cancellation await this._verifier.verify(); @@ -150,10 +182,13 @@ export default class DeviceVerifyDialog extends React.Component { let body; switch (this.state.phase) { case PHASE_START: - body = this._renderSasVerificationPhaseStart(); + body = this._renderVerificationPhaseStart(); break; case PHASE_WAIT_FOR_PARTNER_TO_ACCEPT: - body = this._renderSasVerificationPhaseWaitAccept(); + body = this._renderVerificationPhaseWaitAccept(); + break; + case PHASE_PICK_VERIFICATION_OPTION: + body = this._renderVerificationPhasePick(); break; case PHASE_SHOW_SAS: body = this._renderSasVerificationPhaseShowSas(); @@ -162,10 +197,10 @@ export default class DeviceVerifyDialog extends React.Component { body = this._renderSasVerificationPhaseWaitForPartnerToConfirm(); break; case PHASE_VERIFIED: - body = this._renderSasVerificationPhaseVerified(); + body = this._renderVerificationPhaseVerified(); break; case PHASE_CANCELLED: - body = this._renderSasVerificationPhaseCancelled(); + body = this._renderVerificationPhaseCancelled(); break; } @@ -180,7 +215,7 @@ export default class DeviceVerifyDialog extends React.Component { ); } - _renderSasVerificationPhaseStart() { + _renderVerificationPhaseStart() { const AccessibleButton = sdk.getComponent('views.elements.AccessibleButton'); const DialogButtons = sdk.getComponent('views.elements.DialogButtons'); return ( @@ -206,7 +241,7 @@ export default class DeviceVerifyDialog extends React.Component { ); } - _renderSasVerificationPhaseWaitAccept() { + _renderVerificationPhaseWaitAccept() { const Spinner = sdk.getComponent("views.elements.Spinner"); const AccessibleButton = sdk.getComponent('views.elements.AccessibleButton'); @@ -227,6 +262,14 @@ export default class DeviceVerifyDialog extends React.Component { ); } + _renderVerificationPhasePick() { + return ; + } + _renderSasVerificationPhaseShowSas() { const VerificationShowSas = sdk.getComponent('views.verification.VerificationShowSas'); return ; } @@ -247,12 +291,12 @@ export default class DeviceVerifyDialog extends React.Component { ; } - _renderSasVerificationPhaseVerified() { + _renderVerificationPhaseVerified() { const VerificationComplete = sdk.getComponent('views.verification.VerificationComplete'); return ; } - _renderSasVerificationPhaseCancelled() { + _renderVerificationPhaseCancelled() { const VerificationCancelled = sdk.getComponent('views.verification.VerificationCancelled'); return ; } diff --git a/src/components/views/verification/VerificationQREmojiOptions.js b/src/components/views/verification/VerificationQREmojiOptions.js new file mode 100644 index 0000000000..07f3b30f50 --- /dev/null +++ b/src/components/views/verification/VerificationQREmojiOptions.js @@ -0,0 +1,84 @@ +/* +Copyright 2020 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import React from 'react'; +import PropTypes from 'prop-types'; +import { _t, _td } from '../../../languageHandler'; +import {PendingActionSpinner} from "../right_panel/EncryptionInfo"; +import AccessibleButton from "../elements/AccessibleButton"; +import DialogButtons from "../elements/DialogButtons"; +import {replaceableComponent} from "../../../utils/replaceableComponent"; +import VerificationQRCode from "../elements/crypto/VerificationQRCode"; +import {VerificationRequest} from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest"; +import Spinner from "../elements/Spinner"; + +@replaceableComponent("views.verification.VerificationQREmojiOptions") +export default class VerificationQREmojiOptions extends React.Component { + static propTypes = { + request: PropTypes.object.isRequired, + onCancel: PropTypes.func.isRequired, + onStartEmoji: PropTypes.func.isRequired, + }; + + constructor(props) { + super(props); + + this.state = { + qrProps: null, + }; + + this._prepareQrCode(props.request); + } + + async _prepareQrCode(request: VerificationRequest) { + try { + const props = await VerificationQRCode.getPropsForRequest(request); + this.setState({qrProps: props}); + } catch (e) { + console.error(e); + // We just won't show a QR code + } + } + + render() { + let qrCode =
; + if (this.state.qrProps) { + qrCode = ; + } + return ( +
+ {_t("Verify this session by completing one of the following:")} +
+
+

{_t("Scan this unique code")}

+ {qrCode} +
+ {_t("or")} +
+

{_t("Compare unique emoji")}

+ {_t("Compare a unique set of emoji if you don't have a camera on either device")} + + {_t("Start")} + +
+
+ + {_t("Cancel")} + +
+ ); + } +} diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 83c15fc385..3bff66f258 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -451,6 +451,12 @@ "You've successfully verified this user.": "You've successfully verified this user.", "Secure messages with this user are end-to-end encrypted and not able to be read by third parties.": "Secure messages with this user are end-to-end encrypted and not able to be read by third parties.", "Got It": "Got It", + "Verify this session by completing one of the following:": "Verify this session by completing one of the following:", + "Scan this unique code": "Scan this unique code", + "or": "or", + "Compare unique emoji": "Compare unique emoji", + "Compare a unique set of emoji if you don't have a camera on either device": "Compare a unique set of emoji if you don't have a camera on either device", + "Start": "Start", "Confirm the emoji below are displayed on both devices, in the same order:": "Confirm the emoji below are displayed on both devices, in the same order:", "Verify this user by confirming the following emoji appear on their screen.": "Verify this user by confirming the following emoji appear on their screen.", "Verify this device by confirming the following number appears on its screen.": "Verify this device by confirming the following number appears on its screen.", @@ -1924,7 +1930,6 @@ "Could not load user profile": "Could not load user profile", "Complete security": "Complete security", "Verify this session to grant it access to encrypted messages.": "Verify this session to grant it access to encrypted messages.", - "Start": "Start", "Session verified": "Session verified", "Your new session is now verified. It has access to your encrypted messages, and other users will see it as trusted.": "Your new session is now verified. It has access to your encrypted messages, and other users will see it as trusted.", "Your new session is now verified. Other users will see it as trusted.": "Your new session is now verified. Other users will see it as trusted.", From bc5a59339b16c970f05521efb4b8c73216520078 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Fri, 31 Jan 2020 11:04:49 +0000 Subject: [PATCH 04/20] Send NewSessionReviewDialog through dialogs --- .../views/dialogs/NewSessionReviewDialog.js | 34 +++++++++---------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index da12bbed62..3979855503 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -43,24 +43,24 @@ export default class NewSessionReviewDialog extends React.PureComponent { onContinueClick = async () => { const { userId, device } = this.props; const cli = MatrixClientPeg.get(); - const request = await cli.requestVerification( - userId, - [verificationMethods.SAS, SHOW_QR_CODE_METHOD], - [device.deviceId], - ); - dis.dispatch({ - action: "set_right_panel_phase", - phase: RIGHT_PANEL_PHASES.EncryptionPanel, - refireParams: { - verificationRequest: request, - member: cli.getUser(request.otherUserId), - }, - }); - - // Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { + // const request = await cli.requestVerification( // userId, - // device, - // }, null, /* priority = */ false, /* static = */ true); + // [verificationMethods.SAS, SHOW_QR_CODE_METHOD], + // [device.deviceId], + // ); + // dis.dispatch({ + // action: "set_right_panel_phase", + // phase: RIGHT_PANEL_PHASES.EncryptionPanel, + // refireParams: { + // verificationRequest: request, + // member: cli.getUser(request.otherUserId), + // }, + // }); + + Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { + userId, + device, + }, null, /* priority = */ false, /* static = */ true); } render() { From 3d91ff23ec88a87c0607c67d5eb87949cb6d6eb1 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 12:20:48 +0100 Subject: [PATCH 05/20] cram the EncryptionPanel in CompleteSecurity instead of IncomingSasDialog so we get QR code support and support phases prior to STARTED --- src/components/structures/auth/CompleteSecurity.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/components/structures/auth/CompleteSecurity.js b/src/components/structures/auth/CompleteSecurity.js index 2126590736..18000be68e 100644 --- a/src/components/structures/auth/CompleteSecurity.js +++ b/src/components/structures/auth/CompleteSecurity.js @@ -138,9 +138,11 @@ export default class CompleteSecurity extends React.Component { let body; if (this.state.verificationRequest) { - const IncomingSasDialog = sdk.getComponent("views.dialogs.IncomingSasDialog"); - body = ; } else if (phase === PHASE_INTRO) { icon = ; From 747a4866e2a42db83b8751fbd7bc139cfcab2051 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 12:21:49 +0100 Subject: [PATCH 06/20] indenting --- .../views/dialogs/NewSessionReviewDialog.js | 20 +++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index 3979855503..41b881a1f2 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -43,7 +43,20 @@ export default class NewSessionReviewDialog extends React.PureComponent { onContinueClick = async () => { const { userId, device } = this.props; const cli = MatrixClientPeg.get(); - // const request = await cli.requestVerification( + const request = await cli.requestVerification( + userId, + [verificationMethods.SAS, SHOW_QR_CODE_METHOD], + [device.deviceId], + ); + dis.dispatch({ + action: "set_right_panel_phase", + phase: RIGHT_PANEL_PHASES.EncryptionPanel, + refireParams: { + verificationRequest: request, + member: cli.getUser(request.otherUserId), + }, + }); + // Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { // userId, // [verificationMethods.SAS, SHOW_QR_CODE_METHOD], // [device.deviceId], @@ -56,11 +69,6 @@ export default class NewSessionReviewDialog extends React.PureComponent { // member: cli.getUser(request.otherUserId), // }, // }); - - Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { - userId, - device, - }, null, /* priority = */ false, /* static = */ true); } render() { From 469d53396469ed0125388a5a7cfa3b7720009fe2 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Fri, 31 Jan 2020 11:48:49 +0000 Subject: [PATCH 07/20] Apply some CSS --- res/css/_components.scss | 1 + .../_VerificationQREmojiOptions.scss | 71 +++++++++++++++++++ .../VerificationQREmojiOptions.js | 4 +- 3 files changed, 74 insertions(+), 2 deletions(-) create mode 100644 res/css/views/verification/_VerificationQREmojiOptions.scss diff --git a/res/css/_components.scss b/res/css/_components.scss index bc636eb3c6..ad6bbdc486 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -206,6 +206,7 @@ @import "./views/settings/tabs/user/_SecurityUserSettingsTab.scss"; @import "./views/settings/tabs/user/_VoiceUserSettingsTab.scss"; @import "./views/terms/_InlineTermsAgreement.scss"; +@import "./views/verification/_VerificationQREmojiOptions.scss"; @import "./views/verification/_VerificationShowSas.scss"; @import "./views/voip/_CallView.scss"; @import "./views/voip/_IncomingCallbox.scss"; diff --git a/res/css/views/verification/_VerificationQREmojiOptions.scss b/res/css/views/verification/_VerificationQREmojiOptions.scss new file mode 100644 index 0000000000..6c9b527ba9 --- /dev/null +++ b/res/css/views/verification/_VerificationQREmojiOptions.scss @@ -0,0 +1,71 @@ +/* +Copyright 2020 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +.mx_IncomingSasDialog_startOptions { + display: flex; + margin-top: 10px; + margin-bottom: 10px; + align-items: stretch; + + > .mx_IncomingSasDialog_betweenText { + width: 50px; + vertical-align: middle; + text-align: center; + display: flex; + align-items: center; + justify-content: center; + } + + .mx_IncomingSasDialog_startOption { + background-color: $user-tile-hover-bg-color; + border-radius: 10px; + flex: 1; + display: flex; + padding: 10px; + align-items: center; + flex-direction: column; + position: relative; + + canvas, .mx_VerificationQREmojiOptions_noQR { + width: 220px !important; + height: 220px !important; + background-color: #fff; + border-radius: 4px; + vertical-align: middle; + text-align: center; + padding: 10px; + } + + > p { + font-weight: 700; + } + + .mx_IncomingSasDialog_helpText { + font-size: 14px; + margin-top: 71px; + text-align: center; + } + + .mx_AccessibleButton { + position: absolute; + bottom: 30px; + } + } +} + +//mx_IncomingSasDialog_startOptions +//mx_IncomingSasDialog_startOption > canvas +//mx_VerificationQREmojiOptions_noQR diff --git a/src/components/views/verification/VerificationQREmojiOptions.js b/src/components/views/verification/VerificationQREmojiOptions.js index 07f3b30f50..770b8a44a4 100644 --- a/src/components/views/verification/VerificationQREmojiOptions.js +++ b/src/components/views/verification/VerificationQREmojiOptions.js @@ -66,10 +66,10 @@ export default class VerificationQREmojiOptions extends React.Component {

{_t("Scan this unique code")}

{qrCode} - {_t("or")} +
{_t("or")}

{_t("Compare unique emoji")}

- {_t("Compare a unique set of emoji if you don't have a camera on either device")} + {_t("Compare a unique set of emoji if you don't have a camera on either device")} {_t("Start")} From b210c9cb769c63f69a9a43008e9489954b1dd3d1 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 12:21:57 +0100 Subject: [PATCH 08/20] close dialog after clicking continue --- src/components/views/dialogs/NewSessionReviewDialog.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index 41b881a1f2..c8e3992384 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -56,6 +56,7 @@ export default class NewSessionReviewDialog extends React.PureComponent { member: cli.getUser(request.otherUserId), }, }); + this.props.onFinished(true); // Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { // userId, // [verificationMethods.SAS, SHOW_QR_CODE_METHOD], From f368339b78824e5b23ad99bb1d0b9acbee1ae864 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 14:01:32 +0100 Subject: [PATCH 09/20] cram EncryptionPanel into a Dialog when clicking from new session dialog --- .../views/dialogs/DeviceVerifyOwnDialog.js | 36 +++++++++++++++++++ .../views/dialogs/NewSessionReviewDialog.js | 22 +++--------- 2 files changed, 41 insertions(+), 17 deletions(-) create mode 100644 src/components/views/dialogs/DeviceVerifyOwnDialog.js diff --git a/src/components/views/dialogs/DeviceVerifyOwnDialog.js b/src/components/views/dialogs/DeviceVerifyOwnDialog.js new file mode 100644 index 0000000000..ca562062a8 --- /dev/null +++ b/src/components/views/dialogs/DeviceVerifyOwnDialog.js @@ -0,0 +1,36 @@ +/* +Copyright 2019, 2020 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import React from 'react'; +import PropTypes from 'prop-types'; +import {MatrixClientPeg} from '../../../MatrixClientPeg'; +import * as sdk from '../../../index'; + +export default class DeviceVerifyOwnDialog extends React.Component { + static propTypes = { + verificationRequest: PropTypes.object.isRequired, + onFinished: PropTypes.func.isRequired, + }; + + render() { + const EncryptionPanel = sdk.getComponent("views.right_panel.EncryptionPanel"); + return ; + } +} diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index c8e3992384..6d074d7045 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -14,13 +14,12 @@ See the License for the specific language governing permissions and limitations under the License. */ -import dis from "../../../dispatcher"; import React from 'react'; import PropTypes from 'prop-types'; import { _t } from '../../../languageHandler'; import Modal from '../../../Modal'; import { replaceableComponent } from '../../../utils/replaceableComponent'; -import DeviceVerifyDialog from './DeviceVerifyDialog'; +import DeviceVerifyOwnDialog from './DeviceVerifyOwnDialog'; import BaseDialog from './BaseDialog'; import DialogButtons from '../elements/DialogButtons'; import {verificationMethods} from 'matrix-js-sdk/src/crypto'; @@ -48,28 +47,17 @@ export default class NewSessionReviewDialog extends React.PureComponent { [verificationMethods.SAS, SHOW_QR_CODE_METHOD], [device.deviceId], ); - dis.dispatch({ - action: "set_right_panel_phase", - phase: RIGHT_PANEL_PHASES.EncryptionPanel, - refireParams: { - verificationRequest: request, - member: cli.getUser(request.otherUserId), - }, + + Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyOwnDialog, { + verificationRequest: request, }); + this.props.onFinished(true); // Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { // userId, // [verificationMethods.SAS, SHOW_QR_CODE_METHOD], // [device.deviceId], // ); - // dis.dispatch({ - // action: "set_right_panel_phase", - // phase: RIGHT_PANEL_PHASES.EncryptionPanel, - // refireParams: { - // verificationRequest: request, - // member: cli.getUser(request.otherUserId), - // }, - // }); } render() { From ee23bfe625476b2be9d2f956211f0fc8f223c371 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 14:42:02 +0100 Subject: [PATCH 10/20] need to close the current dialog before opening a new modal --- src/components/views/dialogs/NewSessionReviewDialog.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index 6d074d7045..cab30c4d14 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -48,11 +48,12 @@ export default class NewSessionReviewDialog extends React.PureComponent { [device.deviceId], ); + this.props.onFinished(true); + Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyOwnDialog, { verificationRequest: request, }); - this.props.onFinished(true); // Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { // userId, // [verificationMethods.SAS, SHOW_QR_CODE_METHOD], From ea4d97fa73b17a1ebe6dfda4acfbf760da089341 Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Fri, 31 Jan 2020 15:04:44 +0000 Subject: [PATCH 11/20] Hack in a layout option --- .../structures/auth/CompleteSecurity.js | 1 + .../views/dialogs/DeviceVerifyOwnDialog.js | 1 + .../views/right_panel/EncryptionPanel.js | 4 ++- .../views/right_panel/VerificationPanel.js | 29 +++++++++++++++++++ 4 files changed, 34 insertions(+), 1 deletion(-) diff --git a/src/components/structures/auth/CompleteSecurity.js b/src/components/structures/auth/CompleteSecurity.js index 18000be68e..1443db0613 100644 --- a/src/components/structures/auth/CompleteSecurity.js +++ b/src/components/structures/auth/CompleteSecurity.js @@ -140,6 +140,7 @@ export default class CompleteSecurity extends React.Component { if (this.state.verificationRequest) { const EncryptionPanel = sdk.getComponent("views.right_panel.EncryptionPanel"); body = { +const EncryptionPanel = ({verificationRequest, member, onClose, layout}) => { const [request, setRequest] = useState(verificationRequest); useEffect(() => { setRequest(verificationRequest); @@ -77,6 +77,7 @@ const EncryptionPanel = ({verificationRequest, member, onClose}) => { } else { return (
; + if (this.state.qrCodeProps) { + qrCode = ; + } + return ( +
+ {_t("Verify this session by completing one of the following:")} +
+
+

{_t("Scan this unique code")}

+ {qrCode} +
+
{_t("or")}
+
+

{_t("Compare unique emoji")}

+ {_t("Compare a unique set of emoji if you don't have a camera on either device")} + + {_t("Start")} + +
+
+
+ ); + } + let button; if (pending) { button = ; From 39fab02fcc64b285092f2fcae73957d120523131 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 17:15:52 +0100 Subject: [PATCH 12/20] rename DeviceVerifyOwnDialog to VerificationRequestDialog as it works (and we want to use it) for any verification request, not just between two devices of the same user --- src/components/views/dialogs/NewSessionReviewDialog.js | 4 ++-- ...{DeviceVerifyOwnDialog.js => VerificationRequestDialog.js} | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) rename src/components/views/dialogs/{DeviceVerifyOwnDialog.js => VerificationRequestDialog.js} (94%) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index cab30c4d14..48c15ab06a 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -19,7 +19,7 @@ import PropTypes from 'prop-types'; import { _t } from '../../../languageHandler'; import Modal from '../../../Modal'; import { replaceableComponent } from '../../../utils/replaceableComponent'; -import DeviceVerifyOwnDialog from './DeviceVerifyOwnDialog'; +import VerificationRequestDialog from './VerificationRequestDialog'; import BaseDialog from './BaseDialog'; import DialogButtons from '../elements/DialogButtons'; import {verificationMethods} from 'matrix-js-sdk/src/crypto'; @@ -50,7 +50,7 @@ export default class NewSessionReviewDialog extends React.PureComponent { this.props.onFinished(true); - Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyOwnDialog, { + Modal.createTrackedDialog('New Session Verification', 'Starting dialog', VerificationRequestDialog, { verificationRequest: request, }); diff --git a/src/components/views/dialogs/DeviceVerifyOwnDialog.js b/src/components/views/dialogs/VerificationRequestDialog.js similarity index 94% rename from src/components/views/dialogs/DeviceVerifyOwnDialog.js rename to src/components/views/dialogs/VerificationRequestDialog.js index 4a75cc16ec..f47d76ab94 100644 --- a/src/components/views/dialogs/DeviceVerifyOwnDialog.js +++ b/src/components/views/dialogs/VerificationRequestDialog.js @@ -19,7 +19,7 @@ import PropTypes from 'prop-types'; import {MatrixClientPeg} from '../../../MatrixClientPeg'; import * as sdk from '../../../index'; -export default class DeviceVerifyOwnDialog extends React.Component { +export default class VerificationRequestDialog extends React.Component { static propTypes = { verificationRequest: PropTypes.object.isRequired, onFinished: PropTypes.func.isRequired, From d9b7b28e5ab6a477ed6b370f137cdfad73855168 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 17:45:48 +0100 Subject: [PATCH 13/20] add css hacks to make EncryptionPanel look ok in Dialog for the sas and verified phase --- .../_VerificationQREmojiOptions.scss | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/res/css/views/verification/_VerificationQREmojiOptions.scss b/res/css/views/verification/_VerificationQREmojiOptions.scss index 6c9b527ba9..ceaece8853 100644 --- a/res/css/views/verification/_VerificationQREmojiOptions.scss +++ b/res/css/views/verification/_VerificationQREmojiOptions.scss @@ -66,6 +66,26 @@ limitations under the License. } } +// Special case styling for EncryptionPanel in a Modal dialog +.mx_Dialog { + // fixed with for when showing sas and once verified. + .mx_VerificationShowSas, .mx_VerificationPanel_verified_section { + width: 500px; + } + + // EncryptionPanel when verification is done + .mx_VerificationPanel_verified_section { + // center the big shield icon + .mx_E2EIcon { + margin: 0 auto; + } + // right align the "Got it" button + .mx_AccessibleButton { + float: right; + } + } +} + //mx_IncomingSasDialog_startOptions //mx_IncomingSasDialog_startOption > canvas //mx_VerificationQREmojiOptions_noQR From a865cfb01362f550b62e10fb227bdc789d68e18c Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Sat, 1 Feb 2020 18:25:01 +0100 Subject: [PATCH 14/20] put encryption in a proper dialog with close button --- .../_VerificationQREmojiOptions.scss | 5 ----- .../dialogs/VerificationRequestDialog.js | 20 +++++++++++++------ src/i18n/strings/en_EN.json | 2 +- 3 files changed, 15 insertions(+), 12 deletions(-) diff --git a/res/css/views/verification/_VerificationQREmojiOptions.scss b/res/css/views/verification/_VerificationQREmojiOptions.scss index ceaece8853..1f488cc758 100644 --- a/res/css/views/verification/_VerificationQREmojiOptions.scss +++ b/res/css/views/verification/_VerificationQREmojiOptions.scss @@ -68,11 +68,6 @@ limitations under the License. // Special case styling for EncryptionPanel in a Modal dialog .mx_Dialog { - // fixed with for when showing sas and once verified. - .mx_VerificationShowSas, .mx_VerificationPanel_verified_section { - width: 500px; - } - // EncryptionPanel when verification is done .mx_VerificationPanel_verified_section { // center the big shield icon diff --git a/src/components/views/dialogs/VerificationRequestDialog.js b/src/components/views/dialogs/VerificationRequestDialog.js index f47d76ab94..baed79bd58 100644 --- a/src/components/views/dialogs/VerificationRequestDialog.js +++ b/src/components/views/dialogs/VerificationRequestDialog.js @@ -18,6 +18,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import {MatrixClientPeg} from '../../../MatrixClientPeg'; import * as sdk from '../../../index'; +import { _t } from '../../../languageHandler'; export default class VerificationRequestDialog extends React.Component { static propTypes = { @@ -26,12 +27,19 @@ export default class VerificationRequestDialog extends React.Component { }; render() { + const BaseDialog = sdk.getComponent("views.dialogs.BaseDialog"); const EncryptionPanel = sdk.getComponent("views.right_panel.EncryptionPanel"); - return ; + return + + ; } } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 3bff66f258..18df6dc70f 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1644,6 +1644,7 @@ "Upload %(count)s other files|one": "Upload %(count)s other file", "Cancel All": "Cancel All", "Upload Error": "Upload Error", + "Verification Request": "Verification Request", "A widget would like to verify your identity": "A widget would like to verify your identity", "A widget located at %(widgetUrl)s would like to verify your identity. By allowing this, the widget will be able to verify your user ID, but not perform actions as you.": "A widget located at %(widgetUrl)s would like to verify your identity. By allowing this, the widget will be able to verify your user ID, but not perform actions as you.", "Remember my selection for this widget": "Remember my selection for this widget", @@ -1855,7 +1856,6 @@ "Review terms and conditions": "Review terms and conditions", "Old cryptography data detected": "Old cryptography data detected", "Data from an older version of Riot has been detected. This will have caused end-to-end cryptography to malfunction in the older version. End-to-end encrypted messages exchanged recently whilst using the older version may not be decryptable in this version. This may also cause messages exchanged with this version to fail. If you experience problems, log out and back in again. To retain message history, export and re-import your keys.": "Data from an older version of Riot has been detected. This will have caused end-to-end cryptography to malfunction in the older version. End-to-end encrypted messages exchanged recently whilst using the older version may not be decryptable in this version. This may also cause messages exchanged with this version to fail. If you experience problems, log out and back in again. To retain message history, export and re-import your keys.", - "Verification Request": "Verification Request", "Logout": "Logout", "%(creator)s created and configured the room.": "%(creator)s created and configured the room.", "Your Communities": "Your Communities", From 8c3004c2ac3e6eb745b996efedf3002d1ca46d33 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Fri, 31 Jan 2020 12:20:11 +0100 Subject: [PATCH 15/20] to_device requests now can include .request so we might need send .ready --- src/components/structures/auth/CompleteSecurity.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/structures/auth/CompleteSecurity.js b/src/components/structures/auth/CompleteSecurity.js index 1443db0613..6bf3e7f07c 100644 --- a/src/components/structures/auth/CompleteSecurity.js +++ b/src/components/structures/auth/CompleteSecurity.js @@ -83,12 +83,13 @@ export default class CompleteSecurity extends React.Component { } } - onVerificationRequest = (request) => { + onVerificationRequest = async (request) => { if (request.otherUserId !== MatrixClientPeg.get().getUserId()) return; if (this.state.verificationRequest) { this.state.verificationRequest.off("change", this.onVerificationRequestChange); } + await request.accept(); request.on("change", this.onVerificationRequestChange); this.setState({ verificationRequest: request, From 9059f00b29570ce3f730458607ff679d036373a9 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 10 Feb 2020 14:20:54 +0100 Subject: [PATCH 16/20] move css to correct file Move the CSS for the dialog layout used in VerificationPanel to _VerificationPanel.scss, and delete the latter as it doesn't have any css of it's own anymore --- res/css/_components.scss | 1 - .../views/right_panel/_VerificationPanel.scss | 68 +++++++++++++++ .../_VerificationQREmojiOptions.scss | 86 ------------------- .../views/right_panel/VerificationPanel.js | 12 +-- 4 files changed, 74 insertions(+), 93 deletions(-) delete mode 100644 res/css/views/verification/_VerificationQREmojiOptions.scss diff --git a/res/css/_components.scss b/res/css/_components.scss index ad6bbdc486..bc636eb3c6 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -206,7 +206,6 @@ @import "./views/settings/tabs/user/_SecurityUserSettingsTab.scss"; @import "./views/settings/tabs/user/_VoiceUserSettingsTab.scss"; @import "./views/terms/_InlineTermsAgreement.scss"; -@import "./views/verification/_VerificationQREmojiOptions.scss"; @import "./views/verification/_VerificationShowSas.scss"; @import "./views/voip/_CallView.scss"; @import "./views/voip/_IncomingCallbox.scss"; diff --git a/res/css/views/right_panel/_VerificationPanel.scss b/res/css/views/right_panel/_VerificationPanel.scss index 827f2a2c49..8473b860db 100644 --- a/res/css/views/right_panel/_VerificationPanel.scss +++ b/res/css/views/right_panel/_VerificationPanel.scss @@ -36,4 +36,72 @@ limitations under the License. max-width: 240px; } } + +} + +// Special case styling for EncryptionPanel in a Modal dialog +.mx_Dialog, .mx_CompleteSecurity_body { + .mx_VerificationPanel_QRPhase_startOptions { + display: flex; + margin-top: 10px; + margin-bottom: 10px; + align-items: stretch; + + > .mx_VerificationPanel_QRPhase_betweenText { + width: 50px; + vertical-align: middle; + text-align: center; + display: flex; + align-items: center; + justify-content: center; + } + + .mx_VerificationPanel_QRPhase_startOption { + background-color: $user-tile-hover-bg-color; + border-radius: 10px; + flex: 1; + display: flex; + padding: 10px; + align-items: center; + flex-direction: column; + position: relative; + + canvas, .mx_VerificationPanel_QRPhase_noQR { + width: 220px !important; + height: 220px !important; + background-color: #fff; + border-radius: 4px; + vertical-align: middle; + text-align: center; + padding: 10px; + } + + > p { + font-weight: 700; + } + + .mx_VerificationPanel_QRPhase_helpText { + font-size: 14px; + margin-top: 71px; + text-align: center; + } + + .mx_AccessibleButton { + position: absolute; + bottom: 30px; + } + } + } + + // EncryptionPanel when verification is done + .mx_VerificationPanel_verified_section { + // center the big shield icon + .mx_E2EIcon { + margin: 0 auto; + } + // right align the "Got it" button + .mx_AccessibleButton { + float: right; + } + } } diff --git a/res/css/views/verification/_VerificationQREmojiOptions.scss b/res/css/views/verification/_VerificationQREmojiOptions.scss deleted file mode 100644 index 1f488cc758..0000000000 --- a/res/css/views/verification/_VerificationQREmojiOptions.scss +++ /dev/null @@ -1,86 +0,0 @@ -/* -Copyright 2020 The Matrix.org Foundation C.I.C. - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.mx_IncomingSasDialog_startOptions { - display: flex; - margin-top: 10px; - margin-bottom: 10px; - align-items: stretch; - - > .mx_IncomingSasDialog_betweenText { - width: 50px; - vertical-align: middle; - text-align: center; - display: flex; - align-items: center; - justify-content: center; - } - - .mx_IncomingSasDialog_startOption { - background-color: $user-tile-hover-bg-color; - border-radius: 10px; - flex: 1; - display: flex; - padding: 10px; - align-items: center; - flex-direction: column; - position: relative; - - canvas, .mx_VerificationQREmojiOptions_noQR { - width: 220px !important; - height: 220px !important; - background-color: #fff; - border-radius: 4px; - vertical-align: middle; - text-align: center; - padding: 10px; - } - - > p { - font-weight: 700; - } - - .mx_IncomingSasDialog_helpText { - font-size: 14px; - margin-top: 71px; - text-align: center; - } - - .mx_AccessibleButton { - position: absolute; - bottom: 30px; - } - } -} - -// Special case styling for EncryptionPanel in a Modal dialog -.mx_Dialog { - // EncryptionPanel when verification is done - .mx_VerificationPanel_verified_section { - // center the big shield icon - .mx_E2EIcon { - margin: 0 auto; - } - // right align the "Got it" button - .mx_AccessibleButton { - float: right; - } - } -} - -//mx_IncomingSasDialog_startOptions -//mx_IncomingSasDialog_startOption > canvas -//mx_VerificationQREmojiOptions_noQR diff --git a/src/components/views/right_panel/VerificationPanel.js b/src/components/views/right_panel/VerificationPanel.js index b007b6b54c..08b90f9114 100644 --- a/src/components/views/right_panel/VerificationPanel.js +++ b/src/components/views/right_panel/VerificationPanel.js @@ -73,22 +73,22 @@ export default class VerificationPanel extends React.PureComponent { if (this.props.layout === 'dialog') { // HACK: This is a terrible idea. - let qrCode =
; + let qrCode =
; if (this.state.qrCodeProps) { qrCode = ; } return (
{_t("Verify this session by completing one of the following:")} -
-
+
+

{_t("Scan this unique code")}

{qrCode}
-
{_t("or")}
-
+
{_t("or")}
+

{_t("Compare unique emoji")}

- {_t("Compare a unique set of emoji if you don't have a camera on either device")} + {_t("Compare a unique set of emoji if you don't have a camera on either device")} {_t("Start")} From 2a8453b9397b241daa62e0dd1124496496ed2b6f Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 10 Feb 2020 14:44:20 +0100 Subject: [PATCH 17/20] i18n fixes --- src/components/views/right_panel/VerificationPanel.js | 7 +++---- src/i18n/strings/en_EN.json | 1 + 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/views/right_panel/VerificationPanel.js b/src/components/views/right_panel/VerificationPanel.js index 08b90f9114..94051686bd 100644 --- a/src/components/views/right_panel/VerificationPanel.js +++ b/src/components/views/right_panel/VerificationPanel.js @@ -111,9 +111,8 @@ export default class VerificationPanel extends React.PureComponent { if (!this.state.qrCodeProps) { return
-

Verify by emoji

+

{_t("Verify by emoji")}

{_t("Verify by comparing unique emoji.")}

- { button }
; } @@ -121,7 +120,7 @@ export default class VerificationPanel extends React.PureComponent { // TODO: add way to open camera to scan a QR code return
-

Verify by scanning

+

{_t("Verify by scanning")}

{_t("Ask %(displayName)s to scan your code:", { displayName: member.displayName || member.name || member.userId, })}

@@ -132,7 +131,7 @@ export default class VerificationPanel extends React.PureComponent {
-

Verify by emoji

+

{_t("Verify by emoji")}

{_t("If you can't scan the code above, verify by comparing unique emoji.")}

{ button } diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 18df6dc70f..97e2a7cb5b 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1192,6 +1192,7 @@ "Security": "Security", "Verify by emoji": "Verify by emoji", "Verify by comparing unique emoji.": "Verify by comparing unique emoji.", + "Verify by scanning": "Verify by scanning", "Ask %(displayName)s to scan your code:": "Ask %(displayName)s to scan your code:", "If you can't scan the code above, verify by comparing unique emoji.": "If you can't scan the code above, verify by comparing unique emoji.", "You've successfully verified %(displayName)s!": "You've successfully verified %(displayName)s!", From a693af0c6b2ac24798c8fdadc7f8304ccbaf2f5e Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 10 Feb 2020 14:48:10 +0100 Subject: [PATCH 18/20] fix lint --- src/components/views/dialogs/DeviceVerifyDialog.js | 2 +- src/components/views/dialogs/NewSessionReviewDialog.js | 1 - src/components/views/right_panel/VerificationPanel.js | 1 - .../views/verification/VerificationQREmojiOptions.js | 4 +--- 4 files changed, 2 insertions(+), 6 deletions(-) diff --git a/src/components/views/dialogs/DeviceVerifyDialog.js b/src/components/views/dialogs/DeviceVerifyDialog.js index 0b2470c92b..7187aa4d28 100644 --- a/src/components/views/dialogs/DeviceVerifyDialog.js +++ b/src/components/views/dialogs/DeviceVerifyDialog.js @@ -132,7 +132,7 @@ export default class DeviceVerifyDialog extends React.Component { this._verifier = request.verifier; } } else if (verifyingOwnDevice && SettingsStore.isFeatureEnabled("feature_cross_signing")) { - this._request = await client.requestVerification(this.props.userId,[ + this._request = await client.requestVerification(this.props.userId, [ verificationMethods.SAS, SHOW_QR_CODE_METHOD, ]); diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index 48c15ab06a..2a7281c60e 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -24,7 +24,6 @@ import BaseDialog from './BaseDialog'; import DialogButtons from '../elements/DialogButtons'; import {verificationMethods} from 'matrix-js-sdk/src/crypto'; import {MatrixClientPeg} from "../../../MatrixClientPeg"; -import {RIGHT_PANEL_PHASES} from "../../../stores/RightPanelStorePhases"; import {SHOW_QR_CODE_METHOD} from "matrix-js-sdk/src/crypto/verification/QRCode"; @replaceableComponent("views.dialogs.NewSessionReviewDialog") diff --git a/src/components/views/right_panel/VerificationPanel.js b/src/components/views/right_panel/VerificationPanel.js index 94051686bd..9ec556f4bf 100644 --- a/src/components/views/right_panel/VerificationPanel.js +++ b/src/components/views/right_panel/VerificationPanel.js @@ -31,7 +31,6 @@ import { PHASE_CANCELLED, VerificationRequest, } from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest"; import Spinner from "../elements/Spinner"; -import AccessibleButton from "../elements/AccessibleButton"; export default class VerificationPanel extends React.PureComponent { static propTypes = { diff --git a/src/components/views/verification/VerificationQREmojiOptions.js b/src/components/views/verification/VerificationQREmojiOptions.js index 770b8a44a4..d72c6951fe 100644 --- a/src/components/views/verification/VerificationQREmojiOptions.js +++ b/src/components/views/verification/VerificationQREmojiOptions.js @@ -16,10 +16,8 @@ limitations under the License. import React from 'react'; import PropTypes from 'prop-types'; -import { _t, _td } from '../../../languageHandler'; -import {PendingActionSpinner} from "../right_panel/EncryptionInfo"; +import { _t } from '../../../languageHandler'; import AccessibleButton from "../elements/AccessibleButton"; -import DialogButtons from "../elements/DialogButtons"; import {replaceableComponent} from "../../../utils/replaceableComponent"; import VerificationQRCode from "../elements/crypto/VerificationQRCode"; import {VerificationRequest} from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest"; From 0e0b0e8d09de7ac6a1382e8d50a384387a08bea4 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 10 Feb 2020 15:30:16 +0100 Subject: [PATCH 19/20] fix css lint --- res/css/views/right_panel/_VerificationPanel.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/res/css/views/right_panel/_VerificationPanel.scss b/res/css/views/right_panel/_VerificationPanel.scss index 8473b860db..2a733d11a7 100644 --- a/res/css/views/right_panel/_VerificationPanel.scss +++ b/res/css/views/right_panel/_VerificationPanel.scss @@ -36,7 +36,6 @@ limitations under the License. max-width: 240px; } } - } // Special case styling for EncryptionPanel in a Modal dialog From 936b40f6b5d20075619d3370ad2b1fc45ac445fc Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Mon, 10 Feb 2020 15:53:36 +0100 Subject: [PATCH 20/20] remove commented out code --- src/components/views/dialogs/NewSessionReviewDialog.js | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/components/views/dialogs/NewSessionReviewDialog.js b/src/components/views/dialogs/NewSessionReviewDialog.js index 2a7281c60e..e0f82df0c0 100644 --- a/src/components/views/dialogs/NewSessionReviewDialog.js +++ b/src/components/views/dialogs/NewSessionReviewDialog.js @@ -52,12 +52,6 @@ export default class NewSessionReviewDialog extends React.PureComponent { Modal.createTrackedDialog('New Session Verification', 'Starting dialog', VerificationRequestDialog, { verificationRequest: request, }); - - // Modal.createTrackedDialog('New Session Verification', 'Starting dialog', DeviceVerifyDialog, { - // userId, - // [verificationMethods.SAS, SHOW_QR_CODE_METHOD], - // [device.deviceId], - // ); } render() {