diff options
Diffstat (limited to 'src/pages/Map.tsx')
| -rw-r--r-- | src/pages/Map.tsx | 16 |
1 files changed, 11 insertions, 5 deletions
diff --git a/src/pages/Map.tsx b/src/pages/Map.tsx index 9abb7a3..af95bf9 100644 --- a/src/pages/Map.tsx +++ b/src/pages/Map.tsx @@ -1,4 +1,4 @@ -import { StopDataProvider, Stop } from "../data/StopDataProvider"; +import StopDataProvider, { Stop } from "../data/StopDataProvider"; import 'leaflet/dist/leaflet.css' import 'react-leaflet-markercluster/styles' @@ -20,8 +20,6 @@ const icon = new Icon({ shadowSize: [41, 41] }); -const sdp = new StopDataProvider(); - // Componente auxiliar para detectar cambios en el mapa const MapEventHandler = () => { const { updateMapState } = useApp(); @@ -43,9 +41,17 @@ export function StopMap() { const { mapState } = useApp(); useEffect(() => { - sdp.getStops().then((stops) => { setStops(stops); }); + StopDataProvider.getStops().then((stops) => { setStops(stops); }); }, []); + const getDisplayName = (stop: Stop): string => { + if (typeof stop.name === 'string') { + return stop.name; + } + + return stop.name.intersect || stop.name.original; + } + return ( <MapContainer center={mapState.center} @@ -63,7 +69,7 @@ export function StopMap() { {stops.map((stop) => ( <Marker key={stop.stopId} position={[stop.latitude, stop.longitude] as LatLngTuple} icon={icon}> <Popup> - <Link to={`/estimates/${stop.stopId}`}>{stop.name}</Link> + <Link to={`/estimates/${stop.stopId}`}>{getDisplayName(stop)}</Link> <br /> {stop.lines.map((line) => ( <LineIcon key={line} line={line} /> |