fix: include mapbox css
This commit is contained in:
parent
655d795a02
commit
581b405244
2 changed files with 12 additions and 5 deletions
|
|
@ -181,9 +181,12 @@ export default function HomePage() {
|
|||
};
|
||||
}, [pinLocation, estateValueAvailable, selectedCity, mode, threshold, profile]);
|
||||
|
||||
// Fetch isochrone when in isochrone mode with an active pin
|
||||
// Fetch isochrone when in isochrone mode with an active pin.
|
||||
// Isochrones are only shown in accessibility mode — switching to estate-value
|
||||
// or hidden-gem clears the isochrone so those overlays become visible.
|
||||
// Switching back to accessibility re-fetches the isochrone automatically.
|
||||
useEffect(() => {
|
||||
if (!pinLocation || overlayMode !== "isochrone") {
|
||||
if (!pinLocation || overlayMode !== "isochrone" || baseOverlay !== "accessibility") {
|
||||
setIsochroneData(null);
|
||||
return;
|
||||
}
|
||||
|
|
@ -218,7 +221,7 @@ export default function HomePage() {
|
|||
cancelled = true;
|
||||
setIsochroneLoading(false);
|
||||
};
|
||||
}, [pinLocation, overlayMode, mode, threshold]);
|
||||
}, [pinLocation, overlayMode, mode, threshold, baseOverlay]);
|
||||
|
||||
function handleProfileChange(newProfile: ProfileId) {
|
||||
setProfile(newProfile);
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import * as maplibregl from "maplibre-gl";
|
||||
import "maplibre-gl/dist/maplibre-gl.css";
|
||||
import { Protocol } from "pmtiles";
|
||||
import type { CategoryId, TravelMode, ProfileId } from "@transportationer/shared";
|
||||
|
||||
|
|
@ -196,8 +197,11 @@ export function MapView({
|
|||
}, [mapLoaded, citySlug, mode, threshold, profile]);
|
||||
|
||||
// ── Pin marker ─────────────────────────────────────────────────────────────
|
||||
// Markers are DOM elements — no need to wait for style to be loaded.
|
||||
// Markers are DOM elements (not style layers), but mapRef.current is only
|
||||
// set inside the mount effect which runs after all earlier effects. Adding
|
||||
// mapLoaded as a dep guarantees mapRef.current is non-null when this runs.
|
||||
useEffect(() => {
|
||||
if (!mapLoaded) return;
|
||||
const map = mapRef.current;
|
||||
if (!map) return;
|
||||
markerRef.current?.remove();
|
||||
|
|
@ -207,7 +211,7 @@ export function MapView({
|
|||
.setLngLat([pinLocation.lng, pinLocation.lat])
|
||||
.addTo(map);
|
||||
}
|
||||
}, [pinLocation]);
|
||||
}, [mapLoaded, pinLocation]);
|
||||
|
||||
// ── Grid visibility ───────────────────────────────────────────────────────
|
||||
useEffect(() => {
|
||||
|
|
|
|||
Loading…
Reference in a new issue