feat: add environment filtering across all APIs and UI

Backend: Added optional `environment` query parameter to catalog,
search, stats, timeseries, punchcard, top-errors, logs, and agents
endpoints. ClickHouse queries filter by environment when specified
(literal SQL for AggregatingMergeTree, ? binds for raw tables).
StatsStore interface methods all accept environment parameter.

UI: Added EnvironmentSelector component (compact native select).
LayoutShell extracts distinct environments from agent data and
passes selected environment to catalog and agent queries via URL
search param (?env=). TopBar shows current environment label.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

ui/src/api/queries/agents.ts

@@ -1,19 +1,27 @@
 import { useQuery } from '@tanstack/react-query';
-import { api } from '../client';
 import { config } from '../../config';
 import { useAuthStore } from '../../auth/auth-store';
 import { useRefreshInterval } from './use-refresh-interval';
 
-export function useAgents(status?: string, application?: string) {
+export function useAgents(status?: string, application?: string, environment?: string) {
   const refetchInterval = useRefreshInterval(10_000);
   return useQuery({
-    queryKey: ['agents', status, application],
+    queryKey: ['agents', status, application, environment],
     queryFn: async () => {
-      const { data, error } = await api.GET('/agents', {
-        params: { query: { ...(status ? { status } : {}), ...(application ? { application } : {}) } },
+      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',
+        },
       });
-      if (error) throw new Error('Failed to load agents');
-      return data!;
+      if (!res.ok) throw new Error('Failed to load agents');
+      return res.json();
     },
     refetchInterval,
   });

ui/src/api/queries/catalog.ts

@@ -3,15 +3,16 @@ import { config } from '../../config';
 import { useAuthStore } from '../../auth/auth-store';
 import { useRefreshInterval } from './use-refresh-interval';
 
-export function useRouteCatalog(from?: string, to?: string) {
+export function useRouteCatalog(from?: string, to?: string, environment?: string) {
   const refetchInterval = useRefreshInterval(15_000);
   return useQuery({
-    queryKey: ['routes', 'catalog', from, to],
+    queryKey: ['routes', 'catalog', from, to, environment],
     queryFn: async () => {
       const token = useAuthStore.getState().accessToken;
       const params = new URLSearchParams();
       if (from) params.set('from', from);
       if (to) params.set('to', to);
+      if (environment) params.set('environment', environment);
       const qs = params.toString();
       const res = await fetch(`${config.apiBaseUrl}/routes/catalog${qs ? `?${qs}` : ''}`, {
         headers: {

ui/src/api/queries/dashboard.ts

@@ -39,12 +39,12 @@ export interface GroupedTimeseries {
   [key: string]: { buckets: TimeseriesBucket[] };
 }
 
-export function useTimeseriesByApp(from?: string, to?: string) {
+export function useTimeseriesByApp(from?: string, to?: string, environment?: string) {
   const refetchInterval = useRefreshInterval(30_000);
   return useQuery({
-    queryKey: ['dashboard', 'timeseries-by-app', from, to],
+    queryKey: ['dashboard', 'timeseries-by-app', from, to, environment],
     queryFn: () => fetchJson<GroupedTimeseries>('/search/stats/timeseries/by-app', {
-      from, to, buckets: '24',
+      from, to, buckets: '24', environment,
     }),
     enabled: !!from,
     placeholderData: (prev: GroupedTimeseries | undefined) => prev,
@@ -54,12 +54,12 @@ export function useTimeseriesByApp(from?: string, to?: string) {
 
 // ── Timeseries by route (L2 charts) ───────────────────────────────────
 
-export function useTimeseriesByRoute(from?: string, to?: string, application?: string) {
+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],
+    queryKey: ['dashboard', 'timeseries-by-route', from, to, application, environment],
     queryFn: () => fetchJson<GroupedTimeseries>('/search/stats/timeseries/by-route', {
-      from, to, application, buckets: '24',
+      from, to, application, buckets: '24', environment,
     }),
     enabled: !!from && !!application,
     placeholderData: (prev: GroupedTimeseries | undefined) => prev,
@@ -79,12 +79,12 @@ export interface TopError {
   lastSeen: string;
 }
 
-export function useTopErrors(from?: string, to?: string, application?: string, routeId?: string) {
+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],
+    queryKey: ['dashboard', 'top-errors', from, to, application, routeId, environment],
     queryFn: () => fetchJson<TopError[]>('/search/errors/top', {
-      from, to, application, routeId, limit: '5',
+      from, to, application, routeId, limit: '5', environment,
     }),
     enabled: !!from,
     placeholderData: (prev: TopError[] | undefined) => prev,
@@ -101,11 +101,11 @@ export interface PunchcardCell {
   failedCount: number;
 }
 
-export function usePunchcard(application?: string) {
+export function usePunchcard(application?: string, environment?: string) {
   const refetchInterval = useRefreshInterval(60_000);
   return useQuery({
-    queryKey: ['dashboard', 'punchcard', application],
-    queryFn: () => fetchJson<PunchcardCell[]>('/search/stats/punchcard', { application }),
+    queryKey: ['dashboard', 'punchcard', application, environment],
+    queryFn: () => fetchJson<PunchcardCell[]>('/search/stats/punchcard', { application, environment }),
     placeholderData: (prev: PunchcardCell[] | undefined) => prev ?? [],
     refetchInterval,
   });

ui/src/api/queries/executions.ts

@@ -8,10 +8,11 @@ export function useExecutionStats(
   timeTo: string | undefined,
   routeId?: string,
   application?: string,
+  environment?: string,
 ) {
   const live = useLiveQuery(10_000);
   return useQuery({
-    queryKey: ['executions', 'stats', timeFrom, timeTo, routeId, application],
+    queryKey: ['executions', 'stats', timeFrom, timeTo, routeId, application, environment],
     queryFn: async () => {
       const { data, error } = await api.GET('/search/stats', {
         params: {
@@ -20,6 +21,7 @@ export function useExecutionStats(
             to: timeTo || undefined,
             routeId: routeId || undefined,
             application: application || undefined,
+            environment: environment || undefined,
           },
         },
       });
@@ -70,10 +72,11 @@ export function useStatsTimeseries(
   timeTo: string | undefined,
   routeId?: string,
   application?: string,
+  environment?: string,
 ) {
   const live = useLiveQuery(30_000);
   return useQuery({
-    queryKey: ['executions', 'timeseries', timeFrom, timeTo, routeId, application],
+    queryKey: ['executions', 'timeseries', timeFrom, timeTo, routeId, application, environment],
     queryFn: async () => {
       const { data, error } = await api.GET('/search/stats/timeseries', {
         params: {
@@ -83,6 +86,7 @@ export function useStatsTimeseries(
             buckets: 24,
             routeId: routeId || undefined,
             application: application || undefined,
+            environment: environment || undefined,
           },
         },
       });

ui/src/api/schema.d.ts

@@ -1502,6 +1502,7 @@ export interface components {
             limit?: number;
             sortField?: string;
             sortDir?: string;
+            environment?: string;
         };
         ExecutionSummary: {
             executionId: string;
@@ -1960,6 +1961,7 @@ export interface components {
             instanceId: string;
             displayName: string;
             applicationId: string;
+            environmentId?: string;
             status: string;
             routeIds: string[];
             /** Format: date-time */
@@ -2773,6 +2775,7 @@ export interface operations {
                 agentId?: string;
                 processorType?: string;
                 application?: string;
+                environment?: string;
                 offset?: number;
                 limit?: number;
                 sortField?: string;
@@ -3795,6 +3798,7 @@ export interface operations {
                 to?: string;
                 routeId?: string;
                 application?: string;
+                environment?: string;
             };
             header?: never;
             path?: never;
@@ -3821,6 +3825,7 @@ export interface operations {
                 buckets?: number;
                 routeId?: string;
                 application?: string;
+                environment?: string;
             };
             header?: never;
             path?: never;
@@ -3846,6 +3851,7 @@ export interface operations {
                 to?: string;
                 buckets?: number;
                 application: string;
+                environment?: string;
             };
             header?: never;
             path?: never;
@@ -3872,6 +3878,7 @@ export interface operations {
                 from: string;
                 to?: string;
                 buckets?: number;
+                environment?: string;
             };
             header?: never;
             path?: never;
@@ -3896,6 +3903,7 @@ export interface operations {
         parameters: {
             query?: {
                 application?: string;
+                environment?: string;
             };
             header?: never;
             path?: never;
@@ -3921,6 +3929,7 @@ export interface operations {
                 to?: string;
                 application?: string;
                 routeId?: string;
+                environment?: string;
                 limit?: number;
             };
             header?: never;
@@ -4334,6 +4343,7 @@ export interface operations {
             query?: {
                 status?: string;
                 application?: string;
+                environment?: string;
             };
             header?: never;
             path?: never;