diff options
Diffstat (limited to 'web/react/components/team_import_tab.jsx')
-rw-r--r-- | web/react/components/team_import_tab.jsx | 68 |
1 files changed, 68 insertions, 0 deletions
diff --git a/web/react/components/team_import_tab.jsx b/web/react/components/team_import_tab.jsx new file mode 100644 index 000000000..131add999 --- /dev/null +++ b/web/react/components/team_import_tab.jsx @@ -0,0 +1,68 @@ +// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved. +// See License.txt for license information. + +var utils = require('../utils/utils.jsx'); +var SettingUpload = require('./setting_upload.jsx'); + +module.exports = React.createClass({ + displayName: 'Import Tab', + getInitialState: function() { + return {status: 'ready', link: ''}; + }, + onImportFailure: function() { + this.setState({status: 'fail', link: ''}); + }, + onImportSuccess: function(data) { + this.setState({status: 'done', link: 'data:application/octet-stream;charset=utf-8,' + encodeURIComponent(data)}); + }, + doImportSlack: function(file) { + this.setState({status: 'in-progress', link: ''}); + utils.importSlack(file, this.onImportSuccess, this.onImportFailure); + }, + render: function() { + var uploadSection = ( + <SettingUpload + title='Import from Slack' + submit={this.doImportSlack} + fileTypesAccepted='.zip'/> + ); + + var messageSection; + switch (this.state.status) { + case 'ready': + messageSection = ''; + break; + case 'in-progress': + messageSection = ( + <p>Importing...</p> + ); + break; + case 'done': + messageSection = ( + <p>Import sucessfull: <a href={this.state.link} download='MattermostImportSummery.txt'>View Summery</a></p> + ); + break; + case 'fail': + messageSection = ( + <p>Import failure: <a href={this.state.link} download='MattermostImportSummery.txt'>View Summery</a></p> + ); + break; + } + + return ( + <div> + <div className='modal-header'> + <button type='button' className='close' data-dismiss='modal' aria-label='Close'><span aria-hidden='true'>×</span></button> + <h4 className='modal-title' ref='title'><i className='modal-back'></i>Import</h4> + </div> + <div ref='wrapper' className='user-settings'> + <h3 className='tab-header'>Import</h3> + <div className='divider-dark first'/> + {uploadSection} + {messageSection} + <div className='divider-dark'/> + </div> + </div> + ); + } +}); |