diff options
author | Elias Nahum <nahumhbl@gmail.com> | 2016-01-28 16:16:39 -0300 |
---|---|---|
committer | Elias Nahum <nahumhbl@gmail.com> | 2016-01-28 16:16:39 -0300 |
commit | 53e495cf335d3c6b44361627288db252aae1f4ad (patch) | |
tree | d7fb30f15a5166d7ab47fe882478a086837d940f /web/react/components/password_reset_form.jsx | |
parent | db37897538f134b29784453797510c20e1e9303c (diff) | |
download | chat-53e495cf335d3c6b44361627288db252aae1f4ad.tar.gz chat-53e495cf335d3c6b44361627288db252aae1f4ad.tar.bz2 chat-53e495cf335d3c6b44361627288db252aae1f4ad.zip |
PLT-7: Refactoring frontend (chunk 4)
Diffstat (limited to 'web/react/components/password_reset_form.jsx')
-rw-r--r-- | web/react/components/password_reset_form.jsx | 64 |
1 files changed, 56 insertions, 8 deletions
diff --git a/web/react/components/password_reset_form.jsx b/web/react/components/password_reset_form.jsx index 8063db05a..380dbe973 100644 --- a/web/react/components/password_reset_form.jsx +++ b/web/react/components/password_reset_form.jsx @@ -4,7 +4,24 @@ import * as Client from '../utils/client.jsx'; import Constants from '../utils/constants.jsx'; -export default class PasswordResetForm extends React.Component { +import {injectIntl, intlShape, defineMessages, FormattedMessage, FormattedHTMLMessage} from 'mm-intl'; + +const holders = defineMessages({ + error: { + id: 'password_form.error', + defaultMessage: 'Please enter at least {chars} characters.' + }, + update: { + id: 'password_form.update', + defaultMessage: 'Your password has been updated successfully.' + }, + pwd: { + id: 'password_form.pwd', + defaultMessage: 'Password' + } +}); + +class PasswordResetForm extends React.Component { constructor(props) { super(props); @@ -14,11 +31,13 @@ export default class PasswordResetForm extends React.Component { } handlePasswordReset(e) { e.preventDefault(); + + const {formatMessage} = this.props.intl; var state = {}; var password = ReactDOM.findDOMNode(this.refs.password).value.trim(); if (!password || password.length < Constants.MIN_PASSWORD_LENGTH) { - state.error = 'Please enter at least ' + Constants.MIN_PASSWORD_LENGTH + ' characters.'; + state.error = formatMessage(holders.error, {chars: Constants.MIN_PASSWORD_LENGTH}); this.setState(state); return; } @@ -34,7 +53,7 @@ export default class PasswordResetForm extends React.Component { Client.resetPassword(data, function resetSuccess() { - this.setState({error: null, updateText: 'Your password has been updated successfully.'}); + this.setState({error: null, updateText: formatMessage(holders.update)}); }.bind(this), function resetFailure(err) { this.setState({error: err.message, updateText: null}); @@ -44,7 +63,15 @@ export default class PasswordResetForm extends React.Component { render() { var updateText = null; if (this.state.updateText) { - updateText = <div className='form-group'><br/><label className='control-label reset-form'>{this.state.updateText} Click <a href={'/' + this.props.teamName + '/login'}>here</a> to log in.</label></div>; + updateText = (<div className='form-group'><br/><label className='control-label reset-form'>{this.state.updateText} + <FormattedHTMLMessage + id='password_form.click' + defaultMessage='Click <a href={url}>here</a> to log in.' + values={{ + url: '/' + this.props.teamName + '/login' + }} + /> + </label></div>); } var error = null; @@ -57,19 +84,34 @@ export default class PasswordResetForm extends React.Component { formClass += ' has-error'; } + const {formatMessage} = this.props.intl; return ( <div className='col-sm-12'> <div className='signup-team__container'> - <h3>{'Password Reset'}</h3> + <h3> + <FormattedMessage + id='password_form.title' + defaultMessage='Password Reset' + /> + </h3> <form onSubmit={this.handlePasswordReset}> - <p>{'Enter a new password for your ' + this.props.teamDisplayName + ' ' + global.window.mm_config.SiteName + ' account.'}</p> + <p> + <FormattedMessage + id='password_form.enter' + defaultMessage='Enter a new password for your {teamDisplayName} {siteName} account.' + values={{ + teamDisplayName: this.props.teamDisplayName, + siteName: global.window.mm_config.SiteName + }} + /> + </p> <div className={formClass}> <input type='password' className='form-control' name='password' ref='password' - placeholder='Password' + placeholder={formatMessage(holders.pwd)} spellCheck='false' /> </div> @@ -78,7 +120,10 @@ export default class PasswordResetForm extends React.Component { type='submit' className='btn btn-primary' > - {'Change my password'} + <FormattedMessage + id='password_form.change' + defaultMessage='Change my password' + /> </button> {updateText} </form> @@ -95,8 +140,11 @@ PasswordResetForm.defaultProps = { data: '' }; PasswordResetForm.propTypes = { + intl: intlShape.isRequired, teamName: React.PropTypes.string, teamDisplayName: React.PropTypes.string, hash: React.PropTypes.string, data: React.PropTypes.string }; + +export default injectIntl(PasswordResetForm);
\ No newline at end of file |