feat(alerts): create anomaly alerts in the new alert experience

cmd/authz.go

@@ -104,7 +104,6 @@ func runGenerateAuthz(_ context.Context) error {
 		coretypes.NewResourceRef(coretypes.ResourceTelemetryResourceMetrics).String():      true,
 		coretypes.NewResourceRef(coretypes.ResourceTelemetryResourceMeterMetrics).String(): true,
 		coretypes.NewResourceRef(coretypes.ResourceMetaResourceQuickFilter).String():       true,
-		coretypes.NewResourceRef(coretypes.ResourceMetaResourceSavedView).String():         true,
 	}
 
 	allowedTypes := map[string]bool{}

docs/api/openapi.yml

@@ -8046,31 +8046,6 @@ components:
       - metric
       - value
       type: object
-    PromotetypesIndexMaterializedPathsResult:
-      properties:
-        indexed:
-          items:
-            $ref: '#/components/schemas/PromotetypesPromotePath'
-          nullable: true
-          type: array
-        skipped:
-          items:
-            $ref: '#/components/schemas/PromotetypesPromotePath'
-          nullable: true
-          type: array
-      required:
-      - indexed
-      - skipped
-      type: object
-    PromotetypesPostableIndexMaterializedPaths:
-      properties:
-        dryRun:
-          type: boolean
-        signal:
-          type: string
-      required:
-      - signal
-      type: object
     PromotetypesPromotePath:
       properties:
         context:
@@ -14097,67 +14072,6 @@ paths:
       tags:
       - promote
       x-signoz-stability: alpha
-  /api/v1/promoted_paths/materialized:
-    post:
-      deprecated: false
-      description: This endpoint indexes the JSON sub-columns of materialized paths
-        whose columns are indexed and returns the indexed and skipped paths.
-      operationId: IndexMaterializedPaths
-      requestBody:
-        content:
-          application/json:
-            schema:
-              $ref: '#/components/schemas/PromotetypesPostableIndexMaterializedPaths'
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    $ref: '#/components/schemas/PromotetypesIndexMaterializedPathsResult'
-                  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:
-        - logs-field:update
-        - traces-field:update
-      - tokenizer:
-        - logs-field:update
-        - traces-field:update
-      summary: Index materialized paths
-      tags:
-      - promote
-      x-signoz-stability: alpha
   /api/v1/roles:
     get:
       deprecated: false
@@ -25008,75 +24922,6 @@ paths:
       tags:
       - rules
       x-signoz-stability: alpha
-  /api/v2/rules/{id}/clone:
-    post:
-      deprecated: false
-      description: This endpoint creates a new alert rule from the stored definition
-        of an existing one. The clone keeps every modeled field of the source, including
-        its enabled/disabled state, and gets the source's name suffixed with " - Copy"
-        (or a bumped " - Copy (n)" counter when the source is itself a copy). The
-        clone is owned by the caller.
-      operationId: CloneRuleByID
-      parameters:
-      - in: path
-        name: id
-        required: true
-        schema:
-          type: string
-      responses:
-        "201":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    $ref: '#/components/schemas/RuletypesRule'
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: Created
-        "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
-        "404":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Not Found
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - EDITOR
-      - tokenizer:
-        - EDITOR
-      summary: Clone alert rule
-      tags:
-      - rules
-      x-signoz-stability: alpha
   /api/v2/rules/{id}/history/filter_keys:
     get:
       deprecated: false

ee/query-service/rules/anomaly.go

