Added: Config Loader

.dockerignore

@@ -1,3 +1,5 @@
 .github
 .idea
 .gitignore
+dist
+node_modules

.env

@@ -1,7 +1 @@
 STANDALONE_SINGLE_SPA=false
-VUE_APP_KEYCLOAK_URL=https://login.verbis.dkfz.de/
-VUE_APP_KEYCLOAK_REALM=test-realm-01
-VUE_APP_KEYCLOAK_CLIENT_ID=bridgehead-test
-VUE_APP_KEYCLOAK_REFRESH_TOKEN_TIME_IN_MINUTES=5
-VUE_APP_PROJECT_MANAGER_BACKEND_URL=http://localhost:8097
-VUE_APP_PUBLIC_PATH=/

.env.standalone

@@ -1,7 +1 @@
 STANDALONE_SINGLE_SPA=true
-VUE_APP_KEYCLOAK_URL=https://login.verbis.dkfz.de/
-VUE_APP_KEYCLOAK_REALM=test-realm-01
-VUE_APP_KEYCLOAK_CLIENT_ID=bridgehead-test
-VUE_APP_KEYCLOAK_REFRESH_TOKEN_TIME_IN_MINUTES=5
-VUE_APP_PROJECT_MANAGER_BACKEND_URL=http://localhost:8097
-VUE_APP_PUBLIC_PATH=/

CHANGELOG.md

@@ -64,3 +64,4 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 - Github CI
 - VUE_APP_PUBLIC_PATH
 - Nginx conf
+- Config Loader

Dockerfile

@@ -9,21 +9,31 @@ RUN npm install
 
 # Copy the rest of your application code
 COPY . .
+COPY docker/.env.template                   ./.env
+COPY docker/.env.standalone.template        ./.env.standalone
 
 # Build the Vue application
 RUN npm run build:standalone
 
 # Stage 2: Serve the application with Nginx
 FROM nginx:alpine
 
+WORKDIR /usr/share/nginx/html
+
 # Copy the built Vue application from the previous stage
-COPY --from=build /app/dist /usr/share/nginx/html
+COPY --from=build /app/dist .
 
 # Copy custom Nginx configuration if needed
-COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY docker/nginx.conf /etc/nginx/conf.d/default.conf
 
 # Expose port 80 for the Nginx server
 EXPOSE 80
 
-# Nginx will run automatically
-CMD ["nginx", "-g", "daemon off;"]
+ADD docker/start.sh                 /samply/
+RUN chmod +x                        /samply/start.sh
+
+COPY docker/keycloak.json .
+COPY docker/config.json .
+
+
+CMD ["/samply/start.sh"]

docker/.env.standalone.template

@@ -0,0 +1 @@
+STANDALONE_SINGLE_SPA=true

docker/.env.template

@@ -0,0 +1 @@
+STANDALONE_SINGLE_SPA=false

docker/config.json

@@ -0,0 +1,3 @@
+{
+  "VUE_APP_PROJECT_MANAGER_BACKEND_URL" : "${VUE_APP_PROJECT_MANAGER_BACKEND_URL}"
+}

docker/keycloak.json

@@ -0,0 +1,8 @@
+{
+  "realm": "${VUE_APP_KEYCLOAK_REALM}",
+  "auth-server-url": "${VUE_APP_KEYCLOAK_URL}",
+  "ssl-required": "external",
+  "resource": "${VUE_APP_KEYCLOAK_CLIENT_ID}",
+  "public-client": true,
+  "confidential-port": 0
+}

docker/start.sh

@@ -0,0 +1,12 @@
+#!/bin/sh
+
+envsubst < /usr/share/nginx/html/keycloak.json > /usr/share/nginx/html/keycloak.temp.json
+mv /usr/share/nginx/html/keycloak.temp.json /usr/share/nginx/html/keycloak.json
+
+envsubst < /usr/share/nginx/html/config.json > /usr/share/nginx/html/config.temp.json
+mv /usr/share/nginx/html/config.temp.json /usr/share/nginx/html/config.json
+
+#envsubst '${TEILER_DASHBOARD_SERVER_NAME} ${TEILER_ORCHESTRATOR_URL}'< /etc/nginx/nginx.template.conf > /etc/nginx/nginx.conf
+
+echo 'Start Teiler Dashboard in NGINX in foreground (non-daemon-mode)'
+exec nginx -g 'daemon off;'

public/config.json

@@ -0,0 +1,3 @@
+{
+  "VUE_APP_PROJECT_MANAGER_BACKEND_URL" : "http://localhost:8097"
+}

src/services/configLoader.ts

@@ -0,0 +1,30 @@
+// configLoader.ts
+let config: any = null;
+let isLoading = false; // Track whether the config is being loaded
+
+const loadConfig = async () => {
+    if (!isLoading) {
+        isLoading = true; // Prevent multiple concurrent loads
+        try {
+            const response = await fetch('/config.json');
+            config = await response.json();
+        } catch (error) {
+            console.error('Failed to load config.json:', error);
+            throw new Error('Configuration loading failed');
+        } finally {
+            isLoading = false; // Reset loading state
+        }
+    }
+
+    // Wait until config is loaded
+    while (config === null) {
+        await new Promise(resolve => setTimeout(resolve, 100)); // Polling
+    }
+};
+
+export const getConfig = async () => {
+    if (config === null) {
+        await loadConfig(); // Load the config if it's not already loaded
+    }
+    return config;
+};

src/services/keycloak.ts

@@ -44,7 +44,7 @@ const refreshToken = () => {
 };
 
 // Set up timer to refresh token periodically
-const tokenRefreshInterval = setInterval(refreshToken, process.env.VUE_APP_KEYCLOAK_REFRESH_TOKEN_TIME_IN_MINUTES * 60 * 1000); // Refresh token every 5 minutes
+const tokenRefreshInterval = setInterval(refreshToken, 5 * 60 * 1000); // Refresh token every 5 minutes
 
 const KeyCloakService = {
     getToken: () => keycloakInstance.token,

src/services/projetManagerBackendService.ts

@@ -1,10 +1,11 @@
-// projetManagerBackendService.ts
+//projectManagerBackendService.ts
 import axios, {AxiosRequestConfig, AxiosResponse} from 'axios';
 import axiosRetry from "axios-retry";
 import KeyCloakService from "@/services/keycloak";
+import {getConfig} from "@/services/configLoader";
 
 
-const baseURL = process.env.VUE_APP_PROJECT_MANAGER_BACKEND_URL
+const baseURL = (await getConfig()).VUE_APP_PROJECT_MANAGER_BACKEND_URL;
 
 const bridgeheadParam = 'bridgehead'
 const projectCodeParam = 'project-code'

vue.config.js

@@ -1,7 +1,7 @@
 const dotenv = require('dotenv').config();
 
 module.exports = {
-    publicPath: process.env.VUE_APP_PUBLIC_PATH || './', // Fallback to './' if not set
+//    publicPath: process.env.VUE_APP_PUBLIC_PATH || './', // Fallback to './' if not set
     configureWebpack: {
         output: {
             libraryTarget: "system",