Merge pull request #76343 from mdneyazahmad/fix/74735-navigation-transition

fix: broken screen animation during navigation transition

Author: Valforte

src/libs/Navigation/OnyxTabNavigator.tsx

@@ -46,9 +46,6 @@ type OnyxTabNavigatorProps = ChildrenProps & {
     /** Whether to show the label when the tab is inactive */
     shouldShowLabelWhenInactive?: boolean;
 
-    /** Disable swipe between tabs */
-    disableSwipe?: boolean;
-
     /** Determines whether the product training tooltip should be displayed to the user. */
     shouldShowProductTrainingTooltip?: boolean;
 
@@ -102,7 +99,6 @@ function OnyxTabNavigator({
     onTabSelected = () => {},
     screenListeners,
     shouldShowLabelWhenInactive = true,
-    disableSwipe = false,
     shouldShowProductTrainingTooltip,
     renderProductTrainingTooltip,
     lazyLoadEnabled = false,
@@ -193,7 +189,7 @@ function OnyxTabNavigator({
                 }}
                 screenOptions={{
                     ...defaultScreenOptions,
-                    swipeEnabled: !disableSwipe,
+                    swipeEnabled: false,
                     lazy: lazyLoadEnabled,
                     lazyPlaceholder: LazyPlaceholder,
                 }}

src/pages/NewChatSelectorPage.tsx

@@ -5,14 +5,11 @@ import type {AnimatedTextInputRef} from '@components/RNTextInput';
 import ScreenWrapper from '@components/ScreenWrapper';
 import TabSelector from '@components/TabSelector/TabSelector';
 import useLocalize from '@hooks/useLocalize';
-import useOnyx from '@hooks/useOnyx';
-import useResponsiveLayout from '@hooks/useResponsiveLayout';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {setNewRoomFormLoading} from '@libs/actions/Report';
 import Navigation from '@libs/Navigation/Navigation';
 import OnyxTabNavigator, {TabScreenWithFocusTrapWrapper, TopTab} from '@libs/Navigation/OnyxTabNavigator';
 import CONST from '@src/CONST';
-import ONYXKEYS from '@src/ONYXKEYS';
 import NewChatPage from './NewChatPage';
 import WorkspaceNewRoomPage from './workspace/WorkspaceNewRoomPage';
 
@@ -23,8 +20,6 @@ function NewChatSelectorPage() {
     const [headerWithBackBtnContainerElement, setHeaderWithBackButtonContainerElement] = useState<HTMLElement | null>(null);
     const [tabBarContainerElement, setTabBarContainerElement] = useState<HTMLElement | null>(null);
     const [activeTabContainerElement, setActiveTabContainerElement] = useState<HTMLElement | null>(null);
-    const [formState] = useOnyx(ONYXKEYS.FORMS.NEW_ROOM_FORM, {canBeMissing: true});
-    const {shouldUseNarrowLayout} = useResponsiveLayout();
     const chatPageInputRef = useRef<AnimatedTextInputRef | null>(null);
     const roomPageInputRef = useRef<AnimatedTextInputRef | null>(null);
 
@@ -84,7 +79,6 @@ function NewChatSelectorPage() {
                 tabBar={TabSelector}
                 onTabBarFocusTrapContainerElementChanged={setTabBarContainerElement}
                 onActiveTabFocusTrapContainerElementChanged={onTabFocusTrapContainerElementChanged}
-                disableSwipe={!!formState?.isLoading && shouldUseNarrowLayout}
                 onTabSelect={onTabSelectFocusHandler}
             >
                 <TopTab.Screen name={CONST.TAB.NEW_CHAT}>

src/pages/iou/request/IOURequestStartPage.tsx

@@ -18,7 +18,6 @@ import usePolicy from '@hooks/usePolicy';
 import usePrevious from '@hooks/usePrevious';
 import useThemeStyles from '@hooks/useThemeStyles';
 import {dismissProductTraining} from '@libs/actions/Welcome';
-import {isMobile} from '@libs/Browser';
 import {canUseTouchScreen} from '@libs/DeviceCapabilities';
 import getNonEmptyStringOnyxID from '@libs/getNonEmptyStringOnyxID';
 import getPlatform from '@libs/getPlatform';
@@ -283,8 +282,6 @@ function IOURequestStartPage({
                                 shouldShowProductTrainingTooltip={shouldShowProductTrainingTooltip}
                                 renderProductTrainingTooltip={renderProductTrainingTooltip}
                                 lazyLoadEnabled
-                                // We're disabling swipe on mWeb fo the Per Diem tab because the keyboard will hang on the other tab after switching
-                                disableSwipe={(isMultiScanEnabled && selectedTab === CONST.TAB_REQUEST.SCAN) || (selectedTab === CONST.TAB_REQUEST.PER_DIEM && isMobile())}
                             >
                                 <TopTab.Screen name={CONST.TAB_REQUEST.MANUAL}>
                                     {() => (