Support per-signal OTLP exporter endpoints for Hyperdx internal telemetry (#2098)

## Summary
This change allows for more granular control over OpenTelemetry data routing by enabling independent configuration of traces, metrics, and logs endpoints. This is particularly useful for complex networking environments or when using different backends for different telemetry types.

Additionally, the browser instrumentation has been updated to a local wrapper to better manage these signal-specific configurations and improve internal consistency.

### How to test locally or on Vercel


#### 1. Verify default behavior (no per-signal env vars set)

1. Start HyperDX
2. Confirm the app loads and works as before (login, search, navigate).
3. `curl http://localhost:8080/api/config | jq .` -- verify `collectorUrl` is present and `collectorTracesUrl` / `collectorMetricsUrl` / `collectorLogsUrl` are absent (undefined values are omitted from JSON).

#### 2. Verify per-signal env vars are exposed via the config API

1. Stop the app. Set per-signal env vars and restart:
   ```bash
   export NEXT_PUBLIC_OTEL_EXPORTER_OTLP_TRACES_ENDPOINT="http://localhost:4318/v1/traces"
   export NEXT_PUBLIC_OTEL_EXPORTER_OTLP_LOGS_ENDPOINT="http://localhost:4318/v1/logs"
   yarn dev
   ```
2. `curl http://localhost:8080/api/config | jq .` -- confirm `collectorTracesUrl` and `collectorLogsUrl` now appear with the values set above.

#### 3. Verify browser telemetry routes to separate endpoints

1. Set the per-signal env vars to two _different_ ports:
   ```bash
   export NEXT_PUBLIC_OTEL_EXPORTER_OTLP_TRACES_ENDPOINT="http://localhost:4318/v1/traces"
   export NEXT_PUBLIC_OTEL_EXPORTER_OTLP_LOGS_ENDPOINT="http://localhost:4319/v1/logs"
   yarn dev
   ```
2. Open the app in a browser with DevTools -> Network tab open.
3. Navigate around, then filter requests by `v1/traces` and `v1/logs`. Confirm trace exports hit `:4318` and session replay log exports hit `:4319`.

#### 4. Verify server-side Node.js telemetry (API + Next.js server)

1. `@hyperdx/node-opentelemetry` natively reads per-signal env vars. Set them and start:
   ```bash
   export OTEL_EXPORTER_OTLP_TRACES_ENDPOINT="http://localhost:4318/v1/traces"
   export OTEL_EXPORTER_OTLP_LOGS_ENDPOINT="http://localhost:4319/v1/logs"
   export OTEL_EXPORTER_OTLP_METRICS_ENDPOINT="http://localhost:4320/v1/metrics"
   yarn dev
   ```
2. Confirm in otel-collector logs that each signal arrives at its respective endpoint.


### References
- Linear Issue: #2076


Co-authored-by: Alex Fedotyev <61838744+alex-fedotyev@users.noreply.github.com>

Author: vinzee

.changeset/deep-years-see.md

@@ -0,0 +1,5 @@
+---
+'@hyperdx/app': patch
+---
+
+Support per-signal OTLP exporter endpoints for Hyperdx internal telemetry

docker-compose.yml

@@ -62,6 +62,10 @@ services:
       SERVER_URL: http://127.0.0.1:${HYPERDX_API_PORT}
       OPAMP_PORT: ${HYPERDX_OPAMP_PORT}
       OTEL_EXPORTER_OTLP_ENDPOINT: 'http://otel-collector:4318'
+      # Per-signal OTLP endpoints (override OTEL_EXPORTER_OTLP_ENDPOINT for individual signals)
+      # OTEL_EXPORTER_OTLP_TRACES_ENDPOINT: 'http://otel-collector:4318/v1/traces'
+      # OTEL_EXPORTER_OTLP_METRICS_ENDPOINT: 'http://otel-collector:4318/v1/metrics'
+      # OTEL_EXPORTER_OTLP_LOGS_ENDPOINT: 'http://otel-collector:4318/v1/logs'
       OTEL_SERVICE_NAME: 'hdx-oss-app'
       USAGE_STATS_ENABLED: ${USAGE_STATS_ENABLED:-true}
       DEFAULT_CONNECTIONS:

packages/api/.env.development

@@ -11,6 +11,10 @@ NODE_ENV=development
 OTEL_SERVICE_NAME="hdx-oss-dev-api"
 OTEL_RESOURCE_ATTRIBUTES="service.version=dev"
 OTEL_EXPORTER_OTLP_ENDPOINT="http://localhost:${HDX_DEV_OTEL_HTTP_PORT}"
+# Per-signal OTLP endpoints (override the base endpoint for individual signals)
+# OTEL_EXPORTER_OTLP_TRACES_ENDPOINT=
+# OTEL_EXPORTER_OTLP_METRICS_ENDPOINT=
+# OTEL_EXPORTER_OTLP_LOGS_ENDPOINT=
 PORT=${HYPERDX_API_PORT}
 OPAMP_PORT=${HYPERDX_OPAMP_PORT}
 REDIS_URL=redis://localhost:6379

packages/app/.env.development

@@ -8,4 +8,8 @@ PORT=${HYPERDX_APP_PORT}
 NODE_OPTIONS="--max-http-header-size=131072"
 NEXT_PUBLIC_HYPERDX_BASE_PATH=
 NEXT_PUBLIC_OTEL_EXPORTER_OTLP_ENDPOINT="http://localhost:${HDX_DEV_OTEL_HTTP_PORT:-4318}"
-NEXT_PUBLIC_IS_DASHBOARD_LINKING_ENABLED=true
+NEXT_PUBLIC_IS_DASHBOARD_LINKING_ENABLED=true
+# Per-signal OTLP endpoints (override the base endpoint for individual signals)
+# NEXT_PUBLIC_OTEL_EXPORTER_OTLP_TRACES_ENDPOINT=
+# NEXT_PUBLIC_OTEL_EXPORTER_OTLP_METRICS_ENDPOINT=
+# NEXT_PUBLIC_OTEL_EXPORTER_OTLP_LOGS_ENDPOINT=

packages/app/Dockerfile

@@ -43,9 +43,15 @@ COPY --from=common-utils-builder /app/packages/common-utils ./packages/common-ut
 # Expose custom env variables to the browser (needs NEXT_PUBLIC_ prefix)
 # doc: https://nextjs.org/docs/pages/building-your-application/configuring/environment-variables#bundling-environment-variables-for-the-browser
 ARG OTEL_EXPORTER_OTLP_ENDPOINT
+ARG OTEL_EXPORTER_OTLP_TRACES_ENDPOINT
+ARG OTEL_EXPORTER_OTLP_METRICS_ENDPOINT
+ARG OTEL_EXPORTER_OTLP_LOGS_ENDPOINT
 ARG OTEL_SERVICE_NAME
 ARG IS_LOCAL_MODE
 ENV NEXT_PUBLIC_OTEL_EXPORTER_OTLP_ENDPOINT $OTEL_EXPORTER_OTLP_ENDPOINT
+ENV NEXT_PUBLIC_OTEL_EXPORTER_OTLP_TRACES_ENDPOINT $OTEL_EXPORTER_OTLP_TRACES_ENDPOINT
+ENV NEXT_PUBLIC_OTEL_EXPORTER_OTLP_METRICS_ENDPOINT $OTEL_EXPORTER_OTLP_METRICS_ENDPOINT
+ENV NEXT_PUBLIC_OTEL_EXPORTER_OTLP_LOGS_ENDPOINT $OTEL_EXPORTER_OTLP_LOGS_ENDPOINT
 ENV NEXT_PUBLIC_OTEL_SERVICE_NAME $OTEL_SERVICE_NAME
 ENV NEXT_PUBLIC_IS_LOCAL_MODE $IS_LOCAL_MODE
 

packages/app/package.json

@@ -36,7 +36,7 @@
     "@dnd-kit/sortable": "^10.0.0",
     "@dnd-kit/utilities": "^3.2.2",
     "@hookform/resolvers": "^3.9.0",
-    "@hyperdx/browser": "^0.22.0",
+    "@hyperdx/browser": "^0.22.1",
     "@hyperdx/common-utils": "^0.18.1",
     "@hyperdx/node-opentelemetry": "^0.9.0",
     "@mantine/core": "^9.0.0",

packages/app/pages/_app.tsx

@@ -155,6 +155,8 @@ export default function MyApp({ Component, pageProps }: AppPropsWithLayout) {
             service: _jsonData.serviceName,
             // tracePropagationTargets: [new RegExp(hostname ?? 'localhost', 'i')],
             url: _jsonData.collectorUrl,
+            tracesUrl: _jsonData.collectorTracesUrl,
+            logsUrl: _jsonData.collectorLogsUrl,
           });
         } else {
           console.warn('No API key found to enable OTEL exporter');

packages/app/pages/api/config.ts

@@ -4,7 +4,10 @@ import {
   HDX_API_KEY,
   HDX_COLLECTOR_URL,
   HDX_EXPORTER_ENABLED,
+  HDX_LOGS_COLLECTOR_URL,
+  HDX_METRICS_COLLECTOR_URL,
   HDX_SERVICE_NAME,
+  HDX_TRACES_COLLECTOR_URL,
 } from '@/config';
 import type { NextApiConfigResponseData } from '@/types';
 
@@ -15,6 +18,9 @@ export default function handler(
   res.status(200).json({
     apiKey: HDX_EXPORTER_ENABLED ? HDX_API_KEY : undefined,
     collectorUrl: HDX_COLLECTOR_URL,
+    collectorTracesUrl: HDX_TRACES_COLLECTOR_URL,
+    collectorMetricsUrl: HDX_METRICS_COLLECTOR_URL,
+    collectorLogsUrl: HDX_LOGS_COLLECTOR_URL,
     serviceName: HDX_SERVICE_NAME,
     appVersion: process.env.NEXT_PUBLIC_APP_VERSION,
   });

packages/app/src/config.ts

@@ -37,6 +37,15 @@ export const HDX_COLLECTOR_URL =
   process.env.NEXT_PUBLIC_OTEL_EXPORTER_OTLP_ENDPOINT ??
   process.env.OTEL_EXPORTER_OTLP_ENDPOINT ??
   'http://localhost:4318';
+export const HDX_TRACES_COLLECTOR_URL =
+  process.env.NEXT_PUBLIC_OTEL_EXPORTER_OTLP_TRACES_ENDPOINT ??
+  process.env.OTEL_EXPORTER_OTLP_TRACES_ENDPOINT;
+export const HDX_METRICS_COLLECTOR_URL =
+  process.env.NEXT_PUBLIC_OTEL_EXPORTER_OTLP_METRICS_ENDPOINT ??
+  process.env.OTEL_EXPORTER_OTLP_METRICS_ENDPOINT;
+export const HDX_LOGS_COLLECTOR_URL =
+  process.env.NEXT_PUBLIC_OTEL_EXPORTER_OTLP_LOGS_ENDPOINT ??
+  process.env.OTEL_EXPORTER_OTLP_LOGS_ENDPOINT;
 export const IS_DEV = NODE_ENV === 'development';
 
 export const IS_OSS = process.env.NEXT_PUBLIC_IS_OSS ?? 'true' === 'true';

packages/app/src/types.ts

@@ -139,6 +139,9 @@ export enum KubePhase {
 export type NextApiConfigResponseData = {
   apiKey?: string;
   collectorUrl: string;
+  collectorTracesUrl?: string;
+  collectorMetricsUrl?: string;
+  collectorLogsUrl?: string;
   serviceName: string;
   appVersion?: string;
 };