mirror of
https://github.com/BigBodyCobain/Shadowbroker.git
synced 2026-09-17 14:42:20 +02:00
C3B2W23andClaude Fable 5.1
8f169f1ecc
CARTO now requires an API key for its basemap tiles; without one every tile in the DEFAULT dark/light map carries an "API KEY REQUIRED" watermark. The tile URLs were hardcoded in mapStyles.ts with no way to supply a key, and because the frontend ships as a prebuilt image a NEXT_PUBLIC_ variable would be baked in empty for every Docker user. - New frontend-local route GET /api/basemap-config reads CARTO_API_KEY from the frontend container's environment at request time (same pattern as BACKEND_URL), so no image rebuild is needed. - useBasemapConfig() fetches it once per page load; MaplibreViewer builds the MapLibre style from it via buildBasemapStyle(theme, key) and defers the map's first style load until the config has settled, avoiding a burst of unkeyed tile requests followed by a style swap. - Tile URLs move to CARTO's documented rastertiles/ path with ?key= appended when configured. Unkeyed URLs serve byte-identical tiles to the old path, so deployments without a key behave exactly as before. - CARTO_API_KEY wired through docker-compose.yml and documented in .env.example, README (data source table + frontend env table) and docs/OUTBOUND_DATA.md. - Tests cover the route (unset / set / trimmed) and the style builder. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
ShadowBroker Frontend
Next.js 16 dashboard with MapLibre GL and Framer Motion.
Development
npm install
npm run dev # http://localhost:3000
API URL Configuration
The browser calls relative /api/* paths. The catch-all route handler at
src/app/api/[...path]/route.ts proxies those requests to the backend using
the server-side BACKEND_URL environment variable at request time.
This keeps the backend URL out of the client bundle and lets Docker or other deployments change the backend target without rebuilding the frontend.
Common Scenarios
| Scenario | Action needed |
|---|---|
Local dev (localhost:3000 + backend on 127.0.0.1:8000) |
None. The proxy defaults to http://127.0.0.1:8000. |
| Docker Compose | None. docker-compose.yml sets BACKEND_URL=http://backend:8000. |
| Backend on a different host or port | Set BACKEND_URL before starting the Next.js server/container. |
| Reverse proxy in front of the frontend | Point external clients at the frontend; keep BACKEND_URL set to the backend address reachable from the Next.js server. |
Setting BACKEND_URL
# Shell (Linux/macOS)
BACKEND_URL=http://myserver:8000 npm run dev
# PowerShell (Windows)
$env:BACKEND_URL="http://myserver:8000"; npm run dev
# Docker Compose
# Edit the frontend service environment or add a compose override:
# BACKEND_URL=http://myserver:8000
Theming
Dark mode is the default. A light/dark toggle is available in the left panel
toolbar. Theme preference is persisted in localStorage as sb-theme and
applied via the data-theme attribute on <html>. CSS variables in
globals.css define all structural colors for both themes.