fix(ui): resolve monaco find widget clipping and flickering (#11826)

* chore: metricName to post body for POST /api/v2/metrics/{metric_name}/metadata

* chore: metricName to query param for GET /api/v2/metrics/{metric_name}/metadata

* chore: added metricName in api get metric attributes

* chore: highlights api modified

* chore: alerts api modified

* chore: dashboards api modified

* chore: description added for metric_name query params

* feat(metrics-explorer): integrate metricName query/body API change in frontend (#11818)

* feat(metrics-explorer): integrate metricName query/body API change in frontend

The metrics-explorer endpoints moved metric_name off the URL path: the
five GETs (attributes, metadata, highlights, alerts, dashboards) now take
a required `metricName` query param, and POST /metadata reads metricName
from the request body.

- Regenerate the orval client from the updated openapi spec, so the GET
  helpers build `/api/v2/metrics/<op>?metricName=...` (URL-encoded, so
  slashed cloud metric names work) and updateMetricMetadata posts to
  `/api/v2/metrics/metadata` with metricName in the body.
- Collapse the useGetMetricAttributes call to the single merged params
  object (metricName + start/end).
- Drop the now-removed pathParams wrapper from both updateMetricMetadata
  call sites; the payload builders already include metricName in the body.
- Update the Metadata test to assert metricName inside the request body.

* revert(metrics-explorer): drop slashed-metric-name band-aid guards

These two defensive guards were added as temporary workarounds for the
metric_name-with-slash bug (SigNoz/signoz#11527, #11528), which returned
200 + HTML instead of JSON. The root cause is fixed by moving metricName
to a query/body param, so the band-aids are no longer needed and revert
to the original intended code.

- MetricDetails.tsx: `!metricMetadataResponse?.data` -> `!metricMetadataResponse`
- AllAttributes.tsx: `?.data?.attributes` -> `?.data.attributes`

* chore: added description for metricName query params

---------

Co-authored-by: Ashwin Bhatkal <ashwin96@gmail.com>
Co-authored-by: Srikanth Chekuri <srikanth.chekuri92@gmail.com>

docs/api/openapi.yml

@@ -15700,16 +15700,20 @@ paths:
       summary: List metric names
       tags:
       - metrics
-  /api/v2/metrics/{metric_name}/alerts:
+  /api/v2/metrics/alerts:
     get:
       deprecated: false
       description: This endpoint returns associated alerts for a specified metric
       operationId: GetMetricAlerts
       parameters:
-      - in: path
-        name: metric_name
+      - description: The name of the metric. May contain slashes (e.g. cloud-provider
+          metrics like run.googleapis.com/request_latencies).
+        in: query
+        name: metricName
         required: true
         schema:
+          description: The name of the metric. May contain slashes (e.g. cloud-provider
+            metrics like run.googleapis.com/request_latencies).
           type: string
       responses:
         "200":
@@ -15764,28 +15768,36 @@ paths:
       summary: Get metric alerts
       tags:
       - metrics
-  /api/v2/metrics/{metric_name}/attributes:
+  /api/v2/metrics/attributes:
     get:
       deprecated: false
       description: This endpoint returns attribute keys and their unique values for
         a specified metric
       operationId: GetMetricAttributes
       parameters:
-      - in: query
-        name: start
-        schema:
-          nullable: true
-          type: integer
-      - in: query
-        name: end
-        schema:
-          nullable: true
-          type: integer
-      - in: path
-        name: metric_name
+      - description: The name of the metric. May contain slashes (e.g. cloud-provider
+          metrics like run.googleapis.com/request_latencies).
+        in: query
+        name: metricName
         required: true
         schema:
+          description: The name of the metric. May contain slashes (e.g. cloud-provider
+            metrics like run.googleapis.com/request_latencies).
           type: string
+      - description: Start of the time range as a Unix timestamp in milliseconds.
+        in: query
+        name: start
+        schema:
+          description: Start of the time range as a Unix timestamp in milliseconds.
+          nullable: true
+          type: integer
+      - description: End of the time range as a Unix timestamp in milliseconds.
+        in: query
+        name: end
+        schema:
+          description: End of the time range as a Unix timestamp in milliseconds.
+          nullable: true
+          type: integer
       responses:
         "200":
           content:
@@ -15839,16 +15851,20 @@ paths:
       summary: Get metric attributes
       tags:
       - metrics
-  /api/v2/metrics/{metric_name}/dashboards:
+  /api/v2/metrics/dashboards:
     get:
       deprecated: false
       description: This endpoint returns associated dashboards for a specified metric
       operationId: GetMetricDashboards
       parameters:
-      - in: path
-        name: metric_name
+      - description: The name of the metric. May contain slashes (e.g. cloud-provider
+          metrics like run.googleapis.com/request_latencies).
+        in: query
+        name: metricName
         required: true
         schema:
+          description: The name of the metric. May contain slashes (e.g. cloud-provider
+            metrics like run.googleapis.com/request_latencies).
           type: string
       responses:
         "200":
@@ -15903,17 +15919,21 @@ paths:
       summary: Get metric dashboards
       tags:
       - metrics
-  /api/v2/metrics/{metric_name}/highlights:
+  /api/v2/metrics/highlights:
     get:
       deprecated: false
       description: This endpoint returns highlights like number of datapoints, totaltimeseries,
         active time series, last received time for a specified metric
       operationId: GetMetricHighlights
       parameters:
-      - in: path
-        name: metric_name
+      - description: The name of the metric. May contain slashes (e.g. cloud-provider
+          metrics like run.googleapis.com/request_latencies).
+        in: query
+        name: metricName
         required: true
         schema:
+          description: The name of the metric. May contain slashes (e.g. cloud-provider
+            metrics like run.googleapis.com/request_latencies).
           type: string
       responses:
         "200":
@@ -15968,17 +15988,79 @@ paths:
       summary: Get metric highlights
       tags:
       - metrics
-  /api/v2/metrics/{metric_name}/metadata:
+  /api/v2/metrics/inspect:
+    post:
+      deprecated: false
+      description: Returns raw time series data points for a metric within a time
+        range (max 30 minutes). Each series includes labels and timestamp/value pairs.
+      operationId: InspectMetrics
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/MetricsexplorertypesInspectMetricsRequest'
+      responses:
+        "200":
+          content:
+            application/json:
+              schema:
+                properties:
+                  data:
+                    $ref: '#/components/schemas/MetricsexplorertypesInspectMetricsResponse'
+                  status:
+                    type: string
+                required:
+                - status
+                - data
+                type: object
+          description: OK
+        "400":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Bad Request
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - VIEWER
+      - tokenizer:
+        - VIEWER
+      summary: Inspect raw metric data points
+      tags:
+      - metrics
+  /api/v2/metrics/metadata:
     get:
       deprecated: false
       description: This endpoint returns metadata information like metric description,
         unit, type, temporality, monotonicity for a specified metric
       operationId: GetMetricMetadata
       parameters:
-      - in: path
-        name: metric_name
+      - description: The name of the metric. May contain slashes (e.g. cloud-provider
+          metrics like run.googleapis.com/request_latencies).
+        in: query
+        name: metricName
         required: true
         schema:
+          description: The name of the metric. May contain slashes (e.g. cloud-provider
+            metrics like run.googleapis.com/request_latencies).
           type: string
       responses:
         "200":
@@ -16038,12 +16120,6 @@ paths:
       description: This endpoint helps to update metadata information like metric
         description, unit, type, temporality, monotonicity for a specified metric
       operationId: UpdateMetricMetadata
-      parameters:
-      - in: path
-        name: metric_name
-        required: true
-        schema:
-          type: string
       requestBody:
         content:
           application/json:
@@ -16084,64 +16160,6 @@ paths:
       summary: Update metric metadata
       tags:
       - metrics
-  /api/v2/metrics/inspect:
-    post:
-      deprecated: false
-      description: Returns raw time series data points for a metric within a time
-        range (max 30 minutes). Each series includes labels and timestamp/value pairs.
-      operationId: InspectMetrics
-      requestBody:
-        content:
-          application/json:
-            schema:
-              $ref: '#/components/schemas/MetricsexplorertypesInspectMetricsRequest'
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    $ref: '#/components/schemas/MetricsexplorertypesInspectMetricsResponse'
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: OK
-        "400":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Bad Request
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - VIEWER
-      - tokenizer:
-        - VIEWER
-      summary: Inspect raw metric data points
-      tags:
-      - metrics
   /api/v2/metrics/onboarding:
     get:
       deprecated: false

frontend/src/api/generated/services/metrics/index.ts

@@ -19,16 +19,15 @@ import type {
 
 import type {
 	GetMetricAlerts200,
-	GetMetricAlertsPathParameters,
+	GetMetricAlertsParams,
 	GetMetricAttributes200,
 	GetMetricAttributesParams,
-	GetMetricAttributesPathParameters,
 	GetMetricDashboards200,
-	GetMetricDashboardsPathParameters,
+	GetMetricDashboardsParams,
 	GetMetricHighlights200,
-	GetMetricHighlightsPathParameters,
+	GetMetricHighlightsParams,
 	GetMetricMetadata200,
-	GetMetricMetadataPathParameters,
+	GetMetricMetadataParams,
 	GetMetricsOnboardingStatus200,
 	GetMetricsStats200,
 	GetMetricsTreemap200,
@@ -40,7 +39,6 @@ import type {
 	MetricsexplorertypesTreemapRequestDTO,
 	MetricsexplorertypesUpdateMetricMetadataRequestDTO,
 	RenderErrorResponseDTO,
-	UpdateMetricMetadataPathParameters,
 } from '../sigNoz.schemas';
 
 import { GeneratedAPIInstance } from '../../../generatedAPIInstance';
@@ -146,27 +144,26 @@ export const invalidateListMetrics = async (
  * @summary Get metric alerts
  */
 export const getMetricAlerts = (
-	{ metricName }: GetMetricAlertsPathParameters,
+	params: GetMetricAlertsParams,
 	signal?: AbortSignal,
 ) => {
 	return GeneratedAPIInstance<GetMetricAlerts200>({
-		url: `/api/v2/metrics/${metricName}/alerts`,
+		url: `/api/v2/metrics/alerts`,
 		method: 'GET',
+		params,
 		signal,
 	});
 };
 
-export const getGetMetricAlertsQueryKey = ({
-	metricName,
-}: GetMetricAlertsPathParameters) => {
-	return [`/api/v2/metrics/${metricName}/alerts`] as const;
+export const getGetMetricAlertsQueryKey = (params?: GetMetricAlertsParams) => {
+	return [`/api/v2/metrics/alerts`, ...(params ? [params] : [])] as const;
 };
 
 export const getGetMetricAlertsQueryOptions = <
 	TData = Awaited<ReturnType<typeof getMetricAlerts>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricAlertsPathParameters,
+	params: GetMetricAlertsParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricAlerts>>,
@@ -177,19 +174,13 @@ export const getGetMetricAlertsQueryOptions = <
 ) => {
 	const { query: queryOptions } = options ?? {};
 
-	const queryKey =
-		queryOptions?.queryKey ?? getGetMetricAlertsQueryKey({ metricName });
+	const queryKey = queryOptions?.queryKey ?? getGetMetricAlertsQueryKey(params);
 
 	const queryFn: QueryFunction<Awaited<ReturnType<typeof getMetricAlerts>>> = ({
 		signal,
-	}) => getMetricAlerts({ metricName }, signal);
+	}) => getMetricAlerts(params, signal);
 
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!metricName,
-		...queryOptions,
-	} as UseQueryOptions<
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
 		Awaited<ReturnType<typeof getMetricAlerts>>,
 		TError,
 		TData
@@ -209,7 +200,7 @@ export function useGetMetricAlerts<
 	TData = Awaited<ReturnType<typeof getMetricAlerts>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricAlertsPathParameters,
+	params: GetMetricAlertsParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricAlerts>>,
@@ -218,7 +209,7 @@ export function useGetMetricAlerts<
 		>;
 	},
 ): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetMetricAlertsQueryOptions({ metricName }, options);
+	const queryOptions = getGetMetricAlertsQueryOptions(params, options);
 
 	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
 		queryKey: QueryKey;
@@ -232,11 +223,11 @@ export function useGetMetricAlerts<
  */
 export const invalidateGetMetricAlerts = async (
 	queryClient: QueryClient,
-	{ metricName }: GetMetricAlertsPathParameters,
+	params: GetMetricAlertsParams,
 	options?: InvalidateOptions,
 ): Promise<QueryClient> => {
 	await queryClient.invalidateQueries(
-		{ queryKey: getGetMetricAlertsQueryKey({ metricName }) },
+		{ queryKey: getGetMetricAlertsQueryKey(params) },
 		options,
 	);
 
@@ -248,12 +239,11 @@ export const invalidateGetMetricAlerts = async (
  * @summary Get metric attributes
  */
 export const getMetricAttributes = (
-	{ metricName }: GetMetricAttributesPathParameters,
-	params?: GetMetricAttributesParams,
+	params: GetMetricAttributesParams,
 	signal?: AbortSignal,
 ) => {
 	return GeneratedAPIInstance<GetMetricAttributes200>({
-		url: `/api/v2/metrics/${metricName}/attributes`,
+		url: `/api/v2/metrics/attributes`,
 		method: 'GET',
 		params,
 		signal,
@@ -261,21 +251,16 @@ export const getMetricAttributes = (
 };
 
 export const getGetMetricAttributesQueryKey = (
-	{ metricName }: GetMetricAttributesPathParameters,
 	params?: GetMetricAttributesParams,
 ) => {
-	return [
-		`/api/v2/metrics/${metricName}/attributes`,
-		...(params ? [params] : []),
-	] as const;
+	return [`/api/v2/metrics/attributes`, ...(params ? [params] : [])] as const;
 };
 
 export const getGetMetricAttributesQueryOptions = <
 	TData = Awaited<ReturnType<typeof getMetricAttributes>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricAttributesPathParameters,
-	params?: GetMetricAttributesParams,
+	params: GetMetricAttributesParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricAttributes>>,
@@ -287,19 +272,13 @@ export const getGetMetricAttributesQueryOptions = <
 	const { query: queryOptions } = options ?? {};
 
 	const queryKey =
-		queryOptions?.queryKey ??
-		getGetMetricAttributesQueryKey({ metricName }, params);
+		queryOptions?.queryKey ?? getGetMetricAttributesQueryKey(params);
 
 	const queryFn: QueryFunction<
 		Awaited<ReturnType<typeof getMetricAttributes>>
-	> = ({ signal }) => getMetricAttributes({ metricName }, params, signal);
+	> = ({ signal }) => getMetricAttributes(params, signal);
 
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!metricName,
-		...queryOptions,
-	} as UseQueryOptions<
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
 		Awaited<ReturnType<typeof getMetricAttributes>>,
 		TError,
 		TData
@@ -319,8 +298,7 @@ export function useGetMetricAttributes<
 	TData = Awaited<ReturnType<typeof getMetricAttributes>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricAttributesPathParameters,
-	params?: GetMetricAttributesParams,
+	params: GetMetricAttributesParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricAttributes>>,
@@ -329,11 +307,7 @@ export function useGetMetricAttributes<
 		>;
 	},
 ): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetMetricAttributesQueryOptions(
-		{ metricName },
-		params,
-		options,
-	);
+	const queryOptions = getGetMetricAttributesQueryOptions(params, options);
 
 	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
 		queryKey: QueryKey;
@@ -347,12 +321,11 @@ export function useGetMetricAttributes<
  */
 export const invalidateGetMetricAttributes = async (
 	queryClient: QueryClient,
-	{ metricName }: GetMetricAttributesPathParameters,
-	params?: GetMetricAttributesParams,
+	params: GetMetricAttributesParams,
 	options?: InvalidateOptions,
 ): Promise<QueryClient> => {
 	await queryClient.invalidateQueries(
-		{ queryKey: getGetMetricAttributesQueryKey({ metricName }, params) },
+		{ queryKey: getGetMetricAttributesQueryKey(params) },
 		options,
 	);
 
@@ -364,27 +337,28 @@ export const invalidateGetMetricAttributes = async (
  * @summary Get metric dashboards
  */
 export const getMetricDashboards = (
-	{ metricName }: GetMetricDashboardsPathParameters,
+	params: GetMetricDashboardsParams,
 	signal?: AbortSignal,
 ) => {
 	return GeneratedAPIInstance<GetMetricDashboards200>({
-		url: `/api/v2/metrics/${metricName}/dashboards`,
+		url: `/api/v2/metrics/dashboards`,
 		method: 'GET',
+		params,
 		signal,
 	});
 };
 
-export const getGetMetricDashboardsQueryKey = ({
-	metricName,
-}: GetMetricDashboardsPathParameters) => {
-	return [`/api/v2/metrics/${metricName}/dashboards`] as const;
+export const getGetMetricDashboardsQueryKey = (
+	params?: GetMetricDashboardsParams,
+) => {
+	return [`/api/v2/metrics/dashboards`, ...(params ? [params] : [])] as const;
 };
 
 export const getGetMetricDashboardsQueryOptions = <
 	TData = Awaited<ReturnType<typeof getMetricDashboards>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricDashboardsPathParameters,
+	params: GetMetricDashboardsParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricDashboards>>,
@@ -396,18 +370,13 @@ export const getGetMetricDashboardsQueryOptions = <
 	const { query: queryOptions } = options ?? {};
 
 	const queryKey =
-		queryOptions?.queryKey ?? getGetMetricDashboardsQueryKey({ metricName });
+		queryOptions?.queryKey ?? getGetMetricDashboardsQueryKey(params);
 
 	const queryFn: QueryFunction<
 		Awaited<ReturnType<typeof getMetricDashboards>>
-	> = ({ signal }) => getMetricDashboards({ metricName }, signal);
+	> = ({ signal }) => getMetricDashboards(params, signal);
 
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!metricName,
-		...queryOptions,
-	} as UseQueryOptions<
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
 		Awaited<ReturnType<typeof getMetricDashboards>>,
 		TError,
 		TData
@@ -427,7 +396,7 @@ export function useGetMetricDashboards<
 	TData = Awaited<ReturnType<typeof getMetricDashboards>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricDashboardsPathParameters,
+	params: GetMetricDashboardsParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricDashboards>>,
@@ -436,10 +405,7 @@ export function useGetMetricDashboards<
 		>;
 	},
 ): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetMetricDashboardsQueryOptions(
-		{ metricName },
-		options,
-	);
+	const queryOptions = getGetMetricDashboardsQueryOptions(params, options);
 
 	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
 		queryKey: QueryKey;
@@ -453,11 +419,11 @@ export function useGetMetricDashboards<
  */
 export const invalidateGetMetricDashboards = async (
 	queryClient: QueryClient,
-	{ metricName }: GetMetricDashboardsPathParameters,
+	params: GetMetricDashboardsParams,
 	options?: InvalidateOptions,
 ): Promise<QueryClient> => {
 	await queryClient.invalidateQueries(
-		{ queryKey: getGetMetricDashboardsQueryKey({ metricName }) },
+		{ queryKey: getGetMetricDashboardsQueryKey(params) },
 		options,
 	);
 
@@ -469,27 +435,28 @@ export const invalidateGetMetricDashboards = async (
  * @summary Get metric highlights
  */
 export const getMetricHighlights = (
-	{ metricName }: GetMetricHighlightsPathParameters,
+	params: GetMetricHighlightsParams,
 	signal?: AbortSignal,
 ) => {
 	return GeneratedAPIInstance<GetMetricHighlights200>({
-		url: `/api/v2/metrics/${metricName}/highlights`,
+		url: `/api/v2/metrics/highlights`,
 		method: 'GET',
+		params,
 		signal,
 	});
 };
 
-export const getGetMetricHighlightsQueryKey = ({
-	metricName,
-}: GetMetricHighlightsPathParameters) => {
-	return [`/api/v2/metrics/${metricName}/highlights`] as const;
+export const getGetMetricHighlightsQueryKey = (
+	params?: GetMetricHighlightsParams,
+) => {
+	return [`/api/v2/metrics/highlights`, ...(params ? [params] : [])] as const;
 };
 
 export const getGetMetricHighlightsQueryOptions = <
 	TData = Awaited<ReturnType<typeof getMetricHighlights>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricHighlightsPathParameters,
+	params: GetMetricHighlightsParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricHighlights>>,
@@ -501,18 +468,13 @@ export const getGetMetricHighlightsQueryOptions = <
 	const { query: queryOptions } = options ?? {};
 
 	const queryKey =
-		queryOptions?.queryKey ?? getGetMetricHighlightsQueryKey({ metricName });
+		queryOptions?.queryKey ?? getGetMetricHighlightsQueryKey(params);
 
 	const queryFn: QueryFunction<
 		Awaited<ReturnType<typeof getMetricHighlights>>
-	> = ({ signal }) => getMetricHighlights({ metricName }, signal);
+	> = ({ signal }) => getMetricHighlights(params, signal);
 
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!metricName,
-		...queryOptions,
-	} as UseQueryOptions<
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
 		Awaited<ReturnType<typeof getMetricHighlights>>,
 		TError,
 		TData
@@ -532,7 +494,7 @@ export function useGetMetricHighlights<
 	TData = Awaited<ReturnType<typeof getMetricHighlights>>,
 	TError = ErrorType<RenderErrorResponseDTO>,
 >(
-	{ metricName }: GetMetricHighlightsPathParameters,
+	params: GetMetricHighlightsParams,
 	options?: {
 		query?: UseQueryOptions<
 			Awaited<ReturnType<typeof getMetricHighlights>>,
@@ -541,10 +503,7 @@ export function useGetMetricHighlights<
 		>;
 	},
 ): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetMetricHighlightsQueryOptions(
-		{ metricName },
-		options,
-	);
+	const queryOptions = getGetMetricHighlightsQueryOptions(params, options);
 
 	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
 		queryKey: QueryKey;
@@ -558,219 +517,17 @@ export function useGetMetricHighlights<
  */
 export const invalidateGetMetricHighlights = async (
 	queryClient: QueryClient,
-	{ metricName }: GetMetricHighlightsPathParameters,
+	params: GetMetricHighlightsParams,
 	options?: InvalidateOptions,
 ): Promise<QueryClient> => {
 	await queryClient.invalidateQueries(
-		{ queryKey: getGetMetricHighlightsQueryKey({ metricName }) },
+		{ queryKey: getGetMetricHighlightsQueryKey(params) },
 		options,
 	);
 
 	return queryClient;
 };
 
-/**
- * This endpoint returns metadata information like metric description, unit, type, temporality, monotonicity for a specified metric
- * @summary Get metric metadata
- */
-export const getMetricMetadata = (
-	{ metricName }: GetMetricMetadataPathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<GetMetricMetadata200>({
-		url: `/api/v2/metrics/${metricName}/metadata`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getGetMetricMetadataQueryKey = ({
-	metricName,
-}: GetMetricMetadataPathParameters) => {
-	return [`/api/v2/metrics/${metricName}/metadata`] as const;
-};
-
-export const getGetMetricMetadataQueryOptions = <
-	TData = Awaited<ReturnType<typeof getMetricMetadata>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	{ metricName }: GetMetricMetadataPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getMetricMetadata>>,
-			TError,
-			TData
-		>;
-	},
-) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey =
-		queryOptions?.queryKey ?? getGetMetricMetadataQueryKey({ metricName });
-
-	const queryFn: QueryFunction<
-		Awaited<ReturnType<typeof getMetricMetadata>>
-	> = ({ signal }) => getMetricMetadata({ metricName }, signal);
-
-	return {
-		queryKey,
-		queryFn,
-		enabled: !!metricName,
-		...queryOptions,
-	} as UseQueryOptions<
-		Awaited<ReturnType<typeof getMetricMetadata>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type GetMetricMetadataQueryResult = NonNullable<
-	Awaited<ReturnType<typeof getMetricMetadata>>
->;
-export type GetMetricMetadataQueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Get metric metadata
- */
-
-export function useGetMetricMetadata<
-	TData = Awaited<ReturnType<typeof getMetricMetadata>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	{ metricName }: GetMetricMetadataPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getMetricMetadata>>,
-			TError,
-			TData
-		>;
-	},
-): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetMetricMetadataQueryOptions({ metricName }, options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	return { ...query, queryKey: queryOptions.queryKey };
-}
-
-/**
- * @summary Get metric metadata
- */
-export const invalidateGetMetricMetadata = async (
-	queryClient: QueryClient,
-	{ metricName }: GetMetricMetadataPathParameters,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getGetMetricMetadataQueryKey({ metricName }) },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * This endpoint helps to update metadata information like metric description, unit, type, temporality, monotonicity for a specified metric
- * @summary Update metric metadata
- */
-export const updateMetricMetadata = (
-	{ metricName }: UpdateMetricMetadataPathParameters,
-	metricsexplorertypesUpdateMetricMetadataRequestDTO?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<void>({
-		url: `/api/v2/metrics/${metricName}/metadata`,
-		method: 'POST',
-		headers: { 'Content-Type': 'application/json' },
-		data: metricsexplorertypesUpdateMetricMetadataRequestDTO,
-		signal,
-	});
-};
-
-export const getUpdateMetricMetadataMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateMetricMetadata>>,
-		TError,
-		{
-			pathParams: UpdateMetricMetadataPathParameters;
-			data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>;
-		},
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof updateMetricMetadata>>,
-	TError,
-	{
-		pathParams: UpdateMetricMetadataPathParameters;
-		data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>;
-	},
-	TContext
-> => {
-	const mutationKey = ['updateMetricMetadata'];
-	const { mutation: mutationOptions } = options
-		? options.mutation &&
-			'mutationKey' in options.mutation &&
-			options.mutation.mutationKey
-			? options
-			: { ...options, mutation: { ...options.mutation, mutationKey } }
-		: { mutation: { mutationKey } };
-
-	const mutationFn: MutationFunction<
-		Awaited<ReturnType<typeof updateMetricMetadata>>,
-		{
-			pathParams: UpdateMetricMetadataPathParameters;
-			data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>;
-		}
-	> = (props) => {
-		const { pathParams, data } = props ?? {};
-
-		return updateMetricMetadata(pathParams, data);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type UpdateMetricMetadataMutationResult = NonNullable<
-	Awaited<ReturnType<typeof updateMetricMetadata>>
->;
-export type UpdateMetricMetadataMutationBody =
-	| BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>
-	| undefined;
-export type UpdateMetricMetadataMutationError =
-	ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Update metric metadata
- */
-export const useUpdateMetricMetadata = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateMetricMetadata>>,
-		TError,
-		{
-			pathParams: UpdateMetricMetadataPathParameters;
-			data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>;
-		},
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof updateMetricMetadata>>,
-	TError,
-	{
-		pathParams: UpdateMetricMetadataPathParameters;
-		data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>;
-	},
-	TContext
-> => {
-	return useMutation(getUpdateMetricMetadataMutationOptions(options));
-};
 /**
  * Returns raw time series data points for a metric within a time range (max 30 minutes). Each series includes labels and timestamp/value pairs.
  * @summary Inspect raw metric data points
@@ -854,6 +611,188 @@ export const useInspectMetrics = <
 > => {
 	return useMutation(getInspectMetricsMutationOptions(options));
 };
+/**
+ * This endpoint returns metadata information like metric description, unit, type, temporality, monotonicity for a specified metric
+ * @summary Get metric metadata
+ */
+export const getMetricMetadata = (
+	params: GetMetricMetadataParams,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<GetMetricMetadata200>({
+		url: `/api/v2/metrics/metadata`,
+		method: 'GET',
+		params,
+		signal,
+	});
+};
+
+export const getGetMetricMetadataQueryKey = (
+	params?: GetMetricMetadataParams,
+) => {
+	return [`/api/v2/metrics/metadata`, ...(params ? [params] : [])] as const;
+};
+
+export const getGetMetricMetadataQueryOptions = <
+	TData = Awaited<ReturnType<typeof getMetricMetadata>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params: GetMetricMetadataParams,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof getMetricMetadata>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey =
+		queryOptions?.queryKey ?? getGetMetricMetadataQueryKey(params);
+
+	const queryFn: QueryFunction<
+		Awaited<ReturnType<typeof getMetricMetadata>>
+	> = ({ signal }) => getMetricMetadata(params, signal);
+
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
+		Awaited<ReturnType<typeof getMetricMetadata>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type GetMetricMetadataQueryResult = NonNullable<
+	Awaited<ReturnType<typeof getMetricMetadata>>
+>;
+export type GetMetricMetadataQueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Get metric metadata
+ */
+
+export function useGetMetricMetadata<
+	TData = Awaited<ReturnType<typeof getMetricMetadata>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params: GetMetricMetadataParams,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof getMetricMetadata>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getGetMetricMetadataQueryOptions(params, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	return { ...query, queryKey: queryOptions.queryKey };
+}
+
+/**
+ * @summary Get metric metadata
+ */
+export const invalidateGetMetricMetadata = async (
+	queryClient: QueryClient,
+	params: GetMetricMetadataParams,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getGetMetricMetadataQueryKey(params) },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * This endpoint helps to update metadata information like metric description, unit, type, temporality, monotonicity for a specified metric
+ * @summary Update metric metadata
+ */
+export const updateMetricMetadata = (
+	metricsexplorertypesUpdateMetricMetadataRequestDTO?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v2/metrics/metadata`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: metricsexplorertypesUpdateMetricMetadataRequestDTO,
+		signal,
+	});
+};
+
+export const getUpdateMetricMetadataMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateMetricMetadata>>,
+		TError,
+		{ data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO> },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof updateMetricMetadata>>,
+	TError,
+	{ data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO> },
+	TContext
+> => {
+	const mutationKey = ['updateMetricMetadata'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof updateMetricMetadata>>,
+		{ data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO> }
+	> = (props) => {
+		const { data } = props ?? {};
+
+		return updateMetricMetadata(data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type UpdateMetricMetadataMutationResult = NonNullable<
+	Awaited<ReturnType<typeof updateMetricMetadata>>
+>;
+export type UpdateMetricMetadataMutationBody =
+	| BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO>
+	| undefined;
+export type UpdateMetricMetadataMutationError =
+	ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Update metric metadata
+ */
+export const useUpdateMetricMetadata = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateMetricMetadata>>,
+		TError,
+		{ data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO> },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof updateMetricMetadata>>,
+	TError,
+	{ data?: BodyType<MetricsexplorertypesUpdateMetricMetadataRequestDTO> },
+	TContext
+> => {
+	return useMutation(getUpdateMetricMetadataMutationOptions(options));
+};
 /**
  * Lightweight endpoint that checks if any non-SigNoz metrics have been ingested, used for onboarding status detection
  * @summary Check if non-SigNoz metrics have been received

frontend/src/api/generated/services/sigNoz.schemas.ts

@@ -10370,9 +10370,14 @@ export type ListMetrics200 = {
 	status: string;
 };
 
-export type GetMetricAlertsPathParameters = {
+export type GetMetricAlertsParams = {
+	/**
+	 * @type string
+	 * @description The name of the metric. May contain slashes (e.g. cloud-provider metrics like run.googleapis.com/request_latencies).
+	 */
 	metricName: string;
 };
+
 export type GetMetricAlerts200 = {
 	data: MetricsexplorertypesMetricAlertsResponseDTO;
 	/**
@@ -10381,18 +10386,20 @@ export type GetMetricAlerts200 = {
 	status: string;
 };
 
-export type GetMetricAttributesPathParameters = {
-	metricName: string;
-};
 export type GetMetricAttributesParams = {
+	/**
+	 * @type string
+	 * @description The name of the metric. May contain slashes (e.g. cloud-provider metrics like run.googleapis.com/request_latencies).
+	 */
+	metricName: string;
 	/**
 	 * @type integer,null
-	 * @description undefined
+	 * @description Start of the time range as a Unix timestamp in milliseconds.
 	 */
 	start?: number | null;
 	/**
 	 * @type integer,null
-	 * @description undefined
+	 * @description End of the time range as a Unix timestamp in milliseconds.
 	 */
 	end?: number | null;
 };
@@ -10405,9 +10412,14 @@ export type GetMetricAttributes200 = {
 	status: string;
 };
 
-export type GetMetricDashboardsPathParameters = {
+export type GetMetricDashboardsParams = {
+	/**
+	 * @type string
+	 * @description The name of the metric. May contain slashes (e.g. cloud-provider metrics like run.googleapis.com/request_latencies).
+	 */
 	metricName: string;
 };
+
 export type GetMetricDashboards200 = {
 	data: MetricsexplorertypesMetricDashboardsResponseDTO;
 	/**
@@ -10416,9 +10428,14 @@ export type GetMetricDashboards200 = {
 	status: string;
 };
 
-export type GetMetricHighlightsPathParameters = {
+export type GetMetricHighlightsParams = {
+	/**
+	 * @type string
+	 * @description The name of the metric. May contain slashes (e.g. cloud-provider metrics like run.googleapis.com/request_latencies).
+	 */
 	metricName: string;
 };
+
 export type GetMetricHighlights200 = {
 	data: MetricsexplorertypesMetricHighlightsResponseDTO;
 	/**
@@ -10427,22 +10444,24 @@ export type GetMetricHighlights200 = {
 	status: string;
 };
 
-export type GetMetricMetadataPathParameters = {
-	metricName: string;
-};
-export type GetMetricMetadata200 = {
-	data: MetricsexplorertypesMetricMetadataDTO;
+export type InspectMetrics200 = {
+	data: MetricsexplorertypesInspectMetricsResponseDTO;
 	/**
 	 * @type string
 	 */
 	status: string;
 };
 
-export type UpdateMetricMetadataPathParameters = {
+export type GetMetricMetadataParams = {
+	/**
+	 * @type string
+	 * @description The name of the metric. May contain slashes (e.g. cloud-provider metrics like run.googleapis.com/request_latencies).
+	 */
 	metricName: string;
 };
-export type InspectMetrics200 = {
-	data: MetricsexplorertypesInspectMetricsResponseDTO;
+
+export type GetMetricMetadata200 = {
+	data: MetricsexplorertypesMetricMetadataDTO;
 	/**
 	 * @type string
 	 */

frontend/src/container/MetricsExplorer/Explorer/TimeSeries.tsx

@@ -191,9 +191,6 @@ function TimeSeries({
 		if (metrics[0] && yAxisUnit) {
 			updateMetricMetadata(
 				{
-					pathParams: {
-						metricName: metricNames[0],
-					},
 					data: buildUpdateMetricYAxisUnitPayload(
 						metricNames[0],
 						metrics[0],

frontend/src/container/MetricsExplorer/MetricDetails/AllAttributes.tsx

@@ -48,18 +48,14 @@ function AllAttributes({
 		isLoading: isLoadingAttributes,
 		isError: isErrorAttributes,
 		refetch: refetchAttributes,
-	} = useGetMetricAttributes(
-		{
-			metricName,
-		},
-		{
-			start: minTime ? Math.floor(minTime / 1000000) : undefined,
-			end: maxTime ? Math.floor(maxTime / 1000000) : undefined,
-		},
-	);
+	} = useGetMetricAttributes({
+		metricName,
+		start: minTime ? Math.floor(minTime / 1000000) : undefined,
+		end: maxTime ? Math.floor(maxTime / 1000000) : undefined,
+	});
 
 	const attributes = useMemo(
-		() => attributesData?.data?.attributes ?? [],
+		() => attributesData?.data.attributes ?? [],
 		[attributesData],
 	);
 

frontend/src/container/MetricsExplorer/MetricDetails/Metadata.tsx

@@ -237,9 +237,6 @@ function Metadata({
 	const handleSave = useCallback(() => {
 		updateMetricMetadata(
 			{
-				pathParams: {
-					metricName,
-				},
 				data: transformUpdateMetricMetadataRequest(metricName, metricMetadataState),
 			},
 			{

frontend/src/container/MetricsExplorer/MetricDetails/MetricDetails.tsx

@@ -56,7 +56,7 @@ function MetricDetails({
 	);
 
 	const metadata = useMemo(() => {
-		if (!metricMetadataResponse?.data) {
+		if (!metricMetadataResponse) {
 			return null;
 		}
 		const { type, description, unit, temporality, isMonotonic } =

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/Metadata.test.tsx

@@ -195,14 +195,12 @@ describe('Metadata', () => {
 		expect(mockUseUpdateMetricMetadata).toHaveBeenCalledWith(
 			expect.objectContaining({
 				data: expect.objectContaining({
+					metricName: MOCK_METRIC_NAME,
 					type: MetrictypesTypeDTO.sum,
 					temporality: MetrictypesTemporalityDTO.cumulative,
 					unit: 'By',
 					isMonotonic: true,
 				}),
-				pathParams: {
-					metricName: MOCK_METRIC_NAME,
-				},
 			}),
 			expect.objectContaining({
 				onSuccess: expect.any(Function),

frontend/src/hooks/hotkeys/useKeyboardHotkeys.tsx

@@ -84,12 +84,11 @@ export function KeyboardHotkeysProvider({
 		}
 
 		const target = event.target as HTMLElement;
-		const isCodeMirrorEditor = target.closest('.cm-editor') !== null;
-		const isMonacoEditor = target.closest('.monaco-editor') !== null;
+		const isCodeMirrorEditor =
+			(target as HTMLElement).closest('.cm-editor') !== null;
 		if (
-			IGNORE_INPUTS.includes(target.tagName.toLowerCase()) ||
-			isCodeMirrorEditor ||
-			isMonacoEditor
+			IGNORE_INPUTS.includes((target as HTMLElement).tagName.toLowerCase()) ||
+			isCodeMirrorEditor
 		) {
 			return;
 		}

frontend/src/styles.scss

@@ -794,6 +794,13 @@ notifications	-  2050
 	background: color-mix(in srgb, var(--l3-background) 20%, transparent);
 }
 
+// =================================================================
+// Monaco Editor style overrides
+.monaco-editor .find-widget.visible {
+	top: 30px !important;
+	right: 45px !important;
+}
+
 body.ai-assistant-panel-open {
 	.PylonChat-bubbleFrameContainer,
 	.PylonChat-chatWindowFrameContainer {

pkg/apiserver/signozapiserver/metricsexplorer.go

@@ -68,7 +68,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/metrics/{metric_name}/attributes", handler.New(
+	if err := router.Handle("/api/v2/metrics/attributes", handler.New(
 		provider.authzMiddleware.ViewAccess(provider.metricsExplorerHandler.GetMetricAttributes),
 		handler.OpenAPIDef{
 			ID:                  "GetMetricAttributes",
@@ -88,7 +88,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/metrics/{metric_name}/metadata", handler.New(
+	if err := router.Handle("/api/v2/metrics/metadata", handler.New(
 		provider.authzMiddleware.ViewAccess(provider.metricsExplorerHandler.GetMetricMetadata),
 		handler.OpenAPIDef{
 			ID:                  "GetMetricMetadata",
@@ -96,6 +96,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 			Summary:             "Get metric metadata",
 			Description:         "This endpoint returns metadata information like metric description, unit, type, temporality, monotonicity for a specified metric",
 			Request:             nil,
+			RequestQuery:        new(metricsexplorertypes.MetricNameQuery),
 			RequestContentType:  "",
 			Response:            new(metricsexplorertypes.MetricMetadata),
 			ResponseContentType: "application/json",
@@ -107,7 +108,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/metrics/{metric_name}/metadata", handler.New(
+	if err := router.Handle("/api/v2/metrics/metadata", handler.New(
 		provider.authzMiddleware.EditAccess(provider.metricsExplorerHandler.UpdateMetricMetadata),
 		handler.OpenAPIDef{
 			ID:                  "UpdateMetricMetadata",
@@ -126,7 +127,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/metrics/{metric_name}/highlights", handler.New(
+	if err := router.Handle("/api/v2/metrics/highlights", handler.New(
 		provider.authzMiddleware.ViewAccess(provider.metricsExplorerHandler.GetMetricHighlights),
 		handler.OpenAPIDef{
 			ID:                  "GetMetricHighlights",
@@ -134,6 +135,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 			Summary:             "Get metric highlights",
 			Description:         "This endpoint returns highlights like number of datapoints, totaltimeseries, active time series, last received time for a specified metric",
 			Request:             nil,
+			RequestQuery:        new(metricsexplorertypes.MetricNameQuery),
 			RequestContentType:  "",
 			Response:            new(metricsexplorertypes.MetricHighlightsResponse),
 			ResponseContentType: "application/json",
@@ -145,7 +147,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/metrics/{metric_name}/alerts", handler.New(
+	if err := router.Handle("/api/v2/metrics/alerts", handler.New(
 		provider.authzMiddleware.ViewAccess(provider.metricsExplorerHandler.GetMetricAlerts),
 		handler.OpenAPIDef{
 			ID:                  "GetMetricAlerts",
@@ -153,6 +155,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 			Summary:             "Get metric alerts",
 			Description:         "This endpoint returns associated alerts for a specified metric",
 			Request:             nil,
+			RequestQuery:        new(metricsexplorertypes.MetricNameQuery),
 			RequestContentType:  "",
 			Response:            new(metricsexplorertypes.MetricAlertsResponse),
 			ResponseContentType: "application/json",
@@ -164,7 +167,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 		return err
 	}
 
-	if err := router.Handle("/api/v2/metrics/{metric_name}/dashboards", handler.New(
+	if err := router.Handle("/api/v2/metrics/dashboards", handler.New(
 		provider.authzMiddleware.ViewAccess(provider.metricsExplorerHandler.GetMetricDashboards),
 		handler.OpenAPIDef{
 			ID:                  "GetMetricDashboards",
@@ -172,6 +175,7 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 			Summary:             "Get metric dashboards",
 			Description:         "This endpoint returns associated dashboards for a specified metric",
 			Request:             nil,
+			RequestQuery:        new(metricsexplorertypes.MetricNameQuery),
 			RequestContentType:  "",
 			Response:            new(metricsexplorertypes.MetricDashboardsResponse),
 			ResponseContentType: "application/json",

pkg/modules/metricsexplorer/implmetricsexplorer/handler.go

@@ -11,17 +11,8 @@ import (
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/types/metricsexplorertypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
-	"github.com/gorilla/mux"
 )
 
-func extractMetricName(req *http.Request) (string, error) {
-	metricName := mux.Vars(req)["metric_name"]
-	if metricName == "" {
-		return "", errors.NewInvalidInputf(errors.CodeInvalidInput, "metric_name is required in URL path")
-	}
-	return metricName, nil
-}
-
 type handler struct {
 	module metricsexplorer.Module
 }
@@ -116,23 +107,17 @@ func (h *handler) UpdateMetricMetadata(rw http.ResponseWriter, req *http.Request
 		return
 	}
 
-	// Extract metric_name from URL path
-	vars := mux.Vars(req)
-	metricName := vars["metric_name"]
-
-	if metricName == "" {
-		render.Error(rw, errors.NewInvalidInputf(errors.CodeInvalidInput, "metric_name is required in URL path"))
-		return
-	}
-
 	var in metricsexplorertypes.UpdateMetricMetadataRequest
 	if err := binding.JSON.BindBody(req.Body, &in); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
-	// Set metric name from URL path
-	in.MetricName = metricName
+	if in.MetricName == "" {
+		render.Error(rw, errors.NewInvalidInputf(errors.CodeInvalidInput, "metricName is required"))
+		return
+	}
+
 	orgID := valuer.MustNewUUID(claims.OrgID)
 
 	err = h.module.UpdateMetricMetadata(req.Context(), orgID, &in)
@@ -151,11 +136,16 @@ func (h *handler) GetMetricMetadata(rw http.ResponseWriter, req *http.Request) {
 		return
 	}
 
-	metricName, err := extractMetricName(req)
-	if err != nil {
+	var in metricsexplorertypes.MetricNameQuery
+	if err := binding.Query.BindQuery(req.URL.Query(), &in); err != nil {
 		render.Error(rw, err)
 		return
 	}
+	if err := in.Validate(); err != nil {
+		render.Error(rw, err)
+		return
+	}
+	metricName := in.MetricName
 
 	orgID := valuer.MustNewUUID(claims.OrgID)
 
@@ -181,20 +171,24 @@ func (h *handler) GetMetricAlerts(rw http.ResponseWriter, req *http.Request) {
 		return
 	}
 
-	metricName, err := extractMetricName(req)
-	if err != nil {
+	var in metricsexplorertypes.MetricNameQuery
+	if err := binding.Query.BindQuery(req.URL.Query(), &in); err != nil {
+		render.Error(rw, err)
+		return
+	}
+	if err := in.Validate(); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
 	orgID := valuer.MustNewUUID(claims.OrgID)
 
-	if err := h.checkMetricExists(req.Context(), orgID, metricName); err != nil {
+	if err := h.checkMetricExists(req.Context(), orgID, in.MetricName); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
-	out, err := h.module.GetMetricAlerts(req.Context(), orgID, metricName)
+	out, err := h.module.GetMetricAlerts(req.Context(), orgID, in.MetricName)
 	if err != nil {
 		render.Error(rw, err)
 		return
@@ -209,20 +203,24 @@ func (h *handler) GetMetricDashboards(rw http.ResponseWriter, req *http.Request)
 		return
 	}
 
-	metricName, err := extractMetricName(req)
-	if err != nil {
+	var in metricsexplorertypes.MetricNameQuery
+	if err := binding.Query.BindQuery(req.URL.Query(), &in); err != nil {
+		render.Error(rw, err)
+		return
+	}
+	if err := in.Validate(); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
 	orgID := valuer.MustNewUUID(claims.OrgID)
 
-	if err := h.checkMetricExists(req.Context(), orgID, metricName); err != nil {
+	if err := h.checkMetricExists(req.Context(), orgID, in.MetricName); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
-	out, err := h.module.GetMetricDashboards(req.Context(), orgID, metricName)
+	out, err := h.module.GetMetricDashboards(req.Context(), orgID, in.MetricName)
 	if err != nil {
 		render.Error(rw, err)
 		return
@@ -237,20 +235,24 @@ func (h *handler) GetMetricHighlights(rw http.ResponseWriter, req *http.Request)
 		return
 	}
 
-	metricName, err := extractMetricName(req)
-	if err != nil {
+	var in metricsexplorertypes.MetricNameQuery
+	if err := binding.Query.BindQuery(req.URL.Query(), &in); err != nil {
+		render.Error(rw, err)
+		return
+	}
+	if err := in.Validate(); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
 	orgID := valuer.MustNewUUID(claims.OrgID)
 
-	if err := h.checkMetricExists(req.Context(), orgID, metricName); err != nil {
+	if err := h.checkMetricExists(req.Context(), orgID, in.MetricName); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
-	highlights, err := h.module.GetMetricHighlights(req.Context(), orgID, metricName)
+	highlights, err := h.module.GetMetricHighlights(req.Context(), orgID, in.MetricName)
 	if err != nil {
 		render.Error(rw, err)
 		return
@@ -265,20 +267,12 @@ func (h *handler) GetMetricAttributes(rw http.ResponseWriter, req *http.Request)
 		return
 	}
 
-	metricName, err := extractMetricName(req)
-	if err != nil {
-		render.Error(rw, err)
-		return
-	}
-
 	var in metricsexplorertypes.MetricAttributesRequest
 	if err := binding.Query.BindQuery(req.URL.Query(), &in); err != nil {
 		render.Error(rw, err)
 		return
 	}
 
-	in.MetricName = metricName
-
 	if err := in.Validate(); err != nil {
 		render.Error(rw, err)
 		return
@@ -286,7 +280,7 @@ func (h *handler) GetMetricAttributes(rw http.ResponseWriter, req *http.Request)
 
 	orgID := valuer.MustNewUUID(claims.OrgID)
 
-	if err := h.checkMetricExists(req.Context(), orgID, metricName); err != nil {
+	if err := h.checkMetricExists(req.Context(), orgID, in.MetricName); err != nil {
 		render.Error(rw, err)
 		return
 	}

pkg/types/metricsexplorertypes/metricsexplorer.go

@@ -260,11 +260,27 @@ type MetricHighlightsResponse struct {
 	ActiveTimeSeries uint64 `json:"activeTimeSeries" required:"true"`
 }
 
+// MetricNameQuery represents the query parameters for endpoints that take a metric name.
+type MetricNameQuery struct {
+	MetricName string `query:"metricName" required:"true" description:"The name of the metric. May contain slashes (e.g. cloud-provider metrics like run.googleapis.com/request_latencies)."`
+}
+
+// Validate ensures MetricNameQuery contains acceptable values.
+func (q *MetricNameQuery) Validate() error {
+	if q == nil {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "request is nil")
+	}
+	if q.MetricName == "" {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "metricName is required")
+	}
+	return nil
+}
+
 // MetricAttributesRequest represents the query parameters for the metric attributes endpoint.
 type MetricAttributesRequest struct {
-	MetricName string `json:"-"`
-	Start      *int64 `query:"start"`
-	End        *int64 `query:"end"`
+	MetricName string `query:"metricName" required:"true" description:"The name of the metric. May contain slashes (e.g. cloud-provider metrics like run.googleapis.com/request_latencies)."`
+	Start      *int64 `query:"start" description:"Start of the time range as a Unix timestamp in milliseconds."`
+	End        *int64 `query:"end" description:"End of the time range as a Unix timestamp in milliseconds."`
 }
 
 // Validate ensures MetricAttributesRequest contains acceptable values.
@@ -273,6 +289,10 @@ func (req *MetricAttributesRequest) Validate() error {
 		return errors.NewInvalidInputf(errors.CodeInvalidInput, "request is nil")
 	}
 
+	if req.MetricName == "" {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "metricName is required")
+	}
+
 	if req.Start != nil && req.End != nil {
 		if *req.Start >= *req.End {
 			return errors.NewInvalidInputf(errors.CodeInvalidInput, "start (%d) must be less than end (%d)", *req.Start, *req.End)