Update email/password settings text depending on sign-in method

Этот коммит содержится в:
JoramWilander
2016-03-30 10:39:13 -04:00
родитель 4cc7b29c92
Коммит 91c83e6ab4
6 изменённых файлов: 407 добавлений и 282 удалений

Просмотреть файл

@@ -14,7 +14,7 @@ import Constants from 'utils/constants.jsx';
import * as AsyncClient from 'utils/async_client.jsx';
import * as Utils from 'utils/utils.jsx';
import {intlShape, injectIntl, defineMessages, FormattedMessage, FormattedDate} from 'react-intl';
import {intlShape, injectIntl, defineMessages, FormattedMessage, FormattedHTMLMessage, FormattedDate} from 'react-intl';
const holders = defineMessages({
usernameReserved: {
@@ -37,18 +37,6 @@ const holders = defineMessages({
id: 'user.settings.general.checkEmail',
defaultMessage: 'Check your email at {email} to verify the address.'
},
newAddress: {
id: 'user.settings.general.newAddress',
defaultMessage: 'New Address: {email}<br />Check your email to verify the above address.'
},
checkEmailNoAddress: {
id: 'user.settings.general.checkEmailNoAddress',
defaultMessage: 'Check your email to verify your new address'
},
loginGitlab: {
id: 'user.settings.general.loginGitlab',
defaultMessage: 'Log in done through GitLab'
},
validImage: {
id: 'user.settings.general.validImage',
defaultMessage: 'Only JPG or PNG images may be used for profile pictures'
@@ -73,10 +61,6 @@ const holders = defineMessages({
id: 'user.settings.general.username',
defaultMessage: 'Username'
},
email: {
id: 'user.settings.general.email',
defaultMessage: 'Email'
},
profilePicture: {
id: 'user.settings.general.profilePicture',
defaultMessage: 'Profile Picture'
@@ -299,9 +283,224 @@ class UserSettingsGeneralTab extends React.Component {
return {username: user.username, firstName: user.first_name, lastName: user.last_name, nickname: user.nickname,
email: user.email, confirmEmail: '', picture: null, loadingPicture: false, emailChangeInProgress: false};
}
createEmailSection() {
let emailSection;
if (this.props.activeSection === 'email') {
const emailEnabled = global.window.mm_config.SendEmailNotifications === 'true';
const emailVerificationEnabled = global.window.mm_config.RequireEmailVerification === 'true';
const inputs = [];
let helpText = (
<FormattedMessage
id='user.settings.general.emailHelp1'
defaultMessage='Email is used for sign-in, notifications, and password reset. Email requires verification if changed.'
/>
);
if (!emailEnabled) {
helpText = (
<div className='setting-list__hint text-danger'>
<FormattedMessage
id='user.settings.general.emailHelp2'
defaultMessage='Email has been disabled by your system administrator. No notification emails will be sent until it is enabled.'
/>
</div>
);
} else if (!emailVerificationEnabled) {
helpText = (
<FormattedMessage
id='user.settings.general.emailHelp3'
defaultMessage='Email is used for sign-in, notifications, and password reset.'
/>
);
} else if (this.state.emailChangeInProgress) {
const newEmail = UserStore.getCurrentUser().email;
if (newEmail) {
helpText = (
<FormattedMessage
id='user.settings.general.emailHelp4'
defaultMessage='A verification email was sent to {email}.'
values={{
email: newEmail
}}
/>
);
}
}
let submit = null;
if (this.props.user.auth_service === '') {
inputs.push(
<div key='emailSetting'>
<div className='form-group'>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.general.primaryEmail'
defaultMessage='Primary Email'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='text'
onChange={this.updateEmail}
value={this.state.email}
/>
</div>
</div>
</div>
);
inputs.push(
<div key='confirmEmailSetting'>
<div className='form-group'>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.general.confirmEmail'
defaultMessage='Confirm Email'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='text'
onChange={this.updateConfirmEmail}
value={this.state.confirmEmail}
/>
</div>
</div>
{helpText}
</div>
);
submit = this.submitEmail;
} else if (this.props.user.auth_service === Constants.GITLAB_SERVICE) {
inputs.push(
<div
key='oauthEmailInfo'
className='form-group'
>
<div className='setting-list__hint'>
<FormattedMessage
id='user.settings.general.emailGitlabCantUpdate'
defaultMessage='Login occurs through GitLab. Email cannot be updated. Email address used for notifications is {email}.'
values={{
email: this.state.email
}}
/>
</div>
{helpText}
</div>
);
} else if (this.props.user.auth_service === Constants.LDAP_SERVICE) {
inputs.push(
<div
key='oauthEmailInfo'
className='form-group'
>
<div className='setting-list__hint'>
<FormattedMessage
id='user.settings.general.emailLdapCantUpdate'
defaultMessage='Login occurs through LDAP. Email cannot be updated. Email address used for notifications is {email}.'
values={{
email: this.state.email
}}
/>
</div>
{helpText}
</div>
);
}
emailSection = (
<SettingItemMax
title={
<FormattedMessage
id='user.settings.general.email'
defaultMessage='Email'
/>
}
inputs={inputs}
submit={submit}
server_error={this.state.serverError}
client_error={this.state.emailError}
updateSection={(e) => {
this.updateSection('');
e.preventDefault();
}}
/>
);
} else {
let describe = '';
if (this.props.user.auth_service === '') {
if (this.state.emailChangeInProgress) {
const newEmail = UserStore.getCurrentUser().email;
if (newEmail) {
describe = (
<FormattedHTMLMessage
id='user.settings.general.newAddress'
defaultMessage='New Address: {email}<br />Check your email to verify the above address.'
values={{
email: newEmail
}}
/>
);
} else {
describe = (
<FormattedMessage
id='user.settings.general.checkEmailNoAddress'
defaultMessage='Check your email to verify your new address'
/>
);
}
} else {
describe = UserStore.getCurrentUser().email;
}
} else if (this.props.user.auth_service === Constants.GITLAB_SERVICE) {
describe = (
<FormattedMessage
id='user.settings.general.loginGitlab'
defaultMessage='Login done through GitLab ({email})'
values={{
email: this.state.email
}}
/>
);
} else if (this.props.user.auth_service === Constants.LDAP_SERVICE) {
describe = (
<FormattedMessage
id='user.settings.general.loginLdap'
defaultMessage='Login done through LDAP ({email})'
values={{
email: this.state.email
}}
/>
);
}
emailSection = (
<SettingItemMin
title={
<FormattedMessage
id='user.settings.general.email'
defaultMessage='Email'
/>
}
describe={describe}
updateSection={() => {
this.updateSection('email');
}}
/>
);
}
return emailSection;
}
render() {
const user = this.props.user;
const {formatMessage, formatHTMLMessage} = this.props.intl;
const {formatMessage} = this.props.intl;
let clientError = null;
if (this.state.clientError) {
@@ -311,10 +510,6 @@ class UserSettingsGeneralTab extends React.Component {
if (this.state.serverError) {
serverError = this.state.serverError;
}
let emailError = null;
if (this.state.emailError) {
emailError = this.state.emailError;
}
let nameSection;
const inputs = [];
@@ -409,20 +604,27 @@ class UserSettingsGeneralTab extends React.Component {
/>
);
} else {
let fullName = '';
let describe = '';
if (user.first_name && user.last_name) {
fullName = user.first_name + ' ' + user.last_name;
describe = user.first_name + ' ' + user.last_name;
} else if (user.first_name) {
fullName = user.first_name;
describe = user.first_name;
} else if (user.last_name) {
fullName = user.last_name;
describe = user.last_name;
} else {
describe = (
<FormattedMessage
id='user.settings.general.emptyName'
defaultMessage="Click 'Edit' to add your full name"
/>
);
}
nameSection = (
<SettingItemMin
title={formatMessage(holders.fullName)}
describe={fullName}
describe={describe}
updateSection={() => {
this.updateSection('name');
}}
@@ -483,10 +685,22 @@ class UserSettingsGeneralTab extends React.Component {
/>
);
} else {
let describe = '';
if (user.nickname) {
describe = user.nickname;
} else {
describe = (
<FormattedMessage
id='user.settings.general.emptyNickname'
defaultMessage="Click 'Edit' to add a nickname"
/>
);
}
nicknameSection = (
<SettingItemMin
title={formatMessage(holders.nickname)}
describe={UserStore.getCurrentUser().nickname}
describe={describe}
updateSection={() => {
this.updateSection('nickname');
}}
@@ -559,152 +773,7 @@ class UserSettingsGeneralTab extends React.Component {
);
}
let emailSection;
if (this.props.activeSection === 'email') {
const emailEnabled = global.window.mm_config.SendEmailNotifications === 'true';
const emailVerificationEnabled = global.window.mm_config.RequireEmailVerification === 'true';
let helpText = (
<FormattedMessage
id='user.settings.general.emailHelp1'
defaultMessage='Email is used for sign-in, notifications, and password reset. Email requires verification if changed.'
/>
);
if (!emailEnabled) {
helpText = (
<div className='setting-list__hint text-danger'>
<FormattedMessage
id='user.settings.general.emailHelp2'
defaultMessage='Email has been disabled by your system administrator. No notification emails will be sent until it is enabled.'
/>
</div>
);
} else if (!emailVerificationEnabled) {
helpText = (
<FormattedMessage
id='user.settings.general.emailHelp3'
defaultMessage='Email is used for sign-in, notifications, and password reset.'
/>
);
} else if (this.state.emailChangeInProgress) {
const newEmail = UserStore.getCurrentUser().email;
if (newEmail) {
helpText = (
<FormattedMessage
id='user.settings.general.emailHelp4'
defaultMessage='A verification email was sent to {email}.'
values={{
email: newEmail
}}
/>
);
}
}
let submit = null;
if (this.props.user.auth_service === '') {
inputs.push(
<div key='emailSetting'>
<div className='form-group'>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.general.primaryEmail'
defaultMessage='Primary Email'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='text'
onChange={this.updateEmail}
value={this.state.email}
/>
</div>
</div>
</div>
);
inputs.push(
<div key='confirmEmailSetting'>
<div className='form-group'>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.general.confirmEmail'
defaultMessage='Confirm Email'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='text'
onChange={this.updateConfirmEmail}
value={this.state.confirmEmail}
/>
</div>
</div>
{helpText}
</div>
);
submit = this.submitEmail;
} else if (this.props.user.auth_service === Constants.GITLAB_SERVICE) {
inputs.push(
<div
key='oauthEmailInfo'
className='form-group'
>
<div className='setting-list__hint'>
<FormattedMessage
id='user.settings.general.emailCantUpdate'
defaultMessage='Log in occurs through GitLab. Email cannot be updated.'
/>
</div>
{helpText}
</div>
);
}
emailSection = (
<SettingItemMax
title='Email'
inputs={inputs}
submit={submit}
server_error={serverError}
client_error={emailError}
updateSection={(e) => {
this.updateSection('');
e.preventDefault();
}}
/>
);
} else {
let describe = '';
if (this.props.user.auth_service === '') {
if (this.state.emailChangeInProgress) {
const newEmail = UserStore.getCurrentUser().email;
if (newEmail) {
describe = formatHTMLMessage(holders.newAddress, {email: newEmail});
} else {
describe = formatMessage(holders.checkEmailNoAddress);
}
} else {
describe = UserStore.getCurrentUser().email;
}
} else if (this.props.user.auth_service === Constants.GITLAB_SERVICE) {
describe = formatMessage(holders.loginGitlab);
}
emailSection = (
<SettingItemMin
title={formatMessage(holders.email)}
describe={describe}
updateSection={() => {
this.updateSection('email');
}}
/>
);
}
const emailSection = this.createEmailSection();
let pictureSection;
if (this.props.activeSection === 'picture') {

Просмотреть файл

@@ -30,14 +30,6 @@ const holders = defineMessages({
id: 'user.settings.security.passwordMatchError',
defaultMessage: 'The new passwords you entered do not match'
},
password: {
id: 'user.settings.security.password',
defaultMessage: 'Password'
},
lastUpdated: {
id: 'user.settings.security.lastUpdated',
defaultMessage: 'Last updated {date} at {time}'
},
method: {
id: 'user.settings.security.method',
defaultMessage: 'Sign-in Method'
@@ -131,74 +123,106 @@ class SecurityTab extends React.Component {
}
createPasswordSection() {
let updateSectionStatus;
const {formatMessage} = this.props.intl;
if (this.props.activeSection === 'password' && this.props.user.auth_service === '') {
if (this.props.activeSection === 'password') {
const inputs = [];
let submit;
inputs.push(
<div
key='currentPasswordUpdateForm'
className='form-group'
>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.security.currentPassword'
defaultMessage='Current Password'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='password'
onChange={this.updateCurrentPassword}
value={this.state.currentPassword}
/>
if (this.props.user.auth_service === '') {
submit = this.submitPassword;
inputs.push(
<div
key='currentPasswordUpdateForm'
className='form-group'
>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.security.currentPassword'
defaultMessage='Current Password'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='password'
onChange={this.updateCurrentPassword}
value={this.state.currentPassword}
/>
</div>
</div>
</div>
);
inputs.push(
<div
key='newPasswordUpdateForm'
className='form-group'
>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.security.newPassword'
defaultMessage='New Password'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='password'
onChange={this.updateNewPassword}
value={this.state.newPassword}
/>
);
inputs.push(
<div
key='newPasswordUpdateForm'
className='form-group'
>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.security.newPassword'
defaultMessage='New Password'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='password'
onChange={this.updateNewPassword}
value={this.state.newPassword}
/>
</div>
</div>
</div>
);
inputs.push(
<div
key='retypeNewPasswordUpdateForm'
className='form-group'
>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.security.retypePassword'
defaultMessage='Retype New Password'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='password'
onChange={this.updateConfirmPassword}
value={this.state.confirmPassword}
/>
);
inputs.push(
<div
key='retypeNewPasswordUpdateForm'
className='form-group'
>
<label className='col-sm-5 control-label'>
<FormattedMessage
id='user.settings.security.retypePassword'
defaultMessage='Retype New Password'
/>
</label>
<div className='col-sm-7'>
<input
className='form-control'
type='password'
onChange={this.updateConfirmPassword}
value={this.state.confirmPassword}
/>
</div>
</div>
</div>
);
);
} else if (this.props.user.auth_service === Constants.GITLAB_SERVICE) {
inputs.push(
<div
key='oauthEmailInfo'
className='form-group'
>
<div className='setting-list__hint'>
<FormattedMessage
id='user.settings.security.passwordGitlabCantUpdate'
defaultMessage='Login occurs through GitLab. Password cannot be updated.'
/>
</div>
</div>
);
} else if (this.props.user.auth_service === Constants.LDAP_SERVICE) {
inputs.push(
<div
key='oauthEmailInfo'
className='form-group'
>
<div className='setting-list__hint'>
<FormattedMessage
id='user.settings.security.passwordLdapCantUpdate'
defaultMessage='Login occurs through LDAP. Password cannot be updated.'
/>
</div>
</div>
);
}
updateSectionStatus = function resetSection(e) {
this.props.updateSection('');
@@ -209,9 +233,14 @@ class SecurityTab extends React.Component {
return (
<SettingItemMax
title={formatMessage(holders.password)}
title={
<FormattedMessage
id='user.settings.security.password'
defaultMessage='Password'
/>
}
inputs={inputs}
submit={this.submitPassword}
submit={submit}
server_error={this.state.serverError}
client_error={this.state.passwordError}
updateSection={updateSectionStatus}
@@ -219,34 +248,51 @@ class SecurityTab extends React.Component {
);
}
var describe;
var d = new Date(this.props.user.last_password_update);
let describe;
const hours12 = !Utils.isMilitaryTime();
describe = (
<FormattedMessage
id='user.settings.security.lastUpdated'
defaultMessage='Last updated {date} at {time}'
values={{
date: (
<FormattedDate
value={d}
day='2-digit'
month='short'
year='numeric'
/>
),
time: (
<FormattedTime
value={d}
hour12={hours12}
hour='2-digit'
minute='2-digit'
/>
)
}}
/>
);
if (this.props.user.auth_service === '') {
const d = new Date(this.props.user.last_password_update);
const hours12 = !Utils.isMilitaryTime();
describe = (
<FormattedMessage
id='user.settings.security.lastUpdated'
defaultMessage='Last updated {date} at {time}'
values={{
date: (
<FormattedDate
value={d}
day='2-digit'
month='short'
year='numeric'
/>
),
time: (
<FormattedTime
value={d}
hour12={hours12}
hour='2-digit'
minute='2-digit'
/>
)
}}
/>
);
} else if (this.props.user.auth_service === Constants.GITLAB_SERVICE) {
describe = (
<FormattedMessage
id='user.settings.security.loginGitlab'
defaultMessage='Login done through Gitlab'
/>
);
} else if (this.props.user.auth_service === Constants.LDAP_SERVICE) {
describe = (
<FormattedMessage
id='user.settings.security.loginLdap'
defaultMessage='Login done through LDAP'
/>
);
}
updateSectionStatus = function updateSection() {
this.props.updateSection('password');
@@ -254,7 +300,12 @@ class SecurityTab extends React.Component {
return (
<SettingItemMin
title={formatMessage(holders.password)}
title={
<FormattedMessage
id='user.settings.security.password'
defaultMessage='Password'
/>
}
describe={describe}
updateSection={updateSectionStatus}
/>