diff --git a/.dockerignore b/.dockerignore index 46e401c..b6aa27b 100644 --- a/.dockerignore +++ b/.dockerignore @@ -1,3 +1,5 @@ .github .idea .gitignore +dist +node_modules diff --git a/.env b/.env index 1f28ae8..6250b80 100644 --- a/.env +++ b/.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=/ diff --git a/.env.standalone b/.env.standalone index 7febb42..bf83975 100644 --- a/.env.standalone +++ b/.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=/ diff --git a/CHANGELOG.md b/CHANGELOG.md index 51d7f07..55cf320 100644 --- a/CHANGELOG.md +++ b/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 diff --git a/Dockerfile b/Dockerfile index 35a2fc6..c73c650 100644 --- a/Dockerfile +++ b/Dockerfile @@ -9,6 +9,8 @@ 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 @@ -16,14 +18,22 @@ 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"] diff --git a/docker/.env.standalone.template b/docker/.env.standalone.template new file mode 100644 index 0000000..bf83975 --- /dev/null +++ b/docker/.env.standalone.template @@ -0,0 +1 @@ +STANDALONE_SINGLE_SPA=true diff --git a/docker/.env.template b/docker/.env.template new file mode 100644 index 0000000..6250b80 --- /dev/null +++ b/docker/.env.template @@ -0,0 +1 @@ +STANDALONE_SINGLE_SPA=false diff --git a/docker/config.json b/docker/config.json new file mode 100644 index 0000000..e15fad4 --- /dev/null +++ b/docker/config.json @@ -0,0 +1,3 @@ +{ + "VUE_APP_PROJECT_MANAGER_BACKEND_URL" : "${VUE_APP_PROJECT_MANAGER_BACKEND_URL}" +} diff --git a/docker/keycloak.json b/docker/keycloak.json new file mode 100644 index 0000000..73f352f --- /dev/null +++ b/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 +} diff --git a/nginx.conf b/docker/nginx.conf similarity index 100% rename from nginx.conf rename to docker/nginx.conf diff --git a/docker/start.sh b/docker/start.sh new file mode 100644 index 0000000..50b34d5 --- /dev/null +++ b/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;' diff --git a/public/config.json b/public/config.json new file mode 100644 index 0000000..a751669 --- /dev/null +++ b/public/config.json @@ -0,0 +1,3 @@ +{ + "VUE_APP_PROJECT_MANAGER_BACKEND_URL" : "http://localhost:8097" +} diff --git a/public/projects.json b/public/projects.json deleted file mode 100644 index fdee0af..0000000 --- a/public/projects.json +++ /dev/null @@ -1,11 +0,0 @@ -{ - "projects": [ - { "title": "Cancer Research Topic 1", "projectId": "CR001", "drn": "123", "date": "2023-01-01", "status": "In Progress" }, - { "title": "Cancer Research Topic 2", "projectId": "CR002", "drn": "456", "date": "2023-02-15", "status": "Completed" }, - { "title": "Cancer Research Topic 3", "projectId": "CR003", "drn": "789", "date": "2023-03-29", "status": "Pending" }, - { "title": "Cancer Research Topic 4", "projectId": "CR004", "drn": "232", "date": "2023-05-30", "status": "Pending" }, - { "title": "Cancer Research Topic 5", "projectId": "CR005", "drn": "634", "date": "2023-08-13", "status": "In Progress" }, - { "title": "Cancer Research Topic 6", "projectId": "CR006", "drn": "975", "date": "2023-08-21", "status": "In Progress" }, - { "title": "Cancer Research Topic 7", "projectId": "CR007", "drn": "142", "date": "2023-11-04", "status": "In Progress" } - ] -} diff --git a/src/services/configLoader.ts b/src/services/configLoader.ts new file mode 100644 index 0000000..5e859d5 --- /dev/null +++ b/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; +}; diff --git a/src/services/keycloak.ts b/src/services/keycloak.ts index 08c7dea..b2c13fc 100644 --- a/src/services/keycloak.ts +++ b/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, diff --git a/src/services/projetManagerBackendService.ts b/src/services/projetManagerBackendService.ts index 52acb04..2412efd 100644 --- a/src/services/projetManagerBackendService.ts +++ b/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' diff --git a/vue.config.js b/vue.config.js index fcf29d9..b9b5b27 100644 --- a/vue.config.js +++ b/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",