Update react native screens, remove patch (#9210)

* update react native screens

* bump rns

* see if nightly works

* update nightly

* yay it's out

* update react-nav

* update drawer layout and remove patch

* Update createNativeStackNavigatorWithAuth.tsx

* render drawer as "layout" component

* rm react-nav/drawer (unused)

* restore drawer layout patch

src/Navigation.tsx

@@ -5,6 +5,7 @@ import {i18n, type MessageDescriptor} from '@lingui/core'
 import {msg} from '@lingui/macro'
 import {
   type BottomTabBarProps,
+  type BottomTabNavigatorProps,
   createBottomTabNavigator,
 } from '@react-navigation/bottom-tabs'
 import {
@@ -636,7 +637,7 @@ function commonScreens(Stack: typeof Flat, unreadCountLabel?: string) {
  * The TabsNavigator is used by native mobile to represent the routes
  * in 3 distinct tab-stacks with a different root screen on each.
  */
-function TabsNavigator() {
+function TabsNavigator({layout}: {layout: BottomTabNavigatorProps['layout']}) {
   const tabBar = useCallback(
     (props: JSX.IntrinsicAttributes & BottomTabBarProps) => (
       <BottomBar {...props} />
@@ -649,7 +650,8 @@ function TabsNavigator() {
       initialRouteName="HomeTab"
       backBehavior="initialRoute"
       screenOptions={{headerShown: false, lazy: true}}
-      tabBar={tabBar}>
+      tabBar={tabBar}
+      layout={layout}>
       <Tab.Screen name="HomeTab" getComponent={() => HomeTabNavigator} />
       <Tab.Screen name="SearchTab" getComponent={() => SearchTabNavigator} />
       <Tab.Screen

src/view/shell/createNativeStackNavigatorWithAuth.tsx

@@ -50,11 +50,13 @@ type NativeStackNavigationOptionsWithAuth = NativeStackNavigationOptions & {
 function NativeStackNavigator({
   id,
   initialRouteName,
+  UNSTABLE_routeNamesChangeBehavior,
   children,
   layout,
   screenListeners,
   screenOptions,
   screenLayout,
+  UNSTABLE_router,
   ...rest
 }: NativeStackNavigatorProps) {
   // --- this is copy and pasted from the original native stack navigator ---
@@ -68,11 +70,13 @@ function NativeStackNavigator({
     >(StackRouter, {
       id,
       initialRouteName,
+      UNSTABLE_routeNamesChangeBehavior,
       children,
       layout,
       screenListeners,
       screenOptions,
       screenLayout,
+      UNSTABLE_router,
     })
 
   React.useEffect(
@@ -169,7 +173,7 @@ function NativeStackNavigator({
 
 export function createNativeStackNavigatorWithAuth<
   const ParamList extends ParamListBase,
-  const NavigatorID extends string | undefined = undefined,
+  const NavigatorID extends string | undefined = string | undefined,
   const TypeBag extends NavigatorTypeBagBase = {
     ParamList: ParamList
     NavigatorID: NavigatorID

src/view/shell/index.tsx

@@ -91,14 +91,19 @@ function ShellInner() {
     }
   }, [dedupe, navigation])
 
+  const drawerLayout = useCallback(
+    ({children}: {children: React.ReactNode}) => (
+      <DrawerLayout>{children}</DrawerLayout>
+    ),
+    [],
+  )
+
   return (
     <>
       <View style={[a.h_full]}>
         <ErrorBoundary
           style={{paddingTop: insets.top, paddingBottom: insets.bottom}}>
-          <DrawerLayout>
-            <TabsNavigator />
-          </DrawerLayout>
+          <TabsNavigator layout={drawerLayout} />
         </ErrorBoundary>
       </View>