From cfe289e48548e2d092c6c12a65f11c7c3e384f41 Mon Sep 17 00:00:00 2001 From: Mohammad Luthfi Fathur Rahman Date: Wed, 18 May 2022 23:06:52 +0700 Subject: [PATCH 1/3] fix default drawer status issue --- src/ONYXKEYS.js | 3 +++ .../AppNavigator/BaseDrawerNavigator.js | 14 ++++++++++++++ src/libs/Navigation/Navigation.js | 17 ++++++++++++++++- src/libs/actions/App.js | 9 +++++++++ 4 files changed, 42 insertions(+), 1 deletion(-) diff --git a/src/ONYXKEYS.js b/src/ONYXKEYS.js index e3ec98b6052e..6426297e2ce6 100755 --- a/src/ONYXKEYS.js +++ b/src/ONYXKEYS.js @@ -193,4 +193,7 @@ export default { // Validating Email? USER_SIGN_UP: 'userSignUp', + + // Store default drawer status + DEFAULT_DRAWER_STATUS: 'defaultDrawerStatus', }; diff --git a/src/libs/Navigation/AppNavigator/BaseDrawerNavigator.js b/src/libs/Navigation/AppNavigator/BaseDrawerNavigator.js index e90d35a6cd6c..364659d461ff 100644 --- a/src/libs/Navigation/AppNavigator/BaseDrawerNavigator.js +++ b/src/libs/Navigation/AppNavigator/BaseDrawerNavigator.js @@ -6,6 +6,7 @@ import {View} from 'react-native'; import withWindowDimensions, {windowDimensionsPropTypes} from '../../../components/withWindowDimensions'; import styles from '../../../styles/styles'; import * as StyleUtils from '../../../styles/StyleUtils'; +import * as App from '../../actions/App'; import Navigation from '../Navigation'; @@ -66,6 +67,19 @@ class BaseDrawerNavigator extends Component { ), swipeEdgeWidth: 500, }} + screenListeners={{ + state: (e) => { + const state = e.data.state; + + // Get the history that has drawer type to get the status. + const hasDrawerHistory = _.find(state.history || [], h => h.type === 'drawer'); + + // hasDrawerHistory will has undefined value if the route drawer is equal to initial route drawer. + // Using the default status if hasDrawerHistory is undefined and get the status from the current route + // if the value provided. + App.setDefaultDrawerStatus(hasDrawerHistory ? hasDrawerHistory.status : state.default); + }, + }} > {_.map(this.props.screens, screen => ( isLoggedIn = Boolean(val && val.authToken), }); +let defaultDrawerStatus = 'open'; +Onyx.connect({ + key: ONYXKEYS.DEFAULT_DRAWER_STATUS, + callback: val => defaultDrawerStatus = val, +}); + // This flag indicates that we're trying to deeplink to a report when react-navigation is not fully loaded yet. // If true, this flag will cause the drawer to start in a closed state (which is not the default for small screens) // so it doesn't cover the report we're trying to link to. @@ -76,7 +82,16 @@ function getDefaultDrawerState(isSmallScreenWidth) { if (didTapNotificationBeforeReady) { return 'closed'; } - return isSmallScreenWidth ? 'open' : 'closed'; + + if (isSmallScreenWidth) { + const path = getPathFromState(navigationRef.current.getState(), linkingConfig.config); + + // If the initial route path is HOME SCREEN, + // return open for default status drawer instead of using value from Onxy + return path === '/' ? 'open' : defaultDrawerStatus; + } + + return 'closed'; } /** diff --git a/src/libs/actions/App.js b/src/libs/actions/App.js index a5d8918d6404..ccfba02b5cd6 100644 --- a/src/libs/actions/App.js +++ b/src/libs/actions/App.js @@ -135,6 +135,14 @@ function fixAccountAndReloadData() { }); } +/** + * Store drawer status to Onxy + * @param {String} defaultDrawerStatus + */ +function setDefaultDrawerStatus(defaultDrawerStatus) { + Onyx.set(ONYXKEYS.DEFAULT_DRAWER_STATUS, defaultDrawerStatus); +} + // When the app reconnects from being offline, fetch all initialization data NetworkConnection.onReconnect(() => getAppData(true, false)); @@ -142,6 +150,7 @@ export { setCurrentURL, setLocale, setSidebarLoaded, + setDefaultDrawerStatus, getLocale, getAppData, fixAccountAndReloadData, From 1e10f00259eba2de2da79cde10590f8acb8f2d24 Mon Sep 17 00:00:00 2001 From: Mohammad Luthfi Fathur Rahman Date: Wed, 18 May 2022 23:23:11 +0700 Subject: [PATCH 2/3] typo comment --- src/libs/Navigation/Navigation.js | 2 +- src/libs/actions/App.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/libs/Navigation/Navigation.js b/src/libs/Navigation/Navigation.js index ebba13c690b8..b6085e48c98f 100644 --- a/src/libs/Navigation/Navigation.js +++ b/src/libs/Navigation/Navigation.js @@ -87,7 +87,7 @@ function getDefaultDrawerState(isSmallScreenWidth) { const path = getPathFromState(navigationRef.current.getState(), linkingConfig.config); // If the initial route path is HOME SCREEN, - // return open for default status drawer instead of using value from Onxy + // return open for default status drawer instead of using value from Onyx return path === '/' ? 'open' : defaultDrawerStatus; } diff --git a/src/libs/actions/App.js b/src/libs/actions/App.js index ccfba02b5cd6..93e865665b6e 100644 --- a/src/libs/actions/App.js +++ b/src/libs/actions/App.js @@ -136,7 +136,7 @@ function fixAccountAndReloadData() { } /** - * Store drawer status to Onxy + * Store drawer status to Onyx * @param {String} defaultDrawerStatus */ function setDefaultDrawerStatus(defaultDrawerStatus) { From e4c211e8ee7ea290416f72540e7d14e6d24af474 Mon Sep 17 00:00:00 2001 From: Mohammad Luthfi Fathur Rahman Date: Wed, 18 May 2022 23:48:55 +0700 Subject: [PATCH 3/3] defined the drawer status to CONST --- src/CONST.js | 5 +++++ src/libs/Navigation/Navigation.js | 9 +++++---- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/src/CONST.js b/src/CONST.js index c0e26e78fca7..e8c9d4b93a79 100755 --- a/src/CONST.js +++ b/src/CONST.js @@ -696,6 +696,11 @@ const CONST = { // There's a limit of 60k characters in Auth - https://github.com/Expensify/Auth/blob/198d59547f71fdee8121325e8bc9241fc9c3236a/auth/lib/Request.h#L28 MAX_COMMENT_LENGTH: 60000, + + DRAWER_STATUS: { + OPEN: 'open', + CLOSED: 'closed', + }, }; export default CONST; diff --git a/src/libs/Navigation/Navigation.js b/src/libs/Navigation/Navigation.js index b6085e48c98f..5f858fae1686 100644 --- a/src/libs/Navigation/Navigation.js +++ b/src/libs/Navigation/Navigation.js @@ -9,6 +9,7 @@ import CustomActions from './CustomActions'; import ONYXKEYS from '../../ONYXKEYS'; import linkingConfig from './linkingConfig'; import navigationRef from './navigationRef'; +import CONST from '../../CONST'; let isLoggedIn = false; Onyx.connect({ @@ -16,7 +17,7 @@ Onyx.connect({ callback: val => isLoggedIn = Boolean(val && val.authToken), }); -let defaultDrawerStatus = 'open'; +let defaultDrawerStatus = CONST.DRAWER_STATUS.OPEN; Onyx.connect({ key: ONYXKEYS.DEFAULT_DRAWER_STATUS, callback: val => defaultDrawerStatus = val, @@ -80,7 +81,7 @@ function closeDrawer() { */ function getDefaultDrawerState(isSmallScreenWidth) { if (didTapNotificationBeforeReady) { - return 'closed'; + return CONST.DRAWER_STATUS.CLOSED; } if (isSmallScreenWidth) { @@ -88,10 +89,10 @@ function getDefaultDrawerState(isSmallScreenWidth) { // If the initial route path is HOME SCREEN, // return open for default status drawer instead of using value from Onyx - return path === '/' ? 'open' : defaultDrawerStatus; + return path === '/' ? CONST.DRAWER_STATUS.OPEN : defaultDrawerStatus; } - return 'closed'; + return CONST.DRAWER_STATUS.CLOSED; } /**