fix: make frontend API URLs dynamic using window.location.hostname

Author: Protik111

dashboard-frontend/src/services/api.ts

@@ -10,7 +10,15 @@ declare global {
   }
 }
 
-const API_BASE = import.meta.env.VITE_API_URL || "http://localhost:5003";
+const getBaseUrl = (port: number) => {
+  if (typeof window !== "undefined") {
+    return `http://${window.location.hostname}:${port}`;
+  }
+  return `http://localhost:${port}`;
+};
+
+const API_BASE = import.meta.env.VITE_API_URL || getBaseUrl(5003);
+const PRODUCER_BASE = getBaseUrl(5001);
 
 interface JobResponse {
   id?: string;
@@ -114,7 +122,7 @@ export const getCompletedJobs = async (): Promise<CompletedJobsResponse> => {
 // Submit New Job
 export const submitReport = async (reportType: string, data: object) => {
   const response = await axios.post(
-    "http://localhost:5001/api/v1/reports/generate",
+    `${PRODUCER_BASE}/api/v1/reports/generate`,
     { reportType, data },
     { headers: { "Content-Type": "application/json" } }
   );

infra/docker-compose.prod.yml

@@ -62,7 +62,6 @@ services:
     ports: [ "5004:5004" ]
     environment:
       - FRONTEND_PORT=5004
-      - VITE_API_URL=http://localhost:5003
       - NODE_ENV=production
     depends_on: [ dashboard-api ]