Converting to Webpack. Stage 1.
Этот коммит содержится в:
Christopher Speller
116
webapp/components/claim/claim_account.jsx
Обычный файл
116
webapp/components/claim/claim_account.jsx
Обычный файл
@@ -0,0 +1,116 @@
|
||||
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
|
||||
// See License.txt for license information.
|
||||
|
||||
import EmailToSSO from './email_to_sso.jsx';
|
||||
import SSOToEmail from './sso_to_email.jsx';
|
||||
import TeamStore from 'stores/team_store.jsx';
|
||||
|
||||
import {FormattedMessage} from 'react-intl';
|
||||
|
||||
import React from 'react';
|
||||
import logoImage from 'images/logo.png';
|
||||
|
||||
export default class ClaimAccount extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.onTeamChange = this.onTeamChange.bind(this);
|
||||
this.updateStateFromStores = this.updateStateFromStores.bind(this);
|
||||
|
||||
this.state = {};
|
||||
}
|
||||
componentWillMount() {
|
||||
this.setState({
|
||||
email: this.props.location.query.email,
|
||||
newType: this.props.location.query.new_type,
|
||||
oldType: this.props.location.query.old_type,
|
||||
teamName: this.props.params.team,
|
||||
teamDisplayName: ''
|
||||
});
|
||||
this.updateStateFromStores();
|
||||
}
|
||||
componentDidMount() {
|
||||
TeamStore.addChangeListener(this.onTeamChange);
|
||||
}
|
||||
componentWillUnmount() {
|
||||
TeamStore.removeChangeListener(this.onTeamChange);
|
||||
}
|
||||
updateStateFromStores() {
|
||||
const team = TeamStore.getByName(this.state.teamName);
|
||||
let displayName = '';
|
||||
if (team) {
|
||||
displayName = team.displayName;
|
||||
}
|
||||
this.setState({
|
||||
teamDisplayName: displayName
|
||||
});
|
||||
}
|
||||
onTeamChange() {
|
||||
this.updateStateFromStores();
|
||||
}
|
||||
render() {
|
||||
if (this.state.teamDisplayName === '') {
|
||||
return (<div/>);
|
||||
}
|
||||
let content;
|
||||
if (this.state.email === '') {
|
||||
content = (
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='claim.account.noEmail'
|
||||
defaultMessage='No email specified'
|
||||
/>
|
||||
</p>
|
||||
);
|
||||
} else if (this.state.oldType === '' && this.state.newType !== '') {
|
||||
content = (
|
||||
<EmailToSSO
|
||||
email={this.state.email}
|
||||
type={this.state.newType}
|
||||
teamName={this.state.teamName}
|
||||
teamDisplayName={this.state.teamDisplayName}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
content = (
|
||||
<SSOToEmail
|
||||
email={this.state.email}
|
||||
currentType={this.state.oldType}
|
||||
teamName={this.state.teamName}
|
||||
teamDisplayName={this.state.teamDisplayName}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className='signup-header'>
|
||||
<a href='/'>
|
||||
<span className='fa fa-chevron-left'/>
|
||||
<FormattedMessage
|
||||
id='web.header.back'
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<div className='col-sm-12'>
|
||||
<div className='signup-team__container'>
|
||||
<img
|
||||
className='signup-team-logo'
|
||||
src={logoImage}
|
||||
/>
|
||||
<div id='claim'>
|
||||
{content}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
ClaimAccount.defaultProps = {
|
||||
};
|
||||
ClaimAccount.propTypes = {
|
||||
params: React.PropTypes.object.isRequired,
|
||||
location: React.PropTypes.object.isRequired
|
||||
};
|
||||
154
webapp/components/claim/email_to_sso.jsx
Обычный файл
154
webapp/components/claim/email_to_sso.jsx
Обычный файл
@@ -0,0 +1,154 @@
|
||||
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
|
||||
// See License.txt for license information.
|
||||
|
||||
import ReactDOM from 'react-dom';
|
||||
import * as Utils from 'utils/utils.jsx';
|
||||
import * as Client from 'utils/client.jsx';
|
||||
|
||||
import {intlShape, injectIntl, defineMessages, FormattedMessage} from 'react-intl';
|
||||
|
||||
const holders = defineMessages({
|
||||
pwdError: {
|
||||
id: 'claim.email_to_sso.pwdError',
|
||||
defaultMessage: 'Please enter your password.'
|
||||
},
|
||||
pwd: {
|
||||
id: 'claim.email_to_sso.pwd',
|
||||
defaultMessage: 'Password'
|
||||
}
|
||||
});
|
||||
|
||||
import React from 'react';
|
||||
|
||||
class EmailToSSO extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.submit = this.submit.bind(this);
|
||||
|
||||
this.state = {};
|
||||
}
|
||||
submit(e) {
|
||||
e.preventDefault();
|
||||
var state = {};
|
||||
|
||||
var password = ReactDOM.findDOMNode(this.refs.password).value.trim();
|
||||
if (!password) {
|
||||
state.error = this.props.intl.formatMessage(holders.pwdError);
|
||||
this.setState(state);
|
||||
return;
|
||||
}
|
||||
|
||||
state.error = null;
|
||||
this.setState(state);
|
||||
|
||||
var postData = {};
|
||||
postData.password = password;
|
||||
postData.email = this.props.email;
|
||||
postData.team_name = this.props.teamName;
|
||||
postData.service = this.props.type;
|
||||
|
||||
Client.switchToSSO(postData,
|
||||
(data) => {
|
||||
if (data.follow_link) {
|
||||
window.location.href = data.follow_link;
|
||||
}
|
||||
},
|
||||
(error) => {
|
||||
this.setState({error});
|
||||
}
|
||||
);
|
||||
}
|
||||
render() {
|
||||
var error = null;
|
||||
if (this.state.error) {
|
||||
error = <div className='form-group has-error'><label className='control-label'>{this.state.error}</label></div>;
|
||||
}
|
||||
|
||||
var formClass = 'form-group';
|
||||
if (error) {
|
||||
formClass += ' has-error';
|
||||
}
|
||||
|
||||
const uiType = Utils.toTitleCase(this.props.type) + ' SSO';
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h3>
|
||||
<FormattedMessage
|
||||
id='claim.email_to_sso.title'
|
||||
defaultMessage='Switch Email/Password Account to {uiType}'
|
||||
values={{
|
||||
uiType: uiType
|
||||
}}
|
||||
/>
|
||||
</h3>
|
||||
<form onSubmit={this.submit}>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='claim.email_to_sso.ssoType'
|
||||
defaultMessage='Upon claiming your account, you will only be able to login with {type} SSO'
|
||||
values={{
|
||||
type: Utils.toTitleCase(this.props.type)
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='claim.email_to_sso.ssoNote'
|
||||
defaultMessage='You must already have a valid {type} account'
|
||||
values={{
|
||||
type: Utils.toTitleCase(this.props.type)
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='claim.email_to_sso.enterPwd'
|
||||
defaultMessage='Enter the password for your {team} {site} account'
|
||||
values={{
|
||||
team: this.props.teamDisplayName,
|
||||
site: global.window.mm_config.SiteName
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<div className={formClass}>
|
||||
<input
|
||||
type='password'
|
||||
className='form-control'
|
||||
name='password'
|
||||
ref='password'
|
||||
placeholder={this.props.intl.formatMessage(holders.pwd)}
|
||||
spellCheck='false'
|
||||
/>
|
||||
</div>
|
||||
{error}
|
||||
<button
|
||||
type='submit'
|
||||
className='btn btn-primary'
|
||||
>
|
||||
<FormattedMessage
|
||||
id='claim.email_to_sso.switchTo'
|
||||
defaultMessage='Switch account to {uiType}'
|
||||
values={{
|
||||
uiType: uiType
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
EmailToSSO.defaultProps = {
|
||||
};
|
||||
EmailToSSO.propTypes = {
|
||||
intl: intlShape.isRequired,
|
||||
type: React.PropTypes.string.isRequired,
|
||||
email: React.PropTypes.string.isRequired,
|
||||
teamName: React.PropTypes.string.isRequired,
|
||||
teamDisplayName: React.PropTypes.string.isRequired
|
||||
};
|
||||
|
||||
export default injectIntl(EmailToSSO);
|
||||
168
webapp/components/claim/sso_to_email.jsx
Обычный файл
168
webapp/components/claim/sso_to_email.jsx
Обычный файл
@@ -0,0 +1,168 @@
|
||||
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
|
||||
// See License.txt for license information.
|
||||
|
||||
import ReactDOM from 'react-dom';
|
||||
import * as Utils from 'utils/utils.jsx';
|
||||
import * as Client from 'utils/client.jsx';
|
||||
|
||||
import {intlShape, injectIntl, defineMessages, FormattedMessage} from 'react-intl';
|
||||
|
||||
const holders = defineMessages({
|
||||
enterPwd: {
|
||||
id: 'claim.sso_to_email.enterPwd',
|
||||
defaultMessage: 'Please enter a password.'
|
||||
},
|
||||
pwdNotMatch: {
|
||||
id: 'claim.sso_to_email.pwdNotMatch',
|
||||
defaultMessage: 'Password do not match.'
|
||||
},
|
||||
newPwd: {
|
||||
id: 'claim.sso_to_email.newPwd',
|
||||
defaultMessage: 'New Password'
|
||||
},
|
||||
confirm: {
|
||||
id: 'claim.sso_to_email.confirm',
|
||||
defaultMessage: 'Confirm Password'
|
||||
}
|
||||
});
|
||||
|
||||
import React from 'react';
|
||||
|
||||
class SSOToEmail extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.submit = this.submit.bind(this);
|
||||
|
||||
this.state = {};
|
||||
}
|
||||
submit(e) {
|
||||
const {formatMessage} = this.props.intl;
|
||||
e.preventDefault();
|
||||
const state = {};
|
||||
|
||||
const password = ReactDOM.findDOMNode(this.refs.password).value.trim();
|
||||
if (!password) {
|
||||
state.error = formatMessage(holders.enterPwd);
|
||||
this.setState(state);
|
||||
return;
|
||||
}
|
||||
|
||||
const confirmPassword = ReactDOM.findDOMNode(this.refs.passwordconfirm).value.trim();
|
||||
if (!confirmPassword || password !== confirmPassword) {
|
||||
state.error = formatMessage(holders.pwdNotMatch);
|
||||
this.setState(state);
|
||||
return;
|
||||
}
|
||||
|
||||
state.error = null;
|
||||
this.setState(state);
|
||||
|
||||
var postData = {};
|
||||
postData.password = password;
|
||||
postData.email = this.props.email;
|
||||
postData.team_name = this.props.teamName;
|
||||
|
||||
Client.switchToEmail(postData,
|
||||
(data) => {
|
||||
if (data.follow_link) {
|
||||
window.location.href = data.follow_link;
|
||||
}
|
||||
},
|
||||
(error) => {
|
||||
this.setState({error});
|
||||
}
|
||||
);
|
||||
}
|
||||
render() {
|
||||
const {formatMessage} = this.props.intl;
|
||||
var error = null;
|
||||
if (this.state.error) {
|
||||
error = <div className='form-group has-error'><label className='control-label'>{this.state.error}</label></div>;
|
||||
}
|
||||
|
||||
var formClass = 'form-group';
|
||||
if (error) {
|
||||
formClass += ' has-error';
|
||||
}
|
||||
|
||||
const uiType = Utils.toTitleCase(this.props.currentType) + ' SSO';
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h3>
|
||||
<FormattedMessage
|
||||
id='claim.sso_to_email.title'
|
||||
defaultMessage='Switch {type} Account to Email'
|
||||
values={{
|
||||
type: uiType
|
||||
}}
|
||||
/>
|
||||
</h3>
|
||||
<form onSubmit={this.submit}>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='claim.sso_to_email.description'
|
||||
defaultMessage='Upon changing your account type, you will only be able to login with your email and password.'
|
||||
/>
|
||||
</p>
|
||||
<p>
|
||||
<FormattedMessage
|
||||
id='claim.sso_to_email_newPwd'
|
||||
defaultMessage='Enter a new password for your {team} {site} account'
|
||||
values={{
|
||||
team: this.props.teamDisplayName,
|
||||
site: global.window.mm_config.SiteName
|
||||
}}
|
||||
/>
|
||||
</p>
|
||||
<div className={formClass}>
|
||||
<input
|
||||
type='password'
|
||||
className='form-control'
|
||||
name='password'
|
||||
ref='password'
|
||||
placeholder={formatMessage(holders.newPwd)}
|
||||
spellCheck='false'
|
||||
/>
|
||||
</div>
|
||||
<div className={formClass}>
|
||||
<input
|
||||
type='password'
|
||||
className='form-control'
|
||||
name='passwordconfirm'
|
||||
ref='passwordconfirm'
|
||||
placeholder={formatMessage(holders.confirm)}
|
||||
spellCheck='false'
|
||||
/>
|
||||
</div>
|
||||
{error}
|
||||
<button
|
||||
type='submit'
|
||||
className='btn btn-primary'
|
||||
>
|
||||
<FormattedMessage
|
||||
id='claim.sso_to_email.switchTo'
|
||||
defaultMessage='Switch {type} to email and password'
|
||||
values={{
|
||||
type: uiType
|
||||
}}
|
||||
/>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
SSOToEmail.defaultProps = {
|
||||
};
|
||||
SSOToEmail.propTypes = {
|
||||
intl: intlShape.isRequired,
|
||||
currentType: React.PropTypes.string.isRequired,
|
||||
email: React.PropTypes.string.isRequired,
|
||||
teamName: React.PropTypes.string.isRequired,
|
||||
teamDisplayName: React.PropTypes.string
|
||||
};
|
||||
|
||||
export default injectIntl(SSOToEmail);
|
||||
Ссылка в новой задаче
Block a user