fix(android,v10): support navigating away and back from a sscreen wit…

android/rctmgl/src/main/java-v10/com/mapbox/rctmgl/components/mapview/RCTMGLMapView.kt

@@ -65,6 +65,10 @@ import org.json.JSONObject
 import java.util.*
 
 
+interface RCTMGLMapViewLifecycleOwner : LifecycleOwner {
+    fun handleLifecycleEvent(event: Lifecycle.Event)
+}
+
 open class RCTMGLMapView(private val mContext: Context, var mManager: RCTMGLMapViewManager /*, MapboxMapOptions options*/) : MapView(mContext), OnMapClickListener, OnMapLongClickListener {
     private val mSources: MutableMap<String, RCTSource<*>>
     private val mImages: MutableList<RCTMGLImages>
@@ -471,19 +475,33 @@ open class RCTMGLMapView(private val mContext: Context, var mManager: RCTMGLMapV
         return false
     }
 
+    private var lifecycleOwner : RCTMGLMapViewLifecycleOwner? = null
+
+    override fun onDetachedFromWindow() {
+        lifecycleOwner?.handleLifecycleEvent(Lifecycle.Event.ON_PAUSE)
+        super.onDetachedFromWindow();
+    }
+
     override fun onAttachedToWindow() {
-        val hostingLifecycleOwner = ViewTreeLifecycleOwner.get(this)
-        if (hostingLifecycleOwner == null) {
-            ViewTreeLifecycleOwner.set(this, object : LifecycleOwner {
+        if (lifecycleOwner == null) {
+            lifecycleOwner = object : RCTMGLMapViewLifecycleOwner {
                 private lateinit var lifecycleRegistry: LifecycleRegistry
                 init {
                     lifecycleRegistry = LifecycleRegistry(this)
                     lifecycleRegistry.currentState = Lifecycle.State.CREATED
                 }
+
+                override fun handleLifecycleEvent(event: Lifecycle.Event) {
+                    lifecycleRegistry.handleLifecycleEvent(event)
+                }
+
                 override fun getLifecycle(): Lifecycle {
                     return lifecycleRegistry
                 }
-            })
+            }
+            ViewTreeLifecycleOwner.set(this, lifecycleOwner);
+        } else {
+            lifecycleOwner?.handleLifecycleEvent(Lifecycle.Event.ON_RESUME)
         }
         super.onAttachedToWindow()
     }

example/src/App.js

@@ -1,6 +1,13 @@
 import React from 'react';
 import MapboxGL from '@rnmapbox/maps';
-import { StyleSheet, Text, View, LogBox, SafeAreaView } from 'react-native';
+import {
+  StyleSheet,
+  Text,
+  View,
+  LogBox,
+  SafeAreaView,
+  Button,
+} from 'react-native';
 import { createNativeStackNavigator } from '@react-navigation/native-stack';
 import { createCompatNavigatorFactory } from '@react-navigation/compat';
 import { NavigationContainer } from '@react-navigation/native';
@@ -11,6 +18,7 @@ import colors from './styles/colors';
 import { IS_ANDROID } from './utils';
 import config from './utils/config';
 import { Group, Item } from './scenes/GroupAndItem';
+import { ScreenWithoutMap } from './scenes/ScreenWithoutMap';
 
 LogBox.ignoreLogs([
   'Warning: isMounted(...) is deprecated',
@@ -28,8 +36,6 @@ MapboxGL.setAccessToken(config.get('accessToken'));
 
 Icon.loadFont();
 
-//console.log("=> [5*] 2", TransitionPresets);
-
 const Stack = createNativeStackNavigator();
 
 function AppStackNavigator() {
@@ -40,30 +46,11 @@ function AppStackNavigator() {
     >
       <Stack.Screen name="Group" component={Group} />
       <Stack.Screen name="Item" component={Item} />
+      <Stack.Screen name="ScreenWithoutMap" component={ScreenWithoutMap} />
     </Stack.Navigator>
   );
 }
 
-const AppStackNavigatorOld = createCompatNavigatorFactory(
-  createNativeStackNavigator,
-)(
-  {
-    Home: { screen: Group },
-    Demo: { screen: Item },
-    Group: { screen: Group },
-  },
-  {
-    initialRouteName: 'Home',
-
-    /*navigationOptions: {
-      ...TransitionPresets.SlideFromRightIOS,
-    },*/
-    defaultNavigationOptions: {
-      headerShown: false,
-    },
-  },
-);
-
 const AppContainer = () => (
   <NavigationContainer>
     <AppStackNavigator />

example/src/scenes/GroupAndItem.tsx

@@ -104,6 +104,7 @@ type NavigationType = 'Group' | 'Item';
 type ItemComponent = React.ComponentType<{
   label: string;
   onDismissExample: () => void;
+  navigation: ItemProps['navigation'];
 }>;
 
 interface ExampleNode {
@@ -190,7 +191,7 @@ const BugReportPage =
   ({ ...props }) =>
     (
       <Page {...props}>
-        <Klass />
+        <Klass {...props} />
       </Page>
     );
 
@@ -360,5 +361,11 @@ export const Item = ({ route, navigation }: ItemProps) => {
   }
   const { label, Component } = item;
 
-  return <Component label={label} onDismissExample={onDismissExample} />;
+  return (
+    <Component
+      label={label}
+      onDismissExample={onDismissExample}
+      navigation={navigation}
+    />
+  );
 };

example/src/scenes/ScreenWithoutMap.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import { Text, View, Button } from 'react-native';
+import type { NativeStackScreenProps } from '@react-navigation/native-stack';
+
+type StackParamsList = {
+  ScreenWithoutMap: Record<string, never>;
+};
+
+type ScreenWithoutMapProps = NativeStackScreenProps<
+  StackParamsList,
+  'ScreenWithoutMap'
+>;
+
+/**
+ * A simple component without any mapview, just for testing navigation away from a mapbview
+ */
+export function ScreenWithoutMap({
+  navigation,
+}: {
+  navigation: ScreenWithoutMapProps['navigation'];
+}): JSX.Element {
+  return (
+    <View>
+      <Text>No map view</Text>
+      <Button
+        title="Back"
+        onPress={() => {
+          navigation.goBack();
+        }}
+      />
+    </View>
+  );
+}