From 7fb86dbbd22ed547638dd30846acc91ee5b8d549 Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 3 Aug 2021 00:31:41 +0530 Subject: [PATCH 1/4] fix(active-route): Navigation.isActiveRoute function updated to add the current route logic --- src/libs/Navigation/Navigation.js | 19 ++++++++++++++----- src/pages/workspace/WorkspaceSidebar.js | 4 ++-- 2 files changed, 16 insertions(+), 7 deletions(-) diff --git a/src/libs/Navigation/Navigation.js b/src/libs/Navigation/Navigation.js index 894974fbc055..f88a7d389cfa 100644 --- a/src/libs/Navigation/Navigation.js +++ b/src/libs/Navigation/Navigation.js @@ -1,6 +1,6 @@ import _ from 'underscore'; import React from 'react'; -import {StackActions, DrawerActions} from '@react-navigation/native'; +import {StackActions, DrawerActions, useLinkBuilder} from '@react-navigation/native'; import PropTypes from 'prop-types'; import Onyx from 'react-native-onyx'; import linkTo from './linkTo'; @@ -125,13 +125,22 @@ function dismissModal(shouldOpenDrawer = false) { /** * Check whether the passed route is currently Active or not. * + * Previous implementation used navigationRef.current.getCurrentRoute().path, which was + * undefined in the first navigation. Hence, in our current solution, we're rebuilding + * the active route using the useLinkBuilder hook that takes routeName and params as the arguments. + * * @param {String} routePath Path to check * @return {Boolean} is active */ -function isActive(routePath) { +function isActiveRoute(routePath) { + const buildLink = useLinkBuilder(); + // We remove First forward slash from the URL before matching - const path = navigationRef.current && navigationRef.current.getCurrentRoute().path - ? navigationRef.current.getCurrentRoute().path.substring(1) + const path = navigationRef.current && navigationRef.current.getCurrentRoute().name + ? buildLink( + navigationRef.current.getCurrentRoute().name, + navigationRef.current.getCurrentRoute().params, + ).substring(1) : ''; return path === routePath; } @@ -167,7 +176,7 @@ DismissModal.defaultProps = { export default { navigate, dismissModal, - isActive, + isActiveRoute, goBack, DismissModal, closeDrawer, diff --git a/src/pages/workspace/WorkspaceSidebar.js b/src/pages/workspace/WorkspaceSidebar.js index b0cd6a53840a..0e5f73a54059 100644 --- a/src/pages/workspace/WorkspaceSidebar.js +++ b/src/pages/workspace/WorkspaceSidebar.js @@ -50,7 +50,7 @@ const WorkspaceSidebar = ({translate, isSmallScreenWidth, policy}) => { action: () => { Navigation.navigate(ROUTES.getWorkspaceCardRoute(policy.id)); }, - isActive: Navigation.isActive(ROUTES.getWorkspaceCardRoute(policy.id)), + isActive: Navigation.isActiveRoute(ROUTES.getWorkspaceCardRoute(policy.id)), }, { translationKey: 'common.people', @@ -58,7 +58,7 @@ const WorkspaceSidebar = ({translate, isSmallScreenWidth, policy}) => { action: () => { Navigation.navigate(ROUTES.getWorkspacePeopleRoute(policy.id)); }, - isActive: Navigation.isActive(ROUTES.getWorkspacePeopleRoute(policy.id)), + isActive: Navigation.isActiveRoute(ROUTES.getWorkspacePeopleRoute(policy.id)), }, ]; From b7658dbb7dd2fcb69e19455bcba130ee70286380 Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 3 Aug 2021 17:24:37 +0530 Subject: [PATCH 2/4] chore(is-active-route): Updated implementation comment --- src/libs/Navigation/Navigation.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/libs/Navigation/Navigation.js b/src/libs/Navigation/Navigation.js index f88a7d389cfa..451375f88cf8 100644 --- a/src/libs/Navigation/Navigation.js +++ b/src/libs/Navigation/Navigation.js @@ -125,9 +125,7 @@ function dismissModal(shouldOpenDrawer = false) { /** * Check whether the passed route is currently Active or not. * - * Previous implementation used navigationRef.current.getCurrentRoute().path, which was - * undefined in the first navigation. Hence, in our current solution, we're rebuilding - * the active route using the useLinkBuilder hook that takes routeName and params as the arguments. + * Building path with useLinkBuilder since navigationRef.current.getCurrentRoute().path is undefined in the first navigation. * * @param {String} routePath Path to check * @return {Boolean} is active From f26b5a0b3d7509c376261d4f3d7aa26794c3ab0f Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 3 Aug 2021 17:33:13 +0530 Subject: [PATCH 3/4] style(lint-fixes): Split commment for lint max-len --- src/libs/Navigation/Navigation.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/libs/Navigation/Navigation.js b/src/libs/Navigation/Navigation.js index 451375f88cf8..8034ef45ed0c 100644 --- a/src/libs/Navigation/Navigation.js +++ b/src/libs/Navigation/Navigation.js @@ -125,7 +125,8 @@ function dismissModal(shouldOpenDrawer = false) { /** * Check whether the passed route is currently Active or not. * - * Building path with useLinkBuilder since navigationRef.current.getCurrentRoute().path is undefined in the first navigation. + * Building path with useLinkBuilder since navigationRef.current.getCurrentRoute().path + * is undefined in the first navigation. * * @param {String} routePath Path to check * @return {Boolean} is active From e43b311f71fb70370b6653c4dc2276a64c5062ff Mon Sep 17 00:00:00 2001 From: Manan Jadhav Date: Tue, 3 Aug 2021 17:36:10 +0530 Subject: [PATCH 4/4] style(lint-fixes): Split commment for lint max-len --- src/libs/Navigation/Navigation.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/libs/Navigation/Navigation.js b/src/libs/Navigation/Navigation.js index 8034ef45ed0c..069bc6823c39 100644 --- a/src/libs/Navigation/Navigation.js +++ b/src/libs/Navigation/Navigation.js @@ -125,7 +125,7 @@ function dismissModal(shouldOpenDrawer = false) { /** * Check whether the passed route is currently Active or not. * - * Building path with useLinkBuilder since navigationRef.current.getCurrentRoute().path + * Building path with useLinkBuilder since navigationRef.current.getCurrentRoute().path * is undefined in the first navigation. * * @param {String} routePath Path to check