Move and merge QuestionDialog and ErrorDialog

src/CallHandler.js

@@ -115,7 +115,7 @@ function _setCallListeners(call) {
             _setCallState(call, call.roomId, "busy");
             pause("ringbackAudio");
             play("busyAudio");
-            var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+            var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
             Modal.createDialog(ErrorDialog, {
                 title: "Call Timeout",
                 description: "The remote side failed to pick up."
@@ -173,7 +173,7 @@ function _onAction(payload) {
             console.error("Unknown conf call type: %s", payload.type);
         }
     }
-    var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+    var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
 
     switch (payload.action) {
         case 'place_call':
@@ -202,7 +202,7 @@ function _onAction(payload) {
 
             var members = room.getJoinedMembers();
             if (members.length <= 1) {
-                var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+                var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
                     description: "You cannot place a call with yourself."
                 });

src/components/views/dialogs/ErrorDialog.js

@@ -14,9 +14,21 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
+/*
+ * Usage:
+ * Modal.createDialog(ErrorDialog, {
+ *   title: "some text", (default: "Error")
+ *   description: "some more text",
+ *   button: "Button Text",
+ *   onClose: someFunction,
+ *   focus: true|false (default: true)
+ * });
+ */
+
 var React = require("react");
 
-module.exports = {
+module.exports = React.createClass({
+    displayName: 'ErrorDialog',
     propTypes: {
         title: React.PropTypes.string,
         button: React.PropTypes.string,
@@ -32,4 +44,22 @@ module.exports = {
             focus: true,
         };
     },
-};
+
+    render: function() {
+        return (
+            <div className="mx_ErrorDialog">
+                <div className="mx_ErrorDialogTitle">
+                    {this.props.title}
+                </div>
+                <div className="mx_Dialog_content">
+                    {this.props.description}
+                </div>
+                <div className="mx_Dialog_buttons">
+                    <button onClick={this.props.onFinished} autoFocus={this.props.focus}>
+                        {this.props.button}
+                    </button>
+                </div>
+            </div>
+        );
+    }
+});

src/components/views/dialogs/QuestionDialog.js

@@ -16,7 +16,8 @@ limitations under the License.
 
 var React = require("react");
 
-module.exports = {
+module.exports = React.createClass({
+    displayName: 'QuestionDialog',
     propTypes: {
         title: React.PropTypes.string,
         description: React.PropTypes.string,
@@ -33,4 +34,34 @@ module.exports = {
             focus: true,
         };
     },
-};
+
+    onOk: function() {
+        this.props.onFinished(true);
+    },
+
+    onCancel: function() {
+        this.props.onFinished(false);
+    },
+
+    render: function() {
+        return (
+            <div className="mx_QuestionDialog">
+                <div className="mx_QuestionDialogTitle">
+                    {this.props.title}
+                </div>
+                <div className="mx_Dialog_content">
+                    {this.props.description}
+                </div>
+                <div className="mx_Dialog_buttons">
+                    <button onClick={this.onOk} autoFocus={this.props.focus}>
+                        {this.props.button}
+                    </button>
+
+                    <button onClick={this.onCancel}>
+                        Cancel
+                    </button>
+                </div>
+            </div>
+        );
+    }
+});

src/components/views/messages/MessageComposer.js

@@ -272,7 +272,7 @@ module.exports = React.createClass({
                 this.markdownEnabled = false;
             }
             else {
-                var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+                var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
                     title: "Unknown command",
                     description: "Usage: /markdown on|off"
@@ -292,7 +292,7 @@ module.exports = React.createClass({
                     console.log("Command success.");
                 }, function(err) {
                     console.error("Command failure: %s", err);
-                    var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+                    var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                     Modal.createDialog(ErrorDialog, {
                         title: "Server error",
                         description: err.message
@@ -301,7 +301,7 @@ module.exports = React.createClass({
             }
             else if (cmd.error) {
                 console.error(cmd.error);
-                var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+                var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
                     title: "Command error",
                     description: cmd.error

src/components/views/rooms/MemberInfo.js

@@ -43,7 +43,7 @@ module.exports = React.createClass({
     },
 
     onKick: function() {
-        var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+        var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
         var roomId = this.props.member.roomId;
         var target = this.props.member.userId;
         MatrixClientPeg.get().kick(roomId, target).done(function() {
@@ -60,7 +60,7 @@ module.exports = React.createClass({
     },
 
     onBan: function() {
-        var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+        var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
         var roomId = this.props.member.roomId;
         var target = this.props.member.userId;
         MatrixClientPeg.get().ban(roomId, target).done(function() {
@@ -77,7 +77,7 @@ module.exports = React.createClass({
     },
 
     onMuteToggle: function() {
-        var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+        var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
         var roomId = this.props.member.roomId;
         var target = this.props.member.userId;
         var room = MatrixClientPeg.get().getRoom(roomId);
@@ -121,7 +121,7 @@ module.exports = React.createClass({
     },
 
     onModToggle: function() {
-        var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+        var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
         var roomId = this.props.member.roomId;
         var target = this.props.member.userId;
         var room = MatrixClientPeg.get().getRoom(roomId);
@@ -218,8 +218,8 @@ module.exports = React.createClass({
     // FIXME: this is horribly duplicated with MemberTile's onLeaveClick.
     // Not sure what the right solution to this is.
     onLeaveClick: function() {
-        var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
-        var QuestionDialog = sdk.getComponent("organisms.QuestionDialog");
+        var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
+        var QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
 
         var roomId = this.props.member.roomId;
         Modal.createDialog(QuestionDialog, {

src/components/views/rooms/MemberTile.js

@@ -31,7 +31,7 @@ module.exports = React.createClass({
     },
 
     onLeaveClick: function() {
-        var QuestionDialog = sdk.getComponent("organisms.QuestionDialog");
+        var QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
 
         var roomId = this.props.member.roomId;
         Modal.createDialog(QuestionDialog, {

src/controllers/organisms/MemberList.js

@@ -113,7 +113,7 @@ module.exports = {
     },
 
     onInvite: function(inputText) {
-        var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+        var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
         var self = this;
         inputText = inputText.trim(); // react requires es5-shim so we know trim() exists
         var isEmailAddress = /^\S+@\S+\.\S+$/.test(inputText);

src/controllers/organisms/RoomView.js

@@ -435,7 +435,7 @@ module.exports = {
         if (deferreds.length) {
             var self = this;
             q.all(deferreds).fail(function(err) {
-                var ErrorDialog = sdk.getComponent("organisms.ErrorDialog");
+                var ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
                 Modal.createDialog(ErrorDialog, {
                     title: "Failed to set state",
                     description: err.toString()