summaryrefslogtreecommitdiffstats
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/react/components/find_team.jsx4
-rw-r--r--web/react/components/more_channels.jsx112
-rw-r--r--web/react/components/navbar.jsx3
-rw-r--r--web/react/components/setting_upload.jsx2
-rw-r--r--web/react/components/team_import_tab.jsx4
-rw-r--r--web/react/components/user_settings_security.jsx10
-rw-r--r--web/sass-files/sass/partials/_sidebar--left.scss14
7 files changed, 101 insertions, 48 deletions
diff --git a/web/react/components/find_team.jsx b/web/react/components/find_team.jsx
index 91a842ffc..d896a1f12 100644
--- a/web/react/components/find_team.jsx
+++ b/web/react/components/find_team.jsx
@@ -47,7 +47,7 @@ module.exports = React.createClass({
return (
<div>
<h4>{"Find Your " + utils.toTitleCase(strings.Team)}</h4>
- <p>{"An email was sent with links to any " + strings.TeamPlural}</p>
+ <p>{"An email was sent with links to any " + strings.TeamPlural + " to which you are a member."}</p>
</div>
);
}
@@ -56,7 +56,7 @@ module.exports = React.createClass({
<div>
<h4>Find Your Team</h4>
<form onSubmit={this.handleSubmit}>
- <p>{"We'll send you an email with links to your " + strings.TeamPlural + "."}</p>
+ <p>{"Get an email with links to any " + strings.TeamPlural + " to which you are a member."}</p>
<div className="form-group">
<label className='control-label'>Email</label>
<div className={ email_error ? "form-group has-error" : "form-group" }>
diff --git a/web/react/components/more_channels.jsx b/web/react/components/more_channels.jsx
index 5261ed6a7..2b2c8b68d 100644
--- a/web/react/components/more_channels.jsx
+++ b/web/react/components/more_channels.jsx
@@ -14,11 +14,21 @@ function getStateFromStores() {
};
}
-module.exports = React.createClass({
- displayName: 'MoreChannelsModal',
+export default class MoreChannels extends React.Component {
+ constructor(props) {
+ super(props);
- componentDidMount: function() {
- ChannelStore.addMoreChangeListener(this._onChange);
+ this.onListenerChange = this.onListenerChange.bind(this);
+ this.handleJoin = this.handleJoin.bind(this);
+ this.handleNewChannel = this.handleNewChannel.bind(this);
+
+ var initState = getStateFromStores();
+ initState.channelType = '';
+ initState.joiningChannel = -1;
+ this.state = initState;
+ }
+ componentDidMount() {
+ ChannelStore.addMoreChangeListener(this.onListenerChange);
$(this.refs.modal.getDOMNode()).on('shown.bs.modal', function shown() {
asyncClient.getMoreChannels(true);
});
@@ -28,43 +38,42 @@ module.exports = React.createClass({
var button = e.relatedTarget;
self.setState({channelType: $(button).attr('data-channeltype')});
});
- },
- componentWillUnmount: function() {
- ChannelStore.removeMoreChangeListener(this._onChange);
- },
- _onChange: function() {
+ }
+ componentWillUnmount() {
+ ChannelStore.removeMoreChangeListener(this.onListenerChange);
+ }
+ onListenerChange() {
var newState = getStateFromStores();
if (!utils.areStatesEqual(newState.channels, this.state.channels)) {
this.setState(newState);
}
- },
- getInitialState: function() {
- var initState = getStateFromStores();
- initState.channelType = '';
- return initState;
- },
- handleJoin: function(id) {
- client.joinChannel(id,
- function() {
+ }
+ handleJoin(channel, channelIndex) {
+ this.setState({joiningChannel: channelIndex});
+ client.joinChannel(channel.id,
+ function joinSuccess() {
$(this.refs.modal.getDOMNode()).modal('hide');
- asyncClient.getChannel(id);
+ asyncClient.getChannel(channel.id);
+ utils.switchChannel(channel);
+ this.setState({joiningChannel: -1});
}.bind(this),
- function(err) {
+ function joinFail(err) {
+ this.setState({joiningChannel: -1});
this.state.serverError = err.message;
this.setState(this.state);
}.bind(this)
);
- },
- handleNewChannel: function() {
+ }
+ handleNewChannel() {
$(this.refs.modal.getDOMNode()).modal('hide');
- },
- render: function() {
+ }
+ render() {
var serverError;
if (this.state.serverError) {
serverError = <div className='form-group has-error'><label className='control-label'>{this.state.serverError}</label></div>;
}
- var outter = this;
+ var self = this;
var moreChannels;
if (this.state.channels != null) {
@@ -74,14 +83,29 @@ module.exports = React.createClass({
moreChannels = (
<table className='more-channel-table table'>
<tbody>
- {channels.map(function cMap(channel) {
+ {channels.map(function cMap(channel, index) {
+ var joinButton;
+ if (self.state.joiningChannel === index) {
+ joinButton = (<img
+ className='join-channel-loading-gif'
+ src='/static/images/load.gif'
+ />);
+ } else {
+ joinButton = (<button
+ onClick={self.handleJoin.bind(self, channel, index)}
+ className='btn btn-primary'>Join
+ </button>);
+ }
+
return (
<tr key={channel.id}>
<td>
<p className='more-channel-name'>{channel.display_name}</p>
<p className='more-channel-description'>{channel.description}</p>
</td>
- <td className='td--action'><button onClick={outter.handleJoin.bind(outter, channel.id)} className='btn btn-primary'>Join</button></td>
+ <td className='td--action'>
+ {joinButton}
+ </td>
</tr>
);
})}
@@ -102,23 +126,47 @@ module.exports = React.createClass({
}
return (
- <div className='modal fade' id='more_channels' ref='modal' tabIndex='-1' role='dialog' aria-hidden='true'>
+ <div
+ className='modal fade'
+ id='more_channels'
+ ref='modal'
+ tabIndex='-1'
+ role='dialog'
+ aria-hidden='true'
+ >
<div className='modal-dialog'>
<div className='modal-content'>
<div className='modal-header'>
- <button type='button' className='close' data-dismiss='modal'>
+ <button
+ type='button'
+ className='close'
+ data-dismiss='modal'
+ >
<span aria-hidden='true'>&times;</span>
<span className='sr-only'>Close</span>
</button>
<h4 className='modal-title'>More Channels</h4>
- <button data-toggle='modal' data-target='#new_channel' data-channeltype={this.state.channelType} type='button' className='btn btn-primary channel-create-btn' onClick={this.handleNewChannel}>Create New Channel</button>
+ <button
+ data-toggle='modal'
+ data-target='#new_channel'
+ data-channeltype={this.state.channelType}
+ type='button'
+ className='btn btn-primary channel-create-btn'
+ onClick={this.handleNewChannel}>Create New Channel
+ </button>
</div>
<div className='modal-body'>
{moreChannels}
{serverError}
</div>
<div className='modal-footer'>
- <button type='button' className='btn btn-default' data-dismiss='modal'>Close</button>
+ <button
+ type='button'
+ className='btn btn-default'
+ data-dismiss='modal'
+ >
+ Close
+ </button>
</div>
</div>
</div>
@@ -126,4 +174,4 @@ module.exports = React.createClass({
);
}
-});
+}
diff --git a/web/react/components/navbar.jsx b/web/react/components/navbar.jsx
index 3e0a66e92..06c373e5d 100644
--- a/web/react/components/navbar.jsx
+++ b/web/react/components/navbar.jsx
@@ -152,6 +152,8 @@ module.exports = React.createClass({
var channelMenuDropdown = null;
if (channel) {
+ var viewInfoOption = <li role='presentation'><a role='menuitem' data-toggle='modal' data-target='#channel_info' data-channelid={channel.id} href='#'>View Info</a></li>
+
var addMembersOption = null;
if (!isDirect && !ChannelStore.isDefault(channel)) {
addMembersOption = <li role='presentation'><a role='menuitem' data-toggle='modal' data-target='#channel_invite' href='#'>Add Members</a></li>;
@@ -192,6 +194,7 @@ module.exports = React.createClass({
<span className='glyphicon glyphicon-chevron-down header-dropdown__icon'></span>
</a>
<ul className='dropdown-menu' role='menu' aria-labelledby='channel_header_dropdown'>
+ {viewInfoOption}
{addMembersOption}
{manageMembersOption}
{setChannelDescriptionOption}
diff --git a/web/react/components/setting_upload.jsx b/web/react/components/setting_upload.jsx
index 870710850..83b6d85fc 100644
--- a/web/react/components/setting_upload.jsx
+++ b/web/react/components/setting_upload.jsx
@@ -67,7 +67,7 @@ module.exports = React.createClass({
<li className='setting-list-item'>
{serverError}
{clientError}
- <span className='btn btn-sm btn-primary btn-file sel-btn'>SelectFile<input ref='uploadinput' accept={this.props.fileTypesAccepted} type='file' onChange={this.onFileSelect}/></span>
+ <span className='btn btn-sm btn-primary btn-file sel-btn'>Select File<input ref='uploadinput' accept={this.props.fileTypesAccepted} type='file' onChange={this.onFileSelect}/></span>
<a className={'btn btn-sm btn-primary'} onClick={this.doSubmit}>Import</a>
<a className='btn btn-sm theme' href='#' onClick={this.doCancel}>Cancel</a>
</li>
diff --git a/web/react/components/team_import_tab.jsx b/web/react/components/team_import_tab.jsx
index 131add999..ae7f875cb 100644
--- a/web/react/components/team_import_tab.jsx
+++ b/web/react/components/team_import_tab.jsx
@@ -39,12 +39,12 @@ module.exports = React.createClass({
break;
case 'done':
messageSection = (
- <p>Import sucessfull: <a href={this.state.link} download='MattermostImportSummery.txt'>View Summery</a></p>
+ <p>Import sucessfull: <a href={this.state.link} download='MattermostImportSummary.txt'>View Summary</a></p>
);
break;
case 'fail':
messageSection = (
- <p>Import failure: <a href={this.state.link} download='MattermostImportSummery.txt'>View Summery</a></p>
+ <p>Import failure: <a href={this.state.link} download='MattermostImportSummary.txt'>View Summary</a></p>
);
break;
}
diff --git a/web/react/components/user_settings_security.jsx b/web/react/components/user_settings_security.jsx
index 568d3fe99..39d707d90 100644
--- a/web/react/components/user_settings_security.jsx
+++ b/web/react/components/user_settings_security.jsx
@@ -62,11 +62,9 @@ module.exports = React.createClass({
this.setState({confirmPassword: e.target.value});
},
handleHistoryOpen: function() {
- this.setState({willReturn: true});
$("#user_settings").modal('hide');
},
handleDevicesOpen: function() {
- this.setState({willReturn: true});
$("#user_settings").modal('hide');
},
handleClose: function() {
@@ -75,11 +73,7 @@ module.exports = React.createClass({
});
this.setState({currentPassword: '', newPassword: '', confirmPassword: '', serverError: null, passwordError: null});
- if (!this.state.willReturn) {
- this.props.updateTab('general');
- } else {
- this.setState({willReturn: false});
- }
+ this.props.updateTab('general');
},
componentDidMount: function() {
$('#user_settings').on('hidden.bs.modal', this.handleClose);
@@ -89,7 +83,7 @@ module.exports = React.createClass({
this.props.updateSection('');
},
getInitialState: function() {
- return {currentPassword: '', newPassword: '', confirmPassword: '', willReturn: false};
+ return {currentPassword: '', newPassword: '', confirmPassword: ''};
},
render: function() {
var serverError = this.state.serverError ? this.state.serverError : null;
diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss
index 22b7426b1..6b827eaee 100644
--- a/web/sass-files/sass/partials/_sidebar--left.scss
+++ b/web/sass-files/sass/partials/_sidebar--left.scss
@@ -125,7 +125,15 @@
}
.channel-loading-gif {
- height:15px;
- width:15px;
- margin-top:2px;
+ height: 15px;
+ width: 15px;
+ margin-top: 2px;
+}
+
+.join-channel-loading-gif {
+ margin-top: 5px;
+ margin-left: 10px;
+ height: 25px;
+ width: 25px;
+
}
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-07-05 12:15:42 +0000