add feature flag and send verification using DM from dialog if enabled

src/components/views/dialogs/DeviceVerifyDialog.js

@@ -24,6 +24,10 @@ import sdk from '../../../index';
 import * as FormattingUtils from '../../../utils/FormattingUtils';
 import { _t } from '../../../languageHandler';
 import {verificationMethods} from 'matrix-js-sdk/lib/crypto';
+import DMRoomMap from '../../../utils/DMRoomMap';
+import createRoom from "../../../createRoom";
+import dis from "../../../dispatcher";
+import SettingsStore from '../../../settings/SettingsStore';
 
 const MODE_LEGACY = 'legacy';
 const MODE_SAS = 'sas';
@@ -86,25 +90,37 @@ export default class DeviceVerifyDialog extends React.Component {
         this.props.onFinished(confirm);
     }
 
-    _onSasRequestClick = () => {
+    _onSasRequestClick = async () => {
         this.setState({
             phase: PHASE_WAIT_FOR_PARTNER_TO_ACCEPT,
         });
-        this._verifier = MatrixClientPeg.get().beginKeyVerification(
+        const client = MatrixClientPeg.get();
+        const verifyingOwnDevice = this.props.userId === client.getUserId();
+        try {
+            if (!verifyingOwnDevice && SettingsStore.getValue("feature_dm_verification")) {
+                const roomId = await ensureDMExistsAndOpen(this.props.userId);
+                // throws upon cancellation before having started
+                this._verifier = await client.requestVerificationDM(
+                    this.props.userId, roomId, [verificationMethods.SAS],
+                );
+            } else {
+                this._verifier = client.beginKeyVerification(
                     verificationMethods.SAS, this.props.userId, this.props.device.deviceId,
                 );
+            }
             this._verifier.on('show_sas', this._onVerifierShowSas);
-        this._verifier.verify().then(() => {
+            // throws upon cancellation
+            await this._verifier.verify();
             this.setState({phase: PHASE_VERIFIED});
             this._verifier.removeListener('show_sas', this._onVerifierShowSas);
             this._verifier = null;
-        }).catch((e) => {
+        } catch (e) {
             console.log("Verification failed", e);
             this.setState({
                 phase: PHASE_CANCELLED,
             });
             this._verifier = null;
-        });
+        }
     }
 
     _onSasMatchesClick = () => {
@@ -299,3 +315,30 @@ export default class DeviceVerifyDialog extends React.Component {
     }
 }
 
+async function ensureDMExistsAndOpen(userId) {
+    const client = MatrixClientPeg.get();
+    const roomIds = DMRoomMap.shared().getDMRoomsForUserId(userId);
+    const rooms = roomIds.map(id => client.getRoom(id));
+    const suitableDMRooms = rooms.filter(r => {
+        if (r && r.getMyMembership() === "join") {
+            const member = r.getMember(userId);
+            return member && (member.membership === "invite" || member.membership === "join");
+        }
+        return false;
+    });
+    let roomId;
+    if (suitableDMRooms.length) {
+        const room = suitableDMRooms[0];
+        roomId = room.roomId;
+    } else {
+        roomId = await createRoom({dmUserId: userId, spinner: false, andView: false});
+    }
+    // don't use andView and spinner in createRoom, together, they cause this dialog to close and reopen,
+    // we causes us to loose the verifier and restart, and we end up having two verification requests
+    dis.dispatch({
+        action: 'view_room',
+        room_id: roomId,
+        should_peek: false,
+    });
+    return roomId;
+}

src/i18n/strings/en_EN.json

@@ -339,6 +339,7 @@
     "Render simple counters in room header": "Render simple counters in room header",
     "Multiple integration managers": "Multiple integration managers",
     "Use the new, consistent UserInfo panel for Room Members and Group Members": "Use the new, consistent UserInfo panel for Room Members and Group Members",
+    "Send verification requests in direct message": "Send verification requests in direct message",
     "Use the new, faster, composer for writing messages": "Use the new, faster, composer for writing messages",
     "Enable Emoji suggestions while typing": "Enable Emoji suggestions while typing",
     "Use compact timeline layout": "Use compact timeline layout",

src/settings/Settings.js

@@ -126,6 +126,12 @@ export const SETTINGS = {
         supportedLevels: LEVELS_FEATURE,
         default: false,
     },
+    "feature_dm_verification": {
+        isFeature: true,
+        displayName: _td("Send verification requests in direct message"),
+        supportedLevels: LEVELS_FEATURE,
+        default: false,
+    },
     "useCiderComposer": {
         displayName: _td("Use the new, faster, composer for writing messages"),
         supportedLevels: LEVELS_ACCOUNT_SETTINGS,