fix: onMarkerClick and onMarkerInfoWindowTapped on Android (#322)

Author: jokerttu

android/src/main/java/com/google/android/react/navsdk/MapViewFragment.java

@@ -113,7 +113,7 @@ public void onRecenterButtonClick() {
 
   @Override
   public void onMarkerClick(Marker marker) {
-    emitEvent("onMapReady", ObjectTranslationUtil.getMapFromMarker(marker));
+    emitEvent("onMarkerClick", ObjectTranslationUtil.getMapFromMarker(marker));
   }
 
   @Override
@@ -138,7 +138,7 @@ public void onGroundOverlayClick(GroundOverlay groundOverlay) {
 
   @Override
   public void onMarkerInfoWindowTapped(Marker marker) {
-    emitEvent("onInfoWindowClick", ObjectTranslationUtil.getMapFromMarker(marker));
+    emitEvent("onMarkerInfoWindowTapped", ObjectTranslationUtil.getMapFromMarker(marker));
   }
 
   @Override

android/src/main/java/com/google/android/react/navsdk/NavViewFragment.java

@@ -125,7 +125,7 @@ public void onRecenterButtonClick() {
 
   @Override
   public void onMarkerClick(Marker marker) {
-    emitEvent("onMapReady", ObjectTranslationUtil.getMapFromMarker(marker));
+    emitEvent("onMarkerClick", ObjectTranslationUtil.getMapFromMarker(marker));
   }
 
   @Override
@@ -150,7 +150,7 @@ public void onGroundOverlayClick(GroundOverlay groundOverlay) {
 
   @Override
   public void onMarkerInfoWindowTapped(Marker marker) {
-    emitEvent("onInfoWindowClick", ObjectTranslationUtil.getMapFromMarker(marker));
+    emitEvent("onMarkerInfoWindowTapped", ObjectTranslationUtil.getMapFromMarker(marker));
   }
 
   @Override

example/src/App.tsx

@@ -17,6 +17,7 @@
 import * as React from 'react';
 import {
   NavigationContainer,
+  useIsFocused,
   useNavigation,
   type NavigationProp,
 } from '@react-navigation/native';
@@ -37,15 +38,20 @@ export type StackNavigation = NavigationProp<RootStackParamList>;
 
 const HomeScreen = () => {
   const { navigate } = useNavigation<StackNavigation>();
+  const isFocused = useIsFocused();
+
   return (
     <View style={styles.container}>
       <View style={styles.buttonContainer}>
-        <Button title="Navigation" onPress={() => navigate('Navigation')} />
+        <Button
+          title="Navigation"
+          onPress={() => isFocused && navigate('Navigation')}
+        />
       </View>
       <View style={styles.buttonContainer}>
         <Button
           title="Multiple Maps"
-          onPress={() => navigate('Multiple maps')}
+          onPress={() => isFocused && navigate('Multiple maps')}
         />
       </View>
     </View>

example/src/screens/NavigationScreen.tsx

@@ -258,7 +258,6 @@ const NavigationScreen = () => {
   useEffect(() => {
     (async () => {
       const isAvailable = await mapViewAutoController.isAutoScreenAvailable();
-      console.log('isAutoScreenAvailable:', isAvailable);
       setMapViewAutoAvailable(isAvailable);
     })();
   }, [mapViewAutoController]);
@@ -312,7 +311,10 @@ const NavigationScreen = () => {
       onMapReady,
       onMarkerClick: (marker: Marker) => {
         console.log('onMarkerClick:', marker);
-        mapViewController?.removeMarker(marker.id);
+        showSnackbar('Removing marker in 5 seconds');
+        setTimeout(() => {
+          mapViewController?.removeMarker(marker.id);
+        }, 5000);
       },
       onPolygonClick: (polygon: Polygon) => {
         console.log('onPolygonClick:', polygon);