mirror of
https://github.com/zvx-echo6/navi.git
synced 2026-05-20 14:44:51 +02:00
fix(map): boundary lifecycle cleanup on place deselection
Clear boundary source data when: - Clicking outside the marker circle (deselecting) - Clicking a new place (before setting new boundary) - Clicking empty map area (generic map click) This ensures: 1. Re-clicking the same city after dismissing re-renders boundary (selectedPlace is properly cleared, triggering fresh useEffect) 2. Clicking away doesn't leave stale boundary outline (boundary source explicitly cleared to empty FeatureCollection) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
472ef4d0e8
commit
29f995d885
1 changed files with 17 additions and 1 deletions
|
|
@ -1252,6 +1252,12 @@ const MapView = forwardRef(function MapView(_, ref) {
|
||||||
// Outside circle → deselect, no new selection
|
// Outside circle → deselect, no new selection
|
||||||
store.clearClickMarker()
|
store.clearClickMarker()
|
||||||
store.clearSelectedPlace()
|
store.clearSelectedPlace()
|
||||||
|
// Clear boundary when deselecting
|
||||||
|
const boundarySource = map.getSource(BOUNDARY_SOURCE)
|
||||||
|
if (boundarySource) {
|
||||||
|
boundarySource.setData({ type: 'FeatureCollection', features: [] })
|
||||||
|
}
|
||||||
|
setSelectedHighlight(map, null)
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// State A: nothing selected → select
|
// State A: nothing selected → select
|
||||||
|
|
@ -1267,7 +1273,7 @@ const MapView = forwardRef(function MapView(_, ref) {
|
||||||
// Find first feature with a name (respects layer order = priority)
|
// Find first feature with a name (respects layer order = priority)
|
||||||
const labelFeature = features.find(f => f.properties?.name)
|
const labelFeature = features.find(f => f.properties?.name)
|
||||||
|
|
||||||
// Clear previous feature highlight
|
// Clear previous feature highlight and boundary
|
||||||
if (highlightedFeatureRef.current) {
|
if (highlightedFeatureRef.current) {
|
||||||
const { source, sourceLayer, id } = highlightedFeatureRef.current
|
const { source, sourceLayer, id } = highlightedFeatureRef.current
|
||||||
try {
|
try {
|
||||||
|
|
@ -1276,6 +1282,11 @@ const MapView = forwardRef(function MapView(_, ref) {
|
||||||
highlightedFeatureRef.current = null
|
highlightedFeatureRef.current = null
|
||||||
}
|
}
|
||||||
setSelectedHighlight(map, null)
|
setSelectedHighlight(map, null)
|
||||||
|
// Clear old boundary before setting new place
|
||||||
|
const boundarySource = map.getSource(BOUNDARY_SOURCE)
|
||||||
|
if (boundarySource) {
|
||||||
|
boundarySource.setData({ type: 'FeatureCollection', features: [] })
|
||||||
|
}
|
||||||
|
|
||||||
if (labelFeature) {
|
if (labelFeature) {
|
||||||
// Clicked a labeled feature — snap to geometry and highlight
|
// Clicked a labeled feature — snap to geometry and highlight
|
||||||
|
|
@ -1330,6 +1341,11 @@ const MapView = forwardRef(function MapView(_, ref) {
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
// No labeled feature — show reticle at click point
|
// No labeled feature — show reticle at click point
|
||||||
|
// Clear any existing boundary when clicking empty map
|
||||||
|
const boundarySource = map.getSource(BOUNDARY_SOURCE)
|
||||||
|
if (boundarySource) {
|
||||||
|
boundarySource.setData({ type: 'FeatureCollection', features: [] })
|
||||||
|
}
|
||||||
store.setClickMarker({
|
store.setClickMarker({
|
||||||
lat,
|
lat,
|
||||||
lon: lng,
|
lon: lng,
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue