diff --git a/src/components/views/right_panel/EncryptionPanel.js b/src/components/views/right_panel/EncryptionPanel.js index bc580c767b..e9f94729fa 100644 --- a/src/components/views/right_panel/EncryptionPanel.js +++ b/src/components/views/right_panel/EncryptionPanel.js @@ -45,9 +45,6 @@ const EncryptionPanel = (props) => { } }, [verificationRequest]); - const deviceId = request && request.channel.deviceId; - const device = MatrixClientPeg.get().getStoredDevice(MatrixClientPeg.get().getUserId(), deviceId); - useEffect(() => { async function awaitPromise() { setRequesting(true); @@ -143,7 +140,7 @@ const EncryptionPanel = (props) => { key={request.channel.transactionId} inDialog={layout === "dialog"} phase={phase} - device={device} /> + /> ); } }; diff --git a/src/components/views/right_panel/VerificationPanel.js b/src/components/views/right_panel/VerificationPanel.js index 67efd29d27..ff3700e143 100644 --- a/src/components/views/right_panel/VerificationPanel.js +++ b/src/components/views/right_panel/VerificationPanel.js @@ -17,6 +17,7 @@ limitations under the License. import React from "react"; import PropTypes from "prop-types"; +import {MatrixClientPeg} from "../../../MatrixClientPeg"; import * as sdk from '../../../index'; import {verificationMethods} from 'matrix-js-sdk/src/crypto'; import {SCAN_QR_CODE_METHOD} from "matrix-js-sdk/src/crypto/verification/QRCode"; @@ -161,6 +162,11 @@ export default class VerificationPanel extends React.PureComponent { this.state.reciprocateQREvent.cancel(); }; + _getDevice() { + const deviceId = this.props.request && this.props.request.channel.deviceId; + return MatrixClientPeg.get().getStoredDevice(MatrixClientPeg.get().getUserId(), deviceId); + } + renderQRReciprocatePhase() { const {member, request} = this.props; let Button; @@ -217,16 +223,26 @@ export default class VerificationPanel extends React.PureComponent { } } - const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); - const description = request.isSelfVerification ? - _t("You've successfully verified %(deviceName)s (%(deviceId)s)!", { - deviceName: this.props.device.getDisplayName(), - deviceId: this.props.device.deviceId, - }): - _t("You've successfully verified %(displayName)s!", { + let description; + if (request.isSelfVerification) { + const device = this._getDevice(); + if (!device) { + // This shouldn't happen, although rageshake would indicate that it is: log a warn + // and leave the message slightly broken (avoid adding a translatable string for a + // case that shouldn't be happening). + console.warn("Verified device we don't know about: " + this.props.request.channel.deviceId); + } + description = _t("You've successfully verified %(deviceName)s (%(deviceId)s)!", { + deviceName: device ? device.getDisplayName() : '', + deviceId: this.props.request.channel.deviceId, + }); + } else { + description = _t("You've successfully verified %(displayName)s!", { displayName: member.displayName || member.name || member.userId, }); + } + const AccessibleButton = sdk.getComponent('elements.AccessibleButton'); return (