feat!: move query/logs/routes/diagram/agent-view endpoints under /environments/{envSlug}/

P3C — the last data/query wave of the taxonomy migration. Every user- facing read endpoint that was keyed on env-as-query-param is now under the env-scoped URL, making env impossible to omit and unambiguous in server-side tenant+env filtering. Server: - SearchController: /api/v1/search/** → /api/v1/environments/{envSlug}/... Endpoints: /executions (GET), /executions/search (POST), /stats, /stats/timeseries, /stats/timeseries/by-app, /stats/timeseries/by-route, /stats/punchcard, /attributes/keys, /errors/top. Env comes from path. - LogQueryController: /api/v1/logs → /api/v1/environments/{envSlug}/logs. - RouteCatalogController: /api/v1/routes/catalog → /api/v1/environments/ {envSlug}/routes. Env filter unconditional (path). - RouteMetricsController: /api/v1/routes/metrics → /api/v1/environments/{envSlug}/routes/metrics (and /metrics/processors). - DiagramRenderController: /{contentHash}/render stays flat (hashes are globally unique). Find-by-route moved to /api/v1/environments/{envSlug}/ apps/{appSlug}/routes/{routeId}/diagram — the old GET /diagrams?... handler is removed. - Agent views split cleanly: - AgentListController (new): /api/v1/environments/{envSlug}/agents - AgentEventsController: /api/v1/environments/{envSlug}/agents/events - AgentMetricsController: /api/v1/environments/{envSlug}/agents/ {agentId}/metrics — now also rejects cross-env agents (404) as a defense-in-depth check, fulfilling B3. Agent self-service endpoints (register/refresh/heartbeat/deregister) remain flat at /api/v1/agents/** — JWT-authoritative. SPA: - queries/agents.ts, agent-metrics.ts, logs.ts, catalog.ts (route metrics only; /catalog stays flat), processor-metrics.ts, executions.ts (attributes/keys, stats, timeseries, search), dashboard.ts (all stats/errors/punchcard), correlation.ts, diagrams.ts (by-route) — all rewritten to env-scoped URLs. - Hooks now either read env from useEnvironmentStore internally or require it as an argument. Query keys include env so switching env invalidates caches. - useAgents/useAgentEvents signature simplified — env is no longer a parameter; it's read from the store. Callers (LayoutShell, AgentHealth, AgentInstance) updated accordingly. - LogTab and useStartupLogs thread env through to useLogs. - envFetch helper introduced in executions.ts for env-prefixed raw fetch until schema.d.ts is regenerated against the new backend. BREAKING CHANGE: All these flat paths are removed: /api/v1/search/**, /api/v1/logs, /api/v1/routes/catalog, /api/v1/routes/metrics (and /processors), /api/v1/diagrams (lookup), /api/v1/agents (list), /api/v1/agents/events-log, /api/v1/agents/{id}/metrics, /api/v1/agent-events. Clients must use the /api/v1/environments/{envSlug}/... equivalents. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-04-16 23:48:25 +02:00
parent 6d9e456b97
commit 873e1d3df7
22 changed files with 486 additions and 430 deletions
--- a/ui/src/api/queries/agent-metrics.ts
+++ b/ui/src/api/queries/agent-metrics.ts
@@ -1,6 +1,7 @@
 import { useQuery } from '@tanstack/react-query';
 import { config } from '../../config';
 import { useAuthStore } from '../../auth/auth-store';
+import { useEnvironmentStore } from '../environment-store';
 import { useRefreshInterval } from './use-refresh-interval';

 export function useAgentMetrics(
@@ -11,9 +12,10 @@ export function useAgentMetrics(
  to?: string,
  mode: 'gauge' | 'delta' = 'gauge',
 ) {
+  const environment = useEnvironmentStore((s) => s.environment);
  const refetchInterval = useRefreshInterval(30_000);
  return useQuery({
-    queryKey: ['agent-metrics', agentId, names.join(','), buckets, from, to, mode],
+    queryKey: ['agent-metrics', environment, agentId, names.join(','), buckets, from, to, mode],
    queryFn: async () => {
      const token = useAuthStore.getState().accessToken;
      const params = new URLSearchParams({
@@ -23,16 +25,18 @@ export function useAgentMetrics(
      });
      if (from) params.set('from', from);
      if (to) params.set('to', to);
-      const res = await fetch(`${config.apiBaseUrl}/agents/${agentId}/metrics?${params}`, {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'X-Cameleer-Protocol-Version': '1',
-        },
-      });
+      const res = await fetch(
+        `${config.apiBaseUrl}/environments/${encodeURIComponent(environment!)}/agents/${encodeURIComponent(agentId!)}/metrics?${params}`,
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+            'X-Cameleer-Protocol-Version': '1',
+          },
+        });
      if (!res.ok) throw new Error(`${res.status}`);
      return res.json() as Promise<{ metrics: Record<string, Array<{ time: string; value: number }>> }>;
    },
-    enabled: !!agentId && names.length > 0,
+    enabled: !!agentId && names.length > 0 && !!environment,
    refetchInterval,
  });
 }
--- a/ui/src/api/queries/agents.ts
+++ b/ui/src/api/queries/agents.ts
@@ -1,53 +1,60 @@
 import { useQuery } from '@tanstack/react-query';
 import { config } from '../../config';
 import { useAuthStore } from '../../auth/auth-store';
+import { useEnvironmentStore } from '../environment-store';
 import { useRefreshInterval } from './use-refresh-interval';

-export function useAgents(status?: string, application?: string, environment?: string) {
+export function useAgents(status?: string, application?: string) {
+  const environment = useEnvironmentStore((s) => s.environment);
  const refetchInterval = useRefreshInterval(10_000);
  return useQuery({
-    queryKey: ['agents', status, application, environment],
+    queryKey: ['agents', environment, status, application],
    queryFn: async () => {
      const token = useAuthStore.getState().accessToken;
      const params = new URLSearchParams();
      if (status) params.set('status', status);
      if (application) params.set('application', application);
-      if (environment) params.set('environment', environment);
      const qs = params.toString();
-      const res = await fetch(`${config.apiBaseUrl}/agents${qs ? `?${qs}` : ''}`, {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'X-Cameleer-Protocol-Version': '1',
-        },
-      });
+      const res = await fetch(
+        `${config.apiBaseUrl}/environments/${encodeURIComponent(environment!)}/agents${qs ? `?${qs}` : ''}`,
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+            'X-Cameleer-Protocol-Version': '1',
+          },
+        });
      if (!res.ok) throw new Error('Failed to load agents');
      return res.json();
    },
+    enabled: !!environment,
    refetchInterval,
  });
 }

-export function useAgentEvents(appId?: string, agentId?: string, limit = 50, toOverride?: string, environment?: string) {
+export function useAgentEvents(appId?: string, agentId?: string, limit = 50, toOverride?: string) {
+  const environment = useEnvironmentStore((s) => s.environment);
  const refetchInterval = useRefreshInterval(15_000);
  return useQuery({
-    queryKey: ['agents', 'events', appId, agentId, limit, toOverride, environment],
+    queryKey: ['agents', 'events', environment, appId, agentId, limit, toOverride],
    queryFn: async () => {
      const token = useAuthStore.getState().accessToken;
      const params = new URLSearchParams();
      if (appId) params.set('appId', appId);
      if (agentId) params.set('agentId', agentId);
-      if (environment) params.set('environment', environment);
      if (toOverride) params.set('to', toOverride);
      params.set('limit', String(limit));
-      const res = await fetch(`${config.apiBaseUrl}/agents/events-log?${params}`, {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'X-Cameleer-Protocol-Version': '1',
-        },
-      });
+      const res = await fetch(
+        `${config.apiBaseUrl}/environments/${encodeURIComponent(environment!)}/agents/events?${params}`,
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+            'X-Cameleer-Protocol-Version': '1',
+          },
+        });
      if (!res.ok) throw new Error('Failed to load agent events');
      return res.json();
    },
+    enabled: !!environment,
    refetchInterval,
  });
 }
--- a/ui/src/api/queries/catalog.ts
+++ b/ui/src/api/queries/catalog.ts
@@ -89,15 +89,15 @@ export function useDismissApp() {
 export function useRouteMetrics(from?: string, to?: string, appId?: string, environment?: string) {
  const refetchInterval = useRefreshInterval(30_000);
  return useQuery({
-    queryKey: ['routes', 'metrics', from, to, appId, environment],
+    queryKey: ['routes', 'metrics', environment, from, to, appId],
    queryFn: async () => {
      const token = useAuthStore.getState().accessToken;
      const params = new URLSearchParams();
      if (from) params.set('from', from);
      if (to) params.set('to', to);
      if (appId) params.set('appId', appId);
-      if (environment) params.set('environment', environment);
-      const res = await fetch(`${config.apiBaseUrl}/routes/metrics?${params}`, {
+      const res = await fetch(
+        `${config.apiBaseUrl}/environments/${encodeURIComponent(environment!)}/routes/metrics?${params}`, {
        headers: {
          Authorization: `Bearer ${token}`,
          'X-Cameleer-Protocol-Version': '1',
@@ -106,6 +106,7 @@ export function useRouteMetrics(from?: string, to?: string, appId?: string, envi
      if (!res.ok) throw new Error('Failed to load route metrics');
      return res.json();
    },
+    enabled: !!environment,
    placeholderData: (prev: unknown) => prev,
    refetchInterval,
  });
--- a/ui/src/api/queries/correlation.ts
+++ b/ui/src/api/queries/correlation.ts
@@ -1,21 +1,31 @@
 import { useQuery } from '@tanstack/react-query';
-import { api } from '../client';
+import { config as appConfig } from '../../config';
+import { useAuthStore } from '../../auth/auth-store';

 export function useCorrelationChain(correlationId: string | null, environment?: string) {
  return useQuery({
-    queryKey: ['correlation-chain', correlationId, environment],
+    queryKey: ['correlation-chain', environment, correlationId],
    queryFn: async () => {
-      const { data } = await api.POST('/search/executions', {
-        body: {
-          correlationId: correlationId!,
-          environment,
-          limit: 20,
-          sortField: 'startTime',
-          sortDir: 'asc',
-        },
-      });
-      return data;
+      const token = useAuthStore.getState().accessToken;
+      const res = await fetch(
+        `${appConfig.apiBaseUrl}/environments/${encodeURIComponent(environment!)}/executions/search`,
+        {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+            ...(token ? { Authorization: `Bearer ${token}` } : {}),
+            'X-Cameleer-Protocol-Version': '1',
+          },
+          body: JSON.stringify({
+            correlationId: correlationId!,
+            limit: 20,
+            sortField: 'startTime',
+            sortDir: 'asc',
+          }),
+        });
+      if (!res.ok) throw new Error('Failed to load correlation chain');
+      return res.json();
    },
-    enabled: !!correlationId,
+    enabled: !!correlationId && !!environment,
  });
 }
--- a/ui/src/api/queries/dashboard.ts
+++ b/ui/src/api/queries/dashboard.ts
@@ -42,11 +42,12 @@ export interface GroupedTimeseries {
 export function useTimeseriesByApp(from?: string, to?: string, environment?: string) {
  const refetchInterval = useRefreshInterval(30_000);
  return useQuery({
-    queryKey: ['dashboard', 'timeseries-by-app', from, to, environment],
-    queryFn: () => fetchJson<GroupedTimeseries>('/search/stats/timeseries/by-app', {
-      from, to, buckets: '24', environment,
+    queryKey: ['dashboard', 'timeseries-by-app', environment, from, to],
+    queryFn: () => fetchJson<GroupedTimeseries>(
+      `/environments/${encodeURIComponent(environment!)}/stats/timeseries/by-app`, {
+      from, to, buckets: '24',
    }),
-    enabled: !!from,
+    enabled: !!from && !!environment,
    placeholderData: (prev: GroupedTimeseries | undefined) => prev,
    refetchInterval,
  });
@@ -57,11 +58,12 @@ export function useTimeseriesByApp(from?: string, to?: string, environment?: str
 export function useTimeseriesByRoute(from?: string, to?: string, application?: string, environment?: string) {
  const refetchInterval = useRefreshInterval(30_000);
  return useQuery({
-    queryKey: ['dashboard', 'timeseries-by-route', from, to, application, environment],
-    queryFn: () => fetchJson<GroupedTimeseries>('/search/stats/timeseries/by-route', {
-      from, to, application, buckets: '24', environment,
+    queryKey: ['dashboard', 'timeseries-by-route', environment, from, to, application],
+    queryFn: () => fetchJson<GroupedTimeseries>(
+      `/environments/${encodeURIComponent(environment!)}/stats/timeseries/by-route`, {
+      from, to, application, buckets: '24',
    }),
-    enabled: !!from && !!application,
+    enabled: !!from && !!application && !!environment,
    placeholderData: (prev: GroupedTimeseries | undefined) => prev,
    refetchInterval,
  });
@@ -82,11 +84,12 @@ export interface TopError {
 export function useTopErrors(from?: string, to?: string, application?: string, routeId?: string, environment?: string) {
  const refetchInterval = useRefreshInterval(10_000);
  return useQuery({
-    queryKey: ['dashboard', 'top-errors', from, to, application, routeId, environment],
-    queryFn: () => fetchJson<TopError[]>('/search/errors/top', {
-      from, to, application, routeId, limit: '5', environment,
+    queryKey: ['dashboard', 'top-errors', environment, from, to, application, routeId],
+    queryFn: () => fetchJson<TopError[]>(
+      `/environments/${encodeURIComponent(environment!)}/errors/top`, {
+      from, to, application, routeId, limit: '5',
    }),
-    enabled: !!from,
+    enabled: !!from && !!environment,
    placeholderData: (prev: TopError[] | undefined) => prev,
    refetchInterval,
  });
@@ -104,8 +107,10 @@ export interface PunchcardCell {
 export function usePunchcard(application?: string, environment?: string) {
  const refetchInterval = useRefreshInterval(60_000);
  return useQuery({
-    queryKey: ['dashboard', 'punchcard', application, environment],
-    queryFn: () => fetchJson<PunchcardCell[]>('/search/stats/punchcard', { application, environment }),
+    queryKey: ['dashboard', 'punchcard', environment, application],
+    queryFn: () => fetchJson<PunchcardCell[]>(
+      `/environments/${encodeURIComponent(environment!)}/stats/punchcard`, { application }),
+    enabled: !!environment,
    placeholderData: (prev: PunchcardCell[] | undefined) => prev ?? [],
    refetchInterval,
  });
--- a/ui/src/api/queries/diagrams.ts
+++ b/ui/src/api/queries/diagrams.ts
@@ -58,11 +58,21 @@ export function useDiagramByRoute(
  return useQuery({
    queryKey: ['diagrams', 'byRoute', environment, application, routeId, direction],
    queryFn: async () => {
-      const { data, error } = await api.GET('/diagrams', {
-        params: { query: { application: application!, environment: environment!, routeId: routeId!, direction } },
+      const { useAuthStore } = await import('../../auth/auth-store');
+      const { config: appConfig } = await import('../../config');
+      const token = useAuthStore.getState().accessToken;
+      const url = `${appConfig.apiBaseUrl}/environments/${encodeURIComponent(environment!)}` +
+        `/apps/${encodeURIComponent(application!)}` +
+        `/routes/${encodeURIComponent(routeId!)}/diagram?direction=${direction}`;
+      const res = await fetch(url, {
+        headers: {
+          Accept: 'application/json',
+          ...(token ? { Authorization: `Bearer ${token}` } : {}),
+          'X-Cameleer-Protocol-Version': '1',
+        },
      });
-      if (error) throw new Error('Failed to load diagram for route');
-      return data as DiagramLayout;
+      if (!res.ok) throw new Error('Failed to load diagram for route');
+      return (await res.json()) as DiagramLayout;
    },
    enabled: !!application && !!routeId && !!environment,
  });
--- a/ui/src/api/queries/executions.ts
+++ b/ui/src/api/queries/executions.ts
@@ -1,9 +1,35 @@
 import { useQuery } from '@tanstack/react-query';
 import { api } from '../client';
+import { config as appConfig } from '../../config';
+import { useAuthStore } from '../../auth/auth-store';
 import { useEnvironmentStore } from '../environment-store';
+import type { components } from '../schema';
 import type { SearchRequest } from '../types';
 import { useLiveQuery } from './use-refresh-interval';

+type ExecutionStats = components['schemas']['ExecutionStats'];
+type StatsTimeseries = components['schemas']['StatsTimeseries'];
+type SearchResultSummary = components['schemas']['SearchResultExecutionSummary'];
+
+// Raw authenticated fetch — used for env-scoped endpoints where the
+// generated openapi schema is still on the old flat shape. Switch back to
+// api.GET once the schema is regenerated against a running P3-era backend.
+async function envFetch<T>(envSlug: string, path: string, init?: RequestInit): Promise<T> {
+  const token = useAuthStore.getState().accessToken;
+  const res = await fetch(
+    `${appConfig.apiBaseUrl}/environments/${encodeURIComponent(envSlug)}${path}`, {
+      ...init,
+      headers: {
+        'Content-Type': 'application/json',
+        ...(token ? { Authorization: `Bearer ${token}` } : {}),
+        'X-Cameleer-Protocol-Version': '1',
+        ...init?.headers,
+      },
+    });
+  if (!res.ok) throw new Error(`API error: ${res.status}`);
+  return res.json() as Promise<T>;
+}
+
 export function useExecutionStats(
  timeFrom: string | undefined,
  timeTo: string | undefined,
@@ -13,23 +39,15 @@ export function useExecutionStats(
 ) {
  const live = useLiveQuery(10_000);
  return useQuery({
-    queryKey: ['executions', 'stats', timeFrom, timeTo, routeId, application, environment],
+    queryKey: ['executions', 'stats', environment, timeFrom, timeTo, routeId, application],
    queryFn: async () => {
-      const { data, error } = await api.GET('/search/stats', {
-        params: {
-          query: {
-            from: timeFrom!,
-            to: timeTo || undefined,
-            routeId: routeId || undefined,
-            application: application || undefined,
-            environment: environment || undefined,
-          },
-        },
-      });
-      if (error) throw new Error('Failed to load stats');
-      return data!;
+      const params = new URLSearchParams({ from: timeFrom! });
+      if (timeTo) params.set('to', timeTo);
+      if (routeId) params.set('routeId', routeId);
+      if (application) params.set('application', application);
+      return envFetch<ExecutionStats>(environment!, `/stats?${params}`);
    },
-    enabled: !!timeFrom && live.enabled,
+    enabled: !!timeFrom && !!environment && live.enabled,
    placeholderData: (prev) => prev,
    refetchInterval: live.refetchInterval,
  });
@@ -39,34 +57,23 @@ export function useAttributeKeys() {
  const environment = useEnvironmentStore((s) => s.environment);
  return useQuery({
    queryKey: ['search', 'attribute-keys', environment],
-    queryFn: async () => {
-      const token = (await import('../../auth/auth-store')).useAuthStore.getState().accessToken;
-      const { config } = await import('../../config');
-      const res = await fetch(
-        `${config.apiBaseUrl}/search/attributes/keys?environment=${encodeURIComponent(environment!)}`,
-        { headers: { Authorization: `Bearer ${token}` } },
-      );
-      if (!res.ok) throw new Error('Failed to load attribute keys');
-      return res.json() as Promise<string[]>;
-    },
+    queryFn: () => envFetch<string[]>(environment!, '/attributes/keys'),
    enabled: !!environment,
    staleTime: 60_000,
  });
 }

 export function useSearchExecutions(filters: SearchRequest, live = false) {
+  const environment = useEnvironmentStore((s) => s.environment);
  const liveQuery = useLiveQuery(5_000);
  return useQuery({
-    queryKey: ['executions', 'search', filters],
-    queryFn: async () => {
-      const { data, error } = await api.POST('/search/executions', {
-        body: filters,
-      });
-      if (error) throw new Error('Search failed');
-      return data!;
-    },
+    queryKey: ['executions', 'search', environment, filters],
+    queryFn: () => envFetch<SearchResultSummary>(environment!, '/executions/search', {
+      method: 'POST',
+      body: JSON.stringify(filters),
+    }),
    placeholderData: (prev) => prev,
-    enabled: live ? liveQuery.enabled : true,
+    enabled: !!environment && (live ? liveQuery.enabled : true),
    refetchInterval: live ? liveQuery.refetchInterval : false,
  });
 }
@@ -80,24 +87,15 @@ export function useStatsTimeseries(
 ) {
  const live = useLiveQuery(30_000);
  return useQuery({
-    queryKey: ['executions', 'timeseries', timeFrom, timeTo, routeId, application, environment],
+    queryKey: ['executions', 'timeseries', environment, timeFrom, timeTo, routeId, application],
    queryFn: async () => {
-      const { data, error } = await api.GET('/search/stats/timeseries', {
-        params: {
-          query: {
-            from: timeFrom!,
-            to: timeTo || undefined,
-            buckets: 24,
-            routeId: routeId || undefined,
-            application: application || undefined,
-            environment: environment || undefined,
-          },
-        },
-      });
-      if (error) throw new Error('Failed to load timeseries');
-      return data!;
+      const params = new URLSearchParams({ from: timeFrom!, buckets: '24' });
+      if (timeTo) params.set('to', timeTo);
+      if (routeId) params.set('routeId', routeId);
+      if (application) params.set('application', application);
+      return envFetch<StatsTimeseries>(environment!, `/stats/timeseries?${params}`);
    },
-    enabled: !!timeFrom && live.enabled,
+    enabled: !!timeFrom && !!environment && live.enabled,
    placeholderData: (prev) => prev,
    refetchInterval: live.refetchInterval,
  });
--- a/ui/src/api/queries/logs.ts
+++ b/ui/src/api/queries/logs.ts
@@ -32,7 +32,8 @@ export interface LogSearchParams {
  application?: string;
  agentId?: string;
  source?: string;
-  environment?: string;
+  /** Required: env in path */
+  environment: string;
  exchangeId?: string;
  logger?: string;
  from?: string;
