support scrollable content for UnknownDeviceDialog

Author: ara4n

src/Modal.js

@@ -177,7 +177,7 @@ class ModalManager {
 
         var modal = this._modals[0];
         var dialog = (
-            <div className={"mx_Dialog_wrapper " + modal.className}>
+            <div className={"mx_Dialog_wrapper " + (modal.className ? modal.className : '') }>
                 <div className="mx_Dialog">
                     {modal.elem}
                 </div>

src/Resend.js

@@ -33,7 +33,7 @@ module.exports = {
                 var UnknownDeviceDialog = sdk.getComponent("dialogs.UnknownDeviceDialog");
                 Modal.createDialog(UnknownDeviceDialog, {
                     devices: err.devices
-                });
+                }, "mx_Dialog_unknownDevice");
             }
 
             dis.dispatch({

src/components/views/dialogs/UnknownDeviceDialog.js

@@ -17,6 +17,7 @@ limitations under the License.
 import React from 'react';
 import sdk from '../../../index';
 import MatrixClientPeg from '../../../MatrixClientPeg';
+import GeminiScrollbar from 'react-gemini-scrollbar';
 
 function UserUnknownDeviceList(props) {
     const {userDevices} = props;
@@ -81,20 +82,20 @@ export default React.createClass({
                 onFinished={this.props.onFinished}
                 title='Room contains unknown devices'
             >
-                <div className="mx_Dialog_content">
+                <GeminiScrollbar autoshow={true} className="mx_Dialog_content">
                     <h4>This room contains devices which have not been
                     verified.</h4>
                     <p>
                         This means there is no guarantee that the devices belong
-                        to a valid user of the room.
+                        to a rightful user of the room.
                     </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.
                     </p>
                     <p>Unknown devices:</p>
                     <UnknownDeviceList devices={this.props.devices} />
-                </div>
+                </GeminiScrollbar>
                 <div className="mx_Dialog_buttons">
                     <button className="mx_Dialog_primary" autoFocus={ true }
                             onClick={ this.props.onFinished } >

src/components/views/rooms/MessageComposerInputOld.js

@@ -34,7 +34,7 @@ export function onSendMessageFailed(err) {
         const UnknownDeviceDialog = sdk.getComponent("dialogs.UnknownDeviceDialog");
         Modal.createDialog(UnknownDeviceDialog, {
             devices: err.devices,
-        });
+        }, "mx_Dialog_unknownDevice");
     }
     dis.dispatch({
         action: 'message_send_failed',