chore: rename db migration file

.devenv/docker/signoz-otel-collector/compose.yaml

@@ -4,6 +4,7 @@ services:
     container_name: signoz-otel-collector-dev
     command:
       - --config=/etc/otel-collector-config.yaml
+      - --feature-gates=-pkg.translator.prometheus.NormalizeName
     volumes:
       - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
     environment:

Makefile

@@ -238,4 +238,4 @@ py-clean: ## Clear all pycache and pytest cache from tests directory recursively
 .PHONY: gen-mocks
 gen-mocks:
 	@echo ">> Generating mocks"
-	@mockery --config .mockery.yml
+	@mockery --config .mockery.yml

conf/example.yaml

@@ -300,3 +300,8 @@ user:
       allow_self: true
       # The duration within which a user can reset their password.
       max_token_lifetime: 6h
+  root:
+    # The email of the root user.
+    email: root@example.com
+    # The password of the root user.
+    password: Str0ngP@ssw0rd!

deploy/docker-swarm/docker-compose.ha.yaml

@@ -214,6 +214,7 @@ services:
       - --config=/etc/otel-collector-config.yaml
       - --manager-config=/etc/manager-config.yaml
       - --copy-path=/var/tmp/collector-config.yaml
+      - --feature-gates=-pkg.translator.prometheus.NormalizeName
     volumes:
       - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
       - ../common/signoz/otel-collector-opamp-config.yaml:/etc/manager-config.yaml

deploy/docker-swarm/docker-compose.yaml

@@ -155,6 +155,7 @@ services:
       - --config=/etc/otel-collector-config.yaml
       - --manager-config=/etc/manager-config.yaml
       - --copy-path=/var/tmp/collector-config.yaml
+      - --feature-gates=-pkg.translator.prometheus.NormalizeName
     configs:
       - source: otel-collector-config
         target: /etc/otel-collector-config.yaml

deploy/docker/docker-compose.ha.yaml

@@ -219,6 +219,7 @@ services:
       - --config=/etc/otel-collector-config.yaml
       - --manager-config=/etc/manager-config.yaml
       - --copy-path=/var/tmp/collector-config.yaml
+      - --feature-gates=-pkg.translator.prometheus.NormalizeName
     volumes:
       - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
       - ../common/signoz/otel-collector-opamp-config.yaml:/etc/manager-config.yaml

deploy/docker/docker-compose.yaml

@@ -150,6 +150,7 @@ services:
       - --config=/etc/otel-collector-config.yaml
       - --manager-config=/etc/manager-config.yaml
       - --copy-path=/var/tmp/collector-config.yaml
+      - --feature-gates=-pkg.translator.prometheus.NormalizeName
     volumes:
       - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
       - ../common/signoz/otel-collector-opamp-config.yaml:/etc/manager-config.yaml

ee/query-service/app/api/featureFlags.go

@@ -67,6 +67,14 @@ func (ah *APIHandler) getFeatureFlags(w http.ResponseWriter, r *http.Request) {
 		Route:      "",
 	})
 
+	if constants.IsDotMetricsEnabled {
+		for idx, feature := range featureSet {
+			if feature.Name == licensetypes.DotMetricsEnabled {
+				featureSet[idx].Active = true
+			}
+		}
+	}
+
 	ah.Respond(w, featureSet)
 }
 

ee/query-service/constants/constants.go

@@ -18,3 +18,14 @@ func GetOrDefaultEnv(key string, fallback string) string {
 	return v
 }
 
+// constant functions that override env vars
+
+const DotMetricsEnabled = "DOT_METRICS_ENABLED"
+
+var IsDotMetricsEnabled = false
+
+func init() {
+	if GetOrDefaultEnv(DotMetricsEnabled, "true") == "true" {
+		IsDotMetricsEnabled = true
+	}
+}

frontend/__mocks__/uplotMock.ts

