[User Experience App] Update to make sure env filter is being used

x-pack/plugins/apm/server/lib/rum_client/queries.test.ts

@@ -16,6 +16,7 @@ import { getRumServices } from './get_rum_services';
 import { getLongTaskMetrics } from './get_long_task_metrics';
 import { getWebCoreVitals } from './get_web_core_vitals';
 import { getJSErrors } from './get_js_errors';
+import { ENVIRONMENT_ALL } from '../../../common/environment_filter_values';
 
 describe('rum client dashboard queries', () => {
   let mock: SearchParamsMock;
@@ -25,32 +26,38 @@ describe('rum client dashboard queries', () => {
   });
 
   it('fetches client metrics', async () => {
-    mock = await inspectSearchParams((setup) =>
-      getClientMetrics({
-        setup,
-      })
+    mock = await inspectSearchParams(
+      (setup) =>
+        getClientMetrics({
+          setup,
+        }),
+      { uiFilters: { environment: 'staging' } }
     );
 
     expect(mock.params).toMatchSnapshot();
   });
 
   it('fetches page view trends', async () => {
-    mock = await inspectSearchParams((setup) =>
-      getPageViewTrends({
-        setup,
-      })
+    mock = await inspectSearchParams(
+      (setup) =>
+        getPageViewTrends({
+          setup,
+        }),
+      { uiFilters: { environment: 'staging' } }
     );
 
     expect(mock.params).toMatchSnapshot();
   });
 
   it('fetches page load distribution', async () => {
-    mock = await inspectSearchParams((setup) =>
-      getPageLoadDistribution({
-        setup,
-        minPercentile: '0',
-        maxPercentile: '99',
-      })
+    mock = await inspectSearchParams(
+      (setup) =>
+        getPageLoadDistribution({
+          setup,
+          minPercentile: '0',
+          maxPercentile: '99',
+        }),
+      { uiFilters: { environment: 'staging' } }
     );
     expect(mock.params).toMatchSnapshot();
   });
@@ -65,10 +72,12 @@ describe('rum client dashboard queries', () => {
   });
 
   it('fetches rum core vitals', async () => {
-    mock = await inspectSearchParams((setup) =>
-      getWebCoreVitals({
-        setup,
-      })
+    mock = await inspectSearchParams(
+      (setup) =>
+        getWebCoreVitals({
+          setup,
+        }),
+      { uiFilters: { environment: ENVIRONMENT_ALL.value } }
     );
     expect(mock.params).toMatchSnapshot();
   });

x-pack/plugins/apm/server/lib/rum_client/ui_filters/get_es_filter.ts

@@ -8,6 +8,8 @@
 import { ESFilter } from '../../../../../../../typings/elasticsearch';
 import { UIFilters } from '../../../../typings/ui_filters';
 import { localUIFilters, localUIFilterNames } from './local_ui_filters/config';
+import { SERVICE_ENVIRONMENT } from '../../../../common/elasticsearch_fieldnames';
+import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
 
 export function getEsFilter(uiFilters: UIFilters) {
   const localFilterValues = uiFilters;
@@ -23,5 +25,16 @@ export function getEsFilter(uiFilters: UIFilters) {
       };
     }) as ESFilter[];
 
+  if (
+    uiFilters.environment &&
+    uiFilters.environment !== ENVIRONMENT_ALL.value
+  ) {
+    mappedFilters.push({
+      term: {
+        [SERVICE_ENVIRONMENT]: uiFilters.environment,
+      },
+    });
+  }
+
   return mappedFilters;
 }

x-pack/plugins/apm/server/utils/test_helpers.tsx

@@ -17,6 +17,7 @@ interface Options {
   mockResponse?: (
     request: ESSearchRequest
   ) => ESSearchResponse<unknown, ESSearchRequest>;
+  uiFilters?: Record<string, string>;
 }
 
 interface MockSetup {
@@ -86,7 +87,7 @@ export async function inspectSearchParams(
         },
       }
     ) as APMConfig,
-    uiFilters: {},
+    uiFilters: options?.uiFilters ?? {},
     indices: {
       /* eslint-disable @typescript-eslint/naming-convention */
       'apm_oss.sourcemapIndices': 'myIndex',