diff --git a/src/components/views/right_panel/EncryptionPanel.js b/src/components/views/right_panel/EncryptionPanel.js index 152f4c0aa0..da06c37f75 100644 --- a/src/components/views/right_panel/EncryptionPanel.js +++ b/src/components/views/right_panel/EncryptionPanel.js @@ -22,6 +22,7 @@ import VerificationPanel from "./VerificationPanel"; import {MatrixClientPeg} from "../../../MatrixClientPeg"; import {ensureDMExists} from "../../../createRoom"; import {useEventEmitter} from "../../../hooks/useEventEmitter"; +import {useAsyncMemo} from "../../../hooks/useAsyncMemo"; import Modal from "../../../Modal"; import {PHASE_REQUESTED, PHASE_UNSENT} from "matrix-js-sdk/src/crypto/verification/request/VerificationRequest"; import * as sdk from "../../../index"; @@ -45,6 +46,12 @@ const EncryptionPanel = (props) => { } }, [verificationRequest]); + const deviceId = request && request.channel.deviceId; + const device = useAsyncMemo(() => { + const cli = MatrixClientPeg.get(); + return cli.getStoredDevice(cli.getUserId(), deviceId); + }, [deviceId]); + useEffect(() => { async function awaitPromise() { setRequesting(true); @@ -139,7 +146,8 @@ const EncryptionPanel = (props) => { request={request} key={request.channel.transactionId} inDialog={inDialog} - phase={phase} /> + phase={phase} + device={device} /> ); } }; diff --git a/src/components/views/right_panel/VerificationPanel.js b/src/components/views/right_panel/VerificationPanel.js index 22cf855d2c..e114b60b28 100644 --- a/src/components/views/right_panel/VerificationPanel.js +++ b/src/components/views/right_panel/VerificationPanel.js @@ -210,12 +210,19 @@ 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!", { + displayName: member.displayName || member.name || member.userId, + }); + return (
{_t("You've successfully verified %(displayName)s!", { - displayName: member.displayName || member.name || member.userId, - })}
+{description}
{ text }
@@ -276,6 +283,7 @@ export default class VerificationPanel extends React.PureComponent { onDone={this._onSasMatchesClick} inDialog={this.props.inDialog} isSelf={request.isSelfVerification} + device={this.props.device} /> :