@@ -12,8 +12,6 @@ export interface MockUPlotInstance {
 export interface MockUPlotPaths {
 	spline: jest.Mock;
 	bars: jest.Mock;
-	linear: jest.Mock;
-	stepped: jest.Mock;
 }
 
 // Create mock instance methods
@@ -25,23 +23,10 @@ const createMockUPlotInstance = (): MockUPlotInstance => ({
 	setSeries: jest.fn(),
 });
 
-// Path builder: (self, seriesIdx, idx0, idx1) => paths or null
-const createMockPathBuilder = (name: string): jest.Mock =>
-	jest.fn(() => ({
-		name, // To test if the correct pathBuilder is used
-		stroke: jest.fn(),
-		fill: jest.fn(),
-		clip: jest.fn(),
-	}));
-
-// Create mock paths - linear, spline, stepped needed by UPlotSeriesBuilder.getPathBuilder
-const mockPaths = {
-	spline: jest.fn(() => createMockPathBuilder('spline')),
-	bars: jest.fn(() => createMockPathBuilder('bars')),
-	linear: jest.fn(() => createMockPathBuilder('linear')),
-	stepped: jest.fn((opts?: { align?: number }) =>
-		createMockPathBuilder(`stepped-(${opts?.align ?? 0})`),
-	),
+// Create mock paths
+const mockPaths: MockUPlotPaths = {
+	spline: jest.fn(),
+	bars: jest.fn(),
 };
 
 // Mock static methods

frontend/jest.config.ts

@@ -17,8 +17,6 @@ const config: Config.InitialOptions = {
 		'^hooks/useSafeNavigate$': USE_SAFE_NAVIGATE_MOCK_PATH,
 		'^src/hooks/useSafeNavigate$': USE_SAFE_NAVIGATE_MOCK_PATH,
 		'^.*/useSafeNavigate$': USE_SAFE_NAVIGATE_MOCK_PATH,
-		'^@signozhq/icons$':
-			'<rootDir>/node_modules/@signozhq/icons/dist/index.esm.js',
 	},
 	globals: {
 		extensionsToTreatAsEsm: ['.ts'],

frontend/package.json

@@ -52,7 +52,6 @@
 		"@signozhq/combobox": "0.0.2",
 		"@signozhq/command": "0.0.0",
 		"@signozhq/design-tokens": "2.1.1",
-		"@signozhq/icons": "0.1.0",
 		"@signozhq/input": "0.0.2",
 		"@signozhq/popover": "0.0.0",
 		"@signozhq/resizable": "0.0.0",

frontend/public/locales/en/titles.json

@@ -1,7 +1,6 @@
 {
 	"SIGN_UP": "SigNoz | Sign Up",
 	"LOGIN": "SigNoz | Login",
-	"FORGOT_PASSWORD": "SigNoz | Forgot Password",
 	"HOME": "SigNoz | Home",
 	"SERVICE_METRICS": "SigNoz | Service Metrics",
 	"SERVICE_MAP": "SigNoz | Service Map",

frontend/src/AppRoutes/pageComponents.ts

@@ -194,10 +194,6 @@ export const Login = Loadable(
 	() => import(/* webpackChunkName: "Login" */ 'pages/Login'),
 );
 
-export const ForgotPassword = Loadable(
-	() => import(/* webpackChunkName: "ForgotPassword" */ 'pages/ForgotPassword'),
-);
-
 export const UnAuthorized = Loadable(
 	() => import(/* webpackChunkName: "UnAuthorized" */ 'pages/UnAuthorized'),
 );

frontend/src/AppRoutes/routes.ts

@@ -17,7 +17,6 @@ import {
 	DashboardWidget,
 	EditRulesPage,
 	ErrorDetails,
-	ForgotPassword,
 	Home,
 	InfrastructureMonitoring,
 	InstalledIntegrations,
@@ -340,13 +339,6 @@ const routes: AppRoutes[] = [
 		isPrivate: false,
 		key: 'LOGIN',
 	},
-	{
-		path: ROUTES.FORGOT_PASSWORD,
-		exact: true,
-		component: ForgotPassword,
-		isPrivate: false,
-		key: 'FORGOT_PASSWORD',
-	},
 	{
 		path: ROUTES.UN_AUTHORIZED,
 		exact: true,

frontend/src/api/dashboard/variables/dashboardVariablesQuery.ts

@@ -11,7 +11,6 @@ import {
 
 const dashboardVariablesQuery = async (
 	props: Props,
-	signal?: AbortSignal,
 ): Promise<SuccessResponse<VariableResponseProps> | ErrorResponse> => {
 	try {
 		const { globalTime } = store.getState();
@@ -33,7 +32,7 @@ const dashboardVariablesQuery = async (
 
 		payload.variables = { ...payload.variables, ...timeVariables };
 
-		const response = await axios.post(`/variables/query`, payload, { signal });
+		const response = await axios.post(`/variables/query`, payload);
 
 		return {
 			statusCode: 200,

frontend/src/api/dynamicVariables/getFieldValues.ts

@@ -19,7 +19,6 @@ export const getFieldValues = async (
 	startUnixMilli?: number,
 	endUnixMilli?: number,
 	existingQuery?: string,
-	abortSignal?: AbortSignal,
 ): Promise<SuccessResponseV2<FieldValueResponse>> => {
 	const params: Record<string, string> = {};
 
@@ -48,10 +47,7 @@ export const getFieldValues = async (
 	}
 
 	try {
-		const response = await axios.get('/fields/values', {
-			params,
-			signal: abortSignal,
-		});
+		const response = await axios.get('/fields/values', { params });
 
 		// Normalize values from different types (stringValues, boolValues, etc.)
 		if (response.data?.data?.values) {

frontend/src/api/infraMonitoring/getK8sClustersList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sClustersListPayload {
 	filters: TagFilter;
@@ -64,39 +64,41 @@ export const getK8sClustersList = async (
 	props: K8sClustersListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sClustersListResponse> | ErrorResponse> => {
 	try {
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({
+											...item,
+											key: { ...item.key, key: mappedKey },
+										});
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({
-										...item,
-										key: { ...item.key, key: mappedKey },
-									});
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/clusters/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getK8sDaemonSetsList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sDaemonSetsListPayload {
 	filters: TagFilter;
@@ -71,39 +71,42 @@ export const getK8sDaemonSetsList = async (
 	props: K8sDaemonSetsListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sDaemonSetsListResponse> | ErrorResponse> => {
 	try {
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		// filter prep (unchanged)…
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({
+											...item,
+											key: { ...item.key, key: mappedKey },
+										});
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({
-										...item,
-										key: { ...item.key, key: mappedKey },
-									});
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/daemonsets/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getK8sDeploymentsList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sDeploymentsListPayload {
 	filters: TagFilter;
@@ -71,39 +71,41 @@ export const getK8sDeploymentsList = async (
 	props: K8sDeploymentsListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sDeploymentsListResponse> | ErrorResponse> => {
 	try {
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({
+											...item,
+											key: { ...item.key, key: mappedKey },
+										});
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({
-										...item,
-										key: { ...item.key, key: mappedKey },
-									});
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/deployments/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getK8sJobsList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sJobsListPayload {
 	filters: TagFilter;
@@ -71,39 +71,41 @@ export const getK8sJobsList = async (
 	props: K8sJobsListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sJobsListResponse> | ErrorResponse> => {
 	try {
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({
+											...item,
+											key: { ...item.key, key: mappedKey },
+										});
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({
-										...item,
-										key: { ...item.key, key: mappedKey },
-									});
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/jobs/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getK8sNamespacesList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sNamespacesListPayload {
 	filters: TagFilter;
@@ -62,39 +62,41 @@ export const getK8sNamespacesList = async (
 	props: K8sNamespacesListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sNamespacesListResponse> | ErrorResponse> => {
 	try {
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({
+											...item,
+											key: { ...item.key, key: mappedKey },
+										});
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({
-										...item,
-										key: { ...item.key, key: mappedKey },
-									});
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/namespaces/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getK8sNodesList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sNodesListPayload {
 	filters: TagFilter;
@@ -66,39 +66,41 @@ export const getK8sNodesList = async (
 	props: K8sNodesListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sNodesListResponse> | ErrorResponse> => {
 	try {
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({
+											...item,
+											key: { ...item.key, key: mappedKey },
+										});
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({
-										...item,
-										key: { ...item.key, key: mappedKey },
-									});
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/nodes/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getK8sPodsList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sPodsListPayload {
 	filters: TagFilter;
@@ -102,39 +102,41 @@ export const getK8sPodsList = async (
 	props: K8sPodsListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sPodsListResponse> | ErrorResponse> => {
 	try {
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({
+											...item,
+											key: { ...item.key, key: mappedKey },
+										});
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({
-										...item,
-										key: { ...item.key, key: mappedKey },
-									});
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/pods/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getK8sVolumesList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sVolumesListPayload {
 	filters: TagFilter;
@@ -86,37 +86,39 @@ export const getK8sVolumesList = async (
 	props: K8sVolumesListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sVolumesListResponse> | ErrorResponse> => {
 	try {
 		// Prepare filters
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({ ...item, key: { ...item.key, key: mappedKey } });
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({ ...item, key: { ...item.key, key: mappedKey } });
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/pvcs/list', requestProps, {
 			signal,

frontend/src/api/infraMonitoring/getsK8sStatefulSetsList.ts

@@ -5,7 +5,7 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { AttributeKeyMap } from '../utils';
+import { UnderscoreToDotMap } from '../utils';
 
 export interface K8sStatefulSetsListPayload {
 	filters: TagFilter;
@@ -69,37 +69,39 @@ export const getK8sStatefulSetsList = async (
 	props: K8sStatefulSetsListPayload,
 	signal?: AbortSignal,
 	headers?: Record<string, string>,
+	dotMetricsEnabled = false,
 ): Promise<SuccessResponse<K8sStatefulSetsListResponse> | ErrorResponse> => {
 	try {
 		// Prepare filters
-		const requestProps = Array.isArray(props.filters?.items)
-			? {
-					...props,
-					filters: {
-						...props.filters,
-						items: props.filters.items.reduce<typeof props.filters.items>(
-							(acc, item) => {
-								if (item.value === undefined) {
+		const requestProps =
+			dotMetricsEnabled && Array.isArray(props.filters?.items)
+				? {
+						...props,
+						filters: {
+							...props.filters,
+							items: props.filters.items.reduce<typeof props.filters.items>(
+								(acc, item) => {
+									if (item.value === undefined) {
+										return acc;
+									}
+									if (
+										item.key &&
+										typeof item.key === 'object' &&
+										'key' in item.key &&
+										typeof item.key.key === 'string'
+									) {
+										const mappedKey = UnderscoreToDotMap[item.key.key] ?? item.key.key;
+										acc.push({ ...item, key: { ...item.key, key: mappedKey } });
+									} else {
+										acc.push(item);
+									}
 									return acc;
-								}
-								if (
-									item.key &&
-									typeof item.key === 'object' &&
-									'key' in item.key &&
-									typeof item.key.key === 'string'
-								) {
-									const mappedKey = AttributeKeyMap[item.key.key] ?? item.key.key;
-									acc.push({ ...item, key: { ...item.key, key: mappedKey } });
-								} else {
-									acc.push(item);
-								}
-								return acc;
-							},
-							[] as typeof props.filters.items,
-						),
-					},
-			  }
-			: props;
+								},
+								[] as typeof props.filters.items,
+							),
+						},
+				  }
+				: props;
 
 		const response = await axios.post('/statefulsets/list', requestProps, {
 			signal,

frontend/src/api/utils.ts

@@ -25,7 +25,7 @@ export const Logout = async (): Promise<void> => {
 	history.push(ROUTES.LOGIN);
 };
 
-export const AttributeKeyMap: Record<string, string> = {
+export const UnderscoreToDotMap: Record<string, string> = {
 	k8s_cluster_name: 'k8s.cluster.name',
 	k8s_cluster_uid: 'k8s.cluster.uid',
 	k8s_namespace_name: 'k8s.namespace.name',

frontend/src/auto-import-registry.d.ts

@@ -18,7 +18,6 @@ import '@signozhq/checkbox';
 import '@signozhq/combobox';
 import '@signozhq/command';
 import '@signozhq/design-tokens';
-import '@signozhq/icons';
 import '@signozhq/input';
 import '@signozhq/popover';
 import '@signozhq/resizable';

frontend/src/components/HostMetricsDetail/Metrics/Metrics.tsx

@@ -23,6 +23,9 @@ import { getUPlotChartData } from 'lib/uPlotLib/utils/getUplotChartData';
 import { SuccessResponse } from 'types/api';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
+
 import './Metrics.styles.scss';
 
 interface MetricsTabProps {
@@ -47,6 +50,11 @@ function Metrics({
 	handleTimeChange,
 	isModalTimeSelection,
 }: MetricsTabProps): JSX.Element {
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const {
 		visibilities,
 		setElement,
@@ -61,8 +69,14 @@ function Metrics({
 	});
 
 	const queryPayloads = useMemo(
-		() => getHostQueryPayload(hostName, timeRange.startTime, timeRange.endTime),
-		[hostName, timeRange.startTime, timeRange.endTime],
+		() =>
+			getHostQueryPayload(
+				hostName,
+				timeRange.startTime,
+				timeRange.endTime,
+				dotMetricsEnabled,
+			),
+		[hostName, timeRange.startTime, timeRange.endTime, dotMetricsEnabled],
 	);
 
 	const queries = useQueries(

frontend/src/components/NewSelect/CustomMultiSelect.tsx

@@ -73,7 +73,6 @@ const CustomMultiSelect: React.FC<CustomMultiSelectProps> = ({
 	enableRegexOption = false,
 	isDynamicVariable = false,
 	showRetryButton = true,
-	waitingMessage,
 	...rest
 }) => {
 	// ===== State & Refs =====
@@ -1682,7 +1681,6 @@ const CustomMultiSelect: React.FC<CustomMultiSelectProps> = ({
 					{!loading &&
 						!errorMessage &&
 						!noDataMessage &&
-						!waitingMessage &&
 						!(showIncompleteDataMessage && isScrolledToBottom) && (
 							<section className="navigate">
 								<ArrowDown size={8} className="icons" />
@@ -1700,17 +1698,7 @@ const CustomMultiSelect: React.FC<CustomMultiSelectProps> = ({
 							<div className="navigation-text">Refreshing values...</div>
 						</div>
 					)}
-					{!loading && waitingMessage && (
-						<div className="navigation-loading">
-							<div className="navigation-icons">
-								<LoadingOutlined />
-							</div>
-							<div className="navigation-text" title={waitingMessage}>
-								{waitingMessage}
-							</div>
-						</div>
-					)}
-					{errorMessage && !loading && !waitingMessage && (
+					{errorMessage && !loading && (
 						<div className="navigation-error">
 							<div className="navigation-text">
 								{errorMessage || SOMETHING_WENT_WRONG}
@@ -1732,7 +1720,6 @@ const CustomMultiSelect: React.FC<CustomMultiSelectProps> = ({
 					{showIncompleteDataMessage &&
 						isScrolledToBottom &&
 						!loading &&
-						!waitingMessage &&
 						!errorMessage && (
 							<div className="navigation-text-incomplete">
 								Don&apos;t see the value? Use search
@@ -1775,7 +1762,6 @@ const CustomMultiSelect: React.FC<CustomMultiSelectProps> = ({
 		isDarkMode,
 		isDynamicVariable,
 		showRetryButton,
-		waitingMessage,
 	]);
 
 	// Custom handler for dropdown visibility changes

frontend/src/components/NewSelect/CustomSelect.tsx

@@ -63,7 +63,6 @@ const CustomSelect: React.FC<CustomSelectProps> = ({
 	showIncompleteDataMessage = false,
 	showRetryButton = true,
 	isDynamicVariable = false,
-	waitingMessage,
 	...rest
 }) => {
 	// ===== State & Refs =====
@@ -569,7 +568,6 @@ const CustomSelect: React.FC<CustomSelectProps> = ({
 					{!loading &&
 						!errorMessage &&
 						!noDataMessage &&
-						!waitingMessage &&
 						!(showIncompleteDataMessage && isScrolledToBottom) && (
 							<section className="navigate">
 								<ArrowDown size={8} className="icons" />
@@ -585,16 +583,6 @@ const CustomSelect: React.FC<CustomSelectProps> = ({
 							<div className="navigation-text">Refreshing values...</div>
 						</div>
 					)}
-					{!loading && waitingMessage && (
-						<div className="navigation-loading">
-							<div className="navigation-icons">
-								<LoadingOutlined />
-							</div>
-							<div className="navigation-text" title={waitingMessage}>
-								{waitingMessage}
-							</div>
-						</div>
-					)}
 					{errorMessage && !loading && (
 						<div className="navigation-error">
 							<div className="navigation-text">
@@ -617,7 +605,6 @@ const CustomSelect: React.FC<CustomSelectProps> = ({
 					{showIncompleteDataMessage &&
 						isScrolledToBottom &&
 						!loading &&
-						!waitingMessage &&
 						!errorMessage && (
 							<div className="navigation-text-incomplete">
 								Don&apos;t see the value? Use search
@@ -654,7 +641,6 @@ const CustomSelect: React.FC<CustomSelectProps> = ({
 		showRetryButton,
 		isDarkMode,
 		isDynamicVariable,
-		waitingMessage,
 	]);
 
 	// Handle dropdown visibility changes

frontend/src/components/NewSelect/types.ts

@@ -30,7 +30,6 @@ export interface CustomSelectProps extends Omit<SelectProps, 'options'> {
 	showIncompleteDataMessage?: boolean;
 	showRetryButton?: boolean;
 	isDynamicVariable?: boolean;
-	waitingMessage?: string;
 }
 
 export interface CustomTagProps {
@@ -67,5 +66,4 @@ export interface CustomMultiSelectProps
 	enableRegexOption?: boolean;
 	isDynamicVariable?: boolean;
 	showRetryButton?: boolean;
-	waitingMessage?: string;
 }

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/Checkbox.tsx

@@ -648,13 +648,7 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 											) : (
 												<Typography.Text
 													className="value-string"
-													ellipsis={{
-														tooltip: {
-															placement: 'top',
-															mouseEnterDelay: 0.2,
-															mouseLeaveDelay: 0,
-														},
-													}}
+													ellipsis={{ tooltip: { placement: 'top' } }}
 												>
 													{String(value)}
 												</Typography.Text>

frontend/src/constants/features.ts

@@ -8,4 +8,5 @@ export enum FeatureKeys {
 	PREMIUM_SUPPORT = 'premium_support',
 	ANOMALY_DETECTION = 'anomaly_detection',
 	ONBOARDING_V3 = 'onboarding_v3',
+	DOT_METRICS_ENABLED = 'dot_metrics_enabled',
 }

frontend/src/constants/routes.ts

@@ -1,7 +1,6 @@
 const ROUTES = {
 	SIGN_UP: '/signup',
 	LOGIN: '/login',
-	FORGOT_PASSWORD: '/forgot-password',
 	HOME: '/home',
 	SERVICE_METRICS: '/services/:servicename',
 	SERVICE_TOP_LEVEL_OPERATIONS: '/services/:servicename/top-level-operations',

frontend/src/container/AllError/index.tsx

@@ -41,6 +41,8 @@ import { ErrorResponse, SuccessResponse } from 'types/api';
 import { Exception, PayloadProps } from 'types/api/errors/getAll';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../constants/features';
+import { useAppContext } from '../../providers/App/App';
 import { FilterDropdownExtendsProps } from './types';
 import {
 	extractFilterValues,
@@ -413,6 +415,11 @@ function AllErrors(): JSX.Element {
 		},
 	];
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const onChangeHandler: TableProps<Exception>['onChange'] = useCallback(
 		(
 			paginations: TablePaginationConfig,
@@ -448,7 +455,7 @@ function AllErrors(): JSX.Element {
 	useEffect(() => {
 		if (!isUndefined(errorCountResponse.data?.payload)) {
 			const selectedEnvironments = queries.find(
-				(val) => val.tagKey === getResourceDeploymentKeys(),
+				(val) => val.tagKey === getResourceDeploymentKeys(dotMetricsEnabled),
 			)?.tagValue;
 
 			logEvent('Exception: List page visited', {

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainList.tsx

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useSelector } from 'react-redux';
 import { LoadingOutlined } from '@ant-design/icons';
-import { Spin, Table } from 'antd';
+import { Spin, Table, Typography } from 'antd';
 import logEvent from 'api/common/logEvent';
 import cx from 'classnames';
 import QuerySearch from 'components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch';
@@ -14,13 +14,11 @@ import { useQueryOperations } from 'hooks/queryBuilder/useQueryBuilderOperations
 import { useShareBuilderUrl } from 'hooks/queryBuilder/useShareBuilderUrl';
 import { useListOverview } from 'hooks/thirdPartyApis/useListOverview';
 import { get } from 'lodash-es';
-import { MoveUpRight } from 'lucide-react';
 import { AppState } from 'store/reducers';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { HandleChangeQueryDataV5 } from 'types/common/operations.types';
 import { DataSource } from 'types/common/queryBuilder';
 import { GlobalReducer } from 'types/reducer/globalTime';
-import DOCLINKS from 'utils/docLinks';
 
 import { ApiMonitoringHardcodedAttributeKeys } from '../../constants';
 import { DEFAULT_PARAMS, useApiMonitoringParams } from '../../queryParams';
@@ -127,67 +125,51 @@ function DomainList(): JSX.Element {
 					hardcodedAttributeKeys={ApiMonitoringHardcodedAttributeKeys}
 				/>
 			</div>
-			{!isFetching && !isLoading && formattedDataForTable.length === 0 && (
-				<div className="no-filtered-domains-message-container">
-					<div className="no-filtered-domains-message-content">
-						<img
-							src="/Icons/emptyState.svg"
-							alt="thinking-emoji"
-							className="empty-state-svg"
-						/>
+			<Table
+				className={cx('api-monitoring-domain-list-table')}
+				dataSource={isFetching || isLoading ? [] : formattedDataForTable}
+				columns={columnsConfig}
+				loading={{
+					spinning: isFetching || isLoading,
+					indicator: <Spin indicator={<LoadingOutlined size={14} spin />} />,
+				}}
+				locale={{
+					emptyText:
+						isFetching || isLoading ? null : (
+							<div className="no-filtered-domains-message-container">
+								<div className="no-filtered-domains-message-content">
+									<img
+										src="/Icons/emptyState.svg"
+										alt="thinking-emoji"
+										className="empty-state-svg"
+									/>
 
-						<div className="no-filtered-domains-message">
-							<div className="no-domain-title">
-								No External API calls detected with applied filters.
+									<Typography.Text className="no-filtered-domains-message">
+										This query had no results. Edit your query and try again!
+									</Typography.Text>
+								</div>
 							</div>
-							<div className="no-domain-subtitle">
-								Ensure all HTTP client spans are being sent with kind as{' '}
-								<span className="attribute">Client</span> and url set in{' '}
-								<span className="attribute">url.full</span> or{' '}
-								<span className="attribute">http.url</span> attribute.
-							</div>
-							<a
-								href={DOCLINKS.EXTERNAL_API_MONITORING}
-								target="_blank"
-								rel="noreferrer"
-								className="external-api-doc-link"
-							>
-								Learn how External API monitoring works in SigNoz{' '}
-								<MoveUpRight size={14} />
-							</a>
-						</div>
-					</div>
-				</div>
-			)}
-			{(isFetching || isLoading || formattedDataForTable.length > 0) && (
-				<Table
-					className="api-monitoring-domain-list-table"
-					dataSource={isFetching || isLoading ? [] : formattedDataForTable}
-					columns={columnsConfig}
-					loading={{
-						spinning: isFetching || isLoading,
-						indicator: <Spin indicator={<LoadingOutlined size={14} spin />} />,
-					}}
-					scroll={{ x: true }}
-					tableLayout="fixed"
-					onRow={(record, index): { onClick: () => void; className: string } => ({
-						onClick: (): void => {
-							if (index !== undefined) {
-								const dataIndex = formattedDataForTable.findIndex(
-									(item) => item.key === record.key,
-								);
-								setSelectedDomainIndex(dataIndex);
-								setParams({ selectedDomain: record.domainName });
-								logEvent('API Monitoring: Domain name row clicked', {});
-							}
-						},
-						className: 'expanded-clickable-row',
-					})}
-					rowClassName={(_, index): string =>
-						index % 2 === 0 ? 'table-row-dark' : 'table-row-light'
-					}
-				/>
-			)}
+						),
+				}}
+				scroll={{ x: true }}
+				tableLayout="fixed"
+				onRow={(record, index): { onClick: () => void; className: string } => ({
+					onClick: (): void => {
+						if (index !== undefined) {
+							const dataIndex = formattedDataForTable.findIndex(
+								(item) => item.key === record.key,
+							);
+							setSelectedDomainIndex(dataIndex);
+							setParams({ selectedDomain: record.domainName });
+							logEvent('API Monitoring: Domain name row clicked', {});
+						}
+					},
+					className: 'expanded-clickable-row',
+				})}
+				rowClassName={(_, index): string =>
+					index % 2 === 0 ? 'table-row-dark' : 'table-row-light'
+				}
+			/>
 			{selectedDomainIndex !== -1 && (
 				<DomainDetails
 					domainData={formattedDataForTable[selectedDomainIndex]}

frontend/src/container/ApiMonitoring/Explorer/Explorer.styles.scss

@@ -180,59 +180,10 @@
 
 	.no-filtered-domains-message {
 		margin-top: 8px;
-		display: flex;
-		gap: 8px;
-		flex-direction: column;
-
-		.no-domain-title {
-			color: var(--bg-vanilla-100, #fff);
-			font-family: Inter;
-			font-size: 14px;
-			font-style: normal;
-			font-weight: 500;
-			line-height: 20px; /* 142.857% */
-		}
-
-		.no-domain-subtitle {
-			color: var(--bg-vanilla-400, #c0c1c3);
-			font-family: Inter;
-			font-size: 14px;
-			font-style: normal;
-			font-weight: 400;
-			line-height: 20px; /* 142.857% */
-
-			.attribute {
-				font-family: 'Space Mono';
-			}
-		}
-
-		.external-api-doc-link {
-			display: flex;
-			flex-direction: row;
-			gap: 4px;
-			align-items: center;
-		}
 	}
 }
 
 .lightMode {
-	.no-filtered-domains-message-container {
-		.no-filtered-domains-message-content {
-			.no-filtered-domains-message {
-				.no-domain-title {
-					color: var(--text-ink-500);
-				}
-
-				.no-domain-subtitle {
-					color: var(--text-ink-400);
-
-					.attribute {
-						font-family: 'Space Mono';
-					}
-				}
-			}
-		}
-	}
 	.api-monitoring-domain-list-table {
 		.ant-table {
 			.ant-table-thead > tr > th {

frontend/src/container/DashboardContainer/visualization/charts/BarChart/BarChart.tsx

@@ -1,45 +0,0 @@
-import { useCallback } from 'react';
-import ChartWrapper from 'container/DashboardContainer/visualization/charts/ChartWrapper/ChartWrapper';
-import BarChartTooltip from 'lib/uPlotV2/components/Tooltip/BarChartTooltip';
-import {
-	BarTooltipProps,
-	TooltipRenderArgs,
-} from 'lib/uPlotV2/components/types';
-
-import { useBarChartStacking } from '../../hooks/useBarChartStacking';
-import { BarChartProps } from '../types';
-
-export default function BarChart(props: BarChartProps): JSX.Element {
-	const { children, isStackedBarChart, config, data, ...rest } = props;
-
-	const chartData = useBarChartStacking({
-		data,
-		isStackedBarChart,
-		config,
-	});
-
-	const renderTooltip = useCallback(
-		(props: TooltipRenderArgs): React.ReactNode => {
-			const tooltipProps: BarTooltipProps = {
-				...props,
-				timezone: rest.timezone,
-				yAxisUnit: rest.yAxisUnit,
-				decimalPrecision: rest.decimalPrecision,
-				isStackedBarChart: isStackedBarChart,
-			};
-			return <BarChartTooltip {...tooltipProps} />;
-		},
-		[rest.timezone, rest.yAxisUnit, rest.decimalPrecision, isStackedBarChart],
-	);
-
-	return (
-		<ChartWrapper
-			{...rest}
-			config={config}
-			data={chartData}
-			renderTooltip={renderTooltip}
-		>
-			{children}
-		</ChartWrapper>
-	);
-}

frontend/src/container/DashboardContainer/visualization/charts/utils/stackSeriesUtils.ts

@@ -1,116 +0,0 @@
-import uPlot, { AlignedData } from 'uplot';
-
-/**
- * Stack data cumulatively (top-down: first series = top, last = bottom).
- * When `omit(seriesIndex)` returns true, that series is excluded from stacking.
- */
-export function stackSeries(
-	data: AlignedData,
-	omit: (seriesIndex: number) => boolean,
-): { data: AlignedData; bands: uPlot.Band[] } {
-	const timeAxis = data[0];
-	const pointCount = timeAxis.length;
-	const valueSeriesCount = data.length - 1; // exclude time axis
-
-	const stackedSeries = buildStackedSeries({
-		data,
-		valueSeriesCount,
-		pointCount,
-		omit,
-	});
-	const bands = buildFillBands(valueSeriesCount + 1, omit); // +1 for 1-based series indices
-
-	return {
-		data: [timeAxis, ...stackedSeries] as AlignedData,
-		bands,
-	};
-}
-
-interface BuildStackedSeriesParams {
-	data: AlignedData;
-	valueSeriesCount: number;
-	pointCount: number;
-	omit: (seriesIndex: number) => boolean;
-}
-
-/**
- * Accumulate from last series upward: last series = raw values, first = total.
- * Omitted series are copied as-is (no accumulation).
- */
-function buildStackedSeries({
-	data,
-	valueSeriesCount,
-	pointCount,
-	omit,
-}: BuildStackedSeriesParams): (number | null)[][] {
-	const stackedSeries: (number | null)[][] = Array(valueSeriesCount);
-	const cumulativeSums = Array(pointCount).fill(0) as number[];
-
-	for (let seriesIndex = valueSeriesCount; seriesIndex >= 1; seriesIndex--) {
-		const rawValues = data[seriesIndex] as (number | null)[];
-
-		if (omit(seriesIndex)) {
-			stackedSeries[seriesIndex - 1] = rawValues;
-		} else {
-			stackedSeries[seriesIndex - 1] = rawValues.map((rawValue, pointIndex) => {
-				const numericValue = rawValue == null ? 0 : Number(rawValue);
-				return (cumulativeSums[pointIndex] += numericValue);
-			});
-		}
-	}
-
-	return stackedSeries;
-}
-
-/**
- * Bands define fill between consecutive visible series for stacked appearance.
- * uPlot format: [upperSeriesIdx, lowerSeriesIdx].
- */
-function buildFillBands(
-	seriesLength: number,
-	omit: (seriesIndex: number) => boolean,
-): uPlot.Band[] {
-	const bands: uPlot.Band[] = [];
-
-	for (let seriesIndex = 1; seriesIndex < seriesLength; seriesIndex++) {
-		if (omit(seriesIndex)) {
-			continue;
-		}
-		const nextVisibleSeriesIndex = findNextVisibleSeriesIndex(
-			seriesLength,
-			seriesIndex,
-			omit,
-		);
-		if (nextVisibleSeriesIndex !== -1) {
-			bands.push({ series: [seriesIndex, nextVisibleSeriesIndex] });
-		}
-	}
-
-	return bands;
-}
-
-function findNextVisibleSeriesIndex(
-	seriesLength: number,
-	afterIndex: number,
-	omit: (seriesIndex: number) => boolean,
-): number {
-	for (let i = afterIndex + 1; i < seriesLength; i++) {
-		if (!omit(i)) {
-			return i;
-		}
-	}
-	return -1;
-}
-
-/**
- * Returns band indices for initial stacked state (no series omitted).
- * Top-down: first series at top, band fills between consecutive series.
- * uPlot band format: [upperSeriesIdx, lowerSeriesIdx].
- */
-export function getInitialStackedBands(seriesCount: number): uPlot.Band[] {
-	const bands: uPlot.Band[] = [];
-	for (let seriesIndex = 1; seriesIndex < seriesCount; seriesIndex++) {
-		bands.push({ series: [seriesIndex, seriesIndex + 1] });
-	}
-	return bands;
-}

frontend/src/container/DashboardContainer/visualization/hooks/useBarChartStacking.ts

@@ -1,125 +0,0 @@
-import {
-	MutableRefObject,
-	useCallback,
-	useLayoutEffect,
-	useMemo,
-	useRef,
-} from 'react';
-import { UPlotConfigBuilder } from 'lib/uPlotV2/config/UPlotConfigBuilder';
-import { has } from 'lodash-es';
-import uPlot from 'uplot';
-
-import { stackSeries } from '../charts/utils/stackSeriesUtils';
-
-/** Returns true if the series at the given index is hidden (e.g. via legend toggle). */
-function isSeriesHidden(plot: uPlot, seriesIndex: number): boolean {
-	return !plot.series[seriesIndex]?.show;
-}
-
-function canApplyStacking(
-	unstackedData: uPlot.AlignedData | null,
-	plot: uPlot,
-	isUpdating: boolean,
-): boolean {
-	return (
-		!isUpdating &&
-		!!unstackedData &&
-		!!plot.data &&
-		unstackedData[0]?.length === plot.data[0]?.length
-	);
-}
-
-function setupStackingHooks(
-	config: UPlotConfigBuilder,
-	applyStackingToChart: (plot: uPlot) => void,
-	isUpdatingRef: MutableRefObject<boolean>,
-): () => void {
-	const onDataChange = (plot: uPlot): void => {
-		if (!isUpdatingRef.current) {
-			applyStackingToChart(plot);
-		}
-	};
-
-	const onSeriesVisibilityChange = (
-		plot: uPlot,
-		_seriesIdx: number | null,
-		opts: uPlot.Series,
-	): void => {
-		if (!has(opts, 'focus')) {
-			applyStackingToChart(plot);
-		}
-	};
-
-	const removeSetDataHook = config.addHook('setData', onDataChange);
-	const removeSetSeriesHook = config.addHook(
-		'setSeries',
-		onSeriesVisibilityChange,
-	);
-
-	return (): void => {
-		removeSetDataHook?.();
-		removeSetSeriesHook?.();
-	};
-}
-
-export interface UseBarChartStackingParams {
-	data: uPlot.AlignedData;
-	isStackedBarChart?: boolean;
-	config: UPlotConfigBuilder | null;
-}
-
-/**
- * Handles stacking for bar charts: computes initial stacked data and re-stacks
- * when data or series visibility changes (e.g. legend toggles).
- */
-export function useBarChartStacking({
-	data,
-	isStackedBarChart = false,
-	config,
-}: UseBarChartStackingParams): uPlot.AlignedData {
-	// Store unstacked source data so uPlot hooks can access it (hooks run outside React's render cycle)
-	const unstackedDataRef = useRef<uPlot.AlignedData | null>(null);
-	unstackedDataRef.current = isStackedBarChart ? data : null;
-
-	// Prevents re-entrant calls when we update chart data (avoids infinite loop in setData hook)
-	const isUpdatingChartRef = useRef(false);
-
-	const chartData = useMemo((): uPlot.AlignedData => {
-		if (!isStackedBarChart || !data || data.length < 2) {
-			return data;
-		}
-		const noSeriesHidden = (): boolean => false; // include all series in initial stack
-		const { data: stacked } = stackSeries(data, noSeriesHidden);
-		return stacked;
-	}, [data, isStackedBarChart]);
-
-	const applyStackingToChart = useCallback((plot: uPlot): void => {
-		const unstacked = unstackedDataRef.current;
-		if (
-			!unstacked ||
-			!canApplyStacking(unstacked, plot, isUpdatingChartRef.current)
-		) {
-			return;
-		}
-
-		const shouldExcludeSeries = (idx: number): boolean =>
-			isSeriesHidden(plot, idx);
-		const { data: stacked, bands } = stackSeries(unstacked, shouldExcludeSeries);
-
-		plot.delBand(null);
-		bands.forEach((band: uPlot.Band) => plot.addBand(band));
-
-		isUpdatingChartRef.current = true;
-		plot.setData(stacked);
-		isUpdatingChartRef.current = false;
-	}, []);
-
-	useLayoutEffect(() => {
-		if (!isStackedBarChart || !config) {
-			return undefined;
-		}
-		return setupStackingHooks(config, applyStackingToChart, isUpdatingChartRef);
-	}, [isStackedBarChart, config, applyStackingToChart]);
-
-	return chartData;
-}

frontend/src/container/DashboardContainer/visualization/panels/BarPanel/BarPanel.tsx

@@ -1,160 +0,0 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { PanelWrapperProps } from 'container/PanelWrapper/panelWrapper.types';
-import { useIsDarkMode } from 'hooks/useDarkMode';
-import { useResizeObserver } from 'hooks/useDimensions';
-import { LegendPosition } from 'lib/uPlotV2/components/types';
-import ContextMenu from 'periscope/components/ContextMenu';
-import { useDashboard } from 'providers/Dashboard/Dashboard';
-import { useTimezone } from 'providers/Timezone';
-import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
-import uPlot from 'uplot';
-import { getTimeRange } from 'utils/getTimeRange';
-
-import BarChart from '../../charts/BarChart/BarChart';
-import ChartManager from '../../components/ChartManager/ChartManager';
-import { usePanelContextMenu } from '../../hooks/usePanelContextMenu';
-import { prepareBarPanelConfig, prepareBarPanelData } from './utils';
-
-import '../Panel.styles.scss';
-
-function BarPanel(props: PanelWrapperProps): JSX.Element {
-	const {
-		panelMode,
-		queryResponse,
-		widget,
-		onDragSelect,
-		isFullViewMode,
-		onToggleModelHandler,
-	} = props;
-	const uPlotRef = useRef<uPlot | null>(null);
-	const { toScrollWidgetId, setToScrollWidgetId } = useDashboard();
-	const graphRef = useRef<HTMLDivElement>(null);
-	const [minTimeScale, setMinTimeScale] = useState<number>();
-	const [maxTimeScale, setMaxTimeScale] = useState<number>();
-	const containerDimensions = useResizeObserver(graphRef);
-
-	const isDarkMode = useIsDarkMode();
-	const { timezone } = useTimezone();
-
-	useEffect(() => {
-		if (toScrollWidgetId === widget.id) {
-			graphRef.current?.scrollIntoView({
-				behavior: 'smooth',
-				block: 'center',
-			});
-			graphRef.current?.focus();
-			setToScrollWidgetId('');
-		}
-	}, [toScrollWidgetId, setToScrollWidgetId, widget.id]);
-
-	useEffect((): void => {
-		const { startTime, endTime } = getTimeRange(queryResponse);
-
-		setMinTimeScale(startTime);
-		setMaxTimeScale(endTime);
-	}, [queryResponse]);
-
-	const {
-		coordinates,
-		popoverPosition,
-		onClose,
-		menuItemsConfig,
-		clickHandlerWithContextMenu,
-	} = usePanelContextMenu({
-		widget,
-		queryResponse,
-	});
-
-	const config = useMemo(() => {
-		return prepareBarPanelConfig({
-			widget,
-			isDarkMode,
-			currentQuery: widget.query,
-			onClick: clickHandlerWithContextMenu,
-			onDragSelect,
-			apiResponse: queryResponse?.data?.payload as MetricRangePayloadProps,
-			timezone,
-			panelMode,
-			minTimeScale: minTimeScale,
-			maxTimeScale: maxTimeScale,
-		});
-	}, [
-		widget,
-		isDarkMode,
-		queryResponse?.data?.payload,
-		clickHandlerWithContextMenu,
-		onDragSelect,
-		minTimeScale,
-		maxTimeScale,
-		timezone,
-		panelMode,
-	]);
-
-	const chartData = useMemo(() => {
-		if (!queryResponse?.data?.payload) {
-			return [];
-		}
-		return prepareBarPanelData(queryResponse?.data?.payload);
-	}, [queryResponse?.data?.payload]);
-
-	const layoutChildren = useMemo(() => {
-		if (!isFullViewMode) {
-			return null;
-		}
-		return (
-			<ChartManager
-				config={config}
-				alignedData={chartData}
-				yAxisUnit={widget.yAxisUnit}
-				onCancel={onToggleModelHandler}
-			/>
-		);
-	}, [
-		isFullViewMode,
-		config,
-		chartData,
-		widget.yAxisUnit,
-		onToggleModelHandler,
-	]);
-
-	const onPlotDestroy = useCallback(() => {
-		uPlotRef.current = null;
-	}, []);
-
-	const onPlotRef = useCallback((plot: uPlot | null): void => {
-		uPlotRef.current = plot;
-	}, []);
-
-	return (
-		<div className="panel-container" ref={graphRef}>
-			{containerDimensions.width > 0 && containerDimensions.height > 0 && (
-				<BarChart
-					config={config}
-					legendConfig={{
-						position: widget?.legendPosition ?? LegendPosition.BOTTOM,
-					}}
-					plotRef={onPlotRef}
-					onDestroy={onPlotDestroy}
-					yAxisUnit={widget.yAxisUnit}
-					decimalPrecision={widget.decimalPrecision}
-					timezone={timezone.value}
-					data={chartData as uPlot.AlignedData}
-					width={containerDimensions.width}
-					height={containerDimensions.height}
-					layoutChildren={layoutChildren}
-					isStackedBarChart={widget.stackedBarChart ?? false}
-				>
-					<ContextMenu
-						coordinates={coordinates}
-						popoverPosition={popoverPosition}
-						title={menuItemsConfig.header as string}
-						items={menuItemsConfig.items}
-						onClose={onClose}
-					/>
-				</BarChart>
-			)}
-		</div>
-	);
-}
-
-export default BarPanel;

frontend/src/container/DashboardContainer/visualization/panels/BarPanel/utils.ts

@@ -1,108 +0,0 @@
-import { Timezone } from 'components/CustomTimePicker/timezoneUtils';
-import { PANEL_TYPES } from 'constants/queryBuilder';
-import { getInitialStackedBands } from 'container/DashboardContainer/visualization/charts/utils/stackSeriesUtils';
-import { getLegend } from 'lib/dashboard/getQueryResults';
-import getLabelName from 'lib/getLabelName';
-import { OnClickPluginOpts } from 'lib/uPlotLib/plugins/onClickPlugin';
-import {
-	DrawStyle,
-	LineInterpolation,
-	LineStyle,
-	VisibilityMode,
-} from 'lib/uPlotV2/config/types';
-import { UPlotConfigBuilder } from 'lib/uPlotV2/config/UPlotConfigBuilder';
-import { Widgets } from 'types/api/dashboard/getAll';
-import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
-import { Query } from 'types/api/queryBuilder/queryBuilderData';
-import { QueryData } from 'types/api/widgets/getQuery';
-import { AlignedData } from 'uplot';
-
-import { PanelMode } from '../types';
-import { fillMissingXAxisTimestamps, getXAxisTimestamps } from '../utils';
-import { buildBaseConfig } from '../utils/baseConfigBuilder';
-
-export function prepareBarPanelData(
-	apiResponse: MetricRangePayloadProps,
-): AlignedData {
-	const seriesList = apiResponse?.data?.result || [];
-	const timestampArr = getXAxisTimestamps(seriesList);
-	const yAxisValuesArr = fillMissingXAxisTimestamps(timestampArr, seriesList);
-	return [timestampArr, ...yAxisValuesArr];
-}
-
-export function prepareBarPanelConfig({
-	widget,
-	isDarkMode,
-	currentQuery,
-	onClick,
-	onDragSelect,
-	apiResponse,
-	timezone,
-	panelMode,
-	minTimeScale,
-	maxTimeScale,
-}: {
-	widget: Widgets;
-	isDarkMode: boolean;
-	currentQuery: Query;
-	onClick: OnClickPluginOpts['onClick'];
-	onDragSelect: (startTime: number, endTime: number) => void;
-	apiResponse: MetricRangePayloadProps;
-	timezone: Timezone;
-	panelMode: PanelMode;
-	minTimeScale?: number;
-	maxTimeScale?: number;
-}): UPlotConfigBuilder {
-	const builder = buildBaseConfig({
-		widget,
-		isDarkMode,
-		onClick,
-		onDragSelect,
-		apiResponse,
-		timezone,
-		panelMode,
-		panelType: PANEL_TYPES.BAR,
-		minTimeScale,
-		maxTimeScale,
-	});
-
-	builder.setCursor({
-		focus: {
-			prox: 1e3,
-		},
-	});
-
-	if (widget.stackedBarChart) {
-		const seriesCount = (apiResponse?.data?.result?.length ?? 0) + 1; // +1 for 1-based uPlot series indices
-		builder.setBands(getInitialStackedBands(seriesCount));
-	}
-
-	const seriesList: QueryData[] = apiResponse?.data?.result || [];
-	seriesList.forEach((series) => {
-		const baseLabelName = getLabelName(
-			series.metric,
-			series.queryName || '', // query
-			series.legend || '',
-		);
-
-		const label = currentQuery
-			? getLegend(series, currentQuery, baseLabelName)
-			: baseLabelName;
-
-		builder.addSeries({
-			scaleKey: 'y',
-			drawStyle: DrawStyle.Bar,
-			panelType: PANEL_TYPES.BAR,
-			label: label,
-			colorMapping: widget.customLegendColors ?? {},
-			spanGaps: false,
-			lineStyle: LineStyle.Solid,
-			lineInterpolation: LineInterpolation.Spline,
-			showPoints: VisibilityMode.Never,
-			pointSize: 5,
-			isDarkMode,
-		});
-	});
-
-	return builder;
-}

frontend/src/container/DashboardContainer/visualization/panels/TimeSeriesPanel/utils.ts

@@ -83,7 +83,7 @@ export const prepareUPlotConfig = ({
 			drawStyle: DrawStyle.Line,
 			label: label,
 			colorMapping: widget.customLegendColors ?? {},
-			spanGaps: true,
+			spanGaps: false,
 			lineStyle: LineStyle.Solid,
 			lineInterpolation: LineInterpolation.Spline,
 			showPoints: VisibilityMode.Never,

frontend/src/container/DashboardContainer/visualization/panels/types.ts

@@ -14,11 +14,6 @@ export interface GraphVisibilityState {
 	dataIndex: SeriesVisibilityItem[];
 }
 
-export interface SeriesVisibilityState {
-	labels: string[];
-	visibility: boolean[];
-}
-
 /**
  * Context in which a panel is rendered. Used to vary behavior (e.g. persistence,
  * interactions) per context.

frontend/src/container/DashboardContainer/visualization/panels/utils/__tests__/legendVisibilityUtils.test.ts

@@ -1,271 +0,0 @@
-import { LOCALSTORAGE } from 'constants/localStorage';
-
-import type { GraphVisibilityState } from '../../types';
-import {
-	getStoredSeriesVisibility,
-	updateSeriesVisibilityToLocalStorage,
-} from '../legendVisibilityUtils';
-
-describe('legendVisibilityUtils', () => {
-	const storageKey = LOCALSTORAGE.GRAPH_VISIBILITY_STATES;
-
-	beforeEach(() => {
-		localStorage.clear();
-		jest.spyOn(window.localStorage.__proto__, 'getItem');
-		jest.spyOn(window.localStorage.__proto__, 'setItem');
-	});
-
-	afterEach(() => {
-		jest.restoreAllMocks();
-	});
-
-	describe('getStoredSeriesVisibility', () => {
-		it('returns null when there is no stored visibility state', () => {
-			const result = getStoredSeriesVisibility('widget-1');
-
-			expect(result).toBeNull();
-			expect(localStorage.getItem).toHaveBeenCalledWith(storageKey);
-		});
-
-		it('returns null when widget has no stored dataIndex', () => {
-			const stored: GraphVisibilityState[] = [
-				{
-					name: 'widget-1',
-					dataIndex: [],
-				},
-			];
-
-			localStorage.setItem(storageKey, JSON.stringify(stored));
-
-			const result = getStoredSeriesVisibility('widget-1');
-
-			expect(result).toBeNull();
-		});
-
-		it('returns visibility array by index when widget state exists', () => {
-			const stored: GraphVisibilityState[] = [
-				{
-					name: 'widget-1',
-					dataIndex: [
-						{ label: 'CPU', show: true },
-						{ label: 'Memory', show: false },
-					],
-				},
-				{
-					name: 'widget-2',
-					dataIndex: [{ label: 'Errors', show: true }],
-				},
-			];
-
-			localStorage.setItem(storageKey, JSON.stringify(stored));
-
-			const result = getStoredSeriesVisibility('widget-1');
-
-			expect(result).not.toBeNull();
-			expect(result).toEqual({
-				labels: ['CPU', 'Memory'],
-				visibility: [true, false],
-			});
-		});
-
-		it('returns visibility by index including duplicate labels', () => {
-			const stored: GraphVisibilityState[] = [
-				{
-					name: 'widget-1',
-					dataIndex: [
-						{ label: 'CPU', show: true },
-						{ label: 'CPU', show: false },
-						{ label: 'Memory', show: false },
-					],
-				},
-			];
-
-			localStorage.setItem(storageKey, JSON.stringify(stored));
-
-			const result = getStoredSeriesVisibility('widget-1');
-
-			expect(result).not.toBeNull();
-			expect(result).toEqual({
-				labels: ['CPU', 'CPU', 'Memory'],
-				visibility: [true, false, false],
-			});
-		});
-
-		it('returns null on malformed JSON in localStorage', () => {
-			localStorage.setItem(storageKey, '{invalid-json');
-
-			const result = getStoredSeriesVisibility('widget-1');
-
-			expect(result).toBeNull();
-		});
-
-		it('returns null when widget id is not found', () => {
-			const stored: GraphVisibilityState[] = [
-				{
-					name: 'another-widget',
-					dataIndex: [{ label: 'CPU', show: true }],
-				},
-			];
-
-			localStorage.setItem(storageKey, JSON.stringify(stored));
-
-			const result = getStoredSeriesVisibility('widget-1');
-
-			expect(result).toBeNull();
-		});
-	});
-
-	describe('updateSeriesVisibilityToLocalStorage', () => {
-		it('creates new visibility state when none exists', () => {
-			const seriesVisibility = [
-				{ label: 'CPU', show: true },
-				{ label: 'Memory', show: false },
-			];
-
-			updateSeriesVisibilityToLocalStorage('widget-1', seriesVisibility);
-
-			const stored = getStoredSeriesVisibility('widget-1');
-
-			expect(stored).not.toBeNull();
-			expect(stored).toEqual({
-				labels: ['CPU', 'Memory'],
-				visibility: [true, false],
-			});
-		});
-
-		it('adds a new widget entry when other widgets already exist', () => {
-			const existing: GraphVisibilityState[] = [
-				{
-					name: 'widget-existing',
-					dataIndex: [{ label: 'Errors', show: true }],
-				},
-			];
-			localStorage.setItem(storageKey, JSON.stringify(existing));
-
-			const newVisibility = [{ label: 'CPU', show: false }];
-
-			updateSeriesVisibilityToLocalStorage('widget-new', newVisibility);
-
-			const stored = getStoredSeriesVisibility('widget-new');
-
-			expect(stored).not.toBeNull();
-			expect(stored).toEqual({ labels: ['CPU'], visibility: [false] });
-		});
-
-		it('updates existing widget visibility when entry already exists', () => {
-			const initialVisibility: GraphVisibilityState[] = [
-				{
-					name: 'widget-1',
-					dataIndex: [
-						{ label: 'CPU', show: true },
-						{ label: 'Memory', show: true },
-					],
-				},
-			];
-
-			localStorage.setItem(storageKey, JSON.stringify(initialVisibility));
-
-			const updatedVisibility = [
-				{ label: 'CPU', show: false },
-				{ label: 'Memory', show: true },
-			];
-
-			updateSeriesVisibilityToLocalStorage('widget-1', updatedVisibility);
-
-			const stored = getStoredSeriesVisibility('widget-1');
-
-			expect(stored).not.toBeNull();
-			expect(stored).toEqual({
-				labels: ['CPU', 'Memory'],
-				visibility: [false, true],
-			});
-		});
-
-		it('silently handles malformed existing JSON without throwing', () => {
-			localStorage.setItem(storageKey, '{invalid-json');
-
-			expect(() =>
-				updateSeriesVisibilityToLocalStorage('widget-1', [
-					{ label: 'CPU', show: true },
-				]),
-			).not.toThrow();
-		});
-
-		it('when existing JSON is malformed, overwrites with valid data for the widget', () => {
-			localStorage.setItem(storageKey, '{invalid-json');
-
-			updateSeriesVisibilityToLocalStorage('widget-1', [
-				{ label: 'x-axis', show: true },
-				{ label: 'CPU', show: false },
-			]);
-
-			const stored = getStoredSeriesVisibility('widget-1');
-			expect(stored).not.toBeNull();
-			expect(stored).toEqual({
-				labels: ['x-axis', 'CPU'],
-				visibility: [true, false],
-			});
-			const expected = [
-				{
-					name: 'widget-1',
-					dataIndex: [
-						{ label: 'x-axis', show: true },
-						{ label: 'CPU', show: false },
-					],
-				},
-			];
-			expect(localStorage.setItem).toHaveBeenCalledWith(
-				storageKey,
-				JSON.stringify(expected),
-			);
-		});
-
-		it('preserves other widgets when updating one widget', () => {
-			const existing: GraphVisibilityState[] = [
-				{ name: 'widget-a', dataIndex: [{ label: 'A', show: true }] },
-				{ name: 'widget-b', dataIndex: [{ label: 'B', show: false }] },
-			];
-			localStorage.setItem(storageKey, JSON.stringify(existing));
-
-			updateSeriesVisibilityToLocalStorage('widget-b', [
-				{ label: 'B', show: true },
-			]);
-
-			expect(getStoredSeriesVisibility('widget-a')).toEqual({
-				labels: ['A'],
-				visibility: [true],
-			});
-			expect(getStoredSeriesVisibility('widget-b')).toEqual({
-				labels: ['B'],
-				visibility: [true],
-			});
-		});
-
-		it('calls setItem with storage key and stringified visibility states', () => {
-			updateSeriesVisibilityToLocalStorage('widget-1', [
-				{ label: 'CPU', show: true },
-			]);
-
-			expect(localStorage.setItem).toHaveBeenCalledTimes(1);
-			expect(localStorage.setItem).toHaveBeenCalledWith(
-				storageKey,
-				expect.any(String),
-			);
-			const [_, value] = (localStorage.setItem as jest.Mock).mock.calls[0];
-			expect((): void => JSON.parse(value)).not.toThrow();
-			expect(JSON.parse(value)).toEqual([
-				{ name: 'widget-1', dataIndex: [{ label: 'CPU', show: true }] },
-			]);
-		});
-
-		it('stores empty dataIndex when seriesVisibility is empty', () => {
-			updateSeriesVisibilityToLocalStorage('widget-1', []);
-
-			const raw = localStorage.getItem(storageKey);
-			expect(raw).not.toBeNull();
-			const parsed = JSON.parse(raw ?? '[]');
-			expect(parsed).toEqual([{ name: 'widget-1', dataIndex: [] }]);
-			expect(getStoredSeriesVisibility('widget-1')).toBeNull();
-		});
-	});
-});

frontend/src/container/DashboardContainer/visualization/panels/utils/baseConfigBuilder.ts

@@ -88,7 +88,7 @@ export function buildBaseConfig({
 		max: undefined,
 		softMin: widget.softMin ?? undefined,
 		softMax: widget.softMax ?? undefined,
-		thresholds: thresholdOptions,
+		// thresholds,
 		logBase: widget.isLogScale ? 10 : undefined,
 		distribution: widget.isLogScale
 			? DistributionType.Logarithmic

frontend/src/container/DashboardContainer/visualization/panels/utils/legendVisibilityUtils.ts

@@ -1,20 +1,15 @@
 import { LOCALSTORAGE } from 'constants/localStorage';
 
-import {
-	GraphVisibilityState,
-	SeriesVisibilityItem,
-	SeriesVisibilityState,
-} from '../types';
+import { GraphVisibilityState, SeriesVisibilityItem } from '../types';
 
 /**
- * Retrieves the stored series visibility for a specific widget from localStorage by index.
- * Index 0 is the x-axis (time); indices 1, 2, ... are data series (same order as uPlot plot.series).
+ * Retrieves the visibility map for a specific widget from localStorage
  * @param widgetId - The unique identifier of the widget
- * @returns visibility[i] = show state for series at index i, or null if not found
+ * @returns A Map of series labels to their visibility state, or null if not found
  */
 export function getStoredSeriesVisibility(
 	widgetId: string,
-): SeriesVisibilityState | null {
+): Map<string, boolean> | null {
 	try {
 		const storedData = localStorage.getItem(LOCALSTORAGE.GRAPH_VISIBILITY_STATES);
 
@@ -29,15 +24,8 @@ export function getStoredSeriesVisibility(
 			return null;
 		}
 
-		return {
-			labels: widgetState.dataIndex.map((item) => item.label),
-			visibility: widgetState.dataIndex.map((item) => item.show),
-		};
-	} catch (error) {
-		if (error instanceof SyntaxError) {
-			// If the stored data is malformed, remove it
-			localStorage.removeItem(LOCALSTORAGE.GRAPH_VISIBILITY_STATES);
-		}
+		return new Map(widgetState.dataIndex.map((item) => [item.label, item.show]));
+	} catch {
 		// Silently handle parsing errors - fall back to default visibility
 		return null;
 	}
@@ -47,31 +35,40 @@ export function updateSeriesVisibilityToLocalStorage(
 	widgetId: string,
 	seriesVisibility: SeriesVisibilityItem[],
 ): void {
-	let visibilityStates: GraphVisibilityState[] = [];
 	try {
 		const storedData = localStorage.getItem(LOCALSTORAGE.GRAPH_VISIBILITY_STATES);
-		visibilityStates = JSON.parse(storedData || '[]');
-	} catch (error) {
-		if (error instanceof SyntaxError) {
-			visibilityStates = [];
+
+		let visibilityStates: GraphVisibilityState[];
+
+		if (!storedData) {
+			visibilityStates = [
+				{
+					name: widgetId,
+					dataIndex: seriesVisibility,
+				},
+			];
+		} else {
+			visibilityStates = JSON.parse(storedData);
 		}
-	}
-	const widgetState = visibilityStates.find((state) => state.name === widgetId);
+		const widgetState = visibilityStates.find((state) => state.name === widgetId);
 
-	if (widgetState) {
-		widgetState.dataIndex = seriesVisibility;
-	} else {
-		visibilityStates = [
-			...visibilityStates,
-			{
-				name: widgetId,
-				dataIndex: seriesVisibility,
-			},
-		];
-	}
+		if (!widgetState) {
+			visibilityStates = [
+				...visibilityStates,
+				{
+					name: widgetId,
+					dataIndex: seriesVisibility,
+				},
+			];
+		} else {
+			widgetState.dataIndex = seriesVisibility;
+		}
 
-	localStorage.setItem(
-		LOCALSTORAGE.GRAPH_VISIBILITY_STATES,
-		JSON.stringify(visibilityStates),
-	);
+		localStorage.setItem(
+			LOCALSTORAGE.GRAPH_VISIBILITY_STATES,
+			JSON.stringify(visibilityStates),
+		);
+	} catch {
+		// Silently handle parsing errors - fall back to default visibility
+	}
 }

frontend/src/container/ForgotPassword/ForgotPassword.styles.scss

@@ -1,93 +0,0 @@
-.forgot-password-title {
-	font-family: var(--label-large-600-font-family);
-	font-size: var(--label-large-600-font-size);
-	font-weight: var(--label-large-600-font-weight);
-	letter-spacing: var(--label-large-600-letter-spacing);
-	line-height: 1.45;
-	color: var(--l1-foreground);
-	margin: 0;
-}
-
-.forgot-password-description {
-	font-family: var(--paragraph-base-400-font-family);
-	font-size: var(--paragraph-base-400-font-size);
-	font-weight: var(--paragraph-base-400-font-weight);
-	line-height: var(--paragraph-base-400-line-height);
-	letter-spacing: -0.065px;
-	color: var(--l2-foreground);
-	margin: 0;
-	text-align: center;
-	max-width: 317px;
-}
-
-.forgot-password-form {
-	width: 100%;
-
-	// Label styling
-	.forgot-password-label {
-		font-family: Inter, sans-serif;
-		font-size: 13px;
-		font-weight: 600;
-		line-height: 1;
-		letter-spacing: -0.065px;
-		color: var(--l1-foreground);
-		margin-bottom: 12px;
-		display: block;
-
-		.lightMode & {
-			color: var(--text-ink-500);
-		}
-	}
-
-	// Parent container for fields
-	.forgot-password-field {
-		width: 100%;
-		display: flex;
-		flex-direction: column;
-	}
-
-	&.ant-form {
-		display: flex;
-		flex-direction: column;
-		align-items: flex-start;
-
-		.ant-form-item {
-			margin-bottom: 0px;
-			width: 100%;
-		}
-	}
-}
-
-.forgot-password-actions {
-	display: flex;
-	gap: 12px;
-	width: 100%;
-
-	> .forgot-password-back-button,
-	> .login-submit-btn {
-		flex: 1 1 0%;
-	}
-}
-
-.forgot-password-back-button {
-	height: 32px;
-	padding: 10px 16px;
-	border-radius: 2px;
-	font-family: Inter, sans-serif;
-	font-size: 11px;
-	font-weight: 500;
-	line-height: 1;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	gap: 8px;
-	background: var(--l3-background);
-	border: 1px solid var(--l3-border);
-	color: var(--l1-foreground);
-
-	&:hover:not(:disabled) {
-		background: var(--l3-border);
-		border-color: var(--l3-border);
-		opacity: 0.9;
-	}
-}

frontend/src/container/ForgotPassword/SuccessScreen.tsx

@@ -1,41 +0,0 @@
-import { Button } from '@signozhq/button';
-import { ArrowLeft, Mail } from '@signozhq/icons';
-
-interface SuccessScreenProps {
-	onBackToLogin: () => void;
-}
-
-function SuccessScreen({ onBackToLogin }: SuccessScreenProps): JSX.Element {
-	return (
-		<div className="login-form-container">
-			<div className="forgot-password-form">
-				<div className="login-form-header">
-					<div className="login-form-emoji">
-						<Mail size={32} />
-					</div>
-					<h4 className="forgot-password-title">Check your email</h4>
-					<p className="forgot-password-description">
-						We&apos;ve sent a password reset link to your email. Please check your
-						inbox and follow the instructions to reset your password.
-					</p>
-				</div>
-
-				<div className="login-form-actions forgot-password-actions">
-					<Button
-						variant="solid"
-						color="primary"
-						type="button"
-						data-testid="back-to-login"
-						className="login-submit-btn"
-						onClick={onBackToLogin}
-						prefixIcon={<ArrowLeft size={12} />}
-					>
-						Back to login
-					</Button>
-				</div>
-			</div>
-		</div>
-	);
-}
-
-export default SuccessScreen;

frontend/src/container/ForgotPassword/__tests__/ForgotPassword.test.tsx

@@ -1,402 +0,0 @@
-import ROUTES from 'constants/routes';
-import history from 'lib/history';
-import {
-	createErrorResponse,
-	handleInternalServerError,
-	rest,
-	server,
-} from 'mocks-server/server';
-import { render, screen, userEvent, waitFor } from 'tests/test-utils';
-import { OrgSessionContext } from 'types/api/v2/sessions/context/get';
-
-import ForgotPassword, { ForgotPasswordRouteState } from '../index';
-
-// Mock dependencies
-jest.mock('lib/history', () => ({
-	__esModule: true,
-	default: {
-		push: jest.fn(),
-		location: {
-			search: '',
-		},
-	},
-}));
-
-const mockHistoryPush = history.push as jest.MockedFunction<
-	typeof history.push
->;
-
-const FORGOT_PASSWORD_ENDPOINT = '*/api/v2/factor_password/forgot';
-
-// Mock data
-const mockSingleOrg: OrgSessionContext[] = [
-	{
-		id: 'org-1',
-		name: 'Test Organization',
-		authNSupport: {
-			password: [{ provider: 'email_password' }],
-			callback: [],
-		},
-	},
-];
-
-const mockMultipleOrgs: OrgSessionContext[] = [
-	{
-		id: 'org-1',
-		name: 'Organization One',
-		authNSupport: {
-			password: [{ provider: 'email_password' }],
-			callback: [],
-		},
-	},
-	{
-		id: 'org-2',
-		name: 'Organization Two',
-		authNSupport: {
-			password: [{ provider: 'email_password' }],
-			callback: [],
-		},
-	},
-];
-
-const TEST_EMAIL = 'jest.test@signoz.io';
-
-const defaultProps: ForgotPasswordRouteState = {
-	email: TEST_EMAIL,
-	orgs: mockSingleOrg,
-};
-
-const multiOrgProps: ForgotPasswordRouteState = {
-	email: TEST_EMAIL,
-	orgs: mockMultipleOrgs,
-};
-
-describe('ForgotPassword Component', () => {
-	beforeEach(() => {
-		jest.clearAllMocks();
-	});
-
-	afterEach(() => {
-		server.resetHandlers();
-	});
-
-	describe('Initial Render', () => {
-		it('renders forgot password form with all required elements', () => {
-			render(<ForgotPassword {...defaultProps} />);
-
-			expect(screen.getByText(/forgot your password\?/i)).toBeInTheDocument();
-			expect(
-				screen.getByText(/send a reset link to your inbox/i),
-			).toBeInTheDocument();
-			expect(screen.getByTestId('email')).toBeInTheDocument();
-			expect(screen.getByTestId('forgot-password-submit')).toBeInTheDocument();
-			expect(screen.getByTestId('forgot-password-back')).toBeInTheDocument();
-		});
-
-		it('pre-fills email from props', () => {
-			render(<ForgotPassword {...defaultProps} />);
-
-			const emailInput = screen.getByTestId('email');
-			expect(emailInput).toHaveValue(TEST_EMAIL);
-		});
-
-		it('disables email input field', () => {
-			render(<ForgotPassword {...defaultProps} />);
-
-			const emailInput = screen.getByTestId('email');
-			expect(emailInput).toBeDisabled();
-		});
-
-		it('does not show organization dropdown for single org', () => {
-			render(<ForgotPassword {...defaultProps} />);
-
-			expect(screen.queryByTestId('orgId')).not.toBeInTheDocument();
-			expect(screen.queryByText('Organization Name')).not.toBeInTheDocument();
-		});
-
-		it('enables submit button when email is provided with single org', () => {
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			expect(submitButton).not.toBeDisabled();
-		});
-	});
-
-	describe('Multiple Organizations', () => {
-		it('shows organization dropdown when multiple orgs exist', () => {
-			render(<ForgotPassword {...multiOrgProps} />);
-
-			expect(screen.getByTestId('orgId')).toBeInTheDocument();
-			expect(screen.getByText('Organization Name')).toBeInTheDocument();
-		});
-
-		it('disables submit button when org is not selected', () => {
-			const propsWithoutOrgId: ForgotPasswordRouteState = {
-				email: TEST_EMAIL,
-				orgs: mockMultipleOrgs,
-			};
-
-			render(<ForgotPassword {...propsWithoutOrgId} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			expect(submitButton).toBeDisabled();
-		});
-
-		it('enables submit button after selecting an organization', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			render(<ForgotPassword {...multiOrgProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			expect(submitButton).toBeDisabled();
-
-			// Click on the dropdown to reveal the options
-			await user.click(screen.getByRole('combobox'));
-			await user.click(screen.getByText('Organization One'));
-
-			await waitFor(() => {
-				expect(submitButton).not.toBeDisabled();
-			});
-		});
-
-		it('pre-selects organization when orgId is provided', () => {
-			const propsWithOrgId: ForgotPasswordRouteState = {
-				email: TEST_EMAIL,
-				orgId: 'org-1',
-				orgs: mockMultipleOrgs,
-			};
-
-			render(<ForgotPassword {...propsWithOrgId} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			expect(submitButton).not.toBeDisabled();
-		});
-	});
-
-	describe('Form Submission - Success', () => {
-		it('successfully submits forgot password request and shows success screen', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			server.use(
-				rest.post(FORGOT_PASSWORD_ENDPOINT, (_req, res, ctx) =>
-					res(ctx.status(200), ctx.json({ status: 'success' })),
-				),
-			);
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			expect(await screen.findByText(/check your email/i)).toBeInTheDocument();
-			expect(
-				screen.getByText(/we've sent a password reset link/i),
-			).toBeInTheDocument();
-		});
-
-		it('shows back to login button on success screen', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			server.use(
-				rest.post(FORGOT_PASSWORD_ENDPOINT, (_req, res, ctx) =>
-					res(ctx.status(200), ctx.json({ status: 'success' })),
-				),
-			);
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			expect(await screen.findByTestId('back-to-login')).toBeInTheDocument();
-		});
-
-		it('redirects to login when clicking back to login on success screen', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			server.use(
-				rest.post(FORGOT_PASSWORD_ENDPOINT, (_req, res, ctx) =>
-					res(ctx.status(200), ctx.json({ status: 'success' })),
-				),
-			);
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			expect(await screen.findByTestId('back-to-login')).toBeInTheDocument();
-
-			const backToLoginButton = screen.getByTestId('back-to-login');
-			await user.click(backToLoginButton);
-
-			expect(mockHistoryPush).toHaveBeenCalledWith(ROUTES.LOGIN);
-		});
-	});
-
-	describe('Form Submission - Error Handling', () => {
-		it('displays error message when forgot password API fails', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			server.use(
-				rest.post(
-					FORGOT_PASSWORD_ENDPOINT,
-					createErrorResponse(400, 'USER_NOT_FOUND', 'User not found'),
-				),
-			);
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			expect(await screen.findByText(/user not found/i)).toBeInTheDocument();
-		});
-
-		it('displays error message when API returns server error', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			server.use(rest.post(FORGOT_PASSWORD_ENDPOINT, handleInternalServerError));
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			expect(
-				await screen.findByText(/internal server error occurred/i),
-			).toBeInTheDocument();
-		});
-
-		it('clears error message on new submission attempt', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-			let requestCount = 0;
-
-			server.use(
-				rest.post(FORGOT_PASSWORD_ENDPOINT, (_req, res, ctx) => {
-					requestCount += 1;
-					if (requestCount === 1) {
-						return res(
-							ctx.status(400),
-							ctx.json({
-								error: {
-									code: 'USER_NOT_FOUND',
-									message: 'User not found',
-								},
-							}),
-						);
-					}
-					return res(ctx.status(200), ctx.json({ status: 'success' }));
-				}),
-			);
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			expect(await screen.findByText(/user not found/i)).toBeInTheDocument();
-
-			// Click submit again
-			await user.click(submitButton);
-
-			await waitFor(() => {
-				expect(screen.queryByText(/user not found/i)).not.toBeInTheDocument();
-			});
-			expect(await screen.findByText(/check your email/i)).toBeInTheDocument();
-		});
-	});
-
-	describe('Navigation', () => {
-		it('redirects to login when clicking back button on form', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const backButton = screen.getByTestId('forgot-password-back');
-			await user.click(backButton);
-
-			expect(mockHistoryPush).toHaveBeenCalledWith(ROUTES.LOGIN);
-		});
-	});
-
-	describe('Loading States', () => {
-		it('shows loading state during API call', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			server.use(
-				rest.post(FORGOT_PASSWORD_ENDPOINT, (_req, res, ctx) =>
-					res(ctx.delay(100), ctx.status(200), ctx.json({ status: 'success' })),
-				),
-			);
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			// Button should show loading state
-			expect(await screen.findByText(/sending\.\.\./i)).toBeInTheDocument();
-		});
-
-		it('disables submit button during loading', async () => {
-			const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-			server.use(
-				rest.post(FORGOT_PASSWORD_ENDPOINT, (_req, res, ctx) =>
-					res(ctx.delay(100), ctx.status(200), ctx.json({ status: 'success' })),
-				),
-			);
-
-			render(<ForgotPassword {...defaultProps} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			await user.click(submitButton);
-
-			await waitFor(() => {
-				expect(submitButton).toBeDisabled();
-			});
-		});
-	});
-
-	describe('Edge Cases', () => {
-		it('handles empty email gracefully', () => {
-			const propsWithEmptyEmail: ForgotPasswordRouteState = {
-				email: '',
-				orgs: mockSingleOrg,
-			};
-
-			render(<ForgotPassword {...propsWithEmptyEmail} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			expect(submitButton).toBeDisabled();
-		});
-
-		it('handles whitespace-only email', () => {
-			const propsWithWhitespaceEmail: ForgotPasswordRouteState = {
-				email: '   ',
-				orgs: mockSingleOrg,
-			};
-
-			render(<ForgotPassword {...propsWithWhitespaceEmail} />);
-
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			expect(submitButton).toBeDisabled();
-		});
-
-		it('handles empty orgs array by disabling submission', () => {
-			const propsWithNoOrgs: ForgotPasswordRouteState = {
-				email: TEST_EMAIL,
-				orgs: [],
-			};
-
-			render(<ForgotPassword {...propsWithNoOrgs} />);
-
-			// Should not show org dropdown
-			expect(screen.queryByTestId('orgId')).not.toBeInTheDocument();
-			// Submit should be disabled because no orgId can be determined
-			const submitButton = screen.getByTestId('forgot-password-submit');
-			expect(submitButton).toBeDisabled();
-		});
-	});
-});

frontend/src/container/ForgotPassword/index.tsx

@@ -1,217 +0,0 @@
-import { useCallback, useEffect, useMemo } from 'react';
-import { Button } from '@signozhq/button';
-import { ArrowLeft, ArrowRight } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
-import { Form, Select } from 'antd';
-import { ErrorResponseHandlerV2 } from 'api/ErrorResponseHandlerV2';
-import { useForgotPassword } from 'api/generated/services/users';
-import { AxiosError } from 'axios';
-import AuthError from 'components/AuthError/AuthError';
-import ROUTES from 'constants/routes';
-import history from 'lib/history';
-import { ErrorV2Resp } from 'types/api';
-import APIError from 'types/api/error';
-import { OrgSessionContext } from 'types/api/v2/sessions/context/get';
-
-import SuccessScreen from './SuccessScreen';
-
-import './ForgotPassword.styles.scss';
-import 'container/Login/Login.styles.scss';
-
-type FormValues = {
-	email: string;
-	orgId: string;
-};
-
-export type ForgotPasswordRouteState = {
-	email: string;
-	orgId?: string;
-	orgs: OrgSessionContext[];
-};
-
-function ForgotPassword({
-	email,
-	orgId,
-	orgs,
-}: ForgotPasswordRouteState): JSX.Element {
-	const [form] = Form.useForm<FormValues>();
-	const {
-		mutate: forgotPasswordMutate,
-		isLoading,
-		isSuccess,
-		error: mutationError,
-	} = useForgotPassword();
-
-	const errorMessage = useMemo(() => {
-		if (!mutationError) {
-			return undefined;
-		}
-
-		try {
-			ErrorResponseHandlerV2(mutationError as AxiosError<ErrorV2Resp>);
-		} catch (apiError) {
-			return apiError as APIError;
-		}
-	}, [mutationError]);
-
-	const initialOrgId = useMemo((): string | undefined => {
-		if (orgId) {
-			return orgId;
-		}
-
-		if (orgs.length === 1) {
-			return orgs[0]?.id;
-		}
-
-		return undefined;
-	}, [orgId, orgs]);
-
-	const watchedEmail = Form.useWatch('email', form);
-	const selectedOrgId = Form.useWatch('orgId', form);
-
-	useEffect(() => {
-		form.setFieldsValue({
-			email,
-			orgId: initialOrgId,
-		});
-	}, [email, form, initialOrgId]);
-
-	const hasMultipleOrgs = orgs.length > 1;
-
-	const isSubmitEnabled = useMemo((): boolean => {
-		if (isLoading) {
-			return false;
-		}
-
-		if (!watchedEmail?.trim()) {
-			return false;
-		}
-
-		// Ensure we have an orgId (either selected from dropdown or the initial one)
-		const currentOrgId = hasMultipleOrgs ? selectedOrgId : initialOrgId;
-		return Boolean(currentOrgId);
-	}, [watchedEmail, selectedOrgId, isLoading, initialOrgId, hasMultipleOrgs]);
-
-	const handleSubmit = useCallback((): void => {
-		const values = form.getFieldsValue();
-		const currentOrgId = hasMultipleOrgs ? values.orgId : initialOrgId;
-
-		if (!currentOrgId) {
-			return;
-		}
-
-		// Call the forgot password API
-		forgotPasswordMutate({
-			data: {
-				email: values.email,
-				orgId: currentOrgId,
-				frontendBaseURL: window.location.origin,
-			},
-		});
-	}, [form, forgotPasswordMutate, initialOrgId, hasMultipleOrgs]);
-
-	const handleBackToLogin = useCallback((): void => {
-		history.push(ROUTES.LOGIN);
-	}, []);
-
-	// Success screen
-	if (isSuccess) {
-		return <SuccessScreen onBackToLogin={handleBackToLogin} />;
-	}
-
-	// Form screen
-	return (
-		<div className="login-form-container">
-			<Form
-				form={form}
-				onFinish={handleSubmit}
-				className="forgot-password-form"
-				initialValues={{
-					email,
-					orgId: initialOrgId,
-				}}
-			>
-				<div className="login-form-header">
-					<div className="login-form-emoji">
-						<img src="/svgs/tv.svg" alt="TV" width="32" height="32" />
-					</div>
-					<h4 className="forgot-password-title">Forgot your password?</h4>
-					<p className="forgot-password-description">
-						Send a reset link to your inbox and get back to monitoring.
-					</p>
-				</div>
-
-				<div className="login-form-card">
-					<div className="forgot-password-field">
-						<label className="forgot-password-label" htmlFor="forgotPasswordEmail">
-							Email address
-						</label>
-						<Form.Item name="email">
-							<Input
-								type="email"
-								id="forgotPasswordEmail"
-								data-testid="email"
-								required
-								disabled
-								className="login-form-input"
-							/>
-						</Form.Item>
-					</div>
-
-					{hasMultipleOrgs && (
-						<div className="forgot-password-field">
-							<label className="forgot-password-label" htmlFor="orgId">
-								Organization Name
-							</label>
-							<Form.Item
-								name="orgId"
-								rules={[{ required: true, message: 'Please select your organization' }]}
-							>
-								<Select
-									id="orgId"
-									data-testid="orgId"
-									className="login-form-input login-form-select-no-border"
-									placeholder="Select your organization"
-									options={orgs.map((org) => ({
-										value: org.id,
-										label: org.name || 'default',
-									}))}
-								/>
-							</Form.Item>
-						</div>
-					)}
-				</div>
-
-				{errorMessage && <AuthError error={errorMessage} />}
-
-				<div className="login-form-actions forgot-password-actions">
-					<Button
-						variant="solid"
-						type="button"
-						data-testid="forgot-password-back"
-						className="forgot-password-back-button"
-						onClick={handleBackToLogin}
-						prefixIcon={<ArrowLeft size={12} />}
-					>
-						Back to login
-					</Button>
-
-					<Button
-						disabled={!isSubmitEnabled}
-						loading={isLoading}
-						variant="solid"
-						color="primary"
-						type="submit"
-						data-testid="forgot-password-submit"
-						className="login-submit-btn"
-						suffixIcon={<ArrowRight size={12} />}
-					>
-						{isLoading ? 'Sending...' : 'Send reset link'}
-					</Button>
-				</div>
-			</Form>
-		</div>
-	);
-}
-
-export default ForgotPassword;

frontend/src/container/Home/Services/ServiceMetrics.tsx

@@ -30,6 +30,7 @@ import { GlobalReducer } from 'types/reducer/globalTime';
 import { Tags } from 'types/reducer/trace';
 import { USER_ROLES } from 'types/roles';
 
+import { FeatureKeys } from '../../../constants/features';
 import { DOCS_LINKS } from '../constants';
 import { columns, TIME_PICKER_OPTIONS } from './constants';
 
@@ -210,13 +211,19 @@ function ServiceMetrics({
 
 	const topLevelOperations = useMemo(() => Object.entries(data || {}), [data]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const queryRangeRequestData = useMemo(
 		() =>
 			getQueryRangeRequestData({
 				topLevelOperations,
 				globalSelectedInterval,
+				dotMetricsEnabled,
 			}),
-		[globalSelectedInterval, topLevelOperations],
+		[globalSelectedInterval, topLevelOperations, dotMetricsEnabled],
 	);
 
 	const dataQueries = useGetQueriesRange(

frontend/src/container/InfraMonitoringHosts/HostsList.tsx

@@ -23,6 +23,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery, Query } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../constants/features';
+import { useAppContext } from '../../providers/App/App';
 import HostsListControls from './HostsListControls';
 import HostsListTable from './HostsListTable';
 import { getHostListsQuery, GetHostsQuickFiltersConfig } from './utils';
@@ -144,6 +146,11 @@ function HostsList(): JSX.Element {
 		entityVersion: '',
 	});
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const handleFiltersChange = useCallback(
 		(value: IBuilderQuery['filters']): void => {
 			const isNewFilterAdded = value?.items?.length !== filters?.items?.length;
@@ -214,7 +221,7 @@ function HostsList(): JSX.Element {
 						</div>
 						<QuickFilters
 							source={QuickFiltersSource.INFRA_MONITORING}
-							config={GetHostsQuickFiltersConfig()}
+							config={GetHostsQuickFiltersConfig(dotMetricsEnabled)}
 							handleFilterVisibilityChange={handleFilterVisibilityChange}
 							onFilterChange={handleQuickFiltersChange}
 						/>

frontend/src/container/InfraMonitoringHosts/__tests__/utilts.test.tsx

@@ -71,12 +71,20 @@ describe('InfraMonitoringHosts utils', () => {
 	});
 
 	describe('GetHostsQuickFiltersConfig', () => {
-		it('should return correct config with dot-notation keys', () => {
-			const result = GetHostsQuickFiltersConfig();
+		it('should return correct config when dotMetricsEnabled is true', () => {
+			const result = GetHostsQuickFiltersConfig(true);
 
 			expect(result[0].attributeKey.key).toBe('host.name');
 			expect(result[1].attributeKey.key).toBe('os.type');
 			expect(result[0].aggregateAttribute).toBe('system.cpu.load_average.15m');
 		});
+
+		it('should return correct config when dotMetricsEnabled is false', () => {
+			const result = GetHostsQuickFiltersConfig(false);
+
+			expect(result[0].attributeKey.key).toBe('host_name');
+			expect(result[1].attributeKey.key).toBe('os_type');
+			expect(result[0].aggregateAttribute).toBe('system_cpu_load_average_15m');
+		});
 	});
 });

frontend/src/container/InfraMonitoringHosts/utils.tsx

@@ -211,18 +211,32 @@ export const HostsQuickFiltersConfig: IQuickFiltersConfig[] = [
 	},
 ];
 
-export function GetHostsQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetHostsQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	// These keys don’t change with dotMetricsEnabled
+	const hostNameKey = dotMetricsEnabled ? 'host.name' : 'host_name';
+	const osTypeKey = dotMetricsEnabled ? 'os.type' : 'os_type';
+	// This metric stays the same regardless of notation
+	const metricName = dotMetricsEnabled
+		? 'system.cpu.load_average.15m'
+		: 'system_cpu_load_average_15m';
+
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Host Name',
 			attributeKey: {
-				key: 'host.name',
+				key: hostNameKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'system.cpu.load_average.15m',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -230,12 +244,12 @@ export function GetHostsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'OS Type',
 			attributeKey: {
-				key: 'os.type',
+				key: osTypeKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'system.cpu.load_average.15m',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -243,7 +257,7 @@ export function GetHostsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},

frontend/src/container/InfraMonitoringK8s/Clusters/ClusterDetails/constants.ts

@@ -46,34 +46,95 @@ export const getClusterMetricsQueryPayload = (
 	cluster: K8sClustersData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sPodCpuUtilizationKey = 'k8s.pod.cpu.usage';
-	const k8sNodeAllocatableCpuKey = 'k8s.node.allocatable_cpu';
-	const k8sPodMemoryUsageKey = 'k8s.pod.memory.usage';
-	const k8sNodeAllocatableMemoryKey = 'k8s.node.allocatable_memory';
-	const k8sNodeConditionReadyKey = 'k8s.node.condition_ready';
-	const k8sDeploymentAvailableKey = 'k8s.deployment.available';
-	const k8sDeploymentDesiredKey = 'k8s.deployment.desired';
-	const k8sStatefulsetCurrentPodsKey = 'k8s.statefulset.current_pods';
-	const k8sStatefulsetDesiredPodsKey = 'k8s.statefulset.desired_pods';
-	const k8sStatefulsetReadyPodsKey = 'k8s.statefulset.ready_pods';
-	const k8sStatefulsetUpdatedPodsKey = 'k8s.statefulset.updated_pods';
-	const k8sDaemonsetCurrentScheduledNodesKey =
-		'k8s.daemonset.current_scheduled_nodes';
-	const k8sDaemonsetDesiredScheduledNodesKey =
-		'k8s.daemonset.desired_scheduled_nodes';
-	const k8sDaemonsetReadyNodesKey = 'k8s.daemonset.ready_nodes';
-	const k8sJobActivePodsKey = 'k8s.job.active_pods';
-	const k8sJobSuccessfulPodsKey = 'k8s.job.successful_pods';
-	const k8sJobFailedPodsKey = 'k8s.job.failed_pods';
-	const k8sJobDesiredSuccessfulPodsKey = 'k8s.job.desired_successful_pods';
-	const k8sClusterNameKey = 'k8s.cluster.name';
-	const k8sNodeNameKey = 'k8s.node.name';
-	const k8sDeploymentNameKey = 'k8s.deployment.name';
-	const k8sNamespaceNameKey = 'k8s.namespace.name';
-	const k8sStatefulsetNameKey = 'k8s.statefulset.name';
-	const k8sDaemonsetNameKey = 'k8s.daemonset.name';
-	const k8sJobNameKey = 'k8s.job.name';
+	const getKey = (dotKey: string, underscoreKey: string): string =>
+		dotMetricsEnabled ? dotKey : underscoreKey;
+	const k8sPodCpuUtilizationKey = getKey(
+		'k8s.pod.cpu.usage',
+		'k8s_pod_cpu_usage',
+	);
+	const k8sNodeAllocatableCpuKey = getKey(
+		'k8s.node.allocatable_cpu',
+		'k8s_node_allocatable_cpu',
+	);
+	const k8sPodMemoryUsageKey = getKey(
+		'k8s.pod.memory.usage',
+		'k8s_pod_memory_usage',
+	);
+	const k8sNodeAllocatableMemoryKey = getKey(
+		'k8s.node.allocatable_memory',
+		'k8s_node_allocatable_memory',
+	);
+	const k8sNodeConditionReadyKey = getKey(
+		'k8s.node.condition_ready',
+		'k8s_node_condition_ready',
+	);
+	const k8sDeploymentAvailableKey = getKey(
+		'k8s.deployment.available',
+		'k8s_deployment_available',
+	);
+	const k8sDeploymentDesiredKey = getKey(
+		'k8s.deployment.desired',
+		'k8s_deployment_desired',
+	);
+	const k8sStatefulsetCurrentPodsKey = getKey(
+		'k8s.statefulset.current_pods',
+		'k8s_statefulset_current_pods',
+	);
+	const k8sStatefulsetDesiredPodsKey = getKey(
+		'k8s.statefulset.desired_pods',
+		'k8s_statefulset_desired_pods',
+	);
+	const k8sStatefulsetReadyPodsKey = getKey(
+		'k8s.statefulset.ready_pods',
+		'k8s_statefulset_ready_pods',
+	);
+	const k8sStatefulsetUpdatedPodsKey = getKey(
+		'k8s.statefulset.updated_pods',
+		'k8s_statefulset_updated_pods',
+	);
+	const k8sDaemonsetCurrentScheduledNodesKey = getKey(
+		'k8s.daemonset.current_scheduled_nodes',
+		'k8s_daemonset_current_scheduled_nodes',
+	);
+	const k8sDaemonsetDesiredScheduledNodesKey = getKey(
+		'k8s.daemonset.desired_scheduled_nodes',
+		'k8s_daemonset_desired_scheduled_nodes',
+	);
+	const k8sDaemonsetReadyNodesKey = getKey(
+		'k8s.daemonset.ready_nodes',
+		'k8s_daemonset_ready_nodes',
+	);
+	const k8sJobActivePodsKey = getKey(
+		'k8s.job.active_pods',
+		'k8s_job_active_pods',
+	);
+	const k8sJobSuccessfulPodsKey = getKey(
+		'k8s.job.successful_pods',
+		'k8s_job_successful_pods',
+	);
+	const k8sJobFailedPodsKey = getKey(
+		'k8s.job.failed_pods',
+		'k8s_job_failed_pods',
+	);
+	const k8sJobDesiredSuccessfulPodsKey = getKey(
+		'k8s.job.desired_successful_pods',
+		'k8s_job_desired_successful_pods',
+	);
+	const k8sClusterNameKey = getKey('k8s.cluster.name', 'k8s_cluster_name');
+	const k8sNodeNameKey = getKey('k8s.node.name', 'k8s_node_name');
+	const k8sDeploymentNameKey = getKey(
+		'k8s.deployment.name',
+		'k8s_deployment_name',
+	);
+	const k8sNamespaceNameKey = getKey('k8s.namespace.name', 'k8s_namespace_name');
+	const k8sStatefulsetNameKey = getKey(
+		'k8s.statefulset.name',
+		'k8s_statefulset_name',
+	);
+	const k8sDaemonsetNameKey = getKey('k8s.daemonset.name', 'k8s_daemonset_name');
+	const k8sJobNameKey = getKey('k8s.job.name', 'k8s_job_name');
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/Clusters/K8sClustersList.tsx

@@ -25,6 +25,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -135,6 +137,11 @@ function K8sClustersList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sClustersRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -224,6 +231,8 @@ function K8sClustersList({
 			queryKey: groupedByRowDataQueryKey,
 			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const {
@@ -232,7 +241,10 @@ function K8sClustersList({
 	} = useGetAggregateKeys(
 		{
 			dataSource: currentQuery.builder.queryData[0].dataSource,
-			aggregateAttribute: GetK8sEntityToAggregateAttribute(K8sCategory.CLUSTERS),
+			aggregateAttribute: GetK8sEntityToAggregateAttribute(
+				K8sCategory.CLUSTERS,
+				dotMetricsEnabled,
+			),
 			aggregateOperator: 'noop',
 			searchText: '',
 			tagType: '',
@@ -313,6 +325,8 @@ function K8sClustersList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const clustersData = useMemo(() => data?.payload?.data?.records || [], [data]);

frontend/src/container/InfraMonitoringK8s/Clusters/utils.tsx

@@ -136,7 +136,7 @@ export const getK8sClustersListColumns = (
 	return columnsConfig as ColumnType<K8sClustersRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sClustersData['meta']> = {
+const dotToUnder: Record<string, keyof K8sClustersData['meta']> = {
 	'k8s.cluster.name': 'k8s_cluster_name',
 	'k8s.cluster.uid': 'k8s_cluster_uid',
 };
@@ -151,8 +151,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
-			rawKey) as keyof typeof cluster.meta;
+		const metaKey = (dotToUnder[rawKey] ?? rawKey) as keyof typeof cluster.meta;
 		const value = cluster.meta[metaKey];
 
 		groupByValues.push(value);

frontend/src/container/InfraMonitoringK8s/DaemonSets/DaemonSetDetails/constants.ts

@@ -30,28 +30,49 @@ export const getDaemonSetMetricsQueryPayload = (
 	daemonSet: K8sDaemonSetsData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sPodCpuUtilizationKey = 'k8s.pod.cpu.usage';
+	const k8sPodCpuUtilizationKey = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
 
-	const k8sContainerCpuRequestKey = 'k8s.container.cpu_request';
+	const k8sContainerCpuRequestKey = dotMetricsEnabled
+		? 'k8s.container.cpu_request'
+		: 'k8s_container_cpu_request';
 
-	const k8sContainerCpuLimitKey = 'k8s.container.cpu_limit';
+	const k8sContainerCpuLimitKey = dotMetricsEnabled
+		? 'k8s.container.cpu_limit'
+		: 'k8s_container_cpu_limit';
 
-	const k8sPodMemoryUsageKey = 'k8s.pod.memory.usage';
+	const k8sPodMemoryUsageKey = dotMetricsEnabled
+		? 'k8s.pod.memory.usage'
+		: 'k8s_pod_memory_usage';
 
-	const k8sContainerMemoryRequestKey = 'k8s.container.memory_request';
+	const k8sContainerMemoryRequestKey = dotMetricsEnabled
+		? 'k8s.container.memory_request'
+		: 'k8s_container_memory_request';
 
-	const k8sContainerMemoryLimitKey = 'k8s.container.memory_limit';
+	const k8sContainerMemoryLimitKey = dotMetricsEnabled
+		? 'k8s.container.memory_limit'
+		: 'k8s_container_memory_limit';
 
-	const k8sPodNetworkIoKey = 'k8s.pod.network.io';
+	const k8sPodNetworkIoKey = dotMetricsEnabled
+		? 'k8s.pod.network.io'
+		: 'k8s_pod_network_io';
 
-	const k8sPodNetworkErrorsKey = 'k8s.pod.network.errors';
+	const k8sPodNetworkErrorsKey = dotMetricsEnabled
+		? 'k8s.pod.network.errors'
+		: 'k8s_pod_network_errors';
 
-	const k8sDaemonSetNameKey = 'k8s.daemonset.name';
+	const k8sDaemonSetNameKey = dotMetricsEnabled
+		? 'k8s.daemonset.name'
+		: 'k8s_daemonset_name';
 
-	const k8sPodNameKey = 'k8s.pod.name';
+	const k8sPodNameKey = dotMetricsEnabled ? 'k8s.pod.name' : 'k8s_pod_name';
 
-	const k8sNamespaceNameKey = 'k8s.namespace.name';
+	const k8sNamespaceNameKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/DaemonSets/K8sDaemonSetsList.tsx

@@ -26,6 +26,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -137,6 +139,11 @@ function K8sDaemonSetsList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sDaemonSetsRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -226,6 +233,8 @@ function K8sDaemonSetsList({
 			queryKey: groupedByRowDataQueryKey,
 			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const {
@@ -234,7 +243,10 @@ function K8sDaemonSetsList({
 	} = useGetAggregateKeys(
 		{
 			dataSource: currentQuery.builder.queryData[0].dataSource,
-			aggregateAttribute: GetK8sEntityToAggregateAttribute(K8sCategory.DAEMONSETS),
+			aggregateAttribute: GetK8sEntityToAggregateAttribute(
+				K8sCategory.DAEMONSETS,
+				dotMetricsEnabled,
+			),
 			aggregateOperator: 'noop',
 			searchText: '',
 			tagType: '',
@@ -308,6 +320,8 @@ function K8sDaemonSetsList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const daemonSetsData = useMemo(() => data?.payload?.data?.records || [], [

frontend/src/container/InfraMonitoringK8s/DaemonSets/utils.tsx

@@ -236,7 +236,7 @@ export const getK8sDaemonSetsListColumns = (
 	return columnsConfig as ColumnType<K8sDaemonSetsRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sDaemonSetsData['meta']> = {
+const dotToUnder: Record<string, keyof K8sDaemonSetsData['meta']> = {
 	'k8s.daemonset.name': 'k8s_daemonset_name',
 	'k8s.namespace.name': 'k8s_namespace_name',
 	'k8s.cluster.name': 'k8s_cluster_name',
@@ -252,8 +252,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
-			rawKey) as keyof typeof daemonSet.meta;
+		const metaKey = (dotToUnder[rawKey] ?? rawKey) as keyof typeof daemonSet.meta;
 		const value = daemonSet.meta[metaKey];
 
 		groupByValues.push(value);

frontend/src/container/InfraMonitoringK8s/Deployments/DeploymentDetails/constants.ts

@@ -30,26 +30,45 @@ export const getDeploymentMetricsQueryPayload = (
 	deployment: K8sDeploymentsData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sPodCpuUtilizationKey = 'k8s.pod.cpu.usage';
+	const k8sPodCpuUtilizationKey = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
 
-	const k8sContainerCpuRequestKey = 'k8s.container.cpu_request';
+	const k8sContainerCpuRequestKey = dotMetricsEnabled
+		? 'k8s.container.cpu_request'
+		: 'k8s_container_cpu_request';
 
-	const k8sContainerCpuLimitKey = 'k8s.container.cpu_limit';
+	const k8sContainerCpuLimitKey = dotMetricsEnabled
+		? 'k8s.container.cpu_limit'
+		: 'k8s_container_cpu_limit';
 
-	const k8sPodMemoryUsageKey = 'k8s.pod.memory.usage';
+	const k8sPodMemoryUsageKey = dotMetricsEnabled
+		? 'k8s.pod.memory.usage'
+		: 'k8s_pod_memory_usage';
 
-	const k8sContainerMemoryRequestKey = 'k8s.container.memory_request';
+	const k8sContainerMemoryRequestKey = dotMetricsEnabled
+		? 'k8s.container.memory_request'
+		: 'k8s_container_memory_request';
 
-	const k8sContainerMemoryLimitKey = 'k8s.container.memory_limit';
+	const k8sContainerMemoryLimitKey = dotMetricsEnabled
+		? 'k8s.container.memory_limit'
+		: 'k8s_container_memory_limit';
 
-	const k8sPodNetworkIoKey = 'k8s.pod.network.io';
+	const k8sPodNetworkIoKey = dotMetricsEnabled
+		? 'k8s.pod.network.io'
+		: 'k8s_pod_network_io';
 
-	const k8sPodNetworkErrorsKey = 'k8s.pod.network.errors';
+	const k8sPodNetworkErrorsKey = dotMetricsEnabled
+		? 'k8s.pod.network.errors'
+		: 'k8s_pod_network_errors';
 
-	const k8sDeploymentNameKey = 'k8s.deployment.name';
+	const k8sDeploymentNameKey = dotMetricsEnabled
+		? 'k8s.deployment.name'
+		: 'k8s_deployment_name';
 
-	const k8sPodNameKey = 'k8s.pod.name';
+	const k8sPodNameKey = dotMetricsEnabled ? 'k8s.pod.name' : 'k8s_pod_name';
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/Deployments/K8sDeploymentsList.tsx

@@ -26,6 +26,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -138,6 +140,11 @@ function K8sDeploymentsList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sDeploymentsRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -227,6 +234,8 @@ function K8sDeploymentsList({
 			queryKey: groupedByRowDataQueryKey,
 			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const {
@@ -237,6 +246,7 @@ function K8sDeploymentsList({
 			dataSource: currentQuery.builder.queryData[0].dataSource,
 			aggregateAttribute: GetK8sEntityToAggregateAttribute(
 				K8sCategory.DEPLOYMENTS,
+				dotMetricsEnabled,
 			),
 			aggregateOperator: 'noop',
 			searchText: '',
@@ -311,6 +321,8 @@ function K8sDeploymentsList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const deploymentsData = useMemo(() => data?.payload?.data?.records || [], [

frontend/src/container/InfraMonitoringK8s/Deployments/utils.tsx

@@ -226,7 +226,7 @@ export const getK8sDeploymentsListColumns = (
 	return columnsConfig as ColumnType<K8sDeploymentsRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sDeploymentsData['meta']> = {
+const dotToUnder: Record<string, keyof K8sDeploymentsData['meta']> = {
 	'k8s.deployment.name': 'k8s_deployment_name',
 	'k8s.namespace.name': 'k8s_namespace_name',
 	'k8s.cluster.name': 'k8s_cluster_name',
@@ -242,7 +242,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
+		const metaKey = (dotToUnder[rawKey] ??
 			rawKey) as keyof typeof deployment.meta;
 		const value = deployment.meta[metaKey];
 

frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityMetrics/EntityMetrics.tsx

@@ -28,7 +28,9 @@ import { SuccessResponse } from 'types/api';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 import { Options } from 'uplot';
 
+import { FeatureKeys } from '../../../../constants/features';
 import { useMultiIntersectionObserver } from '../../../../hooks/useMultiIntersectionObserver';
+import { useAppContext } from '../../../../providers/App/App';
 
 import './entityMetrics.styles.scss';
 
@@ -52,6 +54,7 @@ interface EntityMetricsProps<T> {
 		node: T,
 		start: number,
 		end: number,
+		dotMetricsEnabled: boolean,
 	) => GetQueryResultsProps[];
 	queryKey: string;
 	category: K8sCategory;
@@ -68,14 +71,31 @@ function EntityMetrics<T>({
 	queryKey,
 	category,
 }: EntityMetricsProps<T>): JSX.Element {
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const {
 		visibilities,
 		setElement,
 	} = useMultiIntersectionObserver(entityWidgetInfo.length, { threshold: 0.1 });
 
 	const queryPayloads = useMemo(
-		() => getEntityQueryPayload(entity, timeRange.startTime, timeRange.endTime),
-		[getEntityQueryPayload, entity, timeRange.startTime, timeRange.endTime],
+		() =>
+			getEntityQueryPayload(
+				entity,
+				timeRange.startTime,
+				timeRange.endTime,
+				dotMetricsEnabled,
+			),
+		[
+			getEntityQueryPayload,
+			entity,
+			timeRange.startTime,
+			timeRange.endTime,
+			dotMetricsEnabled,
+		],
 	);
 
 	const queries = useQueries(

frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityMetrics/__tests__/EntityMetrics.test.tsx

@@ -97,7 +97,12 @@ jest.spyOn(appContextHooks, 'useAppContext').mockReturnValue({
 			plan_version: 'test-plan-version',
 		},
 	},
-	featureFlags: [],
+	featureFlags: [
+		{
+			name: 'DOT_METRICS_ENABLED',
+			active: false,
+		},
+	],
 } as any);
 
 const mockEntity = {
@@ -380,6 +385,7 @@ describe('EntityMetrics', () => {
 			mockEntity,
 			mockTimeRange.startTime,
 			mockTimeRange.endTime,
+			false,
 		);
 	});
 });

frontend/src/container/InfraMonitoringK8s/InfraMonitoringK8s.tsx

@@ -24,6 +24,8 @@ import {
 import ErrorBoundaryFallback from 'pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 
+import { FeatureKeys } from '../../constants/features';
+import { useAppContext } from '../../providers/App/App';
 import K8sClustersList from './Clusters/K8sClustersList';
 import {
 	GetClustersQuickFiltersConfig,
@@ -74,6 +76,11 @@ export default function InfraMonitoringK8s(): JSX.Element {
 		entityVersion: '',
 	});
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const handleFilterChange = (query: Query): void => {
 		// update the current query with the new filters
 		// in infra monitoring k8s, we are using only one query, hence updating the 0th index of queryData
@@ -109,7 +116,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetPodsQuickFiltersConfig()}
+					config={GetPodsQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -129,7 +136,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetNodesQuickFiltersConfig()}
+					config={GetNodesQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -152,7 +159,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetNamespaceQuickFiltersConfig()}
+					config={GetNamespaceQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -172,7 +179,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetClustersQuickFiltersConfig()}
+					config={GetClustersQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -192,7 +199,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetDeploymentsQuickFiltersConfig()}
+					config={GetDeploymentsQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -212,7 +219,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetJobsQuickFiltersConfig()}
+					config={GetJobsQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -232,7 +239,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetDaemonsetsQuickFiltersConfig()}
+					config={GetDaemonsetsQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -255,7 +262,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetStatefulsetsQuickFiltersConfig()}
+					config={GetStatefulsetsQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>
@@ -275,7 +282,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 			children: (
 				<QuickFilters
 					source={QuickFiltersSource.INFRA_MONITORING}
-					config={GetVolumesQuickFiltersConfig()}
+					config={GetVolumesQuickFiltersConfig(dotMetricsEnabled)}
 					handleFilterVisibilityChange={handleFilterVisibilityChange}
 					onFilterChange={handleFilterChange}
 				/>

frontend/src/container/InfraMonitoringK8s/Jobs/JobDetails/constants.ts

@@ -30,13 +30,24 @@ export const getJobMetricsQueryPayload = (
 	job: K8sJobsData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sPodCpuUtilizationKey = 'k8s.pod.cpu.usage';
-	const k8sPodMemoryUsageKey = 'k8s.pod.memory.usage';
-	const k8sPodNetworkIoKey = 'k8s.pod.network.io';
-	const k8sPodNetworkErrorsKey = 'k8s.pod.network.errors';
-	const k8sJobNameKey = 'k8s.job.name';
-	const k8sNamespaceNameKey = 'k8s.namespace.name';
+	const k8sPodCpuUtilizationKey = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
+	const k8sPodMemoryUsageKey = dotMetricsEnabled
+		? 'k8s.pod.memory.usage'
+		: 'k8s_pod_memory_usage';
+	const k8sPodNetworkIoKey = dotMetricsEnabled
+		? 'k8s.pod.network.io'
+		: 'k8s_pod_network_io';
+	const k8sPodNetworkErrorsKey = dotMetricsEnabled
+		? 'k8s.pod.network.errors'
+		: 'k8s_pod_network_errors';
+	const k8sJobNameKey = dotMetricsEnabled ? 'k8s.job.name' : 'k8s_job_name';
+	const k8sNamespaceNameKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/Jobs/K8sJobsList.tsx

@@ -26,6 +26,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -132,6 +134,11 @@ function K8sJobsList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sJobsRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -208,10 +215,15 @@ function K8sJobsList({
 		isLoading: isLoadingGroupedByRowData,
 		isError: isErrorGroupedByRowData,
 		refetch: fetchGroupedByRowData,
-	} = useGetK8sJobsList(fetchGroupedByRowDataQuery as K8sJobsListPayload, {
-		queryKey: groupedByRowDataQueryKey,
-		enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
-	});
+	} = useGetK8sJobsList(
+		fetchGroupedByRowDataQuery as K8sJobsListPayload,
+		{
+			queryKey: groupedByRowDataQueryKey,
+			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
+		},
+		undefined,
+		dotMetricsEnabled,
+	);
 
 	const {
 		data: groupByFiltersData,
@@ -219,7 +231,10 @@ function K8sJobsList({
 	} = useGetAggregateKeys(
 		{
 			dataSource: currentQuery.builder.queryData[0].dataSource,
-			aggregateAttribute: GetK8sEntityToAggregateAttribute(K8sCategory.JOBS),
+			aggregateAttribute: GetK8sEntityToAggregateAttribute(
+				K8sCategory.JOBS,
+				dotMetricsEnabled,
+			),
 			aggregateOperator: 'noop',
 			searchText: '',
 			tagType: '',
@@ -300,6 +315,8 @@ function K8sJobsList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const jobsData = useMemo(() => data?.payload?.data?.records || [], [data]);

frontend/src/container/InfraMonitoringK8s/Jobs/utils.tsx

@@ -263,7 +263,7 @@ export const getK8sJobsListColumns = (
 	return columnsConfig as ColumnType<K8sJobsRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sJobsData['meta']> = {
+const dotToUnder: Record<string, keyof K8sJobsData['meta']> = {
 	'k8s.job.name': 'k8s_job_name',
 	'k8s.namespace.name': 'k8s_namespace_name',
 	'k8s.cluster.name': 'k8s_cluster_name',
@@ -279,8 +279,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
-			rawKey) as keyof typeof job.meta;
+		const metaKey = (dotToUnder[rawKey] ?? rawKey) as keyof typeof job.meta;
 		const value = job.meta[metaKey];
 
 		groupByValues.push(value);

frontend/src/container/InfraMonitoringK8s/Namespaces/K8sNamespacesList.tsx

@@ -25,6 +25,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -136,6 +138,11 @@ function K8sNamespacesList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sNamespacesRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -225,6 +232,8 @@ function K8sNamespacesList({
 			queryKey: groupedByRowDataQueryKey,
 			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const {
@@ -233,7 +242,10 @@ function K8sNamespacesList({
 	} = useGetAggregateKeys(
 		{
 			dataSource: currentQuery.builder.queryData[0].dataSource,
-			aggregateAttribute: GetK8sEntityToAggregateAttribute(K8sCategory.NAMESPACES),
+			aggregateAttribute: GetK8sEntityToAggregateAttribute(
+				K8sCategory.NAMESPACES,
+				dotMetricsEnabled,
+			),
 			aggregateOperator: 'noop',
 			searchText: '',
 			tagType: '',
@@ -307,6 +319,8 @@ function K8sNamespacesList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const namespacesData = useMemo(() => data?.payload?.data?.records || [], [

frontend/src/container/InfraMonitoringK8s/Namespaces/NamespaceDetails/constants.ts

@@ -54,35 +54,95 @@ export const getNamespaceMetricsQueryPayload = (
 	namespace: K8sNamespacesData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sPodCpuUtilizationKey = 'k8s.pod.cpu.usage';
-	const k8sContainerCpuRequestKey = 'k8s.container.cpu_request';
-	const k8sPodMemoryUsageKey = 'k8s.pod.memory.usage';
-	const k8sContainerMemoryRequestKey = 'k8s.container.memory_request';
-	const k8sPodMemoryWorkingSetKey = 'k8s.pod.memory.working_set';
-	const k8sPodMemoryRssKey = 'k8s.pod.memory.rss';
-	const k8sPodNetworkIoKey = 'k8s.pod.network.io';
-	const k8sPodNetworkErrorsKey = 'k8s.pod.network.errors';
-	const k8sStatefulsetCurrentPodsKey = 'k8s.statefulset.current_pods';
-	const k8sStatefulsetDesiredPodsKey = 'k8s.statefulset.desired_pods';
-	const k8sStatefulsetUpdatedPodsKey = 'k8s.statefulset.updated_pods';
-	const k8sReplicasetDesiredKey = 'k8s.replicaset.desired';
-	const k8sReplicasetAvailableKey = 'k8s.replicaset.available';
-	const k8sDaemonsetDesiredScheduledNamespacesKey =
-		'k8s.daemonset.desired.scheduled.namespaces';
-	const k8sDaemonsetCurrentScheduledNamespacesKey =
-		'k8s.daemonset.current.scheduled.namespaces';
-	const k8sDaemonsetReadyNamespacesKey = 'k8s.daemonset.ready.namespaces';
-	const k8sDaemonsetMisscheduledNamespacesKey =
-		'k8s.daemonset.misscheduled.namespaces';
-	const k8sDeploymentDesiredKey = 'k8s.deployment.desired';
-	const k8sDeploymentAvailableKey = 'k8s.deployment.available';
-	const k8sNamespaceNameKey = 'k8s.namespace.name';
-	const k8sPodNameKey = 'k8s.pod.name';
-	const k8sStatefulsetNameKey = 'k8s.statefulset.name';
-	const k8sReplicasetNameKey = 'k8s.replicaset.name';
-	const k8sDaemonsetNameKey = 'k8s.daemonset.name';
-	const k8sDeploymentNameKey = 'k8s.deployment.name';
+	const getKey = (dotKey: string, underscoreKey: string): string =>
+		dotMetricsEnabled ? dotKey : underscoreKey;
+	const k8sPodCpuUtilizationKey = getKey(
+		'k8s.pod.cpu.usage',
+		'k8s_pod_cpu_usage',
+	);
+	const k8sContainerCpuRequestKey = getKey(
+		'k8s.container.cpu_request',
+		'k8s_container_cpu_request',
+	);
+	const k8sPodMemoryUsageKey = getKey(
+		'k8s.pod.memory.usage',
+		'k8s_pod_memory_usage',
+	);
+	const k8sContainerMemoryRequestKey = getKey(
+		'k8s.container.memory_request',
+		'k8s_container_memory_request',
+	);
+	const k8sPodMemoryWorkingSetKey = getKey(
+		'k8s.pod.memory.working_set',
+		'k8s_pod_memory_working_set',
+	);
+	const k8sPodMemoryRssKey = getKey('k8s.pod.memory.rss', 'k8s_pod_memory_rss');
+	const k8sPodNetworkIoKey = getKey('k8s.pod.network.io', 'k8s_pod_network_io');
+	const k8sPodNetworkErrorsKey = getKey(
+		'k8s.pod.network.errors',
+		'k8s_pod_network_errors',
+	);
+	const k8sStatefulsetCurrentPodsKey = getKey(
+		'k8s.statefulset.current_pods',
+		'k8s_statefulset_current_pods',
+	);
+	const k8sStatefulsetDesiredPodsKey = getKey(
+		'k8s.statefulset.desired_pods',
+		'k8s_statefulset_desired_pods',
+	);
+	const k8sStatefulsetUpdatedPodsKey = getKey(
+		'k8s.statefulset.updated_pods',
+		'k8s_statefulset_updated_pods',
+	);
+	const k8sReplicasetDesiredKey = getKey(
+		'k8s.replicaset.desired',
+		'k8s_replicaset_desired',
+	);
+	const k8sReplicasetAvailableKey = getKey(
+		'k8s.replicaset.available',
+		'k8s_replicaset_available',
+	);
+	const k8sDaemonsetDesiredScheduledNamespacesKey = getKey(
+		'k8s.daemonset.desired.scheduled.namespaces',
+		'k8s_daemonset_desired_scheduled_namespaces',
+	);
+	const k8sDaemonsetCurrentScheduledNamespacesKey = getKey(
+		'k8s.daemonset.current.scheduled.namespaces',
+		'k8s_daemonset_current_scheduled_namespaces',
+	);
+	const k8sDaemonsetReadyNamespacesKey = getKey(
+		'k8s.daemonset.ready.namespaces',
+		'k8s_daemonset_ready_namespaces',
+	);
+	const k8sDaemonsetMisscheduledNamespacesKey = getKey(
+		'k8s.daemonset.misscheduled.namespaces',
+		'k8s_daemonset_misscheduled_namespaces',
+	);
+	const k8sDeploymentDesiredKey = getKey(
+		'k8s.deployment.desired',
+		'k8s_deployment_desired',
+	);
+	const k8sDeploymentAvailableKey = getKey(
+		'k8s.deployment.available',
+		'k8s_deployment_available',
+	);
+	const k8sNamespaceNameKey = getKey('k8s.namespace.name', 'k8s_namespace_name');
+	const k8sPodNameKey = getKey('k8s.pod.name', 'k8s_pod_name');
+	const k8sStatefulsetNameKey = getKey(
+		'k8s.statefulset.name',
+		'k8s_statefulset_name',
+	);
+	const k8sReplicasetNameKey = getKey(
+		'k8s.replicaset.name',
+		'k8s_replicaset_name',
+	);
+	const k8sDaemonsetNameKey = getKey('k8s.daemonset.name', 'k8s_daemonset_name');
+	const k8sDeploymentNameKey = getKey(
+		'k8s.deployment.name',
+		'k8s_deployment_name',
+	);
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/Namespaces/utils.tsx

@@ -122,7 +122,7 @@ export const getK8sNamespacesListColumns = (
 	return columnsConfig as ColumnType<K8sNamespacesRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sNamespacesData['meta']> = {
+const dotToUnder: Record<string, keyof K8sNamespacesData['meta']> = {
 	'k8s.namespace.name': 'k8s_namespace_name',
 	'k8s.cluster.name': 'k8s_cluster_name',
 };
@@ -137,8 +137,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
-			rawKey) as keyof typeof namespace.meta;
+		const metaKey = (dotToUnder[rawKey] ?? rawKey) as keyof typeof namespace.meta;
 		const value = namespace.meta[metaKey];
 
 		groupByValues.push(value);

frontend/src/container/InfraMonitoringK8s/Nodes/K8sNodesList.tsx

@@ -25,6 +25,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -130,6 +132,11 @@ function K8sNodesList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sNodesRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -213,10 +220,15 @@ function K8sNodesList({
 		isLoading: isLoadingGroupedByRowData,
 		isError: isErrorGroupedByRowData,
 		refetch: fetchGroupedByRowData,
-	} = useGetK8sNodesList(fetchGroupedByRowDataQuery as K8sNodesListPayload, {
-		queryKey: groupedByRowDataQueryKey,
-		enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
-	});
+	} = useGetK8sNodesList(
+		fetchGroupedByRowDataQuery as K8sNodesListPayload,
+		{
+			queryKey: groupedByRowDataQueryKey,
+			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
+		},
+		undefined,
+		dotMetricsEnabled,
+	);
 
 	const {
 		data: groupByFiltersData,
@@ -224,7 +236,10 @@ function K8sNodesList({
 	} = useGetAggregateKeys(
 		{
 			dataSource: currentQuery.builder.queryData[0].dataSource,
-			aggregateAttribute: GetK8sEntityToAggregateAttribute(K8sCategory.NODES),
+			aggregateAttribute: GetK8sEntityToAggregateAttribute(
+				K8sCategory.NODES,
+				dotMetricsEnabled,
+			),
 			aggregateOperator: 'noop',
 			searchText: '',
 			tagType: '',
@@ -305,6 +320,8 @@ function K8sNodesList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const nodesData = useMemo(() => data?.payload?.data?.records || [], [data]);

frontend/src/container/InfraMonitoringK8s/Nodes/NodeDetails/constants.ts

@@ -54,40 +54,88 @@ export const getNodeMetricsQueryPayload = (
 	node: K8sNodesData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sNodeCpuUtilizationKey = 'k8s.node.cpu.usage';
+	const getKey = (dotKey: string, underscoreKey: string): string =>
+		dotMetricsEnabled ? dotKey : underscoreKey;
+	const k8sNodeCpuUtilizationKey = getKey(
+		'k8s.node.cpu.usage',
+		'k8s_node_cpu_usage',
+	);
 
-	const k8sNodeAllocatableCpuKey = 'k8s.node.allocatable_cpu';
+	const k8sNodeAllocatableCpuKey = getKey(
+		'k8s.node.allocatable_cpu',
+		'k8s_node_allocatable_cpu',
+	);
 
-	const k8sContainerCpuRequestKey = 'k8s.container.cpu_request';
+	const k8sContainerCpuRequestKey = getKey(
+		'k8s.container.cpu_request',
+		'k8s_container_cpu_request',
+	);
 
-	const k8sNodeMemoryUsageKey = 'k8s.node.memory.usage';
+	const k8sNodeMemoryUsageKey = getKey(
+		'k8s.node.memory.usage',
+		'k8s_node_memory_usage',
+	);
 
-	const k8sNodeAllocatableMemoryKey = 'k8s.node.allocatable_memory';
+	const k8sNodeAllocatableMemoryKey = getKey(
+		'k8s.node.allocatable_memory',
+		'k8s_node_allocatable_memory',
+	);
 
-	const k8sContainerMemoryRequestKey = 'k8s.container.memory_request';
+	const k8sContainerMemoryRequestKey = getKey(
+		'k8s.container.memory_request',
+		'k8s_container_memory_request',
+	);
 
-	const k8sNodeMemoryWorkingSetKey = 'k8s.node.memory.working_set';
+	const k8sNodeMemoryWorkingSetKey = getKey(
+		'k8s.node.memory.working_set',
+		'k8s_node_memory_working_set',
+	);
 
-	const k8sNodeMemoryRssKey = 'k8s.node.memory.rss';
+	const k8sNodeMemoryRssKey = getKey(
+		'k8s.node.memory.rss',
+		'k8s_node_memory_rss',
+	);
 
-	const k8sPodCpuUtilizationKey = 'k8s.pod.cpu.usage';
+	const k8sPodCpuUtilizationKey = getKey(
+		'k8s.pod.cpu.usage',
+		'k8s_pod_cpu_usage',
+	);
 
-	const k8sPodMemoryUsageKey = 'k8s.pod.memory.usage';
+	const k8sPodMemoryUsageKey = getKey(
+		'k8s.pod.memory.usage',
+		'k8s_pod_memory_usage',
+	);
 
-	const k8sNodeNetworkErrorsKey = 'k8s.node.network.errors';
+	const k8sNodeNetworkErrorsKey = getKey(
+		'k8s.node.network.errors',
+		'k8s_node_network_errors',
+	);
 
-	const k8sNodeNetworkIoKey = 'k8s.node.network.io';
+	const k8sNodeNetworkIoKey = getKey(
+		'k8s.node.network.io',
+		'k8s_node_network_io',
+	);
 
-	const k8sNodeFilesystemUsageKey = 'k8s.node.filesystem.usage';
+	const k8sNodeFilesystemUsageKey = getKey(
+		'k8s.node.filesystem.usage',
+		'k8s_node_filesystem_usage',
+	);
 
-	const k8sNodeFilesystemCapacityKey = 'k8s.node.filesystem.capacity';
+	const k8sNodeFilesystemCapacityKey = getKey(
+		'k8s.node.filesystem.capacity',
+		'k8s_node_filesystem_capacity',
+	);
 
-	const k8sNodeFilesystemAvailableKey = 'k8s.node.filesystem.available';
+	const k8sNodeFilesystemAvailableKey = getKey(
+		'k8s.node.filesystem.available',
+		'k8s_node_filesystem_available',
+	);
 
-	const k8sNodeNameKey = 'k8s.node.name';
+	const k8sNodeNameKey = getKey('k8s.node.name', 'k8s_node_name');
 
-	const k8sPodNameKey = 'k8s.pod.name';
+	const k8sPodNameKey = getKey('k8s.pod.name', 'k8s_pod_name');
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/Nodes/utils.tsx

@@ -152,7 +152,7 @@ export const getK8sNodesListColumns = (
 	return columnsConfig as ColumnType<K8sNodesRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sNodesData['meta']> = {
+const dotToUnder: Record<string, keyof K8sNodesData['meta']> = {
 	'k8s.node.name': 'k8s_node_name',
 	'k8s.cluster.name': 'k8s_cluster_name',
 	'k8s.node.uid': 'k8s_node_uid',
@@ -168,8 +168,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
-			rawKey) as keyof typeof node.meta;
+		const metaKey = (dotToUnder[rawKey] ?? rawKey) as keyof typeof node.meta;
 
 		const value = node.meta[metaKey];
 

frontend/src/container/InfraMonitoringK8s/Pods/K8sPodLists.tsx

@@ -27,6 +27,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -118,13 +120,21 @@ function K8sPodsList({
 		[currentQuery?.builder?.queryData],
 	);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const {
 		data: groupByFiltersData,
 		isLoading: isLoadingGroupByFilters,
 	} = useGetAggregateKeys(
 		{
 			dataSource: currentQuery.builder.queryData[0].dataSource,
-			aggregateAttribute: GetK8sEntityToAggregateAttribute(K8sCategory.PODS),
+			aggregateAttribute: GetK8sEntityToAggregateAttribute(
+				K8sCategory.PODS,
+				dotMetricsEnabled,
+			),
 			aggregateOperator: 'noop',
 			searchText: '',
 			tagType: '',
@@ -234,6 +244,8 @@ function K8sPodsList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const createFiltersForSelectedRowData = (
@@ -311,10 +323,15 @@ function K8sPodsList({
 		isLoading: isLoadingGroupedByRowData,
 		isError: isErrorGroupedByRowData,
 		refetch: fetchGroupedByRowData,
-	} = useGetK8sPodsList(fetchGroupedByRowDataQuery as K8sPodsListPayload, {
-		queryKey: groupedByRowDataQueryKey,
-		enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
-	});
+	} = useGetK8sPodsList(
+		fetchGroupedByRowDataQuery as K8sPodsListPayload,
+		{
+			queryKey: groupedByRowDataQueryKey,
+			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
+		},
+		undefined,
+		dotMetricsEnabled,
+	);
 
 	const podsData = useMemo(() => data?.payload?.data?.records || [], [data]);
 	const totalCount = data?.payload?.data?.total || 0;

frontend/src/container/InfraMonitoringK8s/Pods/PodDetails/constants.ts

@@ -66,56 +66,116 @@ export const getPodMetricsQueryPayload = (
 	pod: K8sPodsData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sContainerNameKey = 'k8s.container.name';
+	const getKey = (dotKey: string, underscoreKey: string): string =>
+		dotMetricsEnabled ? dotKey : underscoreKey;
+	const k8sContainerNameKey = getKey('k8s.container.name', 'k8s_container_name');
 
-	const k8sPodCpuUtilKey = 'k8s.pod.cpu.usage';
+	const k8sPodCpuUtilKey = getKey('k8s.pod.cpu.usage', 'k8s_pod_cpu_usage');
 
-	const k8sPodCpuReqUtilKey = 'k8s.pod.cpu_request_utilization';
+	const k8sPodCpuReqUtilKey = getKey(
+		'k8s.pod.cpu_request_utilization',
+		'k8s_pod_cpu_request_utilization',
+	);
 
-	const k8sPodCpuLimitUtilKey = 'k8s.pod.cpu_limit_utilization';
+	const k8sPodCpuLimitUtilKey = getKey(
+		'k8s.pod.cpu_limit_utilization',
+		'k8s_pod_cpu_limit_utilization',
+	);
 
-	const k8sPodMemUsageKey = 'k8s.pod.memory.usage';
+	const k8sPodMemUsageKey = getKey(
+		'k8s.pod.memory.usage',
+		'k8s_pod_memory_usage',
+	);
 
-	const k8sPodMemReqUtilKey = 'k8s.pod.memory_request_utilization';
+	const k8sPodMemReqUtilKey = getKey(
+		'k8s.pod.memory_request_utilization',
+		'k8s_pod_memory_request_utilization',
+	);
 
-	const k8sPodMemLimitUtilKey = 'k8s.pod.memory_limit_utilization';
+	const k8sPodMemLimitUtilKey = getKey(
+		'k8s.pod.memory_limit_utilization',
+		'k8s_pod_memory_limit_utilization',
+	);
 
-	const k8sPodMemRssKey = 'k8s.pod.memory.rss';
+	const k8sPodMemRssKey = getKey('k8s.pod.memory.rss', 'k8s_pod_memory_rss');
 
-	const k8sPodMemWorkingSetKey = 'k8s.pod.memory.working_set';
+	const k8sPodMemWorkingSetKey = getKey(
+		'k8s.pod.memory.working_set',
+		'k8s_pod_memory_working_set',
+	);
 
-	const k8sPodMemMajorPFKey = 'k8s.pod.memory.major_page_faults';
+	const k8sPodMemMajorPFKey = getKey(
+		'k8s.pod.memory.major_page_faults',
+		'k8s_pod_memory_major_page_faults',
+	);
 
-	const containerCpuUtilKey = 'container.cpu.usage';
+	const containerCpuUtilKey = getKey(
+		'container.cpu.usage',
+		'container_cpu_usage',
+	);
 
-	const k8sContainerCpuRequestKey = 'k8s.container.cpu_request';
+	const k8sContainerCpuRequestKey = getKey(
+		'k8s.container.cpu_request',
+		'k8s_container_cpu_request',
+	);
 
-	const k8sContainerCpuLimitKey = 'k8s.container.cpu_limit';
+	const k8sContainerCpuLimitKey = getKey(
+		'k8s.container.cpu_limit',
+		'k8s_container_cpu_limit',
+	);
 
-	const k8sContainerMemoryLimitKey = 'k8s.container.memory_limit';
+	const k8sContainerMemoryLimitKey = getKey(
+		'k8s.container.memory_limit',
+		'k8s_container_memory_limit',
+	);
 
-	const k8sContainerMemoryRequestKey = 'k8s.container.memory_request';
+	const k8sContainerMemoryRequestKey = getKey(
+		'k8s.container.memory_request',
+		'k8s_container_memory_request',
+	);
 
-	const containerMemUsageKey = 'container.memory.usage';
+	const containerMemUsageKey = getKey(
+		'container.memory.usage',
+		'container_memory_usage',
+	);
 
-	const containerMemWorkingSetKey = 'container.memory.working_set';
+	const containerMemWorkingSetKey = getKey(
+		'container.memory.working_set',
+		'container_memory_working_set',
+	);
 
-	const containerMemRssKey = 'container.memory.rss';
+	const containerMemRssKey = getKey(
+		'container.memory.rss',
+		'container_memory_rss',
+	);
 
-	const k8sPodNetworkIoKey = 'k8s.pod.network.io';
+	const k8sPodNetworkIoKey = getKey('k8s.pod.network.io', 'k8s_pod_network_io');
 
-	const k8sPodNetworkErrorsKey = 'k8s.pod.network.errors';
+	const k8sPodNetworkErrorsKey = getKey(
+		'k8s.pod.network.errors',
+		'k8s_pod_network_errors',
+	);
 
-	const k8sPodFilesystemCapacityKey = 'k8s.pod.filesystem.capacity';
+	const k8sPodFilesystemCapacityKey = getKey(
+		'k8s.pod.filesystem.capacity',
+		'k8s_pod_filesystem_capacity',
+	);
 
-	const k8sPodFilesystemAvailableKey = 'k8s.pod.filesystem.available';
+	const k8sPodFilesystemAvailableKey = getKey(
+		'k8s.pod.filesystem.available',
+		'k8s_pod_filesystem_available',
+	);
 
-	const k8sPodFilesystemUsageKey = 'k8s.pod.filesystem.usage';
+	const k8sPodFilesystemUsageKey = getKey(
+		'k8s.pod.filesystem.usage',
+		'k8s_pod_filesystem_usage',
+	);
 
-	const k8sPodNameKey = 'k8s.pod.name';
+	const k8sPodNameKey = getKey('k8s.pod.name', 'k8s_pod_name');
 
-	const k8sNamespaceNameKey = 'k8s.namespace.name';
+	const k8sNamespaceNameKey = getKey('k8s.namespace.name', 'k8s_namespace_name');
 	return [
 		{
 			selectedTime: 'GLOBAL_TIME',

frontend/src/container/InfraMonitoringK8s/StatefulSets/K8sStatefulSetsList.tsx

@@ -26,6 +26,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -137,6 +139,11 @@ function K8sStatefulSetsList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sStatefulSetsRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -226,6 +233,8 @@ function K8sStatefulSetsList({
 			queryKey: groupedByRowDataQueryKey,
 			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const {
@@ -236,6 +245,7 @@ function K8sStatefulSetsList({
 			dataSource: currentQuery.builder.queryData[0].dataSource,
 			aggregateAttribute: GetK8sEntityToAggregateAttribute(
 				K8sCategory.STATEFULSETS,
+				dotMetricsEnabled,
 			),
 			aggregateOperator: 'noop',
 			searchText: '',
@@ -317,6 +327,8 @@ function K8sStatefulSetsList({
 			enabled: !!query,
 			keepPreviousData: true,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const statefulSetsData = useMemo(() => data?.payload?.data?.records || [], [

frontend/src/container/InfraMonitoringK8s/StatefulSets/StatefulSetDetails/constants.ts

@@ -38,25 +38,54 @@ export const getStatefulSetMetricsQueryPayload = (
 	statefulSet: K8sStatefulSetsData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sStatefulSetNameKey = 'k8s.statefulset.name';
-	const k8sNamespaceNameKey = 'k8s.namespace.name';
-	const k8sPodNameKey = 'k8s.pod.name';
+	const k8sStatefulSetNameKey = dotMetricsEnabled
+		? 'k8s.statefulset.name'
+		: 'k8s_statefulset_name';
+	const k8sNamespaceNameKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const k8sPodNameKey = dotMetricsEnabled ? 'k8s.pod.name' : 'k8s_pod_name';
 
-	const k8sPodCpuUtilKey = 'k8s.pod.cpu.usage';
-	const k8sContainerCpuRequestKey = 'k8s.container.cpu_request';
-	const k8sContainerCpuLimitKey = 'k8s.container.cpu_limit';
-	const k8sPodCpuReqUtilKey = 'k8s.pod.cpu_request_utilization';
-	const k8sPodCpuLimitUtilKey = 'k8s.pod.cpu_limit_utilization';
+	const k8sPodCpuUtilKey = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
+	const k8sContainerCpuRequestKey = dotMetricsEnabled
+		? 'k8s.container.cpu_request'
+		: 'k8s_container_cpu_request';
+	const k8sContainerCpuLimitKey = dotMetricsEnabled
+		? 'k8s.container.cpu_limit'
+		: 'k8s_container_cpu_limit';
+	const k8sPodCpuReqUtilKey = dotMetricsEnabled
+		? 'k8s.pod.cpu_request_utilization'
+		: 'k8s_pod_cpu_request_utilization';
+	const k8sPodCpuLimitUtilKey = dotMetricsEnabled
+		? 'k8s.pod.cpu_limit_utilization'
+		: 'k8s_pod_cpu_limit_utilization';
 
-	const k8sPodMemUsageKey = 'k8s.pod.memory.usage';
-	const k8sContainerMemRequestKey = 'k8s.container.memory_request';
-	const k8sContainerMemLimitKey = 'k8s.container.memory_limit';
-	const k8sPodMemReqUtilKey = 'k8s.pod.memory_request_utilization';
-	const k8sPodMemLimitUtilKey = 'k8s.pod.memory_limit_utilization';
+	const k8sPodMemUsageKey = dotMetricsEnabled
+		? 'k8s.pod.memory.usage'
+		: 'k8s_pod_memory_usage';
+	const k8sContainerMemRequestKey = dotMetricsEnabled
+		? 'k8s.container.memory_request'
+		: 'k8s_container_memory_request';
+	const k8sContainerMemLimitKey = dotMetricsEnabled
+		? 'k8s.container.memory_limit'
+		: 'k8s_container_memory_limit';
+	const k8sPodMemReqUtilKey = dotMetricsEnabled
+		? 'k8s.pod.memory_request_utilization'
+		: 'k8s_pod_memory_request_utilization';
+	const k8sPodMemLimitUtilKey = dotMetricsEnabled
+		? 'k8s.pod.memory_limit_utilization'
+		: 'k8s_pod_memory_limit_utilization';
 
-	const k8sPodNetworkIoKey = 'k8s.pod.network.io';
-	const k8sPodNetworkErrorsKey = 'k8s.pod.network.errors';
+	const k8sPodNetworkIoKey = dotMetricsEnabled
+		? 'k8s.pod.network.io'
+		: 'k8s_pod_network_io';
+	const k8sPodNetworkErrorsKey = dotMetricsEnabled
+		? 'k8s.pod.network.errors'
+		: 'k8s_pod_network_errors';
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/StatefulSets/utils.tsx

@@ -236,7 +236,7 @@ export const getK8sStatefulSetsListColumns = (
 	return columnsConfig as ColumnType<K8sStatefulSetsRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sStatefulSetsData['meta']> = {
+const dotToUnder: Record<string, keyof K8sStatefulSetsData['meta']> = {
 	'k8s.namespace.name': 'k8s_namespace_name',
 	'k8s.statefulset.name': 'k8s_statefulset_name',
 };
@@ -251,7 +251,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
+		const metaKey = (dotToUnder[rawKey] ??
 			rawKey) as keyof typeof statefulSet.meta;
 		const value = statefulSet.meta[metaKey];
 

frontend/src/container/InfraMonitoringK8s/Volumes/K8sVolumesList.tsx

@@ -26,6 +26,8 @@ import { AppState } from 'store/reducers';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import { getOrderByFromParams } from '../commonUtils';
 import {
 	GetK8sEntityToAggregateAttribute,
@@ -137,6 +139,11 @@ function K8sVolumesList({
 		}
 	}, [quickFiltersLastUpdated]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const createFiltersForSelectedRowData = (
 		selectedRowData: K8sVolumesRowData,
 		groupBy: IBuilderQuery['groupBy'],
@@ -194,10 +201,15 @@ function K8sVolumesList({
 		isLoading: isLoadingGroupedByRowData,
 		isError: isErrorGroupedByRowData,
 		refetch: fetchGroupedByRowData,
-	} = useGetK8sVolumesList(fetchGroupedByRowDataQuery as K8sVolumesListPayload, {
-		queryKey: ['volumeList', fetchGroupedByRowDataQuery],
-		enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
-	});
+	} = useGetK8sVolumesList(
+		fetchGroupedByRowDataQuery as K8sVolumesListPayload,
+		{
+			queryKey: ['volumeList', fetchGroupedByRowDataQuery],
+			enabled: !!fetchGroupedByRowDataQuery && !!selectedRowData,
+		},
+		undefined,
+		dotMetricsEnabled,
+	);
 
 	const {
 		data: groupByFiltersData,
@@ -205,7 +217,10 @@ function K8sVolumesList({
 	} = useGetAggregateKeys(
 		{
 			dataSource: currentQuery.builder.queryData[0].dataSource,
-			aggregateAttribute: GetK8sEntityToAggregateAttribute(K8sCategory.NODES),
+			aggregateAttribute: GetK8sEntityToAggregateAttribute(
+				K8sCategory.NODES,
+				dotMetricsEnabled,
+			),
 			aggregateOperator: 'noop',
 			searchText: '',
 			tagType: '',
@@ -253,6 +268,8 @@ function K8sVolumesList({
 			queryKey: ['volumeList', query],
 			enabled: !!query,
 		},
+		undefined,
+		dotMetricsEnabled,
 	);
 
 	const volumesData = useMemo(() => data?.payload?.data?.records || [], [data]);

frontend/src/container/InfraMonitoringK8s/Volumes/VolumeDetails/constants.ts

@@ -34,17 +34,38 @@ export const getVolumeQueryPayload = (
 	volume: K8sVolumesData,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sClusterNameKey = 'k8s.cluster.name';
-	const k8sNamespaceNameKey = 'k8s.namespace.name';
-	const k8sVolumeAvailableKey = 'k8s.volume.available';
-	const k8sVolumeCapacityKey = 'k8s.volume.capacity';
-	const k8sVolumeInodesUsedKey = 'k8s.volume.inodes.used';
-	const k8sVolumeInodesKey = 'k8s.volume.inodes';
-	const k8sVolumeInodesFreeKey = 'k8s.volume.inodes.free';
-	const k8sVolumeTypeKey = 'k8s.volume.type';
-	const k8sPVCNameKey = 'k8s.persistentvolumeclaim.name';
-	const legendTemplate = '{{k8s.namespace.name}}-{{k8s.pod.name}}';
+	const k8sClusterNameKey = dotMetricsEnabled
+		? 'k8s.cluster.name'
+		: 'k8s_cluster_name';
+	const k8sNamespaceNameKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const k8sVolumeAvailableKey = dotMetricsEnabled
+		? 'k8s.volume.available'
+		: 'k8s_volume_available';
+	const k8sVolumeCapacityKey = dotMetricsEnabled
+		? 'k8s.volume.capacity'
+		: 'k8s_volume_capacity';
+	const k8sVolumeInodesUsedKey = dotMetricsEnabled
+		? 'k8s.volume.inodes.used'
+		: 'k8s_volume_inodes_used';
+	const k8sVolumeInodesKey = dotMetricsEnabled
+		? 'k8s.volume.inodes'
+		: 'k8s_volume_inodes';
+	const k8sVolumeInodesFreeKey = dotMetricsEnabled
+		? 'k8s.volume.inodes.free'
+		: 'k8s_volume_inodes_free';
+	const k8sVolumeTypeKey = dotMetricsEnabled
+		? 'k8s.volume.type'
+		: 'k8s_volume_type';
+	const k8sPVCNameKey = dotMetricsEnabled
+		? 'k8s.persistentvolumeclaim.name'
+		: 'k8s_persistentvolumeclaim_name';
+	const legendTemplate = dotMetricsEnabled
+		? '{{k8s.namespace.name}}-{{k8s.pod.name}}'
+		: '{{k8s_namespace_name}}-{{k8s_pod_name}}';
 
 	return [
 		{

frontend/src/container/InfraMonitoringK8s/Volumes/utils.tsx

@@ -142,7 +142,7 @@ export const getK8sVolumesListColumns = (
 	return columnsConfig as ColumnType<K8sVolumesRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sVolumesData['meta']> = {
+const dotToUnder: Record<string, keyof K8sVolumesData['meta']> = {
 	'k8s.namespace.name': 'k8s_namespace_name',
 	'k8s.node.name': 'k8s_node_name',
 	'k8s.pod.name': 'k8s_pod_name',
@@ -161,8 +161,7 @@ const getGroupByEle = (
 	groupBy.forEach((group) => {
 		const rawKey = group.key as string;
 
-		const metaKey = (attributeToMetaKey[rawKey] ??
-			rawKey) as keyof typeof volume.meta;
+		const metaKey = (dotToUnder[rawKey] ?? rawKey) as keyof typeof volume.meta;
 
 		const value = volume.meta[metaKey];
 

frontend/src/container/InfraMonitoringK8s/constants.ts

@@ -36,7 +36,21 @@ export const K8sCategories = {
 	VOLUMES: 'volumes',
 };
 
-export const K8sEntityToAggregateAttributeMap = {
+export const underscoreMap = {
+	[K8sCategory.HOSTS]: 'system_cpu_load_average_15m',
+	[K8sCategory.PODS]: 'k8s_pod_cpu_usage',
+	[K8sCategory.NODES]: 'k8s_node_cpu_usage',
+	[K8sCategory.NAMESPACES]: 'k8s_pod_cpu_usage',
+	[K8sCategory.CLUSTERS]: 'k8s_node_cpu_usage',
+	[K8sCategory.DEPLOYMENTS]: 'k8s_pod_cpu_usage',
+	[K8sCategory.STATEFULSETS]: 'k8s_pod_cpu_usage',
+	[K8sCategory.DAEMONSETS]: 'k8s_pod_cpu_usage',
+	[K8sCategory.CONTAINERS]: 'k8s_pod_cpu_usage',
+	[K8sCategory.JOBS]: 'k8s_job_desired_successful_pods',
+	[K8sCategory.VOLUMES]: 'k8s_volume_capacity',
+};
+
+export const dotMap = {
 	[K8sCategory.HOSTS]: 'system.cpu.load_average.15m',
 	[K8sCategory.PODS]: 'k8s.pod.cpu.usage',
 	[K8sCategory.NODES]: 'k8s.node.cpu.usage',
@@ -52,23 +66,51 @@ export const K8sEntityToAggregateAttributeMap = {
 
 export function GetK8sEntityToAggregateAttribute(
 	category: K8sCategory,
+	dotMetricsEnabled: boolean,
 ): string {
-	return K8sEntityToAggregateAttributeMap[category];
+	return dotMetricsEnabled ? dotMap[category] : underscoreMap[category];
 }
 
-export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetPodsQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const podKey = dotMetricsEnabled ? 'k8s.pod.name' : 'k8s_pod_name';
+	const namespaceKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const nodeKey = dotMetricsEnabled ? 'k8s.node.name' : 'k8s_node_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const deploymentKey = dotMetricsEnabled
+		? 'k8s.deployment.name'
+		: 'k8s_deployment_name';
+	const statefulsetKey = dotMetricsEnabled
+		? 'k8s.statefulset.name'
+		: 'k8s_statefulset_name';
+	const daemonsetKey = dotMetricsEnabled
+		? 'k8s.daemonset.name'
+		: 'k8s_daemonset_name';
+	const jobKey = dotMetricsEnabled ? 'k8s.job.name' : 'k8s_job_name';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
+	// Define aggregate attribute (metric) name
+	const cpuUtilizationMetric = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Pod',
 			attributeKey: {
-				key: 'k8s.pod.name',
+				key: podKey,
 				dataType: DataTypes.String,
 				type: 'tag',
-				id: 'k8s.pod.name--string--tag--true',
+				id: `${podKey}--string--tag--true`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -76,13 +118,13 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Namespace',
 			attributeKey: {
-				key: 'k8s.namespace.name',
+				key: namespaceKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.namespace.name--string--resource--false',
+				id: `${namespaceKey}--string--resource--false`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: false,
 		},
@@ -90,13 +132,13 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Node',
 			attributeKey: {
-				key: 'k8s.node.name',
+				key: nodeKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.node.name--string--resource--false',
+				id: `${nodeKey}--string--resource--false`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: false,
 		},
@@ -104,13 +146,13 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.cluster.name--string--resource--false',
+				id: `${clusterKey}--string--resource--false`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: false,
 		},
@@ -118,13 +160,13 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Deployment',
 			attributeKey: {
-				key: 'k8s.deployment.name',
+				key: deploymentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.deployment.name--string--resource--false',
+				id: `${deploymentKey}--string--resource--false`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: false,
 		},
@@ -132,13 +174,13 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Statefulset',
 			attributeKey: {
-				key: 'k8s.statefulset.name',
+				key: statefulsetKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.statefulset.name--string--resource--false',
+				id: `${statefulsetKey}--string--resource--false`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: false,
 		},
@@ -146,13 +188,13 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'DaemonSet',
 			attributeKey: {
-				key: 'k8s.daemonset.name',
+				key: daemonsetKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.daemonset.name--string--resource--false',
+				id: `${daemonsetKey}--string--resource--false`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: false,
 		},
@@ -160,13 +202,13 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Job',
 			attributeKey: {
-				key: 'k8s.job.name',
+				key: jobKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.job.name--string--resource--false',
+				id: `${jobKey}--string--resource--false`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilizationMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: false,
 		},
@@ -174,7 +216,7 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -183,19 +225,33 @@ export function GetPodsQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetNodesQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetNodesQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	// Define attribute keys
+	const nodeKey = dotMetricsEnabled ? 'k8s.node.name' : 'k8s_node_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+
+	// Define aggregate metric name for node CPU utilization
+	const cpuUtilMetric = dotMetricsEnabled
+		? 'k8s.node.cpu.usage'
+		: 'k8s_node_cpu_usage';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Node Name',
 			attributeKey: {
-				key: 'k8s.node.name',
+				key: nodeKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.node.name--string--resource--true',
+				id: `${nodeKey}--string--resource--true`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.node.cpu.usage',
+			aggregateAttribute: cpuUtilMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -203,13 +259,13 @@ export function GetNodesQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.cluster.name--string--resource--true',
+				id: `${clusterKey}--string--resource--true`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.node.cpu.usage',
+			aggregateAttribute: cpuUtilMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -217,7 +273,7 @@ export function GetNodesQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -226,19 +282,32 @@ export function GetNodesQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetNamespaceQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetNamespaceQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const namespaceKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const cpuUtilMetric = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Namespace Name',
 			attributeKey: {
-				key: 'k8s.namespace.name',
+				key: namespaceKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.namespace.name--string--resource',
+				id: `${namespaceKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -246,13 +315,13 @@ export function GetNamespaceQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.cluster.name--string--resource',
+				id: `${clusterKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: cpuUtilMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -260,7 +329,7 @@ export function GetNamespaceQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -269,19 +338,29 @@ export function GetNamespaceQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetClustersQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetClustersQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const cpuUtilMetric = dotMetricsEnabled
+		? 'k8s.node.cpu.usage'
+		: 'k8s_node_cpu_usage';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.cluster.name--string--resource',
+				id: `${clusterKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.node.cpu.usage',
+			aggregateAttribute: cpuUtilMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -289,7 +368,7 @@ export function GetClustersQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -298,16 +377,25 @@ export function GetClustersQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetContainersQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetContainersQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const containerKey = dotMetricsEnabled
+		? 'k8s.container.name'
+		: 'k8s_container_name';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Container',
 			attributeKey: {
-				key: 'k8s.container.name',
+				key: containerKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.container.name--string--resource',
+				id: `${containerKey}--string--resource`,
 			},
 			defaultOpen: true,
 		},
@@ -315,7 +403,7 @@ export function GetContainersQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -324,19 +412,35 @@ export function GetContainersQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetVolumesQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetVolumesQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const pvcKey = dotMetricsEnabled
+		? 'k8s.persistentvolumeclaim.name'
+		: 'k8s_persistentvolumeclaim_name';
+	const namespaceKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const volumeMetric = dotMetricsEnabled
+		? 'k8s.volume.capacity'
+		: 'k8s_volume_capacity';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'PVC Volume Claim Name',
 			attributeKey: {
-				key: 'k8s.persistentvolumeclaim.name',
+				key: pvcKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.persistentvolumeclaim.name--string--resource',
+				id: `${pvcKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.volume.capacity',
+			aggregateAttribute: volumeMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -344,13 +448,13 @@ export function GetVolumesQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Namespace Name',
 			attributeKey: {
-				key: 'k8s.namespace.name',
+				key: namespaceKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.namespace.name--string--resource',
+				id: `${namespaceKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.volume.capacity',
+			aggregateAttribute: volumeMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -358,13 +462,13 @@ export function GetVolumesQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.cluster.name--string--resource',
+				id: `${clusterKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.volume.capacity',
+			aggregateAttribute: volumeMetric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -372,7 +476,7 @@ export function GetVolumesQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -381,19 +485,33 @@ export function GetVolumesQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetDeploymentsQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetDeploymentsQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const deployKey = dotMetricsEnabled
+		? 'k8s.deployment.name'
+		: 'k8s_deployment_name';
+	const namespaceKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const metric = dotMetricsEnabled ? 'k8s.pod.cpu.usage' : 'k8s_pod_cpu_usage';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Deployment Name',
 			attributeKey: {
-				key: 'k8s.deployment.name',
+				key: deployKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.deployment.name--string--resource',
+				id: `${deployKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -401,13 +519,13 @@ export function GetDeploymentsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Namespace Name',
 			attributeKey: {
-				key: 'k8s.namespace.name',
+				key: namespaceKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.namespace.name--string--resource',
+				id: `${namespaceKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -415,13 +533,13 @@ export function GetDeploymentsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.cluster.name--string--resource',
+				id: `${clusterKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -429,7 +547,7 @@ export function GetDeploymentsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -438,19 +556,33 @@ export function GetDeploymentsQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetStatefulsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetStatefulsetsQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const ssKey = dotMetricsEnabled
+		? 'k8s.statefulset.name'
+		: 'k8s_statefulset_name';
+	const namespaceKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const metric = dotMetricsEnabled ? 'k8s.pod.cpu.usage' : 'k8s_pod_cpu_usage';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Statefulset Name',
 			attributeKey: {
-				key: 'k8s.statefulset.name',
+				key: ssKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.statefulset.name--string--resource',
+				id: `${ssKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -458,13 +590,13 @@ export function GetStatefulsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Namespace Name',
 			attributeKey: {
-				key: 'k8s.namespace.name',
+				key: namespaceKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.namespace.name--string--resource',
+				id: `${namespaceKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -472,13 +604,13 @@ export function GetStatefulsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.cluster.name--string--resource',
+				id: `${clusterKey}--string--resource`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metric,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -486,7 +618,7 @@ export function GetStatefulsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -495,19 +627,35 @@ export function GetStatefulsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetDaemonsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetDaemonsetsQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const nameKey = dotMetricsEnabled
+		? 'k8s.daemonset.name'
+		: 'k8s_daemonset_name';
+	const namespaceKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const metricName = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'DaemonSet Name',
 			attributeKey: {
-				key: 'k8s.daemonset.name',
+				key: nameKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.daemonset.name--string--resource--true',
+				id: `${nameKey}--string--resource--true`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -515,12 +663,12 @@ export function GetDaemonsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Namespace Name',
 			attributeKey: {
-				key: 'k8s.namespace.name',
+				key: namespaceKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -528,12 +676,12 @@ export function GetDaemonsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -541,7 +689,7 @@ export function GetDaemonsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
@@ -550,19 +698,33 @@ export function GetDaemonsetsQuickFiltersConfig(): IQuickFiltersConfig[] {
 	];
 }
 
-export function GetJobsQuickFiltersConfig(): IQuickFiltersConfig[] {
+export function GetJobsQuickFiltersConfig(
+	dotMetricsEnabled: boolean,
+): IQuickFiltersConfig[] {
+	const nameKey = dotMetricsEnabled ? 'k8s.job.name' : 'k8s_job_name';
+	const namespaceKey = dotMetricsEnabled
+		? 'k8s.namespace.name'
+		: 'k8s_namespace_name';
+	const clusterKey = dotMetricsEnabled ? 'k8s.cluster.name' : 'k8s_cluster_name';
+	const metricName = dotMetricsEnabled
+		? 'k8s.pod.cpu.usage'
+		: 'k8s_pod_cpu_usage';
+	const environmentKey = dotMetricsEnabled
+		? 'deployment.environment'
+		: 'deployment_environment';
+
 	return [
 		{
 			type: FiltersType.CHECKBOX,
 			title: 'Job Name',
 			attributeKey: {
-				key: 'k8s.job.name',
+				key: nameKey,
 				dataType: DataTypes.String,
 				type: 'resource',
-				id: 'k8s.job.name--string--resource--true',
+				id: `${nameKey}--string--resource--true`,
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -570,12 +732,12 @@ export function GetJobsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Namespace Name',
 			attributeKey: {
-				key: 'k8s.namespace.name',
+				key: namespaceKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -583,12 +745,12 @@ export function GetJobsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Cluster Name',
 			attributeKey: {
-				key: 'k8s.cluster.name',
+				key: clusterKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},
 			aggregateOperator: 'noop',
-			aggregateAttribute: 'k8s.pod.cpu.usage',
+			aggregateAttribute: metricName,
 			dataSource: DataSource.METRICS,
 			defaultOpen: true,
 		},
@@ -596,7 +758,7 @@ export function GetJobsQuickFiltersConfig(): IQuickFiltersConfig[] {
 			type: FiltersType.CHECKBOX,
 			title: 'Environment',
 			attributeKey: {
-				key: 'deployment.environment',
+				key: environmentKey,
 				dataType: DataTypes.String,
 				type: 'resource',
 			},

frontend/src/container/InfraMonitoringK8s/utils.tsx

@@ -299,7 +299,7 @@ export const getK8sPodsListColumns = (
 	return updatedColumnsConfig as ColumnType<K8sPodsRowData>[];
 };
 
-const attributeToMetaKey: Record<string, keyof K8sPodsData['meta']> = {
+const dotToUnder: Record<string, keyof K8sPodsData['meta']> = {
 	'k8s.cronjob.name': 'k8s_cronjob_name',
 	'k8s.daemonset.name': 'k8s_daemonset_name',
 	'k8s.deployment.name': 'k8s_deployment_name',
@@ -322,8 +322,7 @@ const getGroupByEle = (
 		const rawKey = group.key as string;
 
 		// Choose mapped key if present, otherwise use rawKey
-		const metaKey = (attributeToMetaKey[rawKey] ??
-			rawKey) as keyof typeof pod.meta;
+		const metaKey = (dotToUnder[rawKey] ?? rawKey) as keyof typeof pod.meta;
 		const value = pod.meta[metaKey];
 
 		groupByValues.push(value);

frontend/src/container/IngestionSettings/MultiIngestionSettings.tsx

@@ -2,6 +2,7 @@
 /* eslint-disable jsx-a11y/click-events-have-key-events */
 import { ChangeEvent, useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
+import { useMutation } from 'react-query';
 import { useHistory } from 'react-router-dom';
 import { useCopyToClipboard } from 'react-use';
 import { Color } from '@signozhq/design-tokens';
@@ -26,20 +27,12 @@ import {
 } from 'antd';
 import { NotificationInstance } from 'antd/es/notification/interface';
 import { CollapseProps } from 'antd/lib';
-import {
-	useCreateIngestionKey,
-	useCreateIngestionKeyLimit,
-	useDeleteIngestionKey,
-	useDeleteIngestionKeyLimit,
-	useGetIngestionKeys,
-	useSearchIngestionKeys,
-	useUpdateIngestionKey,
-	useUpdateIngestionKeyLimit,
-} from 'api/generated/services/gateway';
-import {
-	GatewaytypesIngestionKeyDTO,
-	RenderErrorResponseDTO,
-} from 'api/generated/services/sigNoz.schemas';
+import createIngestionKeyApi from 'api/IngestionKeys/createIngestionKey';
+import deleteIngestionKey from 'api/IngestionKeys/deleteIngestionKey';
+import createLimitForIngestionKeyApi from 'api/IngestionKeys/limits/createLimitsForKey';
+import deleteLimitsForIngestionKey from 'api/IngestionKeys/limits/deleteLimitsForIngestionKey';
+import updateLimitForIngestionKeyApi from 'api/IngestionKeys/limits/updateLimitsForIngestionKey';
+import updateIngestionKey from 'api/IngestionKeys/updateIngestionKey';
 import { AxiosError } from 'axios';
 import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
 import Tags from 'components/Tags/Tags';
@@ -51,6 +44,7 @@ import ROUTES from 'constants/routes';
 import { INITIAL_ALERT_THRESHOLD_STATE } from 'container/CreateAlertV2/context/constants';
 import dayjs from 'dayjs';
 import { useGetGlobalConfig } from 'hooks/globalConfig/useGetGlobalConfig';
+import { useGetAllIngestionsKeys } from 'hooks/IngestionKeys/useGetAllIngestionKeys';
 import useDebouncedFn from 'hooks/useDebouncedFunction';
 import { useNotifications } from 'hooks/useNotifications';
 import { cloneDeep, isNil, isUndefined } from 'lodash-es';
@@ -72,12 +66,16 @@ import {
 } from 'lucide-react';
 import { useAppContext } from 'providers/App/App';
 import { useTimezone } from 'providers/Timezone';
+import { ErrorResponse } from 'types/api';
 import {
 	AddLimitProps,
 	LimitProps,
 	UpdateLimitProps,
 } from 'types/api/ingestionKeys/limits/types';
-import { PaginationProps } from 'types/api/ingestionKeys/types';
+import {
+	IngestionKeyProps,
+	PaginationProps,
+} from 'types/api/ingestionKeys/types';
 import { MeterAggregateOperator } from 'types/common/queryBuilder';
 import { USER_ROLES } from 'types/roles';
 import { getDaysUntilExpiry } from 'utils/timeUtils';
@@ -88,10 +86,6 @@ const { Option } = Select;
 
 const BYTES = 1073741824;
 
-const INITIAL_PAGE_SIZE = 10;
-const SEARCH_PAGE_SIZE = 100;
-const FIRST_PAGE = 1;
-
 const COUNT_MULTIPLIER = {
 	thousand: 1000,
 	million: 1000000,
@@ -117,8 +111,6 @@ export const showErrorNotification = (
 ): void => {
 	notifications.error({
 		message: err.message || SOMETHING_WENT_WRONG,
-		description: (err as AxiosError<RenderErrorResponseDTO>).response?.data?.error
-			?.message,
 	});
 };
 
@@ -171,20 +163,15 @@ function MultiIngestionSettings(): JSX.Element {
 	const [updatedTags, setUpdatedTags] = useState<string[]>([]);
 	const [isEditModalOpen, setIsEditModalOpen] = useState(false);
 	const [isEditAddLimitOpen, setIsEditAddLimitOpen] = useState(false);
-	const [
-		activeAPIKey,
-		setActiveAPIKey,
-	] = useState<GatewaytypesIngestionKeyDTO | null>(null);
+	const [activeAPIKey, setActiveAPIKey] = useState<IngestionKeyProps | null>();
 	const [activeSignal, setActiveSignal] = useState<LimitProps | null>(null);
 
 	const [searchValue, setSearchValue] = useState<string>('');
 	const [searchText, setSearchText] = useState<string>('');
-	const [dataSource, setDataSource] = useState<GatewaytypesIngestionKeyDTO[]>(
-		[],
-	);
+	const [dataSource, setDataSource] = useState<IngestionKeyProps[]>([]);
 	const [paginationParams, setPaginationParams] = useState<PaginationProps>({
-		page: FIRST_PAGE,
-		per_page: INITIAL_PAGE_SIZE,
+		page: 1,
+		per_page: 10,
 	});
 
 	const [totalIngestionKeys, setTotalIngestionKeys] = useState(0);
@@ -199,7 +186,7 @@ function MultiIngestionSettings(): JSX.Element {
 	const [
 		createLimitForIngestionKeyError,
 		setCreateLimitForIngestionKeyError,
-	] = useState<string | null>(null);
+	] = useState<ErrorResponse | null>(null);
 
 	const [
 		hasUpdateLimitForIngestionKeyError,
@@ -209,7 +196,7 @@ function MultiIngestionSettings(): JSX.Element {
 	const [
 		updateLimitForIngestionKeyError,
 		setUpdateLimitForIngestionKeyError,
-	] = useState<string | null>(null);
+	] = useState<ErrorResponse | null>(null);
 
 	const { t } = useTranslation(['ingestionKeys']);
 
@@ -229,11 +216,7 @@ function MultiIngestionSettings(): JSX.Element {
 		handleFormReset();
 	};
 
-	const showDeleteModal = (apiKey: GatewaytypesIngestionKeyDTO): void => {
-		setHasCreateLimitForIngestionKeyError(false);
-		setCreateLimitForIngestionKeyError(null);
-		setHasUpdateLimitForIngestionKeyError(false);
-		setUpdateLimitForIngestionKeyError(null);
+	const showDeleteModal = (apiKey: IngestionKeyProps): void => {
 		setActiveAPIKey(apiKey);
 		setIsDeleteModalOpen(true);
 	};
@@ -250,11 +233,7 @@ function MultiIngestionSettings(): JSX.Element {
 		setIsAddModalOpen(false);
 	};
 
-	const showEditModal = (apiKey: GatewaytypesIngestionKeyDTO): void => {
-		setHasCreateLimitForIngestionKeyError(false);
-		setCreateLimitForIngestionKeyError(null);
-		setHasUpdateLimitForIngestionKeyError(false);
-		setUpdateLimitForIngestionKeyError(null);
+	const showEditModal = (apiKey: IngestionKeyProps): void => {
 		setActiveAPIKey(apiKey);
 		handleFormReset();
 		setUpdatedTags(apiKey.tags || []);
@@ -269,10 +248,6 @@ function MultiIngestionSettings(): JSX.Element {
 	};
 
 	const showAddModal = (): void => {
-		setHasCreateLimitForIngestionKeyError(false);
-		setCreateLimitForIngestionKeyError(null);
-		setHasUpdateLimitForIngestionKeyError(false);
-		setUpdateLimitForIngestionKeyError(null);
 		setUpdatedTags([]);
 		setActiveAPIKey(null);
 		setIsAddModalOpen(true);
@@ -283,62 +258,27 @@ function MultiIngestionSettings(): JSX.Element {
 		setActiveSignal(null);
 	};
 
-	// Use search API when searchText is present, otherwise use normal get API
-	const isSearching = searchText.length > 0;
-
 	const {
-		data: ingestionKeysData,
-		isLoading: isLoadingGet,
-		isRefetching: isRefetchingGet,
-		refetch: refetchGetAPIKeys,
-		error: getError,
-		isError: isGetError,
-	} = useGetIngestionKeys(
-		{
-			...paginationParams,
-		},
-		{
-			query: {
-				enabled: !isSearching,
-			},
-		},
-	);
-
-	const {
-		data: searchIngestionKeysData,
-		isLoading: isLoadingSearch,
-		isRefetching: isRefetchingSearch,
-		refetch: refetchSearchAPIKeys,
-		error: searchError,
-		isError: isSearchError,
-	} = useSearchIngestionKeys(
-		{
-			page: FIRST_PAGE,
-			per_page: SEARCH_PAGE_SIZE,
-			name: searchText,
-		},
-		{
-			query: {
-				enabled: isSearching,
-			},
-		},
-	);
-
-	// Use the appropriate data based on which API is active
-	const ingestionKeys = isSearching
-		? searchIngestionKeysData
-		: ingestionKeysData;
-	const isLoading = isSearching ? isLoadingSearch : isLoadingGet;
-	const isRefetching = isSearching ? isRefetchingSearch : isRefetchingGet;
-	const refetchAPIKeys = isSearching ? refetchSearchAPIKeys : refetchGetAPIKeys;
-	const error = isSearching ? searchError : getError;
-	const isError = isSearching ? isSearchError : isGetError;
+		data: IngestionKeys,
+		isLoading,
+		isRefetching,
+		refetch: refetchAPIKeys,
+		error,
+		isError,
+	} = useGetAllIngestionsKeys({
+		search: searchText,
+		...paginationParams,
+	});
 
 	useEffect(() => {
-		setDataSource(ingestionKeys?.data.data?.keys || []);
-		setTotalIngestionKeys(ingestionKeys?.data?.data?._pagination?.total || 0);
+		setActiveAPIKey(IngestionKeys?.data.data[0]);
+	}, [IngestionKeys]);
+
+	useEffect(() => {
+		setDataSource(IngestionKeys?.data.data || []);
+		setTotalIngestionKeys(IngestionKeys?.data?._pagination?.total || 0);
 		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [ingestionKeys?.data?.data]);
+	}, [IngestionKeys?.data?.data]);
 
 	useEffect(() => {
 		if (isError) {
@@ -357,7 +297,6 @@ function MultiIngestionSettings(): JSX.Element {
 
 	const clearSearch = (): void => {
 		setSearchValue('');
-		setSearchText('');
 	};
 
 	const {
@@ -370,54 +309,101 @@ function MultiIngestionSettings(): JSX.Element {
 	const {
 		mutate: createIngestionKey,
 		isLoading: isLoadingCreateAPIKey,
-	} = useCreateIngestionKey<AxiosError<RenderErrorResponseDTO>>();
+	} = useMutation(createIngestionKeyApi, {
+		onSuccess: (data) => {
+			setActiveAPIKey(data.payload);
+			setUpdatedTags([]);
+			hideAddViewModal();
+			refetchAPIKeys();
+		},
+		onError: (error) => {
+			showErrorNotification(notifications, error as AxiosError);
+		},
+	});
 
-	const {
-		mutate: updateAPIKey,
-		isLoading: isLoadingUpdateAPIKey,
-	} = useUpdateIngestionKey<AxiosError<RenderErrorResponseDTO>>();
+	const { mutate: updateAPIKey, isLoading: isLoadingUpdateAPIKey } = useMutation(
+		updateIngestionKey,
+		{
+			onSuccess: () => {
+				refetchAPIKeys();
+				setIsEditModalOpen(false);
+			},
+			onError: (error) => {
+				showErrorNotification(notifications, error as AxiosError);
+			},
+		},
+	);
 
-	const {
-		mutate: deleteAPIKey,
-		isLoading: isDeleteingAPIKey,
-	} = useDeleteIngestionKey<AxiosError<RenderErrorResponseDTO>>();
+	const { mutate: deleteAPIKey, isLoading: isDeleteingAPIKey } = useMutation(
+		deleteIngestionKey,
+		{
+			onSuccess: () => {
+				refetchAPIKeys();
+				setIsDeleteModalOpen(false);
+			},
+			onError: (error) => {
+				showErrorNotification(notifications, error as AxiosError);
+			},
+		},
+	);
 
 	const {
 		mutate: createLimitForIngestionKey,
 		isLoading: isLoadingLimitForKey,
-	} = useCreateIngestionKeyLimit<AxiosError<RenderErrorResponseDTO>>();
+	} = useMutation(createLimitForIngestionKeyApi, {
+		onSuccess: () => {
+			setActiveSignal(null);
+			setActiveAPIKey(null);
+			setIsEditAddLimitOpen(false);
+			setUpdatedTags([]);
+			hideAddViewModal();
+			refetchAPIKeys();
+			setHasCreateLimitForIngestionKeyError(false);
+		},
+		onError: (error: ErrorResponse) => {
+			setHasCreateLimitForIngestionKeyError(true);
+			setCreateLimitForIngestionKeyError(error);
+		},
+	});
 
 	const {
 		mutate: updateLimitForIngestionKey,
 		isLoading: isLoadingUpdatedLimitForKey,
-	} = useUpdateIngestionKeyLimit<AxiosError<RenderErrorResponseDTO>>();
+	} = useMutation(updateLimitForIngestionKeyApi, {
+		onSuccess: () => {
+			setActiveSignal(null);
+			setActiveAPIKey(null);
+			setIsEditAddLimitOpen(false);
+			setUpdatedTags([]);
+			hideAddViewModal();
+			refetchAPIKeys();
+			setHasUpdateLimitForIngestionKeyError(false);
+		},
+		onError: (error: ErrorResponse) => {
+			setHasUpdateLimitForIngestionKeyError(true);
+			setUpdateLimitForIngestionKeyError(error);
+		},
+	});
 
-	const {
-		mutate: deleteLimitForKey,
-		isLoading: isDeletingLimit,
-	} = useDeleteIngestionKeyLimit<AxiosError<RenderErrorResponseDTO>>();
+	const { mutate: deleteLimitForKey, isLoading: isDeletingLimit } = useMutation(
+		deleteLimitsForIngestionKey,
+		{
+			onSuccess: () => {
+				setIsDeleteModalOpen(false);
+				setIsDeleteLimitModalOpen(false);
+				refetchAPIKeys();
+			},
+			onError: (error) => {
+				showErrorNotification(notifications, error as AxiosError);
+			},
+		},
+	);
 
 	const onDeleteHandler = (): void => {
 		clearSearch();
 
-		if (activeAPIKey && activeAPIKey.id) {
-			deleteAPIKey(
-				{
-					pathParams: { keyId: activeAPIKey.id },
-				},
-				{
-					onSuccess: () => {
-						notifications.success({
-							message: 'Ingestion key deleted successfully',
-						});
-						refetchAPIKeys();
-						setIsDeleteModalOpen(false);
-					},
-					onError: (error) => {
-						showErrorNotification(notifications, error as AxiosError);
-					},
-				},
-			);
+		if (activeAPIKey) {
+			deleteAPIKey(activeAPIKey.id);
 		}
 	};
 
@@ -425,31 +411,15 @@ function MultiIngestionSettings(): JSX.Element {
 		editForm
 			.validateFields()
 			.then((values) => {
-				if (activeAPIKey && activeAPIKey.id) {
-					updateAPIKey(
-						{
-							pathParams: { keyId: activeAPIKey.id },
-							data: {
-								name: values.name,
-								tags: updatedTags,
-								expires_at: new Date(
-									dayjs(values.expires_at).endOf('day').toISOString(),
-								),
-							},
+				if (activeAPIKey) {
+					updateAPIKey({
+						id: activeAPIKey.id,
+						data: {
+							name: values.name,
+							tags: updatedTags,
+							expires_at: dayjs(values.expires_at).endOf('day').toISOString(),
 						},
-						{
-							onSuccess: () => {
-								notifications.success({
-									message: 'Ingestion key updated successfully',
-								});
-								refetchAPIKeys();
-								setIsEditModalOpen(false);
-							},
-							onError: (error) => {
-								showErrorNotification(notifications, error as AxiosError);
-							},
-						},
-					);
+					});
 				}
 			})
 			.catch((errorInfo) => {
@@ -465,30 +435,10 @@ function MultiIngestionSettings(): JSX.Element {
 					const requestPayload = {
 						name: values.name,
 						tags: updatedTags,
-						expires_at: new Date(dayjs(values.expires_at).endOf('day').toISOString()),
+						expires_at: dayjs(values.expires_at).endOf('day').toISOString(),
 					};
 
-					createIngestionKey(
-						{
-							data: requestPayload,
-						},
-						{
-							onSuccess: (_data) => {
-								notifications.success({
-									message: 'Ingestion key created successfully',
-								});
-								// The new API returns GatewaytypesGettableCreatedIngestionKeyDTO with only id and value
-								// We rely on refetchAPIKeys to get the full key object
-								setActiveAPIKey(null);
-								setUpdatedTags([]);
-								hideAddViewModal();
-								refetchAPIKeys();
-							},
-							onError: (error) => {
-								showErrorNotification(notifications, error as AxiosError);
-							},
-						},
-					);
+					createIngestionKey(requestPayload);
 				}
 			})
 			.catch((errorInfo) => {
@@ -515,7 +465,7 @@ function MultiIngestionSettings(): JSX.Element {
 		formatTimezoneAdjustedTimestamp(date, DATE_TIME_FORMATS.UTC_MONTH_COMPACT);
 
 	const showDeleteLimitModal = (
-		APIKey: GatewaytypesIngestionKeyDTO,
+		APIKey: IngestionKeyProps,
 		limit: LimitProps,
 	): void => {
 		setActiveAPIKey(APIKey);
@@ -539,17 +489,9 @@ function MultiIngestionSettings(): JSX.Element {
 
 	/* eslint-disable sonarjs/cognitive-complexity */
 	const handleAddLimit = (
-		APIKey: GatewaytypesIngestionKeyDTO,
+		APIKey: IngestionKeyProps,
 		signalName: string,
 	): void => {
-		if (!APIKey.id) {
-			notifications.error({
-				message: 'Invalid ingestion key',
-				description: 'Cannot create limit for ingestion key without a valid ID',
-			});
-			return;
-		}
-
 		const {
 			dailyLimit,
 			secondsLimit,
@@ -634,49 +576,13 @@ function MultiIngestionSettings(): JSX.Element {
 			return;
 		}
 
-		createLimitForIngestionKey(
-			{
-				pathParams: { keyId: payload.keyID },
-				data: {
-					signal: payload.signal,
-					config: payload.config,
-				},
-			},
-			{
-				onSuccess: () => {
-					notifications.success({
-						message: 'Limit created successfully',
-					});
-					setActiveSignal(null);
-					setActiveAPIKey(null);
-					setIsEditAddLimitOpen(false);
-					setUpdatedTags([]);
-					hideAddViewModal();
-					refetchAPIKeys();
-					setHasCreateLimitForIngestionKeyError(false);
-				},
-				onError: (error: AxiosError<RenderErrorResponseDTO>) => {
-					setHasCreateLimitForIngestionKeyError(true);
-					setCreateLimitForIngestionKeyError(
-						error.response?.data?.error?.message || 'Failed to create limit',
-					);
-				},
-			},
-		);
+		createLimitForIngestionKey(payload);
 	};
 
 	const handleUpdateLimit = (
-		APIKey: GatewaytypesIngestionKeyDTO,
+		APIKey: IngestionKeyProps,
 		signal: LimitProps,
 	): void => {
-		if (!signal.id) {
-			notifications.error({
-				message: 'Invalid limit',
-				description: 'Cannot update limit without a valid ID',
-			});
-			return;
-		}
-
 		const {
 			dailyLimit,
 			secondsLimit,
@@ -738,34 +644,7 @@ function MultiIngestionSettings(): JSX.Element {
 			}
 		}
 
-		updateLimitForIngestionKey(
-			{
-				pathParams: { limitId: payload.limitID },
-				data: {
-					config: payload.config,
-				},
-			},
-			{
-				onSuccess: () => {
-					notifications.success({
-						message: 'Limit updated successfully',
-					});
-					setActiveSignal(null);
-					setActiveAPIKey(null);
-					setIsEditAddLimitOpen(false);
-					setUpdatedTags([]);
-					hideAddViewModal();
-					refetchAPIKeys();
-					setHasUpdateLimitForIngestionKeyError(false);
-				},
-				onError: (error: AxiosError<RenderErrorResponseDTO>) => {
-					setHasUpdateLimitForIngestionKeyError(true);
-					setUpdateLimitForIngestionKeyError(
-						error.response?.data?.error?.message || 'Failed to update limit',
-					);
-				},
-			},
-		);
+		updateLimitForIngestionKey(payload);
 	};
 	/* eslint-enable sonarjs/cognitive-complexity */
 
@@ -777,7 +656,7 @@ function MultiIngestionSettings(): JSX.Element {
 	};
 
 	const enableEditLimitMode = (
-		APIKey: GatewaytypesIngestionKeyDTO,
+		APIKey: IngestionKeyProps,
 		signal: LimitProps,
 	): void => {
 		const dayCount = signal?.config?.day?.count;
@@ -786,11 +665,6 @@ function MultiIngestionSettings(): JSX.Element {
 		const dayCountConverted = countToUnit(dayCount || 0);
 		const secondCountConverted = countToUnit(secondCount || 0);
 
-		setHasCreateLimitForIngestionKeyError(false);
-		setCreateLimitForIngestionKeyError(null);
-		setHasUpdateLimitForIngestionKeyError(false);
-		setUpdateLimitForIngestionKeyError(null);
-
 		setActiveAPIKey(APIKey);
 		setActiveSignal({
 			...signal,
@@ -829,31 +703,14 @@ function MultiIngestionSettings(): JSX.Element {
 
 	const onDeleteLimitHandler = (): void => {
 		if (activeSignal && activeSignal.id) {
-			deleteLimitForKey(
-				{
-					pathParams: { limitId: activeSignal.id },
-				},
-				{
-					onSuccess: () => {
-						notifications.success({
-							message: 'Limit deleted successfully',
-						});
-						setIsDeleteModalOpen(false);
-						setIsDeleteLimitModalOpen(false);
-						refetchAPIKeys();
-					},
-					onError: (error) => {
-						showErrorNotification(notifications, error as AxiosError);
-					},
-				},
-			);
+			deleteLimitForKey(activeSignal.id);
 		}
 	};
 
 	const { formatTimezoneAdjustedTimestamp } = useTimezone();
 
 	const handleCreateAlert = (
-		APIKey: GatewaytypesIngestionKeyDTO,
+		APIKey: IngestionKeyProps,
 		signal: LimitProps,
 	): void => {
 		let metricName = '';
@@ -914,61 +771,31 @@ function MultiIngestionSettings(): JSX.Element {
 		history.push(URL);
 	};
 
-	const columns: AntDTableProps<GatewaytypesIngestionKeyDTO>['columns'] = [
+	const columns: AntDTableProps<IngestionKeyProps>['columns'] = [
 		{
 			title: 'Ingestion Key',
 			key: 'ingestion-key',
 			// eslint-disable-next-line sonarjs/cognitive-complexity
-			render: (APIKey: GatewaytypesIngestionKeyDTO): JSX.Element => {
-				const createdOn = APIKey?.created_at
-					? getFormattedTime(
-							dayjs(APIKey.created_at).toISOString(),
-							formatTimezoneAdjustedTimestamp,
-					  )
-					: '';
+			render: (APIKey: IngestionKeyProps): JSX.Element => {
+				const createdOn = getFormattedTime(
+					APIKey.created_at,
+					formatTimezoneAdjustedTimestamp,
+				);
 
 				const expiresOn =
-					!APIKey?.expires_at ||
-					dayjs(APIKey?.expires_at).toISOString() === '0001-01-01T00:00:00.000Z'
+					!APIKey?.expires_at || APIKey?.expires_at === '0001-01-01T00:00:00Z'
 						? 'No Expiry'
-						: getFormattedTime(
-								dayjs(APIKey?.expires_at).toISOString(),
-								formatTimezoneAdjustedTimestamp,
-						  );
+						: getFormattedTime(APIKey?.expires_at, formatTimezoneAdjustedTimestamp);
 
-				const updatedOn = APIKey?.updated_at
-					? getFormattedTime(
-							dayjs(APIKey.updated_at).toISOString(),
-							formatTimezoneAdjustedTimestamp,
-					  )
-					: '';
-
-				const onCopyKey = (e: React.MouseEvent): void => {
-					e.stopPropagation();
-					e.preventDefault();
-					if (APIKey?.value) {
-						handleCopyKey(APIKey.value);
-					}
-				};
-
-				const onEditKey = (e: React.MouseEvent): void => {
-					e.stopPropagation();
-					e.preventDefault();
-					showEditModal(APIKey);
-				};
-
-				const onDeleteKey = (e: React.MouseEvent): void => {
-					e.stopPropagation();
-					e.preventDefault();
-					showDeleteModal(APIKey);
-				};
+				const updatedOn = getFormattedTime(
+					APIKey?.updated_at,
+					formatTimezoneAdjustedTimestamp,
+				);
 
 				// Convert array of limits to a dictionary for quick access
 				const limitsDict: Record<string, LimitProps> = {};
-				APIKey.limits?.forEach((limitItem) => {
-					if (limitItem.signal && limitItem.id) {
-						limitsDict[limitItem.signal] = limitItem as LimitProps;
-					}
+				APIKey.limits?.forEach((limitItem: LimitProps) => {
+					limitsDict[limitItem.signal] = limitItem;
 				});
 
 				const hasLimits = (signalName: string): boolean => !!limitsDict[signalName];
@@ -985,25 +812,39 @@ function MultiIngestionSettings(): JSX.Element {
 
 									<div className="ingestion-key-value">
 										<Typography.Text>
-											{APIKey?.value?.substring(0, 2)}********
-											{APIKey?.value
-												?.substring(APIKey?.value?.length ? APIKey.value.length - 2 : 0)
-												?.trim()}
+											{APIKey?.value.substring(0, 2)}********
+											{APIKey?.value.substring(APIKey.value.length - 2).trim()}
 										</Typography.Text>
 
-										<Copy className="copy-key-btn" size={12} onClick={onCopyKey} />
+										<Copy
+											className="copy-key-btn"
+											size={12}
+											onClick={(e): void => {
+												e.stopPropagation();
+												e.preventDefault();
+												handleCopyKey(APIKey.value);
+											}}
+										/>
 									</div>
 								</div>
 								<div className="action-btn">
 									<Button
 										className="periscope-btn ghost"
 										icon={<PenLine size={14} />}
-										onClick={onEditKey}
+										onClick={(e): void => {
+											e.stopPropagation();
+											e.preventDefault();
+											showEditModal(APIKey);
+										}}
 									/>
 									<Button
 										className="periscope-btn ghost"
 										icon={<Trash2 color={Color.BG_CHERRY_500} size={14} />}
-										onClick={onDeleteKey}
+										onClick={(e): void => {
+											e.stopPropagation();
+											e.preventDefault();
+											showDeleteModal(APIKey);
+										}}
 									/>
 								</div>
 							</div>
@@ -1013,7 +854,7 @@ function MultiIngestionSettings(): JSX.Element {
 								<Row>
 									<Col span={6}> ID </Col>
 									<Col span={12}>
-										<Typography.Text>{APIKey?.id}</Typography.Text>
+										<Typography.Text>{APIKey.id}</Typography.Text>
 									</Col>
 								</Row>
 
@@ -1065,39 +906,6 @@ function MultiIngestionSettings(): JSX.Element {
 													limit?.config?.second?.size !== undefined ||
 													limit?.config?.second?.count !== undefined;
 
-												const onEditSignalLimit = (e: React.MouseEvent): void => {
-													e.stopPropagation();
-													e.preventDefault();
-													enableEditLimitMode(APIKey, limit);
-												};
-
-												const onDeleteSignalLimit = (e: React.MouseEvent): void => {
-													e.stopPropagation();
-													e.preventDefault();
-													showDeleteLimitModal(APIKey, limit);
-												};
-
-												const onAddSignalLimit = (e: React.MouseEvent): void => {
-													e.stopPropagation();
-													e.preventDefault();
-													enableEditLimitMode(APIKey, {
-														id: signalName,
-														signal: signalName,
-														config: {},
-													});
-												};
-
-												const onSaveSignalLimit = (): void => {
-													if (!hasLimits(signalName)) {
-														handleAddLimit(APIKey, signalName);
-													} else {
-														handleUpdateLimit(APIKey, limitsDict[signalName]);
-													}
-												};
-
-												const onCreateSignalAlert = (): void =>
-													handleCreateAlert(APIKey, limitsDict[signalName]);
-
 												return (
 													<div className="signal" key={signalName}>
 														<div className="header">
@@ -1108,18 +916,22 @@ function MultiIngestionSettings(): JSX.Element {
 																		<Button
 																			className="periscope-btn ghost"
 																			icon={<PenLine size={14} />}
-																			disabled={
-																				!!(activeAPIKey?.id === APIKey?.id && activeSignal)
-																			}
-																			onClick={onEditSignalLimit}
+																			disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
+																			onClick={(e): void => {
+																				e.stopPropagation();
+																				e.preventDefault();
+																				enableEditLimitMode(APIKey, limit);
+																			}}
 																		/>
 																		<Button
 																			className="periscope-btn ghost"
 																			icon={<Trash2 color={Color.BG_CHERRY_500} size={14} />}
-																			disabled={
-																				!!(activeAPIKey?.id === APIKey?.id && activeSignal)
-																			}
-																			onClick={onDeleteSignalLimit}
+																			disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
+																			onClick={(e): void => {
+																				e.stopPropagation();
+																				e.preventDefault();
+																				showDeleteLimitModal(APIKey, limit);
+																			}}
 																		/>
 																	</>
 																) : (
@@ -1128,8 +940,16 @@ function MultiIngestionSettings(): JSX.Element {
 																		size="small"
 																		shape="round"
 																		icon={<PlusIcon size={14} />}
-																		disabled={!!(activeAPIKey?.id === APIKey?.id && activeSignal)}
-																		onClick={onAddSignalLimit}
+																		disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
+																		onClick={(e): void => {
+																			e.stopPropagation();
+																			e.preventDefault();
+																			enableEditLimitMode(APIKey, {
+																				id: signalName,
+																				signal: signalName,
+																				config: {},
+																			});
+																		}}
 																	>
 																		Limits
 																	</Button>
@@ -1138,7 +958,7 @@ function MultiIngestionSettings(): JSX.Element {
 														</div>
 
 														<div className="signal-limit-values">
-															{activeAPIKey?.id === APIKey?.id &&
+															{activeAPIKey?.id === APIKey.id &&
 															activeSignal?.signal === signalName &&
 															isEditAddLimitOpen ? (
 																<Form
@@ -1334,27 +1154,27 @@ function MultiIngestionSettings(): JSX.Element {
 																		</div>
 																	</div>
 
-																	{activeAPIKey?.id === APIKey?.id &&
+																	{activeAPIKey?.id === APIKey.id &&
 																		activeSignal.signal === signalName &&
 																		!isLoadingLimitForKey &&
 																		hasCreateLimitForIngestionKeyError &&
-																		createLimitForIngestionKeyError && (
+																		createLimitForIngestionKeyError?.error && (
 																			<div className="error">
-																				{createLimitForIngestionKeyError}
+																				{createLimitForIngestionKeyError?.error}
 																			</div>
 																		)}
 
-																	{activeAPIKey?.id === APIKey?.id &&
+																	{activeAPIKey?.id === APIKey.id &&
 																		activeSignal.signal === signalName &&
 																		!isLoadingLimitForKey &&
 																		hasUpdateLimitForIngestionKeyError &&
-																		updateLimitForIngestionKeyError && (
+																		updateLimitForIngestionKeyError?.error && (
 																			<div className="error">
-																				{updateLimitForIngestionKeyError}
+																				{updateLimitForIngestionKeyError?.error}
 																			</div>
 																		)}
 
-																	{activeAPIKey?.id === APIKey?.id &&
+																	{activeAPIKey?.id === APIKey.id &&
 																		activeSignal.signal === signalName &&
 																		isEditAddLimitOpen && (
 																			<div className="signal-limit-save-discard">
@@ -1368,7 +1188,13 @@ function MultiIngestionSettings(): JSX.Element {
 																					loading={
 																						isLoadingLimitForKey || isLoadingUpdatedLimitForKey
 																					}
-																					onClick={onSaveSignalLimit}
+																					onClick={(): void => {
+																						if (!hasLimits(signalName)) {
+																							handleAddLimit(APIKey, signalName);
+																						} else {
+																							handleUpdateLimit(APIKey, limitsDict[signalName]);
+																						}
+																					}}
 																				>
 																					Save
 																				</Button>
@@ -1449,7 +1275,9 @@ function MultiIngestionSettings(): JSX.Element {
 																					className="set-alert-btn periscope-btn ghost"
 																					type="text"
 																					data-testid={`set-alert-btn-${signalName}`}
-																					onClick={onCreateSignalAlert}
+																					onClick={(): void =>
+																						handleCreateAlert(APIKey, limitsDict[signalName])
+																					}
 																				/>
 																			</Tooltip>
 																		)}
@@ -1564,7 +1392,7 @@ function MultiIngestionSettings(): JSX.Element {
 	const handleTableChange = (pagination: TablePaginationConfig): void => {
 		setPaginationParams({
 			page: pagination?.current || 1,
-			per_page: INITIAL_PAGE_SIZE,
+			per_page: 10,
 		});
 	};
 
@@ -1662,7 +1490,7 @@ function MultiIngestionSettings(): JSX.Element {
 					showHeader={false}
 					onChange={handleTableChange}
 					pagination={{
-						pageSize: isSearching ? SEARCH_PAGE_SIZE : paginationParams?.per_page,
+						pageSize: paginationParams?.per_page,
 						hideOnSinglePage: true,
 						showTotal: (total: number, range: number[]): string =>
 							`${range[0]}-${range[1]} of ${total} Ingestion keys`,

frontend/src/container/IngestionSettings/__tests__/MultiIngestionSettings.test.tsx

@@ -1,4 +1,3 @@
-import { GatewaytypesGettableIngestionKeysDTO } from 'api/generated/services/sigNoz.schemas';
 import { QueryParams } from 'constants/query';
 import { rest, server } from 'mocks-server/server';
 import { render, screen, userEvent, waitFor } from 'tests/test-utils';
@@ -19,12 +18,6 @@ interface TestAllIngestionKeyProps extends Omit<AllIngestionKeyProps, 'data'> {
 	data: TestIngestionKeyProps[];
 }
 
-// Gateway API response type (uses actual schema types for contract safety)
-interface TestGatewayIngestionKeysResponse {
-	status: string;
-	data: GatewaytypesGettableIngestionKeysDTO;
-}
-
 // Mock useHistory.push to capture navigation URL used by MultiIngestionSettings
 const mockPush = jest.fn() as jest.MockedFunction<(path: string) => void>;
 jest.mock('react-router-dom', () => {
@@ -93,34 +86,32 @@ describe('MultiIngestionSettings Page', () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
 		// Arrange API response with a metrics daily count limit so the alert button is visible
-		const response: TestGatewayIngestionKeysResponse = {
+		const response: TestAllIngestionKeyProps = {
 			status: 'success',
-			data: {
-				keys: [
-					{
-						name: 'Key One',
-						expires_at: new Date(TEST_EXPIRES_AT),
-						value: 'secret',
-						workspace_id: TEST_WORKSPACE_ID,
-						id: 'k1',
-						created_at: new Date(TEST_CREATED_UPDATED),
-						updated_at: new Date(TEST_CREATED_UPDATED),
-						tags: [],
-						limits: [
-							{
-								id: 'l1',
-								signal: 'metrics',
-								config: { day: { count: 1000 } },
-							},
-						],
-					},
-				],
-				_pagination: { page: 1, per_page: 10, pages: 1, total: 1 },
-			},
+			data: [
+				{
+					name: 'Key One',
+					expires_at: TEST_EXPIRES_AT,
+					value: 'secret',
+					workspace_id: TEST_WORKSPACE_ID,
+					id: 'k1',
+					created_at: TEST_CREATED_UPDATED,
+					updated_at: TEST_CREATED_UPDATED,
+					tags: [],
+					limits: [
+						{
+							id: 'l1',
+							signal: 'metrics',
+							config: { day: { count: 1000 } },
+						},
+					],
+				},
+			],
+			_pagination: { page: 1, per_page: 10, pages: 1, total: 1 },
 		};
 
 		server.use(
-			rest.get('*/api/v2/gateway/ingestion_keys*', (_req, res, ctx) =>
+			rest.get('*/workspaces/me/keys*', (_req, res, ctx) =>
 				res(ctx.status(200), ctx.json(response)),
 			),
 		);
@@ -266,95 +257,4 @@ describe('MultiIngestionSettings Page', () => {
 			'signoz.meter.log.size',
 		);
 	});
-
-	it('switches to search API when search text is entered', async () => {
-		const user = userEvent.setup({ pointerEventsCheck: 0 });
-
-		const getResponse: TestGatewayIngestionKeysResponse = {
-			status: 'success',
-			data: {
-				keys: [
-					{
-						name: 'Key Regular',
-						expires_at: new Date(TEST_EXPIRES_AT),
-						value: 'secret1',
-						workspace_id: TEST_WORKSPACE_ID,
-						id: 'k1',
-						created_at: new Date(TEST_CREATED_UPDATED),
-						updated_at: new Date(TEST_CREATED_UPDATED),
-						tags: [],
-						limits: [],
-					},
-				],
-				_pagination: { page: 1, per_page: 10, pages: 1, total: 1 },
-			},
-		};
-
-		const searchResponse: TestGatewayIngestionKeysResponse = {
-			status: 'success',
-			data: {
-				keys: [
-					{
-						name: 'Key Search Result',
-						expires_at: new Date(TEST_EXPIRES_AT),
-						value: 'secret2',
-						workspace_id: TEST_WORKSPACE_ID,
-						id: 'k2',
-						created_at: new Date(TEST_CREATED_UPDATED),
-						updated_at: new Date(TEST_CREATED_UPDATED),
-						tags: [],
-						limits: [],
-					},
-				],
-				_pagination: { page: 1, per_page: 10, pages: 1, total: 1 },
-			},
-		};
-
-		const getHandler = jest.fn();
-		const searchHandler = jest.fn();
-
-		server.use(
-			rest.get('*/api/v2/gateway/ingestion_keys', (req, res, ctx) => {
-				if (req.url.pathname.endsWith('/search')) {
-					return undefined;
-				}
-				getHandler();
-				return res(ctx.status(200), ctx.json(getResponse));
-			}),
-			rest.get('*/api/v2/gateway/ingestion_keys/search', (_req, res, ctx) => {
-				searchHandler();
-				return res(ctx.status(200), ctx.json(searchResponse));
-			}),
-		);
-
-		render(<MultiIngestionSettings />, undefined, {
-			initialRoute: INGESTION_SETTINGS_ROUTE,
-		});
-
-		await screen.findByText('Key Regular');
-		expect(getHandler).toHaveBeenCalled();
-		expect(searchHandler).not.toHaveBeenCalled();
-
-		// Reset getHandler count to verify it's not called again during search
-		getHandler.mockClear();
-
-		// Type in search box
-		const searchInput = screen.getByPlaceholderText(
-			'Search for ingestion key...',
-		);
-		await user.type(searchInput, 'test');
-
-		await screen.findByText('Key Search Result');
-		expect(searchHandler).toHaveBeenCalled();
-		expect(getHandler).not.toHaveBeenCalled();
-
-		// Clear search
-		searchHandler.mockClear();
-		getHandler.mockClear();
-		await user.clear(searchInput);
-
-		await screen.findByText('Key Regular');
-		// Search API should be disabled when not searching
-		expect(searchHandler).not.toHaveBeenCalled();
-	});
 });

frontend/src/container/LogDetailedView/InfraMetrics/NodeMetrics.tsx

@@ -16,6 +16,8 @@ import { SuccessResponse } from 'types/api';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 import uPlot from 'uplot';
 
+import { FeatureKeys } from '../../../constants/features';
+import { useAppContext } from '../../../providers/App/App';
 import {
 	getHostQueryPayload,
 	getNodeQueryPayload,
@@ -50,12 +52,23 @@ function NodeMetrics({
 		};
 	}, [timestamp]);
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const queryPayloads = useMemo(() => {
 		if (nodeName) {
-			return getNodeQueryPayload(clusterName, nodeName, start, end);
+			return getNodeQueryPayload(
+				clusterName,
+				nodeName,
+				start,
+				end,
+				dotMetricsEnabled,
+			);
 		}
-		return getHostQueryPayload(hostName, start, end);
-	}, [nodeName, hostName, clusterName, start, end]);
+		return getHostQueryPayload(hostName, start, end, dotMetricsEnabled);
+	}, [nodeName, hostName, clusterName, start, end, dotMetricsEnabled]);
 
 	const widgetInfo = nodeName ? nodeWidgetInfo : hostWidgetInfo;
 	const queries = useQueries(

frontend/src/container/LogDetailedView/InfraMetrics/PodMetrics.tsx

@@ -11,11 +11,13 @@ import { useResizeObserver } from 'hooks/useDimensions';
 import { GetMetricQueryRange } from 'lib/dashboard/getQueryResults';
 import { getUPlotChartOptions } from 'lib/uPlotLib/getUplotChartOptions';
 import { getUPlotChartData } from 'lib/uPlotLib/utils/getUplotChartData';
+import { useAppContext } from 'providers/App/App';
 import { useTimezone } from 'providers/Timezone';
 import { SuccessResponse } from 'types/api';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 import uPlot from 'uplot';
 
+import { FeatureKeys } from '../../../constants/features';
 import { getPodQueryPayload, podWidgetInfo } from './constants';
 
 function PodMetrics({
@@ -51,9 +53,14 @@ function PodMetrics({
 		scrollLeft: 0,
 	});
 
+	const { featureFlags } = useAppContext();
+	const dotMetricsEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.DOT_METRICS_ENABLED)
+			?.active || false;
+
 	const queryPayloads = useMemo(
-		() => getPodQueryPayload(clusterName, podName, start, end),
-		[clusterName, end, podName, start],
+		() => getPodQueryPayload(clusterName, podName, start, end, dotMetricsEnabled),
+		[clusterName, end, podName, start, dotMetricsEnabled],
 	);
 	const queries = useQueries(
 		queryPayloads.map((payload) => ({

frontend/src/container/LogDetailedView/InfraMetrics/constants.ts

@@ -10,21 +10,48 @@ export const getPodQueryPayload = (
 	podName: string,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sClusterNameKey = 'k8s.cluster.name';
-	const k8sPodNameKey = 'k8s.pod.name';
-	const containerCpuUtilKey = 'container.cpu.usage';
-	const containerMemUsageKey = 'container.memory.usage';
-	const k8sContainerCpuReqKey = 'k8s.container.cpu_request';
-	const k8sContainerCpuLimitKey = 'k8s.container.cpu_limit';
-	const k8sContainerMemReqKey = 'k8s.container.memory_request';
-	const k8sContainerMemLimitKey = 'k8s.container.memory_limit';
-	const k8sPodFsAvailKey = 'k8s.pod.filesystem.available';
-	const k8sPodFsCapKey = 'k8s.pod.filesystem.capacity';
-	const k8sPodNetIoKey = 'k8s.pod.network.io';
-	const podLegendTemplate = '{{k8s.pod.name}}';
-	const podLegendUsage = 'usage - {{k8s.pod.name}}';
-	const podLegendLimit = 'limit - {{k8s.pod.name}}';
+	const k8sClusterNameKey = dotMetricsEnabled
+		? 'k8s.cluster.name'
+		: 'k8s_cluster_name';
+	const k8sPodNameKey = dotMetricsEnabled ? 'k8s.pod.name' : 'k8s_pod_name';
+	const containerCpuUtilKey = dotMetricsEnabled
+		? 'container.cpu.usage'
+		: 'container_cpu_usage';
+	const containerMemUsageKey = dotMetricsEnabled
+		? 'container.memory.usage'
+		: 'container_memory_usage';
+	const k8sContainerCpuReqKey = dotMetricsEnabled
+		? 'k8s.container.cpu_request'
+		: 'k8s_container_cpu_request';
+	const k8sContainerCpuLimitKey = dotMetricsEnabled
+		? 'k8s.container.cpu_limit'
+		: 'k8s_container_cpu_limit';
+	const k8sContainerMemReqKey = dotMetricsEnabled
+		? 'k8s.container.memory_request'
+		: 'k8s_container_memory_request';
+	const k8sContainerMemLimitKey = dotMetricsEnabled
+		? 'k8s.container.memory_limit'
+		: 'k8s_container_memory_limit';
+	const k8sPodFsAvailKey = dotMetricsEnabled
+		? 'k8s.pod.filesystem.available'
+		: 'k8s_pod_filesystem_available';
+	const k8sPodFsCapKey = dotMetricsEnabled
+		? 'k8s.pod.filesystem.capacity'
+		: 'k8s_pod_filesystem_capacity';
+	const k8sPodNetIoKey = dotMetricsEnabled
+		? 'k8s.pod.network.io'
+		: 'k8s_pod_network_io';
+	const podLegendTemplate = dotMetricsEnabled
+		? '{{k8s.pod.name}}'
+		: '{{k8s_pod_name}}';
+	const podLegendUsage = dotMetricsEnabled
+		? 'usage - {{k8s.pod.name}}'
+		: 'usage - {{k8s_pod_name}}';
+	const podLegendLimit = dotMetricsEnabled
+		? 'limit - {{k8s.pod.name}}'
+		: 'limit - {{k8s_pod_name}}';
 
 	return [
 		{
@@ -1001,17 +1028,36 @@ export const getNodeQueryPayload = (
 	nodeName: string,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const k8sClusterNameKey = 'k8s.cluster.name';
-	const k8sNodeNameKey = 'k8s.node.name';
-	const k8sNodeCpuTimeKey = 'k8s.node.cpu.time';
-	const k8sNodeAllocCpuKey = 'k8s.node.allocatable_cpu';
-	const k8sNodeMemWsKey = 'k8s.node.memory.working_set';
-	const k8sNodeAllocMemKey = 'k8s.node.allocatable_memory';
-	const k8sNodeNetIoKey = 'k8s.node.network.io';
-	const k8sNodeFsAvailKey = 'k8s.node.filesystem.available';
-	const k8sNodeFsCapKey = 'k8s.node.filesystem.capacity';
-	const podLegend = '{{k8s.node.name}}';
+	const k8sClusterNameKey = dotMetricsEnabled
+		? 'k8s.cluster.name'
+		: 'k8s_cluster_name';
+	const k8sNodeNameKey = dotMetricsEnabled ? 'k8s.node.name' : 'k8s_node_name';
+	const k8sNodeCpuTimeKey = dotMetricsEnabled
+		? 'k8s.node.cpu.time'
+		: 'k8s_node_cpu_time';
+	const k8sNodeAllocCpuKey = dotMetricsEnabled
+		? 'k8s.node.allocatable_cpu'
+		: 'k8s_node_allocatable_cpu';
+	const k8sNodeMemWsKey = dotMetricsEnabled
+		? 'k8s.node.memory.working_set'
+		: 'k8s_node_memory_working_set';
+	const k8sNodeAllocMemKey = dotMetricsEnabled
+		? 'k8s.node.allocatable_memory'
+		: 'k8s_node_allocatable_memory';
+	const k8sNodeNetIoKey = dotMetricsEnabled
+		? 'k8s.node.network.io'
+		: 'k8s_node_network_io';
+	const k8sNodeFsAvailKey = dotMetricsEnabled
+		? 'k8s.node.filesystem.available'
+		: 'k8s_node_filesystem_available';
+	const k8sNodeFsCapKey = dotMetricsEnabled
+		? 'k8s.node.filesystem.capacity'
+		: 'k8s_node_filesystem_capacity';
+	const podLegend = dotMetricsEnabled
+		? '{{k8s.node.name}}'
+		: '{{k8s_node_name}}';
 
 	return [
 		{
@@ -1541,21 +1587,42 @@ export const getHostQueryPayload = (
 	hostName: string,
 	start: number,
 	end: number,
+	dotMetricsEnabled: boolean,
 ): GetQueryResultsProps[] => {
-	const hostNameKey = 'host.name';
-	const cpuTimeKey = 'system.cpu.time';
-	const memUsageKey = 'system.memory.usage';
-	const load1mKey = 'system.cpu.load_average.1m';
-	const load5mKey = 'system.cpu.load_average.5m';
-	const load15mKey = 'system.cpu.load_average.15m';
-	const netIoKey = 'system.network.io';
-	const netPktsKey = 'system.network.packets';
-	const netErrKey = 'system.network.errors';
-	const netDropKey = 'system.network.dropped';
-	const netConnKey = 'system.network.connections';
-	const diskIoKey = 'system.disk.io';
-	const diskOpTimeKey = 'system.disk.operation_time';
-	const diskPendingKey = 'system.disk.pending_operations';
+	const hostNameKey = dotMetricsEnabled ? 'host.name' : 'host_name';
+	const cpuTimeKey = dotMetricsEnabled ? 'system.cpu.time' : 'system_cpu_time';
+	const memUsageKey = dotMetricsEnabled
+		? 'system.memory.usage'
+		: 'system_memory_usage';
+	const load1mKey = dotMetricsEnabled
+		? 'system.cpu.load_average.1m'
+		: 'system_cpu_load_average_1m';
+	const load5mKey = dotMetricsEnabled
+		? 'system.cpu.load_average.5m'
+		: 'system_cpu_load_average_5m';
+	const load15mKey = dotMetricsEnabled
+		? 'system.cpu.load_average.15m'
+		: 'system_cpu_load_average_15m';
+	const netIoKey = dotMetricsEnabled ? 'system.network.io' : 'system_network_io';
+	const netPktsKey = dotMetricsEnabled
+		? 'system.network.packets'
+		: 'system_network_packets';
+	const netErrKey = dotMetricsEnabled
+		? 'system.network.errors'
+		: 'system_network_errors';
+	const netDropKey = dotMetricsEnabled
+		? 'system.network.dropped'
+		: 'system_network_dropped';
+	const netConnKey = dotMetricsEnabled
+		? 'system.network.connections'
+		: 'system_network_connections';
+	const diskIoKey = dotMetricsEnabled ? 'system.disk.io' : 'system_disk_io';
+	const diskOpTimeKey = dotMetricsEnabled
+		? 'system.disk.operation_time'
+		: 'system_disk_operation_time';
+	const diskPendingKey = dotMetricsEnabled
+		? 'system.disk.pending_operations'
+		: 'system_disk_pending_operations';
 
 	return [
 		{

frontend/src/container/LogDetailedView/TableView/TableViewActions.styles.scss

@@ -35,10 +35,10 @@
 		box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
 		backdrop-filter: blur(20px);
 		padding: 0px;
-		.more-filter-actions {
+		.group-by-clause {
 			display: flex;
 			align-items: center;
-			gap: 8px;
+			gap: 4px;
 			color: var(--bg-vanilla-400);
 			font-family: Inter;
 			font-size: 14px;
@@ -53,7 +53,7 @@
 			}
 		}
 
-		.more-filter-actions:hover {
+		.group-by-clause:hover {
 			background-color: unset !important;
 		}
 	}
@@ -65,7 +65,7 @@
 			border: 1px solid var(--bg-vanilla-400);
 			background: var(--bg-vanilla-100) !important;
 
-			.more-filter-actions {
+			.group-by-clause {
 				color: var(--bg-ink-400);
 			}
 		}

frontend/src/container/LogDetailedView/TableView/TableViewActions.tsx

@@ -1,5 +1,4 @@
 /* eslint-disable sonarjs/no-duplicate-string */
-/* eslint-disable sonarjs/cognitive-complexity */
 import React, { useCallback, useMemo, useState } from 'react';
 import { useLocation } from 'react-router-dom';
 import { Color } from '@signozhq/design-tokens';
@@ -17,12 +16,7 @@ import { MetricsType } from 'container/MetricsApplication/constant';
 import { useGetSearchQueryParam } from 'hooks/queryBuilder/useGetSearchQueryParam';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { ICurrentQueryData } from 'hooks/useHandleExplorerTabChange';
-import {
-	ArrowDownToDot,
-	ArrowUpFromDot,
-	Ellipsis,
-	RefreshCw,
-} from 'lucide-react';
+import { ArrowDownToDot, ArrowUpFromDot, Ellipsis } from 'lucide-react';
 import { ExplorerViews } from 'pages/LogsExplorer/utils';
 import { useTimezone } from 'providers/Timezone';
 import {
@@ -211,70 +205,6 @@ export default function TableViewActions(
 		viewName,
 	]);
 
-	const handleReplaceFilter = useCallback((): void => {
-		if (!stagedQuery) {
-			return;
-		}
-		const normalizedDataType: DataTypes | undefined =
-			dataType && Object.values(DataTypes).includes(dataType as DataTypes)
-				? (dataType as DataTypes)
-				: undefined;
-
-		const updatedQuery = updateQueriesData(
-			stagedQuery,
-			'queryData',
-			(item, index) => {
-				// Only replace filters for index 0
-				if (index === 0) {
-					const newFilterItem: BaseAutocompleteData = {
-						key: fieldFilterKey,
-						type: fieldType || '',
-						dataType: normalizedDataType,
-					};
-
-					// Create new filter items array with single IN filter
-					const newFilters = {
-						items: [
-							{
-								id: '',
-								key: newFilterItem,
-								op: OPERATORS.IN,
-								value: [parseFieldValue(fieldData.value)],
-							},
-						],
-						op: 'AND',
-					};
-
-					// Clear the expression and update filters
-					return {
-						...item,
-						filters: newFilters,
-						filter: { expression: '' },
-					};
-				}
-
-				return item;
-			},
-		);
-
-		const queryData: ICurrentQueryData = {
-			name: viewName,
-			id: updatedQuery.id,
-			query: updatedQuery,
-		};
-
-		handleChangeSelectedView?.(ExplorerViews.LIST, queryData);
-	}, [
-		stagedQuery,
-		updateQueriesData,
-		fieldFilterKey,
-		fieldType,
-		dataType,
-		fieldData,
-		handleChangeSelectedView,
-		viewName,
-	]);
-
 	// Memoize textToCopy computation
 	const textToCopy = useMemo(() => {
 		let text = fieldData.value;
@@ -397,21 +327,13 @@ export default function TableViewActions(
 								content={
 									<div>
 										<Button
-											className="more-filter-actions"
+											className="group-by-clause"
 											type="text"
 											icon={<GroupByIcon />}
 											onClick={handleGroupByAttribute}
 										>
 											Group By Attribute
 										</Button>
-										<Button
-											className="more-filter-actions"
-											type="text"
-											icon={<RefreshCw size={14} />}
-											onClick={handleReplaceFilter}
-										>
-											Replace filters with this value
-										</Button>
 									</div>
 								}
 								rootClassName="table-view-actions-content"
@@ -483,21 +405,13 @@ export default function TableViewActions(
 							content={
 								<div>
 									<Button
-										className="more-filter-actions"
+										className="group-by-clause"
 										type="text"
 										icon={<GroupByIcon />}
 										onClick={handleGroupByAttribute}
 									>
 										Group By Attribute
 									</Button>
-									<Button
-										className="more-filter-actions"
-										type="text"
-										icon={<RefreshCw size={14} />}
-										onClick={handleReplaceFilter}
-									>
-										Replace filters with this value
-									</Button>
 								</div>
 							}
 							rootClassName="table-view-actions-content"

frontend/src/container/Login/Login.styles.scss

@@ -407,10 +407,6 @@
 				color: var(--text-neutral-light-200) !important;
 			}
 
-			.ant-select-selection-item {
-				color: var(--text-ink-500) !important;
-			}
-
 			&:hover .ant-select-selector {
 				border-color: var(--bg-vanilla-300) !important;
 			}

frontend/src/container/Login/index.tsx

@@ -1,7 +1,7 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { useQuery } from 'react-query';
 import { Button } from '@signozhq/button';
-import { Form, Input, Select, Typography } from 'antd';
+import { Form, Input, Select, Tooltip, Typography } from 'antd';
 import getVersion from 'api/v1/version/get';
 import get from 'api/v2/sessions/context/get';
 import post from 'api/v2/sessions/email_password/post';
@@ -220,20 +220,6 @@ function Login(): JSX.Element {
 		}
 	};
 
-	const handleForgotPasswordClick = useCallback((): void => {
-		const email = form.getFieldValue('email');
-
-		if (!email || !sessionsContext || !sessionsContext?.orgs?.length) {
-			return;
-		}
-
-		history.push(ROUTES.FORGOT_PASSWORD, {
-			email,
-			orgId: sessionsOrgId,
-			orgs: sessionsContext.orgs,
-		});
-	}, [form, sessionsContext, sessionsOrgId]);
-
 	useEffect(() => {
 		if (callbackAuthError) {
 			setErrorMessage(
@@ -359,16 +345,11 @@ function Login(): JSX.Element {
 						<ParentContainer>
 							<div className="password-label-container">
 								<Label htmlFor="Password">Password</Label>
-								<Typography.Link
-									className="forgot-password-link"
-									href="#"
-									onClick={(event): void => {
-										event.preventDefault();
-										handleForgotPasswordClick();
-									}}
-								>
-									Forgot password?
-								</Typography.Link>
+								<Tooltip title="Ask your admin to reset your password and send you a new invite link">
+									<Typography.Link className="forgot-password-link">
+										Forgot password?
+									</Typography.Link>
+								</Tooltip>
 							</div>
 							<FormContainer.Item name="password">
 								<Input.Password

frontend/src/container/MetricsApplication/MetricsPageQueries/DBCallQueries.ts

@@ -21,6 +21,7 @@ export const databaseCallsRPS = ({
 	servicename,
 	legend,
 	tagFilterItems,
+	dotMetricsEnabled,
 }: DatabaseCallsRPSProps): QueryBuilderData => {
 	const autocompleteData: BaseAutocompleteData[] = [
 		{
@@ -32,7 +33,7 @@ export const databaseCallsRPS = ({
 	const groupBy: BaseAutocompleteData[] = [
 		{
 			dataType: DataTypes.String,
-			key: WidgetKeys.DbSystem,
+			key: dotMetricsEnabled ? WidgetKeys.Db_system : WidgetKeys.Db_system_norm,
 			type: 'tag',
 		},
 	];
@@ -41,7 +42,9 @@ export const databaseCallsRPS = ({
 			{
 				id: '',
 				key: {
-					key: WidgetKeys.OTelServiceName,
+					key: dotMetricsEnabled
+						? WidgetKeys.Service_name
+						: WidgetKeys.Service_name_norm,
 					dataType: DataTypes.String,
 					type: MetricsType.Resource,
 				},
@@ -72,6 +75,7 @@ export const databaseCallsRPS = ({
 export const databaseCallsAvgDuration = ({
 	servicename,
 	tagFilterItems,
+	dotMetricsEnabled,
 }: DatabaseCallProps): QueryBuilderData => {
 	const autocompleteDataA: BaseAutocompleteData = {
 		key: WidgetKeys.SignozDbLatencySum,
@@ -88,7 +92,9 @@ export const databaseCallsAvgDuration = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Resource,
 			},

frontend/src/container/MetricsApplication/MetricsPageQueries/ExternalQueries.ts

@@ -32,6 +32,7 @@ export const externalCallErrorPercent = ({
 	servicename,
 	legend,
 	tagFilterItems,
+	dotMetricsEnabled,
 }: ExternalCallDurationByAddressProps): QueryBuilderData => {
 	const autocompleteDataA: BaseAutocompleteData = {
 		key: WidgetKeys.SignozExternalCallLatencyCount,
@@ -48,7 +49,9 @@ export const externalCallErrorPercent = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Resource,
 			},
@@ -58,7 +61,7 @@ export const externalCallErrorPercent = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.StatusCode,
+				key: dotMetricsEnabled ? WidgetKeys.StatusCode : WidgetKeys.StatusCodeNorm,
 				dataType: DataTypes.Int64,
 				type: MetricsType.Tag,
 			},
@@ -71,7 +74,9 @@ export const externalCallErrorPercent = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Resource,
 			},
@@ -115,6 +120,7 @@ export const externalCallErrorPercent = ({
 export const externalCallDuration = ({
 	servicename,
 	tagFilterItems,
+	dotMetricsEnabled,
 }: ExternalCallProps): QueryBuilderData => {
 	const autocompleteDataA: BaseAutocompleteData = {
 		dataType: DataTypes.Float64,
@@ -135,7 +141,9 @@ export const externalCallDuration = ({
 			id: '',
 			key: {
 				dataType: DataTypes.String,
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				type: MetricsType.Resource,
 			},
 			op: OPERATORS.IN,
@@ -175,6 +183,7 @@ export const externalCallRpsByAddress = ({
 	servicename,
 	legend,
 	tagFilterItems,
+	dotMetricsEnabled,
 }: ExternalCallDurationByAddressProps): QueryBuilderData => {
 	const autocompleteData: BaseAutocompleteData[] = [
 		{
@@ -189,7 +198,9 @@ export const externalCallRpsByAddress = ({
 				id: '',
 				key: {
 					dataType: DataTypes.String,
-					key: WidgetKeys.OTelServiceName,
+					key: dotMetricsEnabled
+						? WidgetKeys.Service_name
+						: WidgetKeys.Service_name_norm,
 					type: MetricsType.Resource,
 				},
 				op: OPERATORS.IN,
@@ -220,6 +231,7 @@ export const externalCallDurationByAddress = ({
 	servicename,
 	legend,
 	tagFilterItems,
+	dotMetricsEnabled,
 }: ExternalCallDurationByAddressProps): QueryBuilderData => {
 	const autocompleteDataA: BaseAutocompleteData = {
 		dataType: DataTypes.Float64,
@@ -239,7 +251,9 @@ export const externalCallDurationByAddress = ({
 			id: '',
 			key: {
 				dataType: DataTypes.String,
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				type: MetricsType.Resource,
 			},
 			op: OPERATORS.IN,

frontend/src/container/MetricsApplication/MetricsPageQueries/OverviewQueries.ts

@@ -37,10 +37,15 @@ export const latency = ({
 	tagFilterItems,
 	isSpanMetricEnable = false,
 	topLevelOperationsRoute,
+	dotMetricsEnabled,
 }: LatencyProps): QueryBuilderData => {
-	const signozLatencyBucketMetrics = WidgetKeys.SignozLatencyBucket;
+	const signozLatencyBucketMetrics = dotMetricsEnabled
+		? WidgetKeys.Signoz_latency_bucket
+		: WidgetKeys.Signoz_latency_bucket_norm;
 
-	const signozMetricsServiceName = WidgetKeys.OTelServiceName;
+	const signozMetricsServiceName = dotMetricsEnabled
+		? WidgetKeys.Service_name
+		: WidgetKeys.Service_name_norm;
 	const newAutoCompleteData: BaseAutocompleteData = {
 		key: isSpanMetricEnable
 			? signozLatencyBucketMetrics
@@ -282,21 +287,28 @@ export const apDexMetricsQueryBuilderQueries = ({
 	threashold,
 	delta,
 	metricsBuckets,
+	dotMetricsEnabled,
 }: ApDexMetricsQueryBuilderQueriesProps): QueryBuilderData => {
 	const autoCompleteDataA: BaseAutocompleteData = {
-		key: WidgetKeys.SignozLatencyCount,
+		key: dotMetricsEnabled
+			? WidgetKeys.SignozLatencyCount
+			: WidgetKeys.SignozLatencyCountNorm,
 		dataType: DataTypes.Float64,
 		type: '',
 	};
 
 	const autoCompleteDataB: BaseAutocompleteData = {
-		key: WidgetKeys.SignozLatencyBucket,
+		key: dotMetricsEnabled
+			? WidgetKeys.Signoz_latency_bucket
+			: WidgetKeys.Signoz_latency_bucket_norm,
 		dataType: DataTypes.Float64,
 		type: '',
 	};
 
 	const autoCompleteDataC: BaseAutocompleteData = {
-		key: WidgetKeys.SignozLatencyBucket,
+		key: dotMetricsEnabled
+			? WidgetKeys.Signoz_latency_bucket
+			: WidgetKeys.Signoz_latency_bucket_norm,
 		dataType: DataTypes.Float64,
 		type: '',
 	};
@@ -305,7 +317,9 @@ export const apDexMetricsQueryBuilderQueries = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Tag,
 			},
@@ -329,7 +343,7 @@ export const apDexMetricsQueryBuilderQueries = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.StatusCode,
+				key: dotMetricsEnabled ? WidgetKeys.StatusCode : WidgetKeys.StatusCodeNorm,
 				dataType: DataTypes.String,
 				type: MetricsType.Tag,
 			},
@@ -349,7 +363,9 @@ export const apDexMetricsQueryBuilderQueries = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Tag,
 			},
@@ -383,7 +399,7 @@ export const apDexMetricsQueryBuilderQueries = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.StatusCode,
+				key: dotMetricsEnabled ? WidgetKeys.StatusCode : WidgetKeys.StatusCodeNorm,
 				dataType: DataTypes.String,
 				type: MetricsType.Tag,
 			},
@@ -393,7 +409,9 @@ export const apDexMetricsQueryBuilderQueries = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Tag,
 			},
@@ -456,10 +474,13 @@ export const operationPerSec = ({
 	servicename,
 	tagFilterItems,
 	topLevelOperations,
+	dotMetricsEnabled,
 }: OperationPerSecProps): QueryBuilderData => {
 	const autocompleteData: BaseAutocompleteData[] = [
 		{
-			key: WidgetKeys.SignozLatencyCount,
+			key: dotMetricsEnabled
+				? WidgetKeys.SignozLatencyCount
+				: WidgetKeys.SignozLatencyCountNorm,
 			dataType: DataTypes.Float64,
 			type: '',
 		},
@@ -470,7 +491,9 @@ export const operationPerSec = ({
 			{
 				id: '',
 				key: {
-					key: WidgetKeys.OTelServiceName,
+					key: dotMetricsEnabled
+						? WidgetKeys.Service_name
+						: WidgetKeys.Service_name_norm,
 					dataType: DataTypes.String,
 					type: MetricsType.Resource,
 				},
@@ -511,6 +534,7 @@ export const errorPercentage = ({
 	servicename,
 	tagFilterItems,
 	topLevelOperations,
+	dotMetricsEnabled,
 }: OperationPerSecProps): QueryBuilderData => {
 	const autocompleteDataA: BaseAutocompleteData = {
 		key: WidgetKeys.SignozCallsTotal,
@@ -529,7 +553,9 @@ export const errorPercentage = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Resource,
 			},
@@ -549,7 +575,7 @@ export const errorPercentage = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.StatusCode,
+				key: dotMetricsEnabled ? WidgetKeys.StatusCode : WidgetKeys.StatusCodeNorm,
 				dataType: DataTypes.Int64,
 				type: MetricsType.Tag,
 			},
@@ -563,7 +589,9 @@ export const errorPercentage = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Resource,
 			},

frontend/src/container/MetricsApplication/MetricsPageQueries/TopOperationQueries.ts

@@ -21,9 +21,12 @@ import { getQueryBuilderQuerieswithFormula } from './MetricsPageQueriesFactory';
 
 export const topOperationQueries = ({
 	servicename,
+	dotMetricsEnabled,
 }: TopOperationQueryFactoryProps): QueryBuilderData => {
 	const latencyAutoCompleteData: BaseAutocompleteData = {
-		key: WidgetKeys.SignozLatencyBucket,
+		key: dotMetricsEnabled
+			? WidgetKeys.Signoz_latency_bucket
+			: WidgetKeys.Signoz_latency_bucket_norm,
 		dataType: DataTypes.Float64,
 		type: '',
 	};
@@ -35,7 +38,9 @@ export const topOperationQueries = ({
 	};
 
 	const numOfCallAutoCompleteData: BaseAutocompleteData = {
-		key: WidgetKeys.SignozLatencyCount,
+		key: dotMetricsEnabled
+			? WidgetKeys.SignozLatencyCount
+			: WidgetKeys.SignozLatencyCountNorm,
 		dataType: DataTypes.Float64,
 		type: '',
 	};
@@ -44,7 +49,9 @@ export const topOperationQueries = ({
 		{
 			id: '',
 			key: {
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				dataType: DataTypes.String,
 				type: MetricsType.Resource,
 			},
@@ -58,7 +65,9 @@ export const topOperationQueries = ({
 			id: '',
 			key: {
 				dataType: DataTypes.String,
-				key: WidgetKeys.OTelServiceName,
+				key: dotMetricsEnabled
+					? WidgetKeys.Service_name
+					: WidgetKeys.Service_name_norm,
 				type: MetricsType.Resource,
 			},
 			op: OPERATORS.IN,
@@ -68,7 +77,7 @@ export const topOperationQueries = ({
 			id: '',
 			key: {
 				dataType: DataTypes.Int64,
-				key: WidgetKeys.StatusCode,
+				key: dotMetricsEnabled ? WidgetKeys.StatusCode : WidgetKeys.StatusCodeNorm,
 				type: MetricsType.Tag,
 			},
 			op: OPERATORS.IN,