More i18n work
This commit is contained in:
parent
3ef6f3c80b
commit
2ad4972115
16 changed files with 286 additions and 90 deletions
|
|
@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
|
||||||
import { Meteor } from 'meteor/meteor';
|
import { Meteor } from 'meteor/meteor';
|
||||||
import { Bert } from 'meteor/themeteorchef:bert';
|
import { Bert } from 'meteor/themeteorchef:bert';
|
||||||
import Icon from '../Icon/Icon';
|
import Icon from '../Icon/Icon';
|
||||||
|
import { translate, Trans } from 'react-i18next';
|
||||||
|
|
||||||
import './OAuthLoginButton.scss';
|
import './OAuthLoginButton.scss';
|
||||||
|
|
||||||
|
|
@ -31,9 +32,9 @@ const handleLogin = (service, callback) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
const serviceLabel = {
|
const serviceLabel = {
|
||||||
facebook: <span><Icon icon="facebook-official" /> Log In with Facebook</span>,
|
facebook: <span><Icon icon="facebook-official" /> <Trans parent="span">Log In with Facebook</Trans></span>,
|
||||||
github: <span><Icon icon="github" /> Log In with GitHub</span>,
|
github: <span><Icon icon="github" /> <Trans parent="span">Log In with GitHub</Trans></span>,
|
||||||
google: <span><Icon icon="google" /> Log In with Google</span>,
|
google: <span><Icon icon="google" /> <Trans parent="span">Iniciar sesión con Google</Trans></span>,
|
||||||
};
|
};
|
||||||
|
|
||||||
const OAuthLoginButton = ({ service, callback }) => (
|
const OAuthLoginButton = ({ service, callback }) => (
|
||||||
|
|
@ -57,4 +58,4 @@ OAuthLoginButton.propTypes = {
|
||||||
callback: PropTypes.func,
|
callback: PropTypes.func,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default OAuthLoginButton;
|
export default translate([], { wait: true })(OAuthLoginButton);
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@
|
||||||
background: #fff;
|
background: #fff;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: -19px;
|
bottom: -27px;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
34
imports/ui/components/ReSendEmail/ReSendEmail.js
Normal file
34
imports/ui/components/ReSendEmail/ReSendEmail.js
Normal file
|
|
@ -0,0 +1,34 @@
|
||||||
|
import React from 'react';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import { Grid, Alert, Button } from 'react-bootstrap';
|
||||||
|
import { t, Trans, translate, Interpolate } from 'react-i18next';
|
||||||
|
|
||||||
|
const handleResendVerificationEmail = (emailAddress, t) => {
|
||||||
|
Meteor.call('users.sendVerificationEmail', (error) => {
|
||||||
|
if (error) {
|
||||||
|
Bert.alert(error.reason, 'danger');
|
||||||
|
} else {
|
||||||
|
Bert.alert(t("checkVerificationEmail", {email: emailAddress}), 'success');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const ReSendEmail = props => (
|
||||||
|
<div>
|
||||||
|
{props.userId && !props.emailVerified ? <Alert className="verify-email text-center"><p><Interpolate i18nKey="verifyEmail" email={props.emailAddress}></Interpolate> <Button bsStyle="link" onClick={() => handleResendVerificationEmail(props.emailAddress, props.t)} href="#"><Trans parent="span">Reenviar email de verificación</Trans></Button></p></Alert> : ''}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
|
||||||
|
ReSendEmail.defaultProps = {
|
||||||
|
userId: '',
|
||||||
|
emailAddress: '',
|
||||||
|
};
|
||||||
|
|
||||||
|
ReSendEmail.propTypes = {
|
||||||
|
loading: PropTypes.bool.isRequired,
|
||||||
|
userId: PropTypes.string,
|
||||||
|
emailAddress: PropTypes.string,
|
||||||
|
emailVerified: PropTypes.bool.isRequired,
|
||||||
|
};
|
||||||
|
|
||||||
|
export default translate([], { wait: true })(ReSendEmail);
|
||||||
|
|
@ -28,6 +28,7 @@ import Footer from '../../components/Footer/Footer';
|
||||||
import Terms from '../../pages/Terms/Terms';
|
import Terms from '../../pages/Terms/Terms';
|
||||||
import Privacy from '../../pages/Privacy/Privacy';
|
import Privacy from '../../pages/Privacy/Privacy';
|
||||||
import License from '../../pages/License/License';
|
import License from '../../pages/License/License';
|
||||||
|
import ReSendEmail from '../../components/ReSendEmail/ReSendEmail';
|
||||||
// i18n
|
// i18n
|
||||||
import { I18nextProvider } from 'react-i18next';
|
import { I18nextProvider } from 'react-i18next';
|
||||||
import i18n from '/imports/startup/client/i18n';
|
import i18n from '/imports/startup/client/i18n';
|
||||||
|
|
@ -36,24 +37,12 @@ import i18n from '/imports/startup/client/i18n';
|
||||||
|
|
||||||
import './App.scss';
|
import './App.scss';
|
||||||
|
|
||||||
const handleResendVerificationEmail = (emailAddress) => {
|
|
||||||
Meteor.call('users.sendVerificationEmail', (error) => {
|
|
||||||
if (error) {
|
|
||||||
Bert.alert(error.reason, 'danger');
|
|
||||||
} else {
|
|
||||||
Bert.alert(`Check ${emailAddress} for a verification link!`, 'success');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const App = props => (
|
const App = props => (
|
||||||
<I18nextProvider i18n={i18n}>
|
<I18nextProvider i18n={i18n}>
|
||||||
<Router>
|
<Router>
|
||||||
{!props.loading ? <div className="App">
|
{!props.loading ? <div className="App">
|
||||||
<Navigation {...props} />
|
<Navigation {...props} />
|
||||||
{props.userId && !props.emailVerified ? <Alert className="verify-email text-center"><p>Hey friend! Can you <strong>verify your email address</strong> ({props.emailAddress}) for us? <Button bsStyle="link" onClick={() => handleResendVerificationEmail(props.emailAddress)} href="#">Re-send verification email</Button></p></Alert> : ''}
|
<ReSendEmail {...props} />
|
||||||
<Grid> {/* bsClass="previously-container-but-disabled" > */}
|
<Grid> {/* bsClass="previously-container-but-disabled" > */}
|
||||||
<Switch>
|
<Switch>
|
||||||
<Route exact name="index" path="/" component={Index} />
|
<Route exact name="index" path="/" component={Index} />
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,5 @@
|
||||||
|
@import '../../stylesheets/colors';
|
||||||
|
|
||||||
.carousel-item {
|
.carousel-item {
|
||||||
height: 65vh;
|
height: 65vh;
|
||||||
min-height: 300px;
|
min-height: 300px;
|
||||||
|
|
@ -134,5 +136,6 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.participe-btn {
|
.participe-btn {
|
||||||
background-color: #FD593A
|
background-color: $todos-palette1;
|
||||||
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -8,11 +8,12 @@ import { Bert } from 'meteor/themeteorchef:bert';
|
||||||
import OAuthLoginButtons from '../../components/OAuthLoginButtons/OAuthLoginButtons';
|
import OAuthLoginButtons from '../../components/OAuthLoginButtons/OAuthLoginButtons';
|
||||||
import AccountPageFooter from '../../components/AccountPageFooter/AccountPageFooter';
|
import AccountPageFooter from '../../components/AccountPageFooter/AccountPageFooter';
|
||||||
import validate from '../../../modules/validate';
|
import validate from '../../../modules/validate';
|
||||||
|
import { translate } from 'react-i18next';
|
||||||
|
|
||||||
class Login extends React.Component {
|
class Login extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
this.t = props.t;
|
||||||
this.handleSubmit = this.handleSubmit.bind(this);
|
this.handleSubmit = this.handleSubmit.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -31,11 +32,11 @@ class Login extends React.Component {
|
||||||
},
|
},
|
||||||
messages: {
|
messages: {
|
||||||
emailAddress: {
|
emailAddress: {
|
||||||
required: 'Need an email address here.',
|
required: this.t("Necesitamos un correo aquí."),
|
||||||
email: 'Is this email address correct?',
|
email: this.t("¿Es este correo correcto?"),
|
||||||
},
|
},
|
||||||
password: {
|
password: {
|
||||||
required: 'Need a password here.',
|
required: this.t("Necesitamos una contraseña aquí."),
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
submitHandler() { component.handleSubmit(); },
|
submitHandler() { component.handleSubmit(); },
|
||||||
|
|
@ -49,7 +50,7 @@ class Login extends React.Component {
|
||||||
if (error) {
|
if (error) {
|
||||||
Bert.alert(error.reason, 'danger');
|
Bert.alert(error.reason, 'danger');
|
||||||
} else {
|
} else {
|
||||||
Bert.alert('Welcome back!', 'success');
|
Bert.alert(this.t('Bienvenid@ de nuevo'), 'success');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
@ -58,21 +59,21 @@ class Login extends React.Component {
|
||||||
return (<div className="Login">
|
return (<div className="Login">
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={12} sm={6} md={5} lg={4}>
|
<Col xs={12} sm={6} md={5} lg={4}>
|
||||||
<h4 className="page-header">Log In</h4>
|
<h4 className="page-header">{this.t("Iniciar sesión")}</h4>
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={12}>
|
<Col xs={12}>
|
||||||
<OAuthLoginButtons
|
<OAuthLoginButtons
|
||||||
services={['google']}
|
services={['google']}
|
||||||
emailMessage={{
|
emailMessage={{
|
||||||
offset: 100,
|
offset: 100,
|
||||||
text: 'Log In with an Email Address',
|
text: this.t('o inicia sesión con un correo'),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
<form ref={form => (this.form = form)} onSubmit={event => event.preventDefault()}>
|
<form ref={form => (this.form = form)} onSubmit={event => event.preventDefault()}>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Email Address</ControlLabel>
|
<ControlLabel>{this.t("Correo electrónico")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="email"
|
type="email"
|
||||||
name="emailAddress"
|
name="emailAddress"
|
||||||
|
|
@ -82,8 +83,8 @@ class Login extends React.Component {
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel className="clearfix">
|
<ControlLabel className="clearfix">
|
||||||
<span className="pull-left">Password</span>
|
<span className="pull-left">{this.t("Contraseña")}</span>
|
||||||
<Link className="pull-right" to="/recover-password">Forgot password?</Link>
|
<Link className="pull-right" to="/recover-password">{this.t("¿Olvidaste tu contraseña?")}</Link>
|
||||||
</ControlLabel>
|
</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="password"
|
type="password"
|
||||||
|
|
@ -92,9 +93,9 @@ class Login extends React.Component {
|
||||||
className="form-control"
|
className="form-control"
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<Button type="submit" bsStyle="success">Log In</Button>
|
<Button type="submit" bsStyle="success">{this.t("Iniciar sesión")}</Button>
|
||||||
<AccountPageFooter>
|
<AccountPageFooter>
|
||||||
<p>{'Don\'t have an account?'} <Link to="/signup">Sign Up</Link>.</p>
|
<p>{this.t("¿No tienes una cuenta?")} <Link to="/signup">{this.t("Regístrate")}</Link>.</p>
|
||||||
</AccountPageFooter>
|
</AccountPageFooter>
|
||||||
</form>
|
</form>
|
||||||
</Col>
|
</Col>
|
||||||
|
|
@ -107,4 +108,4 @@ Login.propTypes = {
|
||||||
history: PropTypes.object.isRequired,
|
history: PropTypes.object.isRequired,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Login;
|
export default translate([], { wait: true })(Login);
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import Icon from '../../components/Icon/Icon';
|
import Icon from '../../components/Icon/Icon';
|
||||||
|
import { translate, Trans } from 'react-i18next';
|
||||||
|
|
||||||
import './Logout.scss';
|
import './Logout.scss';
|
||||||
|
|
||||||
|
|
@ -11,16 +12,11 @@ class Logout extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div className="Logout">
|
<div className="Logout">
|
||||||
<img
|
<h1><Trans parent="span">Gracias por Participar</Trans></h1>
|
||||||
src="https://s3-us-west-2.amazonaws.com/cleverbeagle-assets/graphics/email-icon.png"
|
<p><Trans parent="span">También puedes seguirnos en la web</Trans></p>
|
||||||
alt="Clever Beagle"
|
|
||||||
/>
|
|
||||||
<h1>Stay safe out there.</h1>
|
|
||||||
<p>{'Don\'t forget to like and follow Clever Beagle elsewhere on the web:'}</p>
|
|
||||||
<ul className="FollowUsElsewhere">
|
<ul className="FollowUsElsewhere">
|
||||||
<li><a href="https://facebook.com/cleverbeagle"><Icon icon="facebook-official" /></a></li>
|
<li><a href="https://twitter.com/TsContraElFuego"><Icon icon="twitter" /></a></li>
|
||||||
<li><a href="https://twitter.com/clvrbgl"><Icon icon="twitter" /></a></li>
|
<li><a href="https://github.com/comunes/todos-contra-el-fuego"><Icon icon="github" /></a></li>
|
||||||
<li><a href="https://github.com/cleverbeagle"><Icon icon="github" /></a></li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
@ -29,4 +25,4 @@ class Logout extends React.Component {
|
||||||
|
|
||||||
Logout.propTypes = {};
|
Logout.propTypes = {};
|
||||||
|
|
||||||
export default Logout;
|
export default translate([], { wait: true })(Logout);
|
||||||
|
|
|
||||||
|
|
@ -2,8 +2,8 @@
|
||||||
@import '../../stylesheets/colors';
|
@import '../../stylesheets/colors';
|
||||||
|
|
||||||
.Logout {
|
.Logout {
|
||||||
padding: 20px;
|
margin: 20px;
|
||||||
background: $cb-blue;
|
background: $todos-palette3;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
|
@ -19,7 +19,7 @@
|
||||||
|
|
||||||
p {
|
p {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
color: lighten($cb-blue, 25%);
|
color: lighten($todos-palette3, 25%);
|
||||||
}
|
}
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
|
|
|
||||||
|
|
@ -11,6 +11,7 @@ import { Bert } from 'meteor/themeteorchef:bert';
|
||||||
import { createContainer } from 'meteor/react-meteor-data';
|
import { createContainer } from 'meteor/react-meteor-data';
|
||||||
import InputHint from '../../components/InputHint/InputHint';
|
import InputHint from '../../components/InputHint/InputHint';
|
||||||
import validate from '../../../modules/validate';
|
import validate from '../../../modules/validate';
|
||||||
|
import { translate } from 'react-i18next';
|
||||||
|
|
||||||
import './Profile.scss';
|
import './Profile.scss';
|
||||||
|
|
||||||
|
|
@ -18,6 +19,7 @@ class Profile extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
|
||||||
|
this.t = this.props.t;
|
||||||
this.getUserType = this.getUserType.bind(this);
|
this.getUserType = this.getUserType.bind(this);
|
||||||
this.handleSubmit = this.handleSubmit.bind(this);
|
this.handleSubmit = this.handleSubmit.bind(this);
|
||||||
this.renderOAuthUser = this.renderOAuthUser.bind(this);
|
this.renderOAuthUser = this.renderOAuthUser.bind(this);
|
||||||
|
|
@ -31,14 +33,14 @@ class Profile extends React.Component {
|
||||||
validate(component.form, {
|
validate(component.form, {
|
||||||
rules: {
|
rules: {
|
||||||
firstName: {
|
firstName: {
|
||||||
required: true,
|
required: true
|
||||||
},
|
},
|
||||||
lastName: {
|
lastName: {
|
||||||
required: true,
|
required: true
|
||||||
},
|
},
|
||||||
emailAddress: {
|
emailAddress: {
|
||||||
required: true,
|
required: true,
|
||||||
email: true,
|
email: true
|
||||||
},
|
},
|
||||||
currentPassword: {
|
currentPassword: {
|
||||||
required() {
|
required() {
|
||||||
|
|
@ -55,20 +57,20 @@ class Profile extends React.Component {
|
||||||
},
|
},
|
||||||
messages: {
|
messages: {
|
||||||
firstName: {
|
firstName: {
|
||||||
required: 'What\'s your first name?',
|
required: this.t("¿Cuál es tu nombre?"),
|
||||||
},
|
},
|
||||||
lastName: {
|
lastName: {
|
||||||
required: 'What\'s your last name?',
|
required: this.t("¿Cuál es tu apellido?"),
|
||||||
},
|
},
|
||||||
emailAddress: {
|
emailAddress: {
|
||||||
required: 'Need an email address here.',
|
required: this.t("Necesitamos una contraseña aquí."),
|
||||||
email: 'Is this email address correct?',
|
email: this.t("¿Es correcto este correo?"),
|
||||||
},
|
},
|
||||||
currentPassword: {
|
currentPassword: {
|
||||||
required: 'Need your current password if changing.',
|
required: this.t("Necesito tu contraseña si la quieres cambiar."),
|
||||||
},
|
},
|
||||||
newPassword: {
|
newPassword: {
|
||||||
required: 'Need your new password if changing.',
|
required: this.t("Necesito tu nueva contraseña si la quieres cambiar."),
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
submitHandler() { component.handleSubmit(); },
|
submitHandler() { component.handleSubmit(); },
|
||||||
|
|
@ -97,7 +99,7 @@ class Profile extends React.Component {
|
||||||
if (error) {
|
if (error) {
|
||||||
Bert.alert(error.reason, 'danger');
|
Bert.alert(error.reason, 'danger');
|
||||||
} else {
|
} else {
|
||||||
Bert.alert('Profile updated!', 'success');
|
Bert.alert(this.t("¡Perfíl actualizado!"), 'success');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -127,7 +129,7 @@ class Profile extends React.Component {
|
||||||
github: 'https://github.com/settings/profile',
|
github: 'https://github.com/settings/profile',
|
||||||
}[service]}
|
}[service]}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
>Edit Profile on {_.capitalize(service)}</Button>
|
>{this.t("Editar perfíl en")} {_.capitalize(service)}</Button>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>) : <div />;
|
</div>) : <div />;
|
||||||
|
|
@ -138,7 +140,7 @@ class Profile extends React.Component {
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={6}>
|
<Col xs={6}>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>First Name</ControlLabel>
|
<ControlLabel>{this.t("Nombre")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
name="firstName"
|
name="firstName"
|
||||||
|
|
@ -150,7 +152,7 @@ class Profile extends React.Component {
|
||||||
</Col>
|
</Col>
|
||||||
<Col xs={6}>
|
<Col xs={6}>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Last Name</ControlLabel>
|
<ControlLabel>{this.t("Apellidos")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
name="lastName"
|
name="lastName"
|
||||||
|
|
@ -162,7 +164,7 @@ class Profile extends React.Component {
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Email Address</ControlLabel>
|
<ControlLabel>{this.t("Correo electrónico")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="email"
|
type="email"
|
||||||
name="emailAddress"
|
name="emailAddress"
|
||||||
|
|
@ -172,7 +174,7 @@ class Profile extends React.Component {
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Current Password</ControlLabel>
|
<ControlLabel>{this.t("Contraseña actual")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="password"
|
type="password"
|
||||||
name="currentPassword"
|
name="currentPassword"
|
||||||
|
|
@ -181,16 +183,16 @@ class Profile extends React.Component {
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>New Password</ControlLabel>
|
<ControlLabel>{this.t("Nueva contraseña")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="password"
|
type="password"
|
||||||
name="newPassword"
|
name="newPassword"
|
||||||
ref={newPassword => (this.newPassword = newPassword)}
|
ref={newPassword => (this.newPassword = newPassword)}
|
||||||
className="form-control"
|
className="form-control"
|
||||||
/>
|
/>
|
||||||
<InputHint>Use at least six characters.</InputHint>
|
<InputHint>{this.t("Usa al menos seis caracteres.")}</InputHint>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<Button type="submit" bsStyle="success">Save Profile</Button>
|
<Button type="submit" bsStyle="success">{this.t("Guardar perfíl")}</Button>
|
||||||
</div>) : <div />;
|
</div>) : <div />;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -206,7 +208,7 @@ class Profile extends React.Component {
|
||||||
return (<div className="Profile">
|
return (<div className="Profile">
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={12} sm={6} md={4}>
|
<Col xs={12} sm={6} md={4}>
|
||||||
<h4 className="page-header">Edit Profile</h4>
|
<h4 className="page-header">{this.t("Editar perfíl")}</h4>
|
||||||
<form ref={form => (this.form = form)} onSubmit={event => event.preventDefault()}>
|
<form ref={form => (this.form = form)} onSubmit={event => event.preventDefault()}>
|
||||||
{this.renderProfileForm(loading, user)}
|
{this.renderProfileForm(loading, user)}
|
||||||
</form>
|
</form>
|
||||||
|
|
@ -218,14 +220,14 @@ class Profile extends React.Component {
|
||||||
|
|
||||||
Profile.propTypes = {
|
Profile.propTypes = {
|
||||||
loading: PropTypes.bool.isRequired,
|
loading: PropTypes.bool.isRequired,
|
||||||
user: PropTypes.object.isRequired,
|
user: PropTypes.object.isRequired
|
||||||
};
|
};
|
||||||
|
|
||||||
export default createContainer(() => {
|
export default translate([], { wait: true })(createContainer(() => {
|
||||||
const subscription = Meteor.subscribe('users.editProfile');
|
const subscription = Meteor.subscribe('users.editProfile');
|
||||||
|
|
||||||
return {
|
return {
|
||||||
loading: !subscription.ready(),
|
loading: !subscription.ready(),
|
||||||
user: Meteor.user(),
|
user: Meteor.user()
|
||||||
};
|
};
|
||||||
}, Profile);
|
}, Profile));
|
||||||
|
|
|
||||||
|
|
@ -7,10 +7,12 @@ import { Accounts } from 'meteor/accounts-base';
|
||||||
import { Bert } from 'meteor/themeteorchef:bert';
|
import { Bert } from 'meteor/themeteorchef:bert';
|
||||||
import AccountPageFooter from '../../components/AccountPageFooter/AccountPageFooter';
|
import AccountPageFooter from '../../components/AccountPageFooter/AccountPageFooter';
|
||||||
import validate from '../../../modules/validate';
|
import validate from '../../../modules/validate';
|
||||||
|
import { translate } from 'react-i18next';
|
||||||
|
|
||||||
class RecoverPassword extends React.Component {
|
class RecoverPassword extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
this.t = props.t;
|
||||||
this.handleSubmit = this.handleSubmit.bind(this);
|
this.handleSubmit = this.handleSubmit.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -37,12 +39,13 @@ class RecoverPassword extends React.Component {
|
||||||
handleSubmit() {
|
handleSubmit() {
|
||||||
const { history } = this.props;
|
const { history } = this.props;
|
||||||
const email = this.emailAddress.value;
|
const email = this.emailAddress.value;
|
||||||
|
const t = this.props.t;
|
||||||
|
|
||||||
Accounts.forgotPassword({ email }, (error) => {
|
Accounts.forgotPassword({ email, t }, (error) => {
|
||||||
if (error) {
|
if (error) {
|
||||||
Bert.alert(error.reason, 'danger');
|
Bert.alert(error.reason, 'danger');
|
||||||
} else {
|
} else {
|
||||||
Bert.alert(`Check ${email} for a reset link!`, 'success');
|
Bert.alert(t("checkResetEmail", {email: email}), 'success');
|
||||||
history.push('/login');
|
history.push('/login');
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
@ -52,13 +55,13 @@ class RecoverPassword extends React.Component {
|
||||||
return (<div className="RecoverPassword">
|
return (<div className="RecoverPassword">
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={12} sm={6} md={5} lg={4}>
|
<Col xs={12} sm={6} md={5} lg={4}>
|
||||||
<h4 className="page-header">Recover Password</h4>
|
<h4 className="page-header">{this.t("Recupera tu contraseña")}</h4>
|
||||||
<Alert bsStyle="info">
|
<Alert bsStyle="info">
|
||||||
Enter your email address below to receive a link to reset your password.
|
{this.t("Introduce tu correo abajo para recibir un enlace para resetear tu contraseña.")}
|
||||||
</Alert>
|
</Alert>
|
||||||
<form ref={form => (this.form = form)} onSubmit={event => event.preventDefault()}>
|
<form ref={form => (this.form = form)} onSubmit={event => event.preventDefault()}>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Email Address</ControlLabel>
|
<ControlLabel>{this.t("Correo electrónico")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="email"
|
type="email"
|
||||||
name="emailAddress"
|
name="emailAddress"
|
||||||
|
|
@ -66,9 +69,9 @@ class RecoverPassword extends React.Component {
|
||||||
className="form-control"
|
className="form-control"
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<Button type="submit" bsStyle="success">Recover Password</Button>
|
<Button type="submit" bsStyle="success">{this.t("Recupera tu contraseña")}</Button>
|
||||||
<AccountPageFooter>
|
<AccountPageFooter>
|
||||||
<p>Remember your password? <Link to="/login">Log In</Link>.</p>
|
<p>{this.t("¿Recuerdas tu contraseña?")} <Link to="/login">{this.t("Iniciar sesión")}</Link>.</p>
|
||||||
</AccountPageFooter>
|
</AccountPageFooter>
|
||||||
</form>
|
</form>
|
||||||
</Col>
|
</Col>
|
||||||
|
|
@ -81,4 +84,4 @@ RecoverPassword.propTypes = {
|
||||||
history: PropTypes.object.isRequired,
|
history: PropTypes.object.isRequired,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default RecoverPassword;
|
export default translate([], { wait: true })(RecoverPassword);
|
||||||
|
|
|
||||||
|
|
@ -10,10 +10,14 @@ import OAuthLoginButtons from '../../components/OAuthLoginButtons/OAuthLoginButt
|
||||||
import InputHint from '../../components/InputHint/InputHint';
|
import InputHint from '../../components/InputHint/InputHint';
|
||||||
import AccountPageFooter from '../../components/AccountPageFooter/AccountPageFooter';
|
import AccountPageFooter from '../../components/AccountPageFooter/AccountPageFooter';
|
||||||
import validate from '../../../modules/validate';
|
import validate from '../../../modules/validate';
|
||||||
|
import Icon from '../../components/Icon/Icon';
|
||||||
|
import './Signup.scss';
|
||||||
|
import { translate } from 'react-i18next';
|
||||||
|
|
||||||
class Signup extends React.Component {
|
class Signup extends React.Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
this.t = this.props.t;
|
||||||
this.handleSubmit = this.handleSubmit.bind(this);
|
this.handleSubmit = this.handleSubmit.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -84,14 +88,21 @@ class Signup extends React.Component {
|
||||||
return (<div className="Signup">
|
return (<div className="Signup">
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={12} sm={6} md={5} lg={4}>
|
<Col xs={12} sm={6} md={5} lg={4}>
|
||||||
<h4 className="page-header">Sign Up</h4>
|
<h4 className="page-header">{this.t("Registrarse")}</h4>
|
||||||
<Row>
|
<Row>
|
||||||
|
<Col xs={12}>
|
||||||
|
<button
|
||||||
|
className={`btn btn-block btn-raised btn-primary OAuthLoginButtonDis OAuthLoginButton-telegram`}
|
||||||
|
type="button" onClick={() => handleLogin(service, callback)}>
|
||||||
|
<span><Icon icon="telegram" /> Usa nuestro bot de Telegram</span>
|
||||||
|
</button>
|
||||||
|
</Col>
|
||||||
<Col xs={12}>
|
<Col xs={12}>
|
||||||
<OAuthLoginButtons
|
<OAuthLoginButtons
|
||||||
services={['google']}
|
services={['telegram', 'google']}
|
||||||
emailMessage={{
|
emailMessage={{
|
||||||
offset: 97,
|
offset: 97,
|
||||||
text: 'Sign Up with an Email Address',
|
text: this.t('o regístrate con un correo'),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Col>
|
</Col>
|
||||||
|
|
@ -100,7 +111,7 @@ class Signup extends React.Component {
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={6}>
|
<Col xs={6}>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>First Name</ControlLabel>
|
<ControlLabel>{this.t("Nombre")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
name="firstName"
|
name="firstName"
|
||||||
|
|
@ -111,7 +122,7 @@ class Signup extends React.Component {
|
||||||
</Col>
|
</Col>
|
||||||
<Col xs={6}>
|
<Col xs={6}>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Last Name</ControlLabel>
|
<ControlLabel>{this.t("Apellidos")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
name="lastName"
|
name="lastName"
|
||||||
|
|
@ -122,7 +133,7 @@ class Signup extends React.Component {
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Email Address</ControlLabel>
|
<ControlLabel>{this.t("Correo electrónico")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="email"
|
type="email"
|
||||||
name="emailAddress"
|
name="emailAddress"
|
||||||
|
|
@ -131,18 +142,18 @@ class Signup extends React.Component {
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<FormGroup>
|
<FormGroup>
|
||||||
<ControlLabel>Password</ControlLabel>
|
<ControlLabel>{this.t("Contraseña")}</ControlLabel>
|
||||||
<input
|
<input
|
||||||
type="password"
|
type="password"
|
||||||
name="password"
|
name="password"
|
||||||
ref={password => (this.password = password)}
|
ref={password => (this.password = password)}
|
||||||
className="form-control"
|
className="form-control"
|
||||||
/>
|
/>
|
||||||
<InputHint>Use at least six characters.</InputHint>
|
<InputHint>{this.t("Usa al menos seis caracteres.")}</InputHint>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
<Button type="submit" bsStyle="success">Sign Up</Button>
|
<Button type="submit" bsStyle="success">{this.t("Registrarse")}</Button>
|
||||||
<AccountPageFooter>
|
<AccountPageFooter>
|
||||||
<p>Already have an account? <Link to="/login">Log In</Link>.</p>
|
<p>{this.t("¿Ya tienes un cuenta?")} <Link to="/login">{this.t("Iniciar sesión")}</Link>.</p>
|
||||||
</AccountPageFooter>
|
</AccountPageFooter>
|
||||||
</form>
|
</form>
|
||||||
</Col>
|
</Col>
|
||||||
|
|
@ -155,4 +166,4 @@ Signup.propTypes = {
|
||||||
history: PropTypes.object.isRequired,
|
history: PropTypes.object.isRequired,
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Signup;
|
export default translate([], { wait: true })(Signup)
|
||||||
|
|
|
||||||
3
imports/ui/pages/Signup/Signup.scss
Normal file
3
imports/ui/pages/Signup/Signup.scss
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
.OAuthLoginButton-telegram {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
@ -23,3 +23,21 @@ $todos-back1: #AC9393;
|
||||||
$todos-back2: #FFFFFF;
|
$todos-back2: #FFFFFF;
|
||||||
$todos-font1: #280B0B;
|
$todos-font1: #280B0B;
|
||||||
$todos-font2: #501616;
|
$todos-font2: #501616;
|
||||||
|
|
||||||
|
$todos-palette1a: #5A7636;
|
||||||
|
$todos-palette2a: #462F13;
|
||||||
|
$todos-palette3a: #281D08;
|
||||||
|
$todos-palette4a: #021704;
|
||||||
|
$todos-palette5a: #342F2C;
|
||||||
|
|
||||||
|
$todos-palette1b: #0D2E0E;
|
||||||
|
$todos-palette2b: #425C74;
|
||||||
|
$todos-palette3b: #70564B;
|
||||||
|
$todos-palette4b: #D86A25;
|
||||||
|
$todos-palette5b: #28221D;
|
||||||
|
|
||||||
|
$todos-palette1: $todos-palette1b;
|
||||||
|
$todos-palette2: $todos-palette2b;
|
||||||
|
$todos-palette3: $todos-palette3b;
|
||||||
|
$todos-palette4: $todos-palette4b;
|
||||||
|
$todos-palette5: $todos-palette5b;
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,7 @@
|
||||||
a, a:hover {
|
a, a:hover {
|
||||||
color: $todos-font2;
|
color: $todos-palette5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-dark {
|
||||||
|
background-color: $todos-palette1 !important;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -12,5 +12,70 @@
|
||||||
"Licencia": "License",
|
"Licencia": "License",
|
||||||
"Cerrar sesión": "Logout",
|
"Cerrar sesión": "Logout",
|
||||||
"Registrarse": "Sign Up",
|
"Registrarse": "Sign Up",
|
||||||
"Iniciar sesión": "Login"
|
"Iniciar sesión": "Login",
|
||||||
|
"o regístrate con un correo": "or Sign Up with an Email Address",
|
||||||
|
"o inicia sesión con un correo":
|
||||||
|
"or Log In with an Email Address",
|
||||||
|
"Nombre":
|
||||||
|
"First Name",
|
||||||
|
"Apellidos":
|
||||||
|
"Last Name",
|
||||||
|
"Correo electrónico":
|
||||||
|
"Email Address",
|
||||||
|
"Contraseña":
|
||||||
|
"Password",
|
||||||
|
"¿Ya tienes un cuenta?":
|
||||||
|
"Already have an account?",
|
||||||
|
"Usa al menos seis caracteres.":
|
||||||
|
"Use at least six characters.",
|
||||||
|
"Iniciar sesión con Google":
|
||||||
|
"Log In with Google",
|
||||||
|
"¿Olvidaste tu contraseña":
|
||||||
|
"Forgot password?",
|
||||||
|
"¿No tienes una cuenta?":
|
||||||
|
"Don't have an account?",
|
||||||
|
"Introduce tu correo abajo para recibir un enlace para resetear tu contraseña.":
|
||||||
|
"Enter your email address below to receive a link to reset your password.",
|
||||||
|
"Recupera tu contraseña":
|
||||||
|
"Recover Password",
|
||||||
|
"¿Recuerdas tu contraseña?":
|
||||||
|
"Remember your password?",
|
||||||
|
"Necesitamos un correo aquí.":
|
||||||
|
"Need an email address here.",
|
||||||
|
"¿Es este correo correcto?":
|
||||||
|
"Is this email address correct?",
|
||||||
|
"Necesitamos una contraseña aquí.":
|
||||||
|
"Need a password here.",
|
||||||
|
"Bienvenid@ de nuevo":
|
||||||
|
"Welcome back!",
|
||||||
|
"Guardar perfíl":
|
||||||
|
"Save profile",
|
||||||
|
"Contraseña actual":
|
||||||
|
"Current Password",
|
||||||
|
"Nueva contraseña":
|
||||||
|
"New Password",
|
||||||
|
"Editar perfíl":
|
||||||
|
"Edit Profile",
|
||||||
|
"Editar perfíl en":
|
||||||
|
"Edit Profile on",
|
||||||
|
"¡Perfíl actualizado!":
|
||||||
|
"Profile updated!",
|
||||||
|
"¿Cuál es tu nombre?":
|
||||||
|
"What's your first name?",
|
||||||
|
"¿Cuál es tu apellido?":
|
||||||
|
"What's your lastName name?",
|
||||||
|
"Necesito tu contraseña si la quieres cambiar.":
|
||||||
|
"Need your current password if changing.",
|
||||||
|
"Necesito tu nueva contraseña si la quieres cambiar.":
|
||||||
|
"Need your new password if changing.",
|
||||||
|
"¿Es correcto este correo?":
|
||||||
|
"Is this email address correct?",
|
||||||
|
"verifyEmail":
|
||||||
|
"Hey friend! Can you verify your email address ({{email}}) for us?",
|
||||||
|
"Reenviar email de verificación":
|
||||||
|
"Re-send verification email",
|
||||||
|
"checkVerificationEmail":
|
||||||
|
"Check {{email}} for a verification link!",
|
||||||
|
"checkResetEmail":
|
||||||
|
"Check ${email} for a reset link!"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -12,5 +12,71 @@
|
||||||
"Licencia": "Licencia",
|
"Licencia": "Licencia",
|
||||||
"Cerrar sesión": "Cerrar sesión",
|
"Cerrar sesión": "Cerrar sesión",
|
||||||
"Registrarse": "Registrarse",
|
"Registrarse": "Registrarse",
|
||||||
"Iniciar sesión": "Iniciar sesión"
|
"Iniciar sesión": "Iniciar sesión",
|
||||||
|
"o regístrate con un correo":
|
||||||
|
"o regístrate con un correo",
|
||||||
|
"o inicia sesión con un correo":
|
||||||
|
"o inicia sesión con un correo",
|
||||||
|
"Nombre":
|
||||||
|
"Nombre",
|
||||||
|
"Apellidos":
|
||||||
|
"Apellidos",
|
||||||
|
"Correo electrónico":
|
||||||
|
"Correo electrónico",
|
||||||
|
"Contraseña":
|
||||||
|
"Contraseña",
|
||||||
|
"¿Ya tienes un cuenta?":
|
||||||
|
"¿Ya tienes un cuenta?",
|
||||||
|
"Usa al menos seis caracteres.":
|
||||||
|
"Usa al menos seis caracteres.",
|
||||||
|
"Iniciar sesión con Google":
|
||||||
|
"Iniciar sesión con Google",
|
||||||
|
"¿Olvidaste tu contraseña":
|
||||||
|
"¿Olvidaste tu contraseña",
|
||||||
|
"¿No tienes una cuenta?":
|
||||||
|
"¿No tienes una cuenta?",
|
||||||
|
"Introduce tu correo abajo para recibir un enlace para resetear tu contraseña.":
|
||||||
|
"Introduce tu correo abajo para recibir un enlace para resetear tu contraseña.",
|
||||||
|
"Recupera tu contraseña":
|
||||||
|
"Recupera tu contraseña",
|
||||||
|
"¿Recuerdas tu contraseña?":
|
||||||
|
"¿Recuerdas tu contraseña?",
|
||||||
|
"Necesitamos un correo aquí.":
|
||||||
|
"Necesitamos un correo aquí.",
|
||||||
|
"¿Es este correo correcto?":
|
||||||
|
"¿Es este correo correcto?",
|
||||||
|
"Necesitamos una contraseña aquí.":
|
||||||
|
"Necesitamos una contraseña aquí.",
|
||||||
|
"Bienvenid@ de nuevo":
|
||||||
|
"Bienvenid@ de nuevo",
|
||||||
|
"Guardar perfíl":
|
||||||
|
"Guardar perfíl",
|
||||||
|
"Contraseña actual":
|
||||||
|
"Contraseña actual",
|
||||||
|
"Nueva contraseña":
|
||||||
|
"Nueva contraseña",
|
||||||
|
"Editar perfíl":
|
||||||
|
"Editar perfíl",
|
||||||
|
"Editar perfíl en":
|
||||||
|
"Editar perfíl en",
|
||||||
|
"¡Perfíl actualizado!":
|
||||||
|
"¡Perfíl actualizado!",
|
||||||
|
"¿Cuál es tu nombre?":
|
||||||
|
"¿Cuál es tu nombre?",
|
||||||
|
"¿Cuál es tu apellido?":
|
||||||
|
"¿Cuál es tu apellido?",
|
||||||
|
"Necesito tu contraseña si la quieres cambiar.":
|
||||||
|
"Necesito tu contraseña si la quieres cambiar.",
|
||||||
|
"Necesito tu nueva contraseña si la quieres cambiar.":
|
||||||
|
"Necesito tu nueva contraseña si la quieres cambiar.",
|
||||||
|
"¿Es correcto este correo?":
|
||||||
|
"¿Es correcto este correo?",
|
||||||
|
"verifyEmail":
|
||||||
|
"¡Ey! ¿Nos puedes verificar tu correo electrónico ({{email}})?",
|
||||||
|
"Reenviar email de verificación":
|
||||||
|
"Reenviar email de verificación",
|
||||||
|
"checkVerificationEmail":
|
||||||
|
"¡Comprueba en tu correo {{email}} el enlace de verificación!",
|
||||||
|
"checkResetEmail":
|
||||||
|
"¡Comprueba en tu correo {{email}} el enlace de reseteo!"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue