fix: resolve Next.js docker build endpoints and handle async map icons

frontend/src/components/MaplibreViewer.tsx

@@ -373,15 +373,37 @@ const MaplibreViewer = ({ data, activeLayers, onEntityClick, flyToLocation, sele
     const onMapLoad = useCallback((e: any) => {
         const map = e.target;
 
+        // Track which images are still loading so we can retry on styleimagemissing
+        const pendingImages: Record<string, string> = {};
+
         const loadImg = (id: string, url: string) => {
             if (!map.hasImage(id)) {
+                pendingImages[id] = url;
                 const img = new Image();
                 img.crossOrigin = "anonymous";
                 img.src = url;
-                img.onload = () => map.addImage(id, img);
+                img.onload = () => {
+                    if (!map.hasImage(id)) map.addImage(id, img);
+                    delete pendingImages[id];
+                };
             }
         };
 
+        // Suppress "image not found" warnings — retry when the async load finishes
+        map.on('styleimagemissing', (ev: any) => {
+            const id = ev.id;
+            const url = pendingImages[id];
+            if (url) {
+                const img = new Image();
+                img.crossOrigin = "anonymous";
+                img.src = url;
+                img.onload = () => {
+                    if (!map.hasImage(id)) map.addImage(id, img);
+                    delete pendingImages[id];
+                };
+            }
+        });
+
         // Legacy generic plane icons (still used as fallbacks)
         loadImg('svgPlaneCyan', svgPlaneCyan);
         loadImg('svgPlaneYellow', svgPlaneYellow);

frontend/src/lib/api.ts

@@ -1 +1,28 @@
-export const API_BASE = process.env.NEXT_PUBLIC_API_URL || "http://localhost:8000";
+// NEXT_PUBLIC_* vars are baked at build time in Next.js, so setting them
+// in docker-compose `environment` has no effect at runtime.  Instead we
+// auto-detect: use the browser's current hostname with a configurable port
+// so the dashboard works on localhost, LAN IPs, and custom Docker port maps
+// without any code changes.
+//
+// Override order:
+//   1. Build-time NEXT_PUBLIC_API_URL (for advanced users who rebuild the image)
+//   2. Runtime auto-detect from window.location.hostname + port 8000
+
+function resolveApiBase(): string {
+  // Build-time override (works when image is rebuilt with the env var)
+  if (process.env.NEXT_PUBLIC_API_URL) {
+    return process.env.NEXT_PUBLIC_API_URL;
+  }
+
+  // Server-side rendering: fall back to localhost
+  if (typeof window === "undefined") {
+    return "http://localhost:8000";
+  }
+
+  // Client-side: use the same hostname the user is browsing on
+  const proto = window.location.protocol;
+  const host = window.location.hostname;
+  return `${proto}//${host}:8000`;
+}
+
+export const API_BASE = resolveApiBase();