Merge remote-tracking branch 'origin/develop' into develop

res/css/views/globals/_MatrixToolbar.scss

@@ -28,6 +28,12 @@ limitations under the License.
     margin-top: -2px;
 }
 
+.mx_MatrixToolbar_error {
+    padding-left: 16px;
+    padding-right: 8px;
+    background-color: $warning-bg-color;
+}
+
 .mx_MatrixToolbar_content {
     flex: 1;
 }
@@ -59,4 +65,4 @@ limitations under the License.
 
 .mx_MatrixToolbar_changelog {
     white-space: pre;
-}
+}

res/themes/dark/css/_dark.scss

@@ -19,6 +19,7 @@ $focus-brightness: 200%;
 
 // red warning colour
 $warning-color: #ff0064;
+$warning-bg-color: #DF2A8B;
 
 // groups
 $info-plinth-bg-color: #454545;

res/themes/light/css/_base.scss

@@ -25,6 +25,8 @@ $focus-brightness: 125%;
 
 // red warning colour
 $warning-color: #ff0064;
+// background colour for warnings
+$warning-bg-color: #DF2A8B;
 $mention-user-pill-bg-color: #ff0064;
 $other-user-pill-bg-color: rgba(0, 0, 0, 0.1);
 

src/components/structures/LoggedInView.js

@@ -98,6 +98,7 @@ const LoggedInView = React.createClass({
         this._setStateFromSessionStore();
 
         this._matrixClient.on("accountData", this.onAccountData);
+        this._matrixClient.on("sync", this.onSync);
     },
 
     componentWillUnmount: function() {
@@ -142,6 +143,20 @@ const LoggedInView = React.createClass({
         }
     },
 
+    onSync: function(syncState, oldSyncState, data) {
+        if (syncState === oldSyncState) return;
+
+        if (syncState === 'ERROR') {
+            this.setState({
+                syncErrorData: data,
+            });
+        } else {
+            this.setState({
+                syncErrorData: null,
+            });
+        }
+    },
+
     _onKeyDown: function(ev) {
             /*
             // Remove this for now as ctrl+alt = alt-gr so this breaks keyboards which rely on alt-gr for numbers
@@ -286,6 +301,7 @@ const LoggedInView = React.createClass({
         const NewVersionBar = sdk.getComponent('globals.NewVersionBar');
         const UpdateCheckBar = sdk.getComponent('globals.UpdateCheckBar');
         const PasswordNagBar = sdk.getComponent('globals.PasswordNagBar');
+        const ServerLimitBar = sdk.getComponent('globals.ServerLimitBar');
 
         let page_element;
         let right_panel = '';
@@ -370,7 +386,9 @@ const LoggedInView = React.createClass({
 
         let topBar;
         const isGuest = this.props.matrixClient.isGuest();
-        if (this.props.showCookieBar &&
+        if (this.state.syncErrorData && this.state.syncErrorData.error.errcode === 'M_MAU_LIMIT_EXCEEDED') {
+            topBar = <ServerLimitBar />;
+        } else if (this.props.showCookieBar &&
             this.props.config.piwik
         ) {
             const policyUrl = this.props.config.piwik.policyUrl || null;

src/components/views/globals/ServerLimitBar.js

@@ -15,7 +15,6 @@ limitations under the License.
 */
 
 import React from 'react';
-import sdk from '../../../index';
 import { _t } from '../../../languageHandler';
 
 export default React.createClass({

src/i18n/strings/en_EN.json

@@ -677,6 +677,7 @@
     "A new version of Riot is available.": "A new version of Riot is available.",
     "To return to your account in future you need to <u>set a password</u>": "To return to your account in future you need to <u>set a password</u>",
     "Set Password": "Set Password",
+    "This homeserver has hit its Monthly Active User limit. Please contact your service administrator to continue using the service.": "This homeserver has hit its Monthly Active User limit. Please contact your service administrator to continue using the service.",
     "Error encountered (%(errorDetail)s).": "Error encountered (%(errorDetail)s).",
     "Checking for an update...": "Checking for an update...",
     "No update available.": "No update available.",