From 2cc2a43e17f7c63a83e798defbff8953cb775edf Mon Sep 17 00:00:00 2001
From: Shaheer Kochai <ashaheerki@gmail.com>
Date: Wed, 11 Sep 2024 08:52:45 +0430
Subject: [PATCH] feat: add resource_deployment_environment as fast filter in
 traces page (#5864)

* feat: add resource_deployment_environment as fast filter in traces page

* chore: directly use deployment.environment, rather than converting resource_deployment_environment

* chore: make environment filter expanded by default

* chore: add deployment.environment to defaultOpenSections to pass the test

---------

Co-authored-by: Ankit Nayan <ankit@signoz.io>
---
 .../pages/TracesExplorer/Filter/Section.tsx   |  1 +
 .../TracesExplorer/Filter/filterUtils.ts      | 20 ++++++++++++++-----
 .../TracesExplorer/__test__/testUtils.ts      |  7 ++++++-
 3 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/frontend/src/pages/TracesExplorer/Filter/Section.tsx b/frontend/src/pages/TracesExplorer/Filter/Section.tsx
index 9212f610b0..5ba94b1307 100644
--- a/frontend/src/pages/TracesExplorer/Filter/Section.tsx
+++ b/frontend/src/pages/TracesExplorer/Filter/Section.tsx
@@ -37,6 +37,7 @@ export function Section(props: SectionProps): JSX.Element {
 					'hasError',
 					'durationNano',
 					'serviceName',
+					'deployment.environment',
 				]),
 			),
 		[selectedFilters],
diff --git a/frontend/src/pages/TracesExplorer/Filter/filterUtils.ts b/frontend/src/pages/TracesExplorer/Filter/filterUtils.ts
index 88f604a0dc..ea82bc52ef 100644
--- a/frontend/src/pages/TracesExplorer/Filter/filterUtils.ts
+++ b/frontend/src/pages/TracesExplorer/Filter/filterUtils.ts
@@ -8,10 +8,11 @@ import {
 import { TagFilterItem } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
 
-export const AllTraceFilterKeyValue = {
+export const AllTraceFilterKeyValue: Record<string, string> = {
 	durationNanoMin: 'Duration',
 	durationNano: 'Duration',
 	durationNanoMax: 'Duration',
+	'deployment.environment': 'Environment',
 	hasError: 'Status',
 	serviceName: 'Service Name',
 	name: 'Operation / Name',
@@ -22,7 +23,7 @@ export const AllTraceFilterKeyValue = {
 	httpRoute: 'HTTP Route',
 	httpUrl: 'HTTP URL',
 	traceID: 'Trace ID',
-};
+} as const;
 
 export type AllTraceFilterKeys = keyof typeof AllTraceFilterKeyValue;
 
@@ -64,7 +65,7 @@ export const addFilter = (
 			| undefined
 		>
 	>,
-	keys?: BaseAutocompleteData,
+	keys: BaseAutocompleteData,
 ): void => {
 	setSelectedFilters((prevFilters) => {
 		const isDuration = [
@@ -122,7 +123,7 @@ export const removeFilter = (
 			| undefined
 		>
 	>,
-	keys?: BaseAutocompleteData,
+	keys: BaseAutocompleteData,
 ): void => {
 	setSelectedFilters((prevFilters) => {
 		if (!prevFilters || !prevFilters[filterType]?.values.length) {
@@ -202,6 +203,15 @@ export const traceFilterKeys: Record<
 		isJSON: false,
 		id: 'serviceName--string--tag--true',
 	},
+
+	'deployment.environment': {
+		key: 'deployment.environment',
+		dataType: DataTypes.String,
+		type: 'resource',
+		isColumn: false,
+		isJSON: false,
+		id: 'deployment.environment--string--resource--false',
+	},
 	name: {
 		key: 'name',
 		dataType: DataTypes.String,
@@ -282,7 +292,7 @@ export const traceFilterKeys: Record<
 		isJSON: false,
 		id: 'durationNanoMax--float64--tag--true',
 	},
-};
+} as const;
 
 interface AggregateValuesProps {
 	value: AllTraceFilterKeys;
diff --git a/frontend/src/pages/TracesExplorer/__test__/testUtils.ts b/frontend/src/pages/TracesExplorer/__test__/testUtils.ts
index 80d96c9cf3..8a46740e6a 100644
--- a/frontend/src/pages/TracesExplorer/__test__/testUtils.ts
+++ b/frontend/src/pages/TracesExplorer/__test__/testUtils.ts
@@ -244,7 +244,12 @@ export function checkIfSectionIsNotOpen(
 	expect(section.querySelector('.ant-collapse-item-active')).toBeNull();
 }
 
-export const defaultOpenSections = ['hasError', 'durationNano', 'serviceName'];
+export const defaultOpenSections = [
+	'hasError',
+	'durationNano',
+	'serviceName',
+	'deployment.environment',
+];
 
 export const defaultClosedSections = Object.keys(AllTraceFilterKeyValue).filter(
 	(section) =>