update multi language

src/Screens/AccountVerification/Tab/BankInfor.js

@@ -30,11 +30,11 @@ const {width} = Dimensions.get('window');
 const dataType = [
   {
     value: '0',
-    name: 'Tài khoản ngân hàng',
+    name: I18n.t('AccountNumber'),
   },
   {
     value: '1',
-    name: 'Tài khoản thẻ',
+    name: I18n.t('CardAccount'),
   },
 ];
 
@@ -80,7 +80,7 @@ const BankInfor = (props) => {
   };
 
   const onPress = async () => {
-    const titles = ['loại thẻ', 'mã ngân hàng', 'số thẻ/tài khoản'];
+    const titles = [I18n.t('CardType').toLowerCase(), I18n.t('BankCode').toLowerCase(), I18n.t('CardNumberOrAccount').toLowerCase()];
     const index = checkFormatArray([acc_type, bank_no, account_no]);
 
     if (index === true) {
@@ -138,7 +138,7 @@ const BankInfor = (props) => {
                 fontSize: getFontXD(42),
                 color: R.colors.color777,
               }}>
-              Loại thẻ
+              {I18n.t('CardType')}
             </Text>
             <PickerItem
               width={width - 20}
@@ -149,17 +149,17 @@ const BankInfor = (props) => {
             />
             <TextField
               isNumber={true}
-              title={'Mã ngân hàng'}
+              title={I18n.t('BankCode')}
               onChangeText={(val) => setBackNo(val)}
             />
             <TextField
-              title={'Số thẻ/tài khoản'}
+              title={I18n.t('CardNumberOrAccount')}
               isNumber={true}
               onChangeText={(val) => setAccountNo(val)}
             />
 
             <View style={styles.btnSend}>
-              <Button title={'Xác minh'} onClick={onPress} />
+              <Button title={I18n.t('Confirm')} onClick={onPress} />
             </View>
           </View>
         </ScrollView>

src/Screens/AccountVerification/Tab/GeneralInfor.js

@@ -30,7 +30,7 @@ const GeneralInfor = (props) => {
   const [address, setAdress] = useState('');
   const [birth, setBirth] = useState(new Date());
   const onNextPress = () => {
-    const titles = ['họ và tên đệm', 'tên', 'số điện thoại', 'địa chỉ'];
+    const titles = [I18n.t('FirstLastName').toLowerCase(), I18n.t('Name').toLowerCase(), I18n.t('PhoneNumber').toLowerCase(), I18n.t('Address').toLowerCase()];
     const index = checkFormatArray([lastName, firstName, phone, address]);
     if (index === true) {
       props.navigation.navigate('Profile', {
@@ -59,21 +59,21 @@ const GeneralInfor = (props) => {
             <View style={{flexDirection: 'row'}}>
               <View style={{flex: 1}}>
                 <TextField
-                  title={'Họ và tên đệm'}
+                  title={I18n.t('FirstLastName')}
                   onChangeText={(val) => setLastName(val)}
                 />
               </View>
               <View style={{width: 20}} />
               <View style={{flex: 1}}>
                 <TextField
-                  title={'Tên'}
+                  title={I18n.t('Name')}
                   onChangeText={(val) => setFirstName(val)}
                 />
               </View>
             </View>
             <TextField
               isNumber={true}
-              title={'Số điện thoại'}
+              title={I18n.t('PhoneNumber')}
               onChangeText={(val) => setPhone(val)}
             />
             <PickerDate
@@ -81,11 +81,11 @@ const GeneralInfor = (props) => {
               onValueChange={(val) => {
                 setBirth(val);
               }}
-              title={'Ngày sinh'}
+              title={I18n.t('Birth')}
             />
 
             <TextMulti
-              title={'Địa chỉ'}
+              title={I18n.t('Address')}
               onChangeText={(val) => setAdress(val)}
             />
             <TouchableOpacity onPress={onNextPress} style={styles.btnNext}>

src/Screens/AccountVerification/Tab/Profile.js

@@ -35,15 +35,15 @@ const {width} = Dimensions.get('window');
 const dataType = [
   {
     value: '1',
-    name: 'Chứng minh nhân dân',
+    name: I18n.t('IdentityCard'),
   },
   {
     value: '2',
-    name: 'Hộ chiếu',
+    name: I18n.t('Passport'),
   },
   {
     value: '3',
-    name: 'Căn cước công dân',
+    name: I18n.t('CitizenIdentification'),
   },
 ];
 
@@ -91,10 +91,10 @@ const Profile = (props) => {
 
   const onPress = async () => {
     const titles = [
-      'loại thẻ',
-      'ảnh CNND mặt trước',
-      'ảnh CMND mặt sau',
-      'ảnh chữ ký',
+      I18n.t('CardType').toLowerCase(),
+      I18n.t('IdentityCardFrontPhoto'),
+      I18n.t('IdentityCardBackPhoto'),
+      I18n.t('SignPhoto').toLowerCase(),
     ];
     const index = checkFormatArray([type, urlFont, urlBack, urlSign]);
     if (index === true) {
@@ -144,7 +144,7 @@ const Profile = (props) => {
                 fontSize: getFontXD(42),
                 color: R.colors.color777,
               }}>
-              Loại thẻ
+              {I18n.t('CardType')}
             </Text>
             <PickerItem
               width={width - 20}
@@ -153,7 +153,7 @@ const Profile = (props) => {
                 setType(items);
               }}
             />
-            {/* 
+            {/*
           <TextField
             isNumber={true}
             title={'Số thẻ'}
@@ -173,20 +173,20 @@ const Profile = (props) => {
               }}>
               <PickerImgUni
                 onSelectImg={(path) => setUrlFont(path)}
-                title={'Ảnh mặt trước CMND'}
+                title={I18n.t('IdentityCardFrontPhoto')}
               />
               <PickerImgUni
                 onSelectImg={(path) => setUrlBack(path)}
-                title={'Ảnh mặt sau CMND'}
+                title={I18n.t('IdentityCardBackPhoto')}
               />
               <PickerImgUni
                 onSelectImg={(path) => setUrlSign(path)}
-                title={'Ảnh chữ ký'}
+                title={I18n.t('SignPhoto')}
               />
             </View>
           </View>
           <View style={styles.btnSend}>
-            <Button title={'Xác minh'} onClick={onPress} />
+            <Button title={I18n.t('Confirm')} onClick={onPress} />
           </View>
         </ScrollView>
       </TouchableWithoutFeedback>

src/Screens/AccountVerification/TabView/GeneralView.js

@@ -13,6 +13,7 @@ import {
   Keyboard,
 } from 'react-native';
 import R from '../../../assets/R';
+import I18n from '../../../helper/i18/i18n';
 import moment from 'moment';
 import AppText from '../../../components/AppText';
 
@@ -64,7 +65,7 @@ const GeneralInfor = (props) => {
                 <TextField
                   editable={false}
                   value={props.user.l_name}
-                  title={'Họ và tên đệm'}
+                  title={I18n.t('FirstLastName')}
                 />
               </View>
               <View style={{width: 20}} />
@@ -72,7 +73,7 @@ const GeneralInfor = (props) => {
                 <TextField
                   value={props.user.f_name}
                   editable={false}
-                  title={'Tên'}
+                  title={I18n.t('Name')}
                 />
               </View>
             </View>
@@ -80,17 +81,17 @@ const GeneralInfor = (props) => {
               value={props.user.phone}
               isNumber={true}
               editable={false}
-              title={'Số điện thoại'}
+              title={I18n.t('PhoneNumber')}
             />
             <PickerDate
               valueString={convertDate(props.user.birthday)}
               disabled={true}
-              title={'Ngày sinh'}
+              title={I18n.t('Birth')}
             />
             <TextMulti
               value={props.user.address}
               editable={false}
-              title={'Địa chỉ'}
+              title={I18n.t('Address')}
             />
             <View style={{height: 100}} />
           </View>

src/Screens/AccountVerification/TabView/ProfileView.js

@@ -17,6 +17,7 @@ import Button from '../../../components/Button';
 import PickerImgUni from '../../../components/Picker/PickerImgUni';
 import R from '../../../assets/R';
 import TextField from '../../../components/Input/TextField';
+import I18n from '../../../helper/i18/i18n';
 import {connect} from 'react-redux';
 import {showLoading, hideLoading} from '../../../actions/loadingAction';
 import {
@@ -48,11 +49,11 @@ const Profile = (props) => {
   const renderType = (type) => {
     switch (type) {
       case 1:
-        return 'Chứng minh nhân dân';
+        return I18n.t('IdentityCard');
       case 2:
-        return 'Hộ chiếu';
+        return I18n.t('Passport');
       default:
-        return 'Căn cước công dân';
+        return I18n.t('CitizenIdentification');
     }
   };
   return (
@@ -71,7 +72,7 @@ const Profile = (props) => {
             <TextField
               value={renderType(props.user.card_type)}
               editable={false}
-              title={'Loại thẻ'}
+              title={I18n.t('CardType')}
             />
 
             <View
@@ -83,13 +84,13 @@ const Profile = (props) => {
               }}>
               <Item
                 linkImg={props.user.identity_before}
-                title={'Ảnh mặt trước CMND/CCCD'}
+                title={I18n.t('IdentityCitizenCardBackPhoto')}
               />
               <Item
                 linkImg={props.user.identity_after}
-                title={'Ảnh mặt sau CMND/CCCD'}
+                title={I18n.t('IdentityCitizenCardFrontPhoto')}
               />
-              <Item linkImg={props.user.sign_img} title={'Ảnh mặt chữ ký'} />
+              <Item linkImg={props.user.sign_img} title={I18n.t('SignPhoto')} />
             </View>
           </View>
         </ScrollView>

src/Screens/Action/Wallet/WalletDeposit.js

@@ -32,7 +32,7 @@ const WalletDeposit = (props) => {
   const navigate = useNavigation();
 
   const onClick = async () => {
-    const titles = ['số tiền', 'ghi chú'];
+    const titles = [I18n.t('AmountOfMoney').toLowerCase(), I18n.t('Note').toLowerCase()];
 
     const index = checkFormatArray([amount, notes]);
     if (index === true) {
@@ -68,7 +68,7 @@ const WalletDeposit = (props) => {
       <View style={styles.container}>
         <View style={styles.wrapTop}>
           <View style={styles.itemTop}>
-            <Text style={styles.txtTitle}>Ví</Text>
+            <Text style={styles.txtTitle}>{I18n.t('Wallet')}</Text>
             <Text style={styles.txtMoney}>
               {' '}
               {props.user.current_money != 0
@@ -92,14 +92,14 @@ const WalletDeposit = (props) => {
           {/* <TextDisable value={'10010101'} title={'Số tài khoản CQG'} /> */}
           <TextMoney
             onChangeText={(val) => setAmount(val)}
-            title={'Số tiền'}
+            title={I18n.t('AmountOfMoney')}
             value={amount}
           />
-          <TextMulti onChangeText={(val) => setNotes(val)} title={'Ghi chú'} />
+          <TextMulti onChangeText={(val) => setNotes(val)} title={I18n.t('Note')} />
         </View>
       </View>
       <TouchableOpacity onPress={onClick} style={styles.btnSend}>
-        <Text style={styles.txtSend}>Nạp tiền</Text>
+        <Text style={styles.txtSend}>{I18n.t('Deposit')}</Text>
       </TouchableOpacity>
     </View>
   );

src/Screens/Action/Wallet/WalletWithdraw.js

@@ -33,8 +33,8 @@ import {ADDMETHODPAY} from '../../../routers/ScreenNames';
 import TextMoney from '../../../components/Input/InputMoney';
 import I18n from '../../../helper/i18/i18n';
 var radio_props = [
-  {label: 'Từ ví', value: 'WALLET'},
-  {label: 'Từ tài khoản CQG', value: 'INVESTMENT'},
+  {label: I18n.t('FromWallet'), value: 'WALLET'},
+  {label: I18n.t('FromCQGAccount'), value: 'INVESTMENT'},
 ];
 const {width} = Dimensions.get('window');
 
@@ -62,7 +62,7 @@ const WalletWithdraw = (props) => {
     if (res.data.code == 200 && res.data.data) {
       if (res.data.data.length == 0) {
         confirmAlert(
-          'Bạn chưa có phương thức thanh toán.Đi đến cài đặt phương thức thanh toán?',
+          I18n.t('SettingPaymentMethodConfirm'),
           () => navigate.navigate(ADDMETHODPAY),
         );
       } else {
@@ -77,7 +77,7 @@ const WalletWithdraw = (props) => {
   };
 
   const onPressWithdraw = async () => {
-    const titles = ['tài khoản hưởng thụ', 'số tiền'];
+    const titles = [I18n.t('BeneficiaryAccount'), I18n.t('AmountOfMoney').toLowerCase()];
 
     const index = checkFormatArray([type, amount]);
 
@@ -123,7 +123,7 @@ const WalletWithdraw = (props) => {
           <View style={styles.container}>
             <View style={styles.wrapTop}>
               <View style={styles.itemTop}>
-                <Text style={styles.txtTitle}>Ví</Text>
+                <Text style={styles.txtTitle}>{I18n.t('Wallet')}</Text>
                 <Text style={styles.txtMoney}>
                   {' '}
                   {props.user.current_money != 0
@@ -150,7 +150,7 @@ const WalletWithdraw = (props) => {
                   fontSize: getFontXD(42),
                   color: R.colors.color777,
                 }}>
-                Tài khoản nguồn
+                {I18n.t('SourceAccount')}
               </Text>
               {/* <View style={styles.row}> */}
               <RadioForm
@@ -169,7 +169,7 @@ const WalletWithdraw = (props) => {
                   fontSize: getFontXD(42),
                   color: R.colors.color777,
                 }}>
-                Chọn tài khoản hưởng thụ
+                {I18n.t('ChooseBeneficiaryAccount')}
               </Text>
               <PickerItem
                 width={width - 20}
@@ -180,17 +180,17 @@ const WalletWithdraw = (props) => {
               />
               <TextMoney
                 onChangeText={(val) => setAmount(val)}
-                title={'Số tiền'}
+                title={I18n.t('AmountOfMoney')}
                 value={amount}
               />
               <TextMulti
                 onChangeText={(val) => setNotes(val)}
-                title={'Ghi chú'}
+                title={I18n.t('Note')}
               />
             </View>
           </View>
           <TouchableOpacity onPress={onPressWithdraw} style={styles.btnSend}>
-            <Text style={styles.txtSend}>Rút tiền</Text>
+            <Text style={styles.txtSend}>{I18n.t('Withdraw')}</Text>
           </TouchableOpacity>
         </View>
       </TouchableWithoutFeedback>

src/Screens/Authen/ConfirmEmail.js

@@ -40,7 +40,7 @@ const ConfirmEmail = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng nhập email!');
+      Alert.alert(I18n.t('Notification'), `${I18n.t('EnterEmailRequest')}!`);
     }
   };
 
@@ -50,12 +50,12 @@ const ConfirmEmail = (props) => {
       <View style={styles.container}>
         <View style={styles.wrap}>
           <View style={styles.containerCode}>
-            <Text style={styles.txtTitle}>Vui lòng nhập email:</Text>
+            <Text style={styles.txtTitle}>`${I18n.t('EnterEmailRequest')}:`</Text>
             <TextInput
               placeholderTextColor={R.colors.placeHolder}
               style={styles.txtInput}
               autoCapitalize="none"
-              placeholder="Nhập email"
+              placeholder={I18n.t('EnterEmail')}
               value={value}
               onChangeText={(val) => setValue(val)}
             />
@@ -65,10 +65,10 @@ const ConfirmEmail = (props) => {
 
       <View style={styles.footer}>
         <TouchableOpacity onPress={getOTP} style={styles.btn}>
-          <Text style={styles.txtBtn}>Lấy mã xác thực</Text>
+          <Text style={styles.txtBtn}>{I18n.t('GetVerificationCode')}</Text>
         </TouchableOpacity>
         <TouchableOpacity onPress={() => navigate.goBack()}>
-          <Text style={styles.txtSend}>Quay lại đăng nhập</Text>
+          <Text style={styles.txtSend}>{I18n.t('BackToLogin')}</Text>
         </TouchableOpacity>
       </View>
     </View>

src/Screens/Authen/ConfirmOTP.js

@@ -42,9 +42,9 @@ const ConfirmOTP = (propsa) => {
 
   const confirm = async () => {
     if (!value) {
-      Alert.alert(I18n.t('Notification'), 'Vui long nhập mã OTP');
+      Alert.alert(I18n.t('Notification'), I18n.t('EnterOTPRequest'));
     } else if (value.length != 4) {
-      Alert.alert(I18n.t('Notification'), 'Mã OTP không đúng định dạng');
+      Alert.alert(I18n.t('Notification'), I18n.t('OTPInvalid'));
     } else {
       propsa.showLoading();
       const res = await verifyOTPApi({
@@ -106,7 +106,7 @@ const ConfirmOTP = (propsa) => {
         <TouchableOpacity
           style={styles.wrapFooter}
           onPress={() => navigate.goBack()}>
-          <Text style={styles.txtNote}>Mã OTP có hiệu lực trong 5 phút.</Text>
+          <Text style={styles.txtNote}>{I18n.t('OTPValidFiveMinute')}</Text>
           <AppText i18nKey={'Re_send'} style={styles.txtSend} />
         </TouchableOpacity>
       </View>

src/Screens/Authen/Login.js

@@ -62,7 +62,7 @@ const Login = (props) => {
   };
 
   const onSubmitLogin = async (email, pass) => {
-    const titles = ['tên đăng nhập', 'mật khẩu'];
+    const titles = [I18n.t('Username').toLowerCase(), I18n.t('Password').toLowerCase()];
     const index = checkFormatArray([email, pass]);
 
     if (index === true) {
@@ -110,14 +110,14 @@ const Login = (props) => {
       <InputIcon
         icon={R.images.iconUser3}
         title={'Email'}
-        placeholder={'Nhập email'}
+        placeholder={I18n.t('EnterEmail')}
         onChangeText={(val) => setEmail(val)}
         value={email}
       />
       <InputIcon
         icon={R.images.iconLock}
         title={'Password'}
-        placeholder={'Nhập mật khẩu'}
+        placeholder={I18n.t('EnterPassword')}
         isPassWord={true}
         onChangeText={(val) => setPass(val)}
         value={pass}
@@ -188,6 +188,7 @@ const styles = StyleSheet.create({
     marginTop: 30,
   },
   txtRegistor: {
+    marginLeft: WIDTHXD(10),
     fontSize: getFontXD(42),
     color: '#1473E6',
   },

src/Screens/Authen/NewPassWord.js

@@ -15,6 +15,7 @@ import {useNavigation} from '@react-navigation/native';
 import {getFontXD, HEIGHTXD, WIDTHXD} from '../../Config/Functions';
 import R from '../../assets/R';
 import {AUTHEN} from '../../routers/ScreenNames';
+import I18n from '../../helper/i18/i18n';
 
 import {showLoading, hideLoading} from '../../actions/loadingAction';
 import {connect} from 'react-redux';
@@ -28,7 +29,7 @@ const NewPassword = (props) => {
 
   const changePass = async () => {
     if (!password || !cfPassword) {
-      Alert.alert('Vui lòng điền đầy đủ thông tin!');
+      Alert.alert(I18n.t('EnterAllInfo'));
     } else {
       props.showLoading();
       const res = await forgotPasswordApi({
@@ -42,7 +43,7 @@ const NewPassword = (props) => {
 
       if (res.data.code == 200) {
         await setTimeout(() => {
-          Alert.alert('Thông báo!', 'Đổi mật khẩu thành công');
+          Alert.alert(I18n.t('Notification'), I18n.t('ChangePasswordSuccess'));
           navigate.reset({
             index: 1,
             routes: [{name: AUTHEN}],
@@ -51,7 +52,7 @@ const NewPassword = (props) => {
       } else {
         setTimeout(() => {
           console.log('response', res.data);
-          Alert.alert('Thông báo!', res.data.message);
+          Alert.alert(I18n.t('Notification'), res.data.message);
         }, 500);
       }
     }
@@ -64,10 +65,10 @@ const NewPassword = (props) => {
       <View style={styles.container}>
         <View style={styles.wrap}>
           <View style={styles.containerCode1}>
-            <Text style={styles.txtTitle}>Vui lòng nhập mật khẩu mới</Text>
+            <Text style={styles.txtTitle}>{I18n.t('EnterNewPassword')}</Text>
             <TextInput
               style={styles.txtInput}
-              placeholder="Nhập mật khẩu mới"
+              placeholder={I18n.t('EnterNewPasswordHint')}
               placeholderTextColor={R.colors.placeHolder}
               autoCapitalize="none"
               value={password}
@@ -76,11 +77,11 @@ const NewPassword = (props) => {
             />
           </View>
           <View style={styles.containerCode2}>
-            <Text style={styles.txtTitle}>Nhập lại mật khẩu</Text>
+            <Text style={styles.txtTitle}>{I18n.t('ReEnterPassword')}</Text>
             <TextInput
               style={styles.txtInput}
               autoCapitalize="none"
-              placeholder="Xác nhận lại mật khẩu mới"
+              placeholder={I18n.t('ConfirmNewPassword')}
               value={cfPassword}
               secureTextEntry={true}
               placeholderTextColor={R.colors.placeHolder}
@@ -92,7 +93,7 @@ const NewPassword = (props) => {
 
       <View style={styles.footer}>
         <TouchableOpacity onPress={changePass} style={styles.btn}>
-          <Text style={styles.txtBtn}>Cập nhật</Text>
+          <Text style={styles.txtBtn}>{I18n.t('Update')}</Text>
         </TouchableOpacity>
       </View>
     </View>

src/Screens/Authen/Registor.js

@@ -26,7 +26,7 @@ const Registor = (props) => {
   const [sponsor_id, setSponsor_id] = useState('');
 
   const registorClick = async () => {
-    const titles = ['email', 'mật khẩu', 'xác nhận mật khẩu'];
+    const titles = ['email', I18n.t('Password').toLowerCase(),  I18n.t('ConfirmPassword').toLowerCase()];
     const index = checkFormatArray([email, password, password_confirmation]);
 
     if (index === true) {
@@ -53,7 +53,7 @@ const Registor = (props) => {
 
       if (res.data.code == 200 && res.data.data) {
         setTimeout(() => {
-          Alert.alert(I18n.t('Notification'), 'Đăng ký tài khoản thành công!');
+          Alert.alert(I18n.t('Notification'), I18n.t('RegisterAccountSuccess'));
           navigation.navigate('LOGIN');
         }, 500);
       } else {
@@ -80,28 +80,28 @@ const Registor = (props) => {
       <InputIcon
         icon={R.images.iconEmail}
         title={'Email'}
-        placeholder={'Nhập email'}
+        placeholder={I18n.t('EnterEmail')}
         onChangeText={(val) => setEmail(val)}
       />
 
       <InputIcon
         icon={R.images.iconLock}
         title={'Password'}
-        placeholder={'Nhập mật khẩu'}
+        placeholder={I18n.t('EnterPassword')}
         onChangeText={(val) => setPassword(val)}
         isPassWord={true}
       />
       <InputIcon
         icon={R.images.iconLock}
         title={'Confirm_pass'}
-        placeholder={'Nhập mật khẩu'}
+        placeholder={I18n.t('EnterPassword')}
         onChangeText={(val) => setPasswordConfirm(val)}
         isPassWord={true}
       />
       <InputIcon
         icon={R.images.iconIntroduct}
         title={'Code_introduce'}
-        placeholder={'Nhập mã giới thiệu nếu có'}
+        placeholder={I18n.t('EnterReferralCode')}
         onChangeText={(val) => setSponsor_id(val)}
         isPassWord={true}
       />

src/Screens/Exchange/ExchangeView.js

@@ -5,6 +5,7 @@ import HeaderSearch from '../../components/Header/HeaderSearch';
 import {getFontXD} from '../../Config/Functions';
 import Item from './Item';
 import AppText from '../../components/AppText';
+import I18n from '../../helper/i18/i18n';
 
 const Fillters = [
   {
@@ -34,9 +35,9 @@ const data = [
     id: '1',
     month: 2,
     day: '20',
-    name: 'Nạp tiền',
+    name: I18n.t('Deposit'),
     money: 10000000,
-    note: 'Ghi chú nap tiền để đầu tư',
+    note: '',
     status: 1,
     date: '20/02/2021',
   },
@@ -44,9 +45,9 @@ const data = [
     id: '2',
     month: 2,
     day: '20',
-    name: 'Nạp tiền',
+    name: I18n.t('Deposit'),
     money: 2000000,
-    note: 'Ghi chú nap tiền để đầu tư',
+    note: '',
     status: 1,
     date: '20/02/2021',
   },
@@ -54,9 +55,9 @@ const data = [
     id: '3',
     month: 2,
     day: '20',
-    name: 'Nạp tiền',
+    name: I18n.t('Deposit'),
     money: 3000000,
-    note: 'Ghi chú nap tiền để đầu tư',
+    note: '',
     status: 1,
     date: '20/02/2021',
   },
@@ -64,9 +65,9 @@ const data = [
     id: '4',
     month: 2,
     day: '20',
-    name: 'Nạp tiền',
+    name: I18n.t('Deposit'),
     money: 4000000,
-    note: 'Ghi chú nap tiền để đầu tư',
+    note: '',
     status: 1,
     date: '20/02/2021',
   },
@@ -74,9 +75,9 @@ const data = [
     id: '5',
     month: 2,
     day: '20',
-    name: 'Nạp tiền',
+    name: I18n.t('Deposit'),
     money: 9000000,
-    note: 'Ghi chú nap tiền để đầu tư',
+    note: '',
     status: 1,
     date: '20/02/2021',
   },
@@ -86,7 +87,7 @@ const ExchangeView = (props) => {
 
   return (
     <View style={{flex: 1}}>
-      <HeaderSearch isWhite={true} title={'Giao dịch'} />
+      <HeaderSearch isWhite={true} title={I18n.t('Tradding')} />
       <View style={styles.headerContainer}>
         <FlatList
           showsHorizontalScrollIndicator={false}

src/Screens/Exchange/Item.js

@@ -3,6 +3,7 @@ import {View, Text, StyleSheet, TouchableOpacity} from 'react-native';
 import {getFontXD, HEIGHTXD, WIDTHXD, toPriceVnd} from '../../Config/Functions';
 import R from '../../assets/R';
 import Block from '../../components/Block';
+import I18n from '../../helper/i18/i18n';
 import {useNavigation} from '@react-navigation/native';
 import {DETAIL_REQUIRE_MONEY} from '../../routers/ScreenNames';
 
@@ -37,7 +38,7 @@ const Item = (props) => {
             <Text numberOfLines={1} style={styles.txtTitle}>
               {item.note}
             </Text>
-            <Text style={styles.txtDate}>Ngày {item.date}</Text>
+            <Text style={styles.txtDate}>`${I18n.t('Date')} ${item.date}`</Text>
           </Block>
         </Block>
       </View>

src/Screens/Feedback/FeedbackView.js

@@ -23,13 +23,14 @@ import PickerImg from '../../components/Picker/PickerImg';
 import {HEIGHTXD, WIDTHXD, getFontXD} from '../../Config/Functions';
 import R from '../../assets/R';
 import Button from '../../components/Button';
+import I18n from '../../helper/i18/i18n';
 
 const radio_props = [
-  {label: 'Rất kém', value: 0},
-  {label: 'Kém', value: 1},
-  {label: 'Bình thường', value: 2},
-  {label: 'Tốt', value: 3},
-  {label: 'Rất tốt', value: 4},
+  {label: I18n.t('VeryBad'), value: 0},
+  {label: I18n.t('Bad'), value: 1},
+  {label: I18n.t('Normal'), value: 2},
+  {label: I18n.t('Good'), value: 3},
+  {label: I18n.t('VeryGood'), value: 4},
 ];
 
 const FeedbackView = (props) => {
@@ -64,7 +65,7 @@ const FeedbackView = (props) => {
         <View style={{flex: 1}}>
           <HeaderBack isWhite={true} title={'SendFeedback'} />
           <View style={styles.container}>
-            <Text style={styles.txt}>Đánh giá dịch vụ của DCV Invest</Text>
+            <Text style={styles.txt}>{I18n.t('ReviewService')}</Text>
 
             <RadioForm animation={true}>
               {radio_props.map((obj, i) => (
@@ -97,7 +98,7 @@ const FeedbackView = (props) => {
                 style={styles.txtInput}
                 placeholderTextColor={R.colors.placeHolder}
                 multiline={true}
-                placeholder={'Hãy chia sẻ cảm nhận về dịch vụ nhé'}
+                placeholder={I18n.t('ShareYourFeel')}
                 onChangeText={(val) => setTxtInput(val)}
               />
               <View
@@ -140,7 +141,7 @@ const FeedbackView = (props) => {
                     ))}
                   </ScrollView>
                 ) : (
-                  <PickerImg title="Tải ảnh lên" onClickImage={onClickImages} />
+                  <PickerImg title={I18n.t('UploadImage')} onClickImage={onClickImages} />
                 )}
               </View>
             </View>
@@ -149,7 +150,7 @@ const FeedbackView = (props) => {
           <View style={styles.containerBtn}>
             <Button
               onClick={() => console.log('hello')}
-              title={'Gửi phản hồi'}
+              title={I18n.t('SendFeedback')}
             />
           </View>
         </View>

src/Screens/Menu/Payments/Item.js

@@ -8,6 +8,7 @@ import {
 } from '../../../Config/Functions';
 import R from '../../../assets/R';
 import Block from '../../../components/Block';
+import I18n from '../../../helper/i18/i18n';
 
 const Item = (props) => {
   const {item} = props;
@@ -18,11 +19,11 @@ const Item = (props) => {
           <Block padding={[5, 10]} space={'between'} flex={1}>
             <View style={{justifyContent: 'center', flex: 1}}>
               <Text style={styles.txt1}>
-                Tiền thưởng:{' '}
+                `${I18n.t('BonusMoney')}:{' '}`
                 <Text style={styles.money}>{toPriceVnd(item.money)}</Text> vnđ
               </Text>
               <Text numberOfLines={1} style={styles.txt2}>
-                Nội dung: {item.content}
+                `{I18n.t('Content')}: {item.content}`
               </Text>
             </View>
             <Text style={styles.txt}>{item.time}</Text>

src/Screens/Menu/Profile/Tab/GeneralInfor.js

@@ -34,7 +34,7 @@ const GeneralInfor = (props) => {
   const [address, setAddress] = useState(props.user.address);
 
   const onClick = async () => {
-    const titles = ['điện thoại', 'địa chỉ'];
+    const titles = [I18n.t('Phone').toLowerCase(), I18n.t('Address').toLowerCase()];
     const index = checkFormatArray([phone, address]);
     if (index === true) {
       props.showLoading();
@@ -65,8 +65,8 @@ const GeneralInfor = (props) => {
   };
 
   const renderMale = () => {
-    if (props.user.gender == 1) return 'Nữ';
-    return 'Nam';
+    if (props.user.gender == 1) return I18n.t('Female');
+    return I18n.t('Male2');
   };
 
   return (
@@ -137,7 +137,6 @@ const GeneralInfor = (props) => {
             <View style={{justifyContent: 'center', alignItems: 'center'}}>
               <TouchableOpacity onPress={onClick} style={styles.btn}>
                 <AppText i18nKey={'Update'} style={styles.txtBtn}>
-                  Cập nhật
                 </AppText>
               </TouchableOpacity>
             </View>

src/Screens/Menu/Rose/Item.js

@@ -8,6 +8,7 @@ import {
 } from '../../../Config/Functions';
 import R from '../../../assets/R';
 import Block from '../../../components/Block';
+import I18n from '../../../helper/i18/i18n';
 import {useNavigation} from '@react-navigation/native';
 import {DETAIL_REQUIRE_MONEY} from '../../../routers/ScreenNames';
 
@@ -36,7 +37,7 @@ const Item = (props) => {
                     {item.note}
                   </Text>
                 </View>
-                <Text style={styles.txtDate}>Ngày {item.date}</Text>
+                <Text style={styles.txtDate}>`${I18n.t('Date')} ${item.date}`</Text>
               </View>
               <View>
                 <Text

src/Screens/MethodPay/AddMethod.js

@@ -55,10 +55,10 @@ const AddMethodPay = (props) => {
 
   const onLick = async () => {
     const titles = [
-      'ngân hàng',
-      'chi nhánh',
-      'chủ tài khoản',
-      'số tài khoản ngân hàng',
+      I18n.t('Bank').toLowerCase(),
+      I18n.t('Branch').toLowerCase(),
+      I18n.t('OwnerAccount2').toLowerCase(),
+      I18n.t('AccountNumber').toLowerCase(),
     ];
     const index = checkFormatArray([
       bank_id,
@@ -104,7 +104,7 @@ const AddMethodPay = (props) => {
           <HeaderBack title={'AddPaymentMethod'} />
           <View style={styles.container}>
             <View style={{flex: 1}}>
-              <Text style={styles.txtTitle}>Chọn ngân hàng </Text>
+              <Text style={styles.txtTitle}>{I18n.t('SelectBank')}</Text>
               {/*<PickerItem*/}
               {/*  value={bank_id}*/}
               {/*  data={data}*/}
@@ -113,31 +113,30 @@ const AddMethodPay = (props) => {
               {/*  }}*/}
               {/*/>*/}
               <SelectBankModal
-                  title={'Chọn ngân hàng'}
+                  title={I18n.t('SelectBank')}
                   data={data}
                   onPressItem = {(item) => {
-                    console.log(item)
                     setBankID(item)
                   }}
               />
               <TextField
                 onChangeText={(val) => setBankName(val)}
-                title={'Chi nhánh'}
+                title={I18n.t('Branch')}
               />
 
               <TextField
                 onChangeText={(val) => setAccountName(val)}
-                title={'Tên chủ tài khoản'}
+                title={I18n.t('OwnerAccountName')}
               />
               <TextField
                 onChangeText={(val) => setAccountNo(val)}
-                title={'Số tài khoản ngân hàng'}
+                title={I18n.t('AccountNumber')}
                 isNumber={true}
               />
             </View>
             <View style={{justifyContent: 'center', alignItems: 'center'}}>
               <TouchableOpacity onPress={onLick} style={styles.btn}>
-                <Text style={styles.txtAdd}>Thêm</Text>
+                <Text style={styles.txtAdd}>{I18n.t('Add')}</Text>
               </TouchableOpacity>
             </View>
           </View>

src/Screens/MethodPay/Item.js

@@ -6,6 +6,7 @@ import Block from '../../components/Block';
 import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
 import {useNavigation} from '@react-navigation/native';
 import {METHODPAYDETAIL} from '../../routers/ScreenNames';
+import AppText from '../../components/AppText';
 const Item = (props) => {
   const navigate = useNavigation();
 
@@ -19,9 +20,9 @@ const Item = (props) => {
             <Text style={styles.txtBig}>{item.title}</Text>
             <Block space={'between'} row flex={1}>
               <Block>
-                <Text style={styles.txtLeft}>Chủ TK</Text>
+                <AppText style={styles.txtLeft} i18nKey={('OwnerAccount')}/>
                 <Text style={styles.txtLeft}>STK</Text>
-                <Text style={styles.txtLeft}>Chi nhánh</Text>
+                <AppText style={styles.txtLeft} i18nKey={('Branch')}/>
               </Block>
               <Block>
                 <Text style={styles.txtRight}>{item.account_name}</Text>

src/Screens/MethodPay/MethodPayDetail.js

 import React, {useState, useEffect} from 'react';
 import {
-  View,
-  Text,
-  StyleSheet,
-  FlatList,
-  Dimensions,
-  TouchableOpacity,
-  Alert,
-  KeyboardAvoidingView,
-  TouchableWithoutFeedback,
-  Keyboard,
-  Platform,
+    View,
+    Text,
+    StyleSheet,
+    FlatList,
+    Dimensions,
+    TouchableOpacity,
+    Alert,
+    KeyboardAvoidingView,
+    TouchableWithoutFeedback,
+    Keyboard,
+    Platform,
 } from 'react-native';
 import {connect} from 'react-redux';
 import R from '../../assets/R';
@@ -22,191 +22,198 @@ import {getFontXD, WIDTHXD, checkFormatArray} from '../../Config/Functions';
 import TextField from '../../components/Input/TextField';
 import PickerItem from '../../components/Picker/PickerItem';
 import {
-  deleteMethodBank,
-  addMethodBank,
-  updateMethodBank,
+    deleteMethodBank,
+    addMethodBank,
+    updateMethodBank,
 } from '../../apis/Functions/Widthdraw';
 import {showLoading, hideLoading} from '../../actions/loadingAction';
 import {useNavigation} from '@react-navigation/native';
 import BankInfor from '../../components/BankInfor';
+import AppText from '../../components/AppText';
+
 const {width} = Dimensions.get('window');
 
 const MethodPayDetail = (props) => {
-  const [data, setData] = useState([]);
-  const {params} = props.route;
+    const [data, setData] = useState([]);
+    const {params} = props.route;
 
-  const [disable, setDisable] = useState(true);
-  const navigate = useNavigation();
-  const [branch_name, setBankName] = useState(params.branch_name);
-  const [account_name, setAccountName] = useState(params.account_name);
-  const [account_no, setAccountNo] = useState(params.account_no);
+    const [disable, setDisable] = useState(true);
+    const navigate = useNavigation();
+    const [branch_name, setBankName] = useState(params.branch_name);
+    const [account_name, setAccountName] = useState(params.account_name);
+    const [account_no, setAccountNo] = useState(params.account_no);
 
-  const onUpdate = async () => {
-    const titles = ['chi nhánh', 'chủ tài khoản', 'số tài khoản ngân hàng'];
-    const index = checkFormatArray([branch_name, account_name, account_no]);
-    if (index === true) {
-      if (
-        branch_name != params.branch_name ||
-        account_name != params.account_name ||
-        account_no != params.account_no
-      ) {
+    const onUpdate = async () => {
+        const titles = [
+            I18n.t('Branch').toLowerCase(),
+            I18n.t('OwnerAccount2').toLowerCase(),
+            I18n.t('AccountNumber').toLowerCase()
+        ];
+        const index = checkFormatArray([branch_name, account_name, account_no]);
+        if (index === true) {
+            if (
+                branch_name != params.branch_name ||
+                account_name != params.account_name ||
+                account_no != params.account_no
+            ) {
+                props.showLoading();
+                const res = await updateMethodBank({
+                    platform: Platform.OS,
+                    id: params.id,
+                    branch_name,
+                    account_name,
+                    account_no,
+                });
+                props.hideLoading();
+                if (res.data.code == 200) {
+                    setTimeout(() => {
+                        Alert.alert(I18n.t('Notification'), res.data.message);
+                        navigate.goBack();
+                    }, 500);
+                } else {
+                    setTimeout(() => {
+                        Alert.alert(I18n.t('Notification'), res.data.message);
+                    }, 500);
+                }
+            } else {
+                Alert.alert(I18n.t('Notification'), I18n.t('NothingChange'));
+            }
+        } else {
+            Alert.alert(
+                I18n.t('Notification'),
+                I18n.t('Please_fill_in') + titles[index],
+            );
+        }
+    };
+
+    const onRemove = async () => {
         props.showLoading();
-        const res = await updateMethodBank({
-          platform: Platform.OS,
-          id: params.id,
-          branch_name,
-          account_name,
-          account_no,
+        const res = await deleteMethodBank({
+            platform: Platform.OS,
+            id: params.id,
         });
         props.hideLoading();
         if (res.data.code == 200) {
-          setTimeout(() => {
-            Alert.alert(I18n.t('Notification'), res.data.message);
-            navigate.goBack();
-          }, 500);
+            setTimeout(() => {
+                Alert.alert(I18n.t('Notification'), res.data.message);
+                navigate.goBack();
+            }, 500);
         } else {
-          setTimeout(() => {
-            Alert.alert(I18n.t('Notification'), res.data.message);
-          }, 500);
+            setTimeout(() => {
+                Alert.alert(I18n.t('Notification'), res.data.message);
+            }, 500);
         }
-      } else {
-        Alert.alert(I18n.t('Notification'), 'Không có gì thay đổi');
-      }
-    } else
-      Alert.alert(
-        I18n.t('Notification'),
-        I18n.t('Please_fill_in') + titles[index],
-      );
-  };
-
-  const onRemove = async () => {
-    props.showLoading();
-    const res = await deleteMethodBank({
-      platform: Platform.OS,
-      id: params.id,
-    });
-    props.hideLoading();
-    if (res.data.code == 200) {
-      setTimeout(() => {
-        Alert.alert(I18n.t('Notification'), res.data.message);
-        navigate.goBack();
-      }, 500);
-    } else {
-      setTimeout(() => {
-        Alert.alert(I18n.t('Notification'), res.data.message);
-      }, 500);
-    }
-  };
+    };
 
-  return (
-    <KeyboardAvoidingView
-      behavior={Platform.Os === 'ios' ? 'padding' : 'height'}
-      style={{flex: 1}}
-      keyboardVerticalOffset={-50}>
-      <TouchableWithoutFeedback onPress={Keyboard.dismiss}>
-        <View style={{flex: 1}}>
-          <HeaderBack title={'DetailMethod'} />
-          <View style={{flex: 1}}>
-            <View style={styles.container}>
-              <BankInfor
-                linkImg={params.bank.logo}
-                title={'Chọn ngân hàng'}
-                value={params.bank.name}
-              />
-              <TextField
-                onChangeText={(val) => setBankName(val)}
-                title={'Chi nhánh'}
-                value={branch_name}
-              />
+    return (
+        <KeyboardAvoidingView
+            behavior={Platform.Os === 'ios' ? 'padding' : 'height'}
+            style={{flex: 1}}
+            keyboardVerticalOffset={-50}>
+            <TouchableWithoutFeedback onPress={Keyboard.dismiss}>
+                <View style={{flex: 1}}>
+                    <HeaderBack title={'DetailMethod'}/>
+                    <View style={{flex: 1}}>
+                        <View style={styles.container}>
+                            <BankInfor
+                                linkImg={params.bank.logo}
+                                title={I18n.t('SelectBank')}
+                                value={params.bank.name}
+                            />
+                            <TextField
+                                onChangeText={(val) => setBankName(val)}
+                                title={I18n.t('Branch')}
+                                value={branch_name}
+                            />
 
-              <TextField
-                onChangeText={(val) => setAccountName(val)}
-                title={'Tên chủ tài khoản'}
-                value={account_name}
-              />
-              <TextField
-                onChangeText={(val) => setAccountNo(val)}
-                title={'Số tài khoản ngân hàng'}
-                isNumber={true}
-                value={account_no}
-              />
-            </View>
-          </View>
-          <View style={styles.footer}>
-            <TouchableOpacity onPress={onUpdate} style={styles.btnLeft}>
-              <Text style={styles.txtAdd}>Cập nhật</Text>
-            </TouchableOpacity>
-            <TouchableOpacity
-              onPress={() => {
-                Alert.alert(
-                  'Thông báo!',
-                  'Bạn có chắc chắn muốn xoá phương thức thanh toán',
-                  [
-                    {
-                      text: 'Từ chối',
-                      style: 'cancel',
-                    },
-                    {text: 'Đồng ý', onPress: () => onRemove()},
-                  ],
-                );
-              }}
-              style={styles.btnRight}>
-              <Text style={styles.txtAdd}>Xoá</Text>
-            </TouchableOpacity>
-          </View>
-        </View>
-      </TouchableWithoutFeedback>
-    </KeyboardAvoidingView>
-  );
+                            <TextField
+                                onChangeText={(val) => setAccountName(val)}
+                                title={I18n.t('OwnerAccountName')}
+                                value={account_name}
+                            />
+                            <TextField
+                                onChangeText={(val) => setAccountNo(val)}
+                                title={I18n.t('AccountNumber')}
+                                isNumber={true}
+                                value={account_no}
+                            />
+                        </View>
+                    </View>
+                    <View style={styles.footer}>
+                        <TouchableOpacity onPress={onUpdate} style={styles.btnLeft}>
+                            <AppText style={styles.txtAdd} i18nKey={('Update')}/>
+                        </TouchableOpacity>
+                        <TouchableOpacity
+                            onPress={() => {
+                                Alert.alert(
+                                    `${I18n.t('Notification')}!`,
+                                    I18n.t('DeletePaymentMethodConfirm'),
+                                        [
+                                        {
+                                            text: I18n.t('Forbidden'),
+                                            style: 'cancel',
+                                        },
+                                            {text: I18n.t('Ok'), onPress: () => onRemove()},
+                                        ],
+                                );
+                            }}
+                            style={styles.btnRight}>
+                            <AppText style={styles.txtAdd} i18nKey={('Delete')}/>
+                        </TouchableOpacity>
+                    </View>
+                </View>
+            </TouchableWithoutFeedback>
+        </KeyboardAvoidingView>
+    );
 };
 
 const styles = StyleSheet.create({
-  container: {
-    paddingHorizontal: 20,
-    paddingTop: 10,
-  },
-  footer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    marginBottom: 10,
-    paddingHorizontal: 20,
-  },
-  btnLeft: {
-    width: 150,
-    height: 40,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: R.colors.main,
-    borderRadius: 5,
-  },
-  btnRight: {
-    width: 150,
-    height: 40,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: R.colors.main,
-    borderRadius: 5,
-  },
-  txtAdd: {
-    color: R.colors.white,
-    fontSize: getFontXD(46),
-    textTransform: 'uppercase',
-    fontWeight: 'bold',
-  },
-  txtTitle: {
-    fontSize: getFontXD(42),
-    color: R.colors.color777,
-    marginBottom: 5,
-  },
+    container: {
+        paddingHorizontal: 20,
+        paddingTop: 10,
+    },
+    footer: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        marginBottom: 10,
+        paddingHorizontal: 20,
+    },
+    btnLeft: {
+        width: 150,
+        height: 40,
+        justifyContent: 'center',
+        alignItems: 'center',
+        backgroundColor: R.colors.main,
+        borderRadius: 5,
+    },
+    btnRight: {
+        width: 150,
+        height: 40,
+        justifyContent: 'center',
+        alignItems: 'center',
+        backgroundColor: R.colors.main,
+        borderRadius: 5,
+    },
+    txtAdd: {
+        color: R.colors.white,
+        fontSize: getFontXD(46),
+        textTransform: 'uppercase',
+        fontWeight: 'bold',
+    },
+    txtTitle: {
+        fontSize: getFontXD(42),
+        color: R.colors.color777,
+        marginBottom: 5,
+    },
 });
 
 const mapStateToProps = (state) => {
-  return {
-    user: state.userReducer,
-  };
+    return {
+        user: state.userReducer,
+    };
 };
 export default connect(mapStateToProps, {
-  showLoading,
-  hideLoading,
+    showLoading,
+    hideLoading,
 })(MethodPayDetail);

src/Screens/MethodPay/SelectBankModal.js

@@ -245,7 +245,7 @@ const styles = StyleSheet.create({
     marginBottom: HEIGHTXD(300)
   },
   input: {
-    height: WIDTHXD(99),
+    height: WIDTHXD(110),
     width: getWidth() - WIDTHXD(90),
     borderRadius: WIDTHXD(20),
     backgroundColor: R.colors.gray5,

src/Screens/NewFeed/Media/MediaDetail.js

@@ -16,6 +16,7 @@ import {useNavigation} from '@react-navigation/native';
 import {MEDIADETAIL} from '../../../routers/ScreenNames';
 import {getDetailMedia} from '../../../apis/Functions/NewFeed';
 import I18n from '../../../helper/i18/i18n';
+import AppText from '../../../components/AppText';
 
 const Item = (props) => {
   const navigate = useNavigation();
@@ -82,7 +83,7 @@ const MediaDetail = (props) => {
             <Text style={styles.txtTitle}>{data.title}</Text>
           </View>
           <View style={styles.body}>
-            <Text style={styles.txtBig}>Video xem nhiều</Text>
+            <AppText style={styles.txtBig} i18nKey={('TopVideo')}/>
             <FlatList
               showsVerticalScrollIndicator={false}
               data={data.related_videos}

src/Screens/Setting/SettingView.js

@@ -8,6 +8,7 @@ import {changeLanguage} from '../../actions/language';
 import {connect} from 'react-redux';
 import AsyncStorage from '@react-native-community/async-storage';
 import KEY from '../../assets/AsynStorage';
+import I18n, {setLocation} from '../../helper/i18/i18n';
 const dataLanguage = [
   {
     value: 'vi',
@@ -58,6 +59,7 @@ const SettingView = (props) => {
               setLanguage(items.name);
               props.changeLanguage(items.value);
               AsyncStorage.setItem(KEY.LANGUAGE, items.value);
+              setLocation(I18n, items.value)
             }}
           />
         </View>

src/components/Header/HeaderHome.js

@@ -158,7 +158,7 @@ const HeaderHome = (props) => {
   const navigate = useNavigation();
 
   const copyToClipboard = () => {
-    Alert.alert(I18n.t('Notification'), 'Đã sao chép link giới thiệu!');
+    Alert.alert(I18n.t('Notification'), I18n.t('CopyLink'));
     Clipboard.setString(props.user.sponsor_url);
   };
 

src/components/Header/ModalOption.js

@@ -18,6 +18,8 @@ import R from '../../assets/R';
 import Block from '../Block';
 import DropDownPicker from 'react-native-dropdown-picker';
 import Icon from 'react-native-vector-icons/Ionicons';
+import I18n from '../../helper/i18/i18n';
+import AppText from '../AppText';
 // import DateTimePickerModal from 'react-native-modal-datetime-picker';
 
 const ModalOption = (props) => {
@@ -38,27 +40,27 @@ const ModalOption = (props) => {
                 alignItems: 'center',
               }}>
               <View />
-              <Text style={styles.modalText}>Lọc yêu cầu</Text>
+              <AppText style={styles.modalText} i18nKey={('RequestFilter')}/>
               <TouchableOpacity onPress={closeModal}>
                 <Icon name={'close-outline'} size={22} />
               </TouchableOpacity>
             </View>
 
             <View style={{flex: 1, paddingVertical: 10}}>
-              <Text style={styles.txtTitle}>Trạng thái</Text>
+              <AppText style={styles.txtTitle} i18nKey={('Status')}/>
               <DropDownPicker
                 zIndex={5}
                 items={[
-                  {label: 'Đang chờ', value: 1},
-                  {label: 'Thành công', value: 2},
-                  {label: 'Thất bại', value: 3},
+                  {label: I18n.t('Waiting'), value: 1},
+                  {label: I18n.t('Success'), value: 2},
+                  {label: I18n.t('Failed'), value: 3},
                 ]}
                 selectedLabelStyle={{
                   color: R.colors.black,
                   fontSize: getFontXD(42),
                 }}
                 containerStyle={{height: HEIGHT(40)}}
-                placeholder={'Chọn trạng thái yêu cầu'}
+                placeholder={I18n.t('SelectRequestStatus')}
                 style={{backgroundColor: '#fafafa', marginTop: 4}}
                 itemStyle={{
                   justifyContent: 'flex-start',
@@ -73,7 +75,7 @@ const ModalOption = (props) => {
               <View style={{marginTop: 10}}>
                 <Block row>
                   <Block>
-                    <Text style={styles.txtTitle}>Từ ngày:</Text>
+                    <AppText style={styles.txtTitle} i18nKey={('FromDate')}/>
                     <TouchableOpacity
                       onPress={() => setDatePickerVisibility(true)}
                       style={styles.datePicker}>
@@ -81,7 +83,7 @@ const ModalOption = (props) => {
                     </TouchableOpacity>
                   </Block>
                   <Block>
-                    <Text style={styles.txtTitle}>Đến ngày:</Text>
+                    <AppText style={styles.txtTitle} i18nKey={('ToDate')}/>
                     <TouchableOpacity
                       onPress={() => setDatePickerVisibility(true)}
                       style={styles.datePicker}>
@@ -107,7 +109,7 @@ const ModalOption = (props) => {
                 alignItems: 'center',
               }}>
               <TouchableOpacity onPress={onClick}>
-                <Text style={styles.txtBtn}>Đồng ý</Text>
+                <Text style={styles.txtBtn}>{I18n.t('Ok')}</Text>
               </TouchableOpacity>
             </View>
           </View>

src/components/Picker/ModalSearch.js

@@ -20,6 +20,9 @@ import {
   WIDTHXDICON,
 } from '../../Config/Functions';
 import R from '../../assets/R';
+import I18n from '../../helper/i18/i18n';
+import AppText from '../AppText';
+
 
 /**
  * Displays a popup search with a list of data that returns the value of the selected item
@@ -218,7 +221,7 @@ class ModalSearch extends Component {
                         />
                       ),
                       ListEmptyComponent: () => (
-                        <Text style={styles.itemText}>Không có dữ liệu</Text>
+                        <AppText style={styles.itemText} i18nKey={('NoData')}/>
                       ),
                     }}
                   />

src/helper/i18/i18n.js

 import I18n from 'react-native-i18n';
+import { I18nManager } from 'react-native';
 
 import en from './locales/en';
 import vi from './locales/vn';
@@ -7,5 +8,13 @@ I18n.translations = {
   en,
   vi,
 };
+I18n.fallbacks = true;
 
 export default I18n;
+export function setLocation(i18n, location) {
+  I18nManager.allowRTL(false);
+  const defaultLanguage = { languageTag: location, isRTL: false };
+  const { languageTag, isRTL } = defaultLanguage;
+  i18n.locale = languageTag;
+  return i18n
+}

src/helper/i18/locales/en.js

@@ -111,6 +111,81 @@ export default {
   Re_send: 'Re send',
   Copied: 'Copied!',
   Please_fill_in: 'Please fill in ',
+  RequestFilter: 'Request filter',
+  FromDate: 'From date:',
+  ToDate: 'To date:',
+  Failed: 'Failed',
+  SelectRequestStatus: 'Select request status',
+  TopVideo: 'Video watching a lot',
+  Delete: 'Delete',
+  SelectBank: 'Select Bank',
+  Branch: 'Branch',
+  OwnerAccountName: 'Owner account name',
+  AccountNumber: 'Account Number',
+  DeletePaymentMethodConfirm: 'Do you went delete this payment method?',
+  Forbidden: 'Forbidden',
+  OwnerAccount: 'Owner Account',
+  Add: 'Add',
   Note_cqg:
     'Note: The fee is calculated on a monthly basis and is applied until the end of the day 30/12/2021',
+  CardType: 'Card type',
+  BankCode: 'Bank code',
+  CardNumberOrAccount: 'Card number/Account',
+  Confirm: 'Confirm',
+  AmountOfMoney: 'Amount of money',
+  Note: 'Note',
+  SourceAccount: 'Source account',
+  ChooseBeneficiaryAccount: 'Choose the beneficiary account',
+  BeneficiaryAccount: 'the beneficiary account',
+  FromWallet: 'From wallet',
+  FromCQGAccount: 'From CQG account',
+  SettingPaymentMethodConfirm: 'You have not the payment method. Go to payment method setting?',
+  EnterEmailRequest: 'Please enter email',
+  EnterEmail: 'Enter email',
+  GetVerificationCode: 'Get the verification code',
+  BackToLogin: 'Back to login',
+  OTPValidFiveMinute: 'The OTP code is valid for 5 minutes',
+  EnterNewPassword: 'Please enter a new password',
+  EnterNewPasswordHint: 'Enter a new password',
+  ReEnterPassword: 'Reenter password',
+  ConfirmNewPassword: 'Confirm new password',
+  ChangePasswordSuccess: 'Change password success',
+  EnterAllInfo: 'Please complete all information ',
+  Date: 'Date',
+  ReviewService: 'Review service of DCV Invest',
+  VeryBad: 'Very bad',
+  Bad: 'Bad',
+  Normal: 'Normal',
+  Good: 'Good',
+  VeryGood: 'Very good',
+  ShareYourFeel: 'Share your feel about service',
+  UploadImage: 'Upload image',
+  BonusMoney: 'Bonus money',
+  Content: 'Content',
+  CopyLink: 'Copied referral link ',
+  CardAccount: 'Card account',
+  FirstLastName: 'First and last name',
+  Name: 'Name',
+  PhoneNumber: 'Phone number',
+  IdentityCard: 'Identity card',
+  Passport: 'Passport',
+  CitizenIdentification: 'Citizen identification',
+  IdentityCardFrontPhoto: 'Photo on front of ID card',
+  IdentityCitizenCardFrontPhoto: 'Photo on front of ID/Citizen card',
+  IdentityCardBackPhoto: 'Photo on the back of ID card',
+  IdentityCitizenCardBackPhoto: 'Photo on the back of ID/Citizen card',
+  SignPhoto: 'Sign photo',
+  EnterOTPRequest: 'Please enter OTP code',
+  OTPInvalid: 'OTP code invalid',
+  Username: 'Username',
+  EnterPassword: 'Enter password',
+  ConfirmPassword: 'Confirm password',
+  RegisterAccountSuccess: 'Register account success!',
+  EnterReferralCode: 'Enter a referral code if available',
+  Male2: 'Male',
+  Female: 'Female',
+  Bank: 'Bank',
+  OwnerAccount2: 'Owner account',
+  NothingChange: 'Nothing change',
+  Tradding: 'Tradding',
 };

src/helper/i18/locales/vn.js

+import {Text} from 'react-native';
+import React from 'react';
+
 export default {
   greeting: 'Xin chào!',
   home: 'Trang chủ',
@@ -114,4 +117,79 @@ export default {
   Re_send: 'Gửi lại',
   Copied: 'Đã sao chép!',
   Please_fill_in: 'Vui lòng điền ',
+  RequestFilter: 'Lọc yêu cầu',
+  FromDate: 'Từ ngày:',
+  ToDate: 'Đến ngày:',
+  Failed: 'Thất bại',
+  SelectRequestStatus: 'Chọn trạng thái yêu cầu',
+  TopVideo: 'Video xem nhiều',
+  Delete: 'Xóa',
+  SelectBank: 'Chọn ngân hàng',
+  Branch: 'Chi nhánh',
+  OwnerAccountName: 'Tên chủ tài khoản',
+  AccountNumber: 'Số tài khoản ngân hàng',
+  DeletePaymentMethodConfirm: 'Bạn có chắc chắn muốn xoá phương thức thanh toán',
+  Forbidden: 'Từ chối',
+  OwnerAccount: 'Chủ TK',
+  Add: 'Thêm',
+  CardType: 'Loại thẻ',
+  BankCode: 'Mã ngân hàng',
+  CardNumberOrAccount: 'Số thẻ/tài khoản',
+  Confirm: 'Xác minh',
+  AmountOfMoney: 'Số tiền',
+  Note: 'Ghi chú',
+  SourceAccount: 'Tài khoản nguồn',
+  ChooseBeneficiaryAccount: 'Chọn tài khoản hưởng thụ',
+  BeneficiaryAccount: 'tài khoản hưởng thụ',
+  FromWallet: 'Từ ví',
+  FromCQGAccount: 'Từ tài khoản CQG',
+  SettingPaymentMethodConfirm: 'Bạn chưa có phương thức thanh toán.Đi đến cài đặt phương thức thanh toán?',
+  EnterEmailRequest: 'Vui lòng nhập email',
+  EnterEmail: 'Nhập email',
+  GetVerificationCode: 'Lấy mã xác thực',
+  BackToLogin: 'Quay lại đăng nhập',
+  OTPValidFiveMinute: 'Mã OTP có hiệu lực trong 5 phút.',
+  EnterNewPassword: 'Vui lòng nhập mật khẩu mới',
+  EnterNewPasswordHint: 'Nhập mật khẩu mới',
+  ReEnterPassword: 'Nhập lại mật khẩu',
+  ConfirmNewPassword: 'Xác nhận lại mật khẩu mới',
+  ChangePasswordSuccess: 'Đổi mật khẩu thành công',
+  EnterAllInfo: 'Vui lòng điền đầy đủ thông tin!',
+  Date: 'Ngày',
+  ReviewService: 'Đánh giá dịch vụ của DCV Invest',
+  VeryBad: 'Rất kém',
+  Bad: 'Kém',
+  Normal: 'Bình thường',
+  Good: 'Tốt',
+  VeryGood: 'Rất tốt',
+  ShareYourFeel: 'Hãy chia sẻ cảm nhận về dịch vụ nhé',
+  UploadImage: 'Tải ảnh lên',
+  BonusMoney: 'Tiền thưởng',
+  Content: 'Content',
+  CopyLink: 'Đã sao chép link giới thiệu!',
+  CardAccount: 'Tài khoản thẻ',
+  FirstLastName: 'Họ và tên đệm',
+  Name: 'Tên',
+  PhoneNumber: 'Số điện thoại',
+  IdentityCard: 'Chứng minh nhân dân',
+  Passport: 'Hộ chiếu',
+  CitizenIdentification: 'Căn cước công dân',
+  IdentityCardFrontPhoto: 'Ảnh mặt trước CNND',
+  IdentityCitizenCardFrontPhoto: 'Ảnh mặt trước CNND/CCCD',
+  IdentityCardBackPhoto: 'Ảnh mặt sau CNND',
+  IdentityCitizenCardBackPhoto: 'Ảnh mặt sau CNND/CCCD',
+  SignPhoto: 'Ảnh chữ ký',
+  EnterOTPRequest: 'Vui lòng nhập mã OTP',
+  OTPInvalid: 'Mã OTP không đúng định dạng',
+  Username: 'Tên đăng nhập',
+  EnterPassword: 'Nhập mật khẩu',
+  ConfirmPassword: 'Xác nhận mật khẩu',
+  RegisterAccountSuccess: 'Đăng ký tài khoản thành công!',
+  EnterReferralCode: 'Nhập mã giới thiệu nếu có',
+  Male2: 'Nam',
+  Female: 'Nữ',
+  Bank: 'Ngân hàng',
+  OwnerAccount2: 'Chủ tài khoản',
+  NothingChange: 'Không có gì thay đổi',
+  Tradding: 'Giao dịch',
 };