Remove retarded build time variables

frontend/Dockerfile

@@ -2,12 +2,6 @@ FROM rockylinux/rockylinux:10 AS build
 
 RUN dnf install -y nodejs npm && dnf clean all
 
-ARG VITE_API_BASE_URL=http://localhost:8000
-ARG VITE_OTEL_COLLECTOR_ENDPOINT=http://localhost:4318
-
-ENV VITE_API_BASE_URL=$VITE_API_BASE_URL \
-    VITE_OTEL_COLLECTOR_ENDPOINT=$VITE_OTEL_COLLECTOR_ENDPOINT
-
 WORKDIR /app
 
 COPY package.json package-lock.json ./

frontend/src/api/aw.ts

@@ -9,14 +9,13 @@ import type {
   AWAnomalyPoint,
 } from "./types";
 
-const API_BASE = import.meta.env.VITE_API_BASE_URL ?? "http://localhost:8000";
 const tracer = trace.getTracer("aw-frontend-api");
 
 async function get<T>(path: string, spanName: string): Promise<T> {
   return tracer.startActiveSpan(spanName, async (span) => {
     try {
       const token = currentAccessToken();
-      const resp = await fetch(`${API_BASE}${path}`, {
+      const resp = await fetch(path, {
         headers: {
           Accept: "application/json",
           ...(token ? { Authorization: `Bearer ${token}` } : {}),

frontend/src/api/config.ts

@@ -3,14 +3,16 @@ export type AppConfig = {
   oidc_authority: string;
   oidc_client_id: string;
   oidc_scope: string;
+  otel_collector_endpoint: string;
+  otel_service_name: string;
+  otel_service_namespace: string;
+  deployment_environment: string;
 };
 
-const API_BASE = (import.meta.env.VITE_API_BASE_URL as string | undefined) ?? "";
-
 let _config: AppConfig | null = null;
 
 export async function fetchAppConfig(): Promise<AppConfig> {
-  const resp = await fetch(`${API_BASE}/api/config`);
+  const resp = await fetch("/api/config");
   if (!resp.ok) throw new Error(`Failed to fetch app config: ${resp.status}`);
   _config = (await resp.json()) as AppConfig;
   return _config;

frontend/src/api/gateway.ts

@@ -2,7 +2,6 @@ import { SpanStatusCode, trace } from "@opentelemetry/api";
 import { currentAccessToken } from "../auth/oidc";
 import type { JobExecution, AuditEntry, ExportRecord } from "./types";
 
-const API_BASE = import.meta.env.VITE_API_BASE_URL ?? "http://localhost:8000";
 const tracer = trace.getTracer("gateway-frontend-api");
 
 function authHeaders(): Record<string, string> {
@@ -13,7 +12,7 @@ function authHeaders(): Record<string, string> {
 async function get<T>(path: string, spanName: string): Promise<T> {
   return tracer.startActiveSpan(spanName, async (span) => {
     try {
-      const resp = await fetch(`${API_BASE}${path}`, {
+      const resp = await fetch(path, {
         headers: { Accept: "application/json", ...authHeaders() },
       });
       if (!resp.ok) {
@@ -36,7 +35,7 @@ async function get<T>(path: string, spanName: string): Promise<T> {
 async function post<T>(path: string, spanName: string, body: unknown = {}): Promise<T> {
   return tracer.startActiveSpan(spanName, async (span) => {
     try {
-      const resp = await fetch(`${API_BASE}${path}`, {
+      const resp = await fetch(path, {
         method: "POST",
         headers: {
           "Content-Type": "application/json",

frontend/src/api/wwi.ts

@@ -9,7 +9,6 @@ import type {
   WWIScenario,
 } from "./types";
 
-const API_BASE = import.meta.env.VITE_API_BASE_URL ?? "http://localhost:8000";
 const tracer = trace.getTracer("wwi-frontend-api");
 
 function authHeaders(): Record<string, string> {
@@ -20,7 +19,7 @@ function authHeaders(): Record<string, string> {
 async function get<T>(path: string, spanName: string): Promise<T> {
   return tracer.startActiveSpan(spanName, async (span) => {
     try {
-      const resp = await fetch(`${API_BASE}${path}`, {
+      const resp = await fetch(path, {
         headers: { Accept: "application/json", ...authHeaders() },
       });
       if (!resp.ok) {
@@ -43,7 +42,7 @@ async function get<T>(path: string, spanName: string): Promise<T> {
 async function post<T>(path: string, body: unknown, spanName: string): Promise<T> {
   return tracer.startActiveSpan(spanName, async (span) => {
     try {
-      const resp = await fetch(`${API_BASE}${path}`, {
+      const resp = await fetch(path, {
         method: "POST",
         headers: {
           "Content-Type": "application/json",

frontend/src/main.tsx

@@ -11,8 +11,6 @@ import { fetchAppConfig } from "./api/config";
 import { AuthProvider } from "./auth/AuthContext";
 import { setupTelemetry } from "./telemetry";
 
-setupTelemetry();
-
 const queryClient = new QueryClient({
   defaultOptions: {
     queries: {
@@ -22,7 +20,13 @@ const queryClient = new QueryClient({
   },
 });
 
-fetchAppConfig().then(() => {
+fetchAppConfig().then((config) => {
+  setupTelemetry({
+    collectorEndpoint: config.otel_collector_endpoint,
+    serviceName: config.otel_service_name,
+    serviceNamespace: config.otel_service_namespace,
+    deploymentEnvironment: config.deployment_environment,
+  });
   createRoot(document.getElementById("root")!).render(
     <StrictMode>
       <BrowserRouter>

frontend/src/telemetry.ts

@@ -15,25 +15,19 @@ import { UserInteractionInstrumentation } from "@opentelemetry/instrumentation-u
 import { XMLHttpRequestInstrumentation } from "@opentelemetry/instrumentation-xml-http-request";
 import { ZoneContextManager } from "@opentelemetry/context-zone-peer-dep";
 
+export type TelemetryConfig = {
+  collectorEndpoint: string;
+  serviceName: string;
+  serviceNamespace: string;
+  deploymentEnvironment: string;
+};
+
 let initialized = false;
 
-function escapeRegExp(value: string): string {
-  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-}
-
-export function setupTelemetry(): void {
+export function setupTelemetry(config: TelemetryConfig): void {
   if (initialized) return;
   initialized = true;
 
-  const endpoint =
-    import.meta.env.VITE_OTEL_COLLECTOR_ENDPOINT ?? "http://localhost:4318";
-  const serviceName =
-    import.meta.env.VITE_OTEL_SERVICE_NAME ?? "otel-bi-frontend";
-  const serviceNamespace =
-    import.meta.env.VITE_OTEL_SERVICE_NAMESPACE ?? "final-thesis";
-  const apiBaseUrl =
-    import.meta.env.VITE_API_BASE_URL ?? "http://localhost:8000";
-
   propagation.setGlobalPropagator(
     new CompositePropagator({
       propagators: [
@@ -45,14 +39,14 @@ export function setupTelemetry(): void {
 
   const provider = new WebTracerProvider({
     resource: resourceFromAttributes({
-      "service.name": serviceName,
-      "service.namespace": serviceNamespace,
-      "deployment.environment": import.meta.env.MODE,
+      "service.name": config.serviceName,
+      "service.namespace": config.serviceNamespace,
+      "deployment.environment": config.deploymentEnvironment,
     }),
     spanProcessors: [
       new BatchSpanProcessor(
         new OTLPTraceExporter({
-          url: `${endpoint}/v1/traces`,
+          url: `${config.collectorEndpoint}/v1/traces`,
         }),
       ),
     ],
@@ -65,11 +59,7 @@ export function setupTelemetry(): void {
   registerInstrumentations({
     instrumentations: [
       new DocumentLoadInstrumentation(),
-      new FetchInstrumentation({
-        propagateTraceHeaderCorsUrls: [
-          new RegExp(`^${escapeRegExp(apiBaseUrl)}`),
-        ],
-      }),
+      new FetchInstrumentation(),
       new XMLHttpRequestInstrumentation(),
       new UserInteractionInstrumentation(),
     ],

frontend/vite.config.ts

@@ -7,5 +7,8 @@ export default defineConfig({
   server: {
     host: "0.0.0.0",
     port: 5173,
+    proxy: {
+      "/api": "http://localhost:8000",
+    },
   },
 });