ソースを参照

deep links for "/map"

Viktoriia 2 ヶ月 前
コミット
f1ec0331c8

+ 40 - 0
src/contexts/NavigationContext.tsx

@@ -63,6 +63,46 @@ export const NavigationProvider = ({ children }: { children: React.ReactNode })
             ]
           })
         );
+      } else if (path.startsWith('/map')) {
+        const segments = path.split('/');
+        let lon: string | undefined;
+        let lat: string | undefined;
+
+        segments.forEach((segment) => {
+          if (segment.startsWith('lon=')) {
+            lon = segment.replace('lon=', '');
+          } else if (segment.startsWith('lat=')) {
+            lat = segment.replace('lat=', '');
+          }
+        });
+
+        if (lon && lat) {
+          navigation.dispatch(
+            CommonActions.reset({
+              index: 1,
+              routes: [
+                {
+                  name: 'DrawerApp',
+                  state: {
+                    routes: [
+                      {
+                        name: NAVIGATION_PAGES.IN_APP_MAP_TAB,
+                        state: {
+                          routes: [
+                            {
+                              name: NAVIGATION_PAGES.MAP_TAB,
+                              params: { lon, lat }
+                            }
+                          ]
+                        }
+                      }
+                    ]
+                  }
+                }
+              ]
+            })
+          );
+        }
       }
     }
     if (!initialUrlProcessed) {

+ 33 - 0
src/screens/InAppScreens/MapScreen/index.tsx

@@ -416,6 +416,8 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
   const [isZooming, setIsZooming] = useState(true);
   const hideTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
 
+  const [markerCoords, setMarkerCoords] = useState<any>(null);
+
   const isSmallScreen = Dimensions.get('window').width < 383;
   const processedImages = useRef(new Set<string>());
 
@@ -614,6 +616,22 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
   }, [seriesVisited, seriesFilter]);
 
   useEffect(() => {
+    if (route.params?.lon && route.params?.lat) {
+      setMarkerCoords([route.params.lon, route.params.lat]);
+      const timeoutId = setTimeout(() => {
+        if (cameraRef.current) {
+          cameraRef.current.setCamera({
+            centerCoordinate: [route.params?.lon, route.params?.lat],
+            zoomLevel: 15,
+            animationDuration: 800
+          });
+        } else {
+          console.warn('Camera ref is not available.');
+        }
+      }, 800);
+
+      return () => clearTimeout(timeoutId);
+    }
     if (route.params?.id && route.params?.type && db1 && db2 && db3) {
       handleFindRegion(route.params?.id, route.params?.type);
     }
@@ -1239,6 +1257,21 @@ const MapScreen: any = ({ navigation, route }: { navigation: any; route: any })
           <View />
         </MapLibreRN.Images>
 
+        {markerCoords && (
+          <MapLibreRN.PointAnnotation id="marker" coordinate={markerCoords}>
+            <View
+              style={{
+                height: 24,
+                width: 24,
+                backgroundColor: Colors.ORANGE,
+                borderRadius: 12,
+                borderColor: Colors.WHITE,
+                borderWidth: 2
+              }}
+            />
+          </MapLibreRN.PointAnnotation>
+        )}
+
         {type === 'regions' && (
           <>
             <MapLibreRN.LineLayer