From f0fd9a9e8b85544089246bde71b6d61ba90eeb0e Mon Sep 17 00:00:00 2001
From: Christopher Speller <crspeller@gmail.com>
Date: Wed, 26 Aug 2015 12:49:07 -0400
Subject: Adding ability to export data from mattermost

---
 web/react/components/team_export_tab.jsx     | 96 ++++++++++++++++++++++++++++
 web/react/components/team_settings.jsx       |  8 +++
 web/react/components/team_settings_modal.jsx |  1 +
 3 files changed, 105 insertions(+)
 create mode 100644 web/react/components/team_export_tab.jsx

(limited to 'web/react/components')

diff --git a/web/react/components/team_export_tab.jsx b/web/react/components/team_export_tab.jsx
new file mode 100644
index 000000000..1bc5abdb1
--- /dev/null
+++ b/web/react/components/team_export_tab.jsx
@@ -0,0 +1,96 @@
+// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+var Client = require('../utils/client.jsx');
+
+export default class TeamExportTab extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {status: 'request', link: '', err: ''};
+
+        this.onExportSuccess = this.onExportSuccess.bind(this);
+        this.onExportFailure = this.onExportFailure.bind(this);
+        this.doExport = this.doExport.bind(this);
+    }
+    onExportSuccess(data) {
+        this.setState({status: 'ready', link: data.link, err: ''});
+    }
+    onExportFailure(e) {
+        this.setState({status: 'failure', link: '', err: e.message});
+    }
+    doExport() {
+        if (this.state.status === 'in-progress') {
+            return;
+        }
+        this.setState({status: 'in-progress'});
+        Client.exportTeam(this.onExportSuccess, this.onExportFailure);
+    }
+    render() {
+        var messageSection = '';
+        switch (this.state.status) {
+        case 'request':
+            messageSection = '';
+            break;
+        case 'in-progress':
+            messageSection = (
+                <p className='confirm-import alert alert-warning'>
+                    <i className='fa fa-spinner fa-pulse' />
+                    {' Exporting...'}
+                </p>
+            );
+            break;
+        case 'ready':
+            messageSection = (
+                <p className='confirm-import alert alert-success'>
+                    <i className='fa fa-check' />
+                    {' Ready for '}
+                    <a
+                        href={this.state.link}
+                        download={true}
+                    >
+                        {'download'}
+                    </a>
+                </p>
+            );
+            break;
+        case 'failure':
+            messageSection = (
+                <p className='confirm-import alert alert-warning'>
+                    <i className='fa fa-warning' />
+                    {' Unable to export: ' + this.state.err}
+                </p>
+            );
+            break;
+        }
+
+        return (
+            <div
+                ref='wrapper'
+                className='user-settings'
+            >
+                <h3 className='tab-header'>{'Export'}</h3>
+                <div className='divider-dark first'/>
+                <ul className='section-max'>
+                    <li className='col-xs-12 section-title'>{'Export your team'}</li>
+                    <li className='col-xs-offset-3 col-xs-8'>
+                        <ul className='setting-list'>
+                            <li className='setting-list-item'>
+                                <span className='btn btn-sm btn-primary btn-file sel-btn'>
+                                    <a
+                                        className='btn btn-sm btn-primary'
+                                        href='#'
+                                        onClick={this.doExport}
+                                    >
+                                    {'Export'}
+                                    </a>
+                                </span>
+                            </li>
+                        </ul>
+                    </li>
+                </ul>
+                <div className='divider-dark'/>
+                {messageSection}
+            </div>
+        );
+    }
+}
diff --git a/web/react/components/team_settings.jsx b/web/react/components/team_settings.jsx
index 53855fe1c..396521af9 100644
--- a/web/react/components/team_settings.jsx
+++ b/web/react/components/team_settings.jsx
@@ -3,6 +3,7 @@
 
 var TeamStore = require('../stores/team_store.jsx');
 var ImportTab = require('./team_import_tab.jsx');
+var ExportTab = require('./team_export_tab.jsx');
 var FeatureTab = require('./team_feature_tab.jsx');
 var GeneralTab = require('./team_general_tab.jsx');
 var Utils = require('../utils/utils.jsx');
@@ -64,6 +65,13 @@ export default class TeamSettings extends React.Component {
                 </div>
             );
             break;
+        case 'export':
+            result = (
+                <div>
+                    <ExportTab />
+                </div>
+            );
+            break;
         default:
             result = (
                 <div/>
diff --git a/web/react/components/team_settings_modal.jsx b/web/react/components/team_settings_modal.jsx
index 668bf76cf..0513c811f 100644
--- a/web/react/components/team_settings_modal.jsx
+++ b/web/react/components/team_settings_modal.jsx
@@ -36,6 +36,7 @@ export default class TeamSettingsModal extends React.Component {
         let tabs = [];
         tabs.push({name: 'general', uiName: 'General', icon: 'glyphicon glyphicon-cog'});
         tabs.push({name: 'import', uiName: 'Import', icon: 'glyphicon glyphicon-upload'});
+        tabs.push({name: 'export', uiName: 'Export', icon: 'glyphicon glyphicon-download'});
         tabs.push({name: 'feature', uiName: 'Advanced', icon: 'glyphicon glyphicon-wrench'});
 
         return (
-- 
cgit v1.2.3-1-g7c22