diff --git a/src/libs/Navigation/AppNavigator/AuthScreens.tsx b/src/libs/Navigation/AppNavigator/AuthScreens.tsx index 4bbdac7b17b1..d63d52ab7365 100644 --- a/src/libs/Navigation/AppNavigator/AuthScreens.tsx +++ b/src/libs/Navigation/AppNavigator/AuthScreens.tsx @@ -19,6 +19,7 @@ import getOnboardingModalScreenOptions from '@libs/Navigation/getOnboardingModal import Navigation from '@libs/Navigation/Navigation'; import type {AuthScreensParamList, CentralPaneName, CentralPaneScreensParamList} from '@libs/Navigation/types'; import NetworkConnection from '@libs/NetworkConnection'; +import onyxSubscribe from '@libs/onyxSubscribe'; import * as Pusher from '@libs/Pusher/pusher'; import PusherConnectionManager from '@libs/PusherConnectionManager'; import * as ReportUtils from '@libs/ReportUtils'; @@ -215,6 +216,7 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie () => getOnboardingModalScreenOptions(isSmallScreenWidth, styles, StyleUtils, isMediumOrLargerScreenWidth), [StyleUtils, isSmallScreenWidth, isMediumOrLargerScreenWidth, styles], ); + const modal = useRef({}); let initialReportID: string | undefined; const isInitialRender = useRef(true); @@ -283,6 +285,36 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie Timing.end(CONST.TIMING.HOMEPAGE_INITIAL_RENDER); + const unsubscribeOnyxModal = onyxSubscribe({ + key: ONYXKEYS.MODAL, + callback: (modalArg) => { + if (modalArg === null || typeof modalArg !== 'object') { + return; + } + modal.current = modalArg; + }, + }); + + const shortcutConfig = CONST.KEYBOARD_SHORTCUTS.ESCAPE; + const unsubscribeEscapeKey = KeyboardShortcut.subscribe( + shortcutConfig.shortcutKey, + () => { + if (modal.current.willAlertModalBecomeVisible) { + return; + } + + if (modal.current.disableDismissOnEscape) { + return; + } + + Navigation.dismissModal(); + }, + shortcutConfig.descriptionKey, + shortcutConfig.modifiers, + true, + true, + ); + // Listen to keyboard shortcuts for opening certain pages const unsubscribeShortcutsOverviewShortcut = KeyboardShortcut.subscribe( shortcutsOverviewShortcutConfig.shortcutKey, @@ -333,6 +365,8 @@ function AuthScreens({session, lastOpenedPublicRoomID, initialLastUpdateIDApplie ); return () => { + unsubscribeEscapeKey(); + unsubscribeOnyxModal(); unsubscribeShortcutsOverviewShortcut(); unsubscribeSearchShortcut(); unsubscribeChatShortcut(); diff --git a/src/pages/home/sidebar/SidebarLinks.tsx b/src/pages/home/sidebar/SidebarLinks.tsx index e5dc79f008ef..c4ace993d222 100644 --- a/src/pages/home/sidebar/SidebarLinks.tsx +++ b/src/pages/home/sidebar/SidebarLinks.tsx @@ -1,4 +1,4 @@ -import React, {memo, useCallback, useEffect, useMemo, useRef} from 'react'; +import React, {memo, useCallback, useEffect, useMemo} from 'react'; import {InteractionManager, StyleSheet, View} from 'react-native'; import type {OnyxEntry} from 'react-native-onyx'; import type {EdgeInsets} from 'react-native-safe-area-context'; @@ -9,15 +9,12 @@ import useLocalize from '@hooks/useLocalize'; import useResponsiveLayout from '@hooks/useResponsiveLayout'; import useStyleUtils from '@hooks/useStyleUtils'; import useThemeStyles from '@hooks/useThemeStyles'; -import KeyboardShortcut from '@libs/KeyboardShortcut'; import Navigation from '@libs/Navigation/Navigation'; -import onyxSubscribe from '@libs/onyxSubscribe'; import * as ReportActionContextMenu from '@pages/home/report/ContextMenu/ReportActionContextMenu'; import * as App from '@userActions/App'; import CONST from '@src/CONST'; -import ONYXKEYS from '@src/ONYXKEYS'; import ROUTES from '@src/ROUTES'; -import type {Modal, Report} from '@src/types/onyx'; +import type {Report} from '@src/types/onyx'; type SidebarLinksProps = { /** Toggles the navigation menu open and closed */ @@ -46,7 +43,6 @@ type SidebarLinksProps = { function SidebarLinks({onLinkClick, insets, optionListItems, isLoading, priorityMode = CONST.PRIORITY_MODE.DEFAULT, isActiveReport}: SidebarLinksProps) { const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); - const modal = useRef({}); const {updateLocale} = useLocalize(); const {shouldUseNarrowLayout} = useResponsiveLayout(); @@ -61,46 +57,7 @@ function SidebarLinks({onLinkClick, insets, optionListItems, isLoading, priority }); }); - const unsubscribeOnyxModal = onyxSubscribe({ - key: ONYXKEYS.MODAL, - callback: (modalArg) => { - if (modalArg === null || typeof modalArg !== 'object') { - return; - } - modal.current = modalArg; - }, - }); - - const shortcutConfig = CONST.KEYBOARD_SHORTCUTS.ESCAPE; - const unsubscribeEscapeKey = KeyboardShortcut.subscribe( - shortcutConfig.shortcutKey, - () => { - if (modal.current.willAlertModalBecomeVisible) { - return; - } - - if (modal.current.disableDismissOnEscape) { - return; - } - - Navigation.dismissModal(); - }, - shortcutConfig.descriptionKey, - shortcutConfig.modifiers, - true, - true, - ); - ReportActionContextMenu.hideContextMenu(false); - - return () => { - if (unsubscribeEscapeKey) { - unsubscribeEscapeKey(); - } - if (unsubscribeOnyxModal) { - unsubscribeOnyxModal(); - } - }; // eslint-disable-next-line react-compiler/react-compiler, react-hooks/exhaustive-deps }, []);