Removed extraneous error when providing a short username

Этот коммит содержится в:
Reed Garmsen
2016-01-19 12:39:51 -08:00
родитель 1acd38b7b1
Коммит 76f0000565
9 изменённых файлов: 57 добавлений и 44 удалений

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

@@ -2,6 +2,7 @@
// See License.txt for license information. // See License.txt for license information.
import * as Client from '../../utils/client.jsx'; import * as Client from '../../utils/client.jsx';
import Constants from '../../utils/constants.jsx';
var Modal = ReactBootstrap.Modal; var Modal = ReactBootstrap.Modal;
export default class ResetPasswordModal extends React.Component { export default class ResetPasswordModal extends React.Component {
@@ -20,8 +21,8 @@ export default class ResetPasswordModal extends React.Component {
e.preventDefault(); e.preventDefault();
var password = ReactDOM.findDOMNode(this.refs.password).value; var password = ReactDOM.findDOMNode(this.refs.password).value;
if (!password || password.length < 5) { if (!password || password.length < Constants.MIN_PASSWORD_LENGTH) {
this.setState({serverError: 'Please enter at least 5 characters.'}); this.setState({serverError: 'Please enter at least ' + Constants.MIN_PASSWORD_LENGTH + ' characters.'});
return; return;
} }

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

@@ -1,7 +1,8 @@
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information. // See License.txt for license information.
import * as client from '../utils/client.jsx'; import * as Client from '../utils/client.jsx';
import Constants from '../utils/constants.jsx';
export default class PasswordResetForm extends React.Component { export default class PasswordResetForm extends React.Component {
constructor(props) { constructor(props) {
@@ -16,8 +17,8 @@ export default class PasswordResetForm extends React.Component {
var state = {}; var state = {};
var password = ReactDOM.findDOMNode(this.refs.password).value.trim(); var password = ReactDOM.findDOMNode(this.refs.password).value.trim();
if (!password || password.length < 5) { if (!password || password.length < Constants.MIN_PASSWORD_LENGTH) {
state.error = 'Please enter at least 5 characters.'; state.error = 'Please enter at least ' + Constants.MIN_PASSWORD_LENGTH + ' characters.';
this.setState(state); this.setState(state);
return; return;
} }
@@ -31,7 +32,7 @@ export default class PasswordResetForm extends React.Component {
data.data = this.props.data; data.data = this.props.data;
data.name = this.props.teamName; data.name = this.props.teamName;
client.resetPassword(data, Client.resetPassword(data,
function resetSuccess() { function resetSuccess() {
this.setState({error: null, updateText: 'Your password has been updated successfully.'}); this.setState({error: null, updateText: 'Your password has been updated successfully.'});
}.bind(this), }.bind(this),
@@ -59,7 +60,7 @@ export default class PasswordResetForm extends React.Component {
return ( return (
<div className='col-sm-12'> <div className='col-sm-12'>
<div className='signup-team__container'> <div className='signup-team__container'>
<h3>Password Reset</h3> <h3>{'Password Reset'}</h3>
<form onSubmit={this.handlePasswordReset}> <form onSubmit={this.handlePasswordReset}>
<p>{'Enter a new password for your ' + this.props.teamDisplayName + ' ' + global.window.mm_config.SiteName + ' account.'}</p> <p>{'Enter a new password for your ' + this.props.teamDisplayName + ' ' + global.window.mm_config.SiteName + ' account.'}</p>
<div className={formClass}> <div className={formClass}>
@@ -77,7 +78,7 @@ export default class PasswordResetForm extends React.Component {
type='submit' type='submit'
className='btn btn-primary' className='btn btn-primary'
> >
Change my password {'Change my password'}
</button> </button>
{updateText} {updateText}
</form> </form>

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

@@ -5,6 +5,7 @@ import * as Utils from '../utils/utils.jsx';
import * as client from '../utils/client.jsx'; import * as client from '../utils/client.jsx';
import UserStore from '../stores/user_store.jsx'; import UserStore from '../stores/user_store.jsx';
import BrowserStore from '../stores/browser_store.jsx'; import BrowserStore from '../stores/browser_store.jsx';
import Constants from '../utils/constants.jsx';
export default class SignupUserComplete extends React.Component { export default class SignupUserComplete extends React.Component {
constructor(props) { constructor(props) {
@@ -51,7 +52,7 @@ export default class SignupUserComplete extends React.Component {
return; return;
} else if (usernameError) { } else if (usernameError) {
this.setState({ this.setState({
nameError: 'Username must begin with a letter, and contain between 3 to 15 lowercase characters made up of numbers, letters, and the symbols \'.\', \'-\' and \'_\'.', nameError: 'Username must begin with a letter, and contain between ' + Constants.MIN_USERNAME_LENGTH + ' to ' + Constants.MAX_USERNAME_LENGTH + ' lowercase characters made up of numbers, letters, and the symbols \'.\', \'-\' and \'_\'.',
emailError: '', emailError: '',
passwordError: '', passwordError: '',
serverError: '' serverError: ''
@@ -60,8 +61,8 @@ export default class SignupUserComplete extends React.Component {
} }
const providedPassword = ReactDOM.findDOMNode(this.refs.password).value.trim(); const providedPassword = ReactDOM.findDOMNode(this.refs.password).value.trim();
if (!providedPassword || providedPassword.length < 5) { if (!providedPassword || providedPassword.length < Constants.MIN_PASSWORD_LENGTH) {
this.setState({nameError: '', emailError: '', passwordError: 'Please enter at least 5 characters', serverError: ''}); this.setState({nameError: '', emailError: '', passwordError: 'Please enter at least ' + Constants.MIN_PASSWORD_LENGTH + ' characters', serverError: ''});
return; return;
} }
@@ -111,7 +112,7 @@ export default class SignupUserComplete extends React.Component {
client.track('signup', 'signup_user_01_welcome'); client.track('signup', 'signup_user_01_welcome');
if (this.state.wizard === 'finished') { if (this.state.wizard === 'finished') {
return <div>You've already completed the signup process for this invitation or this invitation has expired.</div>; return <div>{"You've already completed the signup process for this invitation or this invitation has expired."}</div>;
} }
// set up error labels // set up error labels
@@ -123,9 +124,11 @@ export default class SignupUserComplete extends React.Component {
} }
var nameError = null; var nameError = null;
var nameHelpText = <span className='help-block'>{'Username must begin with a letter, and contain between ' + Constants.MIN_USERNAME_LENGTH + ' to ' + Constants.MAX_USERNAME_LENGTH + " lowercase characters made up of numbers, letters, and the symbols '.', '-' and '_'"}</span>;
var nameDivStyle = 'form-group'; var nameDivStyle = 'form-group';
if (this.state.nameError) { if (this.state.nameError) {
nameError = <label className='control-label'>{this.state.nameError}</label>; nameError = <label className='control-label'>{this.state.nameError}</label>;
nameHelpText = '';
nameDivStyle += ' has-error'; nameDivStyle += ' has-error';
} }
@@ -148,7 +151,7 @@ export default class SignupUserComplete extends React.Component {
// set up the email entry and hide it if an email was provided // set up the email entry and hide it if an email was provided
var yourEmailIs = ''; var yourEmailIs = '';
if (this.state.user.email) { if (this.state.user.email) {
yourEmailIs = <span>Your email address is <strong>{this.state.user.email}</strong>. You'll use this address to sign in to {global.window.mm_config.SiteName}.</span>; yourEmailIs = <span>{'Your email address is '}<strong>{this.state.user.email}</strong>{". You'll use this address to sign in to " + global.window.mm_config.SiteName + '.'}</span>;
} }
var emailContainerStyle = 'margin--extra'; var emailContainerStyle = 'margin--extra';
@@ -158,7 +161,7 @@ export default class SignupUserComplete extends React.Component {
var email = ( var email = (
<div className={emailContainerStyle}> <div className={emailContainerStyle}>
<h5><strong>What's your email address?</strong></h5> <h5><strong>{"What's your email address?"}</strong></h5>
<div className={emailDivStyle}> <div className={emailDivStyle}>
<input <input
type='email' type='email'
@@ -208,7 +211,7 @@ export default class SignupUserComplete extends React.Component {
{email} {email}
{yourEmailIs} {yourEmailIs}
<div className='margin--extra'> <div className='margin--extra'>
<h5><strong>Choose your username</strong></h5> <h5><strong>{'Choose your username'}</strong></h5>
<div className={nameDivStyle}> <div className={nameDivStyle}>
<input <input
type='text' type='text'
@@ -219,11 +222,11 @@ export default class SignupUserComplete extends React.Component {
spellCheck='false' spellCheck='false'
/> />
{nameError} {nameError}
<span className='help-block'>Username must begin with a letter, and contain between 3 to 15 lowercase characters made up of numbers, letters, and the symbols '.', '-' and '_'</span> {nameHelpText}
</div> </div>
</div> </div>
<div className='margin--extra'> <div className='margin--extra'>
<h5><strong>Choose your password</strong></h5> <h5><strong>{'Choose your password'}</strong></h5>
<div className={passwordDivStyle}> <div className={passwordDivStyle}>
<input <input
type='password' type='password'
@@ -243,7 +246,7 @@ export default class SignupUserComplete extends React.Component {
onClick={this.handleSubmit} onClick={this.handleSubmit}
className='btn-primary btn' className='btn-primary btn'
> >
Create Account {'Create Account'}
</button> </button>
</p> </p>
</div> </div>
@@ -255,7 +258,7 @@ export default class SignupUserComplete extends React.Component {
<div> <div>
{signupMessage} {signupMessage}
<div className='or__container'> <div className='or__container'>
<span>or</span> <span>{'or'}</span>
</div> </div>
</div> </div>
); );
@@ -268,10 +271,10 @@ export default class SignupUserComplete extends React.Component {
className='signup-team-logo' className='signup-team-logo'
src='/static/images/logo.png' src='/static/images/logo.png'
/> />
<h5 className='margin--less'>Welcome to:</h5> <h5 className='margin--less'>{'Welcome to:'}</h5>
<h2 className='signup-team__name'>{this.props.teamDisplayName}</h2> <h2 className='signup-team__name'>{this.props.teamDisplayName}</h2>
<h2 className='signup-team__subdomain'>on {global.window.mm_config.SiteName}</h2> <h2 className='signup-team__subdomain'>{'on ' + global.window.mm_config.SiteName}</h2>
<h4 className='color--light'>Let's create your account</h4> <h4 className='color--light'>{"Let's create your account"}</h4>
{signupMessage} {signupMessage}
{emailSignup} {emailSignup}
{serverError} {serverError}

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

@@ -4,6 +4,7 @@
import * as Client from '../utils/client.jsx'; import * as Client from '../utils/client.jsx';
import BrowserStore from '../stores/browser_store.jsx'; import BrowserStore from '../stores/browser_store.jsx';
import UserStore from '../stores/user_store.jsx'; import UserStore from '../stores/user_store.jsx';
import Constants from '../utils/constants.jsx';
export default class TeamSignupPasswordPage extends React.Component { export default class TeamSignupPasswordPage extends React.Component {
constructor(props) { constructor(props) {
@@ -23,8 +24,8 @@ export default class TeamSignupPasswordPage extends React.Component {
e.preventDefault(); e.preventDefault();
var password = ReactDOM.findDOMNode(this.refs.password).value.trim(); var password = ReactDOM.findDOMNode(this.refs.password).value.trim();
if (!password || password.length < 5) { if (!password || password.length < Constants.MIN_PASSWORD_LENGTH) {
this.setState({passwordError: 'Please enter at least 5 characters'}); this.setState({passwordError: 'Please enter at least ' + Constants.MIN_PASSWORD_LENGTH + ' characters'});
return; return;
} }
@@ -92,15 +93,15 @@ export default class TeamSignupPasswordPage extends React.Component {
className='signup-team-logo' className='signup-team-logo'
src='/static/images/logo.png' src='/static/images/logo.png'
/> />
<h2 className='margin--less'>Your password</h2> <h2 className='margin--less'>{'Your password'}</h2>
<h5 className='color--light'>Select a password that you'll use to login with your email address:</h5> <h5 className='color--light'>{"Select a password that you'll use to login with your email address:"}</h5>
<div className='inner__content margin--extra'> <div className='inner__content margin--extra'>
<h5><strong>Email</strong></h5> <h5><strong>{'Email'}</strong></h5>
<div className='block--gray form-group'>{this.props.state.team.email}</div> <div className='block--gray form-group'>{this.props.state.team.email}</div>
<div className={passwordDivStyle}> <div className={passwordDivStyle}>
<div className='row'> <div className='row'>
<div className='col-sm-11'> <div className='col-sm-11'>
<h5><strong>Choose your password</strong></h5> <h5><strong>{'Choose your password'}</strong></h5>
<input <input
autoFocus={true} autoFocus={true}
type='password' type='password'
@@ -110,7 +111,7 @@ export default class TeamSignupPasswordPage extends React.Component {
maxLength='128' maxLength='128'
spellCheck='false' spellCheck='false'
/> />
<span className='color--light help-block'>Passwords must contain 5 to 50 characters. Your password will be strongest if it contains a mix of symbols, numbers, and upper and lowercase characters.</span> <span className='color--light help-block'>{'Passwords must contain ' + Constants.MIN_PASSWORD_LENGTH + ' to ' + Constants.MAX_PASSWORD_LENGTH + ' characters. Your password will be strongest if it contains a mix of symbols, numbers, and upper and lowercase characters.'}</span>
</div> </div>
</div> </div>
{passwordError} {passwordError}
@@ -125,7 +126,7 @@ export default class TeamSignupPasswordPage extends React.Component {
data-loading-text={'<span class=\'glyphicon glyphicon-refresh glyphicon-refresh-animate\'></span> Creating team...'} data-loading-text={'<span class=\'glyphicon glyphicon-refresh glyphicon-refresh-animate\'></span> Creating team...'}
onClick={this.submitNext} onClick={this.submitNext}
> >
Finish {'Finish'}
</button> </button>
</div> </div>
<p>By proceeding to create your account and use {global.window.mm_config.SiteName}, you agree to our <a href='/static/help/terms.html'>Terms of Service</a> and <a href='/static/help/privacy.html'>Privacy Policy</a>. If you do not agree, you cannot use {global.window.mm_config.SiteName}.</p> <p>By proceeding to create your account and use {global.window.mm_config.SiteName}, you agree to our <a href='/static/help/terms.html'>Terms of Service</a> and <a href='/static/help/privacy.html'>Privacy Policy</a>. If you do not agree, you cannot use {global.window.mm_config.SiteName}.</p>
@@ -134,7 +135,7 @@ export default class TeamSignupPasswordPage extends React.Component {
href='#' href='#'
onClick={this.submitBack} onClick={this.submitBack}
> >
Back to previous step {'Back to previous step'}
</a> </a>
</div> </div>
</form> </form>

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

@@ -3,6 +3,7 @@
import * as Utils from '../utils/utils.jsx'; import * as Utils from '../utils/utils.jsx';
import * as Client from '../utils/client.jsx'; import * as Client from '../utils/client.jsx';
import Constants from '../utils/constants.jsx';
export default class TeamSignupUsernamePage extends React.Component { export default class TeamSignupUsernamePage extends React.Component {
constructor(props) { constructor(props) {
@@ -33,7 +34,7 @@ export default class TeamSignupUsernamePage extends React.Component {
this.setState({nameError: 'This username is reserved, please choose a new one.'}); this.setState({nameError: 'This username is reserved, please choose a new one.'});
return; return;
} else if (usernameError) { } else if (usernameError) {
this.setState({nameError: 'Username must begin with a letter, and contain 3 to 15 characters in total, which may be numbers, lowercase letters, or any of the symbols \'.\', \'-\', or \'_\''}); this.setState({nameError: 'Username must begin with a letter, and contain between ' + Constants.MIN_USERNAME_LENGTH + ' to ' + Constants.MAX_USERNAME_LENGTH + ' characters in total, which may be numbers, lowercase letters, or any of the symbols \'.\', \'-\', or \'_\''});
return; return;
} }
@@ -45,9 +46,11 @@ export default class TeamSignupUsernamePage extends React.Component {
Client.track('signup', 'signup_team_06_username'); Client.track('signup', 'signup_team_06_username');
var nameError = null; var nameError = null;
var nameHelpText = <span className='color--light help-block'>{'Usernames must begin with a letter and contain between ' + Constants.MIN_USERNAME_LENGTH + ' to ' + Constants.MAX_USERNAME_LENGTH + " characters made up of lowercase letters, numbers, and the symbols '.', '-' and '_'"}</span>;
var nameDivClass = 'form-group'; var nameDivClass = 'form-group';
if (this.state.nameError) { if (this.state.nameError) {
nameError = <label className='control-label'>{this.state.nameError}</label>; nameError = <label className='control-label'>{this.state.nameError}</label>;
nameHelpText = '';
nameDivClass += ' has-error'; nameDivClass += ' has-error';
} }
@@ -58,13 +61,13 @@ export default class TeamSignupUsernamePage extends React.Component {
className='signup-team-logo' className='signup-team-logo'
src='/static/images/logo.png' src='/static/images/logo.png'
/> />
<h2 className='margin--less'>Your username</h2> <h2 className='margin--less'>{'Your username'}</h2>
<h5 className='color--light'>{'Select a memorable username that makes it easy for teammates to identify you:'}</h5> <h5 className='color--light'>{'Select a memorable username that makes it easy for teammates to identify you:'}</h5>
<div className='inner__content margin--extra'> <div className='inner__content margin--extra'>
<div className={nameDivClass}> <div className={nameDivClass}>
<div className='row'> <div className='row'>
<div className='col-sm-11'> <div className='col-sm-11'>
<h5><strong>Choose your username</strong></h5> <h5><strong>{'Choose your username'}</strong></h5>
<input <input
autoFocus={true} autoFocus={true}
type='text' type='text'
@@ -75,7 +78,7 @@ export default class TeamSignupUsernamePage extends React.Component {
maxLength='128' maxLength='128'
spellCheck='false' spellCheck='false'
/> />
<span className='color--light help-block'>Usernames must begin with a letter and contain 3 to 15 characters made up of lowercase letters, numbers, and the symbols '.', '-' and '_'</span> {nameHelpText}
</div> </div>
</div> </div>
{nameError} {nameError}
@@ -86,7 +89,7 @@ export default class TeamSignupUsernamePage extends React.Component {
className='btn btn-primary margin--extra' className='btn btn-primary margin--extra'
onClick={this.submitNext} onClick={this.submitNext}
> >
Next {'Next'}
<i className='glyphicon glyphicon-chevron-right'></i> <i className='glyphicon glyphicon-chevron-right'></i>
</button> </button>
<div className='margin--extra'> <div className='margin--extra'>
@@ -94,7 +97,7 @@ export default class TeamSignupUsernamePage extends React.Component {
href='#' href='#'
onClick={this.submitBack} onClick={this.submitBack}
> >
Back to previous step {'Back to previous step'}
</a> </a>
</div> </div>
</form> </form>

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

@@ -47,7 +47,7 @@ export default class UserSettingsGeneralTab extends React.Component {
this.setState({clientError: 'This username is reserved, please choose a new one.'}); this.setState({clientError: 'This username is reserved, please choose a new one.'});
return; return;
} else if (usernameError) { } else if (usernameError) {
this.setState({clientError: "Username must begin with a letter, and contain between 3 to 15 lowercase characters made up of numbers, letters, and the symbols '.', '-' and '_'."}); this.setState({clientError: 'Username must begin with a letter, and contain between ' + Constants.MIN_USERNAME_LENGTH + ' to ' + Constants.MAX_USERNAME_LENGTH + " lowercase characters made up of numbers, letters, and the symbols '.', '-' and '_'."});
return; return;
} }

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

@@ -48,8 +48,8 @@ export default class SecurityTab extends React.Component {
return; return;
} }
if (newPassword.length < 5) { if (newPassword.length < Constants.MIN_PASSWORD_LENGTH) {
this.setState({passwordError: 'New passwords must be at least 5 characters', serverError: ''}); this.setState({passwordError: 'New passwords must be at least ' + Constants.MIN_PASSWORD_LENGTH + ' characters', serverError: ''});
return; return;
} }
@@ -337,7 +337,7 @@ export default class SecurityTab extends React.Component {
className='security-links theme' className='security-links theme'
dialogType={AccessHistoryModal} dialogType={AccessHistoryModal}
> >
<i className='fa fa-clock-o'></i>View Access History <i className='fa fa-clock-o'></i>{'View Access History'}
</ToggleModalButton> </ToggleModalButton>
<b> </b> <b> </b>
<ToggleModalButton <ToggleModalButton

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

@@ -453,5 +453,9 @@ export default {
description: 'Show preview snippet of links below message' description: 'Show preview snippet of links below message'
} }
}, },
OVERLAY_TIME_DELAY: 400 OVERLAY_TIME_DELAY: 400,
MIN_USERNAME_LENGTH: 3,
MAX_USERNAME_LENGTH: 15,
MIN_PASSWORD_LENGTH: 5,
MAX_PASSWORD_LENGTH: 50
}; };

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

@@ -879,8 +879,8 @@ export function isValidUsername(name) {
var error = ''; var error = '';
if (!name) { if (!name) {
error = 'This field is required'; error = 'This field is required';
} else if (name.length < 3 || name.length > 15) { } else if (name.length < Constants.MIN_USERNAME_LENGTH || name.length > Constants.MAX_USERNAME_LENGTH) {
error = 'Must be between 3 and 15 characters'; error = 'Must be between ' + Constants.MIN_USERNAME_LENGTH + ' and ' + Constants.MAX_USERNAME_LENGTH + ' characters';
} else if (!(/^[a-z0-9\.\-\_]+$/).test(name)) { } else if (!(/^[a-z0-9\.\-\_]+$/).test(name)) {
error = "Must contain only letters, numbers, and the symbols '.', '-', and '_'."; error = "Must contain only letters, numbers, and the symbols '.', '-', and '_'.";
} else if (!(/[a-z]/).test(name.charAt(0))) { //eslint-disable-line no-negated-condition } else if (!(/[a-z]/).test(name.charAt(0))) { //eslint-disable-line no-negated-condition