From 0ba23095c036766cd43f72d98524cc2adb0d5adb Mon Sep 17 00:00:00 2001 From: noumantahir Date: Thu, 30 Jun 2022 19:48:18 +0500 Subject: [PATCH] moved a bunch of pinCode modal logic out of application container --- src/redux/actions/applicationActions.ts | 2 +- .../container/applicationContainer.tsx | 28 +------ src/screens/application/index.tsx | 13 +--- .../application/screen/pinCodeModal.tsx | 77 +++++++++++++++++++ .../application/screen/welcomeModal.tsx | 34 ++++---- 5 files changed, 100 insertions(+), 54 deletions(-) create mode 100644 src/screens/application/screen/pinCodeModal.tsx diff --git a/src/redux/actions/applicationActions.ts b/src/redux/actions/applicationActions.ts index 71422aa40..4a281d609 100644 --- a/src/redux/actions/applicationActions.ts +++ b/src/redux/actions/applicationActions.ts @@ -48,7 +48,7 @@ export const isLoginDone = () => ({ type: IS_LOGIN_DONE, }); -export const openPinCodeModal = (payload) => ({ +export const openPinCodeModal = (payload = null) => ({ payload, type: OPEN_PIN_CODE_MODAL, }); diff --git a/src/screens/application/container/applicationContainer.tsx b/src/screens/application/container/applicationContainer.tsx index 6bdb16c36..dcc8e10d2 100644 --- a/src/screens/application/container/applicationContainer.tsx +++ b/src/screens/application/container/applicationContainer.tsx @@ -10,7 +10,6 @@ import { NavigationActions } from 'react-navigation'; import { bindActionCreators } from 'redux'; import EStyleSheet from 'react-native-extended-stylesheet'; import { isEmpty, some } from 'lodash'; -import { useDarkMode } from 'react-native-dynamic'; import messaging from '@react-native-firebase/messaging'; import PushNotification from 'react-native-push-notification'; import VersionNumber from 'react-native-version-number'; @@ -420,22 +419,10 @@ class ApplicationContainer extends Component { ); }; + _handleAppStateChange = (nextAppState) => { const { appState } = this.state; - const { isPinCodeOpen: _isPinCodeOpen } = this.props; - getExistUser().then((isExistUser) => { - if (isExistUser) { - if (appState.match(/active|forground/) && nextAppState === 'inactive') { - this._startPinCodeTimer(); - } - if (appState.match(/inactive|background/) && nextAppState === 'active') { - if (_isPinCodeOpen) { - clearTimeout(this._pinCodeTimer); - } - } - } - }); if (appState.match(/inactive|background/) && nextAppState === 'active') { this._refreshGlobalProps(); } @@ -445,15 +432,6 @@ class ApplicationContainer extends Component { }); }; - _startPinCodeTimer = () => { - const { dispatch, isPinCodeOpen: _isPinCodeOpen } = this.props; - - if (_isPinCodeOpen) { - this._pinCodeTimer = setTimeout(() => { - dispatch(openPinCodeModal()); - }, 1 * 60 * 1000); - } - }; _fetchApp = async () => { await this._getSettings(); @@ -674,11 +652,11 @@ class ApplicationContainer extends Component { // TODO: await switchAccount(realmObject[0].username); } - const isExistUser = await getExistUser(); + realmObject[0].name = currentUsername; // If in dev mode pin code does not show - if ((!isExistUser || !pinCode) && _isPinCodeOpen) { + if (_isPinCodeOpen) { dispatch(openPinCodeModal()); } else if (!_isPinCodeOpen) { const encryptedPin = encryptKey(Config.DEFAULT_PIN, Config.PIN_KEY); diff --git a/src/screens/application/index.tsx b/src/screens/application/index.tsx index 01463cf04..6c1a74633 100644 --- a/src/screens/application/index.tsx +++ b/src/screens/application/index.tsx @@ -10,6 +10,7 @@ import { Modal } from '../../components'; import { PinCode } from '../pinCode'; import ErrorBoundary from './screen/errorBoundary'; import { setDeviceOrientation } from '../../redux/actions/uiAction'; +import PinCodeModal from './screen/pinCodeModal'; const Application = () => { const dispatch = useDispatch(); @@ -48,15 +49,9 @@ const Application = () => { - - - + + + {isRenderRequire && ( { + const dispatch = useAppDispatch(); + + const pinCodeTimer = useRef(null); + const appState = useRef(AppState.currentState); + + const isPinCodeRequire = useAppSelector(state => state.application.isPinCodeRequire); + const isPinCodeOpen = useAppSelector(state => state.application.isPinCodeOpen); + + + useEffect(() => { + AppState.addEventListener('change', _handleAppStateChange); + return _unmount + }, []) + + + const _unmount = () => { + AppState.removeEventListener('change', _handleAppStateChange); + } + + + const _handleAppStateChange = (nextAppState) => { + getExistUser().then((isExistUser) => { + if (isExistUser) { + if (appState.current.match(/active|forground/) && nextAppState === 'inactive') { + _startPinCodeTimer(); + } + + if (appState.current.match(/inactive|background/) && nextAppState === 'active') { + if (isPinCodeOpen && pinCodeTimer.current) { + clearTimeout(pinCodeTimer.current); + } + } + } + }); + + appState.current = nextAppState; + }; + + + + const _startPinCodeTimer = () => { + if (isPinCodeOpen) { + pinCodeTimer.current = setTimeout(() => { + dispatch(openPinCodeModal()); + }, 1 * 60 * 1000); + } + }; + + + return ( + + + + ) +} + +export default PinCodeModal \ No newline at end of file diff --git a/src/screens/application/screen/welcomeModal.tsx b/src/screens/application/screen/welcomeModal.tsx index b979ead56..de4dcc134 100644 --- a/src/screens/application/screen/welcomeModal.tsx +++ b/src/screens/application/screen/welcomeModal.tsx @@ -13,11 +13,11 @@ import LaunchScreen from '../../launch'; import styles from './welcomeStyles'; -const WelcomeModal = ({onModalVisibilityChange}) => { +const WelcomeModal = ({ onModalVisibilityChange }) => { const intl = useIntl(); const dispatch = useAppDispatch(); - const lastAppVersion = useAppSelector(state=>state.application.lastAppVersion) + const lastAppVersion = useAppSelector(state => state.application.lastAppVersion) const [showAnimation, setShowAnimation] = useState(true); const [showWelcomeModal, setShowWelcomeModal] = useState(false); @@ -29,30 +29,26 @@ const WelcomeModal = ({onModalVisibilityChange}) => { }, []) - useEffect(() => { - if (showAnimation) { - setTimeout(() => { - setShowAnimation(false); - }, 3550); - } - }, [showAnimation]); - - const _compareAppVersion = () => { - if(!lastAppVersion || (parseVersionNumber(lastAppVersion) < parseVersionNumber(appVersion))){ - setShowWelcomeModal(true); - onModalVisibilityChange(true) - } + if (!lastAppVersion || (parseVersionNumber(lastAppVersion) < parseVersionNumber(appVersion))) { + _showWelcomeModal(); + } + } + + const _showWelcomeModal = () => { + setShowWelcomeModal(true); + onModalVisibilityChange(true); + setShowAnimation(true); + setTimeout(() => { + setShowAnimation(false); + }, 3550); } const _handleButtonPress = () => { dispatch(setLastAppVersion(appVersion)) setShowWelcomeModal(false); - setTimeout(()=>{ - onModalVisibilityChange(false) - }, 100) - + onModalVisibilityChange(false); }