Merge pull request #721 from matrix-org/luke/fix-refactor-UnknownDeviceDialog

Show UDDialog on UDE during VoIP calls

src/CallHandler.js

@@ -105,6 +105,15 @@ function _setCallListeners(call) {
         call.hangup();
         _setCallState(undefined, call.roomId, "ended");
     });
+    call.on('send_event_error', function(err) {
+        if (err.name === "UnknownDeviceError") {
+            dis.dispatch({
+                action: 'unknown_device_error',
+                err: err,
+                room: MatrixClientPeg.get().getRoom(call.roomId),
+            });
+        }
+    });
     call.on("hangup", function() {
         _setCallState(undefined, call.roomId, "ended");
     });

src/Resend.js

@@ -20,9 +20,24 @@ var sdk = require('./index');
 var Modal = require('./Modal');
 
 module.exports = {
+    resendUnsentEvents: function(room) {
+        room.getPendingEvents().filter(function(ev) {
+            return ev.status === Matrix.EventStatus.NOT_SENT;
+        }).forEach(function(event) {
+            module.exports.resend(event);
+        });
+    },
+    cancelUnsentEvents: function(room) {
+        room.getPendingEvents().filter(function(ev) {
+            return ev.status === Matrix.EventStatus.NOT_SENT;
+        }).forEach(function(event) {
+            module.exports.removeFromQueue(event);
+        });
+    },
     resend: function(event) {
+        const room = MatrixClientPeg.get().getRoom(event.getRoomId());
         MatrixClientPeg.get().resendEvent(
-            event, MatrixClientPeg.get().getRoom(event.getRoomId())
+            event, room
         ).done(function(res) {
             dis.dispatch({
                 action: 'message_sent',
@@ -33,16 +48,11 @@ module.exports = {
             // https://github.com/vector-im/riot-web/issues/3148
             console.log('Resend got send failure: ' + err.name + '('+err+')');
             if (err.name === "UnknownDeviceError") {
-                var UnknownDeviceDialog = sdk.getComponent("dialogs.UnknownDeviceDialog");
-                Modal.createDialog(UnknownDeviceDialog, {
-                    devices: err.devices,
-                    room: MatrixClientPeg.get().getRoom(event.getRoomId()),
-                    onFinished: (r) => {
-                        // XXX: temporary logging to try to diagnose
-                        // https://github.com/vector-im/riot-web/issues/3148
-                        console.log('UnknownDeviceDialog closed with '+r);
-                    },
-                }, "mx_Dialog_unknownDevice");
+                dis.dispatch({
+                    action: 'unknown_device_error',
+                    err: err,
+                    room: room,
+                });
             }
 
             dis.dispatch({
@@ -51,7 +61,6 @@ module.exports = {
             });
         });
     },
-
     removeFromQueue: function(event) {
         MatrixClientPeg.get().cancelPendingEvent(event);
         dis.dispatch({

src/UnknownDeviceErrorHandler.js

@@ -0,0 +1,31 @@
+import dis from './dispatcher';
+import sdk from './index';
+import Modal from './Modal';
+
+const onAction = function(payload) {
+    if (payload.action === 'unknown_device_error') {
+        var UnknownDeviceDialog = sdk.getComponent("dialogs.UnknownDeviceDialog");
+        Modal.createDialog(UnknownDeviceDialog, {
+            devices: payload.err.devices,
+            room: payload.room,
+            onFinished: (r) => {
+                // XXX: temporary logging to try to diagnose
+                // https://github.com/vector-im/riot-web/issues/3148
+                console.log('UnknownDeviceDialog closed with '+r);
+            },
+        }, "mx_Dialog_unknownDevice");
+    }
+}
+
+let ref = null;
+
+export function startListening () {
+    ref = dis.register(onAction);
+}
+
+export function stopListening () {
+    if (ref) {
+        dis.unregister(ref);
+        ref = null;
+    }
+}

src/components/structures/MatrixChat.js

@@ -41,6 +41,7 @@ var Lifecycle = require('../../Lifecycle');
 var PageTypes = require('../../PageTypes');
 
 var createRoom = require("../../createRoom");
+import * as UDEHandler from '../../UnknownDeviceErrorHandler';
 
 module.exports = React.createClass({
     displayName: 'MatrixChat',
@@ -239,6 +240,7 @@ module.exports = React.createClass({
 
     componentDidMount: function() {
         this.dispatcherRef = dis.register(this.onAction);
+        UDEHandler.startListening();
 
         this.focusComposer = false;
         window.addEventListener("focus", this.onFocus);
@@ -285,6 +287,7 @@ module.exports = React.createClass({
     componentWillUnmount: function() {
         Lifecycle.stopMatrixClient();
         dis.unregister(this.dispatcherRef);
+        UDEHandler.stopListening();
         window.removeEventListener("focus", this.onFocus);
         window.removeEventListener('resize', this.handleResize);
     },

src/components/structures/RoomView.js

@@ -716,17 +716,11 @@ module.exports = React.createClass({
     },
 
     onResendAllClick: function() {
-        var eventsToResend = this._getUnsentMessages(this.state.room);
-        eventsToResend.forEach(function(event) {
-            Resend.resend(event);
-        });
+        Resend.resendUnsentEvents(this.state.room);
     },
 
     onCancelAllClick: function() {
-        var eventsToResend = this._getUnsentMessages(this.state.room);
-        eventsToResend.forEach(function(event) {
-            Resend.removeFromQueue(event);
-        });
+        Resend.cancelUnsentEvents(this.state.room);
     },
 
     onJoinButtonClicked: function(ev) {

src/components/views/dialogs/UnknownDeviceDialog.js

@@ -16,6 +16,7 @@ limitations under the License.
 
 import React from 'react';
 import sdk from '../../../index';
+import dis from '../../../dispatcher';
 import MatrixClientPeg from '../../../MatrixClientPeg';
 import GeminiScrollbar from 'react-gemini-scrollbar';
 
@@ -85,7 +86,7 @@ UnknownDeviceList.propTypes = {
 
 
 export default React.createClass({
-    displayName: 'UnknownEventDialog',
+    displayName: 'UnknownDeviceDialog',
 
     propTypes: {
         room: React.PropTypes.object.isRequired,
@@ -125,14 +126,10 @@ export default React.createClass({
         } else {
             warning = (
                 <div>
-                    <p>
-                        This means there is no guarantee that the devices
-                        belong to the users they claim to.
-                    </p>
                     <p>
                         We recommend you go through the verification process
-                        for each device before continuing, but you can resend
-                        the message without verifying if you prefer.
+                        for each device to confirm they belong to their legitimate owner,
+                        but you can resend the message without verifying if you prefer.
                     </p>
                 </div>
             );
@@ -151,8 +148,7 @@ export default React.createClass({
             >
                 <GeminiScrollbar autoshow={false} className="mx_Dialog_content">
                     <h4>
-                        This room contains unknown devices which have not been
-                        verified.
+                        This room contains devices that you haven't seen before.
                     </h4>
                     { warning }
                     Unknown devices:
@@ -160,6 +156,13 @@ export default React.createClass({
                     <UnknownDeviceList devices={this.props.devices} />
                 </GeminiScrollbar>
                 <div className="mx_Dialog_buttons">
+                    <button className="mx_Dialog_primary" autoFocus={ true }
+                            onClick={() => {
+                                this.props.onFinished();
+                                Resend.resendUnsentEvents(this.props.room);
+                            }}>
+                        Send anyway
+                    </button>
                     <button className="mx_Dialog_primary" autoFocus={ true }
                             onClick={() => {
                                 // XXX: temporary logging to try to diagnose

src/components/views/rooms/MessageComposerInputOld.js

@@ -34,16 +34,11 @@ export function onSendMessageFailed(err, room) {
     // https://github.com/vector-im/riot-web/issues/3148
     console.log('MessageComposer got send failure: ' + err.name + '('+err+')');
     if (err.name === "UnknownDeviceError") {
-        const UnknownDeviceDialog = sdk.getComponent("dialogs.UnknownDeviceDialog");
-        Modal.createDialog(UnknownDeviceDialog, {
-            devices: err.devices,
+        dis.dispatch({
+            action: 'unknown_device_error',
+            err: err,
             room: room,
-            onFinished: (r) => {
-                // XXX: temporary logging to try to diagnose
-                // https://github.com/vector-im/riot-web/issues/3148
-                console.log('UnknownDeviceDialog closed with '+r);
-            },
-        }, "mx_Dialog_unknownDevice");
+        });
     }
     dis.dispatch({
         action: 'message_send_failed',