From 6c5b0ed2a6a67766292fd90494ddf0bce7f6bf53 Mon Sep 17 00:00:00 2001 From: Alex TYRODE Date: Tue, 29 Apr 2025 21:18:29 +0000 Subject: [PATCH 1/5] fix: update AuthGate to use environment variable for Coder URL - Modified AuthGate component to retrieve Coder URL from environment variable instead of hardcoding. - Added new CODER_URL definition in env.d.ts for better configuration management. --- src/frontend/src/AuthGate.tsx | 4 +++- src/frontend/src/env.d.ts | 1 + 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/frontend/src/AuthGate.tsx b/src/frontend/src/AuthGate.tsx index e3958e8..144d7a1 100644 --- a/src/frontend/src/AuthGate.tsx +++ b/src/frontend/src/AuthGate.tsx @@ -21,7 +21,9 @@ export default function AuthGate({ children }: { children: React.ReactNode }) { if (isAuthenticated === true && !coderAuthDone) { const iframe = document.createElement("iframe"); iframe.style.display = "none"; - iframe.src = "https://coder.pad.ws/api/v2/users/oidc/callback"; + const coderUrl = import.meta.env.VITE_CODER_URL; + iframe.src = `${coderUrl}/api/v2/users/oidc/callback`; + console.debug(`[pad.ws] (Silently) Priming Coder OIDC session for ${coderUrl}`); // Remove iframe as soon as it loads, or after 2s fallback const cleanup = () => { diff --git a/src/frontend/src/env.d.ts b/src/frontend/src/env.d.ts index 17104b5..fc443ba 100644 --- a/src/frontend/src/env.d.ts +++ b/src/frontend/src/env.d.ts @@ -3,6 +3,7 @@ interface ImportMetaEnv { readonly VITE_PUBLIC_POSTHOG_KEY: string readonly VITE_PUBLIC_POSTHOG_HOST: string + readonly CODER_URL: string } interface ImportMeta { From d37634ce0b05b2d8a350acc38030b3301024df7e Mon Sep 17 00:00:00 2001 From: Alex TYRODE Date: Tue, 29 Apr 2025 21:25:17 +0000 Subject: [PATCH 2/5] refactor: enhance Vite configuration to load environment variables - Updated vite.config.mts to load environment variables based on the current mode, allowing for better configuration management. - Made CODER_URL available through import.meta.env for improved flexibility in accessing environment-specific settings. --- src/frontend/vite.config.mts | 50 +++++++++++++++++++++--------------- 1 file changed, 30 insertions(+), 20 deletions(-) diff --git a/src/frontend/vite.config.mts b/src/frontend/vite.config.mts index ce324bc..e68ceb2 100644 --- a/src/frontend/vite.config.mts +++ b/src/frontend/vite.config.mts @@ -1,26 +1,36 @@ -import { defineConfig } from "vite"; +import { defineConfig, loadEnv } from "vite"; // https://vitejs.dev/config/ -export default defineConfig({ - server: { - port: 3003, - open: false, // open the browser where app is started - proxy: { - // Proxy PostHog requests to avoid CORS issues - '/posthog': { - target: 'https://eu.i.posthog.com', - changeOrigin: true, - rewrite: (path) => path.replace(/^\/posthog/, ''), +export default defineConfig(({ mode }) => { + // Load env file based on `mode` in the current working directory. + // Set the third parameter to '' to load all env regardless of the `VITE_` prefix. + const env = loadEnv(mode, process.cwd(), ''); + + return { + server: { + port: 3003, + open: false, // open the browser where app is started + proxy: { + // Proxy PostHog requests to avoid CORS issues + '/posthog': { + target: 'https://eu.i.posthog.com', + changeOrigin: true, + rewrite: (path) => path.replace(/^\/posthog/, ''), + }, }, }, - }, - publicDir: "public", - optimizeDeps: { - esbuildOptions: { - // Bumping to 2022 due to "Arbitrary module namespace identifier names" not being - // supported in Vite's default browser target https://github.com/vitejs/vite/issues/13556 - target: "es2022", - treeShaking: true, + define: { + // Make non-prefixed CODER_URL available to import.meta.env + 'import.meta.env.CODER_URL': JSON.stringify(env.CODER_URL), }, - }, + publicDir: "public", + optimizeDeps: { + esbuildOptions: { + // Bumping to 2022 due to "Arbitrary module namespace identifier names" not being + // supported in Vite's default browser target https://github.com/vitejs/vite/issues/13556 + target: "es2022", + treeShaking: true, + }, + }, + }; }); From 8aac360bf6c3ee5ab98a1d395a0dfa56eae3ab31 Mon Sep 17 00:00:00 2001 From: Alex TYRODE Date: Tue, 29 Apr 2025 21:25:27 +0000 Subject: [PATCH 3/5] fix: update AuthGate to use corrected environment variable for Coder URL - Changed the environment variable reference in AuthGate from VITE_CODER_URL to CODER_URL for consistency with the updated configuration management. --- src/frontend/src/AuthGate.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/frontend/src/AuthGate.tsx b/src/frontend/src/AuthGate.tsx index 144d7a1..cab4461 100644 --- a/src/frontend/src/AuthGate.tsx +++ b/src/frontend/src/AuthGate.tsx @@ -21,7 +21,7 @@ export default function AuthGate({ children }: { children: React.ReactNode }) { if (isAuthenticated === true && !coderAuthDone) { const iframe = document.createElement("iframe"); iframe.style.display = "none"; - const coderUrl = import.meta.env.VITE_CODER_URL; + const coderUrl = import.meta.env.CODER_URL; iframe.src = `${coderUrl}/api/v2/users/oidc/callback`; console.debug(`[pad.ws] (Silently) Priming Coder OIDC session for ${coderUrl}`); From 0bb5ac9903006716e5a9ed10d0e5733b1f9cb0aa Mon Sep 17 00:00:00 2001 From: Alex TYRODE Date: Tue, 29 Apr 2025 22:03:37 +0000 Subject: [PATCH 4/5] refactor: update Dockerfile and add startup script for application initialization - Modified Dockerfile to copy and execute a new startup script instead of directly running the application. - Introduced startup.sh to create a runtime configuration file with environment variables and start the application. - Updated index.html to include the new runtime configuration script. - Enhanced AuthGate component to utilize the runtime configuration for the Coder URL, providing fallback to environment variables. - Added global TypeScript definitions for the runtime configuration interface. --- Dockerfile | 8 ++++++-- scripts/startup.sh | 13 +++++++++++++ src/frontend/index.html | 1 + src/frontend/src/AuthGate.tsx | 3 ++- src/frontend/src/global.d.ts | 6 ++++++ 5 files changed, 28 insertions(+), 3 deletions(-) create mode 100644 scripts/startup.sh create mode 100644 src/frontend/src/global.d.ts diff --git a/Dockerfile b/Dockerfile index 3077837..b389f13 100644 --- a/Dockerfile +++ b/Dockerfile @@ -41,5 +41,9 @@ ENV PYTHONUNBUFFERED=1 # Document the port number the container will expose EXPOSE 8000 -# Run the application -CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"] +# Copy startup script +COPY scripts/startup.sh /app/ +RUN chmod +x /app/startup.sh + +# Run the startup script +CMD ["/app/startup.sh"] diff --git a/scripts/startup.sh b/scripts/startup.sh new file mode 100644 index 0000000..c8e47f0 --- /dev/null +++ b/scripts/startup.sh @@ -0,0 +1,13 @@ +#!/bin/bash +set -e + +# Create runtime config with environment variables +mkdir -p /app/frontend/dist/config +cat > /app/frontend/dist/config/runtime-config.js <Pad.ws + diff --git a/src/frontend/src/AuthGate.tsx b/src/frontend/src/AuthGate.tsx index cab4461..f2a7fb7 100644 --- a/src/frontend/src/AuthGate.tsx +++ b/src/frontend/src/AuthGate.tsx @@ -21,7 +21,8 @@ export default function AuthGate({ children }: { children: React.ReactNode }) { if (isAuthenticated === true && !coderAuthDone) { const iframe = document.createElement("iframe"); iframe.style.display = "none"; - const coderUrl = import.meta.env.CODER_URL; + // Use runtime config if available, fall back to import.meta.env + const coderUrl = window.RUNTIME_CONFIG?.CODER_URL || import.meta.env.CODER_URL; iframe.src = `${coderUrl}/api/v2/users/oidc/callback`; console.debug(`[pad.ws] (Silently) Priming Coder OIDC session for ${coderUrl}`); diff --git a/src/frontend/src/global.d.ts b/src/frontend/src/global.d.ts new file mode 100644 index 0000000..6f7bb2e --- /dev/null +++ b/src/frontend/src/global.d.ts @@ -0,0 +1,6 @@ +interface Window { + RUNTIME_CONFIG?: { + CODER_URL: string; + }; + ExcalidrawLib: any; +} From 904a735aba793caf6620220020461cef378f5b3a Mon Sep 17 00:00:00 2001 From: Alex TYRODE Date: Tue, 29 Apr 2025 22:07:49 +0000 Subject: [PATCH 5/5] refactor: update runtime configuration file location and script reference - Changed the directory for the runtime configuration file from /config to /assets in startup.sh. - Updated index.html to reference the new location of the runtime configuration script. --- scripts/startup.sh | 4 ++-- src/frontend/index.html | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/scripts/startup.sh b/scripts/startup.sh index c8e47f0..9d7f8d4 100644 --- a/scripts/startup.sh +++ b/scripts/startup.sh @@ -2,8 +2,8 @@ set -e # Create runtime config with environment variables -mkdir -p /app/frontend/dist/config -cat > /app/frontend/dist/config/runtime-config.js < /app/frontend/dist/assets/runtime-config.js <Pad.ws - +