From 340865ad234f974ec4c0afcbfb6ff06f50a11b2f Mon Sep 17 00:00:00 2001
From: Ariel Costas Guerrero <ariel@costas.dev>
Date: Sun, 20 Apr 2025 19:07:29 +0200
Subject: Load stops from local data files

---
 src/pages/Map.tsx | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

(limited to 'src/pages/Map.tsx')

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} />
-- 
cgit v1.3