update laguage

ios/Invest/Info.plist

@@ -41,6 +41,8 @@
 			</dict>
 		</dict>
 	</dict>
+	<key>NSCameraUsageDescription</key>
+	<string>Accect connect camera</string>
 	<key>NSLocationWhenInUseUsageDescription</key>
 	<string></string>
 	<key>NSPhotoLibraryUsageDescription</key>

src/Config/Functions.js

@@ -9,6 +9,7 @@ import {
 import moment from 'moment';
 import _ from 'lodash';
 import I18n from '../helper/i18/i18n';
+import AppText from '../components/AppText';
 
 import {DETAILNEW, NOTIFICATION} from '../routers/ScreenNames';
 import R from '../assets/R';
@@ -50,58 +51,58 @@ export const renderStatus = (status) => {
   switch (status) {
     case 2:
       return (
-        <Text
+        <AppText
+          i18nKey={'WaitVerification'}
           style={{
             color: '#F99D1D',
             fontSize: getFontXD(42),
             fontWeight: 'bold',
-          }}>
-          Chờ xác minh
-        </Text>
+          }}
+        />
       );
     case 3:
       return (
-        <Text
+        <AppText
+          i18nKey={'Verified'}
           style={{
             color: '#17B217',
             fontWeight: 'bold',
             fontSize: getFontXD(42),
-          }}>
-          Đã xác minh
-        </Text>
+          }}
+        />
       );
     case 5:
       return (
-        <Text
+        <AppText
+          i18nKey={'Request_Open_Account_CQG'}
           style={{
             color: '#F99D1D',
             fontWeight: 'bold',
             fontSize: getFontXD(42),
-          }}>
-          Yêu cầu mở TK CQG
-        </Text>
+          }}
+        />
       );
     case 6:
       return (
-        <Text
+        <AppText
+          i18nKey={'EnableCQG'}
           style={{
             color: R.colors.main,
             fontWeight: 'bold',
             fontSize: getFontXD(42),
-          }}>
-          Có tài khoản CQG
-        </Text>
+          }}
+        />
       );
     default:
       return (
-        <Text
+        <AppText
+          i18nKey={'NotVerified'}
           style={{
             color: '#929292',
             fontWeight: 'bold',
             fontSize: getFontXD(42),
-          }}>
-          Chưa xác minh
-        </Text>
+          }}
+        />
       );
   }
 };
