diff options
Diffstat (limited to 'web/react')
-rw-r--r-- | web/react/components/admin_console/license_settings.jsx | 53 |
1 files changed, 37 insertions, 16 deletions
diff --git a/web/react/components/admin_console/license_settings.jsx b/web/react/components/admin_console/license_settings.jsx index d4dfa13f2..9d2ec8030 100644 --- a/web/react/components/admin_console/license_settings.jsx +++ b/web/react/components/admin_console/license_settings.jsx @@ -27,6 +27,7 @@ class LicenseSettings extends React.Component { this.state = { fileSelected: false, + fileName: null, serverError: null }; } @@ -34,7 +35,7 @@ class LicenseSettings extends React.Component { handleChange() { const element = $(ReactDOM.findDOMNode(this.refs.fileInput)); if (element.prop('files').length > 0) { - this.setState({fileSelected: true}); + this.setState({fileSelected: true, fileName: element.prop('files')[0].name}); } } @@ -56,13 +57,13 @@ class LicenseSettings extends React.Component { () => { Utils.clearFileInput(element[0]); $('#upload-button').button('reset'); - this.setState({serverError: null}); + this.setState({fileSelected: false, fileName: null, serverError: null}); window.location.reload(true); }, (error) => { Utils.clearFileInput(element[0]); $('#upload-button').button('reset'); - this.setState({serverError: error.message}); + this.setState({fileSelected: false, fileName: null, serverError: error.message}); } ); } @@ -75,12 +76,12 @@ class LicenseSettings extends React.Component { Client.removeLicenseFile( () => { $('#remove-button').button('reset'); - this.setState({serverError: null}); + this.setState({fileSelected: false, fileName: null, serverError: null}); window.location.reload(true); }, (error) => { $('#remove-button').button('reset'); - this.setState({serverError: error.message}); + this.setState({fileSelected: false, fileName: null, serverError: error.message}); } ); } @@ -172,17 +173,36 @@ class LicenseSettings extends React.Component { /> ); + let fileName; + if (this.state.fileName) { + fileName = this.state.fileName; + } else { + fileName = ( + <FormattedMessage + id='admin.license.noFile' + defaultMessage='No file uploaded' + /> + ); + } + licenseKey = ( <div className='col-sm-8'> - <input - className='pull-left' - ref='fileInput' - type='file' - accept='.mattermost-license' - onChange={this.handleChange} - /> + <div className='file__upload'> + <button className='btn btn-default'> + <FormattedMessage + id='admin.license.choose' + defaultMessage='Choose File' + /> + </button> + <input + ref='fileInput' + type='file' + accept='.mattermost-license' + onChange={this.handleChange} + /> + </div> <button - className={btnClass + ' pull-left'} + className={btnClass} disabled={!this.state.fileSelected} onClick={this.handleSubmit} id='upload-button' @@ -193,11 +213,12 @@ class LicenseSettings extends React.Component { defaultMessage='Upload' /> </button> - <br/> - <br/> + <div className='help-text no-margin'> + {fileName} + </div> <br/> {serverError} - <p className='help-text'> + <p className='help-text no-margin'> <FormattedHTMLMessage id='admin.license.uploadDesc' defaultMessage='Upload a license key for Mattermost Enterprise Edition to upgrade this server. <a href="http://mattermost.com" target="_blank">Visit us online</a> to learn more about the benefits of Enterprise Edition or to purchase a key.' |