@@ -50,7 +51,6 @@ async function fetchLogs(params: LogSearchParams): Promise<LogSearchPageResponse
  if (params.application) urlParams.set('application', params.application);
  if (params.agentId) urlParams.set('agentId', params.agentId);
  if (params.source) urlParams.set('source', params.source);
-  if (params.environment) urlParams.set('environment', params.environment);
  if (params.exchangeId) urlParams.set('exchangeId', params.exchangeId);
  if (params.logger) urlParams.set('logger', params.logger);
  if (params.from) urlParams.set('from', params.from);
@@ -59,7 +59,8 @@ async function fetchLogs(params: LogSearchParams): Promise<LogSearchPageResponse
  if (params.limit) urlParams.set('limit', String(params.limit));
  if (params.sort) urlParams.set('sort', params.sort);

-  const res = await fetch(`${config.apiBaseUrl}/logs?${urlParams}`, {
+  const res = await fetch(
+    `${config.apiBaseUrl}/environments/${encodeURIComponent(params.environment)}/logs?${urlParams}`, {
    headers: {
      Authorization: `Bearer ${token}`,
      'X-Cameleer-Protocol-Version': '1',
@@ -81,7 +82,7 @@ export function useLogs(
  return useQuery({
    queryKey: ['logs', params],
    queryFn: () => fetchLogs(params),
-    enabled: options?.enabled ?? true,
+    enabled: (options?.enabled ?? true) && !!params.environment,
    placeholderData: (prev) => prev,
    refetchInterval: options?.refetchInterval ?? defaultRefetch,
    staleTime: 300,
@@ -107,7 +108,7 @@ export function useApplicationLogs(
    application: application || undefined,
    agentId: agentId || undefined,
    source: options?.source || undefined,
-    environment: selectedEnv || undefined,
+    environment: selectedEnv ?? '',
    exchangeId: options?.exchangeId || undefined,
    from: useTimeRange ? timeRange.start.toISOString() : undefined,
    to: useTimeRange ? to : undefined,
@@ -120,7 +121,7 @@ export function useApplicationLogs(
      useTimeRange ? to : null,
      options?.limit, options?.exchangeId, options?.source],
    queryFn: () => fetchLogs(params),
-    enabled: !!application,
+    enabled: !!application && !!selectedEnv,
    placeholderData: (prev) => prev,
    refetchInterval,
  });
@@ -144,7 +145,7 @@ export function useStartupLogs(
 ) {
  const params: LogSearchParams = {
    application: application || undefined,
-    environment: environment || undefined,
+    environment: environment ?? '',
    source: 'container',
    from: deployCreatedAt || undefined,
    sort: 'asc',
@@ -152,7 +153,7 @@ export function useStartupLogs(
  };

  return useLogs(params, {
-    enabled: !!application && !!deployCreatedAt,
+    enabled: !!application && !!deployCreatedAt && !!environment,
    refetchInterval: isStarting ? 3_000 : false,
  });
 }
--- a/ui/src/api/queries/processor-metrics.ts
+++ b/ui/src/api/queries/processor-metrics.ts
@@ -6,23 +6,24 @@ import { useRefreshInterval } from './use-refresh-interval';
 export function useProcessorMetrics(routeId: string | null, appId?: string, environment?: string) {
  const refetchInterval = useRefreshInterval(30_000);
  return useQuery({
-    queryKey: ['processor-metrics', routeId, appId, environment],
+    queryKey: ['processor-metrics', environment, routeId, appId],
    queryFn: async () => {
      const token = useAuthStore.getState().accessToken;
      const params = new URLSearchParams();
      if (routeId) params.set('routeId', routeId);
      if (appId) params.set('appId', appId);
-      if (environment) params.set('environment', environment);
-      const res = await fetch(`${config.apiBaseUrl}/routes/metrics/processors?${params}`, {
-        headers: {
-          Authorization: `Bearer ${token}`,
-          'X-Cameleer-Protocol-Version': '1',
-        },
-      });
+      const res = await fetch(
+        `${config.apiBaseUrl}/environments/${encodeURIComponent(environment!)}/routes/metrics/processors?${params}`,
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+            'X-Cameleer-Protocol-Version': '1',
+          },
+        });
      if (!res.ok) throw new Error(`${res.status}`);
      return res.json();
    },
-    enabled: !!routeId,
+    enabled: !!routeId && !!environment,
    refetchInterval,
  });
 }
--- a/ui/src/components/ExecutionDiagram/tabs/LogTab.tsx
+++ b/ui/src/components/ExecutionDiagram/tabs/LogTab.tsx
@@ -4,6 +4,7 @@ import { Input, Button, LogViewer } from '@cameleer/design-system';
 import type { LogEntry } from '@cameleer/design-system';
 import { useLogs } from '../../../api/queries/logs';
 import type { LogEntryResponse } from '../../../api/queries/logs';
+import { useEnvironmentStore } from '../../../api/environment-store';
 import { mapLogLevel } from '../../../utils/agent-utils';
 import logStyles from './LogTab.module.css';
 import diagramStyles from '../ExecutionDiagram.module.css';
@@ -27,9 +28,10 @@ export function LogTab({ applicationId, exchangeId, processorId }: LogTabProps)
  const [filter, setFilter] = useState('');
  const navigate = useNavigate();

+  const environment = useEnvironmentStore((s) => s.environment) ?? '';
  const { data: logPage, isLoading } = useLogs(
-    { exchangeId, limit: 500 },
-    { enabled: !!exchangeId },
+    { exchangeId, environment, limit: 500 },
+    { enabled: !!exchangeId && !!environment },
  );

  const entries = useMemo<LogEntry[]>(() => {
--- a/ui/src/components/LayoutShell.tsx
+++ b/ui/src/components/LayoutShell.tsx
@@ -303,8 +303,10 @@ function LayoutContent() {
  const setSelectedEnvRaw = useEnvironmentStore((s) => s.setEnvironment);

  const { data: catalog } = useCatalog(selectedEnv);
-  const { data: allAgents } = useAgents();  // unfiltered — for environment discovery
-  const { data: agents } = useAgents(undefined, undefined, selectedEnv);  // filtered — for sidebar/search
+  // Env is always required now (path-based endpoint). For cross-env "all agents"
+  // we'd need a separate flat endpoint; sidebar uses env-filtered list directly.
+  const { data: agents } = useAgents();  // env pulled from store internally
+  const allAgents = agents;
  const { data: attributeKeys } = useAttributeKeys();
  const { data: envRecords = [] } = useEnvironments();

--- a/ui/src/pages/AgentHealth/AgentHealth.tsx
+++ b/ui/src/pages/AgentHealth/AgentHealth.tsx
@@ -163,7 +163,7 @@ export default function AgentHealth() {
  const navigate = useNavigate();
  const { toast } = useToast();
  const selectedEnv = useEnvironmentStore((s) => s.environment);
-  const { data: agents } = useAgents(undefined, appId, selectedEnv);
+  const { data: agents } = useAgents(undefined, appId);
  const { data: appConfig } = useApplicationConfig(appId, selectedEnv);
  const updateConfig = useUpdateApplicationConfig();

@@ -282,7 +282,7 @@ export default function AgentHealth() {
  }, [appConfig, configDraft, updateConfig, toast, appId]);
  const [eventSortAsc, setEventSortAsc] = useState(false);
  const [eventRefreshTo, setEventRefreshTo] = useState<string | undefined>();
-  const { data: events } = useAgentEvents(appId, undefined, 50, eventRefreshTo, selectedEnv);
+  const { data: events } = useAgentEvents(appId, undefined, 50, eventRefreshTo);

  const [appFilter, setAppFilter] = useState('');
  type AppSortKey = 'status' | 'name' | 'tps' | 'cpu' | 'heartbeat';
--- a/ui/src/pages/AgentInstance/AgentInstance.tsx
+++ b/ui/src/pages/AgentInstance/AgentInstance.tsx
@@ -45,8 +45,8 @@ export default function AgentInstance() {
  const timeTo = timeRange.end.toISOString();

  const selectedEnv = useEnvironmentStore((s) => s.environment);
-  const { data: agents, isLoading } = useAgents(undefined, appId, selectedEnv);
-  const { data: events } = useAgentEvents(appId, instanceId, 50, eventRefreshTo, selectedEnv);
+  const { data: agents, isLoading } = useAgents(undefined, appId);
+  const { data: events } = useAgentEvents(appId, instanceId, 50, eventRefreshTo);

  const agent = useMemo(
    () => (agents || []).find((a: any) => a.instanceId === instanceId) as any,