Files
mattermost/webapp/components/signup/signup_controller.jsx
Asaad Mahmood b868aa1dc7 Fixes for RC1 (#6376)
* PLT-6505 - Fixing z-index for post control menu

* PLT-6507 - Channel header icons not aligned

* PLT-6508 - Options popover issue on android

* PLT-6528 - Removing cross contamination on badge

* PLT-6535 - Aligning content in SSO buttons

* PLT-6509 - Aligning dropdown close icon
2017-05-10 09:48:22 -04:00

379 lines
14 KiB
JavaScript

// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import React from 'react';
import FormError from 'components/form_error.jsx';
import LoadingScreen from 'components/loading_screen.jsx';
import UserStore from 'stores/user_store.jsx';
import BrowserStore from 'stores/browser_store.jsx';
import * as AsyncClient from 'utils/async_client.jsx';
import Client from 'client/web_client.jsx';
import * as GlobalActions from 'actions/global_actions.jsx';
import {addUserToTeamFromInvite, getInviteInfo} from 'actions/team_actions.jsx';
import {loadMe} from 'actions/user_actions.jsx';
import logoImage from 'images/logo.png';
import ErrorBar from 'components/error_bar.jsx';
import {FormattedMessage} from 'react-intl';
import {browserHistory, Link} from 'react-router/es6';
export default class SignupController extends React.Component {
constructor(props) {
super(props);
this.renderSignupControls = this.renderSignupControls.bind(this);
let loading = false;
let serverError = '';
let noOpenServerError = false;
let usedBefore = false;
if (props.location.query) {
const hash = props.location.query.h;
const inviteId = props.location.query.id;
if (inviteId) {
loading = true;
} else if (hash && !UserStore.getCurrentUser()) {
usedBefore = BrowserStore.getGlobalItem(hash);
} else if (!inviteId && global.window.mm_config.EnableOpenServer !== 'true' && !UserStore.getNoAccounts()) {
noOpenServerError = true;
serverError = (
<FormattedMessage
id='signup_user_completed.no_open_server'
defaultMessage='This server does not allow open signups. Please speak with your Administrator to receive an invitation.'
/>
);
}
}
this.state = {
loading,
serverError,
noOpenServerError,
usedBefore
};
}
componentDidMount() {
AsyncClient.checkVersion();
BrowserStore.removeGlobalItem('team');
if (this.props.location.query) {
const hash = this.props.location.query.h;
const data = this.props.location.query.d;
const inviteId = this.props.location.query.id;
const userLoggedIn = UserStore.getCurrentUser() != null;
if ((inviteId || hash) && userLoggedIn) {
addUserToTeamFromInvite(
data,
hash,
inviteId,
(team) => {
loadMe(
() => {
browserHistory.push('/' + team.name + '/channels/town-square');
}
);
},
() => {
this.setState({ // eslint-disable-line react/no-did-mount-set-state
noOpenServerError: true,
loading: false,
serverError: (
<FormattedMessage
id='signup_user_completed.invalid_invite'
defaultMessage='The invite link was invalid. Please speak with your Administrator to receive an invitation.'
/>
)
});
}
);
return;
}
if (inviteId) {
getInviteInfo(
inviteId,
(inviteData) => {
if (!inviteData) {
return;
}
this.setState({ // eslint-disable-line react/no-did-mount-set-state
serverError: '',
loading: false
});
},
() => {
this.setState({ // eslint-disable-line react/no-did-mount-set-state
noOpenServerError: true,
loading: false,
serverError: (
<FormattedMessage
id='signup_user_completed.invalid_invite'
defaultMessage='The invite link was invalid. Please speak with your Administrator to receive an invitation.'
/>
)
});
}
);
return;
}
if (userLoggedIn) {
GlobalActions.redirectUserToDefaultTeam();
}
}
}
renderSignupControls() {
let signupControls = [];
if (global.window.mm_config.EnableSignUpWithEmail === 'true') {
signupControls.push(
<Link
className='btn btn-custom-login btn--full email'
key='email'
to={'/signup_email' + window.location.search}
>
<span>
<span className='icon fa fa-envelope'/>
<FormattedMessage
id='signup.email'
defaultMessage='Email and Password'
/>
</span>
</Link>
);
}
if (global.window.mm_config.EnableSignUpWithGitLab === 'true') {
signupControls.push(
<a
className='btn btn-custom-login btn--full gitlab'
key='gitlab'
href={Client.getOAuthRoute() + '/gitlab/signup' + window.location.search}
>
<span>
<span className='icon'/>
<span>
<FormattedMessage
id='signup.gitlab'
defaultMessage='GitLab Single-Sign-On'
/>
</span>
</span>
</a>
);
}
if (global.window.mm_license.IsLicensed === 'true' && global.window.mm_config.EnableSignUpWithGoogle === 'true') {
signupControls.push(
<a
className='btn btn-custom-login btn--full google'
key='google'
href={Client.getOAuthRoute() + '/google/signup' + window.location.search}
>
<span>
<span className='icon'/>
<span>
<FormattedMessage
id='signup.google'
defaultMessage='Google Account'
/>
</span>
</span>
</a>
);
}
if (global.window.mm_license.IsLicensed === 'true' && global.window.mm_config.EnableSignUpWithOffice365 === 'true') {
signupControls.push(
<a
className='btn btn-custom-login btn--full office365'
key='office365'
href={Client.getOAuthRoute() + '/office365/signup' + window.location.search}
>
<span>
<span className='icon'/>
<span>
<FormattedMessage
id='signup.office365'
defaultMessage='Office 365'
/>
</span>
</span>
</a>
);
}
if (global.window.mm_license.IsLicensed === 'true' && global.window.mm_config.EnableLdap === 'true') {
signupControls.push(
<Link
className='btn btn-custom-login btn--full ldap'
key='ldap'
to={'/signup_ldap' + window.location.search}
>
<span>
<span className='icon fa fa-folder-open fa--margin-top'/>
<span>
<FormattedMessage
id='signup.ldap'
defaultMessage='AD/LDAP Credentials'
/>
</span>
</span>
</Link>
);
}
if (global.window.mm_license.IsLicensed === 'true' && global.window.mm_config.EnableSaml === 'true') {
let query = '';
if (window.location.search) {
query = '&action=signup';
} else {
query = '?action=signup';
}
signupControls.push(
<a
className='btn btn-custom-login btn--full saml'
key='saml'
href={'/login/sso/saml' + window.location.search + query}
>
<span>
<span className='icon fa fa-lock fa--margin-top'/>
<span>
{global.window.mm_config.SamlLoginButtonText}
</span>
</span>
</a>
);
}
if (signupControls.length === 0) {
const signupDisabledError = (
<FormattedMessage
id='signup_user_completed.none'
defaultMessage='No user creation method has been enabled. Please contact an administrator for access.'
/>
);
signupControls = (
<FormError
error={signupDisabledError}
margin={true}
/>
);
} else if (signupControls.length === 1) {
if (global.window.mm_config.EnableSignUpWithEmail === 'true') {
return browserHistory.push('/signup_email' + window.location.search);
} else if (global.window.mm_license.IsLicensed === 'true' && global.window.mm_config.EnableLdap === 'true') {
return browserHistory.push('/signup_ldap' + window.location.search);
}
}
return signupControls;
}
render() {
if (this.state.loading) {
return (<LoadingScreen/>);
}
if (this.state.usedBefore) {
return (
<div>
<FormattedMessage
id='signup_user_completed.expired'
defaultMessage="You've already completed the signup process for this invitation or this invitation has expired."
/>
</div>
);
}
let serverError = null;
if (this.state.serverError) {
serverError = (
<div className={'form-group has-error'}>
<label className='control-label'>{this.state.serverError}</label>
</div>
);
}
let signupControls;
if (this.state.noOpenServerError || this.state.usedBefore) {
signupControls = null;
} else {
signupControls = this.renderSignupControls();
}
return (
<div>
<ErrorBar/>
<div className='signup-header'>
<Link to='/'>
<span className='fa fa-chevron-left'/>
<FormattedMessage
id='web.header.back'
/>
</Link>
</div>
<div className='col-sm-12'>
<div className='signup-team__container'>
<img
className='signup-team-logo'
src={logoImage}
/>
<div className='signup__content'>
<h1>{global.window.mm_config.SiteName}</h1>
<h4 className='color--light'>
<FormattedMessage
id='web.root.signup_info'
/>
</h4>
<div className='margin--extra'>
<h5><strong>
<FormattedMessage
id='signup.title'
defaultMessage='Create an account with:'
/>
</strong></h5>
</div>
{signupControls}
{serverError}
</div>
<span className='color--light'>
<FormattedMessage
id='signup_user_completed.haveAccount'
defaultMessage='Already have an account?'
/>
{' '}
<Link
to={'/login'}
query={this.props.location.query}
>
<FormattedMessage
id='signup_user_completed.signIn'
defaultMessage='Click here to sign in.'
/>
</Link>
</span>
</div>
</div>
</div>
);
}
}
SignupController.propTypes = {
location: React.PropTypes.object
};