add t9n support

README.md

@@ -488,12 +488,27 @@ This functionality is not implemented yet, You can [help](https://github.com/roy
 #### Edit Fields
 This functionality is not implemented yet, You can [help](https://github.com/royGil/accounts-react/issues/4)
 
+<a name='Language' />
+
+### Translation
+
+Configuring the language of the texts to be used by the forms is done via the `AccountsReact.configure` function.
+
+
+```javascript
+import { AccountsReact } from 'meteor/meteoreact:accounts'
+AccountsReact.configure({
+  language: 'de'
+})
+```
+
+The supported languages are those defined in the [meteor-accounts-t9n](https://github.com/softwarerero/meteor-accounts-t9n) package.
 
 <a name='Texts' />
 
 ### Texts
 
-Configuring the text to be used by the forms is done via the `AccountsReact.configure` function.
+In addition to configuring the language for texts to be used by the forms, they can also be configured independently via the `AccountsReact.configure` function.
 
 The default configuration object contains a `texts` property which you can view [here](https://github.com/royGil/accounts-react/blob/master/lib/AccountsReact.js#L206)
 

__tests__/_client/forms/baseForm.test.js

@@ -2,6 +2,7 @@ import React              from 'react'
 import { shallow, mount } from 'enzyme'
 import { expect }         from 'chai'
 import sinon              from 'sinon'
+import { T9n }            from 'meteor-accounts-t9n'
 import BaseForm           from '../../../lib/AccountsReactComponent/baseForm'
 import AccountsReact      from '../../../lib/AccountsReact'
 
@@ -40,6 +41,7 @@ describe('<BaseForm />', () => {
   })
 
   it('should not render the title of the current state if not defined', () => {
+    props.defaults.translations.title[props.currentState] = '' // remove translation for the title
     props.defaults.texts.title[props.currentState] = '' // remove text for the title
     const wrapper = mount(<BaseForm {...props} />)
 

lib/AccountsReact.js

@@ -1,9 +1,10 @@
 import { Meteor } from 'meteor/meteor'
 import { Accounts } from 'meteor/accounts-base'
+import { T9n } from 'meteor-accounts-t9n'
+import { setLanguage } from './t9n'
 import regExp from './utils/regExp'
 import merge from './utils/deepmerge'
 import './AccountsReactComponent/methods'
-
 class AccountsReact_ {
   constructor () {
     this._init = false
@@ -38,6 +39,7 @@ class AccountsReact_ {
       showResendVerificationLink: false,
       showLabels: true,
       showPlaceholders: true,
+      language: 'en',
 
       /* -----------------------------
             Client Side Validation
@@ -88,20 +90,20 @@ class AccountsReact_ {
         signIn: [
           {
             _id: 'username',
-            displayName: 'Username',
-            placeholder: 'Enter your username'
+            displayName: 'username', // 'Username',
+            placeholder: 'enterUsername', // 'Enter your username'
           },
           {
             _id: 'email',
-            displayName: 'Email',
-            placeholder: 'Enter your email',
+            displayName: 'email', // 'Email',
+            placeholder: 'enterEmail', // 'Enter your email',
             re: regExp.Email
           },
           {
             _id: 'password',
-            displayName: 'Password',
+            displayName: 'password', // 'Password',
             type: 'password',
-            placeholder: 'Enter your password',
+            placeholder: 'enterPassword', // 'Enter your password',
             autocomplete: 'current-password'
           }
         ],
@@ -111,36 +113,36 @@ class AccountsReact_ {
         signUp: [
           {
             _id: 'username',
-            displayName: 'Username',
-            placeholder:'Enter your username',
+            displayName: 'username', // 'Username',
+            placeholder: 'enterUsername', // 'Enter your username',
             minLength: 4,
             maxLength: 22,
             re: regExp.Username,
-            errStr: 'Username must be between 4 and 22 characters',
+            errStr: 'error.accounts.user_validation_failed', // 'Username must be between 4 and 22 characters',
           },
           {
             _id: 'email',
-            displayName: 'Email',
-            placeholder: 'Enter your email',
+            displayName: 'email', // 'Email',
+            placeholder: 'enterEmail', // 'Enter your email',
             re: regExp.Email,
-            errStr: 'Please enter a valid email'
+            errStr: 'error.accounts.incorrect_email', // 'Please enter a valid email'
           },
           {
             _id: 'password',
-            displayName: 'Password',
+            displayName: 'password', // 'Password',
             type: 'password',
-            placeholder: 'Enter your password',
+            placeholder: 'enterPassword', // 'Enter your password',
             minLength: 6,
             maxLength: 32,
-            errStr: 'Please enter a strong password between 6 and 32 characters',
+            errStr: 'error.accounts.incorrect_password', // 'Please enter a strong password between 6 and 32 characters',
             autocomplete: 'new-password'
           },
           {
             _id: 'confirmPassword',
-            displayName: 'Confirm password',
+            displayName: 'passwordAgain', // 'Confirm password',
             type: 'password',
-            placeholder: 'Re-enter your password',
-            errStr: 'Password doesn\'t match',
+            placeholder: 'passwordAgain', // 'Re-enter your password',
+            errStr: 'error.accounts.incorrect_password', // 'Password doesn\'t match',
             exclude: true,
             autocomplete: 'new-password',
             func: (fields, fieldObj, value, model, errorsArray) => {
@@ -169,10 +171,10 @@ class AccountsReact_ {
         forgotPwd: [
           {
             _id: 'email',
-            displayName: 'Email',
-            placeholder: 'Enter your email',
+            displayName: 'email', // 'Email',
+            placeholder: 'enterEmail', // 'Enter your email',
             re: regExp.Email,
-            errStr: 'Please enter a valid email'
+            errStr: 'error.accounts.email_doesnt_match_the_criteria', // 'Please enter a valid email'
           }
         ],
 
@@ -181,19 +183,19 @@ class AccountsReact_ {
         changePwd: [
           {
             _id: 'currentPassword',
-            displayName: 'Current password',
+            displayName: 'currentPassword', // 'Current password',
             type: 'password',
-            placeholder: 'Enter your current password',
+            placeholder: 'enterPassword', // 'Enter your current password',
             autocomplete: 'current-password'
           },
           {
             _id: 'password',
-            displayName: 'Password',
+            displayName: 'password', // 'Password',
             type: 'password',
-            placeholder: 'Enter a new password',
+            placeholder: 'enterNewPassword', // 'Enter a new password',
             minLength: 6,
             maxLength: 32,
-            errStr: 'Please enter a strong password between 6 and 32 characters',
+            errStr: 'error.accounts.incorrect_password', // 'Please enter a strong password between 6 and 32 characters',
             autocomplete: 'new-password'
           }
         ],
@@ -203,9 +205,9 @@ class AccountsReact_ {
         resetPwd: [
           {
             _id: 'password',
-            displayName: 'New password',
+            displayName: 'newPassword', //'New password',
             type: 'password',
-            placeholder: 'Enter a new password',
+            placeholder: 'enterNewPassword', // 'Enter a new password',
             autocomplete: 'new-password'
           }
         ],
@@ -215,86 +217,140 @@ class AccountsReact_ {
         resendVerification: [
           {
             _id: 'email',
-            displayName: 'Email',
-            placeholder: 'Enter your email',
+            displayName: 'email', // 'Email',
+            placeholder: 'enterEmail',
             re: regExp.Email,
-            errStr: 'Please enter a valid email'
+            errStr: 'error.accounts.email_doesnt_match_the_criteria', // 'Please enter a valid email'
           }
         ],
 
         /* Enroll Account */
         enrollAccount: [
           {
             _id: 'password',
-            displayName: 'Password',
+            displayName: 'password', // 'Password',
             type: 'password',
-            placeholder: 'Enter your password',
+            placeholder: 'enterPassword', // 'Enter your password',
             minLength: 6,
             maxLength: 32,
-            errStr: 'Please enter a strong password between 6 and 32 characters',
+            errStr: 'error.accounts.incorrect_password', // 'Please enter a strong password between 6 and 32 characters',
             autocomplete: 'new-password'
           },
           {
             _id: 'confirmPassword',
-            displayName: 'Confirm password',
+            displayName: 'passwordAgain', // 'Confirm password',
             type: 'password',
-            placeholder: 'Re-enter your password',
-            errStr: 'Password doesn\'t match',
+            placeholder:  'enterPassword', // 'Re-enter your password',
+            errStr: 'error.accounts.incorrect_password', // 'Password doesn\'t match',
             exclude: true,
             autocomplete: 'new-password',
           }
         ]
       },
 
+      /* -----------------------------
+                  Translations
+         ----------------------------- */
+
+      translations: {
+        button: {
+          changePwd: 'updateYourPassword', // Update New Password
+          forgotPwd: 'emailResetLink', // 'Send Reset Link',
+          resetPwd: 'updateYourPassword', // 'Save New Password',
+          signIn: 'signIn', // 'Login',
+          signUp: 'signUp', // 'Register',
+          resendVerification: 'resendVerificationEmail', // 'Send Verification Link',
+          enrollAccount: 'createAccount', // 'Save Password',
+        },
+        title: {
+          changePwd: 'changePassword', // 'Change Password',
+          forgotPwd: 'forgotPassword', // 'Forgot Password',
+          resetPwd: 'resetYourPassword', // 'Reset Password',
+          signIn: 'signIn', // 'Login',
+          signUp: 'createAccount', // 'Create Your Account',
+          resendVerification: 'resendVerificationEmail', // 'Resend Verification Link',
+          enrollAccount: 'setPassword', // 'Set Your Account Password',
+        },
+        links: {
+          toChangePwd: 'changePassword', // 'Change your password',
+          toResetPwd: 'resetYourPassword', // 'Reset your password',
+          toForgotPwd: 'forgotPassword', // 'Forgot your password?',
+          toSignIn: 'signIn', // 'Already have an account? Sign in!',
+          toSignUp: 'signUp', // 'Don\'t have an account? Register',
+          toResendVerification_pre: 'resendVerificationEmailLink_pre', // 'Verification email lost? Resend'
+          toResendVerification_link: 'resendVerificationEmailLink_link', // 'Verification email lost? Resend'
+        },
+        info: {
+          emailSent: 'info.emailSent', // 'An email has been sent to your inbox',
+          emailVerified: 'info.emailVerified', // 'Your email has been verified',
+          pwdChanged: 'info.passwordChanged', // 'Your password has been changed',
+          pwdReset: 'info.passwordReset', // 'A password reset link has been sent to your email!',
+          pwdSet: 'info.passwordChanged', // 'Password updated!',
+          signUpVerifyEmail: 'info.emailSent', // 'Successful Registration! Please check your email and follow the instructions',
+          verificationEmailSent: 'info.emailSent', // 'A new email has been sent to you. If the email doesn\'t show up in your inbox, be sure to check your spam folder.',
+          accountEnrolled: 'info.passwordChanged', // 'Your password has been set, you can now login',
+        },
+        errors: {
+          loginForbidden: 'error.accounts.login_forbidden', // 'There was a problem with your login',
+          captchaVerification: 'error.accounts.user_validation_failed', // 'There was a problem with the recaptcha verification, please try again',
+          userNotFound: 'error.accounts.user_not_found', // 'User not found',
+          userAlreadyVerified: 'error.accounts.already_verified', // 'User already verified!'
+        },
+        forgotPwdSubmitSuccess: 'info.emailSent', // 'A password reset link has been sent to your email!',
+        loginForbiddenMessage: 'error.accounts.login_forbidden', // 'There was a problem with your login'
+    },
+
       /* -----------------------------
                      Texts
          ----------------------------- */
 
+      /* texts are empty be default because traanslations are used. */
+
       texts: {
         button: {
-          changePwd: 'Update New Password',
-          forgotPwd: 'Send Reset Link',
-          resetPwd: 'Save New Password',
-          signIn: 'Login',
-          signUp: 'Register',
-          resendVerification: 'Send Verification Link',
-          enrollAccount: 'Save Password',
+          changePwd: null,
+          forgotPwd: null,
+          resetPwd: null,
+          signIn: null,
+          signUp: null,
+          resendVerification: null,
+          enrollAccount: null,
         },
         title: {
-          changePwd: 'Change Password',
-          forgotPwd: 'Forgot Password',
-          resetPwd: 'Reset Password',
-          signIn: 'Login',
-          signUp: 'Create Your Account',
-          resendVerification: 'Resend Verification Link',
-          enrollAccount: 'Set Your Account Password',
+          changePwd: null,
+          forgotPwd: null,
+          resetPwd: null,
+          signIn: null,
+          signUp: null,
+          resendVerification: null,
+          enrollAccount: null,
         },
         links: {
-          toChangePwd: 'Change your password',
-          toResetPwd: 'Reset your password',
-          toForgotPwd: 'Forgot your password?',
-          toSignIn: 'Already have an account? Sign in!',
-          toSignUp: 'Don\'t have an account? Register',
-          toResendVerification: 'Verification email lost? Resend'
+          toChangePwd: null,
+          toResetPwd: null,
+          toForgotPwd: null,
+          toSignIn: null,
+          toSignUp: null,
+          toResendVerification: null,
         },
         info: {
-          emailSent: 'An email has been sent to your inbox',
-          emailVerified: 'Your email has been verified',
-          pwdChanged: 'Your password has been changed',
-          pwdReset: 'A password reset link has been sent to your email!',
-          pwdSet: 'Password updated!',
-          signUpVerifyEmail: 'Successful Registration! Please check your email and follow the instructions',
-          verificationEmailSent: 'A new email has been sent to you. If the email doesn\'t show up in your inbox, be sure to check your spam folder.',
-          accountEnrolled: 'Your password has been set, you can now login',
+          emailSent: null,
+          emailVerified: null,
+          pwdChanged: null,
+          pwdReset: null,
+          pwdSet: null,
+          signUpVerifyEmail: null,
+          verificationEmailSent: null,
+          accountEnrolled: null,
         },
         errors: {
-          loginForbidden: 'There was a problem with your login',
-          captchaVerification: 'There was a problem with the recaptcha verification, please try again',
-          userNotFound: 'User not found',
-          userAlreadyVerified: 'User already verified!'
+          loginForbidden: null,
+          captchaVerification: null,
+          userNotFound: null,
+          userAlreadyVerified: null,
         },
-        forgotPwdSubmitSuccess: 'A password reset link has been sent to your email!',
-        loginForbiddenMessage: 'There was a problem with your login'
+        forgotPwdSubmitSuccess: null,
+        loginForbiddenMessage: null,
       },
 
       showReCaptcha: false,
@@ -324,6 +380,7 @@ class AccountsReact_ {
       this.overrideLoginErrors()
       this.disableMethods()
       this.setDenyRules()
+      if (Meteor.isClient) setLanguage(this.config.language)
 
       this._init = true
     }
@@ -424,7 +481,7 @@ class AccountsReact_ {
         if (attempt.error) {
           var reason = attempt.error.reason
           if (reason === 'User not found' || reason === 'Incorrect password') {
-            throw new Meteor.Error('Login Forbidden', this.config.texts.errors.loginForbidden) // Throw generalized error for failed login attempts
+            throw new Meteor.Error('Login Forbidden', this.config.texts.errors.loginForbidden || T9n.get(this.config.translations.errors.loginForbidden)) // Throw generalized error for failed login attempts
           }
         }
         return attempt.allowed