Done ConfirmEmail and NewPassword Screen

ios/Invest/Info.plist

@@ -38,28 +38,11 @@
 		</dict>
 	</dict>
 	<key>NSLocationWhenInUseUsageDescription</key>
-	<string></string>
+	<string/>
 	<key>NSPhotoLibraryUsageDescription</key>
 	<string>To upload images</string>
 	<key>UIAppFonts</key>
-	<array>
-		<string>AntDesign.ttf</string>
-		<string>Entypo.ttf</string>
-		<string>EvilIcons.ttf</string>
-		<string>Feather.ttf</string>
-		<string>FontAwesome.ttf</string>
-		<string>FontAwesome5_Brands.ttf</string>
-		<string>FontAwesome5_Regular.ttf</string>
-		<string>FontAwesome5_Solid.ttf</string>
-		<string>Fontisto.ttf</string>
-		<string>Foundation.ttf</string>
-		<string>Ionicons.ttf</string>
-		<string>MaterialCommunityIcons.ttf</string>
-		<string>MaterialIcons.ttf</string>
-		<string>Octicons.ttf</string>
-		<string>SimpleLineIcons.ttf</string>
-		<string>Zocial.ttf</string>
-	</array>
+	<array/>
 	<key>UIBackgroundModes</key>
 	<array>
 		<string>fetch</string>
@@ -77,9 +60,9 @@
 		<string>UIInterfaceOrientationPortrait</string>
 	</array>
 	<key>BGTaskSchedulerPermittedIdentifiers</key>
-<array>
-    <string>dcv.investcustomer.vn</string>
-</array>
+	<array>
+		<string>dcv.investcustomer.vn</string>
+	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
 	<false/>
 </dict>

ios/Podfile

@@ -81,7 +81,6 @@ target 'Invest' do
   pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
   pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'
 
-  pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons'
 
  
 

ios/Podfile.lock

@@ -325,8 +325,6 @@ PODS:
   - React-jsinspector (0.62.2)
   - react-native-safe-area-context (3.1.9):
     - React-Core
-  - react-native-vnpay-merchant (1.0.0):
-    - React
   - React-RCTActionSheet (0.62.2):
     - React-Core/RCTActionSheetHeaders (= 0.62.2)
   - React-RCTAnimation (0.62.2):
