diff options
Diffstat (limited to 'webapp/components/admin_console/remove_file_setting.jsx')
-rw-r--r-- | webapp/components/admin_console/remove_file_setting.jsx | 72 |
1 files changed, 72 insertions, 0 deletions
diff --git a/webapp/components/admin_console/remove_file_setting.jsx b/webapp/components/admin_console/remove_file_setting.jsx new file mode 100644 index 000000000..5a76faae2 --- /dev/null +++ b/webapp/components/admin_console/remove_file_setting.jsx @@ -0,0 +1,72 @@ +// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import $ from 'jquery'; +import React from 'react'; + +import Setting from './setting.jsx'; + +export default class RemoveFileSetting extends Setting { + static get propTypes() { + return { + id: React.PropTypes.string.isRequired, + label: React.PropTypes.node.isRequired, + helpText: React.PropTypes.node, + removeButtonText: React.PropTypes.node.isRequired, + removingText: React.PropTypes.node, + fileName: React.PropTypes.string.isRequired, + onSubmit: React.PropTypes.func.isRequired, + disabled: React.PropTypes.bool + }; + } + + constructor(props) { + super(props); + this.handleRemove = this.handleRemove.bind(this); + + this.state = { + serverError: null + }; + } + + handleRemove(e) { + e.preventDefault(); + + $(this.refs.remove_button).button('loading'); + this.props.onSubmit(this.props.id, (error) => { + $(this.refs.remove_button).button('reset'); + this.setState({serverError: error}); + }); + } + + render() { + let serverError; + if (this.state.serverError) { + serverError = <div className='form-group has-error'><label className='control-label'>{this.state.serverError}</label></div>; + } + + return ( + <Setting + label={this.props.label} + helpText={this.props.helpText} + inputId={this.props.id} + > + <div> + <div className='help-text remove-filename'> + {this.props.fileName} + </div> + <button + className='btn btn-danger' + onClick={this.handleRemove} + ref='remove_button' + disabled={this.props.disabled} + data-loading-text={`<span class='glyphicon glyphicon-refresh glyphicon-refresh-animate'></span> ${this.props.removingText}`} + > + {this.props.removeButtonText} + </button> + {serverError} + </div> + </Setting> + ); + } +}
\ No newline at end of file |