Adding reload and recycle buttons to system console (#3102)

webapp/components/admin_console/configuration_settings.jsx

@@ -9,6 +9,7 @@ import AdminSettings from './admin_settings.jsx';
 import {FormattedMessage} from 'react-intl';
 import SettingsGroup from './settings_group.jsx';
 import TextSetting from './text_setting.jsx';
+import ReloadConfigButton from './reload_config.jsx';
 
 export default class ConfigurationSettings extends AdminSettings {
     constructor(props) {
@@ -50,6 +51,7 @@ export default class ConfigurationSettings extends AdminSettings {
                     />
                 }
             >
+                <ReloadConfigButton/>
                 <TextSetting
                     id='listenAddress'
                     label={

webapp/components/admin_console/database_settings.jsx

@@ -11,6 +11,7 @@ import {FormattedMessage} from 'react-intl';
 import GeneratedSetting from './generated_setting.jsx';
 import SettingsGroup from './settings_group.jsx';
 import TextSetting from './text_setting.jsx';
+import RecycleDbButton from './recycle_db.jsx';
 
 export default class DatabaseSettings extends AdminSettings {
     constructor(props) {
@@ -186,6 +187,7 @@ export default class DatabaseSettings extends AdminSettings {
                     value={this.state.trace}
                     onChange={this.handleChange}
                 />
+                <RecycleDbButton/>
             </SettingsGroup>
         );
     }

webapp/components/admin_console/recycle_db.jsx

@@ -0,0 +1,96 @@
+// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import React from 'react';
+
+import Client from 'utils/web_client.jsx';
+import * as Utils from 'utils/utils.jsx';
+
+import {FormattedMessage} from 'react-intl';
+
+export default class RecycleDbButton extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.handleRecycle = this.handleRecycle.bind(this);
+
+        this.state = {
+            loading: false,
+            fail: null
+        };
+    }
+
+    handleRecycle(e) {
+        e.preventDefault();
+
+        this.setState({
+            loading: true,
+            fail: null
+        });
+
+        Client.recycleDatabaseConnection(
+            () => {
+                this.setState({
+                    loading: false
+                });
+            },
+            (err) => {
+                this.setState({
+                    loading: false,
+                    fail: err.message + ' - ' + err.detailed_error
+                });
+            }
+        );
+    }
+
+    render() {
+        let testMessage = null;
+        if (this.state.fail) {
+            testMessage = (
+                <div className='alert alert-warning'>
+                    <i className='fa fa-warning'></i>
+                    <FormattedMessage
+                        id='admin.recycle.reloadFail'
+                        defaultMessage='Recycling unsuccessful: {error}'
+                        values={{
+                            error: this.state.fail
+                        }}
+                    />
+                </div>
+            );
+        }
+
+        let contents = null;
+        if (this.state.loading) {
+            contents = (
+                <span>
+                    <span className='glyphicon glyphicon-refresh glyphicon-refresh-animate'/>
+                    {Utils.localizeMessage('admin.recycle.loading', ' Recycling...')}
+                </span>
+            );
+        } else {
+            contents = (
+                <FormattedMessage
+                    id='admin.recycle.button'
+                    defaultMessage='Recycle Database Connections'
+                />
+            );
+        }
+
+        return (
+            <div className='form-group recycle-db'>
+                <div className='col-sm-offset-4 col-sm-8'>
+                    <div>
+                        <button
+                            className='btn btn-default'
+                            onClick={this.handleRecycle}
+                        >
+                            {contents}
+                        </button>
+                        {testMessage}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}

webapp/components/admin_console/reload_config.jsx

@@ -0,0 +1,96 @@
+// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import React from 'react';
+
+import Client from 'utils/web_client.jsx';
+import * as Utils from 'utils/utils.jsx';
+
+import {FormattedMessage} from 'react-intl';
+
+export default class ReloadConfigButton extends React.Component {
+    constructor(props) {
+        super(props);
+
+        this.handleReloadConfig = this.handleReloadConfig.bind(this);
+
+        this.state = {
+            loading: false,
+            fail: null
+        };
+    }
+
+    handleReloadConfig(e) {
+        e.preventDefault();
+
+        this.setState({
+            loading: true,
+            fail: null
+        });
+
+        Client.reloadConfig(
+            () => {
+                this.setState({
+                    loading: false
+                });
+            },
+            (err) => {
+                this.setState({
+                    loading: false,
+                    fail: err.message + ' - ' + err.detailed_error
+                });
+            }
+        );
+    }
+
+    render() {
+        let testMessage = null;
+        if (this.state.fail) {
+            testMessage = (
+                <div className='alert alert-warning'>
+                    <i className='fa fa-warning'></i>
+                    <FormattedMessage
+                        id='admin.reload.reloadFail'
+                        defaultMessage='Reload unsuccessful: {error}'
+                        values={{
+                            error: this.state.fail
+                        }}
+                    />
+                </div>
+            );
+        }
+
+        let contents = null;
+        if (this.state.loading) {
+            contents = (
+                <span>
+                    <span className='glyphicon glyphicon-refresh glyphicon-refresh-animate'/>
+                    {Utils.localizeMessage('admin.reload.loading', ' Loading...')}
+                </span>
+            );
+        } else {
+            contents = (
+                <FormattedMessage
+                    id='admin.reload.button'
+                    defaultMessage='Reload Configuration From Disk'
+                />
+            );
+        }
+
+        return (
+            <div className='form-group reload-config'>
+                <div className='col-sm-offset-4 col-sm-8'>
+                    <div>
+                        <button
+                            className='btn btn-default'
+                            onClick={this.handleReloadConfig}
+                        >
+                            {contents}
+                        </button>
+                        {testMessage}
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}

webapp/i18n/en.json

@@ -123,6 +123,12 @@
   "admin.connectionSecurityTitle": "Connection Security:",
   "admin.connectionSecurityTls": "TLS",
   "admin.connectionSecurityTlsDescription": "Encrypts the communication between Mattermost and your server.",
+  "admin.reload.reloadFail": "Reloading unsuccessful: {error}",
+  "admin.reload.loading": " Loading...",
+  "admin.reload.button": "Reload Configuration From Disk",
+  "admin.recycle.reloadFail": "Recycling unsuccessful: {error}",
+  "admin.recycle.loading": " Recycling...",
+  "admin.recycle.button": "Recycle Database Connections",
   "admin.email.agreeHPNS": " I understand and accept the Mattermost Hosted Push Notification Service <a href=\"https://about.mattermost.com/hpns-terms/\" target=\"_blank\">Terms of Service</a> and <a href=\"https://about.mattermost.com/hpns-privacy/\" target=\"_blank\">Privacy Policy</a>.",
   "admin.email.allowEmailSignInDescription": "When true, Mattermost allows users to sign in using their email and password.",
   "admin.email.allowEmailSignInTitle": "Allow Sign In With Email: ",

webapp/sass/routes/_admin-console.scss

@@ -366,4 +366,12 @@
 
 .email-connection-test {
     margin-top: -15px;
+}
+
+.reload-config {
+    margin-bottom: 50px !important;
+}
+
+.recycle-db {
+    margin-top: 50px !important;
 }