@@ -462,7 +460,6 @@ DEPENDENCIES:
   - React-jsiexecutor (from `../node_modules/react-native/ReactCommon/jsiexecutor`)
   - React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector`)
   - react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
-  - react-native-vnpay-merchant (from `../node_modules/react-native-vnpay-merchant`)
   - React-RCTActionSheet (from `../node_modules/react-native/Libraries/ActionSheetIOS`)
   - React-RCTAnimation (from `../node_modules/react-native/Libraries/NativeAnimation`)
   - React-RCTBlob (from `../node_modules/react-native/Libraries/Blob`)
@@ -550,8 +547,6 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/ReactCommon/jsinspector"
   react-native-safe-area-context:
     :path: "../node_modules/react-native-safe-area-context"
-  react-native-vnpay-merchant:
-    :path: "../node_modules/react-native-vnpay-merchant"
   React-RCTActionSheet:
     :path: "../node_modules/react-native/Libraries/ActionSheetIOS"
   React-RCTAnimation:
@@ -636,7 +631,6 @@ SPEC CHECKSUMS:
   React-jsiexecutor: 1540d1c01bb493ae3124ed83351b1b6a155db7da
   React-jsinspector: 512e560d0e985d0e8c479a54a4e5c147a9c83493
   react-native-safe-area-context: b6e0e284002381d2ff29fa4fff42b4d8282e3c94
-  react-native-vnpay-merchant: c9f1ebb375802c7004045e3646240f043acaaf61
   React-RCTActionSheet: f41ea8a811aac770e0cc6e0ad6b270c644ea8b7c
   React-RCTAnimation: 49ab98b1c1ff4445148b72a3d61554138565bad0
   React-RCTBlob: a332773f0ebc413a0ce85942a55b064471587a71

package.json

@@ -36,7 +36,6 @@
     "react-native-screens": "^2.17.1",
     "react-native-tab-view": "^2.15.2",
     "react-native-vector-icons": "^8.0.0",
-    "react-native-vnpay-merchant": "/Users/macbookpro/Documents/Company/ReactNative/Invest/node_modules/react-native-vnpay-merchant",
     "react-redux": "^7.2.2",
     "redux": "^4.0.5",
     "redux-saga": "^1.1.3"

src/Screens/Authen/ConfirmEmail.js

+import React, {useState} from 'react';
+import {
+  View,
+  Text,
+  TextInput,
+  StyleSheet,
+  TouchableOpacity,
+} from 'react-native';
+import HeaderBack from '../../components/Header/HeaderBack';
+ 
+import {getFontXD, HEIGHTXD, WIDTHXD} from '../../Config/Functions';
+import R from '../../assets/R';
+
+
+const ConfirmEmail = (propsa) => {
+  const [value, setValue] = useState('');
+
+
+  return (
+    <View style={{flex: 1}}>
+      <HeaderBack title={'Quên mật khẩu'} />
+
+      <View style={styles.container}>
+        <View style={styles.wrap}>
+          <View style={styles.containerCode}>
+          <Text style={styles.txtTitle}>Vui lòng nhập email hoặc số điện thoại</Text>
+            <TextInput  
+            style={styles.txtInput}
+            placeholder="Nhập Email hoặc số điện thoại" 
+            value={value}
+            onChangeText={(val)=>setValue(val)}
+            />
+          </View>
+        </View>
+      </View>
+
+      <View style={styles.footer}>
+        <TouchableOpacity
+          onPress={() => console.log('Hello')}
+          style={styles.btn}>
+          <Text style={styles.txtBtn}>Lấy mã xác thực</Text>
+        </TouchableOpacity>
+        <TouchableOpacity onPress={() => console.log('Hello')}>
+          <Text style={styles.txtSend}>Quay lại đăng nhập</Text>
+        </TouchableOpacity>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    paddingVertical: 20,
+  },
+  footer: {
+    height: 200,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  wrap: {
+    flex: 1,
+    paddingTop: 10,
+    alignItems: 'center',
+    width: '100%',
+    paddingHorizontal: 50,
+  },
+  containerCode: {
+    height: 50,
+    width: '100%',
+    marginTop: 10,
+  },
+  codeFieldRoot: {
+    marginTop: 20,
+  },
+  txtTitle: {
+    fontSize: getFontXD(48),
+    color: '#141414',
+    marginBottom: 12
+  },
+  txtInput: {
+    height: HEIGHTXD(99),
+     
+    borderBottomWidth: 2,
+    borderBottomColor: '#DBEBFF',
+    fontSize: getFontXD(46),
+    
+    paddingVertical:2,
+   
+    color: 'black',
+  },
+  btn: {
+    width: WIDTHXD(550),
+    height: HEIGHTXD(120),
+    borderRadius: 22,
+    backgroundColor: '#1C6AF6',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  txtBtn: {
+    color: R.colors.white,
+    fontSize: getFontXD(52),
+    textTransform: 'uppercase',
+  },
+  txtSend: {
+    marginTop: 30,
+    fontSize: getFontXD(42),
+    color: '#1C6AF6',
+  },
+});
+
+export default ConfirmEmail;

src/Screens/Authen/NewPassword.js

+import React, {useState} from 'react';
+import {
+  View,
+  Text,
+  TextInput,
+  StyleSheet,
+  TouchableOpacity,
+} from 'react-native';
+import HeaderBack from '../../components/Header/HeaderBack';
+ 
+import {getFontXD, HEIGHTXD, WIDTHXD} from '../../Config/Functions';
+import R from '../../assets/R';
+
+
+const NewPassword = (propsa) => {
+  const [password, setPassword] = useState('');
+  const [cfPassword, setcfPassword] = useState('');
+
+  return (
+    <View style={{flex: 1}}>
+      <HeaderBack title={'Quên mật khẩu'} />
+
+      <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>
+            <TextInput  
+            style={styles.txtInput}
+            placeholder="Nhập Email hoặc số điện thoại" 
+            value={password}
+            secureTextEntry={true}
+            onChangeText={(val)=>setPassword(val)}
+            />
+          </View>
+          <View style={styles.containerCode2}>
+          <Text style={styles.txtTitle}>Nhập lại mật khẩu</Text>
+            <TextInput  
+            style={styles.txtInput}
+            placeholder="Nhập Email hoặc số điện thoại" 
+            value={cfPassword}
+            secureTextEntry={true}
+            onChangeText={(val)=>setcfPassword(val)}
+            />
+          </View>
+        </View>
+      </View>
+
+      <View style={styles.footer}>
+        <TouchableOpacity
+          onPress={() => console.log('Hello')}
+          style={styles.btn}>
+          <Text style={styles.txtBtn}>Cập nhật</Text>
+        </TouchableOpacity>
+      </View>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    paddingVertical: 20,
+  },
+  footer: {
+    height: 200,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  wrap: {
+    flex: 1,
+    paddingTop: 10,
+    alignItems: 'center',
+    width: '100%',
+    paddingHorizontal: 50,
+  },
+  containerCode1: {
+    height: 50,
+    width: '100%',
+    marginTop: 10,
+  },
+  containerCode2: {
+    height: 50,
+    width: '100%',
+    marginTop: 30,
+  },
+  codeFieldRoot: {
+    marginTop: 20,
+  },
+  txtTitle: {
+    fontSize: getFontXD(48),
+    color: '#141414',
+    marginBottom: 12
+  },
+  txtInput: {
+    height: HEIGHTXD(99),
+     
+    borderBottomWidth: 2,
+    borderBottomColor: '#DBEBFF',
+    fontSize: getFontXD(46),
+    
+    paddingVertical:2,
+   
+    color: 'black',
+  },
+  btn: {
+    width: WIDTHXD(550),
+    height: HEIGHTXD(120),
+    borderRadius: 22,
+    backgroundColor: '#1C6AF6',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  txtBtn: {
+    color: R.colors.white,
+    fontSize: getFontXD(52),
+    textTransform: 'uppercase',
+  },
+  txtSend: {
+    marginTop: 30,
+    fontSize: getFontXD(42),
+    color: '#1C6AF6',
+  },
+});
+
+export default NewPassword;

src/routers/ScreenNames.js

@@ -35,3 +35,5 @@ export const TRANSFER = 'TRANSFER';
 export const HISTORY = 'HISTORY';
 
 export const CONFIRMOTP = 'CONFIRMOTP';
+export const CONFIRMEMAIL = 'CONFIRMEMAIL';
+export const NEWPASSWORD = 'NEWPASSWORD';

src/routers/StackNavigation.js

@@ -25,6 +25,9 @@ import History from '../Screens/Action/History/History';
 import Authen from '../Screens/Authen/Authen';
 import ForgotPassWord from '../Screens/Authen/ForgotPassword';
 import ConfirmOTP from '../Screens/Authen/ConfirmOTP';
+import ConfirmEmail from '../Screens/Authen/ConfirmEmail';
+import NewPassword from '../Screens/Authen/NewPassword';
+
 import * as ScreenName from './ScreenNames';
 
 const Stack = createStackNavigator();
@@ -36,14 +39,16 @@ function MyStack(props) {
         headerStatusBarHeight: 0,
       }}
       headerMode={'none'}
-      initialRouteName={ScreenName.CONFIRMOTP}>
+      initialRouteName={ScreenName.NEWPASSWORD}>
       <Stack.Screen name={ScreenName.LOGINSCREEN} component={Login} />
       <Stack.Screen name={ScreenName.TABNAVIGATOR} component={TabNavigator} />
       <Stack.Screen
         name={ScreenName.AccountVerification}
         component={AccountVerificaiton}
       />
+      <Stack.Screen name={ScreenName.CONFIRMEMAIL} component={ConfirmEmail} />
       <Stack.Screen name={ScreenName.CONFIRMOTP} component={ConfirmOTP} />
+      <Stack.Screen name={ScreenName.NEWPASSWORD} component={NewPassword} />
 
       <Stack.Screen name={ScreenName.FEEDBACK} component={Feedback} />
       <Stack.Screen name={ScreenName.AUTHEN} component={Authen} />

yarn.lock

@@ -6134,9 +6134,6 @@ react-native-vector-icons@^8.0.0:
     prop-types "^15.7.2"
     yargs "^16.1.1"
 
-"react-native-vnpay-merchant@file:node_modules/react-native-vnpay-merchant":
-  version "1.0.0"
-
 react-native@0.62.2:
   version "0.62.2"
   resolved "https://registry.yarnpkg.com/react-native/-/react-native-0.62.2.tgz#d831e11a3178705449142df19a70ac2ca16bad10"