diff --git a/src/Modal.js b/src/Modal.js
index d3a5404e1e..44072b9278 100644
--- a/src/Modal.js
+++ b/src/Modal.js
@@ -35,36 +35,13 @@ module.exports = {
         return container;
     },
 
-    createDialogWithElement: function(element, props, className) {
-        var self = this;
-
-        var closeDialog = function() {
-            ReactDOM.unmountComponentAtNode(self.getOrCreateContainer());
-
-            if (props && props.onFinished) props.onFinished.apply(null, arguments);
-        };
-
-        var dialog = (
-            <div className={"mx_Dialog_wrapper " + className}>
-                <div className="mx_Dialog">
-                    {element}
-                </div>
-                <div className="mx_Dialog_background" onClick={closeDialog}></div>
-            </div>
-        );
-
-        ReactDOM.render(dialog, this.getOrCreateContainer());
-
-        return {close: closeDialog};
-    },
-
     createDialog: function (Element, props, className) {
         var self = this;
 
+        // never call this via modal.close() from onFinished() otherwise it will loop
         var closeDialog = function() {
-            ReactDOM.unmountComponentAtNode(self.getOrCreateContainer());
-
             if (props && props.onFinished) props.onFinished.apply(null, arguments);
+            ReactDOM.unmountComponentAtNode(self.getOrCreateContainer());
         };
 
         // FIXME: If a dialog uses getDefaultProps it clobbers the onFinished
@@ -74,7 +51,7 @@ module.exports = {
                 <div className="mx_Dialog">
                     <Element {...props} onFinished={closeDialog}/>
                 </div>
-                <div className="mx_Dialog_background" onClick={closeDialog}></div>
+                <div className="mx_Dialog_background" onClick={ closeDialog.bind(this, false) }></div>
             </div>
         );
 
diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js
index 389d7be9fb..1cb576d14f 100644
--- a/src/components/structures/RoomView.js
+++ b/src/components/structures/RoomView.js
@@ -522,16 +522,22 @@ module.exports = React.createClass({
                     var SetDisplayNameDialog = sdk.getComponent('views.dialogs.SetDisplayNameDialog');
                     var dialog_defer = q.defer();
                     var dialog_ref;
-                    var modal;
-                    var dialog_instance = <SetDisplayNameDialog currentDisplayName={result.displayname} ref={(r) => {
+                    Modal.createDialog(SetDisplayNameDialog, {
+                        currentDisplayName: result.displayname,
+                        ref: (r) => {
                             dialog_ref = r;
-                    }} onFinished={() => {
-                        cli.setDisplayName(dialog_ref.getValue()).done(() => {
-                            dialog_defer.resolve();
-                        });
-                        modal.close();
-                    }} />
-                    modal = Modal.createDialogWithElement(dialog_instance);
+                        },
+                        onFinished: (submitted) => {
+                            if (submitted) {
+                                cli.setDisplayName(dialog_ref.getValue()).done(() => {
+                                    dialog_defer.resolve();
+                                });
+                            }
+                            else {
+                                dialog_defer.reject();
+                            }
+                        }
+                    });
                     return dialog_defer.promise;
                 }
             });
@@ -561,6 +567,8 @@ module.exports = React.createClass({
                 joining: false,
                 joinError: error
             });
+
+            if (!error) return;
             var msg = error.message ? error.message : JSON.stringify(error);
             var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
             Modal.createDialog(ErrorDialog, {
diff --git a/src/components/structures/UserSettings.js b/src/components/structures/UserSettings.js
index bf66e43ab8..99198ac691 100644
--- a/src/components/structures/UserSettings.js
+++ b/src/components/structures/UserSettings.js
@@ -126,9 +126,7 @@ module.exports = React.createClass({
 
     onLogoutClicked: function(ev) {
         var LogoutPrompt = sdk.getComponent('dialogs.LogoutPrompt');
-        this.logoutModal = Modal.createDialog(
-            LogoutPrompt, {onCancel: this.onLogoutPromptCancel}
-        );
+        this.logoutModal = Modal.createDialog(LogoutPrompt);
     },
 
     onPasswordChangeError: function(err) {
@@ -162,10 +160,6 @@ module.exports = React.createClass({
         });
     },
 
-    onLogoutPromptCancel: function() {
-        this.logoutModal.closeDialog();
-    },
-
     onEnableNotificationsChange: function(event) {
         UserSettingsStore.setEnableNotifications(event.target.checked);
     },
diff --git a/src/components/views/dialogs/ErrorDialog.js b/src/components/views/dialogs/ErrorDialog.js
index d06cf2de84..c3f4ca6a55 100644
--- a/src/components/views/dialogs/ErrorDialog.js
+++ b/src/components/views/dialogs/ErrorDialog.js
@@ -31,6 +31,10 @@ module.exports = React.createClass({
     displayName: 'ErrorDialog',
     propTypes: {
         title: React.PropTypes.string,
+        description: React.PropTypes.oneOfType([
+            React.PropTypes.element,
+            React.PropTypes.string,
+        ]),
         button: React.PropTypes.string,
         focus: React.PropTypes.bool,
         onFinished: React.PropTypes.func.isRequired,
diff --git a/src/components/views/dialogs/QuestionDialog.js b/src/components/views/dialogs/QuestionDialog.js
index 20f06b6719..88620e3495 100644
--- a/src/components/views/dialogs/QuestionDialog.js
+++ b/src/components/views/dialogs/QuestionDialog.js
@@ -20,7 +20,10 @@ module.exports = React.createClass({
     displayName: 'QuestionDialog',
     propTypes: {
         title: React.PropTypes.string,
-        description: React.PropTypes.object,
+        description: React.PropTypes.oneOfType([
+            React.PropTypes.element,
+            React.PropTypes.string,
+        ]),
         button: React.PropTypes.string,
         focus: React.PropTypes.bool,
         onFinished: React.PropTypes.func.isRequired,
diff --git a/src/components/views/dialogs/SetDisplayNameDialog.js b/src/components/views/dialogs/SetDisplayNameDialog.js
index 624bb50a46..81ceb21696 100644
--- a/src/components/views/dialogs/SetDisplayNameDialog.js
+++ b/src/components/views/dialogs/SetDisplayNameDialog.js
@@ -54,7 +54,7 @@ module.exports = React.createClass({
 
     onFormSubmit: function(ev) {
         ev.preventDefault();
-        this.props.onFinished();
+        this.props.onFinished(true);
         return false;
     },
 
diff --git a/src/components/views/dialogs/TextInputDialog.js b/src/components/views/dialogs/TextInputDialog.js
index 3cda852449..d81ae98718 100644
--- a/src/components/views/dialogs/TextInputDialog.js
+++ b/src/components/views/dialogs/TextInputDialog.js
@@ -20,7 +20,10 @@ module.exports = React.createClass({
     displayName: 'TextInputDialog',
     propTypes: {
         title: React.PropTypes.string,
-        description: React.PropTypes.string,
+        description: React.PropTypes.oneOfType([
+            React.PropTypes.element,
+            React.PropTypes.string,
+        ]),
         value: React.PropTypes.string,
         button: React.PropTypes.string,
         focus: React.PropTypes.bool,