More sensible buttons in UnknownDeviceDialog

Just say 'Send' (or equiv) if you actually verify all the devices,
rather than 'Send Anyway'.

src/CallHandler.js

@@ -137,6 +137,7 @@ function _setCallListeners(call) {
                                 _reAttemptCall(call);
                             },
                             call.direction === 'outbound' ? _t("Call Anyway") : _t("Answer Anyway"),
+                            call.direction === 'outbound' ? _t("Call") : _t("Answer"),
                         );
                     }
                 },

src/components/views/dialogs/UnknownDeviceDialog.js

@@ -24,6 +24,14 @@ import Resend from '../../../Resend';
 import { _t } from '../../../languageHandler';
 import SettingsStore from "../../../settings/SettingsStore";
 
+function markAllDevicesKnown(devices) {
+    Object.keys(devices).forEach((userId) => {
+        Object.keys(devices[userId]).map((deviceId) => {
+            MatrixClientPeg.get().setDeviceKnown(userId, deviceId, true);
+        });
+    });
+}
+
 function DeviceListEntry(props) {
     const {userId, device} = props;
 
@@ -97,9 +105,33 @@ export default React.createClass({
 
         // map from userid -> deviceid -> deviceinfo
         devices: PropTypes.object.isRequired,
+
         onFinished: PropTypes.func.isRequired,
+
+        // Label for the button that marks all devices known and tries the send again
         sendAnywayLabel: PropTypes.string.isRequired,
-        onSendAnyway: PropTypes.func.isRequired,
+
+        // Label for the button that to send the event if you've verified all devices
+        sendLabel: PropTypes.string.isRequired,
+
+        // function to retry the request once all devices are verified / known
+        onSend: PropTypes.func.isRequired,
+    },
+
+    componentWillMount: function() {
+        MatrixClientPeg.get().on("deviceVerificationChanged", this._onDeviceVerificationChanged);
+    },
+
+    componentWillUnmount: function() {
+        MatrixClientPeg.get().removeListener("deviceVerificationChanged", this._onDeviceVerificationChanged);
+    },
+
+    _onDeviceVerificationChanged: function(userId, deviceId, deviceInfo) {
+        if (this.props.devices[userId] && this.props.devices[userId][deviceId]) {
+            // XXX: Mutating props :/
+            this.props.devices[userId][deviceId] = deviceInfo;
+            this.forceUpdate();
+        }
     },
 
     _onDismissClicked: function() {
@@ -107,8 +139,15 @@ export default React.createClass({
     },
 
     _onSendAnywayClicked: function() {
+        markAllDevicesKnown(this.props.devices);
+
         this.props.onFinished();
-        this.props.onSendAnyway();
+        this.props.onSend();
+    },
+
+    _onSendClicked: function() {
+        this.props.onFinished();
+        this.props.onSend();
     },
 
     render: function() {
@@ -137,6 +176,26 @@ export default React.createClass({
             );
         }
 
+        let haveUnknownDevices = false;
+        Object.keys(this.props.devices).forEach((userId) => {
+            Object.keys(this.props.devices[userId]).map((deviceId) => {
+                const device = this.props.devices[userId][deviceId];
+                if (device.isUnverified() && !device.isKnown()) {
+                    haveUnknownDevices = true;
+                }
+            });
+        });
+        let sendButton;
+        if (haveUnknownDevices) {
+            sendButton = <button onClick={this._onSendAnywayClicked}>
+                { this.props.sendAnywayLabel }
+            </button>;
+        } else {
+            sendButton = <button onClick={this._onSendClicked}>
+                { this.props.sendLabel }
+            </button>;
+        }
+
         const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
         return (
             <BaseDialog className='mx_UnknownDeviceDialog'
@@ -153,10 +212,7 @@ export default React.createClass({
                     <UnknownDeviceList devices={this.props.devices} />
                 </GeminiScrollbar>
                 <div className="mx_Dialog_buttons">
-                    {this.props.sendAnywayButton}
-                    <button onClick={this._onSendAnywayClicked}>
-                        { this.props.sendAnywayLabel }
-                    </button>
+                    {sendButton}
                     <button className="mx_Dialog_primary" autoFocus={true}
                         onClick={this._onDismissClicked}
                     >

src/cryptodevices.js

@@ -44,8 +44,7 @@ export function getUnknownDevicesForRoom(matrixClient, room) {
 
 export function showUnknownDeviceDialogForMessages(matrixClient, room) {
     getUnknownDevicesForRoom(matrixClient, room).then((unknownDevices) => {
-        const onSendAnywayClicked = () => {
-            markAllDevicesKnown(matrixClient, unknownDevices);
+        const onSendClicked = () => {
             Resend.resendUnsentEvents(room);
         };
 
@@ -54,32 +53,21 @@ export function showUnknownDeviceDialogForMessages(matrixClient, room) {
             room: room,
             devices: unknownDevices,
             sendAnywayLabel: _t("Send anyway"),
-            onSendAnyway: onSendAnywayClicked,
+            sendLabel: _t("Send"),
+            onSend: onSendClicked,
         }, 'mx_Dialog_unknownDevice');
     });
 }
 
-export function showUnknownDeviceDialogForCalls(matrixClient, room, sendAnyway, sendAnywayLabel) {
+export function showUnknownDeviceDialogForCalls(matrixClient, room, sendAnyway, sendAnywayLabel, sendLabel) {
     getUnknownDevicesForRoom(matrixClient, room).then((unknownDevices) => {
-        const onSendAnywayClicked = () => {
-            markAllDevicesKnown(matrixClient, unknownDevices);
-            sendAnyway();
-        };
-
         const UnknownDeviceDialog = sdk.getComponent('dialogs.UnknownDeviceDialog');
         Modal.createTrackedDialog('Unknown Device Dialog', '', UnknownDeviceDialog, {
             room: room,
             devices: unknownDevices,
             sendAnywayLabel: sendAnywayLabel,
-            onSendAnyway: onSendAnywayClicked,
+            sendLabel: sendLabel,
+            onSend: sendAnyway,
         }, 'mx_Dialog_unknownDevice');
     });
 }
-
-function markAllDevicesKnown(matrixClient, devices) {
-    Object.keys(devices).forEach((userId) => {
-        Object.keys(devices[userId]).map((deviceId) => {
-            matrixClient.setDeviceKnown(userId, deviceId, true);
-        });
-    });
-}

src/i18n/strings/en_EN.json

@@ -7,6 +7,8 @@
     "Review Devices": "Review Devices",
     "Call Anyway": "Call Anyway",
     "Answer Anyway": "Answer Anyway",
+    "Call": "Call",
+    "Answer": "Answer",
     "Call Timeout": "Call Timeout",
     "The remote side failed to pick up": "The remote side failed to pick up",
     "Unable to capture screen": "Unable to capture screen",
@@ -162,6 +164,7 @@
     "Failure to create room": "Failure to create room",
     "Server may be unavailable, overloaded, or you hit a bug.": "Server may be unavailable, overloaded, or you hit a bug.",
     "Send anyway": "Send anyway",
+    "Send": "Send",
     "Unnamed Room": "Unnamed Room",
     "Your browser does not support the required cryptography extensions": "Your browser does not support the required cryptography extensions",
     "Not a valid Riot keyfile": "Not a valid Riot keyfile",