(incubator-devlake) branch main updated: fix(devcontainer): make Config UI and Grafana accessible from host when using devcontainers (#8645)

[klesh]

This is an automated email from the ASF dual-hosted git repository.

klesh pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-devlake.git


The following commit(s) were added to refs/heads/main by this push:
     new 79b8f8a8d fix(devcontainer): make Config UI and Grafana accessible 
from host when using devcontainers (#8645)
79b8f8a8d is described below

commit 79b8f8a8d596925859fbbdfb6aee701178259b39
Author: Nir Nave <amara....@gmail.com>
AuthorDate: Thu Feb 26 17:10:52 2026 +0200

    fix(devcontainer): make Config UI and Grafana accessible from host when 
using devcontainers (#8645)
    
    * fix(devcontainer): Make config-ui dev server accessible outside the 
container
    when started by listening on 0.0.0.0 with the `--host` flag.
    Also ensure it uses port 4000 or fails to start with `--strictPort`
    to prevent silent port change that will mismatch with the exported dev 
container port.
    
    * fix(devcontainer): make Config UI and Grafana accessible from host when 
using devcontainers
---
 .devcontainer/devcontainer.json |  7 +++++--
 config-ui/package.json          |  2 +-
 config-ui/vite.config.ts        | 15 +++++++++++++--
 3 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/.devcontainer/devcontainer.json b/.devcontainer/devcontainer.json
index a9e437227..94b84f20f 100644
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -15,7 +15,6 @@
  * limitations under the License.
  *
  */
-
 {
   "name": "Go",
   "dockerComposeFile": "docker-compose.yml",
@@ -36,6 +35,10 @@
     4000,
     8080
   ],
+  "containerEnv": {
+    "VITE_GRAFANA_URL": "http://grafana:3000";,
+    "VITE_GRAFANA_CHANGE_ORIGIN": "false"
+  },
   "postCreateCommand": "npm install commitizen -g",
   "customizations": {
     "vscode": {
@@ -45,4 +48,4 @@
     }
   },
   "remoteUser": "root"
-}
+}
\ No newline at end of file
diff --git a/config-ui/package.json b/config-ui/package.json
index c10c1c9d9..cd00e507e 100644
--- a/config-ui/package.json
+++ b/config-ui/package.json
@@ -4,7 +4,7 @@
   "version": "0.0.0",
   "packageManager": "yarn@3.4.1",
   "scripts": {
-    "start": "vite",
+    "start": "vite --host --strictPort",
     "build": "vite build",
     "preview": "vite preview",
     "lint": "tsc && eslint . --fix",
diff --git a/config-ui/vite.config.ts b/config-ui/vite.config.ts
index b9def37db..d71340606 100644
--- a/config-ui/vite.config.ts
+++ b/config-ui/vite.config.ts
@@ -21,6 +21,10 @@ import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 import svgr from 'vite-plugin-svgr';
 
+// Allow Grafana access from the dev server when using Dev Container 
+const grafanaOrigin = process.env.VITE_GRAFANA_URL || 'http://localhost:3002';
+const grafanaChangeOrigin = envBool('VITE_GRAFANA_CHANGE_ORIGIN', true);
+
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [react(), svgr()],
@@ -36,8 +40,9 @@ export default defineConfig({
         rewrite: (path) => path.replace(/^\/api\//, ''),
       },
       '/grafana': {
-        target: 'http://localhost:3002/',
-        changeOrigin: true,
+        target: grafanaOrigin,
+        changeOrigin: grafanaChangeOrigin,
+        ws: true // Proxying websockets to allow features like query 
auto-complete
       },
     },
   },
@@ -48,3 +53,9 @@ export default defineConfig({
     },
   },
 });
+
+function envBool(name: string, defaultValue = false): boolean {
+  const v = process.env[name];
+  if (v == null) return defaultValue;
+  return /^(1|true|yes|on)$/i.test(v);
+}