chore: Use config.json from API route in development mode

api/config.dev.py

@@ -11,7 +11,13 @@ DEDICATED_WORKER = True
 FRONTEND_URL = "http://localhost:3001/"
 FRONTEND_HTTPS = False
 FRONTEND_DIR = None
-FRONTEND_CONFIG = None
+FRONTEND_CONFIG = {
+    "imprintUrl": "https://example.com/imprint",
+    "privacyPolicyUrl": "https://example.com/privacy",
+    "mapHome": {"zoom": 6, "longitude": 10.2, "latitude": 51.3},
+    # "banner": {"text": "This is a development installation.", "style": "info"},
+}
+
 TILES_FILE = None  # "/tiles/tiles.mbtiles"
 DATA_DIR = "/data"
 ADDITIONAL_CORS_ORIGINS = [

api/obs/api/routes/frontend.py

@@ -5,13 +5,7 @@ from sanic.exceptions import NotFound
 
 from obs.api.app import app
 
-INDEX_HTML = (
-    join(app.config.FRONTEND_DIR, "index.html")
-    if app.config.get("FRONTEND_DIR")
-    else None
-)
-if INDEX_HTML and exists(INDEX_HTML):
-
+if app.config.FRONTEND_CONFIG:
     @app.get("/config.json")
     def get_frontend_config(req):
         result = {
@@ -35,12 +29,18 @@ if INDEX_HTML and exists(INDEX_HTML):
 
         return response.json(result)
 
+
+INDEX_HTML = (
+    join(app.config.FRONTEND_DIR, "index.html")
+    if app.config.get("FRONTEND_DIR")
+    else None
+)
+if INDEX_HTML and exists(INDEX_HTML):
     with open(INDEX_HTML, "rt") as f:
         index_file_contents = f.read()
 
     @app.get("/<path:path>")
     def get_frontend_static(req, path):
-        print("++++++++++++++++++++++++++++++++++++++++++++++++", path)
         if path.startswith("api/"):
             raise NotFound()
 

docker-compose.yaml

@@ -79,11 +79,11 @@ services:
       - ./frontend/tsconfig.json:/opt/obs/frontend/tsconfig.json
       - ./frontend/package.json:/opt/obs/frontend/package.json
       - ./frontend/webpack.config.js:/opt/obs/frontend/webpack.config.js
-
-      # Overwrite the default config with the development mode configuration
-      - ./frontend/config.dev.json:/opt/obs/frontend/public/config.json
     links:
       - api
+    environment:
+      # used for proxy only
+      - API_URL=http://api:3000/
     ports:
       - '3001:3001'
     restart: on-failure

frontend/config.dev.json

@@ -1,18 +0,0 @@
-{
-  "apiUrl": "http://localhost:3000/api",
-  "loginUrl": "http://localhost:3000/login",
-  "imprintUrl": "https://example.com/imprint",
-  "privacyPolicyUrl": "https://example.com/privacy",
-  "basename": "/",
-  "mapHome": {
-    "zoom": 6,
-    "longitude": 10.2,
-    "latitude": 51.3
-  },
-  "obsMapSource": {
-    "type": "vector",
-    "tiles": ["http://localhost:3000/tiles/{z}/{x}/{y}.pbf"],
-    "minzoom": 12,
-    "maxzoom": 14
-  }
-}

frontend/public/config.json

@@ -1,15 +0,0 @@
-{
-  "apiUrl": "https://api.example.com",
-  "imprintUrl": "https://portal.example.com/imprint",
-  "privacyPolicyUrl": "https://portal.example.com/privacy",
-  "basename": "/",
-  "mapHome": {
-    "zoom": 6,
-    "longitude": 10.2,
-    "latitude": 51.3
-  },
-  "obsMapSource": {
-    "type": "vector",
-    "url": "https://portal.example.com/tileset/data/v3.json"
-  }
-}

frontend/webpack.config.js

@@ -159,6 +159,7 @@ module.exports = function (webpackEnv) {
         webSocketURL: `ws://0.0.0.0:${port}/ws`,
       },
       proxy: {
+        '/config.json': apiUrl,
         '/api': apiUrl,
         '/login': apiUrl,
       },