@@ -116,11 +117,11 @@ export const confirmAlert = (title, callback) => {
     title,
     [
       {
-        text: 'Hủy',
+        text: I18n.t('Cancel'),
         style: 'cancel',
       },
       {
-        text: 'Đồng ý',
+        text: I18n.t(Ok),
         onPress: () => {
           callback();
         },
@@ -164,17 +165,17 @@ export const Gender = {
   female: 1,
 };
 export const converType = (type) => {
-  if (type == 'DEPOSIT') return 'Nạp tiền';
-  return 'Rút tiền';
+  if (type == 'DEPOSIT') return I18n.t('Deposit');
+  return I18n.t('Withdraw');
 };
 export const converStatus = (status) => {
   switch (status) {
     case 0:
-      return 'Chờ xử lý';
+      return I18n.t('Waiting_for_Progress');
     case 1:
-      return 'Thành công';
+      return I18n.t('Success');
     case 2:
-      return 'Huỷ';
+      return I18n.t('Cancel');
   }
 };
 

src/Screens/Account/PacrtCQG/ContainerTop.js

@@ -4,6 +4,7 @@ import HeaderBack from '../../../components/Header/HeaderBack';
 import CheckBox from '@react-native-community/checkbox';
 import R from '../../../assets/R';
 import {getFontXD, toPriceVnd} from '../../../Config/Functions';
+import AppText from '../../../components/AppText';
 
 const ContainerTop = (props) => {
   const {fee} = props;
@@ -23,9 +24,10 @@ const ContainerTop = (props) => {
                   alignItems: 'flex-end',
                 }}>
                 {e.price_package.price == 0 ? (
-                  <Text style={[styles.txtMoney, {color: '#18B918'}]}>
-                    Miễn phí
-                  </Text>
+                  <AppText
+                    i18nKey={'Free'}
+                    style={[styles.txtMoney, {color: '#18B918'}]}
+                  />
                 ) : (
                   <Text style={styles.txtMoney}>
                     {toPriceVnd(e.price_package.price)}

src/Screens/Account/PacrtCQG/Footer.js

@@ -2,20 +2,24 @@ import React, {Component} from 'react';
 import {View, Text, StyleSheet, TouchableOpacity, Linking} from 'react-native';
 import {getFontXD, toPriceVnd} from '../../../Config/Functions';
 import R from '../../../assets/R';
+import AppText from '../../../components/AppText';
+import I18n from '../../../helper/i18/i18n';
 
 const Footer = (props) => {
   return (
     <View style={{flex: 1, paddingHorizontal: 10, marginTop: 10}}>
       <View style={{flexDirection: 'row', marginVertical: 5}}>
-        <Text style={styles.txtTitle}>Bạn có thể mở tài khoản thử </Text>
+        <AppText i18nKey={'Open_account_demo'} style={styles.txtTitle} />
         <TouchableOpacity
           onPress={() =>
             Linking.openURL('https://mdemo.cqg.com/cqg/desktop/demorequest')
           }>
-          <Text style={styles.txtLink}>Tại đây.</Text>
+          <AppText i18nKey={'Here'} style={styles.txtLink} />
         </TouchableOpacity>
       </View>
-      <Text style={styles.txtTitle}>Tạm tính:{toPriceVnd(props.price)}</Text>
+      <Text style={styles.txtTitle}>
+        {I18n.t('Provisional')}:{toPriceVnd(props.price)}
+      </Text>
       <View
         style={{
           justifyContent: 'center',
@@ -26,7 +30,7 @@ const Footer = (props) => {
           onPress={props.onClick}
           onClick
           style={styles.btnSend}>
-          <Text style={styles.txtSend}>Mở tài khoản</Text>
+          <AppText i18nKey={'Open_account'} style={styles.txtSend} />
         </TouchableOpacity>
       </View>
     </View>

src/Screens/Account/PacrtCQG/PacketCQG.js

@@ -12,30 +12,7 @@ import {getListPacketCQG, openCQG} from '../../../apis/Functions/packetCQG';
 import {connect} from 'react-redux';
 import {showLoading, hideLoading} from '../../../actions/loadingAction';
 import {useNavigation} from '@react-navigation/native';
-
-const Item = () => {
-  const [isSelected, setSelection] = useState(false);
-  return (
-    <View style={styles.item}>
-      <View style={{flex: 1}}>
-        <Text>Mở tài khoản giao dịch CQG</Text>
-      </View>
-      <View
-        style={{
-          width: 120,
-          marginRight: 30,
-          alignItems: 'flex-end',
-        }}>
-        <Text style={[styles.txtMoney, {color: '#18B918'}]}>Miễn phí</Text>
-      </View>
-      <CheckBox
-        value={isSelected}
-        onValueChange={setSelection}
-        boxType={'square'}
-      />
-    </View>
-  );
-};
+import {saveUserToRedux} from '../../../actions/users';
 
 const PacketCQG = (props) => {
   const [listData, setListData] = useState([]);
@@ -60,6 +37,7 @@ const PacketCQG = (props) => {
     props.hideLoading();
     console.log(res);
     if (res.data.code == 200) {
+      props.saveUserToRedux(res.data.data);
       setTimeout(() => {
         Alert.alert(I18n.t('Notification'), res.data.message);
         navigate.goBack();
@@ -236,4 +214,5 @@ const mapStateToProps = (state) => {
 export default connect(mapStateToProps, {
   showLoading,
   hideLoading,
+  saveUserToRedux,
 })(PacketCQG);

src/Screens/AccountVerification/Tab/BankInfor.js

@@ -82,7 +82,6 @@ const BankInfor = (props) => {
   const onPress = async () => {
     const titles = ['loại thẻ', 'mã ngân hàng', 'số thẻ/tài khoản'];
     const index = checkFormatArray([acc_type, bank_no, account_no]);
-    console.log('Data', props.route.params.body);
 
     if (index === true) {
       const data = createFormData(
@@ -114,7 +113,10 @@ const BankInfor = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 

src/Screens/AccountVerification/Tab/GeneralInfor.js

@@ -41,7 +41,10 @@ const GeneralInfor = (props) => {
         address,
       });
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 

src/Screens/AccountVerification/Tab/Profile.js

@@ -119,39 +119,13 @@ const Profile = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 
-  // const onNextPress = () => {
-  //   const titles = [
-  //     'loại thẻ',
-  //     'số thẻ',
-  //     'ảnh CNND mặt trước',
-  //     'ảnh CMND mặt sau',
-  //     'ảnh chữ ký',
-  //   ];
-  //   const index = checkFormatArray([urlFont, urlBack, urlSign]);
-
-  //   if (index === true) {
-  //     props.navigation.navigate('BankInfor', {
-  //       body: {
-  //         cmnd,
-  //         card_type: type.value,
-  //         date_range: convertTime(date_range),
-  //         ...props.route.params,
-  //       },
-  //       img: {
-  //         urlFont,
-  //         urlBack,
-  //         urlSign,
-  //       },
-  //     });
-  //   } else {
-  //     Alert.alert('Vui lòng thêm ' + titles[index]);
-  //   }
-  // };
-
   return (
     <KeyboardAvoidingView
       behavior={Platform.Os === 'ios' ? 'padding' : 'height'}

src/Screens/AccountVerification/TabView/GeneralView.js

@@ -14,6 +14,7 @@ import {
 } from 'react-native';
 import R from '../../../assets/R';
 import moment from 'moment';
+import AppText from '../../../components/AppText';
 
 import TextField from '../../../components/Input/TextField';
 import TextMulti from '../../../components/Input/TextMulti';
@@ -47,14 +48,14 @@ const GeneralInfor = (props) => {
                 alignItems: 'center',
               }}>
               <View style={{flex: 1}}>
-                <Text
+                <AppText
+                  i18nKey={'Status'}
                   style={{
                     fontSize: getFontXD(42),
                     color: R.colors.color777,
                     marginBottom: 5,
-                  }}>
-                  Trạng thái
-                </Text>
+                  }}
+                />
               </View>
               <View style={{flex: 1}}>{renderStatus(props.user.status)}</View>
             </View>

src/Screens/Action/Transfer/TransferView.js

@@ -5,6 +5,7 @@ import TextField from '../../../components/Input/TextField';
 import TextMulti from '../../../components/Input/TextMulti';
 import Button from '../../../components/Button';
 import {HEIGHTXD} from '../../../Config/Functions';
+import AppText from '../../../components/AppText';
 const TransferView = (props) => {
   return (
     <View style={{flex: 1}}>
@@ -16,33 +17,15 @@ const TransferView = (props) => {
           justifyContent: 'center',
           alignItems: 'center',
         }}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
             fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
-      </View>
-      {/* <View style={{flex: 1, paddingHorizontal: 10, paddingTop: 10}}>
-        <TextField
-          onChangeText={(val) => consoele.log(val)}
-          title={'Số tiền'}
-        />
-        <TextField
-          onChangeText={(val) => consoele.log(val)}
-          title={'Phương thức nạp'}
-        />
-        <TextMulti
-          onChangeText={(val) => consoele.log(val)}
-          numberLines={3}
-          title={'Ghi chú'}
+          }}
         />
       </View>
-      <View style={styles.containerBtn}>
-        <Button title={'Chuyển tiền'} />
-      </View> */}
     </View>
   );
 };

src/Screens/Action/Wallet/WalletDeposit.js

@@ -56,7 +56,10 @@ const WalletDeposit = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
   return (

src/Screens/Action/Wallet/WalletWithdraw.js

@@ -72,10 +72,7 @@ const WalletWithdraw = (props) => {
         setData(newList);
       }
     } else {
-      Alert.alert(
-        I18n.t('Notification'),
-        'Không lấy được danh sách phương thức!',
-      );
+      Alert.alert(I18n.t('Notification'), I18n.t('Can_not_get_data'));
     }
   };
 
@@ -108,7 +105,10 @@ const WalletWithdraw = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 

src/Screens/Action/Withdraw/WithdrawView.js

@@ -5,6 +5,7 @@ import HeaderBack from '../../../components/Header/HeaderBack';
 import Item from './Item';
 import {getListWidthDraw} from '../../../apis/Functions/Widthdraw';
 import {connect} from 'react-redux';
+import I18n from '../../../helper/i18/i18n';
 
 const WithdrawView = (props) => {
   const [data, setData] = useState([]);
@@ -20,7 +21,7 @@ const WithdrawView = (props) => {
     if (res.data.code == 200 && res.data.data) {
       setData(res.data.data);
     } else {
-      alert('Không lấy được danh sách phương thức!');
+      Alert.alert(I18n.t('Notification'), I18n.t('Can_not_get_data'));
     }
   };
 

src/Screens/Authen/Authen.js

@@ -18,6 +18,7 @@ import Login from './Login';
 import Registor from './Registor';
 import {ScrollView} from 'react-native-gesture-handler';
 import R from '../../assets/R';
+import I18n from '../../helper/i18/i18n';
 
 const {width, height} = Dimensions.get('window');
 
@@ -51,12 +52,12 @@ const Authen = (props) => {
               <Tab.Screen
                 name="LOGIN"
                 component={Login}
-                options={{tabBarLabel: 'Đăng nhập'}}
+                options={{tabBarLabel: I18n.t('Login')}}
               />
               <Tab.Screen
                 name="REGISTOR"
                 component={Registor}
-                options={{tabBarLabel: 'Đăng ký'}}
+                options={{tabBarLabel: I18n.t('Register')}}
               />
             </Tab.Navigator>
           </ImageBackground>

src/Screens/Authen/ConfirmOTP.js

@@ -22,6 +22,7 @@ import {NEWPASSWORD} from '../../routers/ScreenNames';
 import {verifyOTPApi} from '../../apis/Functions/users';
 import {useNavigation} from '@react-navigation/native';
 import I18n from '../../helper/i18/i18n';
+import AppText from '../../components/AppText';
 
 import {showLoading, hideLoading} from '../../actions/loadingAction';
 import {connect} from 'react-redux';
@@ -73,7 +74,7 @@ const ConfirmOTP = (propsa) => {
         <View style={{height: 20}} />
 
         <View style={styles.wrap}>
-          <Text style={styles.txtTitle}>Mã xác thực:</Text>
+          <AppText i18nKey={'Verify_code'} style={styles.txtTitle} />
           <View style={styles.containerCode}>
             <CodeField
               ref={ref}
@@ -100,13 +101,13 @@ const ConfirmOTP = (propsa) => {
       </View>
       <View style={styles.footer}>
         <TouchableOpacity onPress={confirm} style={styles.btn}>
-          <Text style={styles.txtBtn}>Tiếp tục</Text>
+          <AppText i18nKey={'Continue'} style={styles.txtBtn} />
         </TouchableOpacity>
         <TouchableOpacity
           style={styles.wrapFooter}
-          onPress={() => console.log('Hello')}>
+          onPress={() => navigate.goBack()}>
           <Text style={styles.txtNote}>Mã OTP có hiệu lực trong 5 phút.</Text>
-          <Text style={styles.txtSend}>Gửi lại</Text>
+          <AppText i18nKey={'Re_send'} style={styles.txtSend} />
         </TouchableOpacity>
       </View>
     </View>

src/Screens/Authen/Login.js

@@ -27,6 +27,7 @@ import {saveUserToRedux} from '../../actions/users';
 import {connect} from 'react-redux';
 import messaging from '@react-native-firebase/messaging';
 import I18n from '../../helper/i18/i18n';
+import AppText from '../../components/AppText';
 
 const Login = (props) => {
   const {navigation} = props;
@@ -91,7 +92,10 @@ const Login = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 
@@ -105,14 +109,14 @@ const Login = (props) => {
       }}>
       <InputIcon
         icon={R.images.iconUser3}
-        title={'Tên đăng nhập'}
-        placeholder={'Nhập tên đăng nhập'}
+        title={'Email'}
+        placeholder={'Nhập email'}
         onChangeText={(val) => setEmail(val)}
         value={email}
       />
       <InputIcon
         icon={R.images.iconLock}
-        title={'Mật khẩu'}
+        title={'Password'}
         placeholder={'Nhập mật khẩu'}
         isPassWord={true}
         onChangeText={(val) => setPass(val)}
@@ -121,7 +125,7 @@ const Login = (props) => {
       <TouchableOpacity
         onPress={() => navigate.navigate(CONFIRMEMAIL)}
         style={styles.forgotView}>
-        <Text style={styles.txtTitle}>Quên mật khẩu?</Text>
+        <AppText i18nKey={'ForgotPassword'} style={styles.txtTitle} />
       </TouchableOpacity>
 
       <View
@@ -132,17 +136,17 @@ const Login = (props) => {
         <TouchableOpacity
           onPress={() => onSubmitLogin(email, pass)}
           style={styles.wrapLogin}>
-          <Text style={styles.txtLogin}>Đăng nhập</Text>
+          <AppText i18nKey={'Login'} style={styles.txtLogin} />
           <Image source={R.images.iconRight1} style={styles.imgIcon} />
         </TouchableOpacity>
 
         <View style={styles.row}>
-          <Text style={styles.txtTitle}>Bạn chưa có tài khoản?</Text>
+          <AppText i18nKey={'Have_account'} style={styles.txtTitle} />
           <TouchableOpacity
             onPress={() => {
               navigation.navigate('REGISTOR');
             }}>
-            <Text style={styles.txtRegistor}>Đăng ký</Text>
+            <AppText i18nKey={'Register'} style={styles.txtRegistor} />
           </TouchableOpacity>
         </View>
       </View>

src/Screens/Authen/Registor.js

@@ -15,6 +15,7 @@ import {showLoading, hideLoading} from '../../actions/loadingAction';
 import {connect} from 'react-redux';
 import {registorApi} from '../../apis/Functions/users';
 import I18n from '../../helper/i18/i18n';
+import AppText from '../../components/AppText';
 
 const Registor = (props) => {
   const {navigation} = props;
@@ -61,7 +62,10 @@ const Registor = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 
@@ -75,28 +79,28 @@ const Registor = (props) => {
       }}>
       <InputIcon
         icon={R.images.iconEmail}
-        title={'Email đăng ký'}
+        title={'Email'}
         placeholder={'Nhập email'}
         onChangeText={(val) => setEmail(val)}
       />
 
       <InputIcon
         icon={R.images.iconLock}
-        title={'Mật khẩu'}
+        title={'Password'}
         placeholder={'Nhập mật khẩu'}
         onChangeText={(val) => setPassword(val)}
         isPassWord={true}
       />
       <InputIcon
         icon={R.images.iconLock}
-        title={'Nhập lại mật khẩu'}
+        title={'Confirm_pass'}
         placeholder={'Nhập mật khẩu'}
         onChangeText={(val) => setPasswordConfirm(val)}
         isPassWord={true}
       />
       <InputIcon
         icon={R.images.iconIntroduct}
-        title={'Mã giới thiệu'}
+        title={'Code_introduce'}
         placeholder={'Nhập mã giới thiệu nếu có'}
         onChangeText={(val) => setSponsor_id(val)}
         isPassWord={true}
@@ -108,17 +112,17 @@ const Registor = (props) => {
           alignItems: 'center',
         }}>
         <TouchableOpacity onPress={registorClick} style={styles.wrapLogin}>
-          <Text style={styles.txtLogin}>Đăng ký</Text>
+          <AppText i18nKey={'Register'} style={styles.txtLogin} />
           <Image source={R.images.iconRight1} style={styles.imgIcon} />
         </TouchableOpacity>
 
         <View style={styles.row}>
-          <Text style={styles.txtTitle}>Bạn đã có tài khoản?</Text>
+          <AppText i18nKey={'Account_already'} style={styles.txtTitle} />
           <TouchableOpacity
             onPress={() => {
               navigation.navigate('LOGIN');
             }}>
-            <Text style={styles.txtRegistor}>Đăng nhập</Text>
+            <AppText i18nKey={'Login'} style={styles.txtRegistor} />
           </TouchableOpacity>
         </View>
       </View>

src/Screens/Home/Home.js

@@ -11,7 +11,6 @@ import {AccountVerification, PACKETCQG} from '../../routers/ScreenNames';
 const Home = (props) => {
   const [data, setData] = useState({total_deposit: 0, total_withdraw: 0});
 
-  const navigate = useNavigation();
   useEffect(() => {
     getData();
   }, []);
@@ -20,7 +19,7 @@ const Home = (props) => {
     if (res.data.code == 200 && res.data.data) {
       setData(res.data.data);
     } else {
-      Alert.alert(I18n.t('Notification'), 'Không lấy được thông tin!');
+      Alert.alert(I18n.t('Notification'), I18n.t('Can_not_get_data'));
     }
   };
 

src/Screens/Home/HomeView.js

@@ -25,9 +25,7 @@ const HomeView = (props) => {
           <View style={styles.row}>
             <View style={styles.row}>
               <View style={styles.itemMenu}>
-                <AppText i18nKey={'Deposit'} style={styles.txtTitle}>
-                  Nạp tiền
-                </AppText>
+                <AppText i18nKey={'Deposit'} style={styles.txtTitle} />
                 <Text style={styles.txtMoney}>
                   {' '}
                   {total_deposit == 0 ? 0 : toPriceVnd(total_deposit)} Đ{' '}
@@ -37,9 +35,7 @@ const HomeView = (props) => {
                 style={{width: 0.5, backgroundColor: R.colors.borderGray}}
               />
               <View style={styles.itemMenu}>
-                <AppText i18nKey={'Withdraw'} style={styles.txtTitle}>
-                  Rút tiền
-                </AppText>
+                <AppText i18nKey={'Withdraw'} style={styles.txtTitle} />
                 <Text style={styles.txtMoney}>
                   {' '}
                   {total_withdraw == 0 ? 0 : toPriceVnd(total_withdraw)} Đ{' '}
@@ -50,16 +46,12 @@ const HomeView = (props) => {
           <View style={{height: 0.5, backgroundColor: R.colors.borderGray}} />
           <View style={styles.row}>
             <View style={styles.itemMenu}>
-              <AppText i18nKey={'Rose'} style={styles.txtTitle}>
-                Hoa hồng
-              </AppText>
+              <AppText i18nKey={'Rose'} style={styles.txtTitle} />
               <Text style={styles.txtMoney1}>0 Đ </Text>
             </View>
             <View style={{width: 0.5, backgroundColor: R.colors.borderGray}} />
             <View style={styles.itemMenu}>
-              <AppText i18nKey={'Profit'} style={styles.txtTitle}>
-                Lợi nhuận
-              </AppText>
+              <AppText i18nKey={'Profit'} style={styles.txtTitle} />
               <Text style={styles.txtMoney1}>0 Đ</Text>
             </View>
           </View>

src/Screens/Home/Menu.js

-import React, {useEffect, useState} from 'react';
-import {
-  View,
-  Text,
-  Image,
-  StatusBar,
-  StyleSheet,
-  SafeAreaView,
-  ImageBackground,
-  TouchableOpacity,
-  Platform,
-  Alert,
-} from 'react-native';
-import R from '../../assets/R';
-import {getFontXD, HEIGHT, WIDTHXD} from '../../Config/Functions';
-import LinearGradient from 'react-native-linear-gradient';
-import {connect} from 'react-redux';
-import {HEIGHTXD, toPriceVnd} from '../../Config/Functions';
-import Clipboard from '@react-native-clipboard/clipboard';
-import I18n from '../../helper/i18/i18n';
-
-import {useNavigation} from '@react-navigation/native';
-import {
-  WITHDRAW,
-  DEPOSIT,
-  CHOOSEMETHOD,
-  TRANSFER,
-  HISTORY,
-  PROFILE,
-} from '../../routers/ScreenNames';
-
-const HeaderHome = (props) => {
-  const navigate = useNavigation();
-  const [sponsorID, setSponsorID] = useState('sponsorIDlink');
-
-  const copyToClipboard = () => {
-    Alert.alert(I18n.t('Notification'), 'Đã sao chép!');
-    Clipboard.setString(sponsorID);
-  };
-
-  return (
-    <View style={{justifyContent: 'center', alignItems: 'center'}}>
-      <View style={styles.containerTop}>
-        <View style={styles.containerInfor}>
-          <Image source={R.images.avartar} style={styles.imgAvatar} />
-          <View style={styles.wrapRight}>
-            <TouchableOpacity onPress={() => navigate.navigate(PROFILE)}>
-              <Text style={styles.txtName}>Vu Khac Minh</Text>
-            </TouchableOpacity>
-
-            <View style={styles.row1}>
-              <Text style={styles.txtlink}>{sponsorID}</Text>
-              <TouchableOpacity onPress={copyToClipboard}>
-                <Image source={R.images.iconCopy} style={styles.imgIconCopy} />
-              </TouchableOpacity>
-            </View>
-
-            <View style={styles.row}>
-              <Text style={styles.txtMoney}> {toPriceVnd(1000000)}</Text>
-              <Text style={styles.txtTitle}> Đ</Text>
-            </View>
-          </View>
-        </View>
-        <View style={styles.containerMenu}>
-          <TouchableOpacity
-            onPress={() => navigate.navigate(CHOOSEMETHOD)}
-            style={styles.wraper}>
-            <Image style={styles.imgIcon} source={R.images.iconRecharge} />
-            <Text style={styles.txt}>Nạp tiền</Text>
-          </TouchableOpacity>
-
-          <TouchableOpacity
-            onPress={() => navigate.navigate(WITHDRAW)}
-            style={styles.wraper}>
-            <Image style={styles.imgIcon} source={R.images.iconWithdrawal} />
-            <Text style={styles.txt}>Rút tiền</Text>
-          </TouchableOpacity>
-          <TouchableOpacity
-            onPress={() => navigate.navigate(TRANSFER)}
-            style={styles.wraper}>
-            <Image style={styles.imgIcon} source={R.images.iconTransfer} />
-            <Text style={styles.txt}>Chuyển khoản</Text>
-          </TouchableOpacity>
-          <TouchableOpacity
-            onPress={() => navigate.navigate(HISTORY)}
-            style={styles.wraper}>
-            <Image style={styles.imgIcon} source={R.images.iconHistory} />
-            <Text style={styles.txt}>Lịch sử</Text>
-          </TouchableOpacity>
-        </View>
-      </View>
-    </View>
-  );
-};
-
-const mapStateToProps = (state) => {
-  return {
-    user: state.userReducer,
-  };
-};
-
-export default connect(mapStateToProps, {})(HeaderHome);
-
-const styles = StyleSheet.create({
-  img: {
-    height: Platform.OS == 'ios' ? HEIGHTXD(728) : HEIGHTXD(808),
-    width: '100%',
-
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  containerTop: {
-    height: HEIGHTXD(856),
-    width: '90%',
-    backgroundColor: 'white',
-    borderRadius: 10,
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 1,
-    },
-    shadowOpacity: 0.25,
-    shadowRadius: 2.84,
-    elevation: 3,
-  },
-  containerMenu: {
-    justifyContent: 'space-between',
-    alignItems: 'center',
-    flexDirection: 'row',
-    padding: 10,
-  },
-  wraper: {
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  imgIcon: {
-    width: WIDTHXD(134),
-    height: HEIGHTXD(134),
-    marginBottom: 10,
-    resizeMode: 'contain',
-  },
-  imgIconCopy: {
-    width: WIDTHXD(134),
-    height: HEIGHTXD(134),
-
-    resizeMode: 'contain',
-  },
-  txt: {
-    fontSize: getFontXD(36),
-    color: R.colors.txtMain,
-  },
-  txtName: {
-    fontSize: getFontXD(52),
-    color: '#00359C',
-  },
-  txtlink: {
-    fontSize: getFontXD(42),
-    color: '#A2A2A2',
-  },
-  imgAvatar: {
-    width: WIDTHXD(240),
-    height: WIDTHXD(240),
-    borderRadius: WIDTHXD(120),
-  },
-  txtMoney: {
-    fontSize: getFontXD(62),
-    color: '#FFB721',
-    marginVertical: 5,
-    fontWeight: 'bold',
-  },
-  txtTitle: {
-    fontSize: getFontXD(42),
-    color: '#A2A2A2',
-    fontWeight: 'bold',
-    marginTop: 5,
-    marginLeft: 5,
-  },
-  wrapRight: {
-    flex: 1,
-    paddingHorizontal: 20,
-  },
-  containerInfor: {
-    flex: 1,
-    justifyContent: 'center',
-    alignItems: 'center',
-    borderBottomWidth: 1,
-    borderBottomColor: '#EDEDF1',
-    flexDirection: 'row',
-    paddingHorizontal: 20,
-  },
-  row: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    marginTop: 5,
-  },
-  row1: {
-    flexDirection: 'row',
-    justifyContent: 'space-between',
-    alignItems: 'center',
-  },
-});

src/Screens/LegalDocument/Business.js

@@ -4,6 +4,7 @@ import R from '../../assets/R';
 import HeaderBack from '../../components/Header/HeaderBack';
 import {getFontXD} from '../../Config/Functions';
 import {useNavigation} from '@react-navigation/native';
+import AppText from '../../components/AppText';
 
 const Business = (props) => {
   const navigate = useNavigation();
@@ -11,14 +12,14 @@ const Business = (props) => {
     <View style={{flex: 1}}>
       <HeaderBack title={'GeneralBusiness'} />
       <View style={styles.container}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
             fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
+          }}
+        />
       </View>
     </View>
   );

src/Screens/LegalDocument/Customer.js

@@ -4,6 +4,7 @@ import R from '../../assets/R';
 import HeaderBack from '../../components/Header/HeaderBack';
 import {getFontXD} from '../../Config/Functions';
 import {useNavigation} from '@react-navigation/native';
+import AppText from '../../components/AppText';
 
 const Customer = (props) => {
   const navigate = useNavigation();
@@ -11,14 +12,14 @@ const Customer = (props) => {
     <View style={{flex: 1}}>
       <HeaderBack title={'Customer'} />
       <View style={styles.container}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
             fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
+          }}
+        />
       </View>
     </View>
   );

src/Screens/LegalDocument/Partner.js

@@ -4,6 +4,7 @@ import R from '../../assets/R';
 import HeaderBack from '../../components/Header/HeaderBack';
 import {getFontXD} from '../../Config/Functions';
 import {useNavigation} from '@react-navigation/native';
+import AppText from '../../components/AppText';
 
 const Partner = (props) => {
   const navigate = useNavigation();
@@ -11,14 +12,14 @@ const Partner = (props) => {
     <View style={{flex: 1}}>
       <HeaderBack title={'Partnership'} />
       <View style={styles.container}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
             fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
+          }}
+        />
       </View>
     </View>
   );

src/Screens/Menu/BonusTeam/BonusTeam.js

@@ -3,6 +3,7 @@ import {View, Text} from 'react-native';
 import {getFontXD} from '../../../Config/Functions';
 import HeaderBack from '../../../components/Header/HeaderBack';
 import PickerSearch from '../../../components/Picker/PickerSearch';
+import AppText from '../../../components/AppText';
 
 const BonusTeam = (props) => {
   return (
@@ -15,15 +16,14 @@ const BonusTeam = (props) => {
           justifyContent: 'center',
           alignItems: 'center',
         }}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
-            fontSize: getFontXD(52),
+            fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
-
+          }}
+        />
         {/* <PickerSearch
           findData={() => {
             console.log('Call api');

src/Screens/Menu/Payments/Payments.js

@@ -2,22 +2,7 @@ import React from 'react';
 import {View, FlatList, Text} from 'react-native';
 import HeaderBack from '../../../components/Header/HeaderBack';
 import Item from './Item';
-
-const data = [
-  {
-    id: '1',
-    time: '20/02/2021',
-    money: 5000000,
-    content: 'Mua kim loại ở sàn CBOT',
-  },
-  {
-    id: '2',
-    time: '20/02/2021',
-    money: 8000000,
-    content:
-      'Nhà đầu tư vẫn thu được lợi nhuận ngay cả khi thị trường đi xuống do có thể bán trước',
-  },
-];
+import AppText from '../../../components/AppText';
 
 const Payments = (props) => {
   return (
@@ -25,14 +10,14 @@ const Payments = (props) => {
       <HeaderBack isWhite={false} title={'Payments'} />
 
       <View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
             fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
+          }}
+        />
       </View>
       {/* <FlatList
         keyExtractor={(item) => item.id}

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

@@ -57,7 +57,10 @@ const GeneralInfor = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 

src/Screens/Menu/Rose/Rose.js

@@ -6,59 +6,6 @@ import TextMoney from '../../../components/Input/InputMoney';
 import {toPriceVnd, numberFormat} from '../../../Config/Functions';
 import {changeLanguage} from '../../../actions/language';
 import {connect} from 'react-redux';
-const data = [
-  {
-    id: '1',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 10000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '2',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 2000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '3',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 3000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '4',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 4000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '5',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 9000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-];
-
 import AppText from '../../../components/AppText';
 
 const Rose = (props) => {
@@ -73,14 +20,14 @@ const Rose = (props) => {
       <AppText i18nKey={'SetLanguage'}></AppText>
 
       <View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
             fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
+          }}
+        />
       </View>
       {/* <View style={{flex: 1}}>
         <FlatList

src/Screens/MethodPay/AddMethod.js

@@ -48,10 +48,7 @@ const AddMethodPay = (props) => {
     if (res.data.code == 200 && res.data.data) {
       setData(res.data.data);
     } else {
-      Alert.alert(
-        I18n.t('Notification'),
-        'Không lấy được danh sách ngân hàng!',
-      );
+      Alert.alert(I18n.t('Notification'), I18n.t('Can_not_get_data'));
     }
   };
 
@@ -89,7 +86,10 @@ const AddMethodPay = (props) => {
         }, 500);
       }
     } else {
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
     }
   };
 

src/Screens/MethodPay/MethodPay.js

@@ -3,6 +3,7 @@ import React, {useState, useEffect} from 'react';
 import MethodPayView from './MethodPayView';
 import {getListWidthDraw} from '../../apis/Functions/Widthdraw';
 import {useNavigation} from '@react-navigation/native';
+import I18n from '../../helper/i18/i18n';
 
 const MethodPay = (props) => {
   const [data, setData] = useState([]);
@@ -25,7 +26,7 @@ const MethodPay = (props) => {
     if (res.data.code == 200 && res.data.data) {
       setData(res.data.data);
     } else {
-      alert('Không lấy được danh sách phương thức thanh toán!');
+      Alert.alert(I18n.t('Notification'), I18n.t('Can_not_get_data'));
     }
   };
 

src/Screens/MethodPay/MethodPayDetail.js

@@ -73,7 +73,10 @@ const MethodPayDetail = (props) => {
         Alert.alert(I18n.t('Notification'), 'Không có gì thay đổi');
       }
     } else
-      Alert.alert(I18n.t('Notification'), 'Vui lòng điền ' + titles[index]);
+      Alert.alert(
+        I18n.t('Notification'),
+        I18n.t('Please_fill_in') + titles[index],
+      );
   };
 
   const onRemove = async () => {

src/Screens/Notification/Item.js

@@ -10,29 +10,26 @@ import {
 import {getFontXD, HEIGHTXD, WIDTHXD, toPriceVnd} from '../../Config/Functions';
 import R from '../../assets/R';
 import Block from '../../components/Block';
-import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
 
 const Item = (props) => {
   const {item} = props;
   return (
-    <TouchableOpacity onPress={() => Alert.alert('Hello')}>
-      <View style={styles.container}>
-        <Block flex={1} row>
-          <View style={styles.wrapLeft} />
-          <View style={styles.wrapDate}>
-            <Image source={R.images.iconRecharge} style={styles.imgIcon} />
+    <View style={styles.container}>
+      <Block flex={1} row>
+        <View style={styles.wrapLeft} />
+        <View style={styles.wrapDate}>
+          <Image source={R.images.iconRecharge} style={styles.imgIcon} />
+        </View>
+        <Block padding={[5, 10]} space={'between'} flex={1}>
+          <View style={{justifyContent: 'center', flex: 1}}>
+            <Text numberOfLines={2} style={styles.txtBlack}>
+              {item.body}
+            </Text>
           </View>
-          <Block padding={[5, 10]} space={'between'} flex={1}>
-            <View style={{justifyContent: 'center', flex: 1}}>
-              <Text numberOfLines={2} style={styles.txtBlack}>
-                Nạp tiền thành công với số lượng: 750.000
-              </Text>
-            </View>
-            <Text style={styles.txt}>10:52 09/04/2021</Text>
-          </Block>
+          <Text style={styles.txt}>{item.pushed_at}</Text>
         </Block>
-      </View>
-    </TouchableOpacity>
+      </Block>
+    </View>
   );
 };
 

src/Screens/Payment/Payment.js

@@ -18,40 +18,6 @@ import create_payment_link from './setup';
 const Payment = (props) => {
   const [text, setText] = useState('OpenSDK');
 
-  // console.log('Link create payment');
-
-  // useEffect(() => {
-  //   // mở sdk
-  //   eventEmitter.addListener('PaymentBack', (e) => {
-  //     console.log('Sdk back!');
-
-  //     // Đã available trên cả ios, android
-  //     if (e) {
-  //       switch (e.resultCode) {
-  //         case 0:
-  //           console.log('Sdk closed');
-  //           break;
-  //         case -1:
-  //           console.log('Người dùng nhấn back từ sdk để quay lại');
-  //           break;
-  //         case 10: //ios
-  //           console.log(
-  //             'Người dùng nhấn chọn thanh toán qua app thanh toán (Mobile Banking, Ví...)',
-  //           );
-  //           break;
-  //         case 99:
-  //           console.log(
-  //             'Người dùng nhấn back từ trang thanh toán thành công khi thanh toán qua thẻ khi gọi đến http://sdk.merchantbackapp',
-  //           );
-  //       }
-  //     }
-  //   });
-  //   return () => {
-  //     // khi tắt sdk
-  //     eventEmitter.removeAllListeners('PaymentBack');
-  //   };
-  // }, []);
-
   return (
     <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
       <TouchableOpacity

src/Screens/ServiceCustomer/ServiceCustomerView.js

 import React from 'react';
 import {View, Text} from 'react-native';
+import AppText from '../../components/AppText';
 
 import HeaderBack from '../../components/Header/HeaderBack';
 
@@ -14,14 +15,14 @@ const ServiceCustomerView = (props) => {
           justifyContent: 'center',
           alignItems: 'center',
         }}>
-        <Text
+        <AppText
+          i18nKey={'Features_develop'}
           style={{
             fontSize: 18,
             fontWeight: 'bold',
             textAlign: 'center',
-          }}>
-          Tính năng đang được phát triển, vui lòng quay lại sau!
-        </Text>
+          }}
+        />
       </View>
     </View>
   );

src/Screens/Setting/SettingView.js

-import React, {useState} from 'react';
+import React, {useEffect, useState} from 'react';
 import {View, Text, Switch, StyleSheet} from 'react-native';
 import HeaderBack from '../../components/Header/HeaderBack';
-import Block from '../../components/Block';
 import {getFontXD} from '../../Config/Functions';
 import PickerItem from '../../components/Picker/PickerItem';
-
-const dataTest = [
+import AppText from '../../components/AppText';
+import {changeLanguage} from '../../actions/language';
+import {connect} from 'react-redux';
+import AsyncStorage from '@react-native-community/async-storage';
+import KEY from '../../assets/AsynStorage';
+const dataLanguage = [
   {
-    value: '1',
+    value: 'vi',
     name: 'Vietnamese',
   },
   {
-    value: '2',
+    value: 'en',
     name: 'English',
   },
 ];
@@ -19,12 +22,21 @@ const dataTest = [
 const SettingView = (props) => {
   const [isEnabled, setIsEnabled] = useState(true);
   const toggleSwitch = () => setIsEnabled((previousState) => !previousState);
-  const [language, setLanguage] = useState(dataTest[0].name);
+  const [language, setLanguage] = useState();
+  useEffect(() => {
+    convertLanguage();
+  }, []);
+
+  const convertLanguage = () => {
+    const temp = dataLanguage.filter((e) => e.value == props.language.language);
+    setLanguage(temp[0].name);
+  };
+
   return (
     <View style={{flex: 1}}>
       <HeaderBack title={'Setting'} />
       <View style={{flex: 1, padding: 10}}>
-        <View style={styles.row}>
+        {/* <View style={styles.row}>
           <Text style={styles.txtTitle}>Bật thông báo</Text>
           <Switch
             trackColor={{false: '#DBDBDB', true: '#1C6AF6'}}
@@ -33,28 +45,27 @@ const SettingView = (props) => {
             onValueChange={toggleSwitch}
             value={isEnabled}
           />
-        </View>
+        </View> */}
 
         <View style={styles.row}>
-          <Text style={styles.txtTitle}>Ngôn ngữ</Text>
+          <AppText i18nKey={'Language'} style={styles.txtTitle} />
           <PickerItem
-            defaultValue={language}
             width={200}
+            defaultValue={language}
             value={language}
-            data={dataTest}
+            data={dataLanguage}
             onValueChange={(value, items) => {
               setLanguage(items.name);
+              props.changeLanguage(items.value);
+              AsyncStorage.setItem(KEY.LANGUAGE, items.value);
             }}
           />
         </View>
       </View>
-
-      <Text>SettingView 1 screen</Text>
     </View>
   );
 };
 
-export default SettingView;
 const styles = StyleSheet.create({
   txtTitle: {
     fontSize: getFontXD(46),
@@ -68,3 +79,11 @@ const styles = StyleSheet.create({
     marginBottom: 20,
   },
 });
+
+const mapStateToProps = (state) => {
+  return {
+    language: state.languageReducer,
+  };
+};
+
+export default connect(mapStateToProps, {changeLanguage})(SettingView);

src/assets/AsynStorage.js

@@ -2,6 +2,7 @@ const KEY = {
   TOKEN: '@TOKEN',
   FIREBASE: '@Firebase',
   ACCOUNT: '@ACCOUNT',
+  LANGUAGE: '@LANGUAGE',
 };
 
 export default KEY;

src/components/Input/InputIcon.js

@@ -19,7 +19,7 @@ const InputIcon = (props) => {
     <View style={container}>
       <Image source={icon} style={iconImg} />
       <View style={wrapRight}>
-        <AppText i18nKey={title}> </AppText>
+        <AppText i18nKey={title} />
         <TextInput
           maxLength={maxLength}
           autoCapitalize="none"

src/components/NoInternet.js

@@ -3,13 +3,13 @@ import {View, Text, StyleSheet, TouchableOpacity} from 'react-native';
 import NetInfo from '@react-native-community/netinfo';
 import FastImage from 'react-native-fast-image';
 import R from '../assets/R';
+import AppText from '../components/AppText';
 
 const NoInternetComponent = (props) => {
   const [isConnected, setConnect] = useState(true);
 
   useEffect(() => {
     const unsubscribe = NetInfo.addEventListener((state) => {
-      console.log(state);
       setConnect(state.isConnected);
     });
     return unsubscribe;
@@ -21,8 +21,8 @@ const NoInternetComponent = (props) => {
         source={R.images.bg_cannot_connect}
         style={styles.imageStyle}
       />
-      <Text style={styles.textStyle}>Không có kết nốt Internet</Text>
-      <Text style={styles.subTextStyle}>Kiểm tra lại đường truyền!</Text>
+      <AppText i18nKey={'No_Internet'} style={styles.textStyle} />
+      <AppText i18nKey={'Check_Internet_Connect'} style={styles.subTextStyle} />
       <TouchableOpacity
         onPress={() => {
           setTimeout(() => {
@@ -31,7 +31,10 @@ const NoInternetComponent = (props) => {
             });
           }, 3000);
         }}>
-        <Text style={{alignSelf: 'center', color: 'blue'}}>Thử lại</Text>
+        <AppText
+          i18nKey={'Retry'}
+          style={{alignSelf: 'center', fontSize: 20, color: 'blue'}}
+        />
       </TouchableOpacity>
     </View>
   ) : (

src/components/Picker/PickerImg.js

@@ -13,6 +13,7 @@ import Icon from 'react-native-vector-icons/AntDesign';
 import Modal from 'react-native-modal';
 import Block from '../Block';
 import ImagePicker from 'react-native-image-crop-picker';
+import AppText from '../AppText';
 const options = {
   title: 'Select Avatar',
   customButtons: [{name: 'fb', title: 'Choose Photo from Facebook'}],
@@ -73,29 +74,29 @@ const PickerImg = (props) => {
         </TouchableWithoutFeedback>
 
         <View style={styles.containerSelect}>
-          <Text
+          <AppText
+            i18nKey={'Select_source_image'}
             style={{
               textAlign: 'center',
               fontSize: getFontXD(42),
               fontWeight: 'bold',
               color: '#1473E6',
-            }}>
-            Chọn nguồn lấy ảnh
-          </Text>
+            }}
+          />
 
           <View style={styles.line} />
           <Block row space={'around'} center>
             <TouchableOpacity style={styles.selectionImg} onPress={onCapture}>
               <Image style={styles.imgIcon} source={R.images.iconCamera} />
 
-              <Text style={styles.txtTitleBtn}>Chụp ảnh</Text>
+              <AppText i18nKey={'Take_photo'} style={styles.txtTitleBtn} />
             </TouchableOpacity>
             <TouchableOpacity
               style={styles.selectionImg}
               onPress={onchoosGalery}>
               <Image style={styles.imgIcon} source={R.images.iconImg} />
 
-              <Text style={styles.txtTitleBtn}>Thư viện ảnh</Text>
+              <AppText i18nKey={'Photo_library'} style={styles.txtTitleBtn} />
             </TouchableOpacity>
           </Block>
         </View>

src/components/Picker/PickerImgUni.js

@@ -20,6 +20,8 @@ import Icon from 'react-native-vector-icons/AntDesign';
 import Modal from 'react-native-modal';
 import Block from '../Block';
 import ImagePicker from 'react-native-image-crop-picker';
+import AppText from '../AppText';
+
 const options = {
   title: 'Select Avatar',
   customButtons: [{name: 'fb', title: 'Choose Photo from Facebook'}],
@@ -98,29 +100,29 @@ const PickerImgUni = (props) => {
         </TouchableWithoutFeedback>
 
         <View style={styles.containerSelect}>
-          <Text
+          <AppText
+            i18nKey={'Select_source_image'}
             style={{
               textAlign: 'center',
               fontSize: getFontXD(42),
               fontWeight: 'bold',
               color: '#1473E6',
-            }}>
-            Chọn nguồn lấy ảnh
-          </Text>
+            }}
+          />
 
           <View style={styles.line} />
           <Block row space={'around'} center>
             <TouchableOpacity style={styles.selectionImg} onPress={onCapture}>
               <Image style={styles.imgIcon} source={R.images.iconCamera} />
 
-              <Text style={styles.txtTitleBtn}>Chụp ảnh</Text>
+              <AppText i18nKey={'Take_photo'} style={styles.txtTitleBtn} />
             </TouchableOpacity>
             <TouchableOpacity
               style={styles.selectionImg}
               onPress={onchoosGalery}>
               <Image style={styles.imgIcon} source={R.images.iconImg} />
 
-              <Text style={styles.txtTitleBtn}>Thư viện ảnh</Text>
+              <AppText i18nKey={'Photo_library'} style={styles.txtTitleBtn} />
             </TouchableOpacity>
           </Block>
         </View>

src/components/SnackBar.js

@@ -15,7 +15,7 @@ import Modal from 'react-native-modal';
 import {connect} from 'react-redux';
 import {showNotificaton, hideNotification} from '../actions/SnackBarAction';
 import {useNavigation} from '@react-navigation/native';
-
+import AppText from '../components/AppText';
 const SnackBar = (props) => {
   const navigate = useNavigation();
   const {isOpen, title, content, screen, id_record} = props.snackReducer;
@@ -47,7 +47,7 @@ const SnackBar = (props) => {
           <TouchableOpacity
             onPress={() => props.hideNotification()}
             style={styles.btn}>
-            <Text style={styles.txtBtn}>Đóng</Text>
+            <AppText i18nKey={'Close'} style={styles.txtBtn} />
           </TouchableOpacity>
           <TouchableOpacity
             onPress={() => {
@@ -55,7 +55,7 @@ const SnackBar = (props) => {
               navigate.navigate(screen, {id: id_record});
             }}
             style={[styles.btn, {marginLeft: 20}]}>
-            <Text style={styles.txtBtn}>Chi tiết</Text>
+            <AppText i18nKey={'Detail'} style={styles.txtBtn} />
           </TouchableOpacity>
         </View>
       </View>

src/helper/i18/locales/en.js

@@ -72,6 +72,41 @@ export default {
   PartnershipAgreement: 'Partnership agreement',
   Waiting: 'Waiting',
   Success: 'Success',
-  OK: 'Ok',
+  Ok: 'Ok',
   Can_not_get_data: "Can't get data",
+  Cancel: 'Cancel',
+  Close: 'Close',
+  Detail: 'Detail',
+  No_Internet: 'No internet',
+  Check_Internet_Connect: 'Check internet connect',
+  Retry: 'Retry',
+  Select_source_image: 'Select the source of the image',
+  Photo_library: 'Photo library',
+  Take_photo: 'Take a photo',
+  EnableCQG: 'Enable CQG',
+  Request_Open_Account_CQG: 'Request open account CQG',
+  Waiting_for_Progress: 'Waiting for progress',
+  PopupVerifyAccount:
+    'Your account is not verified. Go to account verification?',
+  PopupOpenCQG: 'Would you like to open a CQG account to make investments?',
+  Free: 'Free',
+  Open_account: 'Open account',
+  Provisional: 'Provisional',
+  Here: 'Here',
+  Open_account_demo: 'You can open a demo account',
+  Features_develop: 'Features are under development, please come back later!',
+  Language: 'Language',
+  Email: 'Email',
+  Password: 'Password',
+  Login: 'Login',
+  Register: 'Register',
+  Confirm_pass: 'Confirm password',
+  Code_introduce: 'Code introduce',
+  Account_already: 'Do you already have an account?',
+  Have_account: 'Do not have an account?',
+  Verify_code: 'Verification codes:',
+  Continue: 'Continue',
+  Re_send: 'Re send',
+  Copied: 'Copied!',
+  Please_fill_in: 'Please fill in ',
 };

src/helper/i18/locales/vn.js

@@ -4,6 +4,7 @@ export default {
   contact: 'Liên hệ',
   setting: 'Cài đặt',
   SetLanguage: 'Chọn ngôn ngữ',
+  Language: 'Ngôn ngữ',
   MyProfile: 'Thông tin cá nhân',
   VerifyAccount: 'Xác thực tài khoản',
   Payments: 'Các khoản thanh toán',
@@ -72,7 +73,41 @@ export default {
   PartnershipAgreement: 'Thoả thuận quan hệ đối tác',
   Waiting: 'Đang chờ',
   Success: 'Thành công',
-
   Can_not_get_data: 'Không lấy được dữ liệu!',
   Cancel: 'Huỷ',
+  Close: 'Đóng',
+  Detail: 'Chit tiết',
+  No_Internet: 'Không có kết nốt Internet',
+  Check_Internet_Connect: 'Kiểm tra lại đường truyền',
+  Retry: 'Thử lại',
+  Select_source_image: 'Chọn nguồn lấy ảnh',
+  Ok: 'Đồng ý',
+  Photo_library: 'Thư viện ảnh',
+  Take_photo: 'Chụp ảnh',
+
+  EnableCQG: 'Có tài khoản CQG',
+  Request_Open_Account_CQG: 'Yêu cầu mở TK CQG',
+  Waiting_for_Progress: 'Chờ xử lý',
+  Free: 'Miễn phí',
+  PopupVerifyAccount:
+    'Tài khoản của bạn chưa được xác minh.Tiến hành xác minh tài khoản?',
+  PopupOpenCQG: 'Bạn có muốn đăng mở tài khoản CQG để tiến hành đầu tư?',
+  Open_account: 'Mở tài khoản',
+  Provisional: 'Tạm tính',
+  Here: 'Tại đây',
+  Open_account_demo: 'Bạn có thể mở tài khoản thử',
+  Features_develop: 'Tính năng đang được phát triển, vui lòng quay lại sau!',
+  Email: 'Email',
+  Password: 'Mật khẩu',
+  Login: 'Đăng nhập',
+  Register: 'Đăng ký',
+  Confirm_pass: 'Nhập lại mật khẩu',
+  Code_introduce: 'Mã giới thiệu',
+  Account_already: 'Bạn đã có tài khoản?',
+  Have_account: 'Bạn chưa có tài khoản?',
+  Verify_code: 'Mã xác thực:',
+  Continue: 'Tiếp tục',
+  Re_send: 'Gửi lại',
+  Copied: 'Đã sao chép!',
+  Please_fill_in: 'Vui lòng điền ',
 };

src/routers/TabNavigation.js

@@ -17,6 +17,10 @@ import Test from '../Screens/NewFeed/Test';
 import {useNavigation} from '@react-navigation/native';
 import {AccountVerification, PACKETCQG} from '../routers/ScreenNames';
 import I18n from '../helper/i18/i18n';
+import {changeLanguage} from '../actions/language';
+import KEY from '../assets/AsynStorage';
+import AsyncStorage from '@react-native-community/async-storage';
+
 const Tab = createBottomTabNavigator();
 
 const PayScreenComponent = () => {
@@ -26,6 +30,7 @@ const PayScreenComponent = () => {
 const TabNavigator = (props) => {
   const navigate = useNavigation();
   useEffect(() => {
+    setInitLanguage();
     setTimeout(() => {
       showPopUp();
     }, 3000);
@@ -38,26 +43,24 @@ const TabNavigator = (props) => {
   const checkScreenInit = () => {
     if (props.screenInit.screen) {
       const {screen, id} = props.screenInit;
-      console.log(screen, id);
       navigate.navigate(screen, {id: id});
     }
   };
 
+  const setInitLanguage = async () => {
+    const laguage = await AsyncStorage.getItem(KEY.LANGUAGE);
+    if (laguage) props.changeLanguage(laguage);
+  };
+
   const showPopUp = () => {
     if (props.user.status == 1) {
-      return confirmAlert(
-        'Tài khoản của bạn chưa được xác minh.Tiến hành xác minh tài khoản?',
-        () => {
-          navigate.navigate(AccountVerification);
-        },
-      );
+      return confirmAlert(I18n.t('PopupVerifyAccount'), () => {
+        navigate.navigate(AccountVerification);
+      });
     } else if (props.user.status == 3 && !props.user.contract_code) {
-      return confirmAlert(
-        'Bạn có muốn đăng mở tài khoản CQG để tiến hành đầu tư?',
-        () => {
-          navigate.navigate(PACKETCQG);
-        },
-      );
+      return confirmAlert(I18n.t('PopupOpenCQG'), () => {
+        navigate.navigate(PACKETCQG);
+      });
     }
   };
   return (
@@ -132,4 +135,4 @@ const mapStateToProps = (state) => {
   };
 };
 
-export default connect(mapStateToProps, {})(TabNavigator);
+export default connect(mapStateToProps, {changeLanguage})(TabNavigator);