diff --git a/client/modules/User/components/ResetPasswordForm.jsx b/client/modules/User/components/ResetPasswordForm.jsx
index df96bd79..87155f43 100644
--- a/client/modules/User/components/ResetPasswordForm.jsx
+++ b/client/modules/User/components/ResetPasswordForm.jsx
@@ -1,20 +1,20 @@
import PropTypes from 'prop-types';
import React from 'react';
-
+import { withTranslation } from 'react-i18next';
import { domOnlyProps } from '../../../utils/reduxFormUtils';
import Button from '../../../common/Button';
function ResetPasswordForm(props) {
const {
- fields: { email }, handleSubmit, submitting, invalid, pristine
+ fields: { email }, handleSubmit, submitting, invalid, pristine, t
} = props;
return (
);
@@ -41,7 +41,8 @@ ResetPasswordForm.propTypes = {
pristine: PropTypes.bool,
user: PropTypes.shape({
resetPasswordInitiate: PropTypes.bool
- }).isRequired
+ }).isRequired,
+ t: PropTypes.func.isRequired
};
ResetPasswordForm.defaultProps = {
@@ -50,4 +51,4 @@ ResetPasswordForm.defaultProps = {
invalid: false
};
-export default ResetPasswordForm;
+export default withTranslation()(ResetPasswordForm);
diff --git a/client/modules/User/pages/ResetPasswordView.jsx b/client/modules/User/pages/ResetPasswordView.jsx
index 8ff7dac1..46d0b517 100644
--- a/client/modules/User/pages/ResetPasswordView.jsx
+++ b/client/modules/User/pages/ResetPasswordView.jsx
@@ -6,6 +6,7 @@ import classNames from 'classnames';
import { bindActionCreators } from 'redux';
import { reduxForm } from 'redux-form';
import { Helmet } from 'react-helmet';
+import { withTranslation } from 'react-i18next';
import * as UserActions from '../actions';
import ResetPasswordForm from '../components/ResetPasswordForm';
import { validateResetPassword } from '../../../utils/reduxFormUtils';
@@ -23,19 +24,18 @@ function ResetPasswordView(props) {
- p5.js Web Editor | Reset Password
+ {props.t('ResetPasswordView.Title')}
-
Reset Your Password
+
{props.t('ResetPasswordView.Reset')}
- Your password reset email should arrive shortly. If you don't see it, check
- in your spam folder as sometimes it can end up there.
+ {props.t('ResetPasswordView.Submitted')}
- Log In
- or
- Sign Up
+ {props.t('ResetPasswordView.Login')}
+ {props.t('ResetPasswordView.LoginOr')}
+ {props.t('ResetPasswordView.SignUp')}
@@ -48,6 +48,7 @@ ResetPasswordView.propTypes = {
user: PropTypes.shape({
resetPasswordInitiate: PropTypes.bool
}).isRequired,
+ t: PropTypes.func.isRequired
};
function mapStateToProps(state) {
@@ -60,8 +61,8 @@ function mapDispatchToProps(dispatch) {
return bindActionCreators(UserActions, dispatch);
}
-export default reduxForm({
+export default withTranslation()(reduxForm({
form: 'reset-password',
fields: ['email'],
validate: validateResetPassword
-}, mapStateToProps, mapDispatchToProps)(ResetPasswordView);
+}, mapStateToProps, mapDispatchToProps)(ResetPasswordView));
diff --git a/client/utils/reduxFormUtils.js b/client/utils/reduxFormUtils.js
index 8ff4b0a9..27d23a9d 100644
--- a/client/utils/reduxFormUtils.js
+++ b/client/utils/reduxFormUtils.js
@@ -1,4 +1,5 @@
/* eslint-disable */
+import i18n from 'i18next';
export const domOnlyProps = ({
initialValue,
autofill,
@@ -20,19 +21,19 @@ const EMAIL_REGEX = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))
function validateNameEmail(formProps, errors) {
if (!formProps.username) {
- errors.username = 'Please enter a username.';
+ errors.username = i18n.t('ReduxFormUtils.errorEmptyUsername');
} else if (!formProps.username.match(/^.{1,20}$/)) {
- errors.username = 'Username must be less than 20 characters.';
+ errors.username = i18n.t('ReduxFormUtils.errorLongUsername');
} else if (!formProps.username.match(/^[a-zA-Z0-9._-]{1,20}$/)) {
- errors.username = 'Username must only consist of numbers, letters, periods, dashes, and underscores.';
+ errors.username = i18n.t('ReduxFormUtils.errorValidUsername');
}
if (!formProps.email) {
- errors.email = 'Please enter an email.';
+ errors.email = i18n.t('ReduxFormUtils.errorEmptyEmail');
} else if (
// eslint-disable-next-line max-len
!formProps.email.match(EMAIL_REGEX)) {
- errors.email = 'Please enter a valid email address.';
+ errors.email = i18n.t('ReduxFormUtils.errorInvalidEmail');
}
}
@@ -42,10 +43,10 @@ export function validateSettings(formProps) {
validateNameEmail(formProps, errors);
if (formProps.currentPassword && !formProps.newPassword) {
- errors.newPassword = 'Please enter a new password or leave the current password empty.';
+ errors.newPassword = i18n.t('ReduxFormUtils.errorNewPassword');
}
if (formProps.newPassword && formProps.newPassword.length < 6) {
- errors.newPassword = 'Password must be at least 6 characters';
+ errors.newPassword = i18n.t('ReduxFormUtils.errorShortPassword');
}
return errors;
}
@@ -53,10 +54,10 @@ export function validateSettings(formProps) {
export function validateLogin(formProps) {
const errors = {};
if (!formProps.email) {
- errors.email = 'Please enter an email';
+ errors.email = i18n.t('ReduxFormUtils.errorEmptyEmail');
}
if (!formProps.password) {
- errors.password = 'Please enter a password';
+ errors.password = i18n.t('ReduxFormUtils.errorEmptyPassword');
}
return errors;
}
@@ -67,17 +68,17 @@ export function validateSignup(formProps) {
validateNameEmail(formProps, errors);
if (!formProps.password) {
- errors.password = 'Please enter a password';
+ errors.password = i18n.t('ReduxFormUtils.errorEmptyPassword');
}
if (formProps.password && formProps.password.length < 6) {
- errors.password = 'Password must be at least 6 characters';
+ errors.password = i18n.t('ReduxFormUtils.errorShortPassword');
}
if (!formProps.confirmPassword) {
- errors.confirmPassword = 'Please enter a password confirmation';
+ errors.confirmPassword = i18n.t('ReduxFormUtils.errorConfirmPassword');
}
if (formProps.password !== formProps.confirmPassword && formProps.confirmPassword) {
- errors.confirmPassword = 'Passwords must match';
+ errors.confirmPassword = i18n.t('ReduxFormUtils.errorPasswordMismatch');
}
return errors;
@@ -85,11 +86,11 @@ export function validateSignup(formProps) {
export function validateResetPassword(formProps) {
const errors = {};
if (!formProps.email) {
- errors.email = 'Please enter an email.';
+ errors.email = i18n.t('ReduxFormUtils.errorEmptyEmail');
} else if (
// eslint-disable-next-line max-len
!formProps.email.match(EMAIL_REGEX)) {
- errors.email = 'Please enter a valid email address.';
+ errors.email = i18n.t('ReduxFormUtils.errorInvalidEmail');
}
return errors;
}
diff --git a/translations/locales/en-US/translations.json b/translations/locales/en-US/translations.json
index 652eece4..aa8638c2 100644
--- a/translations/locales/en-US/translations.json
+++ b/translations/locales/en-US/translations.json
@@ -183,21 +183,20 @@
"Error": "Error",
"Save": "Save",
"p5logoARIA": "p5.js Logo"
-
},
"IDEView": {
"SubmitFeedback": "Submit Feedback"
},
"NewFileModal": {
"Title": "Create File",
- "CloseButtonARIA": "Close New File Modal",
+ "CloseButtonARIA": "Close New File Modal",
"EnterName": "Please enter a name",
"InvalidType": "Invalid file type. Valid extensions are .js, .css, .json, .txt, .csv, .tsv, .frag, and .vert."
},
"NewFileForm": {
- "AddFileSubmit": "Add File",
+ "AddFileSubmit": "Add File",
"Placeholder": "Name"
-},
+ },
"NewFolderModal": {
"Title": "Create Folder",
"CloseButtonARIA": "Close New Folder Modal",
@@ -208,5 +207,30 @@
"NewFolderForm": {
"AddFolderSubmit": "Add Folder",
"Placeholder": "Name"
+ },
+ "ResetPasswordForm": {
+ "Email": "Email used for registration",
+ "EmailARIA": "email",
+ "Submit": "Send Password Reset Email"
+ },
+ "ResetPasswordView": {
+ "Title": "p5.js Web Editor | Reset Password",
+ "Reset": "Reset Your Password",
+ "Submitted": "Your password reset email should arrive shortly. If you don't see it, check\n in your spam folder as sometimes it can end up there.",
+ "Login": "Log In",
+ "LoginOr": "or",
+ "SignUp": "Sign Up"
+ },
+ "ReduxFormUtils": {
+ "errorInvalidEmail": "Please enter a valid email address",
+ "errorEmptyEmail": "Please enter an email",
+ "errorPasswordMismatch": "Passwords must match",
+ "errorEmptyPassword": "Please enter a password",
+ "errorShortPassword": "Password must be at least 6 characters",
+ "errorConfirmPassword": "Please enter a password confirmation",
+ "errorNewPassword": "Please enter a new password or leave the current password empty.",
+ "errorEmptyUsername": "Please enter a username.",
+ "errorLongUsername": "Username must be less than 20 characters.",
+ "errorValidUsername": "Username must only consist of numbers, letters, periods, dashes, and underscores."
}
}
diff --git a/translations/locales/es-419/translations.json b/translations/locales/es-419/translations.json
index 5f3efaf7..672dccb9 100644
--- a/translations/locales/es-419/translations.json
+++ b/translations/locales/es-419/translations.json
@@ -188,8 +188,8 @@
"SubmitFeedback": "Enviar retroalimentación"
},
"NewFileModal": {
- "Title": "Crear Archivo",
- "CloseButtonARIA": "Cerrar diálogo de crear archivo",
+ "Title": "Crear Archivo",
+ "CloseButtonARIA": "Cerrar diálogo de crear archivo",
"EnterName": "Por favor introduce un nombre",
"InvalidType": "Tipo de archivo inválido. Las extensiones válidas son .js, .css, .json, .txt, .csv, .tsv, .frag y .vert."
},
@@ -198,18 +198,42 @@
"Placeholder": "Nombre"
},
"NewFolderModal": {
- "Title": "Crear Directorio",
- "CloseButtonARIA": "Cerrar Diálogo de Nuevo Directorio",
- "EnterName": "Por favor introduce un nombre",
- "EmptyName": " El nombre del directorio no debe contener solo espacios vacíos",
- "InvalidExtension": "El nombre del directorio no debe contener una extensión"
-},
+ "Title": "Crear Directorio",
+ "CloseButtonARIA": "Cerrar Diálogo de Nuevo Directorio",
+ "EnterName": "Por favor introduce un nombre",
+ "EmptyName": " El nombre del directorio no debe contener solo espacios vacíos",
+ "InvalidExtension": "El nombre del directorio no debe contener una extensión"
+ },
"NewFolderForm": {
"AddFolderSubmit": "Agregar Directorio",
"Placeholder": "Nombre"
+ },
+ "ResetPasswordForm": {
+ "Email": "Correo electrónico usado al registrarse",
+ "EmailARIA": "correo electrónico",
+ "Submit": "Enviar correo para regenerar contraseña"
+ },
+ "ResetPasswordView": {
+ "Title": "Editor Web p5.js | Regenerar Contraseña",
+ "Reset": "Regenerar Contraseña",
+ "Submitted": "Your password reset email should arrive shortly. If you don't see it, check\n in your spam folder as sometimes it can end up there.",
+ "Login": "Ingresa",
+ "LoginOr": "o",
+ "SignUp": "Registráte"
+ },
+ "ReduxFormUtils": {
+ "errorInvalidEmail": "Por favor introduce un correo electrónico válido",
+ "errorEmptyEmail": "Por favor introduce un correo electrónico",
+ "errorPasswordMismatch": "Las contraseñas deben coincidir",
+ "errorEmptyPassword": "Por favor introduce una contraseña",
+ "errorShortPassword": "La contraseña debe tener al menos 6 caracteres",
+ "errorConfirmPassword": "Por favor confirma una contraseña",
+ "errorNewPassword": "Por favor introduce una nueva contraseña o deja la actual contraseña vacía",
+ "errorEmptyUsername": "Por favor introduce tu identificación",
+ "errorLongUsername": "La identificación debe ser menor a 20 caracteres.",
+ "errorValidUsername": "La identificación debe consistir solamente de números, letras, puntos, guiones y guiones bajos."
+
}
}
-
-