// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import LoginMfa from './components/login_mfa.jsx';
import ErrorBar from 'components/error_bar.jsx';
import FormError from 'components/form_error.jsx';
import * as GlobalActions from 'action_creators/global_actions.jsx';
import UserStore from 'stores/user_store.jsx';
import Client from 'utils/web_client.jsx';
import * as TextFormatting from 'utils/text_formatting.jsx';
import * as Utils from 'utils/utils.jsx';
import Constants from 'utils/constants.jsx';
import {FormattedMessage} from 'react-intl';
import {browserHistory, Link} from 'react-router';
import React from 'react';
import logoImage from 'images/logo.png';
export default class Login extends React.Component {
constructor(props) {
super(props);
this.preSubmit = this.preSubmit.bind(this);
this.submit = this.submit.bind(this);
this.finishSignin = this.finishSignin.bind(this);
this.handleLoginIdChange = this.handleLoginIdChange.bind(this);
this.handlePasswordChange = this.handlePasswordChange.bind(this);
this.state = {
loginId: '', // the browser will set a default for this
password: '',
showMfa: false
};
}
componentDidMount() {
document.title = global.window.mm_config.SiteName;
if (UserStore.getCurrentUser()) {
browserHistory.push('/select_team');
}
}
preSubmit(e) {
e.preventDefault();
const loginId = this.state.loginId.trim();
if (!loginId) {
const ldapEnabled = global.window.mm_config.EnableLdap === 'true';
const usernameSigninEnabled = global.window.mm_config.EnableSignInWithUsername === 'true';
const emailSigninEnabled = global.window.mm_config.EnableSignInWithEmail === 'true';
this.setState({
serverError: (
)
});
return;
}
const password = this.state.password.trim();
if (!password) {
this.setState({
serverError: (
)
});
return;
}
if (global.window.mm_config.EnableMultifactorAuthentication !== 'true') {
this.submit(loginId, password, '');
return;
}
Client.checkMfa(
loginId,
(data) => {
if (data.mfa_required === 'true') {
this.setState({showMfa: true});
} else {
this.submit(loginId, password, '');
}
},
(err) => {
this.setState({serverError: err.message});
}
);
}
submit(loginId, password, token) {
this.setState({showMfa: false, serverError: null});
Client.webLogin(
loginId,
password,
token,
() => {
this.finishSignin();
},
(err) => {
if (err.id === 'api.user.login.not_verified.app_error') {
browserHistory.push('/should_verify_email?&email=' + encodeURIComponent(loginId));
return;
} else if (err.id === 'store.sql_user.get_for_login.app_error' ||
err.id === 'ent.ldap.do_login.user_not_registered.app_error' ||
err.id === 'ent.ldap.do_login.user_filtered.app_error') {
this.setState({
serverError: (
)
});
} else {
this.setState({serverError: err.message});
}
}
);
}
finishSignin() {
GlobalActions.emitInitialLoad(
() => {
browserHistory.push('/select_team');
}
);
}
handleLoginIdChange(e) {
this.setState({
loginId: e.target.value
});
}
handlePasswordChange(e) {
this.setState({
password: e.target.value
});
}
createCustomLogin() {
if (global.window.mm_license.IsLicensed === 'true' &&
global.window.mm_license.CustomBrand === 'true' &&
global.window.mm_config.EnableCustomBrand === 'true') {
const text = global.window.mm_config.CustomBrandText || '';
return (
);
}
return null;
}
createLoginPlaceholder(emailSigninEnabled, usernameSigninEnabled, ldapEnabled) {
const loginPlaceholders = [];
if (emailSigninEnabled) {
loginPlaceholders.push(Utils.localizeMessage('login.email', 'Email'));
}
if (usernameSigninEnabled) {
loginPlaceholders.push(Utils.localizeMessage('login.username', 'Username'));
}
if (ldapEnabled) {
if (global.window.mm_config.LdapLoginFieldName) {
loginPlaceholders.push(global.window.mm_config.LdapLoginFieldName);
} else {
loginPlaceholders.push(Utils.localizeMessage('login.ldap_username', 'LDAP Username'));
}
}
if (loginPlaceholders.length >= 2) {
return loginPlaceholders.slice(0, loginPlaceholders.length - 1).join(', ') +
Utils.localizeMessage('login.placeholderOr', ' or ') +
loginPlaceholders[loginPlaceholders.length - 1];
} else if (loginPlaceholders.length === 1) {
return loginPlaceholders[0];
}
return '';
}
createLoginOptions() {
const extraParam = Utils.getUrlParameter('extra');
let extraBox = '';
if (extraParam) {
if (extraParam === Constants.SIGNIN_CHANGE) {
extraBox = (
);
} else if (extraParam === Constants.SIGNIN_VERIFIED) {
extraBox = (
);
} else if (extraParam === Constants.SESSION_EXPIRED) {
extraBox = (
);
} else if (extraParam === Constants.PASSWORD_CHANGE) {
extraBox = (
);
}
}
const ldapEnabled = global.window.mm_config.EnableLdap === 'true';
const gitlabSigninEnabled = global.window.mm_config.EnableSignUpWithGitLab === 'true';
const googleSigninEnabled = global.window.mm_config.EnableSignUpWithGoogle === 'true';
const usernameSigninEnabled = global.window.mm_config.EnableSignInWithUsername === 'true';
const emailSigninEnabled = global.window.mm_config.EnableSignInWithEmail === 'true';
const oauthLogins = [];
if (gitlabSigninEnabled) {
oauthLogins.push(
);
}
if (googleSigninEnabled) {
oauthLogins.push(
);
}
let login = null;
if (emailSigninEnabled || usernameSigninEnabled || ldapEnabled) {
let errorClass = '';
if (this.state.serverError) {
errorClass = ' has-error';
}
login = (
);
}
var userSignUp;
if (global.window.mm_config.EnableOpenServer === 'true') {
userSignUp = (
);
}
let forgotPassword;
if (usernameSigninEnabled || emailSigninEnabled) {
forgotPassword = (
);
}
return (
{extraBox}
{oauthLogins}
{login}
{userSignUp}
{forgotPassword}
);
}
render() {
let content;
let customContent;
let customClass;
if (this.state.showMfa) {
content = (
);
} else {
content = this.createLoginOptions();
customContent = this.createCustomLogin();
if (customContent) {
customClass = 'branded';
}
}
return (
{customContent}
{global.window.mm_config.SiteName}
{content}
);
}
}
Login.defaultProps = {
};
Login.propTypes = {
params: React.PropTypes.object.isRequired
};