Show a dialog if the maximum number of widgets allowed has been reached.

src/components/views/rooms/AppsDrawer.js

@@ -28,6 +28,8 @@ import ScalarMessaging from '../../../ScalarMessaging';
 import { _t } from '../../../languageHandler';
 import WidgetUtils from '../../../WidgetUtils';
 
+// The maximum number of widgets that can be added in a room
+const MAX_WIDGETS = 2;
 
 module.exports = React.createClass({
     displayName: 'AppsDrawer',
@@ -162,6 +164,18 @@ module.exports = React.createClass({
             e.preventDefault();
         }
 
+        // Display a warning dialog if the max number of widgets have already been added to the room
+        if (this.state.apps && this.state.apps.length >= MAX_WIDGETS) {
+            const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
+            const errorMsg = `The maximum number of ${MAX_WIDGETS} widgets have already been added to this room.`;
+            console.error(errorMsg);
+            Modal.createDialog(ErrorDialog, {
+                title: _t("Cannot add any more widgets"),
+                description: _t("The maximum permitted number of widgets have already been added to this room."),
+            });
+            return;
+        }
+
         const IntegrationsManager = sdk.getComponent("views.settings.IntegrationsManager");
         const src = (this.scalarClient !== null && this.scalarClient.hasCredentials()) ?
                 this.scalarClient.getScalarInterfaceUrlForRoom(this.props.room.roomId, 'add_integ') :
@@ -186,21 +200,22 @@ module.exports = React.createClass({
                 />);
             });
 
-        const addWidget = this.state.apps && this.state.apps.length < 2 && this._canUserModify() &&
+        const addWidget = (
-            (<div onClick={this.onClickAddWidget}
+            <div onClick={this.onClickAddWidget}
                 role="button"
                 tabIndex="0"
                 className="mx_AddWidget_button"
                 title={_t('Add a widget')}>
                 [+] {_t('Add a widget')}
-                        </div>);
+            </div>
+        );
 
         return (
             <div className="mx_AppsDrawer">
                 <div id="apps" className="mx_AppsContainer">
                     {apps}
                 </div>
-                {addWidget}
+                {this._canUserModify() && addWidget}
             </div>
         );
     },

src/i18n/strings/en_EN.json

@@ -190,6 +190,7 @@
     "Can't connect to homeserver - please check your connectivity, ensure your <a>homeserver's SSL certificate</a> is trusted, and that a browser extension is not blocking requests.": "Can't connect to homeserver - please check your connectivity, ensure your <a>homeserver's SSL certificate</a> is trusted, and that a browser extension is not blocking requests.",
     "Can't connect to homeserver via HTTP when an HTTPS URL is in your browser bar. Either use HTTPS or <a>enable unsafe scripts</a>.": "Can't connect to homeserver via HTTP when an HTTPS URL is in your browser bar. Either use HTTPS or <a>enable unsafe scripts</a>.",
     "Can't load user settings": "Can't load user settings",
+    "Cannot add any more widgets": "Cannot add any more widgets",
     "Change Password": "Change Password",
     "%(senderName)s changed their display name from %(oldDisplayName)s to %(displayName)s.": "%(senderName)s changed their display name from %(oldDisplayName)s to %(displayName)s.",
     "%(senderName)s changed their profile picture.": "%(senderName)s changed their profile picture.",
@@ -546,6 +547,7 @@
     "Tagged as: ": "Tagged as: ",
     "The default role for new room members is": "The default role for new room members is",
     "The main address for this room is": "The main address for this room is",
+    "The maximum permitted number of widgets have already been added to this room.": "The maximum permitted number of widgets have already been added to this room.",
     "The phone number entered looks invalid": "The phone number entered looks invalid",
     "The signing key you provided matches the signing key you received from %(userId)s's device %(deviceId)s. Device marked as verified.": "The signing key you provided matches the signing key you received from %(userId)s's device %(deviceId)s. Device marked as verified.",
     "This action cannot be performed by a guest user. Please register to be able to do this.": "This action cannot be performed by a guest user. Please register to be able to do this.",