diff --git a/src/components/maps/CoordinatePickerMap.tsx b/src/components/maps/CoordinatePickerMap.tsx index 46b12bd56..6bb11b8d6 100644 --- a/src/components/maps/CoordinatePickerMap.tsx +++ b/src/components/maps/CoordinatePickerMap.tsx @@ -21,8 +21,7 @@ export const CoordinatePickerMap: React.FC = ({ showFullscreenControl = true, onCoordinateConfirmed }) => { const initialZoom = 14 - const defaultCoords = { lng: 0, lat: 0 } - const [newSelectedCoord, setNewSelectedCoord] = useState<{ lng: number, lat: number }>(defaultCoords) + const [newSelectedCoord, setNewSelectedCoord] = useState<{ lng: number, lat: number } | null>(null) const [cursor, setCursor] = useState('default') const [center, setCenter] = useState<{ lat: number, lng: number } | null>(null) const { isMobile } = useResponsive() @@ -51,9 +50,11 @@ export const CoordinatePickerMap: React.FC = ({ }, 100) const confirmSelection = (): void => { - setValue('latlngStr', `${newSelectedCoord.lat?.toFixed(5) ?? 0},${newSelectedCoord.lng?.toFixed(5) ?? 0}`, { shouldDirty: true, shouldValidate: true }) - if (onCoordinateConfirmed != null) { - onCoordinateConfirmed([newSelectedCoord.lng ?? 0, newSelectedCoord.lat ?? 0]) + if (newSelectedCoord != null) { + setValue('latlngStr', `${newSelectedCoord.lat?.toFixed(5) ?? 0},${newSelectedCoord.lng?.toFixed(5) ?? 0}`, { shouldDirty: true, shouldValidate: true }) + if (onCoordinateConfirmed != null) { + onCoordinateConfirmed([newSelectedCoord.lng ?? 0, newSelectedCoord.lat ?? 0]) + } } } @@ -79,7 +80,7 @@ export const CoordinatePickerMap: React.FC = ({ // Compare newSelectedCoord with watchedCoords to decide whether to show the crosshair const isNewCoord = (): boolean => { - if (watchedCoords === null) return false + if (watchedCoords === null || newSelectedCoord === null) return false const [lat, lng] = watchedCoords.split(',').map(Number) return !(newSelectedCoord.lat === lat && newSelectedCoord.lng === lng) } @@ -120,7 +121,7 @@ export const CoordinatePickerMap: React.FC = ({ )} - {isNewCoord() && ( + {isNewCoord() && newSelectedCoord !== null && ( = ({ cancelText='Cancel' onConfirm={confirmSelection} onCancel={() => { - setNewSelectedCoord({ lng: 0, lat: 0 }) + setNewSelectedCoord(null) }} hideCancel={false} hideConfirm={false} hideTitle customPositionClasses={anchorClass} > - Coordinates: {newSelectedCoord.lat?.toFixed(5) ?? 0}, {newSelectedCoord.lng?.toFixed(5) ?? 0} + Coordinates: {newSelectedCoord !== null ? `${newSelectedCoord.lat.toFixed(5)}, ${newSelectedCoord.lng.toFixed(5)}` : ''} )