Merge pull request #14 from HardMax71/dev

HardMax71 · web-flow · commit e772b2b56259 · 2025-12-08T23:59:54.000+01:00
Dev
diff --git a/.env.example b/.env.example
@@ -1,7 +1,5 @@
 NEO4J_PASSWORD=your_secure_neo4j_password_here
 GRAFANA_ADMIN_PASSWORD=your_secure_grafana_password_here
-VITE_API_BASE_URL=http://localhost:8000/api
-VITE_GRAFANA_URL=http://grafana.localhost:8081
 
 # Frontend build target: dev (vite hot-reload) or prod (nginx static)
 FRONTEND_TARGET=dev
diff --git a/.github/workflows/publish-images.yml b/.github/workflows/publish-images.yml
@@ -41,9 +41,6 @@ jobs:
             context: ./frontend
             dockerfile: ./frontend/Dockerfile
             target: prod
-            build-args: |
-              VITE_API_BASE_URL=/api
-              VITE_GRAFANA_URL=
 
     steps:
       - name: Checkout repository
diff --git a/docker-compose.yaml b/docker-compose.yaml
@@ -177,9 +177,6 @@ services:
       - "5173:5173"
     volumes:
       - ./frontend:/app
-    environment:
-      - VITE_API_BASE_URL=${VITE_API_BASE_URL}
-      - VITE_GRAFANA_URL=${VITE_GRAFANA_URL}
     networks:
       - public-network
     depends_on:
diff --git a/frontend/index.html b/frontend/index.html
@@ -8,6 +8,7 @@
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+    <script src="/config.js"></script>
   </head>
   <body>
     <div id="root"></div>
diff --git a/frontend/public/config.js b/frontend/public/config.js
@@ -0,0 +1,5 @@
+// Runtime configuration - this file is replaced/generated at container startup
+window.APP_CONFIG = {
+  API_BASE_URL: "http://localhost:8000",
+  GRAFANA_URL: "http://grafana.localhost:8081"
+};
diff --git a/frontend/src/api/client.ts b/frontend/src/api/client.ts
@@ -1,7 +1,18 @@
 // Configure the Hey API client with the base URL
 import { client } from './generated';
 
-export const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || "http://localhost:8000/api";
+// Runtime config from window.APP_CONFIG (set by /config.js loaded before React)
+declare global {
+  interface Window {
+    APP_CONFIG?: {
+      API_BASE_URL?: string;
+      GRAFANA_URL?: string;
+    };
+  }
+}
+
+// Base URL for API requests (generated client paths already include /api prefix)
+export const API_BASE_URL = window.APP_CONFIG?.API_BASE_URL || "http://localhost:8000";
 
 // Configure the global client with our base URL
 client.setConfig({
diff --git a/frontend/src/pages/Health.tsx b/frontend/src/pages/Health.tsx
@@ -25,7 +25,7 @@ import {
 import { IconButton } from "../components/styled/Button";
 import PageHeader from "../components/PageHeader";
 
-const GRAFANA_URL = import.meta.env.VITE_GRAFANA_URL || "http://grafana.localhost:8081";
+const GRAFANA_URL = window.APP_CONFIG?.GRAFANA_URL || "http://grafana.localhost:8081";
 
 export default function Health() {
   const { data, error, isLoading, refetch } = useHealth();
@@ -50,7 +50,7 @@ export default function Health() {
               <IconButton as="a" href={GRAFANA_URL} target="_blank" rel="noopener noreferrer" title="Open Grafana Dashboard">
                 <BarChart3 size={18} />
               </IconButton>
-              <IconButton as="a" href={`${API_BASE_URL}/v1/health/`} target="_blank" rel="noopener noreferrer" title="Open API endpoint">
+              <IconButton as="a" href={`${API_BASE_URL}/api/v1/health/`} target="_blank" rel="noopener noreferrer" title="Open API endpoint">
                 <Code2 size={18} />
               </IconButton>
               <IconButton onClick={() => refetch()} disabled={isLoading} title="Refresh">
diff --git a/frontend/src/pages/JobStatus.tsx b/frontend/src/pages/JobStatus.tsx
@@ -1371,7 +1371,7 @@ export default function JobStatus() {
                 </Tooltip>
                 <Tooltip text="Open API endpoint">
                   <a
-                    href={`${API_BASE_URL}/v1/resumes/${job.uid}/`}
+                    href={`${API_BASE_URL}/api/v1/resumes/${job.uid}/`}
                     target="_blank"
                     rel="noopener noreferrer"
                     style={{
diff --git a/frontend/src/pages/Landing.tsx b/frontend/src/pages/Landing.tsx
@@ -6,14 +6,14 @@ import AnimatedTerminal from '../components/AnimatedTerminal';
 
 // Code examples defined outside component to avoid recreation on each render
 const CODE_EXAMPLES = {
-  curl: `curl -X POST ${API_BASE_URL}/v1/resumes/ \\
+  curl: `curl -X POST ${API_BASE_URL}/api/v1/resumes/ \\
   -H "Content-Type: multipart/form-data" \\
   -F "file=@resume.pdf"`,
 
   python: `import requests
 
 response = requests.post(
-    '${API_BASE_URL}/v1/resumes/',
+    '${API_BASE_URL}/api/v1/resumes/',
     files={'file': open('resume.pdf', 'rb')}
 )
 print(response.json())`,
@@ -24,7 +24,7 @@ const fs = require('fs');
 const form = new FormData();
 form.append('file', fs.createReadStream('resume.pdf'));
 
-fetch('${API_BASE_URL}/v1/resumes/', {
+fetch('${API_BASE_URL}/api/v1/resumes/', {
   method: 'POST',
   body: form
 }).then(r => r.json()).then(console.log);`
@@ -354,7 +354,7 @@ export default function Landing() {
             <p className="landing-code-footer">
               Full documentation at{' '}
               <a
-                href={`${API_BASE_URL}/docs/`}
+                href={`${API_BASE_URL}/api/docs/`}
                 target="_blank"
                 rel="noopener noreferrer"
               >
diff --git a/frontend/src/pages/PrivacyPolicy.tsx b/frontend/src/pages/PrivacyPolicy.tsx
@@ -42,7 +42,7 @@ export default function PrivacyPolicy() {
                 </a>{" "}
                 or using the{" "}
                 <a
-                  href={`${API_BASE_URL}/docs/`}
+                  href={`${API_BASE_URL}/api/docs/`}
                   target="_blank"
                   rel="noopener noreferrer"
                   className="policy-link"
diff --git a/frontend/src/services/resumeService.ts b/frontend/src/services/resumeService.ts
@@ -17,7 +17,7 @@ export async function uploadResume(file: File): Promise<ResumeResponse> {
   const formData = new FormData();
   formData.append('file', file);
 
-  const response = await fetch(`${API_BASE_URL}/v1/resumes/`, {
+  const response = await fetch(`${API_BASE_URL}/api/v1/resumes/`, {
     method: 'POST',
     body: formData,
   });