@@ -423,7 +423,7 @@ func (r *AnomalyRule) Eval(ctx context.Context, ts time.Time) (int, error) {
 func (r *AnomalyRule) String() string {
 
 	ar := ruletypes.PostableRule{
-		AlertName:         valuer.NewDisplayName(r.Name()),
+		AlertName:         r.Name(),
 		RuleCondition:     r.Condition(),
 		EvalWindow:        r.EvalWindow(),
 		Labels:            r.Labels().Map(),

ee/query-service/rules/anomaly_test.go

@@ -46,7 +46,7 @@ func TestAnomalyRule_NoData_AlertOnAbsent(t *testing.T) {
 	target := 500.0
 
 	postableRule := ruletypes.PostableRule{
-		AlertName: valuer.NewDisplayName("Test anomaly no data"),
+		AlertName: "Test anomaly no data",
 		AlertType: ruletypes.AlertTypeMetric,
 		RuleType:  ruletypes.RuleTypeAnomaly,
 		Evaluation: &ruletypes.EvaluationEnvelope{Kind: ruletypes.RollingEvaluation, Spec: ruletypes.RollingWindow{
@@ -149,7 +149,7 @@ func TestAnomalyRule_NoData_AbsentFor(t *testing.T) {
 	target := 500.0
 
 	postableRule := ruletypes.PostableRule{
-		AlertName: valuer.NewDisplayName("Test anomaly no data with AbsentFor"),
+		AlertName: "Test anomaly no data with AbsentFor",
 		AlertType: ruletypes.AlertTypeMetric,
 		RuleType:  ruletypes.RuleTypeAnomaly,
 		Evaluation: &ruletypes.EvaluationEnvelope{Kind: ruletypes.RollingEvaluation, Spec: ruletypes.RollingWindow{

ee/query-service/rules/manager.go

@@ -13,7 +13,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/errors"
 	baserules "github.com/SigNoz/signoz/pkg/query-service/rules"
 	"github.com/SigNoz/signoz/pkg/types/ruletypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
 )
 
 func PrepareTaskFunc(opts baserules.PrepareTaskOptions) (baserules.Task, error) {
@@ -119,7 +118,7 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, error) {
 	}
 
 	parsedRule := opts.Rule
-	var alertname = parsedRule.AlertName.StringValue()
+	var alertname = parsedRule.AlertName
 	if alertname == "" {
 		// alertname is not mandatory for testing, so picking
 		// a random string here
@@ -127,7 +126,7 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, error) {
 	}
 
 	// append name to indicate this is test alert
-	parsedRule.AlertName = valuer.NewDisplayName(fmt.Sprintf("%s%s", alertname, ruletypes.TestAlertPostFix))
+	parsedRule.AlertName = fmt.Sprintf("%s%s", alertname, ruletypes.TestAlertPostFix)
 
 	var rule baserules.Rule
 	var err error

frontend/src/api/__tests__/ErrorResponseHandler.test.ts

@@ -9,14 +9,12 @@ describe('ErrorResponseHandler', () => {
 			.spyOn(console, 'error')
 			.mockImplementation(() => undefined);
 
-		expect(ErrorResponseHandler(new CanceledError() as AxiosError)).toStrictEqual(
-			{
-				statusCode: 500,
-				payload: null,
-				error: 'Something went wrong',
-				message: null,
-			},
-		);
+		expect(ErrorResponseHandler(new CanceledError() as AxiosError)).toEqual({
+			statusCode: 500,
+			payload: null,
+			error: 'Something went wrong',
+			message: null,
+		});
 		expect(consoleError).not.toHaveBeenCalled();
 
 		consoleError.mockRestore();

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

@@ -18,10 +18,8 @@ import type {
 } from 'react-query';
 
 import type {
-	IndexMaterializedPaths200,
 	ListPromotedPaths200,
 	ListPromotedPathsParams,
-	PromotetypesPostableIndexMaterializedPathsDTO,
 	PromotetypesPromotePathDTO,
 	RenderErrorResponseDTO,
 } from '../sigNoz.schemas';
@@ -232,87 +230,3 @@ export const usePromotePaths = <
 > => {
 	return useMutation(getPromotePathsMutationOptions(options));
 };
-/**
- * This endpoint indexes the JSON sub-columns of materialized paths whose columns are indexed and returns the indexed and skipped paths.
- * @summary Index materialized paths
- */
-export const indexMaterializedPaths = (
-	promotetypesPostableIndexMaterializedPathsDTO?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO>,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<IndexMaterializedPaths200>({
-		url: `/api/v1/promoted_paths/materialized`,
-		method: 'POST',
-		headers: { 'Content-Type': 'application/json' },
-		data: promotetypesPostableIndexMaterializedPathsDTO,
-		signal,
-	});
-};
-
-export const getIndexMaterializedPathsMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof indexMaterializedPaths>>,
-		TError,
-		{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof indexMaterializedPaths>>,
-	TError,
-	{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-	TContext
-> => {
-	const mutationKey = ['indexMaterializedPaths'];
-	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 indexMaterializedPaths>>,
-		{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> }
-	> = (props) => {
-		const { data } = props ?? {};
-
-		return indexMaterializedPaths(data);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type IndexMaterializedPathsMutationResult = NonNullable<
-	Awaited<ReturnType<typeof indexMaterializedPaths>>
->;
-export type IndexMaterializedPathsMutationBody =
-	| BodyType<PromotetypesPostableIndexMaterializedPathsDTO>
-	| undefined;
-export type IndexMaterializedPathsMutationError =
-	ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Index materialized paths
- */
-export const useIndexMaterializedPaths = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof indexMaterializedPaths>>,
-		TError,
-		{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof indexMaterializedPaths>>,
-	TError,
-	{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-	TContext
-> => {
-	return useMutation(getIndexMaterializedPathsMutationOptions(options));
-};

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

@@ -18,8 +18,6 @@ import type {
 } from 'react-query';
 
 import type {
-	CloneRuleByID201,
-	CloneRuleByIDPathParameters,
 	CreateRule201,
 	CreateRuleView201,
 	DeleteRuleByIDPathParameters,
@@ -965,85 +963,6 @@ export const useUpdateRuleByID = <
 > => {
 	return useMutation(getUpdateRuleByIDMutationOptions(options));
 };
-/**
- * This endpoint creates a new alert rule from the stored definition of an existing one. The clone keeps every modeled field of the source, including its enabled/disabled state, and gets the source's name suffixed with " - Copy" (or a bumped " - Copy (n)" counter when the source is itself a copy). The clone is owned by the caller.
- * @summary Clone alert rule
- */
-export const cloneRuleByID = (
-	{ id }: CloneRuleByIDPathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<CloneRuleByID201>({
-		url: `/api/v2/rules/${id}/clone`,
-		method: 'POST',
-		signal,
-	});
-};
-
-export const getCloneRuleByIDMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof cloneRuleByID>>,
-		TError,
-		{ pathParams: CloneRuleByIDPathParameters },
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof cloneRuleByID>>,
-	TError,
-	{ pathParams: CloneRuleByIDPathParameters },
-	TContext
-> => {
-	const mutationKey = ['cloneRuleByID'];
-	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 cloneRuleByID>>,
-		{ pathParams: CloneRuleByIDPathParameters }
-	> = (props) => {
-		const { pathParams } = props ?? {};
-
-		return cloneRuleByID(pathParams);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type CloneRuleByIDMutationResult = NonNullable<
-	Awaited<ReturnType<typeof cloneRuleByID>>
->;
-
-export type CloneRuleByIDMutationError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Clone alert rule
- */
-export const useCloneRuleByID = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof cloneRuleByID>>,
-		TError,
-		{ pathParams: CloneRuleByIDPathParameters },
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof cloneRuleByID>>,
-	TError,
-	{ pathParams: CloneRuleByIDPathParameters },
-	TContext
-> => {
-	return useMutation(getCloneRuleByIDMutationOptions(options));
-};
 /**
  * Returns distinct label keys from rule history entries for the selected range.
  * @summary Get rule history filter keys

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

@@ -9878,28 +9878,6 @@ export interface PromotetypesPromotePathDTO {
 	signal: string;
 }
 
-export interface PromotetypesIndexMaterializedPathsResultDTO {
-	/**
-	 * @type array,null
-	 */
-	indexed: PromotetypesPromotePathDTO[] | null;
-	/**
-	 * @type array,null
-	 */
-	skipped: PromotetypesPromotePathDTO[] | null;
-}
-
-export interface PromotetypesPostableIndexMaterializedPathsDTO {
-	/**
-	 * @type boolean
-	 */
-	dryRun?: boolean;
-	/**
-	 * @type string
-	 */
-	signal: string;
-}
-
 export interface Querybuildertypesv5AggregationMetaDTO {
 	/**
 	 * @type array
@@ -13272,14 +13250,6 @@ export type ListPromotedPaths200 = {
 	status: string;
 };
 
-export type IndexMaterializedPaths200 = {
-	data: PromotetypesIndexMaterializedPathsResultDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type ListRoles200 = {
 	/**
 	 * @type array
@@ -14612,17 +14582,6 @@ export type PatchRuleByID200 = {
 export type UpdateRuleByIDPathParameters = {
 	id: string;
 };
-export type CloneRuleByIDPathParameters = {
-	id: string;
-};
-export type CloneRuleByID201 = {
-	data: RuletypesRuleDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type GetRuleHistoryFilterKeysPathParameters = {
 	id: string;
 };

frontend/src/api/v5/queryRange/convertV5Response.test.ts

@@ -61,11 +61,7 @@ describe('convertV5ResponseToLegacy', () => {
 							],
 							values: [
 								{ timestamp: 1000, value: 10 } as unknown as TimeSeriesValue,
-								{
-									timestamp: 2000,
-									value: 12,
-									partial: true,
-								} as unknown as TimeSeriesValue,
+								{ timestamp: 2000, value: 12 } as unknown as TimeSeriesValue,
 							],
 						} as unknown as TimeSeries,
 					],
@@ -108,7 +104,7 @@ describe('convertV5ResponseToLegacy', () => {
 				labels: { 'service.name': 'adservice' },
 				values: [
 					{ timestamp: 1000, value: '10' },
-					{ timestamp: 2000, value: '12', partial: true },
+					{ timestamp: 2000, value: '12' },
 				],
 				metaData: expect.objectContaining({
 					alias: '__result_0',

frontend/src/api/v5/queryRange/convertV5Response.ts

@@ -125,7 +125,6 @@ function convertTimeSeriesData(
 				values: series.values.map((value: any) => ({
 					timestamp: value.timestamp,
 					value: String(value.value),
-					...(value.partial ? { partial: true } : {}),
 				})),
 				metaData: {
 					alias,

frontend/src/components/LogDetail/LogDetail.interfaces.ts

@@ -1,5 +1,7 @@
 import { DrawerProps } from 'antd';
 import { ChangeViewFunctionType } from 'container/ExplorerOptions/types';
+import { AddToQueryHOCProps } from 'components/Logs/AddToQueryHOC';
+import { ActionItemProps } from 'container/LogDetailedView/LogDetailedView.types';
 import { IField } from 'types/api/logs/fields';
 import { ILog } from 'types/api/logs/log';
 
@@ -18,7 +20,9 @@ export type LogDetailProps = {
 	handleOpenInExplorer?: MouseEventHandler;
 	getContainer?: DrawerProps['getContainer'];
 	onApplyLogFilter?: (expression: string) => void;
-} & Pick<DrawerProps, 'onClose'>;
+} & Pick<AddToQueryHOCProps, 'onAddToQuery'> &
+	Partial<Pick<ActionItemProps, 'onClickActionItem'>> &
+	Pick<DrawerProps, 'onClose'>;
 
 export type LogDetailInnerProps = LogDetailProps & {
 	log: NonNullable<LogDetailProps['log']>;

frontend/src/components/LogDetail/__tests__/LogDetail.test.tsx

@@ -46,6 +46,8 @@ function renderDrawer(props: Partial<LogDetailProps> = {}): void {
 		<LogDetail
 			log={mockLog}
 			selectedTab={VIEW_TYPES.OVERVIEW}
+			onAddToQuery={jest.fn()}
+			onClickActionItem={jest.fn()}
 			onClose={jest.fn()}
 			{...props}
 		/>,

frontend/src/components/QuickFilters/QuickFiltersLayout/__tests__/QuickFiltersLayout.test.tsx

@@ -1,7 +1,7 @@
 import { Button } from '@signozhq/ui/button';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
 import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
-import { render, screen, userEvent, waitFor } from 'tests/test-utils';
+import { render, screen, userEvent } from 'tests/test-utils';
 
 import { QuickFiltersSource } from '../../types';
 import QuickFiltersLayout from '../QuickFiltersLayout';
@@ -197,11 +197,6 @@ describe('QuickFiltersLayout', () => {
 			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
 			expect(drawer()).not.toHaveClass('isOpen');
 
-			await waitFor(() =>
-				expect(screen.getByTestId('saved-views-open')).not.toHaveAttribute(
-					'aria-busy',
-				),
-			);
 			await user.click(screen.getByTestId('saved-views-open'));
 
 			expect(screen.getByTestId('saved-views-panel')).toBeInTheDocument();
@@ -232,11 +227,6 @@ describe('QuickFiltersLayout', () => {
 				'data-source',
 				SavedviewtypesSourceDTO.traces,
 			);
-			await waitFor(() =>
-				expect(screen.getByTestId('saved-views-open')).not.toHaveAttribute(
-					'aria-busy',
-				),
-			);
 			await userEvent.setup().click(screen.getByTestId('saved-views-open'));
 			expect(screen.getByTestId('saved-views-panel')).toHaveAttribute(
 				'data-source',

frontend/src/container/CreateAlertRule/AnomalyAlertDocumentationRedirection.test.tsx

@@ -7,11 +7,12 @@ import { AlertTypes } from 'types/api/alerts/alertTypes';
 
 import { ALERT_TYPE_URL_MAP } from './constants';
 
+// The setup guide button only exists in the classic form.
 jest.mock('react-router-dom', () => ({
 	...jest.requireActual('react-router-dom'),
 	useLocation: (): { pathname: string; search: string } => ({
 		pathname: `${process.env.FRONTEND_API_ENDPOINT}${ROUTES.ALERTS_NEW}`,
-		search: 'ruleType=anomaly_rule',
+		search: 'ruleType=anomaly_rule&showClassicCreateAlertsPage=true',
 	}),
 }));
 
@@ -20,7 +21,7 @@ jest.mock('react-router-dom-v5-compat', () => ({
 	useNavigationType: jest.fn(() => 'PUSH'),
 	useLocation: jest.fn(() => ({
 		pathname: '/alerts/new',
-		search: 'ruleType=anomaly_rule',
+		search: 'ruleType=anomaly_rule&showClassicCreateAlertsPage=true',
 		hash: '',
 		state: null,
 	})),

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

@@ -152,7 +152,7 @@ describe('CreateAlertRule', () => {
 		expect(screen.getByText(AlertTypes.METRICS_BASED_ALERT)).toBeInTheDocument();
 	});
 
-	it('should render classic flow when ruleType is anomaly_rule even if showClassicCreateAlertsPage is not true', () => {
+	it('should render new flow with the anomaly alert type when ruleType is anomaly_rule', () => {
 		mockGetUrlQuery.mockImplementation((key: string) => {
 			if (key === QueryParams.showClassicCreateAlertsPage) {
 				return 'false';
@@ -163,8 +163,9 @@ describe('CreateAlertRule', () => {
 			return null;
 		});
 		render(<CreateAlertRule />);
-		expect(screen.getByText(FORM_ALERT_RULES_TEXT)).toBeInTheDocument();
-		expect(screen.queryByText(CREATE_ALERT_V2_TEXT)).not.toBeInTheDocument();
+		expect(screen.getByText(CREATE_ALERT_V2_TEXT)).toBeInTheDocument();
+		expect(screen.getByText(AlertTypes.ANOMALY_BASED_ALERT)).toBeInTheDocument();
+		expect(screen.queryByText(FORM_ALERT_RULES_TEXT)).not.toBeInTheDocument();
 	});
 
 	it('should use alertType from URL when provided', () => {

frontend/src/container/CreateAlertRule/index.tsx

@@ -41,7 +41,7 @@ function CreateRules(): JSX.Element {
 
 	useEffect(() => {
 		if (isTypeSelectionMode) {
-			logEvent('Alert: New alert data source selection page visited', {});
+			void logEvent('Alert: New alert data source selection page visited', {});
 		}
 	}, [isTypeSelectionMode]);
 
@@ -100,10 +100,7 @@ function CreateRules(): JSX.Element {
 			return <SelectAlertType onSelect={handleSelectType} />;
 		}
 
-		if (
-			showClassicCreateAlertsPageFlag ||
-			alertType === AlertTypes.ANOMALY_BASED_ALERT
-		) {
+		if (showClassicCreateAlertsPageFlag) {
 			return (
 				<FormAlertRules
 					alertType={alertType}

frontend/src/container/CreateAlertV2/AlertCondition/AlertCondition.tsx

@@ -2,7 +2,9 @@ import { useQuery } from 'react-query';
 import { Button, Tooltip } from 'antd';
 import getAllChannels from 'api/channels/getAll';
 import classNames from 'classnames';
-import { ChartLine } from '@signozhq/icons';
+import { FeatureKeys } from 'constants/features';
+import { Activity, ChartLine } from '@signozhq/icons';
+import { useAppContext } from 'providers/App/App';
 import { SuccessResponseV2 } from 'types/api';
 import { AlertTypes } from 'types/api/alerts/alertTypes';
 import { Channels } from 'types/api/channels/getAll';
@@ -14,11 +16,14 @@ import Stepper from '../Stepper';
 import AlertThreshold from './AlertThreshold';
 import AnomalyThreshold from './AnomalyThreshold';
 import { ANOMALY_TAB_TOOLTIP, THRESHOLD_TAB_TOOLTIP } from './constants';
+import { useAnomalyFunctionSync } from './useAnomalyFunctionSync';
 
 import './styles.scss';
 
 function AlertCondition(): JSX.Element {
 	const { alertType, setAlertType } = useCreateAlertState();
+	const { featureFlags } = useAppContext();
+	useAnomalyFunctionSync();
 
 	const {
 		data,
@@ -30,9 +35,14 @@ function AlertCondition(): JSX.Element {
 	});
 	const channels = data?.data || [];
 
+	const isAnomalyDetectionEnabled =
+		featureFlags?.find((flag) => flag.name === FeatureKeys.ANOMALY_DETECTION)
+			?.active || false;
+
+	// Anomaly rules stay editable even when the flag is off.
 	const showMultipleTabs =
 		alertType === AlertTypes.ANOMALY_BASED_ALERT ||
-		alertType === AlertTypes.METRICS_BASED_ALERT;
+		(isAnomalyDetectionEnabled && alertType === AlertTypes.METRICS_BASED_ALERT);
 
 	const tabs = [
 		{
@@ -40,16 +50,15 @@ function AlertCondition(): JSX.Element {
 			icon: <ChartLine size={14} data-testid="threshold-view" />,
 			value: AlertTypes.METRICS_BASED_ALERT,
 		},
-		// Hide anomaly tab for now
-		// ...(showMultipleTabs
-		// 	? [
-		// 			{
-		// 				label: 'Anomaly',
-		// 				icon: <Activity size={14} data-testid="anomaly-view" />,
-		// 				value: AlertTypes.ANOMALY_BASED_ALERT,
-		// 			},
-		// 	  ]
-		// 	: []),
+		...(showMultipleTabs
+			? [
+					{
+						label: 'Anomaly',
+						icon: <Activity size={14} data-testid="anomaly-view" />,
+						value: AlertTypes.ANOMALY_BASED_ALERT,
+					},
+				]
+			: []),
 	];
 
 	const handleAlertTypeChange = (value: AlertTypes): void => {

frontend/src/container/CreateAlertV2/AlertCondition/AnomalyThreshold.tsx

@@ -53,7 +53,7 @@ function AnomalyThreshold({
 	const updateThreshold = (
 		id: string,
 		field: string,
-		value: string | string[],
+		value: number | string[],
 	): void => {
 		setThresholdState({
 			type: 'SET_THRESHOLDS',
@@ -112,7 +112,7 @@ function AnomalyThreshold({
 							updateThreshold(
 								thresholdState.thresholds[0].id,
 								'thresholdValue',
-								value.toString(),
+								value,
 							);
 						}}
 						options={deviationOptions}
@@ -188,7 +188,7 @@ function AnomalyThreshold({
 						}}
 						options={ANOMALY_SEASONALITY_OPTIONS}
 					/>
-					{notificationSettings.routingPolicies ? (
+					{!notificationSettings.routingPolicies ? (
 						<>
 							<Typography.Text
 								data-testid="seasonality-text"
@@ -198,12 +198,13 @@ function AnomalyThreshold({
 							</Typography.Text>
 							<Select
 								value={thresholdState.thresholds[0].channels}
+								data-testid="anomaly-notification-channel-select"
 								onChange={(value): void =>
 									updateThreshold(thresholdState.thresholds[0].id, 'channels', value)
 								}
 								style={{ width: 350 }}
 								options={channels.map((channel) => ({
-									value: channel.id,
+									value: channel.name,
 									label: channel.name,
 								}))}
 								mode="multiple"

frontend/src/container/CreateAlertV2/AlertCondition/__tests__/AlertCondition.test.tsx

@@ -1,6 +1,8 @@
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { MemoryRouter } from 'react-router-dom';
 import { fireEvent, render, screen } from '@testing-library/react';
+import * as appHooks from 'providers/App/App';
+import { createAppContextMock } from 'tests/fixtures/appContextMock';
 import { AlertTypes } from 'types/api/alerts/alertTypes';
 
 import { CreateAlertProvider } from '../../context';
@@ -65,25 +67,23 @@ jest.mock('../AnomalyThreshold', () => ({
 	},
 }));
 
+const mockHandleSetQueryData = jest.fn();
+const mockRedirectWithQueryBuilderData = jest.fn();
+const mockCurrentQuery = {
+	dataSource: 'METRICS',
+	queryName: 'A',
+	builder: {
+		queryData: [{ dataSource: 'METRICS' }],
+		queryFormulas: [],
+	},
+};
+
 // Mock useQueryBuilder hook
 jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
-	useQueryBuilder: (): {
-		currentQuery: {
-			builder: { queryData: unknown[]; queryFormulas: unknown[] };
-			dataSource: string;
-			queryName: string;
-		};
-		redirectWithQueryBuilderData: () => void;
-	} => ({
-		currentQuery: {
-			dataSource: 'METRICS',
-			queryName: 'A',
-			builder: {
-				queryData: [{ dataSource: 'METRICS' }],
-				queryFormulas: [],
-			},
-		},
-		redirectWithQueryBuilderData: jest.fn(),
+	useQueryBuilder: (): unknown => ({
+		currentQuery: mockCurrentQuery,
+		redirectWithQueryBuilderData: mockRedirectWithQueryBuilderData,
+		handleSetQueryData: mockHandleSetQueryData,
 	}),
 }));
 
@@ -112,7 +112,14 @@ const renderAlertCondition = (
 	);
 };
 
+const useAppContextSpy = jest.spyOn(appHooks, 'useAppContext');
+
 describe('AlertCondition', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+		useAppContextSpy.mockReturnValue(createAppContextMock('ADMIN'));
+	});
+
 	it('renders the stepper with correct step number and label', () => {
 		renderAlertCondition();
 		expect(screen.getByTestId(STEPPER_TEST_ID)).toHaveTextContent(
@@ -125,10 +132,9 @@ describe('AlertCondition', () => {
 
 		// Verify default alertType is METRICS_BASED_ALERT (shows AlertThreshold component)
 		expect(screen.getByTestId(ALERT_THRESHOLD_TEST_ID)).toBeInTheDocument();
-		// TODO: uncomment this when anomaly tab is implemented
-		// expect(
-		// 	screen.queryByTestId(ANOMALY_THRESHOLD_TEST_ID),
-		// ).not.toBeInTheDocument();
+		expect(
+			screen.queryByTestId(ANOMALY_THRESHOLD_TEST_ID),
+		).not.toBeInTheDocument();
 
 		// Verify threshold tab is active by default
 		const thresholdTab = screen.getByText(THRESHOLD_TAB_TEXT);
@@ -136,8 +142,7 @@ describe('AlertCondition', () => {
 
 		// Verify both tabs are visible (METRICS_BASED_ALERT supports multiple tabs)
 		expect(screen.getByText(THRESHOLD_TAB_TEXT)).toBeInTheDocument();
-		// TODO: uncomment this when anomaly tab is implemented
-		// expect(screen.getByText(ANOMALY_TAB_TEXT)).toBeInTheDocument();
+		expect(screen.getByText(ANOMALY_TAB_TEXT)).toBeInTheDocument();
 	});
 
 	it('renders threshold tab by default', () => {
@@ -152,8 +157,7 @@ describe('AlertCondition', () => {
 		).not.toBeInTheDocument();
 	});
 
-	// TODO: Unskip this when anomaly tab is implemented
-	it.skip('renders anomaly tab when alert type supports multiple tabs', () => {
+	it('renders anomaly tab when alert type supports multiple tabs', () => {
 		renderAlertCondition();
 		expect(screen.getByText(ANOMALY_TAB_TEXT)).toBeInTheDocument();
 		expect(screen.getByTestId(ANOMALY_VIEW_TEST_ID)).toBeInTheDocument();
@@ -167,8 +171,7 @@ describe('AlertCondition', () => {
 		).not.toBeInTheDocument();
 	});
 
-	// TODO: Unskip this when anomaly tab is implemented
-	it.skip('shows AnomalyThreshold component when alert type is anomaly based', () => {
+	it('shows AnomalyThreshold component when alert type is anomaly based', () => {
 		renderAlertCondition();
 
 		// Click on anomaly tab to switch to anomaly-based alert
@@ -179,8 +182,7 @@ describe('AlertCondition', () => {
 		expect(screen.queryByTestId(ALERT_THRESHOLD_TEST_ID)).not.toBeInTheDocument();
 	});
 
-	// TODO: Unskip this when anomaly tab is implemented
-	it.skip('switches between threshold and anomaly tabs', () => {
+	it('switches between threshold and anomaly tabs', () => {
 		renderAlertCondition();
 
 		// Initially shows threshold component
@@ -205,8 +207,36 @@ describe('AlertCondition', () => {
 		).not.toBeInTheDocument();
 	});
 
-	// TODO: Unskip this when anomaly tab is implemented
-	it.skip('applies active tab styling correctly', () => {
+	it('adds the anomaly function with the default z-score when switching to anomaly', () => {
+		renderAlertCondition();
+		expect(mockHandleSetQueryData).not.toHaveBeenCalled();
+
+		fireEvent.click(screen.getByText(ANOMALY_TAB_TEXT));
+
+		expect(mockHandleSetQueryData).toHaveBeenCalledWith(
+			0,
+			expect.objectContaining({
+				functions: [
+					{ name: 'anomaly', args: [], namedArgs: { z_score_threshold: 3 } },
+				],
+			}),
+		);
+	});
+
+	it('keeps the current query when switching between threshold and anomaly', () => {
+		renderAlertCondition();
+
+		fireEvent.click(screen.getByText(ANOMALY_TAB_TEXT));
+
+		expect(mockRedirectWithQueryBuilderData).toHaveBeenCalledWith(
+			mockCurrentQuery,
+			{ alertType: AlertTypes.ANOMALY_BASED_ALERT, ruleType: 'anomaly_rule' },
+			undefined,
+			true,
+		);
+	});
+
+	it('applies active tab styling correctly', () => {
 		renderAlertCondition();
 
 		const thresholdTab = screen.getByText(THRESHOLD_TAB_TEXT);
@@ -227,11 +257,20 @@ describe('AlertCondition', () => {
 	it('shows multiple tabs for METRICS_BASED_ALERT', () => {
 		renderAlertCondition('METRIC_BASED_ALERT');
 
-		// TODO: uncomment this when anomaly tab is implemented
 		expect(screen.getByText(THRESHOLD_TAB_TEXT)).toBeInTheDocument();
-		// expect(screen.getByText(ANOMALY_TAB_TEXT)).toBeInTheDocument();
+		expect(screen.getByText(ANOMALY_TAB_TEXT)).toBeInTheDocument();
 		expect(screen.getByTestId(THRESHOLD_VIEW_TEST_ID)).toBeInTheDocument();
-		// expect(screen.getByTestId(ANOMALY_VIEW_TEST_ID)).toBeInTheDocument();
+		expect(screen.getByTestId(ANOMALY_VIEW_TEST_ID)).toBeInTheDocument();
+	});
+
+	it('hides the anomaly tab for METRICS_BASED_ALERT when anomaly detection is off', () => {
+		useAppContextSpy.mockReturnValue(
+			createAppContextMock('ADMIN', { featureFlags: [] }),
+		);
+		renderAlertCondition('METRIC_BASED_ALERT');
+
+		expect(screen.getByText(THRESHOLD_TAB_TEXT)).toBeInTheDocument();
+		expect(screen.queryByText(ANOMALY_TAB_TEXT)).not.toBeInTheDocument();
 	});
 
 	it('shows multiple tabs for ANOMALY_BASED_ALERT', () => {
@@ -239,9 +278,8 @@ describe('AlertCondition', () => {
 
 		expect(screen.getByText(THRESHOLD_TAB_TEXT)).toBeInTheDocument();
 		expect(screen.getByTestId(THRESHOLD_VIEW_TEST_ID)).toBeInTheDocument();
-		// TODO: uncomment this when anomaly tab is implemented
-		// expect(screen.getByText(ANOMALY_TAB_TEXT)).toBeInTheDocument();
-		// expect(screen.getByTestId(ANOMALY_VIEW_TEST_ID)).toBeInTheDocument();
+		expect(screen.getByText(ANOMALY_TAB_TEXT)).toBeInTheDocument();
+		expect(screen.getByTestId(ANOMALY_VIEW_TEST_ID)).toBeInTheDocument();
 	});
 
 	it('shows only threshold tab for LOGS_BASED_ALERT', () => {

frontend/src/container/CreateAlertV2/AlertCondition/__tests__/AnomalyThreshold.test.tsx

@@ -1,7 +1,8 @@
-import { render, screen } from '@testing-library/react';
+import { fireEvent, render, screen, within } from '@testing-library/react';
 import { createMockAlertContextState } from 'container/CreateAlertV2/EvaluationSettings/__tests__/testUtils';
 import { getAppContextMockState } from 'container/RoutingPolicies/__tests__/testUtils';
 import * as appHooks from 'providers/App/App';
+import { Channels } from 'types/api/channels/getAll';
 
 import * as context from '../../context';
 import AnomalyThreshold from '../AnomalyThreshold';
@@ -22,12 +23,11 @@ jest.mock('uplot', () => {
 
 const mockSetAlertState = jest.fn();
 const mockSetThresholdState = jest.fn();
-jest.spyOn(context, 'useCreateAlertState').mockReturnValue(
-	createMockAlertContextState({
-		setThresholdState: mockSetThresholdState,
-		setAlertState: mockSetAlertState,
-	}),
-);
+const mockContextState = createMockAlertContextState({
+	setThresholdState: mockSetThresholdState,
+	setAlertState: mockSetAlertState,
+});
+const useCreateAlertStateSpy = jest.spyOn(context, 'useCreateAlertState');
 
 // Mock useQueryBuilder hook
 jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
@@ -52,10 +52,12 @@ jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
 	}),
 }));
 
+const channels = [{ id: '1', name: 'slack-alerts' }] as Channels[];
+
 const renderAnomalyThreshold = (): ReturnType<typeof render> =>
 	render(
 		<AnomalyThreshold
-			channels={[]}
+			channels={channels}
 			isLoadingChannels={false}
 			isErrorChannels={false}
 			refreshChannels={jest.fn()}
@@ -65,8 +67,13 @@ const renderAnomalyThreshold = (): ReturnType<typeof render> =>
 describe('AnomalyThreshold', () => {
 	beforeEach(() => {
 		jest.clearAllMocks();
+		useCreateAlertStateSpy.mockReturnValue(mockContextState);
 	});
 
+	const openSelect = (testId: string): void => {
+		fireEvent.mouseDown(within(screen.getByTestId(testId)).getByRole('combobox'));
+	};
+
 	it('renders the first condition sentence', () => {
 		renderAnomalyThreshold();
 		expect(screen.getByTestId('notification-text')).toBeInTheDocument();
@@ -92,4 +99,38 @@ describe('AnomalyThreshold', () => {
 		expect(screen.getByTestId('seasonality-select')).toBeInTheDocument();
 		expect(screen.getByTestId('seasonality-text')).toBeInTheDocument();
 	});
+
+	it('stores the picked deviation as a number', () => {
+		renderAnomalyThreshold();
+		openSelect('threshold-value-select');
+		fireEvent.click(screen.getByTitle('4'));
+		expect(mockSetThresholdState).toHaveBeenCalledWith({
+			type: 'SET_THRESHOLDS',
+			payload: [expect.objectContaining({ thresholdValue: 4 })],
+		});
+	});
+
+	it('picks channels by name when routing policies are off', () => {
+		renderAnomalyThreshold();
+		openSelect('anomaly-notification-channel-select');
+		fireEvent.click(screen.getByTitle('slack-alerts'));
+		expect(mockSetThresholdState).toHaveBeenCalledWith({
+			type: 'SET_THRESHOLDS',
+			payload: [expect.objectContaining({ channels: ['slack-alerts'] })],
+		});
+	});
+
+	it('hides the channel picker when routing policies are on', () => {
+		useCreateAlertStateSpy.mockReturnValue({
+			...mockContextState,
+			notificationSettings: {
+				...mockContextState.notificationSettings,
+				routingPolicies: true,
+			},
+		});
+		renderAnomalyThreshold();
+		expect(
+			screen.queryByTestId('anomaly-notification-channel-select'),
+		).not.toBeInTheDocument();
+	});
 });

frontend/src/container/CreateAlertV2/AlertCondition/__tests__/utils.test.ts

@@ -0,0 +1,31 @@
+import { QueryFunction } from 'types/api/v5/queryRange';
+
+import { syncAnomalyFunction } from '../utils';
+
+const timeShift: QueryFunction = { name: 'timeShift', args: [{ value: 3600 }] };
+const anomaly = (zScoreThreshold: number): QueryFunction => ({
+	name: 'anomaly',
+	args: [],
+	namedArgs: { z_score_threshold: zScoreThreshold },
+});
+
+describe('syncAnomalyFunction', () => {
+	it('adds the anomaly function after the existing functions', () => {
+		expect(syncAnomalyFunction([timeShift], 3)).toStrictEqual([
+			timeShift,
+			anomaly(3),
+		]);
+	});
+
+	it('replaces a stale z-score and is idempotent', () => {
+		const synced = syncAnomalyFunction([anomaly(3), timeShift], 5);
+		expect(synced).toStrictEqual([timeShift, anomaly(5)]);
+		expect(syncAnomalyFunction(synced, 5)).toStrictEqual(synced);
+	});
+
+	it('removes the anomaly function when no z-score is given', () => {
+		expect(syncAnomalyFunction([anomaly(3), timeShift], undefined)).toStrictEqual(
+			[timeShift],
+		);
+	});
+});

frontend/src/container/CreateAlertV2/AlertCondition/useAnomalyFunctionSync.ts

@@ -0,0 +1,28 @@
+import { useEffect } from 'react';
+import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import { isEqual } from 'lodash-es';
+import { AlertTypes } from 'types/api/alerts/alertTypes';
+
+import { useCreateAlertState } from '../context';
+import { syncAnomalyFunction } from './utils';
+
+// The anomaly function's z-score only draws the preview bands; alerting uses the threshold target.
+export function useAnomalyFunctionSync(): void {
+	const { alertType, thresholdState } = useCreateAlertState();
+	const { currentQuery, handleSetQueryData } = useQueryBuilder();
+
+	const zScoreThreshold =
+		alertType === AlertTypes.ANOMALY_BASED_ALERT
+			? Number(thresholdState.thresholds[0]?.thresholdValue)
+			: undefined;
+
+	useEffect(() => {
+		currentQuery.builder.queryData.forEach((queryData, index) => {
+			const currentFunctions = queryData.functions || [];
+			const functions = syncAnomalyFunction(currentFunctions, zScoreThreshold);
+			if (!isEqual(functions, currentFunctions)) {
+				handleSetQueryData(index, { ...queryData, functions });
+			}
+		});
+	}, [currentQuery.builder.queryData, zScoreThreshold, handleSetQueryData]);
+}

frontend/src/container/CreateAlertV2/AlertCondition/utils.tsx

@@ -15,6 +15,7 @@ import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import { ArrowRight } from '@signozhq/icons';
 import { IUser } from 'providers/App/types';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
+import { QueryFunction } from 'types/api/v5/queryRange';
 import { EQueryType } from 'types/common/dashboard';
 import { USER_ROLES } from 'types/roles';
 import { openInNewTab } from 'utils/navigation';
@@ -43,6 +44,25 @@ export function getQueryNames(currentQuery: Query): BaseOptionType[] {
 	return queryConfig[currentQuery.queryType]?.() || [];
 }
 
+// Drops the anomaly function, or re-adds it last with the given z-score.
+export function syncAnomalyFunction(
+	functions: QueryFunction[],
+	zScoreThreshold: number | undefined,
+): QueryFunction[] {
+	const otherFunctions = functions.filter(({ name }) => name !== 'anomaly');
+	if (zScoreThreshold === undefined) {
+		return otherFunctions;
+	}
+	return [
+		...otherFunctions,
+		{
+			name: 'anomaly',
+			args: [],
+			namedArgs: { z_score_threshold: zScoreThreshold },
+		},
+	];
+}
+
 export function getCategoryByOptionId(id: string): string | undefined {
 	const categories = getYAxisCategories(YAxisSource.ALERTS);
 	return categories.find((category) =>

frontend/src/container/CreateAlertV2/Footer/Footer.tsx

@@ -13,10 +13,7 @@ import APIError from 'types/api/error';
 import { isModifierKeyPressed } from 'utils/app';
 
 import { useCreateAlertState } from '../context';
-import {
-	buildCreateThresholdAlertRulePayload,
-	validateCreateAlertState,
-} from './utils';
+import { buildCreateAlertRulePayload, validateCreateAlertState } from './utils';
 
 import './styles.scss';
 import {
@@ -84,7 +81,7 @@ function Footer(): JSX.Element {
 	);
 
 	const handleTestNotification = useCallback((): void => {
-		const payload = buildCreateThresholdAlertRulePayload({
+		const payload = buildCreateAlertRulePayload({
 			alertType,
 			basicAlertState,
 			thresholdState,
@@ -117,11 +114,12 @@ function Footer(): JSX.Element {
 		notificationSettings,
 		currentQuery,
 		testAlertRule,
+		handleApiError,
 	]);
 
 	const queryClient = useQueryClient();
 	const handleSaveAlert = useCallback((): void => {
-		const payload = buildCreateThresholdAlertRulePayload({
+		const payload = buildCreateAlertRulePayload({
 			alertType,
 			basicAlertState,
 			thresholdState,
@@ -173,6 +171,7 @@ function Footer(): JSX.Element {
 		createAlertRule,
 		safeNavigate,
 		handleApiError,
+		queryClient,
 	]);
 
 	const isSavingAlertRule = isCreatingAlertRule || isUpdatingAlertRule;

frontend/src/container/CreateAlertV2/Footer/__tests__/utils.test.ts

@@ -9,8 +9,11 @@ import {
 } from 'container/CreateAlertV2/context/constants';
 import {
 	AdvancedOptionsState,
+	AlertThresholdOperator,
 	EvaluationWindowState,
 	NotificationSettingsState,
+	Seasonality,
+	TimeDuration,
 } from 'container/CreateAlertV2/context/types';
 import { createMockAlertContextState } from 'container/CreateAlertV2/EvaluationSettings/__tests__/testUtils';
 import { AlertTypes } from 'types/api/alerts/alertTypes';
@@ -18,6 +21,7 @@ import { EQueryType } from 'types/common/dashboard';
 
 import { BuildCreateAlertRulePayloadArgs } from '../types';
 import {
+	buildCreateAlertRulePayload,
 	buildCreateThresholdAlertRulePayload,
 	getAlertOnAbsentProps,
 	getEnforceMinimumDatapointsProps,
@@ -573,4 +577,65 @@ describe('Footer utils', () => {
 			},
 		);
 	});
+
+	describe('buildCreateAlertRulePayload', () => {
+		const mockCreateAlertContextState = createMockAlertContextState();
+		const thresholdState = mockCreateAlertContextState.thresholdState;
+		const anomalyArgs: BuildCreateAlertRulePayloadArgs = {
+			basicAlertState: mockCreateAlertContextState.alertState,
+			thresholdState: {
+				...thresholdState,
+				evaluationWindow: TimeDuration.ONE_HOUR,
+				seasonality: Seasonality.DAILY,
+				thresholds: [
+					{ ...thresholdState.thresholds[0], thresholdValue: 3, unit: 'ms' },
+				],
+			},
+			advancedOptions: mockCreateAlertContextState.advancedOptions,
+			evaluationWindow: mockCreateAlertContextState.evaluationWindow,
+			notificationSettings: mockCreateAlertContextState.notificationSettings,
+			query: initialQueriesMap.metrics,
+			alertType: AlertTypes.ANOMALY_BASED_ALERT,
+		};
+
+		it('builds a v2alpha1 anomaly rule with a rolling window', () => {
+			const props = buildCreateAlertRulePayload(anomalyArgs);
+			expect(props.ruleType).toBe('anomaly_rule');
+			expect(props.alertType).toBe(AlertTypes.METRICS_BASED_ALERT);
+			expect(props.schemaVersion).toBe('v2alpha1');
+			expect(props.condition.algorithm).toBe('standard');
+			expect(props.condition.seasonality).toBe('daily');
+			expect(props.condition.thresholds?.spec[0]).toMatchObject({
+				target: 3,
+				targetUnit: '',
+			});
+			expect(props.evaluation).toStrictEqual({
+				kind: 'rolling',
+				spec: { evalWindow: '1h0m0s', frequency: '1m' },
+			});
+		});
+
+		it.each([
+			[AlertThresholdOperator.IS_BELOW, -3],
+			['2', -3],
+			[AlertThresholdOperator.IS_ABOVE, 3],
+			[AlertThresholdOperator.ABOVE_BELOW, 3],
+		])('signs the z-score target for operator %s', (operator, target) => {
+			const props = buildCreateAlertRulePayload({
+				...anomalyArgs,
+				thresholdState: { ...anomalyArgs.thresholdState, operator },
+			});
+			expect(props.condition.thresholds?.spec[0].target).toBe(target);
+			expect(props.condition.thresholds?.spec[0].op).toBe(operator);
+		});
+
+		it('builds a threshold rule for other alert types', () => {
+			const props = buildCreateAlertRulePayload({
+				...anomalyArgs,
+				alertType: AlertTypes.METRICS_BASED_ALERT,
+			});
+			expect(props.ruleType).toBe('threshold_rule');
+			expect(props.condition.seasonality).toBeUndefined();
+		});
+	});
 });

frontend/src/container/CreateAlertV2/Footer/utils.tsx

@@ -2,6 +2,7 @@ import { UniversalYAxisUnit } from 'components/YAxisUnitSelector/types';
 import { PANEL_TYPES } from 'constants/queryBuilder';
 import { AlertDetectionTypes } from 'container/FormAlertRules';
 import { mapQueryDataToApi } from 'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataToApi';
+import { AlertTypes } from 'types/api/alerts/alertTypes';
 import {
 	BasicThreshold,
 	PostableAlertRuleV2,
@@ -9,8 +10,10 @@ import {
 import { EQueryType } from 'types/common/dashboard';
 import { compositeQueryToQueryEnvelope } from 'utils/compositeQueryToQueryEnvelope';
 
+import { normalizeOperator } from '../context/conditionNormalizers';
 import {
 	AdvancedOptionsState,
+	AlertThresholdOperator,
 	EvaluationWindowState,
 	NotificationSettingsState,
 } from '../context/types';
@@ -289,56 +292,51 @@ export function buildCreateThresholdAlertRulePayload(
 }
 
 // Build Create Anomaly Alert Rule Payload
-// TODO: Update this function before enabling anomaly alert rule creation
 export function buildCreateAnomalyAlertRulePayload(
 	args: BuildCreateAlertRulePayloadArgs,
 ): PostableAlertRuleV2 {
-	const {
-		alertType,
-		basicAlertState,
-		query,
-		notificationSettings,
-		evaluationWindow,
-		advancedOptions,
-	} = args;
+	const { thresholdState, evaluationWindow, advancedOptions } = args;
+	const payload = buildCreateThresholdAlertRulePayload(args);
 
-	const compositeQuery = compositeQueryToQueryEnvelope({
-		builderQueries: {
-			...mapQueryDataToApi(query.builder.queryData, 'queryName').data,
-			...mapQueryDataToApi(query.builder.queryFormulas, 'queryName').data,
-		},
-		promQueries: mapQueryDataToApi(query.promql, 'name').data,
-		chQueries: mapQueryDataToApi(query.clickhouse_sql, 'name').data,
-		queryType: query.queryType,
-		panelType: PANEL_TYPES.TIME_SERIES,
-		unit: basicAlertState.yAxisUnit,
-	});
-
-	const alertOnAbsentProps = getAlertOnAbsentProps(advancedOptions);
-	const enforceMinimumDatapointsProps =
-		getEnforceMinimumDatapointsProps(advancedOptions);
-	const evaluationProps = getEvaluationProps(evaluationWindow, advancedOptions);
-	const notificationSettingsProps =
-		getNotificationSettingsProps(notificationSettings);
+	// Targets are literal z-scores: "below N deviations" fires under -N.
+	// A target unit would rescale the z-score, so it is always cleared.
+	const sign =
+		normalizeOperator(thresholdState.operator) === AlertThresholdOperator.IS_BELOW
+			? -1
+			: 1;
+	const thresholds: BasicThreshold[] = (
+		payload.condition.thresholds?.spec || []
+	).map((threshold) => ({
+		...threshold,
+		target: sign * Math.abs(threshold.target),
+		targetUnit: '',
+	}));
 
 	return {
-		alert: basicAlertState.name,
+		...payload,
 		ruleType: AlertDetectionTypes.ANOMALY_DETECTION_ALERT,
-		alertType,
+		alertType: AlertTypes.METRICS_BASED_ALERT,
 		condition: {
-			compositeQuery,
-			...alertOnAbsentProps,
-			...enforceMinimumDatapointsProps,
+			...payload.condition,
+			thresholds: { kind: 'basic', spec: thresholds },
+			algorithm: thresholdState.algorithm,
+			seasonality: thresholdState.seasonality,
 		},
-		labels: basicAlertState.labels,
-		annotations: {
-			description: notificationSettings.description,
-			summary: notificationSettings.description,
-		},
-		notificationSettings: notificationSettingsProps,
-		evaluation: evaluationProps,
-		version: '',
-		schemaVersion: '',
-		source: window?.location.toString(),
+		evaluation: getEvaluationProps(
+			{
+				...evaluationWindow,
+				windowType: 'rolling',
+				timeframe: thresholdState.evaluationWindow,
+			},
+			advancedOptions,
+		),
 	};
 }
+
+export function buildCreateAlertRulePayload(
+	args: BuildCreateAlertRulePayloadArgs,
+): PostableAlertRuleV2 {
+	return args.alertType === AlertTypes.ANOMALY_BASED_ALERT
+		? buildCreateAnomalyAlertRulePayload(args)
+		: buildCreateThresholdAlertRulePayload(args);
+}

frontend/src/container/CreateAlertV2/QuerySection/QuerySection.tsx

@@ -81,13 +81,15 @@ function QuerySection(): JSX.Element {
 	}, [isLoadingQueries]);
 
 	const handleCancelQuery = useCallback(() => {
-		queryClient.cancelQueries([REACT_QUERY_KEY.ALERT_RULES_CHART_PREVIEW]);
+		void queryClient.cancelQueries([REACT_QUERY_KEY.ALERT_RULES_CHART_PREVIEW]);
 		setIsCancelled(true);
 	}, [queryClient]);
 
 	const runQueryHandler = useCallback(() => {
 		setIsCancelled(false);
-		queryClient.invalidateQueries([REACT_QUERY_KEY.ALERT_RULES_CHART_PREVIEW]);
+		void queryClient.invalidateQueries([
+			REACT_QUERY_KEY.ALERT_RULES_CHART_PREVIEW,
+		]);
 		// Reset the source param when the query is changed
 		// Then manually run the query
 		if (source === YAxisSource.DASHBOARDS && didQueryChange) {
@@ -129,6 +131,11 @@ function QuerySection(): JSX.Element {
 		},
 	];
 
+	const isAnomalyDetection = alertType === AlertTypes.ANOMALY_BASED_ALERT;
+	const activeTab = isAnomalyDetection
+		? AlertTypes.METRICS_BASED_ALERT
+		: alertType;
+
 	return (
 		<div className="query-section">
 			<Stepper stepNumber={1} label="Define the query" />
@@ -144,7 +151,7 @@ function QuerySection(): JSX.Element {
 						<Button
 							key={tab.value}
 							className={classNames('list-view-tab', 'explorer-view-option', {
-								'active-tab': alertType === tab.value,
+								'active-tab': activeTab === tab.value,
 							})}
 							onClick={(): void => {
 								setAlertType(tab.value as AlertTypes);
@@ -165,6 +172,7 @@ function QuerySection(): JSX.Element {
 				handleCancelQuery={handleCancelQuery}
 				alertDef={alertDef}
 				panelType={PANEL_TYPES.TIME_SERIES}
+				isAnomalyDetection={isAnomalyDetection}
 				key={currentQuery.queryType}
 				ruleId=""
 				hideTitle

frontend/src/container/CreateAlertV2/QuerySection/__tests__/QuerySection.test.tsx

@@ -61,10 +61,12 @@ jest.mock(
 			alertType,
 			panelType,
 			setQueryCategory,
+			isAnomalyDetection,
 		}: any): JSX.Element {
 			return (
 				<div data-testid="query-section-component">
 					<div data-testid="query-category">{queryCategory}</div>
+					<div data-testid="is-anomaly-detection">{String(isAnomalyDetection)}</div>
 					<div data-testid="alert-type">{alertType}</div>
 					<div data-testid="panel-type">{panelType}</div>
 					<button
@@ -127,11 +129,11 @@ const queryClient = new QueryClient({
 		},
 	},
 });
-const renderQuerySection = (): ReturnType<typeof render> =>
+const renderQuerySection = (search = ''): ReturnType<typeof render> =>
 	render(
 		<Provider store={store}>
 			<QueryClientProvider client={queryClient}>
-				<MemoryRouter>
+				<MemoryRouter initialEntries={[`/alerts/new${search}`]}>
 					<CreateAlertProvider initialAlertType={AlertTypes.METRICS_BASED_ALERT}>
 						<QuerySection />
 					</CreateAlertProvider>
@@ -201,6 +203,15 @@ describe('QuerySection', () => {
 		expect(metricsTab).toHaveClass(ACTIVE_TAB_CLASS);
 	});
 
+	it('keeps Metrics active and restricts query types for anomaly alerts', () => {
+		renderQuerySection(`?${QueryParams.ruleType}=anomaly_rule`);
+
+		expect(screen.getByText(METRICS_TEXT).closest('button')).toHaveClass(
+			ACTIVE_TAB_CLASS,
+		);
+		expect(screen.getByTestId('is-anomaly-detection')).toHaveTextContent('true');
+	});
+
 	it('handles alert type change when clicking on different tabs', async () => {
 		const user = userEvent.setup();
 		renderQuerySection();

frontend/src/container/CreateAlertV2/__tests__/utils.test.tsx

@@ -1,5 +1,6 @@
 import { Color } from '@signozhq/design-tokens';
 import { UniversalYAxisUnit } from 'components/YAxisUnitSelector/types';
+import { AlertTypes } from 'types/api/alerts/alertTypes';
 import { PostableAlertRuleV2 } from 'types/api/alerts/alertTypesV2';
 
 import { defaultPostableAlertRuleV2 } from '../constants';
@@ -11,6 +12,7 @@ import {
 import {
 	getAdvancedOptionsStateFromAlertDef,
 	getColorForThreshold,
+	getAlertTypeFromAlertDef,
 	getCreateAlertLocalStateFromAlertDef,
 	getEvaluationWindowStateFromAlertDef,
 	getNotificationSettingsStateFromAlertDef,
@@ -271,7 +273,7 @@ describe('CreateAlertV2 utils', () => {
 		});
 	});
 
-	describe('getThresholdStateFromAlertDef', () => {
+	it('getThresholdStateFromAlertDef maps thresholds, query, operator and match type', () => {
 		const args: PostableAlertRuleV2 = {
 			...defaultPostableAlertRuleV2,
 			annotations: {
@@ -316,6 +318,76 @@ describe('CreateAlertV2 utils', () => {
 		});
 	});
 
+	describe('getThresholdStateFromAlertDef for anomaly rules', () => {
+		const anomalyDef: PostableAlertRuleV2 = {
+			...defaultPostableAlertRuleV2,
+			ruleType: 'anomaly_rule',
+			condition: {
+				...defaultPostableAlertRuleV2.condition,
+				algorithm: 'standard',
+				seasonality: 'weekly',
+				thresholds: {
+					kind: 'basic',
+					spec: [
+						{
+							name: 'critical',
+							target: -3,
+							targetUnit: '',
+							channels: ['email'],
+							matchType: AlertThresholdMatchType.ALL_THE_TIME,
+							op: AlertThresholdOperator.IS_BELOW,
+						},
+					],
+				},
+			},
+			evaluation: {
+				kind: 'rolling',
+				spec: { evalWindow: '1h0m0s', frequency: '1m' },
+			},
+		};
+
+		it('shows deviations unsigned and restores the anomaly settings', () => {
+			expect(getThresholdStateFromAlertDef(anomalyDef)).toMatchObject({
+				operator: AlertThresholdOperator.IS_BELOW,
+				thresholds: [{ thresholdValue: 3 }],
+				algorithm: 'standard',
+				seasonality: 'weekly',
+				evaluationWindow: '1h0m0s',
+			});
+		});
+
+		it('keeps signed targets and the default window for threshold rules', () => {
+			const state = getThresholdStateFromAlertDef({
+				...anomalyDef,
+				ruleType: 'threshold_rule',
+			});
+			expect(state.thresholds[0].thresholdValue).toBe(-3);
+			expect(state.evaluationWindow).toBe('5m0s');
+		});
+	});
+
+	describe('getAlertTypeFromAlertDef', () => {
+		it('maps anomaly rules to the anomaly alert type', () => {
+			expect(
+				getAlertTypeFromAlertDef({
+					...defaultPostableAlertRuleV2,
+					alertType: AlertTypes.METRICS_BASED_ALERT,
+					ruleType: 'anomaly_rule',
+				}),
+			).toBe(AlertTypes.ANOMALY_BASED_ALERT);
+		});
+
+		it('keeps the stored alert type for other rules', () => {
+			expect(
+				getAlertTypeFromAlertDef({
+					...defaultPostableAlertRuleV2,
+					alertType: AlertTypes.LOGS_BASED_ALERT,
+					ruleType: 'threshold_rule',
+				}),
+			).toBe(AlertTypes.LOGS_BASED_ALERT);
+		});
+	});
+
 	describe('getThresholdStateFromAlertDef null channels', () => {
 		it('falls back to an empty array so downstream consumers never see null', () => {
 			const def: PostableAlertRuleV2 = {

frontend/src/container/CreateAlertV2/context/__tests__/CreateAlertProvider.prefill.test.tsx

@@ -97,6 +97,13 @@ describe('CreateAlertProvider — URL-declared prefill (issue #5291)', () => {
 		expect(screen.getByTestId('window-type')).toHaveTextContent('rolling');
 	});
 
+	it('starts new anomaly alerts at 3 deviations', () => {
+		renderWithSearch(`?ruleType=anomaly_rule`);
+
+		expect(screen.getByTestId('threshold-count')).toHaveTextContent('1');
+		expect(screen.getByTestId('threshold-value')).toHaveTextContent('3');
+	});
+
 	it('applies the meter evaluation window when the preset is declared', () => {
 		// Ingestion-style prefill: explicit in_total + meter preset.
 		renderWithSearch(

frontend/src/container/CreateAlertV2/context/constants.ts

@@ -35,6 +35,11 @@ export const INITIAL_CRITICAL_THRESHOLD: Threshold = {
 	color: Color.BG_SAKURA_500,
 };
 
+export const INITIAL_ANOMALY_THRESHOLD: Threshold = {
+	...INITIAL_CRITICAL_THRESHOLD,
+	thresholdValue: 3,
+};
+
 export const INITIAL_WARNING_THRESHOLD: Threshold = {
 	id: v4(),
 	label: 'warning',

frontend/src/container/CreateAlertV2/context/index.tsx

@@ -22,7 +22,10 @@ import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { mapQueryDataFromApi } from 'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi';
 import { AlertTypes } from 'types/api/alerts/alertTypes';
 
-import { INITIAL_CREATE_ALERT_STATE } from './constants';
+import {
+	INITIAL_ANOMALY_THRESHOLD,
+	INITIAL_CREATE_ALERT_STATE,
+} from './constants';
 import {
 	EvaluationWindowPreset,
 	resolveUrlAlertPrefill,
@@ -143,12 +146,20 @@ export function CreateAlertProvider(
 
 	const handleAlertTypeChange = useCallback(
 		(value: AlertTypes): void => {
-			const queryToRedirect = buildInitialAlertDef(value);
-			const currentQueryToRedirect = mapQueryDataFromApi(
-				queryToRedirect.condition.compositeQuery,
-			);
+			// Threshold and anomaly alerts share the metric query, so switching keeps it.
+			const metricAlertTypes = [
+				AlertTypes.METRICS_BASED_ALERT,
+				AlertTypes.ANOMALY_BASED_ALERT,
+			];
+			const keepsQuery =
+				value !== alertType &&
+				metricAlertTypes.includes(value) &&
+				metricAlertTypes.includes(alertType);
+			const queryToRedirect = keepsQuery
+				? currentQuery
+				: mapQueryDataFromApi(buildInitialAlertDef(value).condition.compositeQuery);
 			redirectWithQueryBuilderData(
-				currentQueryToRedirect,
+				queryToRedirect,
 				{
 					[QueryParams.alertType]: value,
 					[QueryParams.ruleType]:
@@ -161,7 +172,7 @@ export function CreateAlertProvider(
 			);
 			setAlertType(value);
 		},
-		[redirectWithQueryBuilderData],
+		[alertType, currentQuery, redirectWithQueryBuilderData],
 	);
 
 	const ruleNameAppliedRef = useRef(false);
@@ -183,6 +194,16 @@ export function CreateAlertProvider(
 			},
 		});
 
+		if (alertType === AlertTypes.ANOMALY_BASED_ALERT) {
+			setCreateAlertState({
+				slice: CreateAlertSlice.THRESHOLD,
+				action: {
+					type: 'SET_THRESHOLDS',
+					payload: [INITIAL_ANOMALY_THRESHOLD],
+				},
+			});
+		}
+
 		if (urlPrefill.thresholds) {
 			setCreateAlertState({
 				slice: CreateAlertSlice.THRESHOLD,

frontend/src/container/CreateAlertV2/context/utils.tsx

@@ -124,6 +124,12 @@ export const alertThresholdReducer = (
 			return { ...state, operator: action.payload };
 		case 'SET_MATCH_TYPE':
 			return { ...state, matchType: action.payload };
+		case 'SET_EVALUATION_WINDOW':
+			return { ...state, evaluationWindow: action.payload };
+		case 'SET_ALGORITHM':
+			return { ...state, algorithm: action.payload };
+		case 'SET_SEASONALITY':
+			return { ...state, seasonality: action.payload };
 		case 'SET_THRESHOLDS':
 			return { ...state, thresholds: action.payload };
 		case 'RESET':

frontend/src/container/CreateAlertV2/utils.tsx

@@ -4,6 +4,8 @@ import { Spin } from 'antd';
 import { TIMEZONE_DATA } from 'components/CustomTimePicker/timezoneUtils';
 import { UniversalYAxisUnit } from 'components/YAxisUnitSelector/types';
 import { getRandomColor } from 'container/ExplorerOptions/utils';
+import { AlertDetectionTypes } from 'container/FormAlertRules';
+import { AlertTypes } from 'types/api/alerts/alertTypes';
 import { PostableAlertRuleV2 } from 'types/api/alerts/alertTypesV2';
 import { v4 } from 'uuid';
 
@@ -248,13 +250,18 @@ export {
 export function getThresholdStateFromAlertDef(
 	alertDef: PostableAlertRuleV2,
 ): AlertThresholdState {
+	const isAnomalyRule =
+		alertDef.ruleType === AlertDetectionTypes.ANOMALY_DETECTION_ALERT;
 	return {
 		...INITIAL_ALERT_THRESHOLD_STATE,
 		thresholds:
 			alertDef.condition.thresholds?.spec.map((threshold) => ({
 				id: v4(),
 				label: threshold.name,
-				thresholdValue: threshold.target,
+				// anomaly targets are signed z-scores; the operator carries the direction
+				thresholdValue: isAnomalyRule
+					? Math.abs(threshold.target)
+					: threshold.target,
 				recoveryThresholdValue: null,
 				unit: threshold.targetUnit,
 				color: getColorForThreshold(threshold.name),
@@ -268,9 +275,26 @@ export function getThresholdStateFromAlertDef(
 		matchType:
 			alertDef.condition.thresholds?.spec[0].matchType ||
 			AlertThresholdMatchType.AT_LEAST_ONCE,
+		algorithm:
+			alertDef.condition.algorithm || INITIAL_ALERT_THRESHOLD_STATE.algorithm,
+		seasonality:
+			alertDef.condition.seasonality || INITIAL_ALERT_THRESHOLD_STATE.seasonality,
+		evaluationWindow:
+			(isAnomalyRule && alertDef.evaluation?.spec?.evalWindow) ||
+			INITIAL_ALERT_THRESHOLD_STATE.evaluationWindow,
 	};
 }
 
+// Anomaly rules are stored as metric alerts; only the rule type tells them apart.
+export function getAlertTypeFromAlertDef(
+	alertDef: PostableAlertRuleV2 | undefined,
+): AlertTypes {
+	if (alertDef?.ruleType === AlertDetectionTypes.ANOMALY_DETECTION_ALERT) {
+		return AlertTypes.ANOMALY_BASED_ALERT;
+	}
+	return alertDef?.alertType as AlertTypes;
+}
+
 export function getCreateAlertLocalStateFromAlertDef(
 	alertDef: PostableAlertRuleV2 | undefined,
 ): CreateAlertState {

frontend/src/container/InfraMonitoringK8sV2/EntityDetailsUtils/EntityLogs/EntityLogs.tsx

@@ -25,8 +25,10 @@ import { InfraMonitoringEntity } from 'container/InfraMonitoringK8sV2/constants'
 import { LogsLoading } from 'container/LogsLoading/LogsLoading';
 import { FontSize } from 'container/OptionsMenu/types';
 import RunQueryBtn from 'container/QueryBuilder/components/RunQueryBtn/RunQueryBtn';
+import { getOldLogsOperatorFromNew } from 'hooks/logs/useActiveLog';
 import useLogDetailHandlers from 'hooks/logs/useLogDetailHandlers';
 import useScrollToLog from 'hooks/logs/useScrollToLog';
+import { generateFilterQuery } from 'lib/logs/generateFilterQuery';
 import { saveRecentQueryByExpression } from 'lib/recentQueries/saveRecentQuery';
 import { ILog } from 'types/api/logs/log';
 import { DataSource } from 'types/common/queryBuilder';
@@ -80,6 +82,29 @@ function EntityLogsContent({
 	const { activeLog, selectedTab, handleSetActiveLog, handleCloseLogDetail } =
 		useLogDetailHandlers();
 
+	// TODO: Move away from using onAddToQuery after old drawer cleanup
+	const onAddToQuery = useCallback(
+		(fieldKey: string, fieldValue: string, operator: string): void => {
+			handleCloseLogDetail();
+
+			const partExpression = generateFilterQuery({
+				fieldKey,
+				fieldValue,
+				type: getOldLogsOperatorFromNew(operator),
+			});
+
+			const currentUser = userExpression;
+			const newUser = currentUser.trim()
+				? `${currentUser} AND ${partExpression}`
+				: partExpression;
+
+			querySearchOnRun(newUser);
+
+			logInfraDrawerFilterCustomizedEvent(category, 'logs', newUser, 'logs');
+		},
+		[userExpression, querySearchOnRun, handleCloseLogDetail, category],
+	);
+
 	const onApplyLogFilter = useCallback(
 		(expression: string): void => {
 			handleCloseLogDetail();
@@ -317,6 +342,8 @@ function EntityLogsContent({
 						logs={logs}
 						onNavigateLog={handleSetActiveLog}
 						selectedTab={selectedTab}
+						onAddToQuery={onAddToQuery}
+						onClickActionItem={onAddToQuery}
 						onApplyLogFilter={onApplyLogFilter}
 						onScrollToLog={handleScrollToLog}
 						handleOpenInExplorer={(e) => handleOpenInExplorer(e, activeLog)}

frontend/src/container/LiveLogs/LiveLogsList/index.tsx

@@ -259,6 +259,8 @@ function LiveLogsList({
 					selectedTab={selectedTab}
 					log={activeLog}
 					onClose={handleCloseLogDetail}
+					onAddToQuery={onAddToQuery}
+					onClickActionItem={onAddToQuery}
 					handleChangeSelectedView={handleChangeSelectedView}
 					logs={formattedLogs}
 					onNavigateLog={handleSetActiveLog}

frontend/src/container/LogDetailedView/LogDetailedView.types.ts

@@ -1,4 +1,5 @@
 import { MetricsType } from 'container/MetricsApplication/constant';
+import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
 export type AnyObject = { [key: string]: any };
 
@@ -18,3 +19,15 @@ export interface DataType {
 	field: string;
 	value: string;
 }
+
+export interface ActionItemProps {
+	fieldKey: string;
+	fieldValue: string;
+	onClickActionItem: (
+		fieldKey: string,
+		fieldValue: string,
+		operator: string,
+		dataType?: DataTypes,
+		fieldType?: string,
+	) => void;
+}

frontend/src/container/LogDetailedView/logAttributeActions.utils.ts

@@ -172,7 +172,7 @@ const normalizeDataType = (
 // key is fabricated locally (empty source list), so no click-time getAggregateKeys fetch.
 export const getFilterQueryData = (
 	item: IBuilderQuery,
-	target: Pick<LogFilterTarget, 'fieldKey' | 'dataType' | 'metricsType'>,
+	target: LogFilterTarget,
 	value: unknown,
 	operator: string,
 ): IBuilderQuery => {

frontend/src/container/LogsExplorerList/index.tsx

@@ -381,6 +381,8 @@ function LogsExplorerList({
 							selectedTab={selectedTab}
 							log={activeLog}
 							onClose={handleCloseLogDetail}
+							onAddToQuery={onAddToQuery}
+							onClickActionItem={onAddToQuery}
 							handleChangeSelectedView={handleChangeSelectedView}
 							logs={logs}
 							onNavigateLog={handleSetActiveLog}

frontend/src/container/LogsPanelTable/LogsPanelComponent.tsx

@@ -91,8 +91,13 @@ function LogsPanelComponent({
 		() => logs.map((log) => FlatLogData(log) as RowData),
 		[logs],
 	);
-	const { activeLog, selectedTab, handleSetActiveLog, handleCloseLogDetail } =
-		useLogDetailHandlers();
+	const {
+		activeLog,
+		onAddToQuery,
+		selectedTab,
+		handleSetActiveLog,
+		handleCloseLogDetail,
+	} = useLogDetailHandlers();
 
 	const handleRow = useCallback(
 		(record: RowData): HTMLAttributes<RowData> => ({
@@ -174,6 +179,8 @@ function LogsPanelComponent({
 					selectedTab={selectedTab}
 					log={activeLog}
 					onClose={handleCloseLogDetail}
+					onAddToQuery={onAddToQuery}
+					onClickActionItem={onAddToQuery}
 					isListViewPanel
 					listViewPanelSelectedFields={widget?.selectedLogFields}
 					logs={logs}

frontend/src/container/PipelinePage/PipelineListsView/Preview/components/LogsList/index.tsx

@@ -10,7 +10,8 @@ import { ILog } from 'types/api/logs/log';
 import './styles.scss';
 
 function LogsList({ logs }: LogsListProps): JSX.Element {
-	const { activeLog, onSetActiveLog, onClearActiveLog } = useActiveLog();
+	const { activeLog, onSetActiveLog, onClearActiveLog, onAddToQuery } =
+		useActiveLog();
 
 	const makeLogDetailsHandler = (log: ILog) => (): void => onSetActiveLog(log);
 
@@ -44,6 +45,8 @@ function LogsList({ logs }: LogsListProps): JSX.Element {
 				selectedTab={VIEW_TYPES.OVERVIEW}
 				log={activeLog}
 				onClose={onClearActiveLog}
+				onAddToQuery={onAddToQuery}
+				onClickActionItem={onAddToQuery}
 			/>
 		</div>
 	);

frontend/src/container/RolesSettings/hooks/__tests__/useRolePermissions.test.ts

@@ -329,7 +329,7 @@ describe('transformTransactionGroupsToResourcePermissions', () => {
 	it('returns all resources from RESOURCE_ORDER even with empty transaction groups', () => {
 		const result = transformTransactionGroupsToResourcePermissions([]);
 
-		expect(result).toHaveLength(12);
+		expect(result).toHaveLength(11);
 		expect(result.map((r) => r.resourceKind)).toStrictEqual([
 			'factor-api-key',
 			'dashboard',
@@ -339,7 +339,6 @@ describe('transformTransactionGroupsToResourcePermissions', () => {
 			'metrics',
 			'quick-filter',
 			'role',
-			'saved-view',
 			'serviceaccount',
 			'subscription',
 			'traces',
@@ -423,7 +422,7 @@ describe('createEmptyRolePermissions', () => {
 	it('creates permissions for all resources in RESOURCE_ORDER', () => {
 		const result = createEmptyRolePermissions();
 
-		expect(result).toHaveLength(12);
+		expect(result).toHaveLength(11);
 		expect(result.map((r) => r.resourceKind)).toStrictEqual([
 			'factor-api-key',
 			'dashboard',
@@ -433,7 +432,6 @@ describe('createEmptyRolePermissions', () => {
 			'metrics',
 			'quick-filter',
 			'role',
-			'saved-view',
 			'serviceaccount',
 			'subscription',
 			'traces',

frontend/src/container/RolesSettings/permissions.config.ts

@@ -10,7 +10,6 @@ import {
 	Logs,
 	Receipt,
 	Shield,
-	TowerControl,
 } from '@signozhq/icons';
 
 import permissionsType from 'lib/authz/hooks/useAuthZ/permissions.type';
@@ -96,14 +95,6 @@ export const RESOURCE_PANELS: Record<AuthZResource, ResourcePanelConfig> = {
 			'Type quick filter ID, separate multiple with comma or space',
 		docsAnchor: 'quick-filter',
 	},
-	'saved-view': {
-		label: 'Saved Views',
-		description: 'Saved views in the logs, traces, metrics and meter explorers.',
-		icon: TowerControl,
-		selectorPlaceholder:
-			'Type saved view ID, separate multiple with comma or space',
-		docsAnchor: 'saved-view',
-	},
 	logs: {
 		label: 'Logs',
 		description: 'Log data collected across the workspace.',

frontend/src/container/SavedViews/SaveChangesMenu.tsx

@@ -1,50 +1,41 @@
 import { useMemo } from 'react';
 import { Check } from '@signozhq/icons';
-import AuthZDropdown from 'lib/authz/components/AuthZDropdown/AuthZDropdown';
-import type { AuthZDropdownItemType } from 'lib/authz/components/AuthZDropdown/types';
-import {
-	buildSavedViewUpdatePermission,
-	SavedViewCreatePermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
+import { Dropdown, type DropdownItemType } from '@signozhq/ui/dropdown';
 
 import SavedViewsIconButton from './SavedViewsIconButton';
 import { SaveChangesMenuProps } from './types';
 
 function SaveChangesMenu({
-	viewId,
 	disabled,
 	onSaveAsNew,
 	onUpdate,
 }: SaveChangesMenuProps): JSX.Element {
-	const items = useMemo<AuthZDropdownItemType[]>(
+	const items = useMemo<DropdownItemType[]>(
 		() => [
 			{
 				type: 'item',
 				value: 'save-as-new',
 				label: 'Save as new view',
-				checks: [SavedViewCreatePermission],
 				onClick: onSaveAsNew,
 			},
 			{
 				type: 'item',
 				value: 'update',
 				label: 'Update selected view',
-				checks: [buildSavedViewUpdatePermission(viewId)],
 				onClick: onUpdate,
 			},
 		],
-		[viewId, onSaveAsNew, onUpdate],
+		[onSaveAsNew, onUpdate],
 	);
 
 	return (
-		<AuthZDropdown
+		<Dropdown
 			items={items}
 			nativeButton
 			align="end"
 			side="bottom"
 			disabled={disabled}
 			disabledTooltip="Saving the view"
-			testId="saved-views-save-changes"
 		>
 			<SavedViewsIconButton
 				title="Save changes"
@@ -52,7 +43,7 @@ function SaveChangesMenu({
 				color="warning"
 				testId="saved-views-save-changes"
 			/>
-		</AuthZDropdown>
+		</Dropdown>
 	);
 }
 

frontend/src/container/SavedViews/SavedViewsEmptyState.tsx

@@ -1,8 +1,7 @@
 import { useState } from 'react';
 import { Plus } from '@signozhq/icons';
+import { Button } from '@signozhq/ui/button';
 import { Typography } from '@signozhq/ui/typography';
-import AuthZButton from 'lib/authz/components/AuthZButton/AuthZButton';
-import { SavedViewCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
 
 import SaveViewModal from './SaveViewModal';
 import { SavedViewsEmptyStateProps } from './types';
@@ -32,8 +31,7 @@ function SavedViewsEmptyState({
 			<Typography.Text className={styles.stateText}>
 				Save the current view to open it later.
 			</Typography.Text>
-			<AuthZButton
-				checks={[SavedViewCreatePermission]}
+			<Button
 				variant="outlined"
 				color="secondary"
 				size="sm"
@@ -42,7 +40,7 @@ function SavedViewsEmptyState({
 				testId="saved-views-list-create"
 			>
 				Create view
-			</AuthZButton>
+			</Button>
 			{isModalOpen && (
 				<SaveViewModal
 					mode="create"

frontend/src/container/SavedViews/SavedViewsHeader.module.scss

@@ -78,7 +78,7 @@
 	display: flex;
 	align-items: center;
 	flex-shrink: 0;
-	gap: var(--spacing-4);
+	gap: var(--spacing-1);
 }
 
 .collapseIcon {

frontend/src/container/SavedViews/SavedViewsHeader.tsx

@@ -5,17 +5,9 @@ import { Skeleton } from '@signozhq/ui/skeleton';
 import { toast } from '@signozhq/ui/sonner';
 import { Tooltip } from '@signozhq/ui/tooltip';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
-import { useGetSavedViewParams } from 'hooks/saveViews/useGetSavedViewParams';
-import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
-import {
-	buildSavedViewReadPermission,
-	SavedViewCreatePermission,
-	SavedViewListPermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
 
 import {
 	MY_VIEW_NAME,
-	SAVED_VIEW_FORBIDDEN_NAME,
 	SAVED_VIEW_LOAD_FAILED_NAME,
 	SAVED_VIEW_TOAST_POSITION,
 } from './constants';
@@ -39,16 +31,8 @@ function SavedViewsHeader({
 	onOpenViews?: () => void;
 	onCollapse?: () => void;
 }): JSX.Element {
-	const {
-		view,
-		isLoading,
-		isError,
-		isReadDenied,
-		errorMessage,
-		hasUnsavedChanges,
-	} = useActiveSavedView(source);
-	const { viewKey } = useGetSavedViewParams();
-	const readPermission = buildSavedViewReadPermission(viewKey);
+	const { view, isLoading, isError, hasUnsavedChanges } =
+		useActiveSavedView(source);
 	const { revertView, clearView, createView, updateView, isSaving } =
 		useSavedViewActions(source);
 
@@ -65,27 +49,11 @@ function SavedViewsHeader({
 	const openSaveAsNew = useCallback((): void => setModalMode('saveAsNew'), []);
 	const closeModal = useCallback((): void => setModalMode(null), []);
 
-	let name = view?.spec.displayName ?? MY_VIEW_NAME;
-	if (isReadDenied) {
-		name = SAVED_VIEW_FORBIDDEN_NAME;
-	} else if (isError) {
-		name = SAVED_VIEW_LOAD_FAILED_NAME;
-	}
+	const name = isError
+		? SAVED_VIEW_LOAD_FAILED_NAME
+		: (view?.spec.displayName ?? MY_VIEW_NAME);
 	const isDirty = !isError && !!view && hasUnsavedChanges;
 
-	const nameChip = (
-		<span
-			className={cx(styles.name, {
-				[styles.isDirty]: isDirty,
-				[styles.isError]: isError,
-			})}
-			data-testid="saved-views-name"
-		>
-			{isDirty && <span className={styles.dot} />}
-			<span className={styles.nameText}>{name}</span>
-		</span>
-	);
-
 	return (
 		<div
 			className={cx(styles.header, {
@@ -100,7 +68,6 @@ function SavedViewsHeader({
 					<SavedViewsIconButton
 						title="All views"
 						icon={<List size={14} />}
-						checks={[SavedViewListPermission]}
 						onClick={onOpenViews}
 						testId="saved-views-open"
 					/>
@@ -112,10 +79,19 @@ function SavedViewsHeader({
 						className={styles.skeleton}
 						testId="saved-views-loading"
 					/>
-				) : isReadDenied ? (
-					<AuthZTooltip checks={[readPermission]}>{nameChip}</AuthZTooltip>
 				) : (
-					<Tooltip title={errorMessage ?? name}>{nameChip}</Tooltip>
+					<Tooltip title={name}>
+						<span
+							className={cx(styles.name, {
+								[styles.isDirty]: isDirty,
+								[styles.isError]: isError,
+							})}
+							data-testid="saved-views-name"
+						>
+							{isDirty && <span className={styles.dot} />}
+							<span className={styles.nameText}>{name}</span>
+						</span>
+					</Tooltip>
 				)}
 			</div>
 
@@ -126,7 +102,6 @@ function SavedViewsHeader({
 						icon={<Plus size={14} />}
 						disabled={isLoading}
 						disabledTooltip="Loading views"
-						checks={[SavedViewCreatePermission]}
 						onClick={(): void => setModalMode('create')}
 						testId="saved-views-create"
 					/>
@@ -142,7 +117,6 @@ function SavedViewsHeader({
 				{view && isDirty && (
 					<>
 						<SaveChangesMenu
-							viewId={view.id}
 							disabled={isSaving}
 							onSaveAsNew={openSaveAsNew}
 							onUpdate={(): void => {

frontend/src/container/SavedViews/SavedViewsIconButton.tsx

@@ -1,7 +1,6 @@
 import { forwardRef } from 'react';
 import { Button, type VariantColorType } from '@signozhq/ui/button';
 import { Tooltip } from '@signozhq/ui/tooltip';
-import AuthZButton from 'lib/authz/components/AuthZButton/AuthZButton';
 
 import { SavedViewsIconButtonProps } from './types';
 
@@ -26,33 +25,11 @@ const SavedViewsIconButton = forwardRef<
 		color = 'secondary',
 		disabled,
 		disabledTooltip,
-		checks,
 		onClick,
 		...triggerProps
 	},
 	ref,
 ): JSX.Element {
-	if (checks?.length) {
-		return (
-			<Tooltip title={title}>
-				<AuthZButton
-					checks={checks}
-					{...VARIANT_COLORS[color]}
-					size="sm"
-					icon
-					aria-label={title}
-					disabled={disabled}
-					// AuthZButton skips its checks while a block reason is set.
-					disabledTooltip={disabled ? disabledTooltip : undefined}
-					onClick={onClick}
-					testId={testId}
-				>
-					{icon}
-				</AuthZButton>
-			</Tooltip>
-		);
-	}
-
 	return (
 		<Tooltip title={title}>
 			<Button

frontend/src/container/SavedViews/SavedViewsList.module.scss

@@ -41,7 +41,7 @@
 .row {
 	display: flex;
 	align-items: center;
-	gap: var(--spacing-4);
+	gap: var(--spacing-2);
 	height: var(--spacing-16);
 	padding-right: var(--spacing-4);
 	border-radius: var(--radius-2);
@@ -71,7 +71,7 @@
 
 .row:hover .rowMenu,
 .row:focus-within .rowMenu,
-.rowMenu:has([data-popup-open]) {
+.rowMenu:has([data-state='open']) {
 	width: auto;
 	opacity: 1;
 }

frontend/src/container/SavedViews/SavedViewsList.tsx

@@ -40,14 +40,8 @@ function SavedViewsList({
 	const saveNewView = useSaveNewView(createView);
 	const { createdByMe, createdByOthers, isLoading, isError, refetch } =
 		useSavedViewsList(source, search);
-	const {
-		copyViewLink,
-		copyViewId,
-		renameView,
-		deleteView,
-		isRenaming,
-		isDeleting,
-	} = useSavedViewRowActions(source);
+	const { copyViewLink, renameView, deleteView, isRenaming, isDeleting } =
+		useSavedViewRowActions(source);
 	const [pendingAction, setPendingAction] =
 		useState<PendingSavedViewAction | null>(null);
 	const listRef = useRef<HTMLDivElement>(null);
@@ -85,14 +79,10 @@ function SavedViewsList({
 				copyViewLink(view);
 				return;
 			}
-			if (key === 'copyId') {
-				copyViewId(view);
-				return;
-			}
 			closeHoverCard();
 			setPendingAction({ key, view });
 		},
-		[copyViewLink, copyViewId, closeHoverCard],
+		[copyViewLink, closeHoverCard],
 	);
 
 	const closePendingAction = useCallback((): void => setPendingAction(null), []);

frontend/src/container/SavedViews/SavedViewsListRow.tsx

@@ -1,8 +1,6 @@
 import cx from 'classnames';
 import { Undo2 } from '@signozhq/icons';
-import AuthZButton from 'lib/authz/components/AuthZButton/AuthZButton';
-import { buildSavedViewReadPermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-import { useAuthZ } from 'lib/authz/hooks/useAuthZ/useAuthZ';
+import { Button } from '@signozhq/ui/button';
 
 import SavedViewsRowButton from './SavedViewsRowButton';
 import SavedViewsRowMenu from './SavedViewsRowMenu';
@@ -19,26 +17,17 @@ function SavedViewsListRow({
 	hover,
 }: SavedViewsListRowProps): JSX.Element {
 	const name = view.spec.displayName;
-	const readPermission = buildSavedViewReadPermission(view.id);
-	// Same cached check as the button; gates the hover card.
-	const { isLoading, deniedPermissions } = useAuthZ([readPermission]);
-	const canRead = !isLoading && deniedPermissions.length === 0;
 
 	return (
 		<div
 			className={cx(styles.row, { [styles.isActive]: isActive })}
 			data-testid="saved-views-row"
 			data-view-id={view.id}
-			onMouseEnter={(event): void => {
-				if (canRead) {
-					hover.onRowEnter(view, event.currentTarget);
-				}
-			}}
+			onMouseEnter={(event): void => hover.onRowEnter(view, event.currentTarget)}
 			onMouseLeave={hover.onRowLeave}
 		>
 			<div className={styles.rowName}>
-				<AuthZButton
-					checks={[readPermission]}
+				<Button
 					size="md"
 					variant="ghost"
 					color="secondary"
@@ -52,7 +41,7 @@ function SavedViewsListRow({
 					testId="saved-views-row-name"
 				>
 					{name}
-				</AuthZButton>
+				</Button>
 			</div>
 			{isActive && (
 				<SavedViewsRowButton
@@ -65,7 +54,6 @@ function SavedViewsListRow({
 			)}
 			<span className={styles.rowMenu}>
 				<SavedViewsRowMenu
-					viewId={view.id}
 					onAction={(key): void => onAction(view, key)}
 					onOpen={hover.onMenuOpen}
 				/>

frontend/src/container/SavedViews/SavedViewsPanel.tsx

@@ -4,9 +4,6 @@ import { Input } from '@signozhq/ui/input';
 import { Typography } from '@signozhq/ui/typography';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
 
-import { AuthZGuardContent } from 'lib/authz/components/AuthZGuard/AuthZGuardContent';
-import { SavedViewListPermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-
 import SavedViewsIconButton from './SavedViewsIconButton';
 import SavedViewsList from './SavedViewsList';
 
@@ -42,20 +39,16 @@ function SavedViewsPanel({
 					/>
 				</div>
 			)}
-			<AuthZGuardContent checks={[SavedViewListPermission]}>
-				<>
-					<div className={styles.search}>
-						<Input
-							value={search}
-							onChange={(event): void => setSearch(event.target.value)}
-							placeholder="Search..."
-							aria-label="Search views"
-							testId="saved-views-search"
-						/>
-					</div>
-					<SavedViewsList source={source} search={search} />
-				</>
-			</AuthZGuardContent>
+			<div className={styles.search}>
+				<Input
+					value={search}
+					onChange={(event): void => setSearch(event.target.value)}
+					placeholder="Search..."
+					aria-label="Search views"
+					testId="saved-views-search"
+				/>
+			</div>
+			<SavedViewsList source={source} search={search} />
 		</div>
 	);
 }

frontend/src/container/SavedViews/SavedViewsRowMenu.tsx

@@ -1,18 +1,16 @@
 import { useMemo } from 'react';
 import { Ellipsis } from '@signozhq/icons';
-import AuthZDropdown from 'lib/authz/components/AuthZDropdown/AuthZDropdown';
-import type { AuthZDropdownItemType } from 'lib/authz/components/AuthZDropdown/types';
+import { Dropdown, type DropdownItemType } from '@signozhq/ui/dropdown';
 
 import { SAVED_VIEW_ROW_ACTIONS } from './constants';
 import SavedViewsRowButton from './SavedViewsRowButton';
 import { SavedViewsRowMenuProps } from './types';
 
 function SavedViewsRowMenu({
-	viewId,
 	onAction,
 	onOpen,
 }: SavedViewsRowMenuProps): JSX.Element {
-	const items = useMemo<AuthZDropdownItemType[]>(
+	const items = useMemo<DropdownItemType[]>(
 		() =>
 			SAVED_VIEW_ROW_ACTIONS.flatMap(
 				({
@@ -21,8 +19,7 @@ function SavedViewsRowMenu({
 					icon: Icon,
 					danger,
 					hasDividerBefore,
-					buildPermission,
-				}): AuthZDropdownItemType[] => [
+				}): DropdownItemType[] => [
 					...(hasDividerBefore
 						? [{ type: 'separator' as const, value: `separator-${key}` }]
 						: []),
@@ -32,16 +29,15 @@ function SavedViewsRowMenu({
 						label,
 						prefix: <Icon size={14} />,
 						danger,
-						checks: buildPermission ? [buildPermission(viewId)] : undefined,
 						onClick: (): void => onAction(key),
 					},
 				],
 			),
-		[viewId, onAction],
+		[onAction],
 	);
 
 	return (
-		<AuthZDropdown
+		<Dropdown
 			items={items}
 			nativeButton
 			side="right"
@@ -51,7 +47,6 @@ function SavedViewsRowMenu({
 					onOpen();
 				}
 			}}
-			testId="saved-views-row-menu"
 		>
 			<SavedViewsRowButton
 				icon={<Ellipsis size={14} />}
@@ -59,7 +54,7 @@ function SavedViewsRowMenu({
 				tooltip="More options"
 				testId="saved-views-row-menu"
 			/>
-		</AuthZDropdown>
+		</Dropdown>
 	);
 }
 

frontend/src/container/SavedViews/__tests__/SavedViewHoverCard.test.tsx

@@ -1,10 +1,4 @@
-import {
-	act,
-	fireEvent,
-	screen,
-	waitFor,
-	within,
-} from '@testing-library/react';
+import { act, fireEvent, screen, within } from '@testing-library/react';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
 import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
 import ROUTES from 'constants/routes';
@@ -18,7 +12,6 @@ import {
 import SavedViewsPanel from '../SavedViewsPanel';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectUsable,
 	explorerUrl,
 	makeView,
 	queryWith,
@@ -117,11 +110,6 @@ async function renderPanel(
 		dataSource,
 	);
 	await screen.findByTestId('saved-views-list');
-	await waitFor(() =>
-		screen
-			.getAllByTestId('saved-views-row-name')
-			.forEach((name) => expectUsable(name)),
-	);
 	jest.useFakeTimers();
 }
 
@@ -152,10 +140,6 @@ describe('SavedViewHoverCard', () => {
 	});
 
 	afterEach(() => {
-		// useAuthZ batches checks on a timer; left pending, it blocks later checks.
-		act(() => {
-			jest.runOnlyPendingTimers();
-		});
 		jest.useRealTimers();
 	});
 

frontend/src/container/SavedViews/__tests__/SavedViews.authz.test.tsx

@@ -1,265 +0,0 @@
-import { fireEvent, screen, waitFor, within } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
-import { PANEL_TYPES } from 'constants/queryBuilder';
-import ROUTES from 'constants/routes';
-import {
-	buildSavedViewDeletePermission,
-	buildSavedViewReadPermission,
-	buildSavedViewUpdatePermission,
-	SavedViewCreatePermission,
-	SavedViewListPermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-import {
-	AUTHZ_CHECK_URL,
-	setupAuthzDeny,
-} from 'lib/authz/utils/authz-test-utils';
-import { server } from 'mocks-server/server';
-import { rest } from 'msw';
-import { DataSource } from 'types/common/queryBuilder';
-
-import SavedViewsHeader from '../SavedViewsHeader';
-import SavedViewsPanel from '../SavedViewsPanel';
-import { API, mockSavedViewsApi } from './savedViewsApiMock';
-import {
-	explorerUrl,
-	makeView,
-	MENU_CHECK_TIMEOUT,
-	queryWith,
-	renderWithExplorerProviders,
-	viewUrl,
-} from './savedViewsTestUtils';
-
-const PATH = ROUTES.TRACES_EXPLORER;
-
-const errors = makeView({ id: 'view-1', displayName: 'Errors' });
-const slow = makeView({ id: 'view-2', displayName: 'Slow spans' });
-
-function renderPanel(url = explorerUrl(PATH, {})): void {
-	renderWithExplorerProviders(
-		<SavedViewsPanel
-			source={SavedviewtypesSourceDTO.traces}
-			onClose={jest.fn()}
-		/>,
-		url,
-	);
-}
-
-function renderHeader(
-	url: string,
-): ReturnType<typeof renderWithExplorerProviders> {
-	return renderWithExplorerProviders(
-		<SavedViewsHeader
-			source={SavedviewtypesSourceDTO.traces}
-			onOpenViews={jest.fn()}
-		/>,
-		url,
-	);
-}
-
-const rowNamed = (name: string): HTMLElement =>
-	screen
-		.getAllByTestId('saved-views-row')
-		.find((row) => row.textContent?.includes(name)) as HTMLElement;
-
-async function openRowMenu(name: string): Promise<void> {
-	await screen.findAllByTestId('saved-views-row');
-	fireEvent.click(within(rowNamed(name)).getByTestId('saved-views-row-menu'));
-}
-
-// Resolves once the row's check is back, so its state is final.
-async function settledRow(testId: string): Promise<HTMLElement> {
-	await waitFor(
-		() => expect(screen.getByTestId(testId)).not.toHaveAttribute('data-loading'),
-		MENU_CHECK_TIMEOUT,
-	);
-	return screen.getByTestId(testId);
-}
-
-describe('SavedViews - AuthZ', () => {
-	beforeEach(() => {
-		localStorage.clear();
-	});
-
-	afterEach(() => {
-		server.resetHandlers();
-	});
-
-	it('shows the denied callout instead of the list without list', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(SavedViewListPermission));
-		renderPanel();
-
-		await expect(
-			screen.findByText(/not authorized/i),
-		).resolves.toBeInTheDocument();
-		expect(screen.queryByTestId('saved-views-list')).toBeNull();
-		expect(screen.queryByTestId('saved-views-search')).toBeNull();
-	});
-
-	it('disables only the views it cannot read', async () => {
-		mockSavedViewsApi([errors, slow]);
-		server.use(setupAuthzDeny(buildSavedViewReadPermission(errors.id)));
-		renderPanel();
-
-		await screen.findAllByTestId('saved-views-row');
-		const nameOf = (view: string): HTMLElement =>
-			within(rowNamed(view)).getByTestId('saved-views-row-name');
-		await waitFor(() =>
-			expect(nameOf('Errors')).toHaveAttribute('aria-disabled', 'true'),
-		);
-		await waitFor(() =>
-			expect(nameOf('Slow spans')).not.toHaveAttribute('aria-busy'),
-		);
-		expect(nameOf('Slow spans')).not.toHaveAttribute('aria-disabled', 'true');
-	});
-
-	it('keeps the row menu on a view it cannot read', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(buildSavedViewReadPermission(errors.id)));
-		renderPanel();
-
-		await openRowMenu('Errors');
-
-		await expect(
-			settledRow('saved-views-row-menu-item-delete'),
-		).resolves.not.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-editDetails'),
-		).resolves.not.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-copyLink'),
-		).resolves.not.toHaveAttribute('data-disabled');
-	});
-
-	it('disables creating without create', async () => {
-		mockSavedViewsApi([]);
-		server.use(setupAuthzDeny(SavedViewCreatePermission));
-		renderPanel();
-		renderHeader(explorerUrl(PATH, {}));
-
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-list-create')).toHaveAttribute(
-				'aria-disabled',
-				'true',
-			),
-		);
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-create')).toHaveAttribute(
-				'aria-disabled',
-				'true',
-			),
-		);
-	});
-
-	it('keeps create disabled while the check is pending', async () => {
-		mockSavedViewsApi([]);
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => res(ctx.delay('infinite'))),
-		);
-		renderHeader(explorerUrl(PATH, {}));
-
-		const create = screen.getByTestId('saved-views-create');
-		expect(create).toHaveAttribute('aria-busy', 'true');
-		await userEvent.click(create);
-		expect(screen.queryByTestId('save-view-name')).toBeNull();
-	});
-
-	it('disables edit details without update and delete without delete', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(
-			setupAuthzDeny(
-				buildSavedViewUpdatePermission(errors.id),
-				buildSavedViewDeletePermission(errors.id),
-			),
-		);
-		renderPanel();
-
-		await openRowMenu('Errors');
-
-		await expect(
-			settledRow('saved-views-row-menu-item-editDetails'),
-		).resolves.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-delete'),
-		).resolves.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-copyLink'),
-		).resolves.not.toHaveAttribute('data-disabled');
-	});
-
-	it('disables updating the open view without update, keeping save as new', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(buildSavedViewUpdatePermission(errors.id)));
-		const { history } = renderHeader(viewUrl(PATH, errors));
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveTextContent('Errors'),
-		);
-
-		history.push(
-			explorerUrl(PATH, {
-				query: queryWith(DataSource.TRACES, 'has_error = false'),
-				panelType: PANEL_TYPES.LIST,
-				viewKey: errors.id,
-			}),
-		);
-		await userEvent.click(await screen.findByTestId('saved-views-save-changes'));
-
-		await expect(
-			settledRow('saved-views-save-changes-item-update'),
-		).resolves.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-save-changes-item-save-as-new'),
-		).resolves.not.toHaveAttribute('data-disabled');
-	});
-
-	it('says no access when the check denies read, even if the server returns the view', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(buildSavedViewReadPermission(errors.id)));
-		renderHeader(viewUrl(PATH, errors));
-
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveTextContent(
-				'No view access',
-			),
-		);
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveAttribute(
-				'data-denied-permissions',
-			),
-		);
-		await userEvent.setup().hover(screen.getByTestId('saved-views-name'));
-
-		await waitFor(() =>
-			expect(
-				screen.queryAllByText(/is not authorized to perform read:saved-view:view-1/)
-					.length,
-			).toBeGreaterThan(0),
-		);
-	});
-
-	it('treats a 403 the check allowed as a failed load, showing the server message', async () => {
-		const message = 'saved-view:read is missing, ask an admin for it';
-		mockSavedViewsApi([errors]);
-		server.use(
-			rest.get(`${API}/:id`, (_req, res, ctx) =>
-				res(
-					ctx.status(403),
-					ctx.json({ status: 'error', error: { code: 'forbidden', message } }),
-				),
-			),
-		);
-		renderHeader(viewUrl(PATH, errors));
-
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveTextContent(
-				'View failed to load',
-			),
-		);
-		await userEvent.setup().hover(screen.getByTestId('saved-views-name'));
-
-		await waitFor(() =>
-			expect(screen.queryAllByText(message).length).toBeGreaterThan(0),
-		);
-	});
-});

frontend/src/container/SavedViews/__tests__/SavedViewsHeader.columns.test.tsx

@@ -9,9 +9,7 @@ import { usePreferenceContext } from 'providers/preferences/context/PreferenceCo
 import SavedViewsHeader from '../SavedViewsHeader';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectRowUsable,
 	makeView,
-	MENU_CHECK_TIMEOUT,
 	renderWithExplorerProviders,
 	viewUrl,
 } from './savedViewsTestUtils';
@@ -117,11 +115,9 @@ describe('SavedViewsHeader columns', () => {
 		await userEvent.click(screen.getByTestId('add-column'));
 		await waitFor(() => expect(isDirty()).toBe(true));
 		await userEvent.click(screen.getByTestId('saved-views-save-changes'));
-		const update = await screen.findByTestId(
-			'saved-views-save-changes-item-update',
+		await userEvent.click(
+			await screen.findByRole('menuitem', { name: 'Update selected view' }),
 		);
-		await waitFor(() => expectRowUsable(update), MENU_CHECK_TIMEOUT);
-		await userEvent.click(update);
 		await waitFor(() => expect(isDirty()).toBe(false));
 
 		await userEvent.click(screen.getByTestId('add-column'));

frontend/src/container/SavedViews/__tests__/SavedViewsHeader.save.test.tsx

@@ -9,11 +9,8 @@ import { DataSource } from 'types/common/queryBuilder';
 
 import SavedViewsHeader from '../SavedViewsHeader';
 import {
-	expectRowUsable,
-	expectUsable,
 	explorerUrl,
 	makeView,
-	MENU_CHECK_TIMEOUT,
 	queryWith,
 	renderWithExplorerProviders,
 	urlParam,
@@ -70,21 +67,9 @@ async function openDirtyView(
 	return rendered;
 }
 
-const SAVE_MENU_ITEM_TEST_IDS: Record<string, string> = {
-	'Save as new view': 'saved-views-save-changes-item-save-as-new',
-	'Update selected view': 'saved-views-save-changes-item-update',
-};
-
 async function chooseFromSaveMenu(item: string): Promise<void> {
 	await userEvent.click(screen.getByTestId('saved-views-save-changes'));
-	const menuItem = await screen.findByTestId(SAVE_MENU_ITEM_TEST_IDS[item]);
-	await waitFor(() => expectRowUsable(menuItem), MENU_CHECK_TIMEOUT);
-	await userEvent.click(menuItem);
-}
-
-async function clickCreate(): Promise<void> {
-	await waitFor(() => expectUsable(screen.getByTestId('saved-views-create')));
-	await userEvent.click(screen.getByTestId('saved-views-create'));
+	await userEvent.click(await screen.findByRole('menuitem', { name: item }));
 }
 
 async function submitName(name: string): Promise<void> {
@@ -102,7 +87,7 @@ describe('SavedViewsHeader saving', () => {
 			const requests = mockSavedViewsApi([], { createdId: 'view-new' });
 			const { history } = renderHeader(explorerUrl(PATH, {}));
 
-			await clickCreate();
+			await userEvent.click(screen.getByTestId('saved-views-create'));
 
 			expect(within(modal()).getByText('Create new view')).toBeInTheDocument();
 			expect(screen.getByTestId('save-view-submit')).toHaveAttribute(
@@ -145,7 +130,7 @@ describe('SavedViewsHeader saving', () => {
 			const requests = mockSavedViewsApi([], { createStatus: 500 });
 			const { history } = renderHeader(explorerUrl(PATH, {}));
 
-			await clickCreate();
+			await userEvent.click(screen.getByTestId('saved-views-create'));
 			await submitName('Slow checkout');
 
 			await waitFor(() => expect(toast.error).toHaveBeenCalled());
@@ -160,7 +145,7 @@ describe('SavedViewsHeader saving', () => {
 			const requests = mockSavedViewsApi([]);
 			renderHeader(explorerUrl(PATH, {}));
 
-			await clickCreate();
+			await userEvent.click(screen.getByTestId('saved-views-create'));
 			await userEvent.type(screen.getByTestId('save-view-name'), 'Draft');
 			await userEvent.click(screen.getByTestId('save-view-cancel'));
 

frontend/src/container/SavedViews/__tests__/SavedViewsPanel.list.test.tsx

@@ -8,7 +8,6 @@ import ROUTES from 'constants/routes';
 import SavedViewsPanel from '../SavedViewsPanel';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectUsable,
 	explorerUrl,
 	makeView,
 	renderWithExplorerProviders,
@@ -85,9 +84,9 @@ describe('SavedViewsPanel list', () => {
 		const { history } = renderPanel();
 
 		await screen.findByTestId('saved-views-list');
-		const name = within(row('Slow spans')).getByTestId('saved-views-row-name');
-		await waitFor(() => expectUsable(name));
-		await userEvent.click(name);
+		await userEvent.click(
+			within(row('Slow spans')).getByTestId('saved-views-row-name'),
+		);
 
 		await waitFor(() =>
 			expect(urlParam(history, QueryParams.viewKey)).toBe(
@@ -162,9 +161,7 @@ describe('SavedViewsPanel list', () => {
 		const requests = mockSavedViewsApi([], { createdId: 'view-new' });
 		const { history } = renderPanel();
 
-		const create = await screen.findByTestId('saved-views-list-create');
-		await waitFor(() => expectUsable(create));
-		await userEvent.click(create);
+		await userEvent.click(await screen.findByTestId('saved-views-list-create'));
 		await userEvent.type(screen.getByTestId('save-view-name'), 'First view');
 		await userEvent.click(screen.getByTestId('save-view-submit'));
 

frontend/src/container/SavedViews/__tests__/SavedViewsPanel.rowMenu.test.tsx

@@ -9,10 +9,8 @@ import SavedViewsHeader from '../SavedViewsHeader';
 import SavedViewsPanel from '../SavedViewsPanel';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectRowUsable,
 	explorerUrl,
 	makeView,
-	MENU_CHECK_TIMEOUT,
 	renderWithExplorerProviders,
 	urlParam,
 	viewUrl,
@@ -60,22 +58,13 @@ const row = (name: string): HTMLElement =>
 		.getAllByTestId('saved-views-row')
 		.find((element) => element.textContent?.includes(name)) as HTMLElement;
 
-const ROW_MENU_ITEM_TEST_IDS: Record<string, string> = {
-	'Copy link': 'saved-views-row-menu-item-copyLink',
-	'Copy ID': 'saved-views-row-menu-item-copyId',
-	'Edit details': 'saved-views-row-menu-item-editDetails',
-	Delete: 'saved-views-row-menu-item-delete',
-};
-
 async function chooseFromRowMenu(
 	viewName: string,
 	item: string,
 ): Promise<void> {
 	await screen.findByTestId('saved-views-list');
 	fireEvent.click(within(row(viewName)).getByTestId('saved-views-row-menu'));
-	const menuItem = await screen.findByTestId(ROW_MENU_ITEM_TEST_IDS[item]);
-	await waitFor(() => expectRowUsable(menuItem), MENU_CHECK_TIMEOUT);
-	fireEvent.click(menuItem);
+	fireEvent.click(await screen.findByRole('menuitem', { name: item }));
 }
 
 const chip = (): HTMLElement => screen.getByTestId('saved-views-name');
@@ -87,38 +76,21 @@ describe('SavedViewsPanel row menu', () => {
 		jest.mocked(toast.success).mockClear();
 	});
 
-	it('offers copy link, copy id, edit details and delete', async () => {
+	it('offers copy link, edit details and delete', async () => {
 		mockSavedViewsApi([errors]);
 		renderPanelWithHeader();
 		await screen.findByTestId('saved-views-list');
 
 		fireEvent.click(within(row('Errors')).getByTestId('saved-views-row-menu'));
 
-		await screen.findByTestId(ROW_MENU_ITEM_TEST_IDS['Copy link']);
-		const items = Object.values(ROW_MENU_ITEM_TEST_IDS).map(
-			(testId) => screen.getByTestId(testId).textContent,
-		);
-		expect(items).toStrictEqual([
+		const items = await screen.findAllByRole('menuitem');
+		expect(items.map((item) => item.textContent)).toStrictEqual([
 			'Copy link',
-			'Copy ID',
 			'Edit details',
 			'Delete',
 		]);
 	});
 
-	it('copies the view id', async () => {
-		mockSavedViewsApi([errors, slow]);
-		renderPanelWithHeader();
-
-		await chooseFromRowMenu('Slow spans', 'Copy ID');
-
-		expect(mockCopy).toHaveBeenCalledWith(slow.id);
-		expect(toast.success).toHaveBeenCalledWith(
-			'View ID copied',
-			expect.anything(),
-		);
-	});
-
 	it('copies a link that opens the view with its query and tab', async () => {
 		mockSavedViewsApi([errors, slow]);
 		renderPanelWithHeader();

frontend/src/container/SavedViews/__tests__/savedViewsApiMock.ts

@@ -1,5 +1,4 @@
 import { SavedviewtypesSavedViewDTO } from 'api/generated/services/sigNoz.schemas';
-import { setupAuthzAdmin } from 'lib/authz/utils/authz-test-utils';
 import { server } from 'mocks-server/server';
 import { rest } from 'msw';
 
@@ -14,7 +13,6 @@ export interface Requests {
 }
 
 // Mutates `views` on create, update and delete, so a refetch sees the change.
-// Grants every permission; a later server.use overrides it.
 export function mockSavedViewsApi(
 	views: SavedviewtypesSavedViewDTO[],
 	{
@@ -32,7 +30,6 @@ export function mockSavedViewsApi(
 	const requests: Requests = { created: [], updated: [], deleted: [] };
 	let failedLists = 0;
 	server.use(
-		setupAuthzAdmin(),
 		rest.get(API, (req, res, ctx) => {
 			if (failedLists < listFailures) {
 				failedLists += 1;

frontend/src/container/SavedViews/__tests__/savedViewsTestUtils.tsx

@@ -251,20 +251,3 @@ export function renderWithExplorerProviders(
 export function urlParam(history: MemoryHistory, key: string): string | null {
 	return new URLSearchParams(history.location.search).get(key);
 }
-
-// The ui Button marks a pending check with aria-busy and a block with
-// aria-disabled, never the disabled attribute.
-export function expectUsable(element: HTMLElement): void {
-	expect(element).not.toHaveAttribute('aria-busy');
-	expect(element).not.toHaveAttribute('aria-disabled', 'true');
-}
-
-// A menu checks its rows on first open; on a loaded CI runner that outlasts
-// waitFor's 1s default.
-export const MENU_CHECK_TIMEOUT = { timeout: 5000 };
-
-// A menu row waiting on its check is data-loading, not yet data-disabled.
-export function expectRowUsable(row: HTMLElement): void {
-	expect(row).not.toHaveAttribute('data-loading');
-	expect(row).not.toHaveAttribute('data-disabled');
-}

frontend/src/container/SavedViews/constants.ts

@@ -1,13 +1,9 @@
-import { Copy, Link, PenLine, Trash2 } from '@signozhq/icons';
+import { Link, PenLine, Trash2 } from '@signozhq/icons';
 import {
 	SavedviewtypesSchemaVersionDTO,
 	SavedviewtypesSourceDTO,
 } from 'api/generated/services/sigNoz.schemas';
 import { QueryParams } from 'constants/query';
-import {
-	buildSavedViewDeletePermission,
-	buildSavedViewUpdatePermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
 import { DataSource } from 'types/common/queryBuilder';
 
 import { SavedViewRowActionConfig, SaveViewModalMode } from './types';
@@ -34,8 +30,6 @@ export const MY_VIEW_NAME = 'My view';
 
 export const SAVED_VIEW_LOAD_FAILED_NAME = 'View failed to load';
 
-export const SAVED_VIEW_FORBIDDEN_NAME = 'No view access';
-
 export const SAVED_VIEWS_LIST_LOADING_ROWS = 4;
 
 export const SAVED_VIEW_HOVER_CARD_OPEN_DELAY_MS = 1000;
@@ -53,20 +47,13 @@ export const SAVE_VIEW_MODAL_TITLE: Record<SaveViewModalMode, string> = {
 
 export const SAVED_VIEW_ROW_ACTIONS: SavedViewRowActionConfig[] = [
 	{ key: 'copyLink', label: 'Copy link', icon: Link },
-	{ key: 'copyId', label: 'Copy ID', icon: Copy },
-	{
-		key: 'editDetails',
-		label: 'Edit details',
-		icon: PenLine,
-		buildPermission: buildSavedViewUpdatePermission,
-	},
+	{ key: 'editDetails', label: 'Edit details', icon: PenLine },
 	{
 		key: 'delete',
 		label: 'Delete',
 		icon: Trash2,
 		danger: true,
 		hasDividerBefore: true,
-		buildPermission: buildSavedViewDeletePermission,
 	},
 ];
 

frontend/src/container/SavedViews/hooks/useActiveSavedView.ts

@@ -6,10 +6,7 @@ import useOptionsMenu from 'container/OptionsMenu/useOptionsMenu';
 import { useGetCompositeQueryParam } from 'hooks/queryBuilder/useGetCompositeQueryParam';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useGetSavedViewParams } from 'hooks/saveViews/useGetSavedViewParams';
-import { buildSavedViewReadPermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-import { useAuthZ } from 'lib/authz/hooks/useAuthZ/useAuthZ';
 import { DataSource } from 'types/common/queryBuilder';
-import { toAPIError } from 'utils/errorUtils';
 
 import { SAVED_VIEW_OPTIONS_DATA_SOURCE } from '../constants';
 import { UseActiveSavedViewResult } from '../types';
@@ -26,19 +23,11 @@ export function useActiveSavedView(
 		dataSource: optionsDataSource ?? DataSource.LOGS,
 	});
 
-	const { isLoading: isCheckingRead, deniedPermissions } = useAuthZ(
-		[buildSavedViewReadPermission(viewKey)],
-		{ enabled: !!viewKey },
-	);
-	const isReadDenied = !!viewKey && deniedPermissions.length > 0;
-
-	const canFetch = !!viewKey && !isCheckingRead && !isReadDenied;
-
-	const { data, isLoading, isError, error } = useGetSavedView(
+	const { data, isLoading, isError } = useGetSavedView(
 		{ id: viewKey },
-		{ query: { enabled: canFetch } },
+		{ query: { enabled: !!viewKey } },
 	);
-	const view = canFetch ? data?.data : undefined;
+	const view = viewKey ? data?.data : undefined;
 
 	// The query builder stages the url query a render later. Until the ids
 	// match, keep the last answer for this view; another view starts clean.
@@ -79,17 +68,10 @@ export function useActiveSavedView(
 		lastResult.current = { viewId: view?.id, hasUnsavedChanges };
 	}, [view?.id, hasUnsavedChanges]);
 
-	const errorMessage =
-		viewKey && isError && error
-			? toAPIError(error, '').getErrorMessage() || undefined
-			: undefined;
-
 	return {
 		view,
-		isLoading: !!viewKey && (isCheckingRead || isLoading),
-		isError: !!viewKey && (isError || isReadDenied),
-		isReadDenied,
-		errorMessage,
+		isLoading: !!viewKey && isLoading,
+		isError: !!viewKey && isError,
 		hasUnsavedChanges,
 	};
 }

frontend/src/container/SavedViews/hooks/useSavedViewRowActions.ts

@@ -59,14 +59,6 @@ export function useSavedViewRowActions(
 		[pathname, copyToClipboard],
 	);
 
-	const copyViewId = useCallback(
-		(view: SavedviewtypesSavedViewDTO): void => {
-			copyToClipboard(view.id);
-			toast.success('View ID copied', { position: SAVED_VIEW_TOAST_POSITION });
-		},
-		[copyToClipboard],
-	);
-
 	const renameView = useCallback(
 		async (
 			view: SavedviewtypesSavedViewDTO,
@@ -109,12 +101,5 @@ export function useSavedViewRowActions(
 		[deleteSavedView, source, queryClient],
 	);
 
-	return {
-		copyViewLink,
-		copyViewId,
-		renameView,
-		deleteView,
-		isRenaming,
-		isDeleting,
-	};
+	return { copyViewLink, renameView, deleteView, isRenaming, isDeleting };
 }

frontend/src/container/SavedViews/stories/SavedViews.stories.mocks.tsx

@@ -1,329 +0,0 @@
-/**
- * AI-owned. Generated and maintained by the `signoz-page-story` skill.
- * Do not hand-edit: regenerate instead.
- */
-
-import { rest, type RequestHandler } from 'msw';
-import { TooltipProvider } from '@signozhq/ui/tooltip';
-import remove from 'api/browser/localstorage/remove';
-import {
-	type AuthtypesTransactionDTO,
-	type SavedviewtypesSavedViewDTO,
-	SavedviewtypesSourceDTO,
-	type SavedviewtypesUpdatableSavedViewDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { SIDEBAR_TOOLTIP_DELAY_MS } from 'components/QuickFilters/QuickFiltersLayout/constants';
-import { LOCALSTORAGE } from 'constants/localStorage';
-import {
-	AUTHZ_CHECK_URL,
-	authzMockResponse,
-} from 'lib/authz/utils/authz-test-utils';
-import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
-
-import { accessFor } from '@/storybook/access/access';
-import {
-	choiceControl,
-	countControl,
-	toggleControl,
-} from '@/storybook/controls/controls';
-import { defineStoryMocks } from '@/storybook/controls/defineStoryMocks';
-import type { MockControlValues, StoryMocks } from '@/storybook/controls/types';
-import { withCanvas } from '@/storybook/decorators/withCanvas';
-import { authzMocks, type AuthzArgs } from '@/storybook/globals/authzMocks';
-import { respondWith } from '@/storybook/runtime/responseState';
-
-import {
-	createdSavedView,
-	OPEN_VIEW_ERRORS,
-	OPEN_VIEWS,
-	type OpenView,
-	SAVED_VIEW_SOURCES,
-	SAVED_VIEWS_MAX,
-	savedViewById,
-	savedViewResponse,
-	savedViewRoute,
-	savedViewsListResponse,
-	type SavedViewSource,
-	unreadableViewId,
-} from './__story_mockdata__/savedViews';
-
-import SavedViewsHeader from '../SavedViewsHeader';
-import SavedViewsPanel from '../SavedViewsPanel';
-import type { SavedViewRowActionKey } from '../types';
-
-const API = 'http://localhost/api/v2/saved_views';
-
-const LIST = 'Saved Views · list';
-const VIEW = 'Saved Views · open view';
-
-const controls = {
-	source: choiceControl<SavedViewSource>('Source', {
-		group: VIEW,
-		description: 'Which explorer the views belong to.',
-		options: SAVED_VIEW_SOURCES,
-		value: SavedviewtypesSourceDTO.traces,
-	}),
-	openView: choiceControl<OpenView>('Open view', {
-		group: VIEW,
-		description:
-			'The `viewKey` the explorer url carries. `unsaved-changes` stages a query that differs from the view, which swaps in the ✓ save menu; `forbidden`, `failed` and `not-found` are the 403, 500 and 404 the view fetch answers with; each shows View failed to load.',
-		options: OPEN_VIEWS,
-		value: 'none',
-	}),
-	unreadableView: toggleControl('Unreadable view', {
-		group: VIEW,
-		description:
-			'Denies `read` on the first view created by others alone, on top of the Access controls: its row greys out, and with Open view on `created-by-others` the header shows No view access.',
-		value: false,
-	}),
-	createdByMe: countControl('Created by me', {
-		group: LIST,
-		value: 3,
-		max: SAVED_VIEWS_MAX,
-	}),
-	createdByOthers: countControl('Created by others', {
-		group: LIST,
-		description: 'Both at 0 is the empty state, with its Create view button.',
-		value: 4,
-		max: SAVED_VIEWS_MAX,
-	}),
-};
-
-type SavedViewsValues = MockControlValues<typeof controls>;
-
-type WrittenView = Pick<SavedviewtypesSavedViewDTO, 'spec' | 'source'>;
-
-const viewDenied = (
-	transaction: AuthtypesTransactionDTO,
-	deniedId: string,
-): boolean =>
-	transaction.relation === 'read' &&
-	transaction.object.resource.kind === 'saved-view' &&
-	transaction.object.selector === deniedId;
-
-const definition = defineStoryMocks({
-	controls,
-	handlers: (
-		values: SavedViewsValues & AuthzArgs,
-		response,
-	): RequestHandler[] => {
-		const { source, openView, createdByMe, createdByOthers } = values;
-
-		// What the panel writes stays in this handler set until a control changes.
-		const created: SavedviewtypesSavedViewDTO[] = [];
-		const updated = new Map<string, WrittenView>();
-		const deleted = new Set<string>();
-
-		const current = (
-			view: SavedviewtypesSavedViewDTO,
-		): SavedviewtypesSavedViewDTO => ({ ...view, ...updated.get(view.id) });
-
-		const findView = (id: string): SavedviewtypesSavedViewDTO | undefined => {
-			const view = created.find((item) => item.id === id) ?? savedViewById(id);
-
-			return view && !deleted.has(id) ? current(view) : undefined;
-		};
-
-		const openError = OPEN_VIEW_ERRORS[openView];
-
-		return [
-			rest.post(API, async (req, res, ctx) => {
-				const body = (await req.json()) as SavedviewtypesUpdatableSavedViewDTO;
-				const id = `storybook-${source}-created-${created.length + 1}`;
-
-				created.push(createdSavedView(source, id, body.spec));
-
-				return res(ctx.status(201), ctx.json({ status: 'success', data: { id } }));
-			}),
-
-			rest.get(
-				API,
-				response.json(() => {
-					const list = savedViewsListResponse(source, createdByMe, createdByOthers);
-
-					return {
-						...list,
-						data: [...(list.data ?? []), ...created]
-							.filter((view) => !deleted.has(view.id))
-							.map(current),
-					};
-				}),
-			),
-
-			rest.get(`${API}/:id`, (req, res, ctx) => {
-				if (openError) {
-					return res(ctx.status(openError.status), ctx.json(openError.body));
-				}
-
-				const view = findView(String(req.params.id));
-
-				if (!view) {
-					return res(ctx.status(404), ctx.json(OPEN_VIEW_ERRORS['not-found']?.body));
-				}
-
-				return response.json(() => savedViewResponse(view))(req, res, ctx);
-			}),
-
-			rest.put(`${API}/:id`, async (req, res, ctx) => {
-				const body = (await req.json()) as SavedviewtypesUpdatableSavedViewDTO;
-
-				updated.set(String(req.params.id), {
-					spec: body.spec,
-					source: body.source,
-				});
-
-				return res(ctx.status(204));
-			}),
-
-			rest.delete(`${API}/:id`, (req, res, ctx) => {
-				deleted.add(String(req.params.id));
-
-				return res(ctx.status(204));
-			}),
-
-			...(values.unreadableView
-				? [
-						rest.post(
-							AUTHZ_CHECK_URL,
-							respondWith(values.authzState, async (req) => {
-								const payload = (await req.json()) as AuthtypesTransactionDTO[];
-								const granted = accessFor(
-									values.access,
-									values.permissions,
-									values.revoked,
-								);
-								const deniedId = unreadableViewId(source);
-
-								return authzMockResponse(
-									payload,
-									payload.map(
-										(transaction) =>
-											!viewDenied(transaction, deniedId) && granted.allows(transaction),
-									),
-								);
-							}),
-						),
-					]
-				: []),
-		];
-	},
-	config: ({ source, openView }) => ({
-		route: savedViewRoute(source, openView),
-	}),
-	effect: () => {
-		remove(LOCALSTORAGE.LAST_USED_SAVED_VIEWS);
-	},
-});
-
-/**
- * The per-view read denial answers `authz/check` in place of the global access
- * mocks, so it reads their controls as well as its own to answer every other
- * check the way they would.
- */
-export const savedViewsMocks: StoryMocks<typeof controls> = {
-	...definition,
-	read: (args) => ({ ...authzMocks.read(args), ...definition.read(args) }),
-};
-
-/** The sidebar slot of an explorer without quick filters. */
-export const sidebarCanvas = withCanvas({
-	width: 280,
-	height: 640,
-	padding: 0,
-	display: 'flex',
-	flexDirection: 'column',
-	borderRight: '1px solid var(--l1-border)',
-});
-
-/**
- * The header above the pinned list. `onOpenViews` adds All views, which the
- * header only shows in an explorer whose quick filters hide the list.
- */
-export function SavedViewsSidebar({
-	source,
-	onOpenViews,
-}: {
-	source: SavedViewSource;
-	onOpenViews?: () => void;
-}): JSX.Element {
-	return (
-		<TooltipProvider delay={SIDEBAR_TOOLTIP_DELAY_MS}>
-			<SavedViewsHeader source={source} onOpenViews={onOpenViews} />
-			<SavedViewsPanel source={source} />
-		</TooltipProvider>
-	);
-}
-
-/** The panel fetches the list and checks every row's permissions before it settles. */
-export const UNTIL_LOADED = { timeout: 15_000 };
-
-/**
- * Re-queried on every attempt: a button whose check settles is a new node, so a
- * reference taken while it was pending never changes.
- */
-type FindElement = () => HTMLElement;
-
-export const byTestId =
-	(testId: string): FindElement =>
-	(): HTMLElement =>
-		screen.getByTestId(testId);
-
-/** A check still in flight: `aria-busy` on a button, `data-loading` on a menu row. */
-const isPending = (element: HTMLElement): boolean =>
-	element.getAttribute('aria-busy') === 'true' ||
-	element.hasAttribute('data-loading');
-
-const isDisabled = (element: HTMLElement): boolean =>
-	element.hasAttribute('disabled') || element.hasAttribute('data-disabled');
-
-export const expectDisabled = (
-	find: FindElement,
-	disabled = true,
-): Promise<void> =>
-	waitFor(async () => {
-		const element = find();
-
-		await expect(isPending(element)).toBe(false);
-		await expect(isDisabled(element)).toBe(disabled);
-	}, UNTIL_LOADED);
-
-export const expectPending = (find: FindElement): Promise<void> =>
-	waitFor(() => expect(isPending(find())).toBe(true), UNTIL_LOADED);
-
-export const findRows = (canvasElement: HTMLElement): Promise<HTMLElement[]> =>
-	within(canvasElement).findAllByTestId(
-		'saved-views-row',
-		undefined,
-		UNTIL_LOADED,
-	);
-
-export const rowName =
-	(row: HTMLElement): FindElement =>
-	(): HTMLElement =>
-		within(row).getByTestId('saved-views-row-name');
-
-export const openRowMenu = async (row: HTMLElement): Promise<void> => {
-	await userEvent.click(within(row).getByTestId('saved-views-row-menu'));
-	await screen.findByRole('menu', undefined, UNTIL_LOADED);
-};
-
-export const rowMenuItem = (key: SavedViewRowActionKey): FindElement =>
-	byTestId(`saved-views-row-menu-item-${key}`);
-
-export const openSaveChangesMenu = async (
-	canvasElement: HTMLElement,
-): Promise<void> => {
-	const trigger = await waitFor(async () => {
-		const button = within(canvasElement).getByTestId('saved-views-save-changes');
-
-		await expect(button).not.toHaveAttribute('aria-busy');
-
-		return button;
-	}, UNTIL_LOADED);
-
-	await userEvent.click(trigger);
-	await screen.findByRole('menu', undefined, UNTIL_LOADED);
-};
-
-export const saveChangesItem = (key: 'save-as-new' | 'update'): FindElement =>
-	byTestId(`saved-views-save-changes-item-${key}`);

frontend/src/container/SavedViews/stories/SavedViews.stories.tsx

@@ -1,80 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-
-import { storyMocks } from '@/storybook/controls/defineStoryMocks';
-import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
-
-import SavedViewsPanel from '../SavedViewsPanel';
-import {
-	findRows,
-	openRowMenu,
-	openSaveChangesMenu,
-	SavedViewsSidebar,
-	savedViewsMocks,
-	sidebarCanvas,
-} from './SavedViews.stories.mocks';
-
-type SavedViewsArgs = PageStoryArgs<typeof savedViewsMocks>;
-
-const componentStory = storyMocks(savedViewsMocks);
-
-/**
- * The saved views sidebar of an explorer without quick filters: the header with
- * the open view and its actions, above the list of views created by the user
- * and by others. Every action is gated on the `saved-view` authz permissions
- * (list, create, and read, update and delete per view).
- *
- * Route: the explorer of the Source control, with the Open view control's
- * `viewKey`.
- */
-const meta = {
-	title: 'Components/Saved Views/Overview',
-	tags: ['authz', 'play'],
-	component: SavedViewsPanel,
-	decorators: [sidebarCanvas],
-	render: ({ source }): JSX.Element => <SavedViewsSidebar source={source} />,
-	...componentStory,
-	parameters: { ...componentStory.parameters },
-} satisfies Meta<SavedViewsArgs>;
-
-export default meta;
-
-type Story = StoryObj<SavedViewsArgs>;
-
-/** Traces views created by the user and by others, with no view open. */
-export const Default: Story = {};
-
-/** A workspace with no views yet: the empty state offers Create view. */
-export const Empty: Story = {
-	args: { createdByMe: 0, createdByOthers: 0 },
-};
-
-/**
- * A view open with a query that differs from what it saved: the name carries
- * the unsaved dot, and ✓ and discard replace Clear view.
- */
-export const UnsavedChanges: Story = {
-	args: { openView: 'unsaved-changes' },
-};
-
-/**
- * The first row's menu. Edit details and Delete follow `update` and `delete` on
- * that view, so revoking either disables its item.
- */
-export const RowMenu: Story = {
-	play: async ({ canvasElement }): Promise<void> => {
-		const [row] = await findRows(canvasElement);
-
-		await openRowMenu(row);
-	},
-};
-
-/**
- * The ✓ menu on a view with unsaved changes. Save as new view follows `create`
- * and Update selected view follows `update` on the open view.
- */
-export const SaveChangesMenu: Story = {
-	args: { openView: 'unsaved-changes' },
-	play: async ({ canvasElement }): Promise<void> => {
-		await openSaveChangesMenu(canvasElement);
-	},
-};

frontend/src/container/SavedViews/stories/__story_mockdata__/savedViews.ts

@@ -1,309 +0,0 @@
-/**
- * AI-owned. Generated and maintained by the `signoz-page-story` skill.
- * Do not hand-edit: regenerate instead.
- */
-
-import type {
-	GetSavedView200,
-	ListSavedViews200,
-	RenderErrorResponseDTO,
-	SavedviewtypesSavedViewDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import {
-	SavedviewtypesSchemaVersionDTO,
-	SavedviewtypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { QueryParams } from 'constants/query';
-import {
-	initialQueriesMap,
-	initialQueryMeterWithType,
-	PANEL_TYPES,
-} from 'constants/queryBuilder';
-import ROUTES from 'constants/routes';
-import { getSavedViewQuery } from 'container/SavedViews/utils/getSavedViewQuery';
-import { toSavedViewSpec } from 'container/SavedViews/utils/toSavedViewSpec';
-import { createAppContextMock } from 'tests/fixtures/appContextMock';
-import type { Query } from 'types/api/queryBuilder/queryBuilderData';
-import { USER_ROLES } from 'types/roles';
-
-export const SAVED_VIEW_SOURCES = [
-	SavedviewtypesSourceDTO.traces,
-	SavedviewtypesSourceDTO.logs,
-	SavedviewtypesSourceDTO.metrics,
-	SavedviewtypesSourceDTO.meter,
-] as const;
-
-export type SavedViewSource = (typeof SAVED_VIEW_SOURCES)[number];
-
-export const OPEN_VIEWS = [
-	'none',
-	'created-by-me',
-	'created-by-others',
-	'unsaved-changes',
-	'forbidden',
-	'failed',
-	'not-found',
-] as const;
-
-export type OpenView = (typeof OPEN_VIEWS)[number];
-
-export const SAVED_VIEWS_MAX = 8;
-
-/** The user the story app context signs in as, so "Created by me" follows it. */
-const STORY_USER_EMAIL = createAppContextMock(USER_ROLES.ADMIN).user.email;
-
-const OTHER_AUTHORS = ['priya@signoz.io', 'marco@signoz.io', 'lena@signoz.io'];
-
-const MY_VIEW_NAMES = [
-	'Checkout errors',
-	'Slow payment calls',
-	'Cart service, production',
-	'Auth retries',
-	'Inventory sync',
-	'Search p99 regressions',
-	'Webhook failures',
-	'Cold starts after deploy',
-];
-
-const OTHER_VIEW_NAMES = [
-	'On-call triage',
-	'Frontend 5xx',
-	'Shipping latency by region',
-	'Kafka consumer lag',
-	'Staging smoke tests',
-	'Recommendation timeouts',
-	'Ad service sampling',
-	'Email queue backlog',
-];
-
-const EXPRESSIONS = [
-	"service.name = 'checkout' AND has_error = true",
-	"service.name = 'payments'",
-	"service.name = 'cart' AND deployment.environment = 'production'",
-	"service.name = 'auth'",
-	"service.name IN ('inventory', 'catalog')",
-	"service.name = 'search'",
-	"service.name = 'webhooks' AND has_error = true",
-	"deployment.environment = 'production'",
-];
-
-const BASE_QUERY: Record<SavedViewSource, Query> = {
-	traces: initialQueriesMap.traces,
-	logs: initialQueriesMap.logs,
-	metrics: initialQueriesMap.metrics,
-	meter: initialQueryMeterWithType,
-};
-
-const EXPLORER_ROUTE: Record<SavedViewSource, string> = {
-	traces: ROUTES.TRACES_EXPLORER,
-	logs: ROUTES.LOGS_EXPLORER,
-	metrics: ROUTES.METRICS_EXPLORER_EXPLORER,
-	meter: ROUTES.METER_EXPLORER,
-};
-
-const queryWith = (source: SavedViewSource, expression: string): Query => {
-	const base = BASE_QUERY[source];
-
-	return {
-		...base,
-		builder: {
-			...base.builder,
-			queryData: [
-				{
-					...base.builder.queryData[0],
-					filter: { expression },
-					aggregations: [{ expression: 'count()' }],
-				},
-			],
-		},
-	} as Query;
-};
-
-type Author = 'mine' | 'others';
-
-const viewId = (
-	source: SavedViewSource,
-	author: Author,
-	index: number,
-): string => `storybook-${source}-${author}-${index + 1}`;
-
-/** The view other people made that the per-view read denial applies to. */
-export const unreadableViewId = (source: SavedViewSource): string =>
-	viewId(source, 'others', 0);
-
-const savedView = (
-	source: SavedViewSource,
-	author: Author,
-	index: number,
-): SavedviewtypesSavedViewDTO => {
-	const displayName = (author === 'mine' ? MY_VIEW_NAMES : OTHER_VIEW_NAMES)[
-		index
-	];
-	const createdBy =
-		author === 'mine'
-			? STORY_USER_EMAIL
-			: OTHER_AUTHORS[index % OTHER_AUTHORS.length];
-	const id = viewId(source, author, index);
-
-	return {
-		id,
-		name: id,
-		source,
-		schemaVersion: SavedviewtypesSchemaVersionDTO.v2,
-		createdAt: '2026-09-02T08:30:00Z',
-		createdBy,
-		updatedAt: `2026-10-${String(14 - (index % 10)).padStart(2, '0')}T11:42:00Z`,
-		updatedBy: createdBy,
-		spec: toSavedViewSpec({
-			query: queryWith(
-				source,
-				EXPRESSIONS[(index + (author === 'mine' ? 0 : 3)) % EXPRESSIONS.length],
-			),
-			panelType: PANEL_TYPES.LIST,
-			displayName,
-		}),
-	};
-};
-
-const savedViews = (
-	source: SavedViewSource,
-	author: Author,
-	count: number,
-): SavedviewtypesSavedViewDTO[] =>
-	Array.from({ length: Math.min(count, SAVED_VIEWS_MAX) }, (_, index) =>
-		savedView(source, author, index),
-	);
-
-export const savedViewsListResponse = (
-	source: SavedViewSource,
-	createdByMe: number,
-	createdByOthers: number,
-): ListSavedViews200 => ({
-	status: 'success',
-	data: [
-		...savedViews(source, 'mine', createdByMe),
-		...savedViews(source, 'others', createdByOthers),
-	],
-});
-
-/** Every view the workspace has, whatever the list control trims it to. */
-export const savedViewById = (
-	id: string,
-): SavedviewtypesSavedViewDTO | undefined =>
-	SAVED_VIEW_SOURCES.flatMap((source) => [
-		...savedViews(source, 'mine', SAVED_VIEWS_MAX),
-		...savedViews(source, 'others', SAVED_VIEWS_MAX),
-	]).find((view) => view.id === id);
-
-/** A view the panel itself created, owned by the story user. */
-export const createdSavedView = (
-	source: SavedViewSource,
-	id: string,
-	spec: SavedviewtypesSavedViewDTO['spec'],
-): SavedviewtypesSavedViewDTO => ({
-	...savedView(source, 'mine', 0),
-	id,
-	name: id,
-	createdAt: '2026-10-16T09:00:00Z',
-	updatedAt: '2026-10-16T09:00:00Z',
-	spec,
-});
-
-export const savedViewResponse = (
-	view: SavedviewtypesSavedViewDTO,
-): GetSavedView200 => ({ status: 'success', data: view });
-
-export const OPEN_VIEW_ERRORS: Partial<
-	Record<OpenView, { status: number; body: RenderErrorResponseDTO }>
-> = {
-	forbidden: {
-		status: 403,
-		body: {
-			status: 'error',
-			error: {
-				code: 'forbidden',
-				message: 'You do not have access to this saved view',
-				errors: [],
-				suggestions: [],
-				type: 'forbidden',
-			},
-		},
-	},
-	failed: {
-		status: 500,
-		body: {
-			status: 'error',
-			error: {
-				code: 'internal',
-				message: 'Failed to load the saved view',
-				errors: [],
-				suggestions: [],
-				type: 'internal',
-			},
-		},
-	},
-	'not-found': {
-		status: 404,
-		body: {
-			status: 'error',
-			error: {
-				code: 'not_found',
-				message: 'Saved view not found',
-				errors: [],
-				suggestions: [],
-				type: 'not_found',
-			},
-		},
-	},
-};
-
-const openViewId = (source: SavedViewSource, open: OpenView): string | null => {
-	if (open === 'none') {
-		return null;
-	}
-
-	if (open === 'created-by-others' || open === 'forbidden') {
-		return viewId(source, 'others', 0);
-	}
-
-	if (open === 'not-found') {
-		return `storybook-${source}-deleted`;
-	}
-
-	return viewId(source, 'mine', 0);
-};
-
-/**
- * The explorer url with a view open, its params written the way
- * `redirectWithQueryBuilderData` writes them. `panelTypes` is left out: the
- * query builder seeds its panel type from the raw, JSON-quoted param, which no
- * saved panel type equals, and without it the header compares against `list`.
- */
-export const savedViewRoute = (
-	source: SavedViewSource,
-	open: OpenView,
-): string => {
-	const params = new URLSearchParams({ relativeTime: '15m' });
-	const id = openViewId(source, open);
-
-	if (id) {
-		const view = savedViewById(id);
-		const query = view
-			? getSavedViewQuery(view)
-			: queryWith(source, EXPRESSIONS[0]);
-		const staged =
-			open === 'unsaved-changes'
-				? queryWith(source, `${EXPRESSIONS[0]} AND duration_nano > 500000000`)
-				: query;
-
-		params.set(
-			QueryParams.compositeQuery,
-			encodeURIComponent(
-				JSON.stringify({ ...staged, id: `storybook-staged-${open}` }),
-			),
-		);
-		params.set(QueryParams.viewKey, JSON.stringify(id));
-	}
-
-	return `${EXPLORER_ROUTE[source]}?${params.toString()}`;
-};

frontend/src/container/SavedViews/stories/authz/SavedViews.authz.stories.tsx

@@ -1,220 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { expect, waitFor, within } from 'storybook/test';
-
-import { storyMocks } from '@/storybook/controls/defineStoryMocks';
-import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
-
-import { unreadableViewId } from '../__story_mockdata__/savedViews';
-import {
-	byTestId,
-	expectDisabled,
-	expectPending,
-	findRows,
-	openRowMenu,
-	openSaveChangesMenu,
-	rowMenuItem,
-	rowName,
-	saveChangesItem,
-	SavedViewsSidebar,
-	savedViewsMocks,
-	sidebarCanvas,
-	UNTIL_LOADED,
-} from '../SavedViews.stories.mocks';
-
-import SavedViewsPanel from '../../SavedViewsPanel';
-
-type SavedViewsArgs = PageStoryArgs<typeof savedViewsMocks>;
-
-const componentStory = storyMocks(savedViewsMocks);
-
-/**
- * The saved views sidebar with one permission missing at a time. Every story
- * here is an admin denied exactly what its name says. `list` and `create` are
- * workspace-wide; `read`, `update` and `delete` are checked per view, so a row
- * menu only checks its view once it is opened.
- *
- * Route: the explorer of the Source control, with the Open view control's
- * `viewKey`.
- */
-const meta = {
-	title: 'Components/Saved Views/Authz',
-	tags: ['authz', 'play'],
-	component: SavedViewsPanel,
-	decorators: [sidebarCanvas],
-	render: ({ source }): JSX.Element => <SavedViewsSidebar source={source} />,
-	...componentStory,
-	parameters: { ...componentStory.parameters },
-} satisfies Meta<SavedViewsArgs>;
-
-export default meta;
-
-type Story = StoryObj<SavedViewsArgs>;
-
-const LIST = 'list:saved-view';
-const CREATE = 'create:saved-view';
-const UPDATE = 'update:saved-view';
-const DELETE = 'delete:saved-view';
-
-/**
- * The panel shows the permission callout in place of the list, and All views,
- * in an explorer whose quick filters hide the list, is disabled.
- */
-export const NoList: Story = {
-	args: { revoked: [LIST] },
-	render: ({ source }): JSX.Element => (
-		<SavedViewsSidebar source={source} onOpenViews={(): void => {}} />
-	),
-	play: async ({ canvasElement }) => {
-		const canvas = within(canvasElement);
-
-		await expectDisabled(byTestId('saved-views-open'));
-		await waitFor(
-			() =>
-				expect(canvas.getByTestId('saved-views-panel')).toHaveTextContent(
-					/is not authorized to perform list/,
-				),
-			UNTIL_LOADED,
-		);
-		await expect(canvas.queryByTestId('saved-views-search')).toBeNull();
-	},
-};
-
-/** An empty workspace with both ways to create a view disabled: + and Create view. */
-export const NoCreate: Story = {
-	args: { revoked: [CREATE], createdByMe: 0, createdByOthers: 0 },
-	play: async () => {
-		await expectDisabled(byTestId('saved-views-create'));
-		await expectDisabled(byTestId('saved-views-list-create'));
-	},
-};
-
-/** The ✓ menu on unsaved changes: Save as new view disabled, Update selected view open. */
-export const NoCreateSaveMenu: Story = {
-	args: { revoked: [CREATE], openView: 'unsaved-changes' },
-	play: async ({ canvasElement }) => {
-		await openSaveChangesMenu(canvasElement);
-		await expectDisabled(saveChangesItem('save-as-new'));
-		await expectDisabled(saveChangesItem('update'), false);
-	},
-};
-
-/**
- * `read` denied on one view made by someone else: its name is disabled and its
- * hover card never opens, while every other view still opens.
- */
-export const NoRead: Story = {
-	args: { unreadableView: true },
-	play: async ({ canvasElement, args }) => {
-		const rows = await findRows(canvasElement);
-		const deniedId = unreadableViewId(args.source);
-
-		await Promise.all(
-			rows.map((row) =>
-				expectDisabled(rowName(row), row.getAttribute('data-view-id') === deniedId),
-			),
-		);
-	},
-};
-
-/** The unreadable view open from its link: the header names it No view access. */
-export const NoReadOpenView: Story = {
-	args: { unreadableView: true, openView: 'created-by-others' },
-	play: async ({ canvasElement }) => {
-		await expect(
-			await within(canvasElement).findByText(
-				'No view access',
-				undefined,
-				UNTIL_LOADED,
-			),
-		).toBeVisible();
-	},
-};
-
-/** A row's menu: Edit details disabled; Copy link, Copy ID and Delete open. */
-export const NoUpdate: Story = {
-	args: { revoked: [UPDATE] },
-	play: async ({ canvasElement }) => {
-		const [row] = await findRows(canvasElement);
-
-		await openRowMenu(row);
-		await expectDisabled(rowMenuItem('editDetails'));
-		await expectDisabled(rowMenuItem('copyLink'), false);
-		await expectDisabled(rowMenuItem('copyId'), false);
-		await expectDisabled(rowMenuItem('delete'), false);
-	},
-};
-
-/** The ✓ menu on unsaved changes: Update selected view disabled, Save as new view open. */
-export const NoUpdateSaveMenu: Story = {
-	args: { revoked: [UPDATE], openView: 'unsaved-changes' },
-	play: async ({ canvasElement }) => {
-		await openSaveChangesMenu(canvasElement);
-		await expectDisabled(saveChangesItem('update'));
-		await expectDisabled(saveChangesItem('save-as-new'), false);
-	},
-};
-
-/** A row's menu: Delete disabled, Edit details still open. */
-export const NoDelete: Story = {
-	args: { revoked: [DELETE] },
-	play: async ({ canvasElement }) => {
-		const [row] = await findRows(canvasElement);
-
-		await openRowMenu(row);
-		await expectDisabled(rowMenuItem('delete'));
-		await expectDisabled(rowMenuItem('editDetails'), false);
-	},
-};
-
-/**
- * Everything but listing and reading: + is disabled, and a row's menu has only
- * Copy link and Copy ID left.
- */
-export const ReadOnly: Story = {
-	args: { revoked: [CREATE, UPDATE, DELETE] },
-	play: async ({ canvasElement }) => {
-		await expectDisabled(byTestId('saved-views-create'));
-
-		const [row] = await findRows(canvasElement);
-
-		await expectDisabled(rowName(row), false);
-		await openRowMenu(row);
-		await expectDisabled(rowMenuItem('editDetails'));
-		await expectDisabled(rowMenuItem('delete'));
-		await expectDisabled(rowMenuItem('copyLink'), false);
-		await expectDisabled(rowMenuItem('copyId'), false);
-	},
-};
-
-/**
- * The permission check never answering: + spins, and the list stays blank
- * behind its `list` check.
- */
-export const CheckLoading: Story = {
-	args: { authzState: 'loading' },
-	play: async ({ canvasElement }) => {
-		const canvas = within(canvasElement);
-
-		await expectPending(byTestId('saved-views-create'));
-		await expect(canvas.queryByTestId('saved-views-search')).toBeNull();
-	},
-};
-
-/**
- * The permission check failing rather than denying: the sidebar fails open,
- * so the list renders and every action stays enabled for the API to refuse.
- */
-export const CheckFailed: Story = {
-	args: { authzState: 'error' },
-	parameters: { allowConsoleErrors: true },
-	play: async ({ canvasElement }) => {
-		await expectDisabled(byTestId('saved-views-create'), false);
-
-		const [row] = await findRows(canvasElement);
-
-		await expectDisabled(rowName(row), false);
-		await openRowMenu(row);
-		await expectDisabled(rowMenuItem('editDetails'), false);
-		await expectDisabled(rowMenuItem('delete'), false);
-	},
-};

frontend/src/container/SavedViews/types.ts

@@ -1,6 +1,5 @@
 import { ReactElement, ReactNode } from 'react';
 import type { Link } from '@signozhq/icons';
-import type { BrandedPermission } from 'lib/authz/hooks/useAuthZ/types';
 import {
 	SavedviewtypesSavedViewDTO,
 	SavedviewtypesSourceDTO,
@@ -42,8 +41,6 @@ export interface UseActiveSavedViewResult {
 	view: SavedviewtypesSavedViewDTO | undefined;
 	isLoading: boolean;
 	isError: boolean;
-	isReadDenied: boolean;
-	errorMessage: string | undefined;
 	hasUnsavedChanges: boolean;
 }
 
@@ -73,7 +70,6 @@ export interface SaveViewModalProps {
 }
 
 export interface SaveChangesMenuProps {
-	viewId: string;
 	disabled: boolean;
 	onSaveAsNew: () => void;
 	onUpdate: () => void;
@@ -86,7 +82,6 @@ export interface SavedViewsIconButtonProps {
 	color?: 'secondary' | 'warning';
 	disabled?: boolean;
 	disabledTooltip?: ReactNode;
-	checks?: BrandedPermission[];
 	onClick?: () => void;
 }
 
@@ -121,11 +116,7 @@ export interface SavedViewsListRowProps {
 	hover: SavedViewsListRowHoverProps;
 }
 
-export type SavedViewRowActionKey =
-	| 'copyLink'
-	| 'copyId'
-	| 'editDetails'
-	| 'delete';
+export type SavedViewRowActionKey = 'copyLink' | 'editDetails' | 'delete';
 
 export interface SavedViewRowActionConfig {
 	key: SavedViewRowActionKey;
@@ -133,11 +124,10 @@ export interface SavedViewRowActionConfig {
 	icon: typeof Link;
 	danger?: boolean;
 	hasDividerBefore?: boolean;
-	buildPermission?: (id: string) => BrandedPermission;
 }
 
 export interface PendingSavedViewAction {
-	key: Exclude<SavedViewRowActionKey, 'copyLink' | 'copyId'>;
+	key: Exclude<SavedViewRowActionKey, 'copyLink'>;
 	view: SavedviewtypesSavedViewDTO;
 }
 
@@ -150,7 +140,6 @@ export interface SavedViewsRowButtonProps {
 }
 
 export interface SavedViewsRowMenuProps {
-	viewId: string;
 	onAction: (key: SavedViewRowActionKey) => void;
 	onOpen: () => void;
 }
@@ -163,7 +152,6 @@ export interface DeleteSavedViewDialogProps {
 
 export interface UseSavedViewRowActionsResult {
 	copyViewLink: (view: SavedviewtypesSavedViewDTO) => void;
-	copyViewId: (view: SavedviewtypesSavedViewDTO) => void;
 	renameView: (
 		view: SavedviewtypesSavedViewDTO,
 		displayName: string,

frontend/src/container/WidgetCard/Panels/BarPanel/__tests__/utils.test.ts

@@ -1,4 +1,3 @@
-import type { ExtendedSeries } from 'lib/uPlotV2/config/types';
 import { Widgets } from 'types/api/widgets/widget';
 import {
 	MetricRangePayloadProps,
@@ -165,27 +164,6 @@ describe('BarPanel utils', () => {
 			expect(config.series).toHaveLength(3);
 		});
 
-		it('passes partial timestamps to the series', () => {
-			const apiResponse = createApiResponse([
-				{
-					metric: {},
-					queryName: 'Q1',
-					values: [
-						[1000, '1'],
-						[1060, '0.2'],
-					],
-					partialTimestamps: [1060],
-				} as MetricRangePayloadProps['data']['result'][0],
-			]);
-
-			const series = prepareBarPanelConfig({
-				...baseParams,
-				apiResponse,
-			}).getConfig().series?.[1] as ExtendedSeries;
-
-			expect(series.partialTimestamps).toStrictEqual(new Set([1060]));
-		});
-
 		it('uses getLegend for label when currentQuery is provided', () => {
 			const apiResponse = createApiResponse([
 				{

frontend/src/container/WidgetCard/Panels/BarPanel/utils.ts

@@ -89,9 +89,6 @@ export function prepareBarPanelConfig({
 			isDarkMode,
 			stepInterval: currentStepInterval,
 			metric: series.metric,
-			partialTimestamps: series.partialTimestamps
-				? new Set(series.partialTimestamps)
-				: undefined,
 		});
 	});
 

frontend/src/container/WidgetCard/Panels/TimeSeriesPanel/__tests__/utils.test.ts

@@ -5,7 +5,6 @@ import {
 } from 'types/api/metrics/getQueryRange';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 
-import type { ExtendedSeries } from 'lib/uPlotV2/config/types';
 import { PanelMode } from 'lib/visualization/panels/types';
 import { prepareUPlotConfig } from 'container/WidgetCard/Panels/TimeSeriesPanel/utils';
 import { prepareChartData } from 'lib/uPlotV2/utils/dataUtils';
@@ -186,28 +185,6 @@ describe('TimeSeriesPanel utils', () => {
 			});
 		});
 
-		it('passes partial timestamps to the series', () => {
-			const apiResponse = createApiResponse([
-				{
-					metric: {},
-					queryName: 'Q1',
-					values: [
-						[1000, '1'],
-						[1060, '0.2'],
-					],
-					partialTimestamps: [1060],
-				} as MetricRangePayloadProps['data']['result'][0],
-			]);
-
-			const series = prepareUPlotConfig({
-				...baseParams,
-				apiResponse,
-				currentQuery: null as unknown as Query,
-			}).getConfig().series?.[1] as ExtendedSeries;
-
-			expect(series.partialTimestamps).toStrictEqual(new Set([1060]));
-		});
-
 		it('uses getLegend for label when currentQuery is provided', () => {
 			const apiResponse = createApiResponse([
 				{

frontend/src/container/WidgetCard/Panels/TimeSeriesPanel/utils.ts

@@ -101,9 +101,6 @@ export const prepareUPlotConfig = ({
 			fillMode: widget.fillMode || FillMode.None,
 			isDarkMode,
 			metric: series.metric,
-			partialTimestamps: series.partialTimestamps
-				? new Set(series.partialTimestamps)
-				: undefined,
 		});
 	});
 

frontend/src/hooks/logs/__tests__/useActiveLog.test.ts

@@ -1,61 +0,0 @@
-import { renderHook } from '@testing-library/react';
-import { initialQueriesMap } from 'constants/queryBuilder';
-import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
-import { Query } from 'types/api/queryBuilder/queryBuilderData';
-
-import { useActiveLog } from '../useActiveLog';
-
-const mockRedirect = jest.fn();
-
-jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
-	useQueryBuilder: (): unknown => ({
-		currentQuery: initialQueriesMap.logs,
-		redirectWithQueryBuilderData: mockRedirect,
-	}),
-}));
-
-jest.mock('hooks/useUrlQuery', () => ({
-	__esModule: true,
-	default: (): URLSearchParams => new URLSearchParams(),
-}));
-
-describe('useActiveLog', () => {
-	beforeEach(() => {
-		mockRedirect.mockClear();
-	});
-
-	it('adds the chip field as a filter with its data type and redirects', () => {
-		const { result } = renderHook(() => useActiveLog());
-
-		result.current.onAddToQuery(
-			'service.name',
-			'frontend',
-			'=',
-			DataTypes.String,
-		);
-
-		expect(mockRedirect).toHaveBeenCalledTimes(1);
-		const query = mockRedirect.mock.calls[0][0] as Query;
-		const item = query.builder.queryData[0].filters?.items.at(-1);
-		expect(item?.key).toMatchObject({
-			key: 'service.name',
-			dataType: DataTypes.String,
-			type: '',
-		});
-		expect(item?.op).toBe('=');
-		expect(item?.value).toBe('frontend');
-	});
-
-	it('keeps the existing filter items ahead of the new one', () => {
-		const { result } = renderHook(() => useActiveLog());
-
-		result.current.onAddToQuery('k8s.pod.name', 'pod-1', '=');
-
-		const query = mockRedirect.mock.calls[0][0] as Query;
-		const items = query.builder.queryData[0].filters?.items ?? [];
-		expect(items).toHaveLength(
-			(initialQueriesMap.logs.builder.queryData[0].filters?.items.length ?? 0) + 1,
-		);
-		expect(items.at(-1)?.key?.key).toBe('k8s.pod.name');
-	});
-});

frontend/src/hooks/logs/__tests__/useLogDetailHandlers.test.ts

@@ -11,6 +11,7 @@ jest.mock('hooks/useIsTextSelected');
 const mockOnSetActiveLog = jest.fn();
 const mockOnClearActiveLog = jest.fn();
 const mockOnAddToQuery = jest.fn();
+const mockOnGroupByAttribute = jest.fn();
 const mockIsTextSelected = jest.fn();
 
 const mockLog: ILog = {
@@ -43,6 +44,7 @@ beforeEach(() => {
 		onSetActiveLog: mockOnSetActiveLog,
 		onClearActiveLog: mockOnClearActiveLog,
 		onAddToQuery: mockOnAddToQuery,
+		onGroupByAttribute: mockOnGroupByAttribute,
 	});
 });
 
@@ -78,6 +80,7 @@ it('should toggle off when clicking the same active log', () => {
 		onSetActiveLog: mockOnSetActiveLog,
 		onClearActiveLog: mockOnClearActiveLog,
 		onAddToQuery: mockOnAddToQuery,
+		onGroupByAttribute: mockOnGroupByAttribute,
 	});
 
 	const { result } = renderHook(() => useLogDetailHandlers());

frontend/src/hooks/logs/types.ts

@@ -25,4 +25,5 @@ export type UseActiveLog = {
 		operator: string,
 		dataType?: DataTypes,
 	) => void;
+	onGroupByAttribute: (fieldKey: string, dataType?: DataTypes) => Promise<void>;
 };

frontend/src/hooks/logs/useActiveLog.ts

@@ -1,16 +1,40 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
+import { useQueryClient } from 'react-query';
+import { getAggregateKeys } from 'api/queryBuilder/getAttributeKeys';
+import { SOMETHING_WENT_WRONG } from 'constants/api';
 import { QueryParams } from 'constants/query';
-import { getFilterQueryData } from 'container/LogDetailedView/logAttributeActions.utils';
+import { OPERATORS, QueryBuilderKeys } from 'constants/queryBuilder';
+import { MetricsType } from 'container/MetricsApplication/constant';
+import { getOperatorValue } from 'container/QueryBuilder/filters/QueryBuilderSearchV2/utils';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import { useNotifications } from 'hooks/useNotifications';
 import useUrlQuery from 'hooks/useUrlQuery';
+import { chooseAutocompleteFromCustomValue } from 'lib/newQueryBuilder/chooseAutocompleteFromCustomValue';
 import { ILog } from 'types/api/logs/log';
-import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
+import {
+	BaseAutocompleteData,
+	DataTypes,
+} from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
+import { v4 as uuid } from 'uuid';
 
 import { UseActiveLog } from './types';
 
+export function getOldLogsOperatorFromNew(operator: string): string {
+	switch (operator) {
+		case OPERATORS['=']:
+			return OPERATORS.IN;
+		case OPERATORS['!=']:
+			return OPERATORS.NIN;
+		default:
+			return operator;
+	}
+}
+// eslint-disable-next-line sonarjs/cognitive-complexity
 export const useActiveLog = (): UseActiveLog => {
+	const queryClient = useQueryClient();
 	const { currentQuery, redirectWithQueryBuilderData } = useQueryBuilder();
+	const { notifications } = useNotifications();
 
 	const [activeLog, setActiveLog] = useState<ILog | null>(null);
 
@@ -34,32 +58,121 @@ export const useActiveLog = (): UseActiveLog => {
 
 	const onClearActiveLog = useCallback((): void => setActiveLog(null), []);
 
-	const onAddToQuery = useCallback(
-		(
+	const onAddToQueryExplorer = useCallback(
+		async (
 			fieldKey: string,
 			fieldValue: string,
 			operator: string,
 			dataType?: DataTypes,
-		): void => {
-			const nextQuery: Query = {
-				...currentQuery,
-				builder: {
-					...currentQuery.builder,
-					queryData: currentQuery.builder.queryData.map((item) =>
-						getFilterQueryData(item, { fieldKey, dataType }, fieldValue, operator),
-					),
-				},
-			};
+			fieldType?: MetricsType | undefined,
+		): Promise<void> => {
+			try {
+				const keysAutocompleteResponse = await queryClient.fetchQuery(
+					[QueryBuilderKeys.GET_AGGREGATE_KEYS, fieldKey],
+					async () =>
+						getAggregateKeys({
+							searchText: fieldKey,
+							aggregateOperator:
+								currentQuery.builder.queryData[0].aggregateOperator || '',
+							dataSource: currentQuery.builder.queryData[0].dataSource,
+							aggregateAttribute:
+								currentQuery.builder.queryData[0].aggregateAttribute?.key || '',
+						}),
+				);
 
-			redirectWithQueryBuilderData(nextQuery);
+				const keysAutocomplete: BaseAutocompleteData[] =
+					keysAutocompleteResponse.payload?.attributeKeys || [];
+
+				const existAutocompleteKey = chooseAutocompleteFromCustomValue(
+					keysAutocomplete,
+					fieldKey,
+					dataType,
+					fieldType,
+				);
+
+				const currentOperator = getOperatorValue(operator);
+
+				const nextQuery: Query = {
+					...currentQuery,
+					builder: {
+						...currentQuery.builder,
+						queryData: currentQuery.builder.queryData.map((item) => ({
+							...item,
+							filters: {
+								...item.filters,
+								items: [
+									...(item.filters?.items || []),
+									{
+										id: uuid(),
+										key: existAutocompleteKey,
+										op: currentOperator,
+										value: fieldValue,
+									},
+								],
+								op: item.filters?.op || 'AND',
+							},
+						})),
+					},
+				};
+
+				redirectWithQueryBuilderData(nextQuery);
+			} catch {
+				notifications.error({ message: SOMETHING_WENT_WRONG });
+			}
 		},
-		[currentQuery, redirectWithQueryBuilderData],
+		[currentQuery, notifications, queryClient, redirectWithQueryBuilderData],
+	);
+
+	const onGroupByAttribute = useCallback(
+		async (fieldKey: string, dataType?: DataTypes): Promise<void> => {
+			try {
+				const keysAutocompleteResponse = await queryClient.fetchQuery(
+					[QueryBuilderKeys.GET_AGGREGATE_KEYS, fieldKey],
+					// eslint-disable-next-line sonarjs/no-identical-functions
+					async () =>
+						getAggregateKeys({
+							searchText: fieldKey,
+							aggregateOperator:
+								currentQuery.builder.queryData[0].aggregateOperator || '',
+							dataSource: currentQuery.builder.queryData[0].dataSource,
+							aggregateAttribute:
+								currentQuery.builder.queryData[0].aggregateAttribute?.key || '',
+						}),
+				);
+
+				const keysAutocomplete: BaseAutocompleteData[] =
+					keysAutocompleteResponse.payload?.attributeKeys || [];
+
+				const existAutocompleteKey = chooseAutocompleteFromCustomValue(
+					keysAutocomplete,
+					fieldKey,
+					dataType,
+				);
+
+				const nextQuery: Query = {
+					...currentQuery,
+					builder: {
+						...currentQuery.builder,
+						queryData: currentQuery.builder.queryData.map((item) => ({
+							...item,
+							groupBy: [...item.groupBy, existAutocompleteKey],
+						})),
+					},
+				};
+
+				redirectWithQueryBuilderData(nextQuery);
+			} catch {
+				notifications.error({ message: SOMETHING_WENT_WRONG });
+			}
+		},
+		[currentQuery, notifications, queryClient, redirectWithQueryBuilderData],
 	);
 
 	return {
 		activeLog,
 		onSetActiveLog,
 		onClearActiveLog,
-		onAddToQuery,
+		onAddToQuery: onAddToQueryExplorer,
+		onGroupByAttribute,
 	};
 };

frontend/src/hooks/trace/__tests__/useCopySpanLink.test.tsx

@@ -1,58 +0,0 @@
-import { MouseEvent, ReactNode } from 'react';
-import { MemoryRouter } from 'react-router-dom';
-import { renderHook } from '@testing-library/react';
-import {
-	__resetSearchParamsGetter,
-	__setSearchParamsGetterForTest,
-} from 'utils/getUnstableCurrentSearchParams';
-
-import { useCopySpanLink } from '../useCopySpanLink';
-
-const mockCopy = jest.fn();
-
-jest.mock('react-use', () => ({
-	__esModule: true,
-	useCopyToClipboard: (): [unknown, jest.Mock] => [null, mockCopy],
-}));
-
-jest.mock('@signozhq/ui/sonner', () => ({
-	toast: { success: jest.fn() },
-}));
-
-// The router only knows the stale URL; nuqs has since written ?tab=thread.
-const wrapper = ({ children }: { children: ReactNode }): JSX.Element => (
-	<MemoryRouter initialEntries={['/trace/abc?tab=overview&spanId=old']}>
-		{children}
-	</MemoryRouter>
-);
-
-const clickEvent = {
-	preventDefault: jest.fn(),
-	stopPropagation: jest.fn(),
-} as unknown as MouseEvent<HTMLElement>;
-
-describe('useCopySpanLink', () => {
-	beforeEach(() => {
-		mockCopy.mockClear();
-		__setSearchParamsGetterForTest(
-			() => new URLSearchParams('tab=thread&spanId=old'),
-		);
-	});
-
-	afterEach(() => {
-		__resetSearchParamsGetter();
-	});
-
-	it('builds the link from the live URL, keeping its tab', () => {
-		const { result } = renderHook(() => useCopySpanLink({ span_id: 'new' }), {
-			wrapper,
-		});
-
-		result.current.onSpanCopy(clickEvent);
-
-		const link = new URL(mockCopy.mock.calls[0][0]);
-		expect(link.pathname).toBe('/trace/abc');
-		expect(link.searchParams.get('tab')).toBe('thread');
-		expect(link.searchParams.get('spanId')).toBe('new');
-	});
-});

frontend/src/hooks/trace/useCopySpanLink.ts

@@ -2,8 +2,8 @@ import { MouseEventHandler, useCallback } from 'react';
 import { useLocation } from 'react-router-dom';
 import { useCopyToClipboard } from 'react-use';
 import { toast } from '@signozhq/ui/sonner';
+import useUrlQuery from 'hooks/useUrlQuery';
 import { getAbsoluteUrl } from 'utils/basePath';
-import { getUnstableCurrentSearchParams } from 'utils/getUnstableCurrentSearchParams';
 
 // Accepts both V2 (spanId) and V3 (span_id) span shapes
 // TODO: Remove V2 (spanId) support when phasing out V2
@@ -15,6 +15,7 @@ interface SpanLike {
 export const useCopySpanLink = (
 	span?: SpanLike,
 ): { onSpanCopy: MouseEventHandler<HTMLElement> } => {
+	const urlQuery = useUrlQuery();
 	const { pathname } = useLocation();
 	const [, setCopy] = useCopyToClipboard();
 
@@ -27,22 +28,21 @@ export const useCopySpanLink = (
 			event.preventDefault();
 			event.stopPropagation();
 
-			const params = getUnstableCurrentSearchParams();
-			params.delete('spanId');
+			urlQuery.delete('spanId');
 
 			const id = span.span_id || span.spanId;
 			if (id) {
-				params.set('spanId', id);
+				urlQuery.set('spanId', id);
 			}
 
-			const link = getAbsoluteUrl(`${pathname}?${params.toString()}`);
+			const link = getAbsoluteUrl(`${pathname}?${urlQuery.toString()}`);
 
 			setCopy(link);
 			toast.success('Copied to clipboard', {
 				position: 'top-right',
 			});
 		},
-		[span, pathname, setCopy],
+		[span, urlQuery, pathname, setCopy],
 	);
 
 	return {

frontend/src/lib/authz/hooks/useAuthZ/permissions.type.ts

@@ -23,11 +23,6 @@ export default {
 				type: 'metaresource',
 				allowedVerbs: ['list', 'read', 'update'],
 			},
-			{
-				kind: 'saved-view',
-				type: 'metaresource',
-				allowedVerbs: ['create', 'delete', 'list', 'read', 'update'],
-			},
 			{
 				kind: 'subscription',
 				type: 'metaresource',

frontend/src/lib/authz/hooks/useAuthZ/permissions/saved-view.permissions.ts

@@ -1,15 +0,0 @@
-import type { BrandedPermission } from '../types';
-import { buildPermission } from '../utils';
-
-export const SavedViewListPermission = buildPermission('list', 'saved-view:*');
-export const SavedViewCreatePermission = buildPermission(
-	'create',
-	'saved-view:*',
-);
-
-export const buildSavedViewReadPermission = (id: string): BrandedPermission =>
-	buildPermission('read', `saved-view:${id}`);
-export const buildSavedViewUpdatePermission = (id: string): BrandedPermission =>
-	buildPermission('update', `saved-view:${id}`);
-export const buildSavedViewDeletePermission = (id: string): BrandedPermission =>
-	buildPermission('delete', `saved-view:${id}`);

frontend/src/lib/logs/generateFilterQuery.ts

@@ -0,0 +1,24 @@
+import { QueryOperatorsMultiVal } from 'lib/logql/tokens';
+
+type Keys = keyof typeof QueryOperatorsMultiVal;
+type Values = (typeof QueryOperatorsMultiVal)[Keys];
+
+interface GenerateFilterQueryParams {
+	fieldKey: string;
+	fieldValue: string;
+	type: Values;
+}
+export const generateFilterQuery = ({
+	fieldKey,
+	fieldValue,
+	type,
+}: GenerateFilterQueryParams): string => {
+	let generatedQueryString = `${fieldKey} ${type} `;
+	if (typeof fieldValue === 'number') {
+		generatedQueryString += `(${fieldValue})`;
+	} else {
+		generatedQueryString += `('${fieldValue}')`;
+	}
+
+	return generatedQueryString;
+};

frontend/src/lib/newQueryBuilder/__test__/convertNewDataToOld.test.ts

@@ -1,42 +0,0 @@
-import { MetricRangePayloadV3 } from 'types/api/metrics/getQueryRange';
-
-import { convertNewDataToOld } from '../convertNewDataToOld';
-
-describe('convertNewDataToOld', () => {
-	it('carries partial values as epoch-second partialTimestamps', () => {
-		const payload = {
-			data: {
-				resultType: 'time_series',
-				result: [
-					{
-						queryName: 'A',
-						series: [
-							{
-								labels: {},
-								labelsArray: [],
-								values: [
-									{ timestamp: 1_000_000, value: '1' },
-									{ timestamp: 1_060_000, value: '0.2', partial: true },
-								],
-							},
-							{
-								labels: {},
-								labelsArray: [],
-								values: [{ timestamp: 1_000_000, value: '1' }],
-							},
-						],
-					},
-				],
-			},
-		} as unknown as MetricRangePayloadV3;
-
-		const [partial, complete] = convertNewDataToOld(payload).data.result;
-
-		expect(partial.values).toStrictEqual([
-			[1000, '1'],
-			[1060, '0.2'],
-		]);
-		expect(partial.partialTimestamps).toStrictEqual([1060]);
-		expect(complete).not.toHaveProperty('partialTimestamps');
-	});
-});

frontend/src/lib/newQueryBuilder/convertNewDataToOld.ts

@@ -25,16 +25,11 @@ export const convertNewDataToOld = (
 					return [...acc, renderValues];
 				}, []);
 
-				const partialTimestamps = series.values
-					.filter((value) => value.partial)
-					.map((value) => value.timestamp / 1000);
-
 				const result: QueryData = {
 					metric: series.labels,
 					values,
 					queryName: `${item.queryName}`,
 					metaData: series.metaData,
-					...(partialTimestamps.length ? { partialTimestamps } : {}),
 				};
 
 				oldResult.push(result);

frontend/src/lib/uPlotV2/components/Tooltip/__tests__/Tooltip.test.tsx

@@ -122,27 +122,6 @@ describe('Tooltip', () => {
 		expect(screen.getByText(expectedTitle)).toBeInTheDocument();
 	});
 
-	it('marks the header partial when a visible series has a partial bucket at the cursor', () => {
-		const withSeries = (series: unknown[]): uPlot =>
-			Object.assign(createUPlotInstance(0), { series });
-		const partial = { show: true, partialTimestamps: new Set([1]) };
-
-		const { unmount } = renderTooltip({
-			uPlotInstance: withSeries([{}, partial]),
-		});
-		expect(screen.getByTestId('uplot-tooltip-header-partial')).toHaveTextContent(
-			'(partial)',
-		);
-		unmount();
-
-		renderTooltip({
-			uPlotInstance: withSeries([{}, { ...partial, show: false }]),
-		});
-		expect(
-			screen.queryByTestId('uplot-tooltip-header-partial'),
-		).not.toBeInTheDocument();
-	});
-
 	it('drops the date from the header title for a point on the current day', () => {
 		const todayTimestamp = dayjs().tz('UTC').startOf('hour').unix();
 		const uPlotInstance = createUPlotInstance(0, todayTimestamp);

frontend/src/lib/uPlotV2/components/Tooltip/components/TooltipHeader/TooltipHeader.module.scss

@@ -13,17 +13,6 @@
 	gap: var(--spacing-2);
 }
 
-.headerEnd {
-	display: flex;
-	align-items: center;
-	gap: var(--spacing-2);
-}
-
-.partialLabel {
-	font-style: italic;
-	opacity: 0.7;
-}
-
 .pinnedItem {
 	padding: var(--spacing-4);
 }

frontend/src/lib/uPlotV2/components/Tooltip/components/TooltipHeader/TooltipHeader.tsx

@@ -5,7 +5,6 @@ import { useTimezone } from 'providers/Timezone';
 import type uPlot from 'uplot';
 import { formatTimestampOmittingTodaysDate } from 'utils/timeUtils';
 
-import type { ExtendedSeries } from '../../../../config/types';
 import { TooltipContentItem } from '../../../types';
 import TooltipItem from '../TooltipItem/TooltipItem';
 import TooltipPinnedBadge from '../TooltipPinnedBadge/TooltipPinnedBadge';
@@ -35,7 +34,7 @@ export default function TooltipHeader({
 	const { timezone: userTimezone } = useTimezone();
 	const resolvedTimezone = timezone?.value ?? userTimezone.value;
 
-	const header = useMemo(() => {
+	const headerTitle = useMemo(() => {
 		if (!showTooltipHeader) {
 			return null;
 		}
@@ -47,21 +46,14 @@ export default function TooltipHeader({
 		if (timestamp == null) {
 			return null;
 		}
-		return {
-			title: formatTimestampOmittingTodaysDate(
-				timestamp * 1000,
-				resolvedTimezone,
-				dateFormat,
-			),
-			isPartial: (uPlotInstance.series ?? []).some(
-				(series: ExtendedSeries) =>
-					series.show && series.partialTimestamps?.has(timestamp),
-			),
-		};
+		return formatTimestampOmittingTodaysDate(
+			timestamp * 1000,
+			resolvedTimezone,
+			dateFormat,
+		);
 	}, [
 		resolvedTimezone,
 		uPlotInstance.data,
-		uPlotInstance.series,
 		uPlotInstance.cursor.idx,
 		showTooltipHeader,
 		dateFormat,
@@ -72,22 +64,10 @@ export default function TooltipHeader({
 			className={Styles.headerContainer}
 			data-testid="uplot-tooltip-header-container"
 		>
-			{showTooltipHeader && header && (
+			{showTooltipHeader && headerTitle && (
 				<div className={cx(Styles.headerRow, headerRowClassName)}>
-					<span>{header.title}</span>
-					{(header.isPartial || isPinned) && (
-						<span className={Styles.headerEnd}>
-							{header.isPartial && (
-								<span
-									className={Styles.partialLabel}
-									data-testid="uplot-tooltip-header-partial"
-								>
-									(partial)
-								</span>
-							)}
-							{isPinned && <TooltipPinnedBadge />}
-						</span>
-					)}
+					<span>{headerTitle}</span>
+					{isPinned && <TooltipPinnedBadge />}
 				</div>
 			)}
 

frontend/src/lib/uPlotV2/config/UPlotConfigBuilder.ts

@@ -1,6 +1,5 @@
 import { SeriesVisibilityItem } from 'lib/visualization/panels/types';
 import { getStoredSeriesVisibility } from 'lib/visualization/panels/utils/legendVisibilityUtils';
-import { partialPointsDrawHook } from 'lib/uPlotV2/hooks/partialPointsDrawHook';
 import { ThresholdsDrawHookOptions } from 'lib/uPlotV2/hooks/types';
 import { thresholdsDrawHook } from 'lib/uPlotV2/hooks/useThresholdsDrawHook';
 import { resolveSeriesVisibility } from 'lib/uPlotV2/utils/seriesVisibility';
@@ -82,8 +81,6 @@ export class UPlotConfigBuilder extends ConfigBuilder<
 
 	private thresholds: Record<string, ThresholdsDrawHookOptions> = {};
 
-	private hasPartialPointsHook = false;
-
 	private tzDate: ((timestamp: number) => Date) | undefined;
 
 	private id: string;
@@ -180,10 +177,6 @@ export class UPlotConfigBuilder extends ConfigBuilder<
 	 */
 	addSeries(props: SeriesProps): void {
 		this.series.push(new UPlotSeriesBuilder(props));
-		if (props.partialTimestamps?.size && !this.hasPartialPointsHook) {
-			this.hasPartialPointsHook = true;
-			this.addHook('draw', partialPointsDrawHook);
-		}
 	}
 
 	getSeriesSpanGapsOptions(): SeriesSpanGapsOption[] {

frontend/src/lib/uPlotV2/config/UPlotSeriesBuilder.ts

@@ -4,7 +4,6 @@ import { calculateWidthBasedOnStepInterval } from 'lib/uPlotV2/utils';
 import uPlot, { Series } from 'uplot';
 
 import { resolveFillOpacity, toAlphaHex } from '../utils/fillOpacity';
-import { reportBarRect } from '../utils/barRect';
 import { generateGradientFill } from '../utils/generateGradientFill';
 import { isolatedPointFilter } from '../utils/seriesPointsFilter';
 import {
@@ -219,14 +218,7 @@ export class UPlotSeriesBuilder extends ConfigBuilder<
 	}
 
 	getConfig(): ExtendedSeries {
-		const {
-			scaleKey,
-			label,
-			spanGaps,
-			show = true,
-			metric,
-			partialTimestamps,
-		} = this.props;
+		const { scaleKey, label, spanGaps, show = true, metric } = this.props;
 
 		const resolvedLineColor = this.getLineColor();
 
@@ -254,7 +246,6 @@ export class UPlotSeriesBuilder extends ConfigBuilder<
 			...pathConfig,
 			points: Object.keys(pointsConfig).length > 0 ? pointsConfig : undefined,
 			metric,
-			...(partialTimestamps?.size ? { partialTimestamps } : {}),
 		};
 	}
 }
@@ -367,7 +358,6 @@ function getBarPathBuilder({
 				builders[barsCfgKey] = barsPathBuilderFactory({
 					size: [barWidthFactor, effectiveBarMaxWidth],
 					align: barAlignment,
-					each: reportBarRect,
 				});
 			}
 
@@ -382,7 +372,6 @@ function getBarPathBuilder({
 		builders[barsCfgKey] = barsPathBuilderFactory({
 			size: [barWidthFactor, barMaxWidth],
 			align: barAlignment,
-			each: reportBarRect,
 		});
 	}
 

frontend/src/lib/uPlotV2/config/__tests__/UPlotConfigBuilder.test.ts

@@ -650,20 +650,4 @@ describe('UPlotConfigBuilder stacking', () => {
 
 		expect(builder.getConfig().bands).toStrictEqual([{ series: [1, 3] }]);
 	});
-
-	it('registers the partial points draw hook once, only for series with partial timestamps', () => {
-		const props: SeriesProps = {
-			scaleKey: 'y',
-			label: 'Requests',
-			colorMapping: {},
-			drawStyle: DrawStyle.Line,
-		};
-		const builder = new UPlotConfigBuilder({ id: 'partial' });
-		builder.addSeries(props);
-		expect(builder.getConfig().hooks?.draw ?? []).toHaveLength(0);
-
-		builder.addSeries({ ...props, partialTimestamps: new Set([40]) });
-		builder.addSeries({ ...props, partialTimestamps: new Set([40]) });
-		expect(builder.getConfig().hooks?.draw).toHaveLength(1);
-	});
 });

frontend/src/lib/uPlotV2/config/__tests__/UPlotSeriesBuilder.test.ts

@@ -1,7 +1,6 @@
 import { themeColors } from 'constants/theme';
 import uPlot from 'uplot';
 
-import { reportBarRect } from '../../utils/barRect';
 import { isolatedPointFilter } from '../../utils/seriesPointsFilter';
 import type { SeriesProps } from '../types';
 import { DrawStyle, FillMode, LineInterpolation, LineStyle } from '../types';
@@ -399,29 +398,4 @@ describe('UPlotSeriesBuilder', () => {
 
 		expect(builder.getConfig().fill).toBeUndefined();
 	});
-
-	it('exposes partial timestamps only when there are some', () => {
-		const partialTimestamps = new Set([40]);
-
-		expect(
-			new UPlotSeriesBuilder(createBaseProps({ partialTimestamps })).getConfig(),
-		).toHaveProperty('partialTimestamps', partialTimestamps);
-		expect(
-			new UPlotSeriesBuilder(
-				createBaseProps({ partialTimestamps: new Set() }),
-			).getConfig(),
-		).not.toHaveProperty('partialTimestamps');
-	});
-
-	it('reports bar rects from bar path builders', () => {
-		const config = new UPlotSeriesBuilder(
-			createBaseProps({ drawStyle: DrawStyle.Bar, barMaxWidth: 321 }),
-		).getConfig();
-
-		config.paths?.({} as uPlot, 1, 0, 1);
-
-		expect(uPlot.paths.bars).toHaveBeenCalledWith(
-			expect.objectContaining({ each: reportBarRect }),
-		);
-	});
 });

frontend/src/lib/uPlotV2/config/types.ts

@@ -201,7 +201,6 @@ export enum FillMode {
 
 export type ExtendedSeries = Series & {
 	metric?: { [key: string]: string };
-	partialTimestamps?: Set<number>;
 };
 
 export interface SeriesProps extends LineConfig, PointsConfig, BarConfig {
@@ -230,8 +229,6 @@ export interface SeriesProps extends LineConfig, PointsConfig, BarConfig {
 	isDarkMode?: boolean;
 	stepInterval?: number;
 	metric?: { [key: string]: string };
-	/** Epoch-second x values whose bucket doesn't cover a full step; marked with a dotted ring. */
-	partialTimestamps?: Set<number>;
 }
 
 export interface LegendItem {

frontend/src/lib/uPlotV2/hooks/__tests__/partialPointsDrawHook.test.ts

@@ -1,77 +0,0 @@
-import uPlot from 'uplot';
-
-import type { ExtendedSeries } from '../../config/types';
-import { reportBarRect } from '../../utils/barRect';
-import { partialPointsDrawHook } from '../partialPointsDrawHook';
-
-function createPlot(
-	series: Partial<ExtendedSeries>,
-	values: (number | null)[] = [1, 2, 3],
-): { u: uPlot; ctx: Record<string, jest.Mock> } {
-	const ctx = {
-		save: jest.fn(),
-		restore: jest.fn(),
-		beginPath: jest.fn(),
-		rect: jest.fn(),
-		clip: jest.fn(),
-		arc: jest.fn(),
-		fill: jest.fn(),
-		stroke: jest.fn(),
-		setLineDash: jest.fn(),
-		strokeRect: jest.fn(),
-	};
-	const xValues = [10, 20, 30];
-	const u = {
-		ctx,
-		bbox: { left: 0, top: 0, width: 100, height: 100 },
-		data: [xValues, values],
-		series: [{}, { show: true, stroke: 'red', points: { size: 4 }, ...series }],
-		valToIdx: (value: number): number => xValues.indexOf(value),
-		valToPos: (value: number): number => value,
-	} as unknown as uPlot;
-	return { u, ctx };
-}
-
-describe('partialPointsDrawHook', () => {
-	it('draws a dot and a dotted ring on each partial point', () => {
-		const { u, ctx } = createPlot({ partialTimestamps: new Set([30]) });
-
-		partialPointsDrawHook(u);
-
-		expect(ctx.arc).toHaveBeenCalledTimes(2);
-		expect(ctx.arc).toHaveBeenCalledWith(30, 3, 2, 0, 2 * Math.PI);
-		expect(ctx.arc).toHaveBeenCalledWith(30, 3, 5, 0, 2 * Math.PI);
-		expect(ctx.setLineDash).toHaveBeenCalledWith([2, 2]);
-		expect(ctx.restore).toHaveBeenCalled();
-	});
-
-	it('skips hidden series, null values and timestamps not in the data', () => {
-		const hidden = createPlot({ show: false, partialTimestamps: new Set([30]) });
-		const missing = createPlot({ partialTimestamps: new Set([30]) }, [
-			1,
-			2,
-			null,
-		]);
-		const unknown = createPlot({ partialTimestamps: new Set([40]) });
-
-		[hidden, missing, unknown].forEach(({ u, ctx }) => {
-			partialPointsDrawHook(u);
-			expect(ctx.arc).not.toHaveBeenCalled();
-		});
-	});
-
-	it('draws a dotted outline around a partial bar', () => {
-		const { u, ctx } = createPlot({
-			partialTimestamps: new Set([30]),
-			paths: (plot, seriesIdx, idx) => {
-				reportBarRect(plot, seriesIdx, idx, 10, 20, 8, 30);
-				return null;
-			},
-		});
-
-		partialPointsDrawHook(u);
-
-		expect(ctx.strokeRect).toHaveBeenCalledWith(7, 17, 14, 36);
-		expect(ctx.arc).not.toHaveBeenCalled();
-	});
-});

frontend/src/lib/uPlotV2/hooks/partialPointsDrawHook.ts

@@ -1,89 +0,0 @@
-import uPlot from 'uplot';
-
-import { ExtendedSeries } from '../config/types';
-import { BarRect, measureBar } from '../utils/barRect';
-
-const DEFAULT_POINT_SIZE = 5;
-const RING_GAP = 3;
-const RING_WIDTH = 1.5;
-const RING_DASH = [2, 2];
-
-function drawRing(
-	u: uPlot,
-	series: ExtendedSeries,
-	idx: number,
-	value: number,
-): void {
-	const { ctx } = u;
-	const { pxRatio } = uPlot;
-	const cx = u.valToPos(u.data[0][idx], 'x', true);
-	const cy = u.valToPos(value, series.scale ?? 'y', true);
-	const radius = ((series.points?.size ?? DEFAULT_POINT_SIZE) / 2) * pxRatio;
-
-	ctx.beginPath();
-	ctx.arc(cx, cy, radius, 0, 2 * Math.PI);
-	ctx.fill();
-
-	ctx.lineWidth = RING_WIDTH * pxRatio;
-	ctx.setLineDash(RING_DASH.map((segment) => segment * pxRatio));
-	ctx.beginPath();
-	ctx.arc(cx, cy, radius + RING_GAP * pxRatio, 0, 2 * Math.PI);
-	ctx.stroke();
-}
-
-function drawBarOutline(u: uPlot, rect: BarRect): void {
-	const gap = RING_GAP * uPlot.pxRatio;
-	u.ctx.lineWidth = RING_WIDTH * uPlot.pxRatio;
-	u.ctx.setLineDash(RING_DASH.map((segment) => segment * uPlot.pxRatio));
-	u.ctx.strokeRect(
-		rect.left - gap,
-		rect.top - gap,
-		rect.width + 2 * gap,
-		rect.height + 2 * gap,
-	);
-}
-
-/**
- * Marks each series' partial buckets: a dotted outline around bars, a dot and dotted
- * ring on line and point series.
- */
-export function partialPointsDrawHook(u: uPlot): void {
-	const { ctx, bbox } = u;
-	const xValues = u.data[0];
-
-	ctx.save();
-	ctx.beginPath();
-	ctx.rect(bbox.left, bbox.top, bbox.width, bbox.height);
-	ctx.clip();
-
-	for (let seriesIdx = 1; seriesIdx < u.series.length; seriesIdx += 1) {
-		const series = u.series[seriesIdx] as ExtendedSeries;
-		if (!series.show || !series.partialTimestamps) {
-			continue;
-		}
-		const color =
-			typeof series.stroke === 'function'
-				? series.stroke(u, seriesIdx)
-				: (series.stroke ?? '');
-		ctx.fillStyle = color;
-		ctx.strokeStyle = color;
-		ctx.globalAlpha = series.alpha ?? 1;
-
-		series.partialTimestamps.forEach((timestamp) => {
-			const idx = u.valToIdx(timestamp);
-			const value = u.data[seriesIdx][idx];
-			if (xValues[idx] !== timestamp || value == null) {
-				return;
-			}
-			ctx.setLineDash([]);
-			const bar = measureBar(u, seriesIdx, idx);
-			if (bar) {
-				drawBarOutline(u, bar);
-			} else {
-				drawRing(u, series, idx, value);
-			}
-		});
-	}
-
-	ctx.restore();
-}

frontend/src/lib/uPlotV2/utils/__tests__/barRect.test.ts

@@ -1,30 +0,0 @@
-import type uPlot from 'uplot';
-
-import { measureBar, reportBarRect } from '../barRect';
-
-function plotWithPaths(paths?: uPlot.Series['paths']): uPlot {
-	return { series: [{}, { paths }] } as unknown as uPlot;
-}
-
-describe('measureBar', () => {
-	it('returns the rect the bar paths report for that index', () => {
-		const paths = jest.fn((u: uPlot, seriesIdx: number, idx: number) => {
-			reportBarRect(u, seriesIdx, idx, 10, 20, 8, 30);
-			return null;
-		});
-		const u = plotWithPaths(paths);
-
-		expect(measureBar(u, 1, 4)).toStrictEqual({
-			left: 10,
-			top: 20,
-			width: 8,
-			height: 30,
-		});
-		expect(paths).toHaveBeenCalledWith(u, 1, 4, 4);
-	});
-
-	it('returns null for series whose paths report no bar', () => {
-		expect(measureBar(plotWithPaths(jest.fn(() => null)), 1, 0)).toBeNull();
-		expect(measureBar(plotWithPaths(), 1, 0)).toBeNull();
-	});
-});

frontend/src/lib/uPlotV2/utils/barRect.ts

@@ -1,45 +0,0 @@
-import type uPlot from 'uplot';
-
-export interface BarRect {
-	left: number;
-	top: number;
-	width: number;
-	height: number;
-}
-
-let onBarRect: ((rect: BarRect) => void) | null = null;
-
-/** `each` callback for bar path builders; reports bar rects while {@link measureBar} runs. */
-// eslint-disable-next-line max-params
-export function reportBarRect(
-	_u: uPlot,
-	_seriesIdx: number,
-	_idx: number,
-	left: number,
-	top: number,
-	width: number,
-	height: number,
-): void {
-	onBarRect?.({ left, top, width, height });
-}
-
-/**
- * Canvas rect of one bar, from re-running the series' paths for that index.
- * `null` for series not drawn as bars.
- */
-export function measureBar(
-	u: uPlot,
-	seriesIdx: number,
-	idx: number,
-): BarRect | null {
-	let rect: BarRect | null = null;
-	onBarRect = (measured): void => {
-		rect = measured;
-	};
-	try {
-		u.series[seriesIdx].paths?.(u, seriesIdx, idx, idx);
-	} finally {
-		onBarRect = null;
-	}
-	return rect;
-}

frontend/src/pages/AlertDetails/AlertDetails.tsx

@@ -10,11 +10,13 @@ import Spinner from 'components/Spinner';
 import { QueryParams } from 'constants/query';
 import ROUTES from 'constants/routes';
 import { CreateAlertProvider } from 'container/CreateAlertV2/context';
-import { getCreateAlertLocalStateFromAlertDef } from 'container/CreateAlertV2/utils';
+import {
+	getAlertTypeFromAlertDef,
+	getCreateAlertLocalStateFromAlertDef,
+} from 'container/CreateAlertV2/utils';
 import useUrlQuery from 'hooks/useUrlQuery';
 import history from 'lib/history';
 import { useAlertRule } from 'providers/Alert';
-import { AlertTypes } from 'types/api/alerts/alertTypes';
 import { NEW_ALERT_SCHEMA_VERSION } from 'types/api/alerts/alertTypesV2';
 import { fromRuleDTOToPostableRuleV2 } from 'types/api/alerts/convert';
 
@@ -74,7 +76,7 @@ function AlertDetails(): JSX.Element {
 
 	const handleTabChange = (route: string): void => {
 		if (route === ROUTES.ALERT_HISTORY) {
-			logEvent('Alert History tab: Visited', { ruleId });
+			void logEvent('Alert History tab: Visited', { ruleId });
 		}
 	};
 
@@ -89,7 +91,7 @@ function AlertDetails(): JSX.Element {
 		<CreateAlertProvider
 			ruleId={ruleId || ''}
 			isEditMode
-			initialAlertType={alertRuleDetails?.alertType as AlertTypes}
+			initialAlertType={getAlertTypeFromAlertDef(alertRuleDetails)}
 			initialAlertState={initialAlertState}
 		>
 			<div

frontend/src/pages/DashboardPage/DashboardContainer/Panels/kinds/AreaChartPanel/utils/buildConfig.ts

@@ -15,7 +15,6 @@ import {
 import { resolveSeriesLabelV5 } from 'pages/DashboardPage/DashboardContainer/Panels/utils/resolveSeriesLabel';
 import type { PanelSeries } from 'pages/DashboardPage/DashboardContainer/queryV5/types';
 import {
-	getPartialTimestamps,
 	hasSingleVisiblePoint,
 	toClickPluginPayload,
 } from 'pages/DashboardPage/DashboardContainer/queryV5/uplotData';
@@ -156,7 +155,6 @@ function addSeries({
 			fillOpacity,
 			isDarkMode,
 			metric: s.labels,
-			partialTimestamps: getPartialTimestamps(s.values),
 		});
 	});
 }

frontend/src/pages/DashboardPage/DashboardContainer/Panels/kinds/BarChartPanel/utils/__tests__/buildConfig.test.ts

@@ -1,34 +0,0 @@
-import type { DashboardtypesBarChartPanelSpecDTO } from 'api/generated/services/sigNoz.schemas';
-import { UTC_TIMEZONE } from 'components/CustomTimePicker/timezoneUtils';
-import type { ExtendedSeries } from 'lib/uPlotV2/config/types';
-import { PanelMode } from 'lib/visualization/panels/types';
-
-import { buildBarChartConfig } from '../buildConfig';
-
-describe('buildBarChartConfig partial buckets', () => {
-	it('passes partial timestamps (epoch seconds) to the series', () => {
-		const config = buildBarChartConfig({
-			panelId: 'p1',
-			spec: {} as DashboardtypesBarChartPanelSpecDTO,
-			builderQueries: [],
-			series: [
-				{
-					queryName: 'A',
-					legend: 'A',
-					labels: {},
-					values: [
-						{ timestamp: 1000, value: 1 },
-						{ timestamp: 61000, value: 0.2, partial: true },
-					],
-					kind: 'series',
-					aggregation: { index: 0, alias: 'A' },
-				},
-			],
-			isDarkMode: false,
-			timezone: UTC_TIMEZONE,
-			panelMode: PanelMode.DASHBOARD_VIEW,
-		}).getConfig().series?.[1] as ExtendedSeries;
-
-		expect(config.partialTimestamps).toStrictEqual(new Set([61]));
-	});
-});