summaryrefslogtreecommitdiffstats
path: root/web/react/components
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components')
-rw-r--r--web/react/components/about_build_modal.jsx21
-rw-r--r--web/react/components/admin_console/admin_controller.jsx3
-rw-r--r--web/react/components/admin_console/admin_sidebar.jsx32
-rw-r--r--web/react/components/admin_console/email_settings.jsx2
-rw-r--r--web/react/components/admin_console/ldap_settings.jsx32
-rw-r--r--web/react/components/admin_console/license_settings.jsx237
-rw-r--r--web/react/components/admin_console/team_analytics.jsx44
-rw-r--r--web/react/components/channel_header.jsx2
-rw-r--r--web/react/components/file_upload.jsx27
-rw-r--r--web/react/components/invite_member_modal.jsx10
-rw-r--r--web/react/components/sidebar.jsx2
-rw-r--r--web/react/components/time_since.jsx3
-rw-r--r--web/react/components/user_settings/import_theme_modal.jsx1
13 files changed, 385 insertions, 31 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/email_settings.jsx b/web/react/components/admin_console/email_settings.jsx
index 193fd4147..c568c5a77 100644
--- a/web/react/components/admin_console/email_settings.jsx
+++ b/web/react/components/admin_console/email_settings.jsx
@@ -254,7 +254,7 @@ export default class EmailSettings extends React.Component {
/>
{'false'}
</label>
- <p className='help-text'>{'Typically set to true in production. When true, Mattermost attempts to send email notifications. Developers may set this field to false to skip email setup for faster development.'}</p>
+ <p className='help-text'>{'Typically set to true in production. When true, Mattermost attempts to send email notifications. Developers may set this field to false to skip email setup for faster development.\nSetting this to true removes the Preview Mode banner (requires logging out and logging back in after setting is changed).'}</p>
</div>
</div>
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/admin_console/team_analytics.jsx b/web/react/components/admin_console/team_analytics.jsx
index e28699d3c..fe7230946 100644
--- a/web/react/components/admin_console/team_analytics.jsx
+++ b/web/react/components/admin_console/team_analytics.jsx
@@ -3,8 +3,12 @@
import * as Client from '../../utils/client.jsx';
import * as Utils from '../../utils/utils.jsx';
+import Constants from '../../utils/constants.jsx';
import LineChart from './line_chart.jsx';
+var Tooltip = ReactBootstrap.Tooltip;
+var OverlayTrigger = ReactBootstrap.OverlayTrigger;
+
export default class TeamAnalytics extends React.Component {
constructor(props) {
super(props);
@@ -314,9 +318,25 @@ export default class TeamAnalytics extends React.Component {
<tbody>
{
this.state.recent_active_users.map((user) => {
+ const tooltip = (
+ <Tooltip id={'recent-user-email-tooltip-' + user.id}>
+ {user.email}
+ </Tooltip>
+ );
+
return (
- <tr key={user.id}>
- <td>{user.email}</td>
+ <tr key={'recent-user-table-entry-' + user.id}>
+ <td>
+ <OverlayTrigger
+ delayShow={Constants.OVERLAY_TIME_DELAY}
+ placement='top'
+ overlay={tooltip}
+ >
+ <time>
+ {user.username}
+ </time>
+ </OverlayTrigger>
+ </td>
<td>{Utils.displayDateTime(user.last_activity_at)}</td>
</tr>
);
@@ -347,9 +367,25 @@ export default class TeamAnalytics extends React.Component {
<tbody>
{
this.state.newly_created_users.map((user) => {
+ const tooltip = (
+ <Tooltip id={'new-user-email-tooltip-' + user.id}>
+ {user.email}
+ </Tooltip>
+ );
+
return (
- <tr key={user.id}>
- <td>{user.email}</td>
+ <tr key={'new-user-table-entry-' + user.id}>
+ <td>
+ <OverlayTrigger
+ delayShow={Constants.OVERLAY_TIME_DELAY}
+ placement='top'
+ overlay={tooltip}
+ >
+ <time>
+ {user.username}
+ </time>
+ </OverlayTrigger>
+ </td>
<td>{Utils.displayDateTime(user.create_at)}</td>
</tr>
);
diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx
index 59ceb038e..f64834775 100644
--- a/web/react/components/channel_header.jsx
+++ b/web/react/components/channel_header.jsx
@@ -379,7 +379,7 @@ export default class ChannelHeader extends React.Component {
<th>
<div className='dropdown channel-header__links'>
<OverlayTrigger
- delayShow={400}
+ delayShow={Constants.OVERLAY_TIME_DELAY}
placement='bottom'
overlay={recentMentionsTooltip}
>
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/invite_member_modal.jsx b/web/react/components/invite_member_modal.jsx
index 56bc00a7e..7e1627555 100644
--- a/web/react/components/invite_member_modal.jsx
+++ b/web/react/components/invite_member_modal.jsx
@@ -8,6 +8,7 @@ import * as Client from '../utils/client.jsx';
import * as EventHelpers from '../dispatcher/event_helpers.jsx';
import ModalStore from '../stores/modal_store.jsx';
import UserStore from '../stores/user_store.jsx';
+import ChannelStore from '../stores/channel_store.jsx';
import TeamStore from '../stores/team_store.jsx';
import ConfirmModal from './confirm_modal.jsx';
@@ -304,6 +305,11 @@ export default class InviteMemberModal extends React.Component {
var content = null;
var sendButton = null;
+ var defaultChannelName = '';
+ if (ChannelStore.getByName(Constants.DEFAULT_CHANNEL)) {
+ defaultChannelName = ChannelStore.getByName(Constants.DEFAULT_CHANNEL).display_name;
+ }
+
if (this.state.emailEnabled && this.state.userCreationEnabled) {
content = (
<div>
@@ -312,10 +318,10 @@ export default class InviteMemberModal extends React.Component {
type='button'
className='btn btn-default'
onClick={this.addInviteFields}
- >Add another</button>
+ >{'Add another'}</button>
<br/>
<br/>
- <span>People invited automatically join Town Square channel.</span>
+ <span>{'People invited automatically join the '}<strong>{defaultChannelName}</strong>{' channel.'}</span>
</div>
);
diff --git a/web/react/components/sidebar.jsx b/web/react/components/sidebar.jsx
index 18c360cb8..eaeb7bb91 100644
--- a/web/react/components/sidebar.jsx
+++ b/web/react/components/sidebar.jsx
@@ -372,7 +372,7 @@ export default class Sidebar extends React.Component {
if (channel.status === 'online') {
statusIcon = Constants.ONLINE_ICON_SVG;
} else if (channel.status === 'away') {
- statusIcon = Constants.ONLINE_ICON_SVG;
+ statusIcon = Constants.AWAY_ICON_SVG;
} else {
statusIcon = Constants.OFFLINE_ICON_SVG;
}
diff --git a/web/react/components/time_since.jsx b/web/react/components/time_since.jsx
index cffff6ee7..32947bd60 100644
--- a/web/react/components/time_since.jsx
+++ b/web/react/components/time_since.jsx
@@ -1,6 +1,7 @@
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
+import Constants from '../utils/constants.jsx';
import * as Utils from '../utils/utils.jsx';
var Tooltip = ReactBootstrap.Tooltip;
@@ -30,7 +31,7 @@ export default class TimeSince extends React.Component {
return (
<OverlayTrigger
- delayShow={400}
+ delayShow={Constants.OVERLAY_TIME_DELAY}
placement='top'
overlay={tooltip}
>
diff --git a/web/react/components/user_settings/import_theme_modal.jsx b/web/react/components/user_settings/import_theme_modal.jsx
index 3df9dfedf..45b05f19b 100644
--- a/web/react/components/user_settings/import_theme_modal.jsx
+++ b/web/react/components/user_settings/import_theme_modal.jsx
@@ -55,6 +55,7 @@ export default class ImportThemeModal extends React.Component {
theme.sidebarHeaderBg = colors[1];
theme.sidebarHeaderTextColor = colors[5];
theme.onlineIndicator = colors[6];
+ theme.awayIndicator = '#E0B333';
theme.mentionBj = colors[7];
theme.mentionColor = '#ffffff';
theme.centerChannelBg = '#ffffff';
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-07-06 15:17:11 +0000