diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 6e14fc3..cf63c90 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -686,6 +686,8 @@ function AuthenticatedApp({ user, onLogout }: AuthenticatedAppProps) { dokdoWatchSuspects={koreaFiltersResult.dokdoWatchSuspects} dokdoAlerts={koreaFiltersResult.dokdoAlerts} vesselAnalysis={vesselAnalysis} + externalFlyTo={flyToTarget} + onExternalFlyToDone={() => setFlyToTarget(null)} />
; dokdoAlerts: { mmsi: string; name: string; dist: number; time: number }[]; vesselAnalysis?: UseVesselAnalysisResult; + externalFlyTo?: { lat: number; lng: number; zoom: number } | null; + onExternalFlyToDone?: () => void; } // MarineTraffic-style: satellite + dark ocean + nautical overlay @@ -132,7 +134,7 @@ const FILTER_I18N_KEY: Record = { ferryWatch: 'filters.ferryWatchMonitor', }; -export function KoreaMap({ ships, allShips, aircraft, satellites, layers, osintFeed, currentTime, koreaFilters, transshipSuspects, cableWatchSuspects, dokdoWatchSuspects, dokdoAlerts, vesselAnalysis }: Props) { +export function KoreaMap({ ships, allShips, aircraft, satellites, layers, osintFeed, currentTime, koreaFilters, transshipSuspects, cableWatchSuspects, dokdoWatchSuspects, dokdoAlerts, vesselAnalysis, externalFlyTo, onExternalFlyToDone }: Props) { const { t } = useTranslation(); const mapRef = useRef(null); const [infra, setInfra] = useState([]); @@ -156,6 +158,13 @@ export function KoreaMap({ ships, allShips, aircraft, satellites, layers, osintF } }, [flyToTarget]); + useEffect(() => { + if (externalFlyTo && mapRef.current) { + mapRef.current.flyTo({ center: [externalFlyTo.lng, externalFlyTo.lat], zoom: externalFlyTo.zoom, duration: 1500 }); + onExternalFlyToDone?.(); + } + }, [externalFlyTo, onExternalFlyToDone]); + useEffect(() => { if (!selectedAnalysisMmsi) setTrackCoords(null); }, [selectedAnalysisMmsi]);