map loading bugs

src/MapView.tsx

@@ -1,11 +1,10 @@
 import { useEffect, useMemo, useRef, useState } from "react";
 import maplibregl, { Map as MapLibreMap, LngLatLike } from "maplibre-gl";
 import "maplibre-gl/dist/maplibre-gl.css";
-// @ts-expect-error: TS does not see the re-export-of-default in @deck.gl/mapbox's
+// @ts-ignore: some TS/deck.gl versions surface MapboxOverlay as a named export,
-// index.d.ts (`export { default as MapboxOverlay }`). Vite/Rollup resolve it correctly
+// others don't. Silent when the export exists, suppresses TS2305 when it doesn't.
-// at build time and the value exists at runtime (`Object.keys(require('@deck.gl/mapbox'))
+// Runtime is fine either way — Vite/Rollup resolve `MapboxOverlay` from
-// === ['MapboxOverlay']`). Remove this directive if a future TS/deck.gl release surfaces
+// @deck.gl/mapbox's index at build time.
-// the named export.
 import { MapboxOverlay } from "@deck.gl/mapbox";
 import { ScatterplotLayer, PathLayer, GeoJsonLayer, TextLayer, IconLayer } from "@deck.gl/layers";
 import { PathStyleExtension } from "@deck.gl/extensions";
@@ -346,19 +345,24 @@ export function MapView({
         return "";
       },
       onClick: (
-        info: {
+        rawInfo: unknown,
+        rawEvent: unknown,
+      ) => {
+        // deck.gl's PickingInfo/MjolnirGestureEvent types are wider than we
+        // need — cast down to the fields we actually read. The runtime shape
+        // is stable across 9.x; the extra fields on those types are ignored.
+        const info = rawInfo as {
           object?: unknown;
           coordinate?: number[];
-          layer?: { id: string };
+          layer?: { id?: string } | null;
-        },
+        };
-        event?: {
+        const event = rawEvent as {
           srcEvent?: {
             shiftKey?: boolean;
             ctrlKey?: boolean;
             metaKey?: boolean;
           };
-        },
+        };
-      ) => {
         if (drawRoadModeRef.current && info.coordinate) {
           const [lng, lat] = info.coordinate;
           onDrawRoadAddPointRef.current?.(lat, lng);
@@ -640,7 +644,7 @@ export function MapView({
       layers.push(
         new GeoJsonLayer({
           id: "osm-roads-halo",
-          data: visibleOsm,
+          data: visibleOsm as never,
           stroked: true,
           filled: false,
           getLineColor: [0, 0, 0, 220],
@@ -659,7 +663,7 @@ export function MapView({
         layers.push(
           new GeoJsonLayer({
             id: "osm-roads-pick",
-            data: visibleOsm,
+            data: visibleOsm as never,
             stroked: true,
             filled: false,
             getLineColor: [0, 0, 0, 0],
@@ -672,7 +676,7 @@ export function MapView({
       layers.push(
         new GeoJsonLayer({
           id: "osm-roads",
-          data: visibleOsm,
+          data: visibleOsm as never,
           stroked: true,
           filled: false,
           getLineColor: (f: unknown) => {
@@ -836,7 +840,7 @@ export function MapView({
           layers.push(
             new GeoJsonLayer({
               id: "osm-roads-editing",
-              data: { type: "FeatureCollection", features: [editing] },
+              data: { type: "FeatureCollection", features: [editing] } as never,
               stroked: true,
               filled: false,
               getLineColor: [255, 215, 0, 255],
@@ -1244,7 +1248,7 @@ export function MapView({
       layers.push(
         new GeoJsonLayer({
           id: "scope-polygons",
-          data: scopePolygonFC,
+          data: scopePolygonFC as never,
           filled: true,
           stroked: true,
           getFillColor: [255, 64, 200, 50],
@@ -1257,7 +1261,7 @@ export function MapView({
       layers.push(
         new GeoJsonLayer({
           id: "scope-polygons-stroke",
-          data: scopePolygonFC,
+          data: scopePolygonFC as never,
           filled: false,
           stroked: true,
           getLineColor: [255, 64, 200, 255],
@@ -1269,7 +1273,7 @@ export function MapView({
       layers.push(
         new GeoJsonLayer({
           id: "scope-lines-halo",
-          data: scopeLineFC,
+          data: scopeLineFC as never,
           stroked: true,
           filled: false,
           getLineColor: [0, 0, 0, 220],
@@ -1281,7 +1285,7 @@ export function MapView({
       layers.push(
         new GeoJsonLayer({
           id: "scope-lines",
-          data: scopeLineFC,
+          data: scopeLineFC as never,
           stroked: true,
           filled: false,
           getLineColor: [255, 64, 200, 255],
@@ -1666,7 +1670,7 @@ export function MapView({
         KEEP.has(((l as { id?: string }).id ?? "")),
       );
     }
-    overlay.setProps({ layers: outLayers });
+    overlay.setProps({ layers: outLayers as never });
   }, [
     fixedPoints,
     rangePaths,