refactor(fscomponents): FLAGSHIP-94 Add Translations To Component

packages/fscomponents/src/components/LoginForm.tsx

@@ -6,6 +6,8 @@ import * as t from 'tcomb-form-native';
 import { emailRegex } from '../lib/email';
 import { Form, FormLabelPosition } from './Form';
 import { Button } from './Button';
+import FSI18n, { translationKeys } from '@brandingbrand/fsi18n';
+const componentTranslationKeys = translationKeys.flagship.loginForm;
 
 export interface LoginFormProps {
   /**
@@ -66,9 +68,9 @@ const EmailType = t.refinement(t.String, (str: string) => {
 
 EmailType.getValidationErrorMessage = (s: string) => {
   if (!s) {
-    return 'Email is required';
+    return FSI18n.string(componentTranslationKeys.emailReq);
   } else {
-    return `${s} is not an valid email`;
+    return s + FSI18n.string(componentTranslationKeys.emailNotValid);
   }
 };
 
@@ -91,23 +93,23 @@ export class LoginForm extends Component<LoginFormProps, LoginFormState> {
 
     this.fieldsOptions = {
       emailAddress: {
-        label: 'Email',
-        placeholder: 'Email',
+        label: FSI18n.string(componentTranslationKeys.email),
+        placeholder: FSI18n.string(componentTranslationKeys.email),
         returnKeyType: 'next',
         autoCorrect: false,
         autoCapitalize: 'none',
         keyboardType: 'email-address',
         onSubmitEditing: () => this.focusField('password'),
-        error: 'Please enter a valid email'
+        error: FSI18n.string(componentTranslationKeys.emailError)
       },
       password: {
-        label: 'Password',
-        placeholder: 'Password',
+        label: FSI18n.string(componentTranslationKeys.password),
+        placeholder: FSI18n.string(componentTranslationKeys.password),
         returnKeyType: 'next',
         autoCorrect: false,
         autoCapitalize: 'none',
         secureTextEntry: true,
-        error: 'Please enter your password'
+        error: FSI18n.string(componentTranslationKeys.passwordError)
       },
       ...props.fieldsOptions
     };
@@ -158,7 +160,7 @@ export class LoginForm extends Component<LoginFormProps, LoginFormState> {
           onChange={this.handleChange}
         />
         <Button
-          title={submitText || 'Submit'}
+          title={submitText || FSI18n.string(componentTranslationKeys.submit)}
           onPress={this.handleSubmit}
           style={submitButtonStyle}
         />

packages/fsi18n/src/translations/en.ts

@@ -314,7 +314,11 @@ export const keys: FSTranslationKeys = {
     },
     loginForm: {
       email: 'Email',
+      emailReq: 'Email is required',
+      emailNotValid: ' is not an valid email',
+      emailError: 'Please enter a valid email',
       password: 'Password',
+      passwordError: 'Please enter your password',
       submit: 'Submit'
     }
   }

packages/fsi18n/src/types.ts

@@ -380,6 +380,10 @@ export interface ShareButtonTranslations<KeyType> {
 }
 export interface LoginFormTranslations<KeyType> {
   email: KeyType;
+  emailReq: KeyType;
+  emailNotValid: KeyType;
+  emailError: KeyType;
   password: KeyType;
+  passwordError: KeyType;
   submit: KeyType;
 }