Added ability to sign in via username; separated email sign in and sign up config settings
Этот коммит содержится в:
@@ -112,6 +112,8 @@ class EmailSettings extends React.Component {
|
||||
buildConfig() {
|
||||
var config = this.props.config;
|
||||
config.EmailSettings.EnableSignUpWithEmail = ReactDOM.findDOMNode(this.refs.allowSignUpWithEmail).checked;
|
||||
config.EmailSettings.EnableSignInWithEmail = ReactDOM.findDOMNode(this.refs.allowSignInWithEmail).checked;
|
||||
config.EmailSettings.EnableSignInWithUsername = ReactDOM.findDOMNode(this.refs.allowSignInWithUsername).checked;
|
||||
config.EmailSettings.SendEmailNotifications = ReactDOM.findDOMNode(this.refs.sendEmailNotifications).checked;
|
||||
config.EmailSettings.SendPushNotifications = ReactDOM.findDOMNode(this.refs.sendPushNotifications).checked;
|
||||
config.EmailSettings.RequireEmailVerification = ReactDOM.findDOMNode(this.refs.requireEmailVerification).checked;
|
||||
@@ -317,6 +319,88 @@ class EmailSettings extends React.Component {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='form-group'>
|
||||
<label
|
||||
className='control-label col-sm-4'
|
||||
htmlFor='allowSignInWithEmail'
|
||||
>
|
||||
<FormattedMessage
|
||||
id='admin.email.allowEmailSignInTitle'
|
||||
defaultMessage='Allow Sign In With Email: '
|
||||
/>
|
||||
</label>
|
||||
<div className='col-sm-8'>
|
||||
<label className='radio-inline'>
|
||||
<input
|
||||
type='radio'
|
||||
name='allowSignInWithEmail'
|
||||
value='true'
|
||||
ref='allowSignInWithEmail'
|
||||
defaultChecked={this.props.config.EmailSettings.EnableSignInWithEmail}
|
||||
onChange={this.handleChange.bind(this, 'allowSignInWithEmail_true')}
|
||||
/>
|
||||
{'true'}
|
||||
</label>
|
||||
<label className='radio-inline'>
|
||||
<input
|
||||
type='radio'
|
||||
name='allowSignInWithEmail'
|
||||
value='false'
|
||||
defaultChecked={!this.props.config.EmailSettings.EnableSignInWithEmail}
|
||||
onChange={this.handleChange.bind(this, 'allowSignInWithEmail_false')}
|
||||
/>
|
||||
{'false'}
|
||||
</label>
|
||||
<p className='help-text'>
|
||||
<FormattedMessage
|
||||
id='admin.email.allowEmailSignInDescription'
|
||||
defaultMessage='When true, Mattermost allows users to sign in using their email and password.'
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='form-group'>
|
||||
<label
|
||||
className='control-label col-sm-4'
|
||||
htmlFor='allowSignInWithUsername'
|
||||
>
|
||||
<FormattedMessage
|
||||
id='admin.email.allowUsernameSignInTitle'
|
||||
defaultMessage='Allow Sign In With Username: '
|
||||
/>
|
||||
</label>
|
||||
<div className='col-sm-8'>
|
||||
<label className='radio-inline'>
|
||||
<input
|
||||
type='radio'
|
||||
name='allowSignInWithUsername'
|
||||
value='true'
|
||||
ref='allowSignInWithUsername'
|
||||
defaultChecked={this.props.config.EmailSettings.EnableSignInWithUsername}
|
||||
onChange={this.handleChange.bind(this, 'allowSignInWithUsername_true')}
|
||||
/>
|
||||
{'true'}
|
||||
</label>
|
||||
<label className='radio-inline'>
|
||||
<input
|
||||
type='radio'
|
||||
name='allowSignInWithUsername'
|
||||
value='false'
|
||||
defaultChecked={!this.props.config.EmailSettings.EnableSignInWithUsername}
|
||||
onChange={this.handleChange.bind(this, 'allowSignInWithUsername_false')}
|
||||
/>
|
||||
{'false'}
|
||||
</label>
|
||||
<p className='help-text'>
|
||||
<FormattedMessage
|
||||
id='admin.email.allowUsernameSignInDescription'
|
||||
defaultMessage='When true, Mattermost allows users to sign in using their username and password. This setting is typically only used when email verification is disabled.'
|
||||
/>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='form-group'>
|
||||
<label
|
||||
className='control-label col-sm-4'
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
// See License.txt for license information.
|
||||
|
||||
import LoginEmail from './login_email.jsx';
|
||||
import LoginUsername from './login_username.jsx';
|
||||
import LoginLdap from './login_ldap.jsx';
|
||||
|
||||
import * as Utils from '../utils/utils.jsx';
|
||||
@@ -35,7 +36,7 @@ export default class Login extends React.Component {
|
||||
/>
|
||||
</span>
|
||||
</a>
|
||||
);
|
||||
);
|
||||
}
|
||||
|
||||
if (global.window.mm_config.EnableSignUpWithGoogle === 'true') {
|
||||
@@ -87,7 +88,7 @@ export default class Login extends React.Component {
|
||||
}
|
||||
|
||||
let emailSignup;
|
||||
if (global.window.mm_config.EnableSignUpWithEmail === 'true') {
|
||||
if (global.window.mm_config.EnableSignInWithEmail === 'true') {
|
||||
emailSignup = (
|
||||
<LoginEmail
|
||||
teamName={this.props.teamName}
|
||||
@@ -189,6 +190,15 @@ export default class Login extends React.Component {
|
||||
);
|
||||
}
|
||||
|
||||
let usernameLogin = null;
|
||||
if (global.window.mm_config.EnableSignInWithUsername === 'true') {
|
||||
usernameLogin = (
|
||||
<LoginUsername
|
||||
teamName={this.props.teamName}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='signup-team__container'>
|
||||
<h5 className='margin--less'>
|
||||
@@ -210,6 +220,7 @@ export default class Login extends React.Component {
|
||||
{extraBox}
|
||||
{loginMessage}
|
||||
{emailSignup}
|
||||
{usernameLogin}
|
||||
{ldapLogin}
|
||||
{userSignUp}
|
||||
{findTeams}
|
||||
|
||||
181
web/react/components/login_username.jsx
Обычный файл
181
web/react/components/login_username.jsx
Обычный файл
@@ -0,0 +1,181 @@
|
||||
// Copyright (c) 2016 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';
|
||||
import UserStore from '../stores/user_store.jsx';
|
||||
|
||||
import {injectIntl, intlShape, defineMessages, FormattedMessage} from 'mm-intl';
|
||||
|
||||
var holders = defineMessages({
|
||||
badTeam: {
|
||||
id: 'login_username.badTeam',
|
||||
defaultMessage: 'Bad team name'
|
||||
},
|
||||
usernameReq: {
|
||||
id: 'login_username.usernameReq',
|
||||
defaultMessage: 'A username is required'
|
||||
},
|
||||
pwdReq: {
|
||||
id: 'login_username.pwdReq',
|
||||
defaultMessage: 'A password is required'
|
||||
},
|
||||
verifyEmailError: {
|
||||
id: 'login_username.verifyEmailError',
|
||||
defaultMessage: 'Please verify your email address. Check your inbox for an email.'
|
||||
},
|
||||
userNotFoundError: {
|
||||
id: 'login_username.userNotFoundError',
|
||||
defaultMessage: "We couldn't find an existing account matching your username for this team."
|
||||
},
|
||||
username: {
|
||||
id: 'login_username.username',
|
||||
defaultMessage: 'Username'
|
||||
},
|
||||
pwd: {
|
||||
id: 'login_username.pwd',
|
||||
defaultMessage: 'Password'
|
||||
}
|
||||
});
|
||||
|
||||
export default class LoginUsername extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.handleSubmit = this.handleSubmit.bind(this);
|
||||
|
||||
this.state = {
|
||||
serverError: ''
|
||||
};
|
||||
}
|
||||
handleSubmit(e) {
|
||||
e.preventDefault();
|
||||
const {formatMessage} = this.props.intl;
|
||||
var state = {};
|
||||
|
||||
const name = this.props.teamName;
|
||||
if (!name) {
|
||||
state.serverError = formatMessage(holders.badTeam);
|
||||
this.setState(state);
|
||||
return;
|
||||
}
|
||||
|
||||
const username = this.refs.username.value.trim();
|
||||
if (!username) {
|
||||
state.serverError = formatMessage(holders.usernameReq);
|
||||
this.setState(state);
|
||||
return;
|
||||
}
|
||||
|
||||
const password = this.refs.password.value.trim();
|
||||
if (!password) {
|
||||
state.serverError = formatMessage(holders.pwdReq);
|
||||
this.setState(state);
|
||||
return;
|
||||
}
|
||||
|
||||
state.serverError = '';
|
||||
this.setState(state);
|
||||
|
||||
Client.loginByUsername(name, username, password,
|
||||
() => {
|
||||
UserStore.setLastUsername(username);
|
||||
|
||||
const redirect = Utils.getUrlParameter('redirect');
|
||||
if (redirect) {
|
||||
window.location.href = decodeURIComponent(redirect);
|
||||
} else {
|
||||
window.location.href = '/' + name + '/channels/town-square';
|
||||
}
|
||||
},
|
||||
(err) => {
|
||||
if (err.message === 'api.user.login.not_verified.app_error') {
|
||||
state.serverError = formatMessage(holders.verifyEmailError);
|
||||
} else if (err.message === 'store.sql_user.get_by_username.app_error') {
|
||||
state.serverError = formatMessage(holders.userNotFoundError);
|
||||
} else {
|
||||
state.serverError = err.message;
|
||||
}
|
||||
|
||||
this.valid = false;
|
||||
this.setState(state);
|
||||
}
|
||||
);
|
||||
}
|
||||
render() {
|
||||
let serverError;
|
||||
let errorClass = '';
|
||||
if (this.state.serverError) {
|
||||
serverError = <label className='control-label'>{this.state.serverError}</label>;
|
||||
errorClass = ' has-error';
|
||||
}
|
||||
|
||||
let priorUsername = UserStore.getLastUsername();
|
||||
let focusUsername = false;
|
||||
let focusPassword = false;
|
||||
if (priorUsername === '') {
|
||||
focusUsername = true;
|
||||
} else {
|
||||
focusPassword = true;
|
||||
}
|
||||
|
||||
const emailParam = Utils.getUrlParameter('email');
|
||||
if (emailParam) {
|
||||
priorUsername = decodeURIComponent(emailParam);
|
||||
}
|
||||
|
||||
const {formatMessage} = this.props.intl;
|
||||
return (
|
||||
<form onSubmit={this.handleSubmit}>
|
||||
<div className='signup__email-container'>
|
||||
<div className={'form-group' + errorClass}>
|
||||
{serverError}
|
||||
</div>
|
||||
<div className={'form-group' + errorClass}>
|
||||
<input
|
||||
autoFocus={focusUsername}
|
||||
type='username'
|
||||
className='form-control'
|
||||
name='username'
|
||||
defaultValue={priorUsername}
|
||||
ref='username'
|
||||
placeholder={formatMessage(holders.username)}
|
||||
spellCheck='false'
|
||||
/>
|
||||
</div>
|
||||
<div className={'form-group' + errorClass}>
|
||||
<input
|
||||
autoFocus={focusPassword}
|
||||
type='password'
|
||||
className='form-control'
|
||||
name='password'
|
||||
ref='password'
|
||||
placeholder={formatMessage(holders.pwd)}
|
||||
spellCheck='false'
|
||||
/>
|
||||
</div>
|
||||
<div className='form-group'>
|
||||
<button
|
||||
type='submit'
|
||||
className='btn btn-primary'
|
||||
>
|
||||
<FormattedMessage
|
||||
id='login_username.signin'
|
||||
defaultMessage='Sign in'
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
}
|
||||
LoginUsername.defaultProps = {
|
||||
};
|
||||
|
||||
LoginUsername.propTypes = {
|
||||
intl: intlShape.isRequired,
|
||||
teamName: React.PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
export default injectIntl(LoginUsername);
|
||||
@@ -38,6 +38,8 @@ class UserStoreClass extends EventEmitter {
|
||||
this.setCurrentUser = this.setCurrentUser.bind(this);
|
||||
this.getLastEmail = this.getLastEmail.bind(this);
|
||||
this.setLastEmail = this.setLastEmail.bind(this);
|
||||
this.getLastUsername = this.getLastUsername.bind(this);
|
||||
this.setLastUsername = this.setLastUsername.bind(this);
|
||||
this.hasProfile = this.hasProfile.bind(this);
|
||||
this.getProfile = this.getProfile.bind(this);
|
||||
this.getProfileByUsername = this.getProfileByUsername.bind(this);
|
||||
@@ -159,6 +161,14 @@ class UserStoreClass extends EventEmitter {
|
||||
BrowserStore.setGlobalItem('last_email', email);
|
||||
}
|
||||
|
||||
getLastUsername() {
|
||||
return BrowserStore.getGlobalItem('last_username', '');
|
||||
}
|
||||
|
||||
setLastUsername(username) {
|
||||
BrowserStore.setGlobalItem('last_username', username);
|
||||
}
|
||||
|
||||
hasProfile(userId) {
|
||||
return this.getProfiles()[userId] != null;
|
||||
}
|
||||
|
||||
@@ -305,6 +305,28 @@ export function loginByEmail(name, email, password, success, error) {
|
||||
});
|
||||
}
|
||||
|
||||
export function loginByUsername(name, username, password, success, error) {
|
||||
$.ajax({
|
||||
url: '/api/v1/users/login',
|
||||
dataType: 'json',
|
||||
contentType: 'application/json',
|
||||
type: 'POST',
|
||||
data: JSON.stringify({name, username, password}),
|
||||
success: function onSuccess(data, textStatus, xhr) {
|
||||
track('api', 'api_users_login_success', data.team_id, 'username', data.username);
|
||||
sessionStorage.removeItem(data.id + '_last_error');
|
||||
BrowserStore.signalLogin();
|
||||
success(data, textStatus, xhr);
|
||||
},
|
||||
error: function onError(xhr, status, err) {
|
||||
track('api', 'api_users_login_fail', name, 'username', username);
|
||||
|
||||
var e = handleError('loginByUsername', xhr, status, err);
|
||||
error(e);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
export function loginByLdap(teamName, id, password, success, error) {
|
||||
$.ajax({
|
||||
url: '/api/v1/users/login_ldap',
|
||||
|
||||
Ссылка в новой задаче
Block a user