Merge branch 'forgot_smart_otp_pin' into 'func_smart_otp'

complete forgot and reactivation smart otp

See merge request !18

src/Screens/SmartOTP/ConfirmOTPSmart.js

@@ -28,7 +28,7 @@ import {showLoading, hideLoading} from '../../actions/loadingAction';
 import {connect} from 'react-redux';
 import {showAlert, TYPE} from '../../components/DropdownAlert';
 import CountDown from '../../components/CountDown';
-import {verifyStoreOTPApiSmart} from '../../apis/Functions/users';
+import {verifyOTPApiSmart} from '../../apis/Functions/users';
 
 const CELL_COUNT = 4;
 
@@ -66,7 +66,7 @@ const ConfirmOTPSmart = (propsa) => {
       showAlert(TYPE.WARN, I18n.t('Notification'), I18n.t('OTPInvalid'));
     } else {
       propsa.showLoading();
-      const res = await verifyStoreOTPApiSmart({
+      const res = await verifyOTPApiSmart({
         platform: Platform.OS,
         password: propsa.route.params.password,
         password_confirmation: propsa.route.params.password_confirmation,

src/Screens/SmartOTP/EnterPasswordSmartOTP.js

@@ -7,105 +7,109 @@ import {connect} from 'react-redux';
 import {hideLoading, showLoading} from '../../actions/loadingAction';
 import {OTP_TYPE} from '../../Config/constants';
 import {useNavigation} from '@react-navigation/native';
-import {CHANGESMARTOTP} from '../../routers/ScreenNames';
+import {RESET_SMART_OTP, CHANGESMARTOTP} from '../../routers/ScreenNames';
 
 const EnterPasswordSmartOTP = (props) => {
-  const navigation = useNavigation();
-  const [firstNumber, setFirstNumber] = useState(null);
-  const [secondsNumber, setSecondsNumber] = useState(null);
-  const [thirdNumber, setThirdNumber] = useState(null);
-  const [fourNumber, setFourNumber] = useState(null);
-  useEffect(() => {
-    if (fourNumber) {
-      onCheckPINSmartOTPPin();
-    }
-  }, [fourNumber]);
-  const onNumberPress = (number) => {
-    if (!firstNumber) {
-      setFirstNumber(number.toString());
-    } else if (!secondsNumber) {
-      setSecondsNumber(number.toString());
-    } else if (!thirdNumber) {
-      setThirdNumber(number.toString());
-    } else if (!fourNumber) {
-      setFourNumber(number.toString());
-    }
-  };
+    const navigation = useNavigation();
+    const [firstNumber, setFirstNumber] = useState(null);
+    const [secondsNumber, setSecondsNumber] = useState(null);
+    const [thirdNumber, setThirdNumber] = useState(null);
+    const [fourNumber, setFourNumber] = useState(null);
+    useEffect(() => {
+        if (fourNumber) {
+            onCheckPINSmartOTPPin();
+        }
+    }, [fourNumber]);
+    const onNumberPress = (number) => {
+        if (!firstNumber) {
+            setFirstNumber(number.toString());
+        } else if (!secondsNumber) {
+            setSecondsNumber(number.toString());
+        } else if (!thirdNumber) {
+            setThirdNumber(number.toString());
+        } else if (!fourNumber) {
+            setFourNumber(number.toString());
+        }
+    };
 
-  const onCheckPINSmartOTPPin = async () => {
-    let pinCode = `${firstNumber}${secondsNumber}${thirdNumber}${fourNumber}`;
-    props.showLoading();
-    if (props.route.params.type == 'CHANGE_SMART_OTP') {
-      const res = await verifyOTPApiSmart({
-        platform: Platform.OS,
-        otp_password: pinCode,
-        type: 'VERIFY_OTP_PASSWORD',
-      });
-      if (res.data.code == 200) {
-        navigation.navigate(CHANGESMARTOTP, {old_password: pinCode});
-      } else {
-        showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
-        setFirstNumber(null);
-        setSecondsNumber(null);
-        setThirdNumber(null);
-        setFourNumber(null);
-      }
-    } else {
-      const res = await getOTPApiSmartOTP({
-        platform: Platform.OS,
-        otp_by: props.user.email,
-        otp_password: pinCode,
-        type:
-          props.route.params.type == 'DEPOSIT'
-            ? OTP_TYPE.CUSTOMER_REQUEST_DEPOSIT
-            : OTP_TYPE.REQUEST_WITHDRAW,
-      });
+    const onCheckPINSmartOTPPin = async () => {
+        let pinCode = `${firstNumber}${secondsNumber}${thirdNumber}${fourNumber}`;
+        props.showLoading();
+        if (props.route.params.type == 'CHANGE_SMART_OTP') {
+            const res = await verifyOTPApiSmart({
+                platform: Platform.OS,
+                otp_password: pinCode,
+                type: 'VERIFY_OTP_PASSWORD',
+            });
+            if (res.data.code == 200) {
+                navigation.navigate(CHANGESMARTOTP, {old_password: pinCode});
+            } else {
+                showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
+                setFirstNumber(null);
+                setSecondsNumber(null);
+                setThirdNumber(null);
+                setFourNumber(null);
+            }
+        } else {
+            const res = await getOTPApiSmartOTP({
+                platform: Platform.OS,
+                otp_by: props.user.email,
+                otp_password: pinCode,
+                type:
+                    props.route.params.type == 'DEPOSIT'
+                        ? OTP_TYPE.CUSTOMER_REQUEST_DEPOSIT
+                        : OTP_TYPE.REQUEST_WITHDRAW,
+            });
 
-      if (res.data.code == 200) {
-        props.route.params.onGoToSmartOTP(pinCode, res.data.data.otp);
-      } else {
-        showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
-        setFirstNumber(null);
-        setSecondsNumber(null);
-        setThirdNumber(null);
-        setFourNumber(null);
-      }
-    }
-    props.hideLoading();
-  };
-  const onDeletePress = () => {
-    if (fourNumber) {
-      setFourNumber(null);
-    } else if (thirdNumber) {
-      setThirdNumber(null);
-    } else if (secondsNumber) {
-      setSecondsNumber(null);
-    } else if (firstNumber) {
-      setFirstNumber(null);
-    }
-  };
-  const onReactivationSmartOTP = () => {};
+            if (res.data.code == 200) {
+                props.route.params.onGoToSmartOTP(pinCode, res.data.data.otp);
+            } else {
+                showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
+                setFirstNumber(null);
+                setSecondsNumber(null);
+                setThirdNumber(null);
+                setFourNumber(null);
+            }
+        }
+        props.hideLoading();
+    };
+    const onDeletePress = () => {
+        if (fourNumber) {
+            setFourNumber(null);
+        } else if (thirdNumber) {
+            setThirdNumber(null);
+        } else if (secondsNumber) {
+            setSecondsNumber(null);
+        } else if (firstNumber) {
+            setFirstNumber(null);
+        }
+    };
+    const onReactivationSmartOTP = () => {
+        navigate.navigate(RESET_SMART_OTP, {title: 'ReactivationSmartOTP'});
+    };
 
-  const onForgotPINCode = () => {};
-  return (
-    <EnterPasswordSmartOTPView
-      firstNumber={firstNumber}
-      secondsNumber={secondsNumber}
-      thirdNumber={thirdNumber}
-      fourNumber={fourNumber}
-      onNumberPress={onNumberPress}
-      onDeletePress={onDeletePress}
-      onForgotPINCode={onForgotPINCode}
-      onReactivationSmartOTP={onReactivationSmartOTP}
-    />
-  );
+    const onForgotPINCode = () => {
+        navigate.navigate(RESET_SMART_OTP, {title: 'ForgotSmartOTP'});
+    };
+    return (
+        <EnterPasswordSmartOTPView
+            firstNumber={firstNumber}
+            secondsNumber={secondsNumber}
+            thirdNumber={thirdNumber}
+            fourNumber={fourNumber}
+            onNumberPress={onNumberPress}
+            onDeletePress={onDeletePress}
+            onForgotPINCode={onForgotPINCode}
+            onReactivationSmartOTP={onReactivationSmartOTP}
+        />
+    );
 };
 const mapStateToProps = (state) => {
-  return {
-    user: state.userReducer,
-  };
+    return {
+        user: state.userReducer,
+    };
 };
 
 export default connect(mapStateToProps, {showLoading, hideLoading})(
-  EnterPasswordSmartOTP,
+    EnterPasswordSmartOTP,
 );

src/Screens/SmartOTP/ResetSmartOTP.js

+import React from 'react';
+import ResetSmartOTPView from './ResetSmartOTPView';
+import {connect} from 'react-redux';
+
+const ResetSmartOTP = (props) => {
+    return <ResetSmartOTPView
+        title={props.route.params.title}
+        companyInfo={props.user.company_info}/>;
+
+};
+const mapStateToProps = (state) => {
+    return {
+        user: state.userReducer,
+    };
+};
+export default connect(mapStateToProps, {})(
+    ResetSmartOTP,
+);
+

src/Screens/SmartOTP/ResetSmartOTPView.js

+import React, {useEffect, useState} from 'react';
+import {Linking, StyleSheet, Text, TouchableOpacity, View} from 'react-native';
+import HeaderBack from '../../components/Header/HeaderBack';
+import AppText from '../../components/AppText';
+import {getFontXD, HEIGHTXD, WIDTHXD, callNumber} from '../../Config/Functions';
+import R from '../../assets/R';
+import I18n from '../../helper/i18/i18n';
+
+
+const ResetSmartOTPView = (props) => {
+    const [reRender, setReRender] = useState(false);
+    useEffect(() => {
+        setReRender(!reRender);
+    }, [props.companyInfo]);
+    return <View style={{flex: 1}}>
+        <HeaderBack title={props.title}/>
+        <View
+            style={{
+                flex: 1,
+                paddingHorizontal: WIDTHXD(50),
+                paddingTop: HEIGHTXD(40),
+            }}>
+            <Text>
+                <AppText i18nKey={'ResetSmartOTP'} style={styles.title}/>
+                <Text style={[styles.txtContent, {color: R.colors.main}]}
+                      onPress={() => callNumber(props.companyInfo?.hotline_call)}>
+                    {props.companyInfo?.hotline}
+                </Text>
+                <AppText i18nKey={'ResetSmartOTP2'} style={styles.title}/>
+            </Text>
+
+            <AppText i18nKey={'HaNoiOffice'} style={[styles.title, {color: R.colors.main, marginTop: HEIGHTXD(30)}]}/>
+            <Text style={styles.txtContent}>{props.companyInfo?.name}</Text>
+
+            <Text style={styles.txtContent}>{`${I18n.t('Address')} ${props.companyInfo?.address}`}</Text>
+
+            <View style={styles.row}>
+                <Text style={styles.title}>Email:</Text>
+                <TouchableOpacity
+                    onPress={async () => {
+                        const supported = await Linking.openURL(`mailto:${props.companyInfo?.email}`);
+                        if (supported) {
+                            Linking.openURL(`mailto:${props.companyInfo?.email}`);
+                        }
+                    }}>
+                    <Text style={styles.txtLink}> {props.companyInfo?.email}</Text>
+                </TouchableOpacity>
+            </View>
+            <TouchableOpacity
+                onPress={async () => {
+                    const supported = await Linking.canOpenURL(props.companyInfo?.website);
+                    if (supported) {
+                        Linking.openURL(props.companyInfo?.website);
+                    }
+                }}>
+                <View style={styles.row}>
+                    <Text style={styles.title}>Website: </Text>
+                    <Text style={styles.txtLink}>{props.companyInfo?.website}</Text>
+                </View>
+            </TouchableOpacity>
+
+        </View>
+    </View>;
+
+};
+const styles = StyleSheet.create({
+    title: {
+        fontSize: getFontXD(42),
+        color: R.colors.black,
+        marginTop: 5,
+    },
+    txtContent: {
+        fontSize: getFontXD(42),
+        marginTop: 5,
+    },
+    txtLink: {
+        fontSize: getFontXD(42),
+        marginTop: 5,
+        textDecorationLine: 'underline',
+        color: R.colors.main,
+    },
+    row: {
+        flexDirection: 'row',
+    },
+});
+export default ResetSmartOTPView;

src/helper/i18/locales/en.js

@@ -291,12 +291,10 @@ export default {
   LoginSessionEnd: 'Login session end, please login again',
   noteWithdrawMoney: 'Infor CQG account',
   SmartOTP: 'Smart OTP',
-  SmartOTPWarning:
-    'Please do not give the OTP to anyone under any circumstances.',
+  SmartOTPWarning: 'Please do not give the OTP to anyone under any circumstances.',
   ConfirmTransaction: 'Confirm transaction',
   OTPWillAutoUpdate: 'OTP code will be automatically update after ',
-  OTPWillAutoFill:
-    'Select "Confirm transaction" code OTP will be filled automatically',
+  OTPWillAutoFill: 'Select "Confirm transaction" code OTP will be filled automatically',
   SmartOTPUsingFor: 'OTP code using for:',
   SmartOTPUsingForFirst: '• Withdrawal request',
   SmartOTPUsingForSecond: '• Request an internal transfer',
@@ -321,4 +319,7 @@ export default {
   ConfirmSmartOTP: 'Confirm Smart OTP',
 
   AddSmartOTP: 'Add Smart OTP',
+  ResetSmartOTP: 'To ensure safety during application use, please contact the operator: ',
+  ResetSmartOTP2: ' press 3 to meet technical support staff.',
+  ForgotSmartOTP: 'Forgot Smart OTP',
 };

src/helper/i18/locales/vn.js

@@ -318,4 +318,8 @@ export default {
   ConfirmPassGetSmartOTP: 'Xác nhận mật khẩu lấy Smart OTP ',
   ConfirmSmartOTP: 'Xác nhận Smart OTP ',
   PopupSettingSmartOTP: 'Bạn có muốn cài đặt Smart OTP?',
+  ResetSmartOTP: 'Để đảm bảo an toàn trong quá trình sử dụng ứng dụng, bạn vui lòng liên hệ đến tổng đài: ',
+  ResetSmartOTP2: ' bấm phím 3 để gặp nhân viên hỗ trợ kỹ thuật.',
+  ForgotSmartOTP: 'Quên Smart OTP',
+
 };

src/routers/ScreenNames.js

@@ -84,6 +84,7 @@ export const SMARTOTPCONFIG = 'SMARTOTPCONFIG';
 export const UPDATEOTP = 'UPDATEOTP';
 
 export const CONFIRMOTPSMART = 'CONFIRMOTPSMART';
+export const RESET_SMART_OTP = 'RESET_SMART_OTP';
 
 export const CHANGESMARTOTP = 'CHANGESMARTOTP';
 

src/routers/StackNavigation.js

@@ -73,6 +73,7 @@ import * as ScreenName from './ScreenNames';
 const Stack = createStackNavigator();
 
 import {enableScreens} from 'react-native-screens';
+import ResetSmartOTP from '../Screens/SmartOTP/ResetSmartOTP';
 
 enableScreens();
 
@@ -171,16 +172,13 @@ function MyStack(props) {
       <Stack.Screen name={ScreenName.NEWPASSWORD} component={NewPassWord} />
       <Stack.Screen name={ScreenName.PRODUCTDETAIL} component={ProductDetail} />
       <Stack.Screen name={ScreenName.SMARTOTP} component={SmartOTP} />
+      <Stack.Screen name={ScreenName.ENTER_PASSWORD_SMART_OTP} component={EnterPasswordSmartOTP} />
+      <Stack.Screen name={ScreenName.RESET_SMART_OTP} component={ResetSmartOTP} />
 
       <Stack.Screen name={ScreenName.FAQSSMARTOTP} component={FAQs} />
       <Stack.Screen name={ScreenName.RULESSMARTOTP} component={RulesSmartOTP} />
 
       <Stack.Screen
-        name={ScreenName.ENTER_PASSWORD_SMART_OTP}
-        component={EnterPasswordSmartOTP}
-      />
-
-      <Stack.Screen
         name={ScreenName.FORGOTPASSWORD}
         component={ForgotPassWord}
       />