From 30f5c6c5c32e9accfca95c24e324365dbbe5e3dc Mon Sep 17 00:00:00 2001
From: Vit Horacek <vit@expensify.com>
Date: Thu, 11 Jan 2024 22:00:21 +0000
Subject: [PATCH] Revert "Merge pull request #32422 from tienifr/fix/31503"

This reverts commit 276b0071735c056fb22a211a2bd5754486f0fdb2, reversing
changes made to 5a0b7fdb08979ea765f8a6c9e3b03e78ce61eb4a.
---
 .../AppNavigator/createCustomStackNavigator/CustomRouter.ts | 4 +---
 .../createCustomStackNavigator/index.native.tsx             | 2 ++
 .../AppNavigator/createCustomStackNavigator/index.tsx       | 2 ++
 .../AppNavigator/createCustomStackNavigator/types.ts        | 4 +++-
 src/libs/getIsSmallScreenWidth.ts                           | 6 ------
 5 files changed, 8 insertions(+), 10 deletions(-)
 delete mode 100644 src/libs/getIsSmallScreenWidth.ts

diff --git a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/CustomRouter.ts b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/CustomRouter.ts
index 10cee2c85952..020719e2dc36 100644
--- a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/CustomRouter.ts
+++ b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/CustomRouter.ts
@@ -1,7 +1,6 @@
 import type {NavigationState, PartialState, RouterConfigOptions, StackNavigationState} from '@react-navigation/native';
 import {StackRouter} from '@react-navigation/native';
 import type {ParamListBase} from '@react-navigation/routers';
-import getIsSmallScreenWidth from '@libs/getIsSmallScreenWidth';
 import NAVIGATORS from '@src/NAVIGATORS';
 import SCREENS from '@src/SCREENS';
 import type {ResponsiveStackNavigatorRouterOptions} from './types';
@@ -65,9 +64,8 @@ function CustomRouter(options: ResponsiveStackNavigatorRouterOptions) {
     return {
         ...stackRouter,
         getRehydratedState(partialState: StackNavigationState<ParamListBase>, {routeNames, routeParamList, routeGetIdList}: RouterConfigOptions): StackNavigationState<ParamListBase> {
-            const isSmallScreenWidth = getIsSmallScreenWidth();
             // Make sure that there is at least one CentralPaneNavigator (ReportScreen by default) in the state if this is a wide layout
-            if (!isAtLeastOneCentralPaneNavigatorInState(partialState) && !isSmallScreenWidth) {
+            if (!isAtLeastOneCentralPaneNavigatorInState(partialState) && !options.getIsSmallScreenWidth()) {
                 // If we added a route we need to make sure that the state.stale is true to generate new key for this route
 
                 // eslint-disable-next-line no-param-reassign
diff --git a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.native.tsx b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.native.tsx
index 151dd0a0f893..5f1010da2ed1 100644
--- a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.native.tsx
+++ b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.native.tsx
@@ -24,6 +24,8 @@ function ResponsiveStackNavigator(props: ResponsiveStackNavigatorProps) {
         children: props.children,
         screenOptions: props.screenOptions,
         initialRouteName: props.initialRouteName,
+        // Options for useNavigationBuilder won't update on prop change, so we need to pass a getter for the router to have the current state of isSmallScreenWidth.
+        getIsSmallScreenWidth: () => isSmallScreenWidthRef.current,
     });
 
     return (
diff --git a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.tsx b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.tsx
index 3f6025d5ff0c..06845e6e6f61 100644
--- a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.tsx
+++ b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/index.tsx
@@ -46,6 +46,8 @@ function ResponsiveStackNavigator(props: ResponsiveStackNavigatorProps) {
         children: props.children,
         screenOptions: props.screenOptions,
         initialRouteName: props.initialRouteName,
+        // Options for useNavigationBuilder won't update on prop change, so we need to pass a getter for the router to have the current state of isSmallScreenWidth.
+        getIsSmallScreenWidth: () => isSmallScreenWidthRef.current,
     });
 
     const stateToRender = useMemo(() => {
diff --git a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/types.ts b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/types.ts
index 09d35e2a1680..ea94fed19b11 100644
--- a/src/libs/Navigation/AppNavigator/createCustomStackNavigator/types.ts
+++ b/src/libs/Navigation/AppNavigator/createCustomStackNavigator/types.ts
@@ -5,7 +5,9 @@ type ResponsiveStackNavigatorConfig = {
     isSmallScreenWidth: boolean;
 };
 
-type ResponsiveStackNavigatorRouterOptions = StackRouterOptions;
+type ResponsiveStackNavigatorRouterOptions = StackRouterOptions & {
+    getIsSmallScreenWidth: () => boolean;
+};
 
 type ResponsiveStackNavigatorProps = DefaultNavigatorOptions<ParamListBase, StackNavigationState<ParamListBase>, StackNavigationOptions, StackNavigationEventMap> &
     ResponsiveStackNavigatorConfig;
diff --git a/src/libs/getIsSmallScreenWidth.ts b/src/libs/getIsSmallScreenWidth.ts
deleted file mode 100644
index 6fba45ea1319..000000000000
--- a/src/libs/getIsSmallScreenWidth.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import {Dimensions} from 'react-native';
-import variables from '@styles/variables';
-
-export default function getIsSmallScreenWidth(windowWidth = Dimensions.get('window').width) {
-    return windowWidth <= variables.mobileResponsiveWidthBreakpoint;
-}