fix: include mapbox css

This commit is contained in:
Jan-Henrik 2026-03-02 23:44:10 +01:00
parent 655d795a02
commit 581b405244
2 changed files with 12 additions and 5 deletions

View file

@ -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);

View file

@ -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(() => {