Merge pull request #2108 from matrix-org/dbkr/chairman_mau_pt_3_sync_error

Support MAU error on sync

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;
 }

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

@@ -0,0 +1,31 @@
+/*
+Copyright 2018 New Vector Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import React from 'react';
+import { _t } from '../../../languageHandler';
+
+export default React.createClass({
+    render: function() {
+        const toolbarClasses = "mx_MatrixToolbar mx_MatrixToolbar_error";
+        return (
+            <div className={toolbarClasses}>
+                <div className="mx_MatrixToolbar_content">
+                    { _t("This homeserver has hit its Monthly Active User limit. Please contact your service administrator to continue using the service.") }
+                </div>
+            </div>
+        );
+    },
+});

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.",