diff options
Diffstat (limited to 'web/react')
-rw-r--r-- | web/react/components/about_build_modal.jsx | 21 | ||||
-rw-r--r-- | web/react/components/admin_console/admin_controller.jsx | 3 | ||||
-rw-r--r-- | web/react/components/admin_console/admin_sidebar.jsx | 32 | ||||
-rw-r--r-- | web/react/components/admin_console/ldap_settings.jsx | 32 | ||||
-rw-r--r-- | web/react/components/admin_console/license_settings.jsx | 237 | ||||
-rw-r--r-- | web/react/components/file_upload.jsx | 27 | ||||
-rw-r--r-- | web/react/components/user_settings/user_settings_security.jsx | 6 | ||||
-rw-r--r-- | web/react/utils/client.jsx | 35 | ||||
-rw-r--r-- | web/react/utils/utils.jsx | 35 |
9 files changed, 400 insertions, 28 deletions
diff --git a/web/react/components/about_build_modal.jsx b/web/react/components/about_build_modal.jsx index 3143bec22..f70027498 100644 --- a/web/react/components/about_build_modal.jsx +++ b/web/react/components/about_build_modal.jsx @@ -15,6 +15,19 @@ export default class AboutBuildModal extends React.Component { render() { const config = global.window.mm_config; + const license = global.window.mm_license; + + let title = 'Team Edition'; + let licensee; + if (config.BuildEnterpriseReady === 'true' && license.IsLicensed === 'true') { + title = 'Enterprise Edition'; + licensee = ( + <div className='row form-group'> + <div className='col-sm-3 info__label'>{'Licensed by:'}</div> + <div className='col-sm-9'>{license.Company}</div> + </div> + ); + } return ( <Modal @@ -22,9 +35,15 @@ export default class AboutBuildModal extends React.Component { onHide={this.doHide} > <Modal.Header closeButton={true}> - <Modal.Title>{`Mattermost ${config.Version}`}</Modal.Title> + <Modal.Title>{'About Mattermost'}</Modal.Title> </Modal.Header> <Modal.Body> + <h4>{`Mattermost ${title}`}</h4> + {licensee} + <div className='row form-group'> + <div className='col-sm-3 info__label'>{'Version:'}</div> + <div className='col-sm-9'>{config.Version}</div> + </div> <div className='row form-group'> <div className='col-sm-3 info__label'>{'Build Number:'}</div> <div className='col-sm-9'>{config.BuildNumber}</div> diff --git a/web/react/components/admin_console/admin_controller.jsx b/web/react/components/admin_console/admin_controller.jsx index 32b2e9bb7..0f85c238d 100644 --- a/web/react/components/admin_console/admin_controller.jsx +++ b/web/react/components/admin_console/admin_controller.jsx @@ -22,6 +22,7 @@ import LegalAndSupportSettingsTab from './legal_and_support_settings.jsx'; import TeamUsersTab from './team_users.jsx'; import TeamAnalyticsTab from './team_analytics.jsx'; import LdapSettingsTab from './ldap_settings.jsx'; +import LicenseSettingsTab from './license_settings.jsx'; export default class AdminController extends React.Component { constructor(props) { @@ -154,6 +155,8 @@ export default class AdminController extends React.Component { tab = <LegalAndSupportSettingsTab config={this.state.config} />; } else if (this.state.selected === 'ldap_settings') { tab = <LdapSettingsTab config={this.state.config} />; + } else if (this.state.selected === 'license') { + tab = <LicenseSettingsTab />; } else if (this.state.selected === 'team_users') { if (this.state.teams) { tab = <TeamUsersTab team={this.state.teams[this.state.selectedTeam]} />; diff --git a/web/react/components/admin_console/admin_sidebar.jsx b/web/react/components/admin_console/admin_sidebar.jsx index 1279f4d22..5a5eaa055 100644 --- a/web/react/components/admin_console/admin_sidebar.jsx +++ b/web/react/components/admin_console/admin_sidebar.jsx @@ -155,6 +155,36 @@ export default class AdminSidebar extends React.Component { } } + let ldapSettings; + let licenseSettings; + if (global.window.mm_config.BuildEnterpriseReady === 'true') { + if (global.window.mm_license.IsLicensed === 'true') { + ldapSettings = ( + <li> + <a + href='#' + className={this.isSelected('ldap_settings')} + onClick={this.handleClick.bind(this, 'ldap_settings', null)} + > + {'LDAP Settings'} + </a> + </li> + ); + } + + licenseSettings = ( + <li> + <a + href='#' + className={this.isSelected('license')} + onClick={this.handleClick.bind(this, 'license', null)} + > + {'Edition and License'} + </a> + </li> + ); + } + return ( <div className='sidebar--left sidebar--collapsable'> <div> @@ -252,6 +282,7 @@ export default class AdminSidebar extends React.Component { {'GitLab Settings'} </a> </li> + {ldapSettings} <li> <a href='#' @@ -300,6 +331,7 @@ export default class AdminSidebar extends React.Component { </li> </ul> <ul className='nav nav__sub-menu padded'> + {licenseSettings} <li> <a href='#' diff --git a/web/react/components/admin_console/ldap_settings.jsx b/web/react/components/admin_console/ldap_settings.jsx index 6e3da2f72..1447f3bd7 100644 --- a/web/react/components/admin_console/ldap_settings.jsx +++ b/web/react/components/admin_console/ldap_settings.jsx @@ -90,14 +90,41 @@ export default class LdapSettings extends React.Component { saveClass = 'btn btn-primary'; } - return ( - <div className='wrapper--fixed'> + const licenseEnabled = global.window.mm_license.IsLicensed === 'true' && global.window.mm_license.LDAP === 'true'; + + let bannerContent; + if (licenseEnabled) { + bannerContent = ( <div className='banner'> <div className='banner__content'> <h4 className='banner__heading'>{'Note:'}</h4> <p>{'If a user attribute changes on the LDAP server it will be updated the next time the user enters their credentials to log in to Mattermost. This includes if a user is made inactive or removed from an LDAP server. Synchronization with LDAP servers is planned in a future release.'}</p> </div> </div> + ); + } else { + bannerContent = ( + <div className='banner warning'> + <div className='banner__content'> + <h4 className='banner__heading'>{'Note:'}</h4> + <p> + {'LDAP is an enterprise feature. Your current license does not support LDAP. Click '} + <a + href='http://mattermost.com' + target='_blank' + > + {'here'} + </a> + {' for information and pricing on enterprise licenses.'} + </p> + </div> + </div> + ); + } + + return ( + <div className='wrapper--fixed'> + {bannerContent} <h3>{'LDAP Settings'}</h3> <form className='form-horizontal' @@ -119,6 +146,7 @@ export default class LdapSettings extends React.Component { ref='Enable' defaultChecked={this.props.config.LdapSettings.Enable} onChange={this.handleEnable} + disabled={!licenseEnabled} /> {'true'} </label> diff --git a/web/react/components/admin_console/license_settings.jsx b/web/react/components/admin_console/license_settings.jsx new file mode 100644 index 000000000..ba953f3bd --- /dev/null +++ b/web/react/components/admin_console/license_settings.jsx @@ -0,0 +1,237 @@ +// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import * as Utils from '../../utils/utils.jsx'; +import * as Client from '../../utils/client.jsx'; + +export default class LicenseSettings extends React.Component { + constructor(props) { + super(props); + + this.handleChange = this.handleChange.bind(this); + this.handleSubmit = this.handleSubmit.bind(this); + this.handleRemove = this.handleRemove.bind(this); + + this.state = { + fileSelected: false, + serverError: null + }; + } + + handleChange() { + const element = $(ReactDOM.findDOMNode(this.refs.fileInput)); + if (element.prop('files').length > 0) { + this.setState({fileSelected: true}); + } + } + + handleSubmit(e) { + e.preventDefault(); + + const element = $(ReactDOM.findDOMNode(this.refs.fileInput)); + if (element.prop('files').length === 0) { + return; + } + const file = element.prop('files')[0]; + + $('#upload-button').button('loading'); + + const formData = new FormData(); + formData.append('license', file, file.name); + + Client.uploadLicenseFile(formData, + () => { + Utils.clearFileInput(element[0]); + $('#upload-button').button('reset'); + this.setState({serverError: null}); + window.location.reload(true); + }, + (error) => { + Utils.clearFileInput(element[0]); + $('#upload-button').button('reset'); + this.setState({serverError: error.message}); + } + ); + } + + handleRemove(e) { + e.preventDefault(); + + $('#remove-button').button('loading'); + + Client.removeLicenseFile( + () => { + $('#remove-button').button('reset'); + this.setState({serverError: null}); + window.location.reload(true); + }, + (error) => { + $('#remove-button').button('reset'); + this.setState({serverError: error.message}); + } + ); + } + + render() { + var serverError = ''; + if (this.state.serverError) { + serverError = <div className='form-group has-error'><label className='control-label'>{this.state.serverError}</label></div>; + } + + var btnClass = 'btn'; + if (this.state.fileSelected) { + btnClass = 'btn btn-primary'; + } + + let edition; + let licenseType; + let licenseKey; + + if (global.window.mm_license.IsLicensed === 'true') { + edition = 'Mattermost Enterprise Edition. Designed for enterprise-scale communication.'; + licenseType = ( + <div> + <p> + {'This compiled release of Mattermost platform is provided under a '} + <a + href='http://mattermost.com' + target='_blank' + > + {'commercial license'} + </a> + {' from Mattermost, Inc. based on your subscription level and is subject to the '} + <a + href={global.window.mm_config.TermsOfServiceLink} + target='_blank' + > + {'Terms of Service.'} + </a> + </p> + <p>{'Your subscription details are as follows:'}</p> + {'Name: ' + global.window.mm_license.Name} + <br/> + {'Company or organization name: ' + global.window.mm_license.Company} + <br/> + {'Number of users: ' + global.window.mm_license.Users} + <br/> + {`License issued: ${Utils.displayDate(parseInt(global.window.mm_license.IssuedAt, 10))} ${Utils.displayTime(parseInt(global.window.mm_license.IssuedAt, 10), true)}`} + <br/> + {'Start date of license: ' + Utils.displayDate(parseInt(global.window.mm_license.StartsAt, 10))} + <br/> + {'Expiry date of license: ' + Utils.displayDate(parseInt(global.window.mm_license.ExpiresAt, 10))} + <br/> + {'LDAP: ' + global.window.mm_license.LDAP} + <br/> + </div> + ); + + licenseKey = ( + <div className='col-sm-8'> + <button + className='btn btn-danger' + onClick={this.handleRemove} + id='remove-button' + data-loading-text={'<span class=\'glyphicon glyphicon-refresh glyphicon-refresh-animate\'></span> Removing License...'} + > + {'Remove Enterprise License and Downgrade Server'} + </button> + <br/> + <br/> + <p className='help-text'> + {'If you’re migrating servers you may need to remove your license key from this server in order to install it on a new server. To start, '} + <a + href='http://mattermost.com' + target='_blank' + > + {'disable all Enterprise Edition features on this server'} + </a> + {'. This will enable the ability to remove the license key and downgrade this server from Enterprise Edition to Team Edition.'} + </p> + </div> + ); + } else { + edition = 'Mattermost Team Edition. Designed for teams from 5 to 50 users.'; + + licenseType = ( + <span> + <p>{'This compiled release of Mattermost platform is offered under an MIT license.'}</p> + <p>{'See MIT-COMPILED-LICENSE.txt in your root install directory for details. See NOTICES.txt for information about open source software used in this system.'}</p> + </span> + ); + + licenseKey = ( + <div className='col-sm-8'> + <input + className='pull-left' + ref='fileInput' + type='file' + accept='.mattermost-license' + onChange={this.handleChange} + /> + <button + className={btnClass + ' pull-left'} + disabled={!this.state.fileSelected} + onClick={this.handleSubmit} + id='upload-button' + data-loading-text={'<span class=\'glyphicon glyphicon-refresh glyphicon-refresh-animate\'></span> Uploading License...'} + > + {'Upload'} + </button> + <br/> + <br/> + <br/> + {serverError} + <p className='help-text'> + {'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.'} + </p> + </div> + ); + } + + return ( + <div className='wrapper--fixed'> + <h3>{'Edition and License'}</h3> + <form + className='form-horizontal' + role='form' + > + <div className='form-group'> + <label + className='control-label col-sm-4' + > + {'Edition: '} + </label> + <div className='col-sm-8'> + {edition} + </div> + </div> + <div className='form-group'> + <label + className='control-label col-sm-4' + > + {'License: '} + </label> + <div className='col-sm-8'> + {licenseType} + </div> + </div> + <div className='form-group'> + <label + className='control-label col-sm-4' + > + {'License Key: '} + </label> + {licenseKey} + </div> + </form> + </div> + ); + } +} diff --git a/web/react/components/file_upload.jsx b/web/react/components/file_upload.jsx index 6337afabc..fef253c52 100644 --- a/web/react/components/file_upload.jsx +++ b/web/react/components/file_upload.jsx @@ -1,7 +1,7 @@ // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. -import * as client from '../utils/client.jsx'; +import * as Client from '../utils/client.jsx'; import Constants from '../utils/constants.jsx'; import ChannelStore from '../stores/channel_store.jsx'; import * as Utils from '../utils/utils.jsx'; @@ -26,7 +26,7 @@ export default class FileUpload extends React.Component { for (var j = 0; j < data.client_ids.length; j++) { delete requests[data.client_ids[j]]; } - this.setState({requests: requests}); + this.setState({requests}); } fileUploadFail(clientId, err) { @@ -52,7 +52,7 @@ export default class FileUpload extends React.Component { } // generate a unique id that can be used by other components to refer back to this upload - let clientId = Utils.generateId(); + const clientId = Utils.generateId(); // prepare data to be uploaded var formData = new FormData(); @@ -60,14 +60,14 @@ export default class FileUpload extends React.Component { formData.append('files', files[i], files[i].name); formData.append('client_ids', clientId); - var request = client.uploadFile(formData, + var request = Client.uploadFile(formData, this.fileUploadSuccess.bind(this, channelId), this.fileUploadFail.bind(this, clientId) ); var requests = this.state.requests; requests[clientId] = request; - this.setState({requests: requests}); + this.setState({requests}); this.props.onUploadStart([clientId], channelId); @@ -90,16 +90,7 @@ export default class FileUpload extends React.Component { this.uploadFiles(element.prop('files')); - // clear file input for all modern browsers - try { - element[0].value = ''; - if (element.value) { - element[0].type = 'text'; - element[0].type = 'file'; - } - } catch (e) { - // Do nothing - } + Utils.clearFileInput(element[0]); } handleDrop(e) { @@ -227,14 +218,14 @@ export default class FileUpload extends React.Component { formData.append('files', file, name); formData.append('client_ids', clientId); - var request = client.uploadFile(formData, + var request = Client.uploadFile(formData, self.fileUploadSuccess.bind(self, channelId), self.fileUploadFail.bind(self, clientId) ); var requests = self.state.requests; requests[clientId] = request; - self.setState({requests: requests}); + self.setState({requests}); self.props.onUploadStart([clientId], channelId); } @@ -263,7 +254,7 @@ export default class FileUpload extends React.Component { request.abort(); delete requests[clientId]; - this.setState({requests: requests}); + this.setState({requests}); } } diff --git a/web/react/components/user_settings/user_settings_security.jsx b/web/react/components/user_settings/user_settings_security.jsx index d9c5f58a9..d1266dd3f 100644 --- a/web/react/components/user_settings/user_settings_security.jsx +++ b/web/react/components/user_settings/user_settings_security.jsx @@ -206,7 +206,7 @@ export default class SecurityTab extends React.Component { <div> <a className='btn btn-primary' - href={'/' + teamName + '/claim?email=' + user.email} + href={'/' + teamName + '/claim?email=' + encodeURIComponent(user.email)} > {'Switch to using email and password'} </a> @@ -221,7 +221,7 @@ export default class SecurityTab extends React.Component { <div> <a className='btn btn-primary' - href={'/' + teamName + '/claim?email=' + user.email + '&new_type=' + Constants.GITLAB_SERVICE} + href={'/' + teamName + '/claim?email=' + encodeURIComponent(user.email) + '&new_type=' + Constants.GITLAB_SERVICE} > {'Switch to using GitLab SSO'} </a> @@ -236,7 +236,7 @@ export default class SecurityTab extends React.Component { <div> <a className='btn btn-primary' - href={'/' + teamName + '/claim?email=' + user.email + '&new_type=' + Constants.GOOGLE_SERVICE} + href={'/' + teamName + '/claim?email=' + encodeURIComponent(user.email) + '&new_type=' + Constants.GOOGLE_SERVICE} > {'Switch to using Google SSO'} </a> diff --git a/web/react/utils/client.jsx b/web/react/utils/client.jsx index 96d1ef720..d60fea872 100644 --- a/web/react/utils/client.jsx +++ b/web/react/utils/client.jsx @@ -1392,3 +1392,38 @@ export function regenOutgoingHookToken(data, success, error) { } }); } + +export function uploadLicenseFile(formData, success, error) { + $.ajax({ + url: '/api/v1/license/add', + type: 'POST', + data: formData, + cache: false, + contentType: false, + processData: false, + success, + error: function onError(xhr, status, err) { + var e = handleError('uploadLicenseFile', xhr, status, err); + error(e); + } + }); + + track('api', 'api_license_upload'); +} + +export function removeLicenseFile(success, error) { + $.ajax({ + url: '/api/v1/license/remove', + type: 'POST', + cache: false, + contentType: false, + processData: false, + success, + error: function onError(xhr, status, err) { + var e = handleError('removeLicenseFile', xhr, status, err); + error(e); + } + }); + + track('api', 'api_license_upload'); +} diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx index 31bb2ba0b..db469952b 100644 --- a/web/react/utils/utils.jsx +++ b/web/react/utils/utils.jsx @@ -201,11 +201,21 @@ export function displayDate(ticks) { return monthNames[d.getMonth()] + ' ' + d.getDate() + ', ' + d.getFullYear(); } -export function displayTime(ticks) { +export function displayTime(ticks, utc) { const d = new Date(ticks); - let hours = d.getHours(); - let minutes = d.getMinutes(); + let hours; + let minutes; let ampm = ''; + let timezone = ''; + + if (utc) { + hours = d.getUTCHours(); + minutes = d.getUTCMinutes(); + timezone = ' UTC'; + } else { + hours = d.getHours(); + minutes = d.getMinutes(); + } if (minutes <= 9) { minutes = '0' + minutes; @@ -224,7 +234,7 @@ export function displayTime(ticks) { } } - return hours + ':' + minutes + ampm; + return hours + ':' + minutes + ampm + timezone; } export function displayDateTime(ticks) { @@ -1299,5 +1309,22 @@ export function fillArray(value, length) { // Checks if a data transfer contains files not text, folders, etc.. // Slightly modified from http://stackoverflow.com/questions/6848043/how-do-i-detect-a-file-is-being-dragged-rather-than-a-draggable-element-on-my-pa export function isFileTransfer(files) { + if (isBrowserIE()) { + return files.types != null && files.types.contains('Files'); + } + return files.types != null && (files.types.indexOf ? files.types.indexOf('Files') !== -1 : files.types.contains('application/x-moz-file')); } + +export function clearFileInput(elm) { + // clear file input for all modern browsers + try { + elm.value = ''; + if (elm.value) { + elm.type = 'text'; + elm.type = 'file'; + } + } catch (e) { + // Do nothing + } +} |