Update MapCanvas.tsx

web/src/components/map/MapCanvas.tsx

@@ -57,20 +57,58 @@ export default function MapCanvas({
   useEffect(() => {
     fetch("/config/runtime", { cache: "no-store" })
       .then((r) => (r.ok ? r.json() : Promise.reject(new Error(r.statusText))))
-      .then(setCfg)
-      .catch((e) => setErr(e.message));
+      .then((json) => {
+        // Safe, partial logging (don’t leak the full key)
+        const k = json?.VITE_GOOGLE_MAPS_API_KEY;
+        const mid = json?.VITE_GOOGLE_MAPS_MAP_ID;
+        console.log("[PulseMap] /config/runtime:", {
+          key_present: !!k,
+          key_len: k?.length ?? 0,
+          key_preview: k ? `${k.slice(0, 6)}...${k.slice(-4)}` : null,
+          map_id_present: !!mid,
+          map_id_preview: mid ? `${mid.slice(0, 5)}...` : null,
+        });
+        setCfg(json);
+      })
+      .catch((e) => {
+        console.error("[PulseMap] runtime config fetch failed:", e);
+        setErr(e.message);
+      });
+  }, []);
+  const effectiveKey = cfg?.VITE_GOOGLE_MAPS_API_KEY ?? GMAPS_KEY;
+  const effectiveMapId = cfg?.VITE_GOOGLE_MAPS_MAP_ID ?? MAP_ID;
+
+  useEffect(() => {
+    console.log("[PulseMap] build-time env:", {
+      GMAPS_KEY_present: !!GMAPS_KEY,
+      GMAPS_KEY_len: GMAPS_KEY?.length ?? 0,
+      GMAPS_KEY_preview: GMAPS_KEY
+        ? `${GMAPS_KEY.slice(0, 6)}...${GMAPS_KEY.slice(-4)}`
+        : null,
+      MAP_ID_present: !!MAP_ID,
+      MAP_ID_preview: MAP_ID ? `${MAP_ID.slice(0, 5)}...` : null,
+    });
   }, []);
 
   if (err) return <div>Map config error: {err}</div>;
-  if (!cfg?.VITE_GOOGLE_MAPS_API_KEY) return <div>Loading map…</div>;
+  if (!effectiveKey) {
+    console.warn(
+      "[PulseMap] No Google Maps API key found from runtime or build-time."
+    );
+    return <div>No Google Maps API key. Check /config/runtime and env.</div>;
+  }
+
+  // TEMP: isolate auth failures by removing mapId during testing
+  const testingMapId: string | undefined = undefined; // <- set to 'effectiveMapId' once key works
+
   return (
     <APIProvider
-      apiKey={cfg.VITE_GOOGLE_MAPS_API_KEY || GMAPS_KEY}
+      apiKey={effectiveKey || GMAPS_KEY}
       libraries={["places", "marker"]}
     >
       <Map
         className="map"
-        mapId={cfg.VITE_GOOGLE_MAPS_MAP_ID || MAP_ID || undefined}
+        mapId={testingMapId || MAP_ID || undefined}
         defaultCenter={{ lat: 39, lng: -98 }}
         defaultZoom={4}
         gestureHandling="greedy"