chore(tests): split alerts test suite as per domain boundaries (#12983)

<!--A few plain bullets saying what changed and why, for a reviewer
skimming it - not a wall of text, not a restatement of the diff, not
generated boilerplate.-->
#### Description
Segregated alert-related test suite in to alert manager and ruler as per
their domain boundaries.

---------

Co-authored-by: Praneeth Lingam <praneethlingam@Ollys-MacBook-Pro.local>

.github/workflows/integrationci.yaml

@@ -38,7 +38,6 @@ jobs:
       fail-fast: false
       matrix:
         suite:
-          - alerts
           - alertmanager
           - alertmanagerrotation
           - basepath
@@ -64,6 +63,7 @@ jobs:
           - querierauthz
           - role
           - rootuser
+          - ruler
           - savedview
           - semconvfamilies
           - serviceaccount

docs/contributing/go/handler.md

@@ -179,6 +179,7 @@ The `handler.New` function ties the HTTP handler to OpenAPI metadata via `OpenAP
 - **SuccessStatusCode**: The HTTP status for successful responses (for example, `http.StatusOK`, `http.StatusCreated`, `http.StatusNoContent`).
 - **ErrorStatusCodes**: Additional error status codes beyond the standard ones automatically added by `handler.New`.
 - **SecuritySchemes**: Auth mechanisms and scopes required by the operation.
+- **Stability**: Maturity marker (`handler.StabilityDevelopment`, `handler.StabilityAlpha`, `handler.StabilityBeta`, `handler.StabilityStable`, the OpenTelemetry Collector levels) emitted as the `x-signoz-stability` extension on every operation. Unset is emitted as `alpha`.
 
 The generic handler:
 

ee/sqlstore/postgressqlstore/formatter.go

@@ -23,6 +23,15 @@ func (f *formatter) JSONExtractString(column, path string) []byte {
 	return append(f.TextToJsonColumn(column), ops...)
 }
 
+func (f *formatter) JSONExtractMapValue(column, mapField, key string) []byte {
+	sql := f.TextToJsonColumn(column)
+	sql = append(sql, "->"...)
+	sql = schema.Append(f.bunf, sql, mapField)
+	sql = append(sql, "->>"...)
+	sql = schema.Append(f.bunf, sql, key)
+	return sql
+}
+
 func (f *formatter) JSONType(column, path string) []byte {
 	var sql []byte
 	sql = append(sql, "jsonb_typeof("...)

ee/sqlstore/postgressqlstore/formatter_test.go

@@ -55,6 +55,67 @@ func TestJSONExtractString(t *testing.T) {
 	}
 }
 
+func TestJSONExtractMapValue(t *testing.T) {
+	tests := []struct {
+		name     string
+		column   string
+		mapField string
+		key      string
+		expected string
+	}{
+		{
+			name:     "PlainKey",
+			column:   "data",
+			mapField: "labels",
+			key:      "team",
+			expected: `"data"::jsonb->'labels'->>'team'`,
+		},
+		{
+			name:     "DottedKey_OneMapEntry",
+			column:   "data",
+			mapField: "labels",
+			key:      "k8s.cluster",
+			expected: `"data"::jsonb->'labels'->>'k8s.cluster'`,
+		},
+		{
+			name:     "SingleQuoteInKey_Doubled",
+			column:   "data",
+			mapField: "labels",
+			key:      "o'brien",
+			expected: `"data"::jsonb->'labels'->>'o''brien'`,
+		},
+		{
+			name:     "BackslashInKey_Literal",
+			column:   "data",
+			mapField: "labels",
+			key:      `a\b`,
+			expected: `"data"::jsonb->'labels'->>'a\b'`,
+		},
+		{
+			name:     "DoubleQuoteInKey_Literal",
+			column:   "data",
+			mapField: "labels",
+			key:      `a"b`,
+			expected: `"data"::jsonb->'labels'->>'a"b'`,
+		},
+		{
+			name:     "QualifiedColumn",
+			column:   "rule.data",
+			mapField: "labels",
+			key:      "severity",
+			expected: `"rule"."data"::jsonb->'labels'->>'severity'`,
+		},
+	}
+
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			f := newFormatter(pgdialect.New())
+			got := string(f.JSONExtractMapValue(tt.column, tt.mapField, tt.key))
+			assert.Equal(t, tt.expected, got)
+		})
+	}
+}
+
 func TestJSONType(t *testing.T) {
 	tests := []struct {
 		name     string

frontend/src/AppRoutes/index.tsx

@@ -12,14 +12,13 @@ import { CmdKPalette } from 'components/cmdKPalette/cmdKPalette';
 import NotFound from 'components/NotFound';
 import { ShiftHoldOverlayController } from 'components/ShiftOverlay/ShiftHoldOverlayController';
 import Spinner from 'components/Spinner';
+import { FeatureKeys } from 'constants/features';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import ROUTES from 'constants/routes';
 import AppLayout from 'container/AppLayout';
 import Hex from 'crypto-js/enc-hex';
 import HmacSHA256 from 'crypto-js/hmac-sha256';
 import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
-import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
 import { StatusCodes } from 'http-status-codes';
@@ -59,6 +58,7 @@ function App(): JSX.Element {
 		isFetchingActiveLicense,
 		activeLicenseFetchError,
 		userFetchError,
+		featureFlagsFetchError,
 		isLoggedIn: isLoggedInState,
 		featureFlags,
 		org,
@@ -66,8 +66,6 @@ function App(): JSX.Element {
 	} = useAppContext();
 	const [routes, setRoutes] = useState<AppRoutes[]>(defaultRoutes);
 	const isAIAssistantEnabled = useIsAIAssistantEnabled();
-	const isSavedViewEnabled = useSavedViewEnabled();
-	const chatSupport = useChatSupport();
 
 	const { hostname } = window.location;
 	const [pathname, setPathname] = useState(history.location.pathname);
@@ -255,9 +253,7 @@ function App(): JSX.Element {
 	}, [isDarkMode]);
 
 	useEffect(() => {
-		// The bottom strip carries Support, so the floating bubble goes entirely.
 		if (
-			isSavedViewEnabled ||
 			pathname === ROUTES.ONBOARDING ||
 			pathname.startsWith('/public/dashboard/') ||
 			pathname === '/ai-assistant' ||
@@ -267,32 +263,71 @@ function App(): JSX.Element {
 		} else {
 			window.Pylon?.('showChatBubble');
 		}
-	}, [pathname, isSavedViewEnabled]);
+	}, [pathname]);
 
-	// Identity for the Pylon widget. Whether this user gets Pylon at all is
-	// `useChatSupport`'s call — this only fills in who they are.
+	// eslint-disable-next-line sonarjs/cognitive-complexity
 	useEffect(() => {
-		if (chatSupport !== ChatSupportState.Pylon) {
-			return;
+		// feature flag shouldn't be loading and featureFlags or fetchError any one of this should be true indicating that req is complete
+		// licenses should also be present. there is no check for licenses for loading and error as that is mandatory if not present then routing
+		// to something went wrong which would ideally need a reload.
+		if (
+			!isFetchingFeatureFlags &&
+			(featureFlags || featureFlagsFetchError) &&
+			activeLicense &&
+			trialInfo
+		) {
+			let isChatSupportEnabled = false;
+			let isPremiumSupportEnabled = false;
+			if (featureFlags && featureFlags.length > 0) {
+				isChatSupportEnabled =
+					featureFlags.find((flag) => flag.name === FeatureKeys.CHAT_SUPPORT)
+						?.active || false;
+
+				isPremiumSupportEnabled =
+					featureFlags.find((flag) => flag.name === FeatureKeys.PREMIUM_SUPPORT)
+						?.active || false;
+			}
+			const showAddCreditCardModal =
+				!isPremiumSupportEnabled && !trialInfo?.trialConvertedToSubscription;
+
+			if (
+				isLoggedInState &&
+				isChatSupportEnabled &&
+				!showAddCreditCardModal &&
+				(isCloudUser || isEnterpriseSelfHostedUser) &&
+				window.signozBootData?.settings?.pylon?.enabled
+			) {
+				const email = user.email || '';
+				const secret = window.signozBootData?.settings?.pylon?.identitySecret || '';
+				let emailHash = '';
+
+				if (email && secret) {
+					emailHash = HmacSHA256(email, Hex.parse(secret)).toString(Hex);
+				}
+
+				window.pylon = {
+					chat_settings: {
+						app_id: window.signozBootData?.settings?.pylon?.appId,
+						email: user.email,
+						name: user.displayName || user.email,
+						email_hash: emailHash,
+					},
+				};
+			}
 		}
-
-		const email = user.email || '';
-		const secret = window.signozBootData?.settings?.pylon?.identitySecret || '';
-		let emailHash = '';
-
-		if (email && secret) {
-			emailHash = HmacSHA256(email, Hex.parse(secret)).toString(Hex);
-		}
-
-		window.pylon = {
-			chat_settings: {
-				app_id: window.signozBootData?.settings?.pylon?.appId,
-				email: user.email,
-				name: user.displayName || user.email,
-				email_hash: emailHash,
-			},
-		};
-	}, [chatSupport, user]);
+	}, [
+		isLoggedInState,
+		user,
+		pathname,
+		trialInfo?.trialConvertedToSubscription,
+		featureFlags,
+		isFetchingFeatureFlags,
+		featureFlagsFetchError,
+		activeLicense,
+		trialInfo,
+		isCloudUser,
+		isEnterpriseSelfHostedUser,
+	]);
 
 	useEffect(() => {
 		if (!isFetchingUser && isCloudUser && user && user.email) {

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

@@ -41,6 +41,8 @@ import type {
 	GetRuleHistoryTopContributorsParams,
 	GetRuleHistoryTopContributorsPathParameters,
 	ListRules200,
+	ListRulesV3200,
+	ListRulesV3Params,
 	PatchRuleByID200,
 	PatchRuleByIDPathParameters,
 	RenderErrorResponseDTO,
@@ -73,7 +75,8 @@ const withQueryKey = <T extends object, K>(
 };
 
 /**
- * This endpoint lists all alert rules with their current evaluation state
+ * This endpoint lists all alert rules with their current evaluation state. Deprecated: use ListRulesV3, which supports filtering, sorting and pagination.
+ * @deprecated
  * @summary List alert rules
  */
 export const listRules = (signal?: AbortSignal) => {
@@ -115,6 +118,7 @@ export type ListRulesQueryResult = NonNullable<
 export type ListRulesQueryError = ErrorType<RenderErrorResponseDTO>;
 
 /**
+ * @deprecated
  * @summary List alert rules
  */
 
@@ -134,6 +138,7 @@ export function useListRules<
 }
 
 /**
+ * @deprecated
  * @summary List alert rules
  */
 export const invalidateListRules = async (
@@ -1388,3 +1393,97 @@ export const useTestRule = <
 > => {
 	return useMutation(getTestRuleMutationOptions(options));
 };
+/**
+ * Returns a page of alert rules with their current evaluation state, trimmed to the fields the list page renders. Supports a filter DSL (`query`), a repeated `states` filter applied after the state overlay, sort (`updated_at`/`created_at`/`name`/`state`/`severity`), order (`asc`/`desc`), and offset-based pagination (`limit`/`offset`). In the filter DSL, a non-reserved key is matched as a rule label directly (`team = infra`); a key that collides with a reserved keyword matches either interpretation (negative operators exclude both), and `labels.<key>` targets only the label. The response also carries the org's label pairs and the reserved filter keys for building filter suggestions.
+ * @summary List alert rules (v3)
+ */
+export const listRulesV3 = (
+	params?: ListRulesV3Params,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<ListRulesV3200>({
+		url: `/api/v3/rules`,
+		method: 'GET',
+		params,
+		signal,
+	});
+};
+
+export const getListRulesV3QueryKey = (params?: ListRulesV3Params) => {
+	return [`/api/v3/rules`, ...(params ? [params] : [])] as const;
+};
+
+export const getListRulesV3QueryOptions = <
+	TData = Awaited<ReturnType<typeof listRulesV3>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListRulesV3Params,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listRulesV3>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey = queryOptions?.queryKey ?? getListRulesV3QueryKey(params);
+
+	const queryFn: QueryFunction<Awaited<ReturnType<typeof listRulesV3>>> = ({
+		signal,
+	}) => listRulesV3(params, signal);
+
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
+		Awaited<ReturnType<typeof listRulesV3>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type ListRulesV3QueryResult = NonNullable<
+	Awaited<ReturnType<typeof listRulesV3>>
+>;
+export type ListRulesV3QueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary List alert rules (v3)
+ */
+
+export function useListRulesV3<
+	TData = Awaited<ReturnType<typeof listRulesV3>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListRulesV3Params,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listRulesV3>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getListRulesV3QueryOptions(params, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	return withQueryKey(query, queryOptions.queryKey);
+}
+
+/**
+ * @summary List alert rules (v3)
+ */
+export const invalidateListRulesV3 = async (
+	queryClient: QueryClient,
+	params?: ListRulesV3Params,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getListRulesV3QueryKey(params) },
+		options,
+	);
+
+	return queryClient;
+};

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

@@ -10188,6 +10188,99 @@ export interface RuletypesGettableTestRuleDTO {
 	message?: string;
 }
 
+export interface RuletypesLabelPairDTO {
+	/**
+	 * @type string
+	 */
+	key: string;
+	/**
+	 * @type string
+	 */
+	value: string;
+}
+
+export enum RuletypesListOrderDTO {
+	asc = 'asc',
+	desc = 'desc',
+}
+export enum RuletypesListSortDTO {
+	updated_at = 'updated_at',
+	created_at = 'created_at',
+	name = 'name',
+	state = 'state',
+	severity = 'severity',
+}
+export type RuletypesListableRuleDTOLabels = { [key: string]: string };
+
+export enum RuletypesRuleTypeDTO {
+	threshold_rule = 'threshold_rule',
+	promql_rule = 'promql_rule',
+	anomaly_rule = 'anomaly_rule',
+}
+export interface RuletypesListableRuleDTO {
+	/**
+	 * @type string
+	 */
+	alert: string;
+	alertType: RuletypesAlertTypeDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	createdAt?: string;
+	/**
+	 * @type string
+	 */
+	createdBy?: string;
+	/**
+	 * @type string
+	 */
+	description?: string;
+	/**
+	 * @type boolean
+	 */
+	disabled?: boolean;
+	/**
+	 * @type string
+	 */
+	id: string;
+	/**
+	 * @type object
+	 */
+	labels?: RuletypesListableRuleDTOLabels;
+	ruleType: RuletypesRuleTypeDTO;
+	state: RuletypesAlertStateDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	updatedAt?: string;
+	/**
+	 * @type string
+	 */
+	updatedBy?: string;
+}
+
+export interface RuletypesListableRulesDTO {
+	/**
+	 * @type array
+	 */
+	labels: RuletypesLabelPairDTO[];
+	/**
+	 * @type array
+	 */
+	reservedKeywords: string[];
+	/**
+	 * @type array
+	 */
+	rules: RuletypesListableRuleDTO[];
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	total: number;
+}
+
 export interface RuletypesRenotifyDTO {
 	/**
 	 * @type array,null
@@ -10284,11 +10377,6 @@ export interface RuletypesRuleConditionDTO {
 	thresholds?: RuletypesRuleThresholdDataDTO;
 }
 
-export enum RuletypesRuleTypeDTO {
-	threshold_rule = 'threshold_rule',
-	promql_rule = 'promql_rule',
-	anomaly_rule = 'anomaly_rule',
-}
 export interface RuletypesPostableRuleDTO {
 	/**
 	 * @type string
@@ -14189,6 +14277,45 @@ export type GetMetricDashboardsV2200 = {
 	status: string;
 };
 
+export type ListRulesV3Params = {
+	/**
+	 * @type string
+	 * @description undefined
+	 */
+	query?: string;
+	/**
+	 * @type array
+	 * @description undefined
+	 */
+	states?: string[];
+	/**
+	 * @description undefined
+	 */
+	sort?: RuletypesListSortDTO;
+	/**
+	 * @description undefined
+	 */
+	order?: RuletypesListOrderDTO;
+	/**
+	 * @type integer
+	 * @description undefined
+	 */
+	limit?: number;
+	/**
+	 * @type integer
+	 * @description undefined
+	 */
+	offset?: number;
+};
+
+export type ListRulesV3200 = {
+	data: RuletypesListableRulesDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
 export type GetFlamegraphPathParameters = {
 	traceID: string;
 };

frontend/src/components/AddCreditCardModal/AddCreditCardModal.tsx

@@ -1,103 +0,0 @@
-import { useMutation } from 'react-query';
-import { Button, Modal } from 'antd';
-import { Typography } from '@signozhq/ui/typography';
-import { createSubscription } from 'api/generated/services/subscriptions';
-import type { CreateSubscription201 } from 'api/generated/services/sigNoz.schemas';
-import { useNotifications } from 'hooks/useNotifications';
-import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
-import { SubscriptionCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/subscription.permissions';
-import { CreditCard, X } from '@signozhq/icons';
-import APIError from 'types/api/error';
-import { getBaseUrl } from 'utils/basePath';
-
-interface AddCreditCardModalProps {
-	open: boolean;
-	onClose: () => void;
-	onAddCreditCard?: () => void;
-}
-
-/**
- * Shown to trial users who have not added a card, in place of chat support.
- * Submitting creates the subscription and opens the returned billing URL.
- */
-function AddCreditCardModal({
-	open,
-	onClose,
-	onAddCreditCard,
-}: AddCreditCardModalProps): JSX.Element {
-	const { notifications } = useNotifications();
-
-	const handleBillingOnSuccess = (data: CreateSubscription201): void => {
-		if (data?.data?.redirectURL) {
-			const newTab = document.createElement('a');
-			newTab.href = data.data.redirectURL;
-			newTab.target = '_blank';
-			newTab.rel = 'noopener noreferrer';
-			newTab.click();
-		}
-	};
-
-	const handleBillingOnError = (error: APIError): void => {
-		notifications.error({
-			message: error.getErrorCode(),
-			description: error.getErrorMessage(),
-		});
-	};
-
-	const { mutate: updateCreditCard, isLoading: isLoadingBilling } = useMutation(
-		createSubscription,
-		{ onSuccess: handleBillingOnSuccess, onError: handleBillingOnError },
-	);
-
-	const handleAddCreditCard = (): void => {
-		onAddCreditCard?.();
-		updateCreditCard({ url: getBaseUrl() });
-	};
-
-	return (
-		<Modal
-			className="add-credit-card-modal"
-			title={<span className="title">Add Credit Card for Chat Support</span>}
-			open={open}
-			closable
-			onCancel={onClose}
-			destroyOnClose
-			footer={[
-				<Button
-					key="cancel"
-					onClick={onClose}
-					className="cancel-btn"
-					icon={<X size={16} />}
-				>
-					Cancel
-				</Button>,
-				<AuthZTooltip
-					key="submit"
-					checks={[SubscriptionCreatePermission]}
-					withPortal={false}
-				>
-					<Button
-						type="primary"
-						icon={<CreditCard size={16} />}
-						size="middle"
-						loading={isLoadingBilling}
-						disabled={isLoadingBilling}
-						onClick={handleAddCreditCard}
-						className="add-credit-card-btn"
-					>
-						Add Credit Card
-					</Button>
-				</AuthZTooltip>,
-			]}
-		>
-			<Typography.Text className="add-credit-card-text">
-				You&apos;re currently on <span className="highlight-text">Trial plan</span>.
-				Add a credit card to access SigNoz chat support to your workspace.
-			</Typography.Text>
-		</Modal>
-	);
-}
-
-AddCreditCardModal.defaultProps = { onAddCreditCard: undefined };
-
-export default AddCreditCardModal;

frontend/src/components/ChatSupportGateway/ChatSupportGateway.tsx

@@ -1,15 +1,63 @@
 import { useState } from 'react';
+import { useMutation } from 'react-query';
 import { useLocation } from 'react-router-dom';
-import { Button } from 'antd';
-import AddCreditCardModal from 'components/AddCreditCardModal/AddCreditCardModal';
+import { Button, Modal } from 'antd';
+import { Typography } from '@signozhq/ui/typography';
 import logEvent from 'api/common/logEvent';
-import { MessageSquareText } from '@signozhq/icons';
+import { createSubscription } from 'api/generated/services/subscriptions';
+import type { CreateSubscription201 } from 'api/generated/services/sigNoz.schemas';
+import { useNotifications } from 'hooks/useNotifications';
+import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
+import { SubscriptionCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/subscription.permissions';
+import { CreditCard, MessageSquareText, X } from '@signozhq/icons';
+import APIError from 'types/api/error';
+import { getBaseUrl } from 'utils/basePath';
 
 export default function ChatSupportGateway(): JSX.Element {
+	const { notifications } = useNotifications();
+
 	const [isAddCreditCardModalOpen, setIsAddCreditCardModalOpen] =
 		useState(false);
+
+	const handleBillingOnSuccess = (data: CreateSubscription201): void => {
+		if (data?.data?.redirectURL) {
+			const newTab = document.createElement('a');
+			newTab.href = data.data.redirectURL;
+			newTab.target = '_blank';
+			newTab.rel = 'noopener noreferrer';
+			newTab.click();
+		}
+	};
+
+	const handleBillingOnError = (error: APIError): void => {
+		notifications.error({
+			message: error.getErrorCode(),
+			description: error.getErrorMessage(),
+		});
+	};
+
+	const { mutate: updateCreditCard, isLoading: isLoadingBilling } = useMutation(
+		createSubscription,
+		{
+			onSuccess: (data) => {
+				handleBillingOnSuccess(data);
+			},
+			onError: handleBillingOnError,
+		},
+	);
 	const { pathname } = useLocation();
 
+	const handleAddCreditCard = (): void => {
+		logEvent('Add Credit card modal: Clicked', {
+			source: `chat support icon`,
+			page: pathname,
+		});
+
+		updateCreditCard({
+			url: getBaseUrl(),
+		});
+	};
+
 	return (
 		<>
 			<div className="chat-support-gateway">
@@ -28,16 +76,47 @@ export default function ChatSupportGateway(): JSX.Element {
 				</Button>
 			</div>
 
-			<AddCreditCardModal
+			{/* Add Credit Card Modal */}
+			<Modal
+				className="add-credit-card-modal"
+				title={<span className="title">Add Credit Card for Chat Support</span>}
 				open={isAddCreditCardModalOpen}
-				onClose={(): void => setIsAddCreditCardModalOpen(false)}
-				onAddCreditCard={(): void => {
-					logEvent('Add Credit card modal: Clicked', {
-						source: `chat support icon`,
-						page: pathname,
-					});
-				}}
-			/>
+				closable
+				onCancel={(): void => setIsAddCreditCardModalOpen(false)}
+				destroyOnClose
+				footer={[
+					<Button
+						key="cancel"
+						onClick={(): void => setIsAddCreditCardModalOpen(false)}
+						className="cancel-btn"
+						icon={<X size={16} />}
+					>
+						Cancel
+					</Button>,
+					<AuthZTooltip
+						key="submit"
+						checks={[SubscriptionCreatePermission]}
+						withPortal={false}
+					>
+						<Button
+							type="primary"
+							icon={<CreditCard size={16} />}
+							size="middle"
+							loading={isLoadingBilling}
+							disabled={isLoadingBilling}
+							onClick={handleAddCreditCard}
+							className="add-credit-card-btn"
+						>
+							Add Credit Card
+						</Button>
+					</AuthZTooltip>,
+				]}
+			>
+				<Typography.Text className="add-credit-card-text">
+					You&apos;re currently on <span className="highlight-text">Trial plan</span>
+					. Add a credit card to access SigNoz chat support to your workspace.
+				</Typography.Text>
+			</Modal>
 		</>
 	);
 }

frontend/src/components/LaunchChatSupport/LaunchChatSupport.tsx

@@ -1,14 +1,22 @@
 import { useMemo, useState } from 'react';
+import { useMutation } from 'react-query';
 import { useLocation } from 'react-router-dom';
-import { Button, Tooltip } from 'antd';
-import AddCreditCardModal from 'components/AddCreditCardModal/AddCreditCardModal';
+import { Button, Modal, Tooltip } from 'antd';
+import { Typography } from '@signozhq/ui/typography';
 import logEvent from 'api/common/logEvent';
+import { createSubscription } from 'api/generated/services/subscriptions';
+import type { CreateSubscription201 } from 'api/generated/services/sigNoz.schemas';
 import cx from 'classnames';
 import { FeatureKeys } from 'constants/features';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
+import { useNotifications } from 'hooks/useNotifications';
+import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
+import { SubscriptionCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/subscription.permissions';
 import { defaultTo } from 'lodash-es';
-import { CircleHelp } from '@signozhq/icons';
+import { CircleHelp, CreditCard, X } from '@signozhq/icons';
 import { useAppContext } from 'providers/App/App';
+import APIError from 'types/api/error';
+import { getBaseUrl } from 'utils/basePath';
 
 import './LaunchChatSupport.styles.scss';
 
@@ -33,6 +41,7 @@ function LaunchChatSupport({
 	chatMessageDisabled = false,
 }: LaunchChatSupportProps): JSX.Element | null {
 	const { isCloudUser: isCloudUserVal } = useGetTenantLicense();
+	const { notifications } = useNotifications();
 	const {
 		trialInfo,
 		featureFlags,
@@ -110,12 +119,43 @@ function LaunchChatSupport({
 		}
 	};
 
+	const handleBillingOnSuccess = (data: CreateSubscription201): void => {
+		if (data?.data?.redirectURL) {
+			const newTab = document.createElement('a');
+			newTab.href = data.data.redirectURL;
+			newTab.target = '_blank';
+			newTab.rel = 'noopener noreferrer';
+			newTab.click();
+		}
+	};
+
+	const handleBillingOnError = (error: APIError): void => {
+		notifications.error({
+			message: error.getErrorCode(),
+			description: error.getErrorMessage(),
+		});
+	};
+
+	const { mutate: updateCreditCard, isLoading: isLoadingBilling } = useMutation(
+		createSubscription,
+		{
+			onSuccess: (data) => {
+				handleBillingOnSuccess(data);
+			},
+			onError: handleBillingOnError,
+		},
+	);
+
 	const handleAddCreditCard = (): void => {
 		logEvent('Add Credit card modal: Clicked', {
 			source: `facing issues button`,
 			page: pathname,
 			...attributes,
 		});
+
+		updateCreditCard({
+			url: getBaseUrl(),
+		});
 	};
 
 	return isCloudUserVal && isChatSupportEnabled ? ( // Note: we would need to move this condition to license based in future
@@ -135,11 +175,47 @@ function LaunchChatSupport({
 				</Button>
 			</Tooltip>
 
-			<AddCreditCardModal
+			{/* Add Credit Card Modal */}
+			<Modal
+				className="add-credit-card-modal"
+				title={<span className="title">Add Credit Card for Chat Support</span>}
 				open={isAddCreditCardModalOpen}
-				onClose={(): void => setIsAddCreditCardModalOpen(false)}
-				onAddCreditCard={handleAddCreditCard}
-			/>
+				closable
+				onCancel={(): void => setIsAddCreditCardModalOpen(false)}
+				destroyOnClose
+				footer={[
+					<Button
+						key="cancel"
+						onClick={(): void => setIsAddCreditCardModalOpen(false)}
+						className="cancel-btn"
+						icon={<X size={16} />}
+					>
+						Cancel
+					</Button>,
+					<AuthZTooltip
+						key="submit"
+						checks={[SubscriptionCreatePermission]}
+						withPortal={false}
+					>
+						<Button
+							type="primary"
+							icon={<CreditCard size={16} />}
+							size="middle"
+							loading={isLoadingBilling}
+							disabled={isLoadingBilling}
+							onClick={handleAddCreditCard}
+							className="add-credit-card-btn"
+						>
+							Add Credit Card
+						</Button>
+					</AuthZTooltip>,
+				]}
+			>
+				<Typography.Text className="add-credit-card-text">
+					You&apos;re currently on <span className="highlight-text">Trial plan</span>
+					. Add a credit card to access SigNoz chat support to your workspace.
+				</Typography.Text>
+			</Modal>
 		</div>
 	) : null;
 }

frontend/src/constants/localStorage.ts

@@ -47,5 +47,4 @@ export enum LOCALSTORAGE {
 	DASHBOARDS_LIST_VIEWS = 'DASHBOARDS_LIST_VIEWS',
 	DASHBOARD_V2_PANEL_COLUMN_WIDTHS = 'DASHBOARD_V2_PANEL_COLUMN_WIDTHS',
 	LLM_ATTRIBUTE_MAPPING_TEST_SPAN = 'LLM_ATTRIBUTE_MAPPING_TEST_SPAN',
-	SAVED_VIEW_ENABLED = 'SAVED_VIEW_ENABLED',
 }

frontend/src/container/AIAssistant/components/ActionsSection/utils/__tests__/openSavedView.test.ts

@@ -3,15 +3,22 @@ import {
 	MessageActionKindDTO,
 	SavedViewEntityDTO,
 } from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
-import { getAllViews } from 'api/saveView/getAllViews';
-import { getViewById } from 'api/saveView/getViewById';
+import {
+	getSavedView,
+	listSavedViews,
+} from 'api/generated/services/saved-view';
+import {
+	GetSavedView200,
+	ListSavedViews200,
+	SavedviewtypesPanelTypeDTO,
+	SavedviewtypesSavedViewDTO,
+	SavedviewtypesSchemaVersionDTO,
+	SavedviewtypesSourceDTO,
+} from 'api/generated/services/sigNoz.schemas';
 import ROUTES from 'constants/routes';
 import { QueryParams } from 'constants/query';
 import { PANEL_TYPES } from 'constants/queryBuilder';
-import { ICompositeMetricQuery } from 'types/api/alerts/compositeQuery';
-import { AllViewsProps, ViewProps } from 'types/api/saveViews/types';
 import { DataSource } from 'types/common/queryBuilder';
-import { AxiosResponse } from 'axios';
 import type { History } from 'history';
 
 import {
@@ -31,8 +38,7 @@ import {
 } from '../resolveOpenResource';
 import { resourceRoute, ResourceType } from '../resourceRoute';
 
-jest.mock('api/saveView/getAllViews');
-jest.mock('api/saveView/getViewById');
+jest.mock('api/generated/services/saved-view');
 
 jest.mock(
 	'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi',
@@ -48,43 +54,45 @@ jest.mock(
 	}),
 );
 
-const mockedGetAllViews = getAllViews as jest.MockedFunction<
-	typeof getAllViews
+const mockedListSavedViews = listSavedViews as jest.MockedFunction<
+	typeof listSavedViews
 >;
-const mockedGetViewById = getViewById as jest.MockedFunction<
-	typeof getViewById
+const mockedGetSavedView = getSavedView as jest.MockedFunction<
+	typeof getSavedView
 >;
 
-function makeView(id: string, sourcePage: DataSource): ViewProps {
+function makeView(
+	id: string,
+	source: SavedviewtypesSourceDTO,
+): SavedviewtypesSavedViewDTO {
 	return {
 		id,
-		name: `View ${id}`,
-		category: 'test',
+		name: `view-${id}`,
+		source,
+		schemaVersion: SavedviewtypesSchemaVersionDTO.v2,
 		createdAt: '2021-07-07T06:31:00.000Z',
 		createdBy: 'user',
 		updatedAt: '2021-07-07T06:33:00.000Z',
 		updatedBy: 'user',
-		sourcePage,
-		tags: [],
-		extraData: '',
-		compositeQuery: {
-			panelType: PANEL_TYPES.LIST,
-		} as ICompositeMetricQuery,
-	};
+		spec: {
+			displayName: `View ${id}`,
+			panelType: SavedviewtypesPanelTypeDTO.list,
+			requestType: 'raw',
+			queries: [{ type: 'builder_query', spec: { name: 'A', signal: source } }],
+		},
+	} as unknown as SavedviewtypesSavedViewDTO;
 }
 
-function mockViewsResponse(views: ViewProps[]): AxiosResponse<AllViewsProps> {
-	return {
-		data: { status: 'success', data: views },
-	} as AxiosResponse<AllViewsProps>;
+function mockViewsResponse(
+	views: SavedviewtypesSavedViewDTO[],
+): ListSavedViews200 {
+	return { status: 'success', data: views };
 }
 
 function mockViewByIdResponse(
-	view: ViewProps,
-): AxiosResponse<{ status: string; data: ViewProps }> {
-	return {
-		data: { status: 'success', data: view },
-	} as AxiosResponse<{ status: string; data: ViewProps }>;
+	view: SavedviewtypesSavedViewDTO,
+): GetSavedView200 {
+	return { status: 'success', data: view };
 }
 
 describe('resourceRoute', () => {
@@ -190,18 +198,33 @@ describe('resolveOpenResource', () => {
 
 describe('findSavedViewInLists', () => {
 	beforeEach(() => {
-		mockedGetAllViews.mockReset();
+		mockedListSavedViews.mockReset();
 	});
 
 	it('loads only the hinted source when entity is provided', async () => {
-		const tracesView = makeView('view-traces', DataSource.TRACES);
-		mockedGetAllViews.mockResolvedValueOnce(mockViewsResponse([tracesView]));
+		const tracesView = makeView('view-traces', SavedviewtypesSourceDTO.traces);
+		mockedListSavedViews.mockResolvedValueOnce(mockViewsResponse([tracesView]));
 
 		const result = await findSavedViewInLists('view-traces', DataSource.TRACES);
 
 		expect(result).toStrictEqual(tracesView);
-		expect(mockedGetAllViews).toHaveBeenCalledTimes(1);
-		expect(mockedGetAllViews).toHaveBeenCalledWith(DataSource.TRACES);
+		expect(mockedListSavedViews).toHaveBeenCalledTimes(1);
+		expect(mockedListSavedViews).toHaveBeenCalledWith({
+			source: SavedviewtypesSourceDTO.traces,
+		});
+	});
+
+	it('treats a null list as empty and probes the next source', async () => {
+		const metricsView = makeView('view-metrics', SavedviewtypesSourceDTO.metrics);
+		mockedListSavedViews
+			.mockResolvedValueOnce({ status: 'success', data: null })
+			.mockResolvedValueOnce(mockViewsResponse([]))
+			.mockResolvedValueOnce(mockViewsResponse([metricsView]));
+
+		const result = await findSavedViewInLists('view-metrics');
+
+		expect(result).toStrictEqual(metricsView);
+		expect(mockedListSavedViews).toHaveBeenCalledTimes(3);
 	});
 });
 
@@ -227,52 +250,75 @@ describe('openSavedView', () => {
 	it('navigates with history.push and view query params', () => {
 		const push = jest.fn();
 		const history = { push } as unknown as History;
-		const view = makeView('view-logs', DataSource.LOGS);
+		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
 
 		openSavedView(view, history);
 
 		expect(push).toHaveBeenCalledTimes(1);
 		const pushedUrl = push.mock.calls[0][0] as string;
 		expect(pushedUrl).toContain(ROUTES.LOGS_EXPLORER);
-		expect(pushedUrl).toContain(QueryParams.viewKey);
+		const params = new URLSearchParams(pushedUrl.split('?')[1]);
+		expect(params.get(QueryParams.viewKey)).toBe('"view-logs"');
+		expect(params.get(QueryParams.viewName)).toBe('"View view-logs"');
+		expect(params.get(QueryParams.panelTypes)).toBe('"list"');
+	});
+
+	it('throws when the view has no source', () => {
+		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
+		delete view.source;
+
+		expect(() =>
+			openSavedView(view, { push: jest.fn() } as unknown as History),
+		).toThrow('Unsupported saved view source');
+	});
+
+	it('throws when the view has no queries', () => {
+		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
+		view.spec.queries = [];
+
+		expect(() =>
+			openSavedView(view, { push: jest.fn() } as unknown as History),
+		).toThrow('Saved view is missing query data');
 	});
 });
 
 describe('openSavedViewByKey', () => {
 	beforeEach(() => {
-		mockedGetAllViews.mockReset();
-		mockedGetViewById.mockReset();
+		mockedListSavedViews.mockReset();
+		mockedGetSavedView.mockReset();
 	});
 
 	it('prefers the direct view lookup endpoint', async () => {
-		const view = makeView('view-logs', DataSource.LOGS);
-		mockedGetViewById.mockResolvedValueOnce(mockViewByIdResponse(view));
+		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
+		mockedGetSavedView.mockResolvedValueOnce(mockViewByIdResponse(view));
 		const push = jest.fn();
 		const history = { push } as unknown as History;
 
 		await openSavedViewByKey('view-logs', DataSource.LOGS, history);
 
-		expect(mockedGetViewById).toHaveBeenCalledWith('view-logs');
-		expect(mockedGetAllViews).not.toHaveBeenCalled();
+		expect(mockedGetSavedView).toHaveBeenCalledWith({ id: 'view-logs' });
+		expect(mockedListSavedViews).not.toHaveBeenCalled();
 		expect(push).toHaveBeenCalled();
 	});
 
 	it('falls back to list probing when direct lookup fails', async () => {
-		const view = makeView('view-traces', DataSource.TRACES);
-		mockedGetViewById.mockRejectedValueOnce(new Error('not found'));
-		mockedGetAllViews.mockResolvedValueOnce(mockViewsResponse([view]));
+		const view = makeView('view-traces', SavedviewtypesSourceDTO.traces);
+		mockedGetSavedView.mockRejectedValueOnce(new Error('not found'));
+		mockedListSavedViews.mockResolvedValueOnce(mockViewsResponse([view]));
 		const push = jest.fn();
 		const history = { push } as unknown as History;
 
 		await openSavedViewByKey('view-traces', DataSource.TRACES, history);
 
-		expect(mockedGetAllViews).toHaveBeenCalledWith(DataSource.TRACES);
+		expect(mockedListSavedViews).toHaveBeenCalledWith({
+			source: SavedviewtypesSourceDTO.traces,
+		});
 		expect(push).toHaveBeenCalled();
 	});
 
 	it('throws when the saved view does not exist', async () => {
-		mockedGetViewById.mockRejectedValueOnce(new Error('not found'));
-		mockedGetAllViews.mockResolvedValue(mockViewsResponse([]));
+		mockedGetSavedView.mockRejectedValueOnce(new Error('not found'));
+		mockedListSavedViews.mockResolvedValue(mockViewsResponse([]));
 
 		await expect(
 			openSavedViewByKey('missing', DataSource.LOGS, {

frontend/src/container/AIAssistant/components/ActionsSection/utils/openSavedView.ts

@@ -1,15 +1,22 @@
-import { getAllViews } from 'api/saveView/getAllViews';
-import { getViewById } from 'api/saveView/getViewById';
+import {
+	getSavedView,
+	listSavedViews,
+} from 'api/generated/services/saved-view';
+import { SavedviewtypesSavedViewDTO } from 'api/generated/services/sigNoz.schemas';
 import { QueryParams } from 'constants/query';
 import { PANEL_TYPES } from 'constants/queryBuilder';
-import { mapQueryDataFromApi } from 'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi';
+import {
+	findSavedView,
+	getSavedViewQuery,
+	SavedViewSourcePage,
+	toSavedViewSource,
+} from 'container/SavedViews/utils';
 import { SOURCEPAGE_VS_ROUTES } from 'pages/SaveView/constants';
-import { ViewProps } from 'types/api/saveViews/types';
 import { DataSource } from 'types/common/queryBuilder';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { History } from 'history';
 
-type SavedViewSourceHint = DataSource | 'meter';
+type SavedViewSourceHint = SavedViewSourcePage;
 
 const DEFAULT_PROBE_SOURCES: SavedViewSourceHint[] = [
 	DataSource.LOGS,
@@ -20,13 +27,15 @@ const DEFAULT_PROBE_SOURCES: SavedViewSourceHint[] = [
 export async function findSavedViewInLists(
 	viewKey: string,
 	sourceHint?: SavedViewSourceHint | null,
-): Promise<ViewProps | null> {
+): Promise<SavedviewtypesSavedViewDTO | null> {
 	const sources = sourceHint ? [sourceHint] : DEFAULT_PROBE_SOURCES;
 
 	for (const source of sources) {
 		try {
-			const response = await getAllViews(source);
-			const match = response.data.data.find((view) => view.id === viewKey);
+			const response = await listSavedViews({
+				source: toSavedViewSource(source),
+			});
+			const match = findSavedView(response.data, viewKey);
 			if (match) {
 				return match;
 			}
@@ -41,11 +50,11 @@ export async function findSavedViewInLists(
 async function loadSavedView(
 	viewKey: string,
 	sourceHint?: SavedViewSourceHint | null,
-): Promise<ViewProps> {
+): Promise<SavedviewtypesSavedViewDTO> {
 	try {
-		const response = await getViewById(viewKey);
-		if (response.data?.data) {
-			return response.data.data;
+		const response = await getSavedView({ id: viewKey });
+		if (response.data) {
+			return response.data;
 		}
 	} catch {
 		// Fall back to list probing when the direct lookup fails.
@@ -85,20 +94,23 @@ export function buildExplorerNavigationUrl(
 	return `${route}?${params.toString()}`;
 }
 
-export function openSavedView(view: ViewProps, history: History): void {
-	const route = explorerRouteForSourcePage(view.sourcePage);
+export function openSavedView(
+	view: SavedviewtypesSavedViewDTO,
+	history: History,
+): void {
+	const route = view.source ? explorerRouteForSourcePage(view.source) : null;
 	if (!route) {
 		throw new Error('Unsupported saved view source');
 	}
 
-	if (!view.compositeQuery) {
+	if (!view.spec.queries?.length) {
 		throw new Error('Saved view is missing query data');
 	}
 
-	const query = mapQueryDataFromApi(view.compositeQuery);
+	const query = getSavedViewQuery(view);
 	const url = buildExplorerNavigationUrl(route, query, {
-		[QueryParams.panelTypes]: view.compositeQuery.panelType as PANEL_TYPES,
-		[QueryParams.viewName]: view.name,
+		[QueryParams.panelTypes]: view.spec.panelType as unknown as PANEL_TYPES,
+		[QueryParams.viewName]: view.spec.displayName,
 		[QueryParams.viewKey]: view.id,
 	});
 	history.push(url);
@@ -112,6 +124,3 @@ export async function openSavedViewByKey(
 	const view = await loadSavedView(viewKey, sourceHint);
 	openSavedView(view, history);
 }
-
-/** @deprecated Use findSavedViewInLists — kept for tests. */
-export const findSavedView = findSavedViewInLists;

frontend/src/container/AllError/StripInfo/StripInfo.tsx

@@ -1,12 +0,0 @@
-import StripTypography from 'container/BottomStrip/components/StripTypography/StripTypography';
-import { pluralize } from 'utils/pluralize';
-
-interface StripInfoProps {
-	count: number;
-}
-
-function StripInfo({ count }: StripInfoProps): JSX.Element {
-	return <StripTypography>{pluralize(count, 'exception')}</StripTypography>;
-}
-
-export default StripInfo;

frontend/src/container/AllError/StripInfo/__tests__/StripInfo.test.tsx

@@ -1,23 +0,0 @@
-import { render } from 'tests/test-utils';
-
-import StripInfo from '../StripInfo';
-
-describe('StripInfo', () => {
-	it('shows how many exceptions matched', () => {
-		const { getByText } = render(<StripInfo count={42} />);
-
-		expect(getByText('42 exceptions')).toBeInTheDocument();
-	});
-
-	it('says exception, not exceptions, when there is one', () => {
-		const { getByText } = render(<StripInfo count={1} />);
-
-		expect(getByText('1 exception')).toBeInTheDocument();
-	});
-
-	it('shows zero when nothing matched', () => {
-		const { getByText } = render(<StripInfo count={0} />);
-
-		expect(getByText('0 exceptions')).toBeInTheDocument();
-	});
-});

frontend/src/container/AllError/index.tsx

@@ -14,9 +14,6 @@ import { FilterConfirmProps } from 'antd/lib/table/interface';
 import logEvent from 'api/common/logEvent';
 import getAll from 'api/errors/getAll';
 import getErrorCounts from 'api/errors/getErrorCounts';
-import { useBottomStripLeft } from 'container/BottomStrip/useBottomStripLeft';
-
-import StripInfo from './StripInfo/StripInfo';
 import QueryCancelledPlaceholder from 'components/QueryCancelledPlaceholder';
 import { ResizeTable } from 'components/ResizeTable';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
@@ -163,11 +160,6 @@ function AllErrors(): JSX.Element {
 			},
 		]);
 
-	const exceptionCount = errorCountResponse.data?.payload ?? 0;
-	useBottomStripLeft(
-		useMemo(() => <StripInfo count={exceptionCount} />, [exceptionCount]),
-	);
-
 	const isFetching = isErrorsFetching || errorCountResponse.isFetching;
 	useEffect(() => {
 		setIsFetching(isFetching);

frontend/src/container/AppLayout/AppLayout.styles.scss

@@ -53,10 +53,6 @@
 		z-index: 0;
 		background: var(--l1-background);
 
-		// Column so the bottom strip sits under the scrolling content, not inside it.
-		display: flex;
-		flex-direction: column;
-
 		&.full-screen-content {
 			width: 100%;
 		}
@@ -74,9 +70,7 @@
 
 .chat-support-gateway {
 	position: fixed;
-	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
-	// UI belongs in the bounded layout, not in another offset here.
-	bottom: calc(20px + var(--bottom-strip-height, 0px));
+	bottom: 20px;
 	right: 20px;
 	z-index: 1000;
 

frontend/src/container/AppLayout/index.tsx

@@ -43,7 +43,6 @@ import { USER_PREFERENCES } from 'constants/userPreferences';
 import AIAssistantModal from 'container/AIAssistant/AIAssistantModal';
 import AIAssistantPanel from 'container/AIAssistant/AIAssistantPanel';
 import { useAIAssistantStore } from 'container/AIAssistant/store/useAIAssistantStore';
-import BottomStrip from 'container/BottomStrip';
 import SideNav from 'container/SideNav';
 import TopNav from 'container/TopNav';
 import dayjs from 'dayjs';
@@ -52,7 +51,6 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
 import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
 import { useNotifications } from 'hooks/useNotifications';
-import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
 import useTabVisibility from 'hooks/useTabFocus';
 import history from 'lib/history';
 import { isNull } from 'lodash-es';
@@ -404,7 +402,6 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 	}, [pathname]);
 
 	const isToDisplayLayout = isLoggedIn;
-	const isSavedViewEnabled = useSavedViewEnabled();
 
 	const routeKey = useMemo(() => getRouteKey(pathname), [pathname]);
 	const pageTitle = t(routeKey);
@@ -871,10 +868,6 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 								</OverlayScrollbar>
 							</LayoutContent>
 						</Sentry.ErrorBoundary>
-
-						{isSavedViewEnabled && isToDisplayLayout && !renderFullScreen && (
-							<BottomStrip />
-						)}
 					</div>
 
 					{isLoggedIn && isAIAssistantEnabled && (
@@ -885,7 +878,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 					)}
 				</Flex>
 
-				{showAddCreditCardModal && !isSavedViewEnabled && <ChatSupportGateway />}
+				{showAddCreditCardModal && <ChatSupportGateway />}
 				{showChangelogModal && changelog && (
 					<ChangelogModal changelog={changelog} onClose={toggleChangelogModal} />
 				)}

frontend/src/container/AppLayout/styles.ts

@@ -12,12 +12,8 @@ export const Layout = styled(LayoutComponent)`
 	}
 `;
 
-// Takes the height left in `.app-content` after the bottom strip.
-// `min-height: 0` is not needed right now, overlayscrollbars already sets
-// `overflow: auto` here. Kept so this does not break if that goes away.
 export const LayoutContent = styled(LayoutComponent.Content)`
-	flex: 1;
-	min-height: 0;
+	height: 100%;
 	&::-webkit-scrollbar {
 		width: 0.1rem;
 	}

frontend/src/container/BottomStrip/AskNoz/AskNoz.module.scss

@@ -1,36 +0,0 @@
-.askNoz {
-	display: flex;
-	align-items: center;
-	flex-shrink: 0;
-}
-
-.badge {
-	flex-shrink: 0;
-	display: inline-flex;
-	line-height: 0;
-	color: var(--accent-primary);
-}
-
-.pulseDot {
-	position: relative;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	line-height: 0;
-	animation: askNozDotPulse 1.5s ease-in-out infinite;
-	transform: scale(0.8);
-	margin-right: -12px;
-}
-
-@keyframes askNozDotPulse {
-	0%,
-	100% {
-		opacity: 1;
-		transform: scale(1);
-	}
-
-	50% {
-		opacity: 0.35;
-		transform: scale(0.82);
-	}
-}

frontend/src/container/BottomStrip/AskNoz/AskNoz.tsx

@@ -1,76 +0,0 @@
-import { useLocation } from 'react-router-dom';
-import { Button } from '@signozhq/ui/button';
-import { TooltipSimple } from '@signozhq/ui/tooltip';
-import Noz from 'components/Noz/Noz';
-import { NOZ_TOOLTIP_TITLE } from 'components/Noz/Noz.constants';
-import { selectPendingUserInputStreamCount } from 'container/AIAssistant/store/pendingInputSelectors';
-import {
-	openAIAssistant,
-	useAIAssistantStore,
-} from 'container/AIAssistant/store/useAIAssistantStore';
-import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
-import ROUTES from 'constants/routes';
-import { Dot } from '@signozhq/icons';
-
-import styles from './AskNoz.module.scss';
-
-/**
- * Opens the Noz drawer, matching the header entry it replaces. Cmd+K opens the
- * modal instead; this is deliberately the drawer.
- *
- * Carries the header's pending badge: when Noz is blocked on the user
- * (`awaiting_approval` / `awaiting_clarification`) a dot pulses. Without it,
- * hiding the header button would remove a notification rather than move it.
- */
-function AskNoz(): JSX.Element | null {
-	const { pathname } = useLocation();
-	const isAIAssistantEnabled = useIsAIAssistantEnabled();
-	const isDrawerOpen = useAIAssistantStore((state) => state.isDrawerOpen);
-	const isModalOpen = useAIAssistantStore((state) => state.isModalOpen);
-	const pendingUserInputCount = useAIAssistantStore(
-		selectPendingUserInputStreamCount,
-	);
-
-	// Noz is already on screen in the modal, so the "needs you" dot would be noise.
-	const showPendingBadge = pendingUserInputCount > 0 && !isModalOpen;
-
-	// The drawer does not render on the Noz full page, so the button would be inert.
-	const isAIAssistantPage = pathname.startsWith(ROUTES.AI_ASSISTANT_BASE);
-
-	if (!isAIAssistantEnabled || isDrawerOpen || isAIAssistantPage) {
-		return null;
-	}
-
-	return (
-		<div className={styles.askNoz} data-testid="bottom-strip-ask-noz">
-			{showPendingBadge && (
-				<span className={styles.badge} aria-hidden>
-					<span className={styles.pulseDot}>
-						<Dot size={36} />
-					</span>
-				</span>
-			)}
-			<TooltipSimple title={NOZ_TOOLTIP_TITLE}>
-				<Button
-					variant="ghost"
-					color="secondary"
-					size="sm"
-					className="noz-wave"
-					prefix={<Noz size={16} />}
-					onClick={(): void => openAIAssistant()}
-					aria-label={
-						showPendingBadge
-							? `Ask Noz, ${pendingUserInputCount} ${
-									pendingUserInputCount === 1 ? 'action needs' : 'actions need'
-								} your response`
-							: 'Ask Noz'
-					}
-				>
-					Ask Noz
-				</Button>
-			</TooltipSimple>
-		</div>
-	);
-}
-
-export default AskNoz;

frontend/src/container/BottomStrip/AskNoz/__tests__/AskNoz.test.tsx

@@ -1,133 +0,0 @@
-import { fireEvent } from '@testing-library/react';
-import { openAIAssistant } from 'container/AIAssistant/store/useAIAssistantStore';
-import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
-import { render } from 'tests/test-utils';
-
-import AskNoz from '../AskNoz';
-
-jest.mock('hooks/useIsAIAssistantEnabled');
-jest.mock('container/AIAssistant/store/useAIAssistantStore', () => ({
-	openAIAssistant: jest.fn(),
-	useAIAssistantStore: jest.fn(),
-}));
-
-const mockEnabled = useIsAIAssistantEnabled as jest.MockedFunction<
-	typeof useIsAIAssistantEnabled
->;
-const mockOpen = openAIAssistant as jest.MockedFunction<typeof openAIAssistant>;
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const { useAIAssistantStore } = jest.requireMock(
-	'container/AIAssistant/store/useAIAssistantStore',
-) as { useAIAssistantStore: jest.Mock };
-
-/** The component reads the store through three separate selector calls. */
-function mockStore({
-	isDrawerOpen = false,
-	isModalOpen = false,
-	pendingCount = 0,
-}: {
-	isDrawerOpen?: boolean;
-	isModalOpen?: boolean;
-	pendingCount?: number;
-} = {}): void {
-	const state = { isDrawerOpen, isModalOpen, streams: {} };
-	useAIAssistantStore.mockImplementation((selector: (s: unknown) => unknown) => {
-		const picked = selector(state);
-		// `selectPendingUserInputStreamCount` walks `streams`, which is empty here,
-		// so stand in the count we want to assert against.
-		return typeof picked === 'number' ? pendingCount : picked;
-	});
-}
-
-// `TooltipSimple` replaces its trigger's props, so the testId lives on the
-// wrapper and the button itself is reached by role — there is only ever one.
-const SLOT = 'bottom-strip-ask-noz';
-
-describe('AskNoz', () => {
-	beforeEach(() => {
-		jest.clearAllMocks();
-		mockEnabled.mockReturnValue(true);
-		mockStore();
-	});
-
-	describe('visibility', () => {
-		it('renders when the assistant is enabled', () => {
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toBeInTheDocument();
-		});
-
-		it('renders nothing when the assistant is disabled', () => {
-			mockEnabled.mockReturnValue(false);
-
-			const { queryByTestId } = render(<AskNoz />);
-
-			expect(queryByTestId(SLOT)).not.toBeInTheDocument();
-		});
-
-		it('renders nothing while the drawer is open', () => {
-			mockStore({ isDrawerOpen: true });
-
-			const { queryByTestId } = render(<AskNoz />);
-
-			expect(queryByTestId(SLOT)).not.toBeInTheDocument();
-		});
-
-		it('renders nothing on the Noz full page, where the drawer does not mount', () => {
-			const { queryByTestId } = render(<AskNoz />, undefined, {
-				initialRoute: '/ai-assistant/some-conversation-id',
-			});
-
-			expect(queryByTestId(SLOT)).not.toBeInTheDocument();
-		});
-	});
-
-	describe('what it does', () => {
-		it('opens the drawer on click', () => {
-			const { getByRole } = render(<AskNoz />);
-
-			fireEvent.click(getByRole('button'));
-
-			expect(mockOpen).toHaveBeenCalledTimes(1);
-		});
-	});
-
-	describe('pending badge', () => {
-		it('announces the count when Noz is waiting on the user', () => {
-			mockStore({ pendingCount: 2 });
-
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute(
-				'aria-label',
-				'Ask Noz, 2 actions need your response',
-			);
-		});
-
-		it('uses the singular for one pending action', () => {
-			mockStore({ pendingCount: 1 });
-
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute(
-				'aria-label',
-				'Ask Noz, 1 action needs your response',
-			);
-		});
-
-		it('stays quiet when nothing is pending', () => {
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute('aria-label', 'Ask Noz');
-		});
-
-		it('stays quiet while the modal is open, Noz is already on screen', () => {
-			mockStore({ isModalOpen: true, pendingCount: 3 });
-
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute('aria-label', 'Ask Noz');
-		});
-	});
-});

frontend/src/container/BottomStrip/BottomStrip.module.scss

@@ -1,42 +0,0 @@
-.strip {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: var(--spacing-6);
-
-	flex-shrink: 0;
-	height: var(--bottom-strip-height);
-	padding: 0 var(--spacing-6);
-
-	background: var(--l2-background);
-	border-top: 1px solid var(--l2-border);
-
-	--button-font-size: 12px;
-
-	font-family: var(--font-family-sf-mono, monospace);
-
-	// Above page content, below the body-portalled overlays that are meant to
-	// cover the strip.
-	position: relative;
-	z-index: 1;
-}
-
-.left,
-.right {
-	display: flex;
-	align-items: center;
-	gap: var(--spacing-4);
-	min-width: 0;
-}
-
-.left {
-	cursor: default;
-}
-
-// Temporary placeholder for the left slot. Replaced later.
-.version {
-	color: var(--l2-foreground);
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}

frontend/src/container/BottomStrip/LeftSlot/LeftSlot.tsx

@@ -1,29 +0,0 @@
-import * as Sentry from '@sentry/react';
-import { useAppContext } from 'providers/App/App';
-
-import StripTypography from '../components/StripTypography/StripTypography';
-import { useBottomStripStore } from '../store/useBottomStripStore';
-
-function LeftSlot(): JSX.Element | null {
-	const { versionData } = useAppContext();
-	const left = useBottomStripStore((state) => state.left);
-	const ownerId = useBottomStripStore((state) => state.ownerId);
-	const version = versionData?.version?.trim();
-	const versionNode = version ? (
-		<StripTypography>{version}</StripTypography>
-	) : null;
-
-	if (!left) {
-		return versionNode;
-	}
-
-	return (
-		// Keyed so a page whose node threw does not leave the boundary latched on
-		// the fallback for every page after it.
-		<Sentry.ErrorBoundary key={ownerId} fallback={<>{versionNode}</>}>
-			{left}
-		</Sentry.ErrorBoundary>
-	);
-}
-
-export default LeftSlot;

frontend/src/container/BottomStrip/SupportButton/SupportButton.tsx

@@ -1,45 +0,0 @@
-import { useState } from 'react';
-import { Button } from '@signozhq/ui/button';
-import AddCreditCardModal from 'components/AddCreditCardModal/AddCreditCardModal';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
-import { MessageSquareText } from '@signozhq/icons';
-
-function SupportButton(): JSX.Element | null {
-	const chatSupport = useChatSupport();
-	const [isAddCreditCardModalOpen, setIsAddCreditCardModalOpen] =
-		useState(false);
-
-	if (chatSupport === ChatSupportState.Unavailable) {
-		return null;
-	}
-
-	const handleClick = (): void => {
-		if (chatSupport === ChatSupportState.NeedsCard) {
-			setIsAddCreditCardModalOpen(true);
-			return;
-		}
-		window.Pylon?.('show');
-	};
-
-	return (
-		<>
-			<Button
-				variant="ghost"
-				color="secondary"
-				size="sm"
-				prefix={<MessageSquareText size={16} />}
-				onClick={handleClick}
-				testId="bottom-strip-support"
-			>
-				Support
-			</Button>
-
-			<AddCreditCardModal
-				open={isAddCreditCardModalOpen}
-				onClose={(): void => setIsAddCreditCardModalOpen(false)}
-			/>
-		</>
-	);
-}
-
-export default SupportButton;

frontend/src/container/BottomStrip/SupportButton/__tests__/SupportButton.test.tsx

@@ -1,81 +0,0 @@
-import { fireEvent } from '@testing-library/react';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
-import { render } from 'tests/test-utils';
-
-import SupportButton from '../SupportButton';
-
-jest.mock('hooks/useChatSupport', () => ({
-	...jest.requireActual('hooks/useChatSupport'),
-	useChatSupport: jest.fn(),
-}));
-
-const mockChatSupport = useChatSupport as jest.MockedFunction<
-	typeof useChatSupport
->;
-
-const BUTTON = 'bottom-strip-support';
-const MODAL_TITLE = 'Add Credit Card for Chat Support';
-
-describe('SupportButton', () => {
-	beforeEach(() => {
-		jest.clearAllMocks();
-		window.Pylon = jest.fn() as never;
-	});
-
-	describe('when Pylon is available', () => {
-		beforeEach(() => mockChatSupport.mockReturnValue(ChatSupportState.Pylon));
-
-		it('shows the button', () => {
-			const { getByTestId } = render(<SupportButton />);
-
-			expect(getByTestId(BUTTON)).toBeInTheDocument();
-		});
-
-		it('opens the Pylon widget on click', () => {
-			const { getByTestId } = render(<SupportButton />);
-
-			fireEvent.click(getByTestId(BUTTON));
-
-			expect(window.Pylon).toHaveBeenCalledWith('show');
-		});
-
-		it('does not open the credit card modal', () => {
-			const { getByTestId, queryByText } = render(<SupportButton />);
-
-			fireEvent.click(getByTestId(BUTTON));
-
-			expect(queryByText(MODAL_TITLE)).not.toBeInTheDocument();
-		});
-	});
-
-	describe('when the user needs a card', () => {
-		beforeEach(() => mockChatSupport.mockReturnValue(ChatSupportState.NeedsCard));
-
-		it('shows the same button', () => {
-			const { getByTestId } = render(<SupportButton />);
-
-			expect(getByTestId(BUTTON)).toBeInTheDocument();
-		});
-
-		it('opens the credit card modal on click, not Pylon', () => {
-			const { getByTestId, getByText } = render(<SupportButton />);
-
-			fireEvent.click(getByTestId(BUTTON));
-
-			expect(getByText(MODAL_TITLE)).toBeInTheDocument();
-			expect(window.Pylon).not.toHaveBeenCalled();
-		});
-	});
-
-	describe('when support is unavailable', () => {
-		beforeEach(() =>
-			mockChatSupport.mockReturnValue(ChatSupportState.Unavailable),
-		);
-
-		it('renders nothing at all', () => {
-			const { queryByTestId } = render(<SupportButton />);
-
-			expect(queryByTestId(BUTTON)).not.toBeInTheDocument();
-		});
-	});
-});

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

@@ -1,165 +0,0 @@
-import { type ReactNode, useState } from 'react';
-import { fireEvent } from '@testing-library/react';
-import { render } from 'tests/test-utils';
-import { Info } from 'types/api/v1/version/get';
-
-import BottomStrip, {
-	BOTTOM_STRIP_HEIGHT,
-	BOTTOM_STRIP_HEIGHT_VAR,
-	BOTTOM_STRIP_ON_CLASS,
-} from '..';
-import { useBottomStripStore } from '../store/useBottomStripStore';
-import { useBottomStripLeft } from '../useBottomStripLeft';
-
-/** Stands in for a page that puts something on the left of the strip. */
-function Page({ children }: { children: ReactNode }): null {
-	useBottomStripLeft(children);
-	return null;
-}
-
-/** A page whose value changes without needing `rerender`. */
-function ChangingPage(): JSX.Element {
-	const [count, setCount] = useState(600);
-
-	useBottomStripLeft(`${count} traces`);
-
-	return (
-		<button type="button" onClick={(): void => setCount(42)}>
-			change
-		</button>
-	);
-}
-
-/** A page node that blows up while the strip renders it. */
-function Boom(): JSX.Element {
-	throw new Error('bad left node');
-}
-
-const VERSION = 'v0.134.67';
-const versionData: Info = { version: VERSION, ee: 'Y', setupCompleted: true };
-const withVersion = { appContextOverrides: { versionData } };
-
-describe('BottomStrip', () => {
-	// The store is module level, so it outlives each test.
-	beforeEach(() => {
-		useBottomStripStore.setState({ left: null, ownerId: null });
-	});
-
-	it('publishes the body class and height property while mounted', () => {
-		const { unmount } = render(<BottomStrip />);
-
-		expect(document.body.classList.contains(BOTTOM_STRIP_ON_CLASS)).toBe(true);
-		expect(document.body.style.getPropertyValue(BOTTOM_STRIP_HEIGHT_VAR)).toBe(
-			`${BOTTOM_STRIP_HEIGHT}px`,
-		);
-
-		unmount();
-
-		expect(document.body.classList.contains(BOTTOM_STRIP_ON_CLASS)).toBe(false);
-		expect(document.body.style.getPropertyValue(BOTTOM_STRIP_HEIGHT_VAR)).toBe(
-			'',
-		);
-	});
-
-	// The string is whatever the Go build injected, so it is rendered untouched —
-	// same as SideNav. Release tags carry the "v", local builds do not.
-	it.each([['v0.134.67'], ['main-64f1c2a']])(
-		'renders the build version %p exactly as given',
-		(version) => {
-			const { getByText } = render(<BottomStrip />, undefined, {
-				appContextOverrides: {
-					versionData: { version, ee: 'Y', setupCompleted: true },
-				},
-			});
-
-			expect(getByText(version)).toBeInTheDocument();
-		},
-	);
-
-	it('renders the strip without a version when none is available', () => {
-		const { getByTestId } = render(<BottomStrip />, undefined, {
-			appContextOverrides: { versionData: null },
-		});
-
-		const strip = getByTestId('bottom-strip');
-
-		expect(strip).toBeInTheDocument();
-		expect(strip).toHaveTextContent('');
-	});
-
-	// `tests/test-utils` builds its wrapper around the first `ui`, so `rerender`
-	// re-renders the original tree. These drive change through state and through
-	// separate trees instead, which the module-level store lets them share.
-	describe('left slot', () => {
-		it('shows what the page put there instead of the version', () => {
-			render(<Page>600 traces</Page>);
-			const { getByText, queryByText } = render(
-				<BottomStrip />,
-				undefined,
-				withVersion,
-			);
-
-			expect(getByText('600 traces')).toBeInTheDocument();
-			expect(queryByText(VERSION)).not.toBeInTheDocument();
-		});
-
-		it('falls back to the version once the page is gone', () => {
-			const page = render(<Page>600 traces</Page>);
-			const { getByText } = render(<BottomStrip />, undefined, withVersion);
-
-			page.unmount();
-
-			expect(getByText(VERSION)).toBeInTheDocument();
-		});
-
-		it('updates when the page changes what it shows', () => {
-			render(<ChangingPage />);
-			const { getByText, getByRole } = render(
-				<BottomStrip />,
-				undefined,
-				withVersion,
-			);
-
-			expect(getByText('600 traces')).toBeInTheDocument();
-
-			fireEvent.click(getByRole('button', { name: 'change' }));
-
-			expect(getByText('42 traces')).toBeInTheDocument();
-		});
-
-		it('falls back to the version when the page node throws', () => {
-			// React logs the caught error, which is noise here.
-			const consoleError = jest
-				.spyOn(console, 'error')
-				.mockImplementation(() => {});
-
-			render(
-				<Page>
-					<Boom />
-				</Page>,
-			);
-			const { getByTestId, getByText } = render(
-				<BottomStrip />,
-				undefined,
-				withVersion,
-			);
-
-			expect(getByTestId('bottom-strip')).toBeInTheDocument();
-			expect(getByText(VERSION)).toBeInTheDocument();
-
-			consoleError.mockRestore();
-		});
-
-		it('keeps the new page value when the old page unmounts after it', () => {
-			// Navigation order: the next page mounts before the last one unmounts,
-			// so without the owner guard the outgoing page wipes the incoming value.
-			const pageA = render(<Page>page A</Page>);
-			render(<Page>page B</Page>);
-			const { getByText } = render(<BottomStrip />, undefined, withVersion);
-
-			pageA.unmount();
-
-			expect(getByText('page B')).toBeInTheDocument();
-		});
-	});
-});

frontend/src/container/BottomStrip/components/StripSeparator/StripSeparator.module.scss

@@ -1,15 +0,0 @@
-.separator {
-	flex-shrink: 0;
-	width: 1px;
-	height: 14px;
-	background: var(--l2-border);
-}
-
-// Strip items hide themselves by rendering null, which would otherwise leave a
-// separator dangling at an edge or two of them side by side. Collapsing them
-// here keeps the call sites free of visibility plumbing.
-.separator:first-child,
-.separator:last-child,
-.separator + .separator {
-	display: none;
-}

frontend/src/container/BottomStrip/components/StripSeparator/StripSeparator.tsx

@@ -1,7 +0,0 @@
-import styles from './StripSeparator.module.scss';
-
-function StripSeparator(): JSX.Element {
-	return <span className={styles.separator} aria-hidden />;
-}
-
-export default StripSeparator;

frontend/src/container/BottomStrip/components/StripTypography/StripTypography.module.scss

@@ -1,10 +0,0 @@
-.stripTypography {
-	display: inline-flex;
-	align-items: center;
-	gap: 6px;
-
-	color: var(--l2-foreground);
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}

frontend/src/container/BottomStrip/components/StripTypography/StripTypography.tsx

@@ -1,34 +0,0 @@
-import type { ReactNode } from 'react';
-import { Typography } from '@signozhq/ui/typography';
-import cx from 'classnames';
-
-import styles from './StripTypography.module.scss';
-
-interface StripTypographyProps {
-	children: ReactNode;
-	/** Leading icon, aligned and spaced for you. Same shape as `Button`'s. */
-	prefix?: ReactNode;
-	className?: string;
-}
-
-/**
- * Everything the strip renders goes through this: the version, a plain count, or
- * an icon with a key and value. It owns the strip's type and alignment and
- * nothing else — how a consumer colours its own content is theirs.
- */
-function StripTypography({
-	children,
-	prefix,
-	className,
-}: StripTypographyProps): JSX.Element {
-	return (
-		<span className={cx(styles.stripTypography, className)}>
-			{prefix}
-			<Typography.Text as="span">{children}</Typography.Text>
-		</span>
-	);
-}
-
-StripTypography.defaultProps = { prefix: undefined, className: undefined };
-
-export default StripTypography;

frontend/src/container/BottomStrip/index.tsx

@@ -1,43 +0,0 @@
-import { useLayoutEffect } from 'react';
-
-import AskNoz from './AskNoz/AskNoz';
-import LeftSlot from './LeftSlot/LeftSlot';
-import StripSeparator from './components/StripSeparator/StripSeparator';
-import SupportButton from './SupportButton/SupportButton';
-
-import styles from './BottomStrip.module.scss';
-
-export const BOTTOM_STRIP_HEIGHT = 24;
-
-export const BOTTOM_STRIP_ON_CLASS = 'bottom-strip-on';
-export const BOTTOM_STRIP_HEIGHT_VAR = '--bottom-strip-height';
-
-function BottomStrip(): JSX.Element {
-	useLayoutEffect(() => {
-		document.body.classList.add(BOTTOM_STRIP_ON_CLASS);
-		document.body.style.setProperty(
-			BOTTOM_STRIP_HEIGHT_VAR,
-			`${BOTTOM_STRIP_HEIGHT}px`,
-		);
-
-		return (): void => {
-			document.body.classList.remove(BOTTOM_STRIP_ON_CLASS);
-			document.body.style.removeProperty(BOTTOM_STRIP_HEIGHT_VAR);
-		};
-	}, []);
-
-	return (
-		<div className={styles.strip} data-testid="bottom-strip">
-			<div className={styles.left}>
-				<LeftSlot />
-			</div>
-			<div className={styles.right}>
-				<AskNoz />
-				<StripSeparator />
-				<SupportButton />
-			</div>
-		</div>
-	);
-}
-
-export default BottomStrip;

frontend/src/container/BottomStrip/store/useBottomStripStore.ts

@@ -1,26 +0,0 @@
-import type { ReactNode } from 'react';
-import { create } from 'zustand';
-
-interface BottomStripState {
-	/** What the strip shows on the left, or null to fall back to the version. */
-	left: ReactNode | null;
-	/** Which page owns the current value — see `clearLeft`. */
-	ownerId: string | null;
-	setLeft: (ownerId: string, left: ReactNode) => void;
-	clearLeft: (ownerId: string) => void;
-}
-
-export const useBottomStripStore = create<BottomStripState>()((set, get) => ({
-	left: null,
-	ownerId: null,
-	setLeft: (ownerId, left): void => set({ left, ownerId }),
-	// Only the current owner may clear. On a plain route swap React runs the old
-	// page's cleanup before the new page's effect, so this is moot, but two
-	// consumers can be mounted at once (a page under a drawer): the one that set
-	// last owns the slot, and the other unmounting must not wipe it.
-	clearLeft: (ownerId): void => {
-		if (get().ownerId === ownerId) {
-			set({ left: null, ownerId: null });
-		}
-	},
-}));

frontend/src/container/BottomStrip/useBottomStripLeft.ts

@@ -1,23 +0,0 @@
-import { type ReactNode, useEffect, useId } from 'react';
-
-import { useBottomStripStore } from './store/useBottomStripStore';
-
-/**
- * Puts `node` on the left of the bottom strip for as long as the calling page is
- * mounted. Pass null to show nothing and let the version through.
- *
- * There is no refresh API by design: a page that refetches re-renders, which
- * produces a new node, which re-runs this effect. Wrap the node in `useMemo`
- * keyed on the values it shows, or the store is written on every render.
- */
-export function useBottomStripLeft(node: ReactNode | null): void {
-	const ownerId = useId();
-	const setLeft = useBottomStripStore((state) => state.setLeft);
-	const clearLeft = useBottomStripStore((state) => state.clearLeft);
-
-	useEffect(() => {
-		setLeft(ownerId, node);
-
-		return (): void => clearLeft(ownerId);
-	}, [node, ownerId, setLeft, clearLeft]);
-}

frontend/src/container/CreateAlertV2/Footer/styles.scss

@@ -1,8 +1,6 @@
 .create-alert-v2-footer {
 	position: fixed;
-	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
-	// UI belongs in the bounded layout, not in another offset here.
-	bottom: var(--bottom-strip-height, 0px);
+	bottom: 0;
 	left: 63px;
 	right: 0;
 	background-color: var(--l1-background);

frontend/src/container/ExplorerOptions/ExplorerOptions.styles.scss

@@ -1,8 +1,6 @@
 .explorer-options-container {
 	position: fixed;
-	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
-	// UI belongs in the bounded layout, not in another offset here.
-	bottom: var(--bottom-strip-height, 0px);
+	bottom: 0px;
 	left: calc(50% + 240px);
 	transform: translate(calc(-50% - 120px), 0);
 	transition: left 0.2s linear;

frontend/src/container/ExplorerOptions/ExplorerOptionsHideArea.styles.scss

@@ -1,8 +1,6 @@
 .explorer-option-droppable-container {
 	position: fixed;
-	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
-	// UI belongs in the bounded layout, not in another offset here.
-	bottom: var(--bottom-strip-height, 0px);
+	bottom: 0;
 	width: -webkit-fill-available;
 	height: 24px;
 	display: flex;

frontend/src/container/Home/Home.styles.scss

@@ -1,6 +1,7 @@
 .home-container {
 	display: flex;
 	flex-direction: column;
+	min-height: 100vh;
 	overflow-y: auto;
 	height: 100%;
 	width: 100%;

frontend/src/container/Home/Home.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable sonarjs/no-duplicate-string */
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useEffect, useState } from 'react';
 import { useMutation, useQuery } from 'react-query';
 import { Color } from '@signozhq/design-tokens';
 import {
@@ -26,8 +26,6 @@ import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import ROUTES from 'constants/routes';
 import { DEFAULT_TIME_RANGE } from 'container/TopNav/DateTimeSelectionV2/constants';
-import { useBottomStripLeft } from 'container/BottomStrip/useBottomStripLeft';
-import StripInfo from 'container/Home/StripInfo/StripInfo';
 import { useGetQueryRange } from 'hooks/queryBuilder/useGetQueryRange';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
@@ -66,8 +64,6 @@ const homeInterval = 30 * 60 * 1000;
 
 // eslint-disable-next-line sonarjs/cognitive-complexity
 export default function Home(): JSX.Element {
-	useBottomStripLeft(useMemo(() => <StripInfo />, []));
-
 	const { user } = useAppContext();
 	const { safeNavigate } = useSafeNavigate();
 	const isDarkMode = useIsDarkMode();

frontend/src/container/Home/SavedViews/SavedViews.tsx

@@ -1,17 +1,18 @@
 import { useEffect, useMemo, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { Button, Skeleton } from 'antd';
-import { Badge } from '@signozhq/ui/badge';
 import logEvent from 'api/common/logEvent';
-import { getViewDetailsUsingViewKey } from 'components/ExplorerCard/utils';
+import { useListSavedViews } from 'api/generated/services/saved-view';
+import {
+	SavedviewtypesSavedViewDTO,
+	SavedviewtypesSourceDTO,
+} from 'api/generated/services/sigNoz.schemas';
 import ROUTES from 'constants/routes';
-import { useGetAllViews } from 'hooks/saveViews/useGetAllViews';
+import { getSavedViewQuery } from 'container/SavedViews/utils';
 import { useHandleExplorerTabChange } from 'hooks/useHandleExplorerTabChange';
 import { SOURCEPAGE_VS_ROUTES } from 'pages/SaveView/constants';
 import Card from 'periscope/components/Card/Card';
 import { useAppContext } from 'providers/App/App';
-import { ViewProps } from 'types/api/saveViews/types';
-import { DataSource } from 'types/common/queryBuilder';
 import { USER_ROLES } from 'types/roles';
 
 import floppyDiscUrl from '@/assets/Icons/floppy-disc.svg';
@@ -35,38 +36,40 @@ export default function SavedViews({
 }): JSX.Element {
 	const { user } = useAppContext();
 	const [selectedEntity, setSelectedEntity] = useState<string>('logs');
-	const [selectedEntityViews, setSelectedEntityViews] = useState<any[]>([]);
+	const [selectedEntityViews, setSelectedEntityViews] = useState<
+		SavedviewtypesSavedViewDTO[]
+	>([]);
 
 	const {
 		data: logsViewsData,
 		isLoading: logsViewsLoading,
 		isError: logsViewsError,
-	} = useGetAllViews(DataSource.LOGS);
+	} = useListSavedViews({ source: SavedviewtypesSourceDTO.logs });
 
 	const {
 		data: tracesViewsData,
 		isLoading: tracesViewsLoading,
 		isError: tracesViewsError,
-	} = useGetAllViews(DataSource.TRACES);
+	} = useListSavedViews({ source: SavedviewtypesSourceDTO.traces });
 
 	const {
 		data: metricsViewsData,
 		isLoading: metricsViewsLoading,
 		isError: metricsViewsError,
-	} = useGetAllViews(DataSource.METRICS);
+	} = useListSavedViews({ source: SavedviewtypesSourceDTO.metrics });
 
 	const logsViews = useMemo(
-		() => [...(logsViewsData?.data.data || [])],
+		() => [...(logsViewsData?.data || [])],
 		[logsViewsData],
 	);
 
 	const tracesViews = useMemo(
-		() => [...(tracesViewsData?.data.data || [])],
+		() => [...(tracesViewsData?.data || [])],
 		[tracesViewsData],
 	);
 
 	const metricsViews = useMemo(
-		() => [...(metricsViewsData?.data.data || [])],
+		() => [...(metricsViewsData?.data || [])],
 		[metricsViewsData],
 	);
 
@@ -88,39 +91,22 @@ export default function SavedViews({
 
 	const { handleExplorerTabChange } = useHandleExplorerTabChange();
 
-	const handleRedirectQuery = (view: ViewProps): void => {
+	const handleRedirectQuery = (view: SavedviewtypesSavedViewDTO): void => {
 		logEvent('Homepage: Saved view clicked', {
 			viewId: view.id,
-			viewName: view.name,
+			viewName: view.spec.displayName,
 			entity: selectedEntity,
 		});
 
-		let currentViews: ViewProps[] = [];
-		if (selectedEntity === 'logs') {
-			currentViews = logsViews;
-		} else if (selectedEntity === 'traces') {
-			currentViews = tracesViews;
-		} else if (selectedEntity === 'metrics') {
-			currentViews = metricsViews;
-		}
-
-		const currentViewDetails = getViewDetailsUsingViewKey(view.id, currentViews);
-		if (!currentViewDetails) {
-			return;
-		}
-		const { query, name, id, panelType: currentPanelType } = currentViewDetails;
-
-		if (selectedEntity) {
-			handleExplorerTabChange(
-				currentPanelType,
-				{
-					query,
-					viewName: name,
-					viewKey: id,
-				},
-				SOURCEPAGE_VS_ROUTES[selectedEntity],
-			);
-		}
+		handleExplorerTabChange(
+			view.spec.panelType,
+			{
+				query: getSavedViewQuery(view),
+				viewName: view.spec.displayName,
+				viewKey: view.id,
+			},
+			SOURCEPAGE_VS_ROUTES[selectedEntity],
+		);
 	};
 
 	useEffect(() => {
@@ -239,24 +225,10 @@ export default function SavedViews({
 							/>
 
 							<div className="saved-view-item-name home-data-item-name">
-								{view.name}
+								{view.spec.displayName}
 							</div>
 						</div>
 
-						<div className="saved-view-item-description home-data-item-tag">
-							{view.tags?.map((tag: string) => {
-								if (tag === '') {
-									return null;
-								}
-
-								return (
-									<Badge color="sienna" key={tag}>
-										{tag}
-									</Badge>
-								);
-							})}
-						</div>
-
 						<Button
 							type="link"
 							size="small"
@@ -307,7 +279,7 @@ export default function SavedViews({
 		logEvent('Homepage: Saved views switched', {
 			tab,
 		});
-		let currentViews: ViewProps[] = [];
+		let currentViews: SavedviewtypesSavedViewDTO[] = [];
 		if (tab === 'logs') {
 			currentViews = logsViews;
 		} else if (tab === 'traces') {

frontend/src/container/Home/StripInfo/StripInfo.tsx

@@ -1,15 +0,0 @@
-import { useGetAlerts } from 'api/generated/services/alerts';
-import StripTypography from 'container/BottomStrip/components/StripTypography/StripTypography';
-import { pluralize } from 'utils/pluralize';
-
-function StripInfo(): JSX.Element {
-	// Firing instances, not rules, matching the triggered alerts page. Home's own
-	// rules query sets `cacheTime: 0`, so it cannot be shared.
-	const { data } = useGetAlerts();
-
-	const count = data?.data?.length ?? 0;
-
-	return <StripTypography>{pluralize(count, 'alert')} firing</StripTypography>;
-}
-
-export default StripInfo;

frontend/src/container/Home/StripInfo/__tests__/StripInfo.test.tsx

@@ -1,36 +0,0 @@
-import { useGetAlerts } from 'api/generated/services/alerts';
-import { render } from 'tests/test-utils';
-
-import StripInfo from '../StripInfo';
-
-jest.mock('api/generated/services/alerts', () => ({
-	useGetAlerts: jest.fn(),
-}));
-
-const mockUseGetAlerts = useGetAlerts as jest.Mock;
-
-describe('StripInfo', () => {
-	it('counts the firing alert instances', () => {
-		mockUseGetAlerts.mockReturnValue({ data: { data: [{}, {}, {}] } });
-
-		const { getByText } = render(<StripInfo />);
-
-		expect(getByText('3 alerts firing')).toBeInTheDocument();
-	});
-
-	it('says alert, not alerts, when only one is firing', () => {
-		mockUseGetAlerts.mockReturnValue({ data: { data: [{}] } });
-
-		const { getByText } = render(<StripInfo />);
-
-		expect(getByText('1 alert firing')).toBeInTheDocument();
-	});
-
-	it('shows zero before the response lands', () => {
-		mockUseGetAlerts.mockReturnValue({ data: undefined });
-
-		const { getByText } = render(<StripInfo />);
-
-		expect(getByText('0 alerts firing')).toBeInTheDocument();
-	});
-});

frontend/src/container/Licenses/Licenses.styles.scss

@@ -1,4 +1,7 @@
 .licenses-page {
+	max-height: 100vh;
+	overflow: hidden;
+
 	.licenses-page-header {
 		border-bottom: 1px solid var(--l1-border);
 		background: var(--l1-background);
@@ -29,6 +32,7 @@
 
 		.licenses-page-content {
 			flex: 1;
+			height: calc(100vh - 48px);
 			background: var(--l1-background);
 			padding: 10px 8px;
 			overflow-y: auto;

frontend/src/container/ListAlertRules/ListAlertRules.module.scss

@@ -2,7 +2,7 @@
 	display: flex;
 	flex-direction: column;
 	gap: 1rem;
-	flex: 1;
+	height: calc(100vh - 62px);
 	min-height: 400px;
 }
 

frontend/src/container/ListAlertRules/StripInfo/StripInfo.tsx

@@ -1,17 +0,0 @@
-import StripTypography from 'container/BottomStrip/components/StripTypography/StripTypography';
-import { pluralize } from 'utils/pluralize';
-
-interface StripInfoProps {
-	filteredCount: number;
-	totalCount: number;
-}
-
-function StripInfo({ filteredCount, totalCount }: StripInfoProps): JSX.Element {
-	return (
-		<StripTypography>
-			{filteredCount} of {pluralize(totalCount, 'rule')}
-		</StripTypography>
-	);
-}
-
-export default StripInfo;

frontend/src/container/ListAlertRules/StripInfo/__tests__/StripInfo.test.tsx

@@ -1,23 +0,0 @@
-import { render } from 'tests/test-utils';
-
-import StripInfo from '../StripInfo';
-
-describe('StripInfo', () => {
-	it('shows how many rules the filters left', () => {
-		const { getByText } = render(<StripInfo filteredCount={3} totalCount={12} />);
-
-		expect(getByText('3 of 12 rules')).toBeInTheDocument();
-	});
-
-	it('says rule, not rules, when there is only one', () => {
-		const { getByText } = render(<StripInfo filteredCount={1} totalCount={1} />);
-
-		expect(getByText('1 of 1 rule')).toBeInTheDocument();
-	});
-
-	it('shows zero when the filters match nothing', () => {
-		const { getByText } = render(<StripInfo filteredCount={0} totalCount={12} />);
-
-		expect(getByText('0 of 12 rules')).toBeInTheDocument();
-	});
-});

frontend/src/container/ListAlertRules/index.tsx

@@ -7,7 +7,6 @@ import NoResultsEmptyState from 'components/Alerts/NoResultsEmptyState';
 import TanStackTable from 'components/TanStackTableView';
 import { useCalculatedPageSize } from 'components/TanStackTableView/useCalculatedPageSize';
 import { useTableParams } from 'components/TanStackTableView/useTableParams';
-import { useBottomStripLeft } from 'container/BottomStrip/useBottomStripLeft';
 import useComponentPermission from 'hooks/useComponentPermission';
 import { useUrlSearchState } from 'hooks/useUrlSearchState';
 import { useAppContext } from 'providers/App/App';
@@ -21,7 +20,6 @@ import { ALERT_RULES_PARAMS, useAlertRulesFilters } from './hooks';
 import styles from './ListAlertRules.module.scss';
 import { getAlertRuleColumns } from './table.config';
 import type { AlertRule } from './types';
-import StripInfo from './StripInfo/StripInfo';
 import { useAlertRulesData } from './useAlertRulesData';
 import { useAlertRulesHandlers } from './useAlertRulesHandlers';
 
@@ -71,18 +69,6 @@ function ListAlertRules(): JSX.Element {
 	const { filteredRules, isFetching, isError, allRules, refetch } =
 		useAlertRulesData(orderBy, debouncedSearch, filterValues ?? []);
 
-	useBottomStripLeft(
-		useMemo(
-			() => (
-				<StripInfo
-					filteredCount={filteredRules.length}
-					totalCount={allRules.length}
-				/>
-			),
-			[filteredRules.length, allRules.length],
-		),
-	);
-
 	const { handleEdit, handleNewAlert, handleRowClick, handleRowClickNewTab } =
 		useAlertRulesHandlers(allRules.length);
 

frontend/src/container/MetricsExplorer/Summary/Summary.styles.scss

@@ -181,9 +181,7 @@
 
 		.ant-pagination {
 			position: fixed;
-			// Lifted above the bottom strip. Don't extend this pattern — new
-			// fixed-bottom UI belongs in the bounded layout, not in another offset here.
-			bottom: var(--bottom-strip-height, 0px);
+			bottom: 0;
 			width: calc(100% - 54px);
 			background: var(--l1-background);
 			padding: 16px;

frontend/src/container/SavedViews/__tests__/utils.test.ts

@@ -0,0 +1,126 @@
+import {
+	SavedviewtypesPanelTypeDTO,
+	SavedviewtypesSavedViewDTO,
+	SavedviewtypesSchemaVersionDTO,
+	SavedviewtypesSourceDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import { PANEL_TYPES } from 'constants/queryBuilder';
+import { EQueryType } from 'types/common/dashboard';
+import { DataSource } from 'types/common/queryBuilder';
+
+import { findSavedView, getSavedViewQuery, toSavedViewSource } from '../utils';
+
+jest.mock('uuid', () => ({
+	v4: (): string => 'test-id',
+}));
+
+function makeView(): SavedviewtypesSavedViewDTO {
+	return {
+		id: 'view-1',
+		name: 'errors-by-service-abc123',
+		source: SavedviewtypesSourceDTO.traces,
+		schemaVersion: SavedviewtypesSchemaVersionDTO.v2,
+		createdBy: 'a@b.c',
+		updatedBy: 'a@b.c',
+		spec: {
+			displayName: 'Errors by service',
+			panelType: SavedviewtypesPanelTypeDTO.list,
+			requestType: 'raw',
+			queries: [
+				{
+					type: 'builder_query',
+					spec: {
+						name: 'A',
+						signal: 'traces',
+						stepInterval: 60,
+						filter: { expression: 'has_error = true' },
+						// v2 reads back fully defaulted envelopes; nulls must not break the mapper
+						groupBy: null,
+						order: null,
+						selectFields: null,
+						functions: null,
+						legend: '',
+						disabled: false,
+					},
+				},
+			],
+			selectedFields: [{ name: 'service.name' }],
+			display: { color: 'red' },
+		},
+	} as SavedviewtypesSavedViewDTO;
+}
+
+describe('getSavedViewQuery', () => {
+	it('maps the v2 spec through the v5 branch of mapQueryDataFromApi', () => {
+		const query = getSavedViewQuery(makeView());
+
+		expect(query.queryType).toBe(EQueryType.QUERY_BUILDER);
+		expect(query.promql).toStrictEqual([]);
+		expect(query.clickhouse_sql).toStrictEqual([]);
+		expect(query.builder.queryData).toHaveLength(1);
+
+		const [queryData] = query.builder.queryData;
+		expect(queryData.queryName).toBe('A');
+		expect(queryData.dataSource).toBe(DataSource.TRACES);
+		expect(queryData.filter).toStrictEqual({ expression: 'has_error = true' });
+		expect(queryData.groupBy).toStrictEqual([]);
+		expect(queryData.orderBy).toStrictEqual([]);
+	});
+
+	it('keeps formulas alongside builder queries', () => {
+		const view = makeView();
+		view.spec.queries.push({
+			type: 'builder_formula',
+			spec: { name: 'F1', expression: 'A / 2' },
+		} as SavedviewtypesSavedViewDTO['spec']['queries'][number]);
+
+		const query = getSavedViewQuery(view);
+
+		expect(query.builder.queryData).toHaveLength(1);
+		expect(query.builder.queryFormulas).toHaveLength(1);
+		expect(query.builder.queryFormulas[0].queryName).toBe('F1');
+	});
+
+	it('does not read the panel type into the query', () => {
+		const view = makeView();
+		view.spec.panelType = SavedviewtypesPanelTypeDTO.graph;
+
+		const query = getSavedViewQuery(view);
+
+		// panelType travels separately (url param), the Query itself has no such field
+		expect(query).not.toHaveProperty('panelType', PANEL_TYPES.TIME_SERIES);
+	});
+});
+
+describe('toSavedViewSource', () => {
+	it('maps every explorer source page to the v2 source', () => {
+		expect(toSavedViewSource(DataSource.LOGS)).toBe(SavedviewtypesSourceDTO.logs);
+		expect(toSavedViewSource(DataSource.TRACES)).toBe(
+			SavedviewtypesSourceDTO.traces,
+		);
+		expect(toSavedViewSource(DataSource.METRICS)).toBe(
+			SavedviewtypesSourceDTO.metrics,
+		);
+		expect(toSavedViewSource('meter')).toBe(SavedviewtypesSourceDTO.meter);
+	});
+});
+
+describe('findSavedView', () => {
+	const views = [
+		{ ...makeView(), id: 'a' },
+		{ ...makeView(), id: 'b' },
+	];
+
+	it('returns the view with the matching id', () => {
+		expect(findSavedView(views, 'b')?.id).toBe('b');
+	});
+
+	it('returns undefined when the id is not in the list', () => {
+		expect(findSavedView(views, 'c')).toBeUndefined();
+	});
+
+	it('returns undefined for a null or not yet loaded list', () => {
+		expect(findSavedView(null, 'a')).toBeUndefined();
+		expect(findSavedView(undefined, 'a')).toBeUndefined();
+	});
+});

frontend/src/container/SavedViews/utils.ts

@@ -0,0 +1,49 @@
+import {
+	SavedviewtypesSavedViewDTO,
+	SavedviewtypesSourceDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import { PANEL_TYPES } from 'constants/queryBuilder';
+import { mapQueryDataFromApi } from 'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+import { QueryEnvelope } from 'types/api/v5/queryRange';
+import { EQueryType } from 'types/common/dashboard';
+import { DataSource } from 'types/common/queryBuilder';
+
+export type SavedViewSourcePage = DataSource | 'meter';
+
+// Explorers and the preferences module are keyed by DataSource (the signal),
+// the api keys views by source page. Same values today, so this is the one
+// place they meet. AI observability views will come with their own source and
+// DataSource cannot tell them apart from traces, so preferences should move to
+// source page at that point and this map goes with it.
+const SAVED_VIEW_SOURCE: Record<SavedViewSourcePage, SavedviewtypesSourceDTO> =
+	{
+		[DataSource.LOGS]: SavedviewtypesSourceDTO.logs,
+		[DataSource.TRACES]: SavedviewtypesSourceDTO.traces,
+		[DataSource.METRICS]: SavedviewtypesSourceDTO.metrics,
+		meter: SavedviewtypesSourceDTO.meter,
+	};
+
+export function toSavedViewSource(
+	sourcePage: SavedViewSourcePage,
+): SavedviewtypesSourceDTO {
+	return SAVED_VIEW_SOURCE[sourcePage];
+}
+
+// Explorers only save builder queries; v2 carries no queryType, so it is fixed here.
+export function getSavedViewQuery(view: SavedviewtypesSavedViewDTO): Query {
+	const { queries, panelType } = view.spec;
+	return mapQueryDataFromApi({
+		queries: queries as QueryEnvelope[],
+		panelType: panelType as unknown as PANEL_TYPES,
+		queryType: EQueryType.QUERY_BUILDER,
+		unit: undefined,
+	});
+}
+
+export function findSavedView(
+	views: SavedviewtypesSavedViewDTO[] | null | undefined,
+	id: string,
+): SavedviewtypesSavedViewDTO | undefined {
+	return views?.find((view) => view.id === id);
+}

frontend/src/container/ServiceApplication/ServiceMetrics/ServiceMetricTable.tsx

@@ -9,7 +9,6 @@ import { Typography } from '@signozhq/ui/typography';
 import { ResizeTable } from 'components/ResizeTable';
 import { ENTITY_VERSION_V4 } from 'constants/app';
 import { MAX_RPS_LIMIT } from 'constants/global';
-import { useBottomStripLeft } from 'container/BottomStrip/useBottomStripLeft';
 import ResourceAttributesFilter from 'container/ResourceAttributesFilter';
 import { useGetQueriesRange } from 'hooks/queryBuilder/useGetQueriesRange';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
@@ -21,7 +20,6 @@ import { GlobalReducer } from 'types/reducer/globalTime';
 import { getTotalRPS } from 'utils/services';
 
 import { getColumns } from '../Columns/ServiceColumn';
-import StripInfo from '../StripInfo/StripInfo';
 import { ServiceMetricsTableProps } from '../types';
 import { getServiceListFromQuery } from '../utils';
 
@@ -69,10 +67,6 @@ function ServiceMetricTable({
 		[isLoading, queries, topLevelOperations],
 	);
 
-	useBottomStripLeft(
-		useMemo(() => <StripInfo count={services.length} />, [services.length]),
-	);
-
 	const { search } = useLocation();
 	const tableColumns = useMemo(() => getColumns(search, true), [search]);
 	const [RPS, setRPS] = useState(0);

frontend/src/container/ServiceApplication/ServiceTraces/index.tsx

@@ -6,10 +6,7 @@ import localStorageSet from 'api/browser/localstorage/set';
 import logEvent from 'api/common/logEvent';
 import { SKIP_ONBOARDING } from 'constants/onboarding';
 import useErrorNotification from 'hooks/useErrorNotification';
-import { useBottomStripLeft } from 'container/BottomStrip/useBottomStripLeft';
 import { useQueryService } from 'hooks/useQueryService';
-
-import StripInfo from '../StripInfo/StripInfo';
 import useResourceAttribute from 'hooks/useResourceAttribute';
 import {
 	convertRawQueriesToTraceSelectedTags,
@@ -45,10 +42,6 @@ function ServiceTraces(): JSX.Element {
 
 	const services = data || [];
 
-	useBottomStripLeft(
-		useMemo(() => <StripInfo count={services.length} />, [services.length]),
-	);
-
 	const [skipOnboarding, setSkipOnboarding] = useState(
 		localStorageGet(SKIP_ONBOARDING) === 'true',
 	);

frontend/src/container/ServiceApplication/StripInfo/StripInfo.tsx

@@ -1,12 +0,0 @@
-import StripTypography from 'container/BottomStrip/components/StripTypography/StripTypography';
-import { pluralize } from 'utils/pluralize';
-
-interface StripInfoProps {
-	count: number;
-}
-
-function StripInfo({ count }: StripInfoProps): JSX.Element {
-	return <StripTypography>{pluralize(count, 'service')}</StripTypography>;
-}
-
-export default StripInfo;

frontend/src/container/ServiceApplication/StripInfo/__tests__/StripInfo.test.tsx

@@ -1,23 +0,0 @@
-import { render } from 'tests/test-utils';
-
-import StripInfo from '../StripInfo';
-
-describe('StripInfo', () => {
-	it('shows how many services are listed', () => {
-		const { getByText } = render(<StripInfo count={18} />);
-
-		expect(getByText('18 services')).toBeInTheDocument();
-	});
-
-	it('says service, not services, when there is one', () => {
-		const { getByText } = render(<StripInfo count={1} />);
-
-		expect(getByText('1 service')).toBeInTheDocument();
-	});
-
-	it('shows zero when there are none', () => {
-		const { getByText } = render(<StripInfo count={0} />);
-
-		expect(getByText('0 services')).toBeInTheDocument();
-	});
-});

frontend/src/container/TriggeredAlerts/TriggeredAlerts.module.scss

@@ -2,7 +2,7 @@
 	display: flex;
 	flex-direction: column;
 	gap: 1rem;
-	flex: 1;
+	height: calc(100vh - 62px);
 	min-height: 400px;
 	padding-top: var(--spacing-8);
 }

frontend/src/container/Version/Version.styles.scss

@@ -1,4 +1,7 @@
 .version-container {
+	max-height: 100vh;
+	overflow: hidden;
+
 	.version-page-header {
 		border-bottom: 1px solid var(--l1-border);
 		background: var(--l1-background);

frontend/src/hooks/__tests__/useChatSupport.test.tsx

@@ -1,148 +0,0 @@
-import { renderHook } from '@testing-library/react';
-import { FeatureKeys } from 'constants/features';
-import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
-import { useAppContext } from 'providers/App/App';
-
-jest.mock('providers/App/App');
-jest.mock('hooks/useGetTenantLicense');
-
-const mockAppContext = useAppContext as jest.MockedFunction<
-	typeof useAppContext
->;
-const mockLicense = useGetTenantLicense as jest.MockedFunction<
-	typeof useGetTenantLicense
->;
-
-const flag = (name: FeatureKeys, active: boolean): Record<string, unknown> => ({
-	name,
-	active,
-	usage: 0,
-	usage_limit: -1,
-	route: '',
-});
-
-function setup({
-	chatSupport = true,
-	premiumSupport = false,
-	trialConverted = false,
-	isCloudUser = true,
-	isEnterpriseSelfHostedUser = false,
-	isLoggedIn = true,
-	pylonEnabled = true,
-	isFetchingFeatureFlags = false,
-	activeLicense = {} as unknown,
-	trialInfo = {} as unknown,
-} = {}): void {
-	window.signozBootData = {
-		settings: { pylon: { enabled: pylonEnabled } },
-	} as never;
-
-	mockAppContext.mockReturnValue({
-		featureFlags: [
-			flag(FeatureKeys.CHAT_SUPPORT, chatSupport),
-			flag(FeatureKeys.PREMIUM_SUPPORT, premiumSupport),
-		],
-		isFetchingFeatureFlags,
-		featureFlagsFetchError: null,
-		trialInfo: trialInfo && { trialConvertedToSubscription: trialConverted },
-		isLoggedIn,
-		activeLicense,
-	} as never);
-
-	mockLicense.mockReturnValue({
-		isCloudUser,
-		isEnterpriseSelfHostedUser,
-	} as never);
-}
-
-const state = (): ChatSupportState =>
-	renderHook(() => useChatSupport()).result.current;
-
-describe('useChatSupport', () => {
-	beforeEach(() => jest.clearAllMocks());
-
-	describe('pylon', () => {
-		it('hands off to Pylon for a cloud user past trial', () => {
-			setup({ trialConverted: true });
-
-			expect(state()).toBe(ChatSupportState.Pylon);
-		});
-
-		it('hands off to Pylon for enterprise self-hosted', () => {
-			setup({
-				trialConverted: true,
-				isCloudUser: false,
-				isEnterpriseSelfHostedUser: true,
-			});
-
-			expect(state()).toBe(ChatSupportState.Pylon);
-		});
-
-		it('hands off to Pylon when premium support is on, card or not', () => {
-			setup({ premiumSupport: true, trialConverted: false });
-
-			expect(state()).toBe(ChatSupportState.Pylon);
-		});
-
-		it('offers nothing when Pylon is not configured server side', () => {
-			setup({ trialConverted: true, pylonEnabled: false });
-
-			expect(state()).toBe(ChatSupportState.Unavailable);
-		});
-	});
-
-	describe('needsCard', () => {
-		it('offers the card flow to a cloud user still on trial', () => {
-			setup({ trialConverted: false, premiumSupport: false });
-
-			expect(state()).toBe(ChatSupportState.NeedsCard);
-		});
-
-		it('offers nothing to a non-cloud user needing a card', () => {
-			setup({
-				trialConverted: false,
-				isCloudUser: false,
-				isEnterpriseSelfHostedUser: true,
-			});
-
-			expect(state()).toBe(ChatSupportState.Unavailable);
-		});
-	});
-
-	describe('unavailable', () => {
-		it('offers nothing without the chat support flag', () => {
-			setup({ chatSupport: false });
-
-			expect(state()).toBe(ChatSupportState.Unavailable);
-		});
-
-		it('offers nothing when logged out', () => {
-			setup({ isLoggedIn: false });
-
-			expect(state()).toBe(ChatSupportState.Unavailable);
-		});
-
-		it('offers nothing while the flags are still loading', () => {
-			setup({ isFetchingFeatureFlags: true });
-
-			expect(state()).toBe(ChatSupportState.Unavailable);
-		});
-
-		it('offers nothing before the licence has loaded', () => {
-			setup({ activeLicense: null });
-
-			expect(state()).toBe(ChatSupportState.Unavailable);
-		});
-
-		it('offers nothing on a tenant that is neither cloud nor enterprise', () => {
-			setup({
-				trialConverted: true,
-				isCloudUser: false,
-				isEnterpriseSelfHostedUser: false,
-			});
-
-			expect(state()).toBe(ChatSupportState.Unavailable);
-		});
-	});
-});

frontend/src/hooks/saveViews/useDeleteView.ts

@@ -1,11 +1,18 @@
-import { useMutation, UseMutationResult } from 'react-query';
+import { useMutation, UseMutationResult, useQueryClient } from 'react-query';
+import { invalidateListSavedViews } from 'api/generated/services/saved-view';
 import { deleteView } from 'api/saveView/deleteView';
 import { DeleteViewPayloadProps } from 'types/api/saveViews/types';
 
 export const useDeleteView = (
 	uuid: string,
-): UseMutationResult<DeleteViewPayloadProps, Error, string> =>
-	useMutation({
+): UseMutationResult<DeleteViewPayloadProps, Error, string> => {
+	const queryClient = useQueryClient();
+
+	return useMutation({
 		mutationKey: [uuid],
 		mutationFn: () => deleteView(uuid),
+		// v1 and v2 share storage; consumers already on v2 must see this write.
+		// Temporary till the v1 client is deleted with the explorer bar.
+		onSuccess: () => invalidateListSavedViews(queryClient),
 	});
+};

frontend/src/hooks/saveViews/useSaveView.ts

@@ -1,4 +1,5 @@
-import { useMutation, UseMutationResult } from 'react-query';
+import { useMutation, UseMutationResult, useQueryClient } from 'react-query';
+import { invalidateListSavedViews } from 'api/generated/services/saved-view';
 import { saveView } from 'api/saveView/saveView';
 import { AxiosResponse } from 'axios';
 import { SaveViewPayloadProps, SaveViewProps } from 'types/api/saveViews/types';
@@ -13,8 +14,14 @@ export const useSaveView = ({
 	Error,
 	SaveViewProps,
 	SaveViewPayloadProps
-> =>
-	useMutation({
+> => {
+	const queryClient = useQueryClient();
+
+	return useMutation({
 		mutationKey: [viewName, sourcePage, compositeQuery, extraData],
 		mutationFn: saveView,
+		// v1 and v2 share storage; consumers already on v2 must see this write.
+		// Temporary till the v1 client is deleted with the explorer bar.
+		onSuccess: () => invalidateListSavedViews(queryClient),
 	});
+};

frontend/src/hooks/saveViews/useUpdateView.ts

@@ -1,4 +1,5 @@
-import { useMutation, UseMutationResult } from 'react-query';
+import { useMutation, UseMutationResult, useQueryClient } from 'react-query';
+import { invalidateListSavedViews } from 'api/generated/services/saved-view';
 import { updateView } from 'api/saveView/updateView';
 import {
 	UpdateViewPayloadProps,
@@ -16,8 +17,10 @@ export const useUpdateView = ({
 	Error,
 	UpdateViewProps,
 	UpdateViewPayloadProps
-> =>
-	useMutation({
+> => {
+	const queryClient = useQueryClient();
+
+	return useMutation({
 		mutationKey: [viewName, sourcePage, compositeQuery, extraData],
 		mutationFn: () =>
 			updateView({
@@ -27,4 +30,8 @@ export const useUpdateView = ({
 				sourcePage,
 				viewKey,
 			}),
+		// v1 and v2 share storage; consumers already on v2 must see this write.
+		// Temporary till the v1 client is deleted with the explorer bar.
+		onSuccess: () => invalidateListSavedViews(queryClient),
 	});
+};

frontend/src/hooks/useChatSupport.ts

@@ -1,70 +0,0 @@
-import { FeatureKeys } from 'constants/features';
-import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
-import { useAppContext } from 'providers/App/App';
-import { useMemo } from 'react';
-
-export enum ChatSupportState {
-	/** Pylon is configured for this user — hand off to the widget. */
-	Pylon = 'pylon',
-	/** Trial without a card — offer the Add Credit Card flow instead. */
-	NeedsCard = 'needsCard',
-	/** No support entry at all. */
-	Unavailable = 'unavailable',
-}
-
-export function useChatSupport(): ChatSupportState {
-	const {
-		featureFlags,
-		isFetchingFeatureFlags,
-		featureFlagsFetchError,
-		trialInfo,
-		isLoggedIn,
-		activeLicense,
-	} = useAppContext();
-	const { isCloudUser, isEnterpriseSelfHostedUser } = useGetTenantLicense();
-
-	return useMemo(() => {
-		const isReady =
-			!isFetchingFeatureFlags &&
-			(featureFlags || featureFlagsFetchError) &&
-			activeLicense &&
-			trialInfo;
-		if (!isReady || !isLoggedIn) {
-			return ChatSupportState.Unavailable;
-		}
-
-		const flag = (name: FeatureKeys): boolean =>
-			featureFlags?.find((f) => f.name === name)?.active || false;
-
-		if (!flag(FeatureKeys.CHAT_SUPPORT)) {
-			return ChatSupportState.Unavailable;
-		}
-
-		const needsCard =
-			!flag(FeatureKeys.PREMIUM_SUPPORT) &&
-			!trialInfo?.trialConvertedToSubscription;
-
-		if (needsCard) {
-			// The credit card flow is cloud-only
-			return isCloudUser
-				? ChatSupportState.NeedsCard
-				: ChatSupportState.Unavailable;
-		}
-
-		const pylonConfigured = Boolean(
-			window.signozBootData?.settings?.pylon?.enabled,
-		);
-		return (isCloudUser || isEnterpriseSelfHostedUser) && pylonConfigured
-			? ChatSupportState.Pylon
-			: ChatSupportState.Unavailable;
-	}, [
-		activeLicense,
-		featureFlags,
-		featureFlagsFetchError,
-		isCloudUser,
-		isEnterpriseSelfHostedUser,
-		isFetchingFeatureFlags,
-		isLoggedIn,
-		trialInfo,
-	]);
-}

frontend/src/hooks/useSavedViewEnabled.ts

@@ -1,11 +0,0 @@
-import getLocalStorageKey from 'api/browser/localstorage/get';
-import { LOCALSTORAGE } from 'constants/localStorage';
-import { useState } from 'react';
-
-export function useSavedViewEnabled(): boolean {
-	const [isEnabled] = useState(
-		() => getLocalStorageKey(LOCALSTORAGE.SAVED_VIEW_ENABLED) === 'true',
-	);
-
-	return isEnabled;
-}

frontend/src/pages/AIAssistantPage/AIAssistantPage.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef } from 'react';
+import { useCallback, useEffect, useRef } from 'react';
 import { useHistory, useLocation, useParams } from 'react-router-dom';
 
 import logEvent from 'api/common/logEvent';
@@ -10,9 +10,6 @@ import { normalizePage } from 'container/AIAssistant/hooks/useAIAssistantAnalyti
 import { useAIAssistantStore } from 'container/AIAssistant/store/useAIAssistantStore';
 import { VariantContext } from 'container/AIAssistant/VariantContext';
 import Noz from 'components/Noz/Noz';
-import { useBottomStripLeft } from 'container/BottomStrip/useBottomStripLeft';
-
-import StripInfo from './StripInfo/StripInfo';
 
 import styles from './AIAssistantPage.module.scss';
 import ConversationsList from 'container/AIAssistant/components/ConversationsList';
@@ -44,8 +41,6 @@ export default function AIAssistantPage(): JSX.Element {
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, []);
 
-	useBottomStripLeft(useMemo(() => <StripInfo />, []));
-
 	const conversations = useAIAssistantStore((s) => s.conversations);
 	const activeConversationId = useAIAssistantStore(
 		(s) => s.activeConversationId,

frontend/src/pages/AIAssistantPage/StripInfo/StripInfo.tsx

@@ -1,15 +0,0 @@
-import { useAIAssistantStore } from 'container/AIAssistant/store/useAIAssistantStore';
-import StripTypography from 'container/BottomStrip/components/StripTypography/StripTypography';
-import { pluralize } from 'utils/pluralize';
-
-function StripInfo(): JSX.Element {
-	const conversations = useAIAssistantStore((state) => state.conversations);
-
-	const count = Object.values(conversations).filter(
-		(conversation) => !conversation.archived,
-	).length;
-
-	return <StripTypography>{pluralize(count, 'conversation')}</StripTypography>;
-}
-
-export default StripInfo;

frontend/src/pages/AIAssistantPage/StripInfo/__tests__/StripInfo.test.tsx

@@ -1,38 +0,0 @@
-import { useAIAssistantStore } from 'container/AIAssistant/store/useAIAssistantStore';
-import { render } from 'tests/test-utils';
-
-import StripInfo from '../StripInfo';
-
-function seed(conversations: Record<string, unknown>): void {
-	useAIAssistantStore.setState({ conversations } as never);
-}
-
-describe('StripInfo', () => {
-	it('counts only the conversations that are not archived', () => {
-		seed({
-			a: { id: 'a' },
-			b: { id: 'b' },
-			c: { id: 'c', archived: true },
-		});
-
-		const { getByText } = render(<StripInfo />);
-
-		expect(getByText('2 conversations')).toBeInTheDocument();
-	});
-
-	it('says one conversation, not 1 conversations', () => {
-		seed({ a: { id: 'a' } });
-
-		const { getByText } = render(<StripInfo />);
-
-		expect(getByText('1 conversation')).toBeInTheDocument();
-	});
-
-	it('shows zero when there are none', () => {
-		seed({});
-
-		const { getByText } = render(<StripInfo />);
-
-		expect(getByText('0 conversations')).toBeInTheDocument();
-	});
-});

frontend/src/pages/AlertList/AlertList.styles.scss

@@ -1,29 +1,4 @@
 .alerts-container {
-	// Hands the page height down to the active tab so its content can bound itself
-	// instead of guessing with 100vh. Child combinators only, nested Tabs
-	// (Configuration) must not be caught.
-	flex: 1;
-	min-height: 0;
-
-	> .ant-tabs-content-holder {
-		display: flex;
-		flex-direction: column;
-
-		> .ant-tabs-content {
-			flex: 1;
-			min-height: 0;
-			display: flex;
-			flex-direction: column;
-
-			> .ant-tabs-tabpane-active {
-				flex: 1;
-				min-height: 0;
-				display: flex;
-				flex-direction: column;
-			}
-		}
-	}
-
 	.top-level-tab.periscope-tab {
 		padding: 2px 0;
 	}
@@ -65,9 +40,5 @@
 
 	.alert-rules-container {
 		margin-top: 10px;
-		flex: 1;
-		min-height: 0;
-		display: flex;
-		flex-direction: column;
 	}
 }

frontend/src/pages/AllErrors/stories/AllErrors.stories.tsx

@@ -98,17 +98,30 @@ export const QuickFiltersSettings: Story = {
 	play: openQuickFiltersSettings,
 };
 
+const dirtyQuickFiltersSettings = async (): Promise<void> => {
+	await openQuickFiltersSettings();
+
+	// One Remove per added filter; the first row's is the one clicked.
+	const [removeFilter] = await screen.findAllByRole('button', {
+		name: 'Remove',
+	});
+
+	await userEvent.click(removeFilter);
+	await screen.findByRole('button', { name: 'Save changes' });
+};
+
 /** Settings with an unsaved filter removal and the fixed action footer. */
 export const QuickFiltersSettingsDirty: Story = {
-	play: async (): Promise<void> => {
-		await openQuickFiltersSettings();
-
-		// One Remove per added filter; the first row's is the one clicked.
-		const [removeFilter] = await screen.findAllByRole('button', {
-			name: 'Remove',
-		});
-
-		await userEvent.click(removeFilter);
-		await screen.findByRole('button', { name: 'Save changes' });
-	},
+	play: dirtyQuickFiltersSettings,
+};
+
+/**
+ * The same panel with a banner above the shell. The banner takes 48px off the
+ * layout, so this is the case where the footer used to be pushed off screen:
+ * the panel is sized from the filters pane rather than the viewport, which
+ * keeps Save changes reachable.
+ */
+export const QuickFiltersSettingsWithBanner: Story = {
+	args: { banner: 'trial-expiry' },
+	play: dirtyQuickFiltersSettings,
 };

frontend/src/pages/ApiMonitoring/stories/ApiMonitoringPage.stories.mocks.tsx

@@ -8,6 +8,7 @@ import {
 	QuickfiltertypesSourceDTO,
 	TelemetrytypesFieldContextDTO,
 	TelemetrytypesFieldDataTypeDTO,
+	TelemetrytypesSignalDTO,
 } from 'api/generated/services/sigNoz.schemas';
 import ROUTES from 'constants/routes';
 import { VIEWS } from 'container/ApiMonitoring/Explorer/Domains/DomainDetails/constants';
@@ -24,7 +25,10 @@ import {
 	toggleControl,
 } from '@/storybook/controls/controls';
 import { defineStoryMocks } from '@/storybook/controls/defineStoryMocks';
-import { fieldValuesResponse } from '@/storybook/msw/__story_mockdata__/fields';
+import {
+	fieldKeysResponse,
+	fieldValuesResponse,
+} from '@/storybook/msw/__story_mockdata__/fields';
 import { quickFiltersResponse } from '@/storybook/msw/__story_mockdata__/quickFilters';
 
 import {
@@ -317,6 +321,21 @@ export const apiMonitoringMocks = defineStoryMocks({
 			})),
 		),
 
+		rest.get(
+			'http://localhost/api/v1/fields/keys',
+			response.json((req) =>
+				fieldKeysResponse(
+					groupByAttributeKeys(req.url.searchParams.get('searchText') ?? '').map(
+						({ key }) => key,
+					),
+					{
+						signal: TelemetrytypesSignalDTO.traces,
+						fieldContext: TelemetrytypesFieldContextDTO.attribute,
+					},
+				),
+			),
+		),
+
 		rest.get(
 			'http://localhost/api/v1/fields/values',
 			response.json((req) =>

frontend/src/pages/ApiMonitoring/stories/ApiMonitoringPage.stories.tsx

@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { expect, userEvent, waitFor, within } from 'storybook/test';
+import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
 
 import { storyMocks } from '@/storybook/controls/defineStoryMocks';
 import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
@@ -59,6 +59,35 @@ export const PortDomain: Story = {
 /** The page fetches before it renders a filter, which outlasts the 1s default. */
 const untilLoaded = { timeout: 15_000 };
 
+const openQuickFiltersSettings = async (): Promise<void> => {
+	// The settings control renders disabled while its permission check is in
+	// flight and is swapped for the enabled one once the check answers, so it is
+	// looked up again on every attempt; a click on the disabled one is dropped in
+	// silence.
+	const control = await waitFor(() => {
+		const settings = screen.getByTestId('settings-icon-container');
+
+		expect(settings).toBeEnabled();
+
+		return settings;
+	}, untilLoaded);
+
+	await userEvent.click(control);
+	await screen.findByText('Edit quick filters', undefined, untilLoaded);
+};
+
+const dirtyQuickFiltersSettings = async (): Promise<void> => {
+	await openQuickFiltersSettings();
+
+	// One Remove per added filter; the first row's is the one clicked.
+	const [removeFilter] = await screen.findAllByRole('button', {
+		name: 'Remove',
+	});
+
+	await userEvent.click(removeFilter);
+	await screen.findByRole('button', { name: 'Save changes' });
+};
+
 /**
  * The quick-filter panel has no test id of its own, and it only mounts once the
  * workspace's filters have answered.
@@ -143,3 +172,24 @@ export const NoExternalCalls: Story = {
 export const Loading: Story = {
 	args: { dataState: 'loading' },
 };
+
+/** The editable quick-filter settings panel. */
+export const QuickFiltersSettings: Story = {
+	play: openQuickFiltersSettings,
+};
+
+/** Settings with an unsaved filter removal and the fixed action footer. */
+export const QuickFiltersSettingsDirty: Story = {
+	play: dirtyQuickFiltersSettings,
+};
+
+/**
+ * The same panel with a banner above the shell. The banner takes 48px off the
+ * layout, so this is the case where the footer used to be pushed off screen:
+ * the panel is sized from the filters pane rather than the viewport, which
+ * keeps Save changes reachable.
+ */
+export const QuickFiltersSettingsWithBanner: Story = {
+	args: { banner: 'trial-expiry' },
+	play: dirtyQuickFiltersSettings,
+};

frontend/src/pages/DashboardPage/DashboardContainer/components/LockedIndicator/LockedIndicator.module.scss

@@ -2,9 +2,7 @@
 	display: flex;
 	flex-direction: column;
 	position: fixed;
-	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
-	// UI belongs in the bounded layout, not in another offset here.
-	bottom: var(--bottom-strip-height, 0px);
+	bottom: 0;
 	left: 0;
 	width: 100%;
 	z-index: 100;

frontend/src/pages/HomePage/stories/HomePage.stories.mocks.tsx

@@ -164,10 +164,10 @@ export const homeMocks = defineStoryMocks({
 		),
 
 		rest.get(
-			'http://localhost/api/v1/explorer/views',
+			'http://localhost/api/v2/saved_views',
 			response.json((req) => {
-				const sourcePage = req.url.searchParams.get('sourcePage') ?? 'logs';
-				const signal = isSavedViewSignal(sourcePage) ? sourcePage : 'logs';
+				const source = req.url.searchParams.get('source') ?? 'logs';
+				const signal = isSavedViewSignal(source) ? source : 'logs';
 
 				return savedViewsResponse(
 					values.savedViewSignals.includes(signal) ? values.savedViews : 0,

frontend/src/pages/HomePage/stories/__story_mockdata__/home.ts

@@ -6,10 +6,21 @@
 import { FeatureKeys } from 'constants/features';
 import { ORG_PREFERENCES } from 'constants/orgPreferences';
 import { checkListStepToPreferenceKeyMap } from 'container/Home/constants';
-import type { RuletypesRuleDTO } from 'api/generated/services/sigNoz.schemas';
+import {
+	type ListSavedViews200,
+	Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5LogAggregationDTOSignal as LogsSignal,
+	Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5MetricAggregationDTOSignal as MetricsSignal,
+	Querybuildertypesv5QueryBuilderQueryGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5TraceAggregationDTOSignal as TracesSignal,
+	Querybuildertypesv5QueryEnvelopeBuilderDTOType,
+	type Querybuildertypesv5QueryEnvelopeDTO,
+	Querybuildertypesv5RequestTypeDTO,
+	type RuletypesRuleDTO,
+	SavedviewtypesPanelTypeDTO,
+	SavedviewtypesSchemaVersionDTO,
+	SavedviewtypesSourceDTO,
+} from 'api/generated/services/sigNoz.schemas';
 import type { ServiceDataProps } from 'api/metrics/getTopLevelOperations';
 import { alertRulesFixture } from 'mocks-server/__mockdata__/alert_rules';
-import { explorerView } from 'mocks-server/__mockdata__/explorer_views';
 import { defaultFeatureFlags } from 'tests/fixtures/appContextMock';
 import type { FeatureFlagProps } from 'types/api/features/getFeaturesFlags';
 import type { MetricRangePayloadV3 } from 'types/api/metrics/getQueryRange';
@@ -165,20 +176,53 @@ const VIEW_NAMES: Record<SavedViewSignal, string[]> = {
 export const isSavedViewSignal = (value: string): value is SavedViewSignal =>
 	SAVED_VIEW_SIGNALS.includes(value as SavedViewSignal);
 
+const SAVED_VIEW_SOURCE: Record<SavedViewSignal, SavedviewtypesSourceDTO> = {
+	logs: SavedviewtypesSourceDTO.logs,
+	traces: SavedviewtypesSourceDTO.traces,
+	metrics: SavedviewtypesSourceDTO.metrics,
+};
+
+const SAVED_VIEW_QUERY: Record<
+	SavedViewSignal,
+	Querybuildertypesv5QueryEnvelopeDTO
+> = {
+	logs: {
+		type: Querybuildertypesv5QueryEnvelopeBuilderDTOType.builder_query,
+		spec: { name: 'A', signal: LogsSignal.logs },
+	},
+	traces: {
+		type: Querybuildertypesv5QueryEnvelopeBuilderDTOType.builder_query,
+		spec: { name: 'A', signal: TracesSignal.traces },
+	},
+	metrics: {
+		type: Querybuildertypesv5QueryEnvelopeBuilderDTOType.builder_query,
+		spec: { name: 'A', signal: MetricsSignal.metrics },
+	},
+};
+
 export const savedViewsResponse = (
 	count: number,
-	sourcePage: SavedViewSignal,
-): Record<string, unknown> => {
-	const names = VIEW_NAMES[sourcePage];
+	signal: SavedViewSignal,
+): ListSavedViews200 => {
+	const names = VIEW_NAMES[signal];
 
 	return {
 		status: 'success',
 		data: Array.from({ length: Math.min(count, names.length) }, (_, index) => ({
-			...explorerView.data[0],
-			id: `storybook-${sourcePage}-view-${index + 1}`,
-			name: names[index],
-			sourcePage,
-			tags: [sourcePage],
+			id: `storybook-${signal}-view-${index + 1}`,
+			name: `storybook-${signal}-view-${index + 1}`,
+			source: SAVED_VIEW_SOURCE[signal],
+			schemaVersion: SavedviewtypesSchemaVersionDTO.v2,
+			createdAt: '2026-08-20T09:00:00Z',
+			createdBy: 'storybook@signoz.io',
+			updatedAt: '2026-08-20T09:00:00Z',
+			updatedBy: 'storybook@signoz.io',
+			spec: {
+				displayName: names[index],
+				panelType: SavedviewtypesPanelTypeDTO.list,
+				requestType: Querybuildertypesv5RequestTypeDTO.raw,
+				queries: [SAVED_VIEW_QUERY[signal]],
+			},
 		})),
 	};
 };

frontend/src/pages/LLMObservability/Explorer/stories/Explorer.stories.tsx

@@ -146,11 +146,39 @@ export const Failed: Story = {
 	parameters: { allowConsoleErrors: true },
 };
 
+const dirtyQuickFiltersSettings = async (): Promise<void> => {
+	await openQuickFiltersSettings();
+
+	// One Remove per added filter; the first row's is the one clicked.
+	const [removeFilter] = await screen.findAllByRole('button', {
+		name: 'Remove',
+	});
+
+	await userEvent.click(removeFilter);
+	await screen.findByRole('button', { name: 'Save changes' });
+};
+
 /** The editable quick-filter settings panel. */
 export const QuickFiltersSettings: Story = {
 	play: openQuickFiltersSettings,
 };
 
+/** Settings with an unsaved filter removal and the fixed action footer. */
+export const QuickFiltersSettingsDirty: Story = {
+	play: dirtyQuickFiltersSettings,
+};
+
+/**
+ * The same panel with a banner above the shell. The banner takes 48px off the
+ * layout, so this is the case where the footer used to be pushed off screen:
+ * the panel is sized from the filters pane rather than the viewport, which
+ * keeps Save changes reachable.
+ */
+export const QuickFiltersSettingsWithBanner: Story = {
+	args: { banner: 'trial-expiry' },
+	play: dirtyQuickFiltersSettings,
+};
+
 /** A quick-filter value selected against the LLM span query. */
 export const QuickFilterSelected: Story = {
 	play: async ({ canvasElement }): Promise<void> => {

frontend/src/pages/LogsModulePage/stories/LogsModulePage.stories.tsx

@@ -166,18 +166,31 @@ export const QuickFiltersSettings: Story = {
 	play: openQuickFiltersSettings,
 };
 
+const dirtyQuickFiltersSettings = async (): Promise<void> => {
+	await openQuickFiltersSettings();
+	// One Remove per added filter; the first row's is the one clicked.
+	const [removeFilter] = await screen.findAllByRole('button', {
+		name: 'Remove',
+	});
+
+	await userEvent.click(removeFilter);
+	await screen.findByRole('button', { name: 'Save changes' });
+};
+
 /** Settings with an unsaved filter removal and the fixed action footer. */
 export const QuickFiltersSettingsDirty: Story = {
-	play: async (): Promise<void> => {
-		await openQuickFiltersSettings();
-		// One Remove per added filter; the first row's is the one clicked.
-		const [removeFilter] = await screen.findAllByRole('button', {
-			name: 'Remove',
-		});
+	play: dirtyQuickFiltersSettings,
+};
 
-		await userEvent.click(removeFilter);
-		await screen.findByRole('button', { name: 'Save changes' });
-	},
+/**
+ * The same panel with a banner above the shell. The banner takes 48px off the
+ * layout, so this is the case where the footer used to be pushed off screen:
+ * the panel is sized from the filters pane rather than the viewport, which
+ * keeps Save changes reachable.
+ */
+export const QuickFiltersSettingsWithBanner: Story = {
+	args: { banner: 'trial-expiry' },
+	play: dirtyQuickFiltersSettings,
 };
 
 /**

frontend/src/pages/MeterExplorer/stories/MeterExplorer.stories.tsx

@@ -1,4 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
+import { expect, screen, userEvent, waitFor } from 'storybook/test';
 
 import { storyMocks } from '@/storybook/controls/defineStoryMocks';
 import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
@@ -18,6 +19,7 @@ const pageStory = storyMocks(meterMocks, { layout: 'app' });
  */
 const meta = {
 	title: 'Pages/Metering/Cost Meter',
+	tags: ['play'],
 	component: MeterExplorerPage,
 	...pageStory,
 	parameters: { ...pageStory.parameters },
@@ -27,6 +29,38 @@ export default meta;
 
 type Story = StoryObj<MeterArgs>;
 
+/** The page fetches before it renders its filters, which outlasts the 1s default. */
+const untilLoaded = { timeout: 15_000 };
+
+const openQuickFiltersSettings = async (): Promise<void> => {
+	// The settings control renders disabled while its permission check is in
+	// flight and is swapped for the enabled one once the check answers, so it is
+	// looked up again on every attempt; a click on the disabled one is dropped in
+	// silence.
+	const control = await waitFor(() => {
+		const settings = screen.getByTestId('settings-icon-container');
+
+		expect(settings).toBeEnabled();
+
+		return settings;
+	}, untilLoaded);
+
+	await userEvent.click(control);
+	await screen.findByText('Edit quick filters', undefined, untilLoaded);
+};
+
+const dirtyQuickFiltersSettings = async (): Promise<void> => {
+	await openQuickFiltersSettings();
+
+	// One Remove per added filter; the first row's is the one clicked.
+	const [removeFilter] = await screen.findAllByRole('button', {
+		name: 'Remove',
+	});
+
+	await userEvent.click(removeFilter);
+	await screen.findByRole('button', { name: 'Save changes' });
+};
+
 /**
  * The Meter tab over the last day: what the workspace ingested in total, then
  * the hourly count and size of log records, of spans, and the metric datapoints
@@ -88,3 +122,26 @@ export const ExplorerWithoutQuickFilters: Story = {
 export const ViewsEmpty: Story = {
 	args: { tab: 'views', savedViews: 0 },
 };
+
+/** The editable quick-filter settings panel, which lives on the Explorer tab. */
+export const QuickFiltersSettings: Story = {
+	args: { tab: 'explorer' },
+	play: openQuickFiltersSettings,
+};
+
+/** Settings with an unsaved filter removal and the fixed action footer. */
+export const QuickFiltersSettingsDirty: Story = {
+	args: { tab: 'explorer' },
+	play: dirtyQuickFiltersSettings,
+};
+
+/**
+ * The same panel with a banner above the shell. The banner takes 48px off the
+ * layout, so this is the case where the footer used to be pushed off screen:
+ * the panel is sized from the filters pane rather than the viewport, which
+ * keeps Save changes reachable.
+ */
+export const QuickFiltersSettingsWithBanner: Story = {
+	args: { tab: 'explorer', banner: 'trial-expiry' },
+	play: dirtyQuickFiltersSettings,
+};

frontend/src/pages/Support/Support.styles.scss

@@ -1,4 +1,7 @@
 .support-page-container {
+	max-height: 100vh;
+	overflow: hidden;
+
 	.support-page-header {
 		border-bottom: 1px solid var(--l1-border);
 		background: var(--l1-background);

frontend/src/pages/TraceDetailsV3/StripInfo/StripInfo.module.scss

@@ -1,3 +0,0 @@
-.hasErrors {
-	color: var(--destructive);
-}

frontend/src/pages/TraceDetailsV3/StripInfo/StripInfo.tsx

@@ -1,37 +0,0 @@
-import StripSeparator from 'container/BottomStrip/components/StripSeparator/StripSeparator';
-import StripTypography from 'container/BottomStrip/components/StripTypography/StripTypography';
-import cx from 'classnames';
-import { ChartNoAxesGantt, TriangleAlert } from '@signozhq/icons';
-
-import styles from './StripInfo.module.scss';
-
-interface StripInfoProps {
-	totalSpansCount: number;
-	totalErrorSpansCount: number;
-}
-
-function StripInfo({
-	totalSpansCount,
-	totalErrorSpansCount,
-}: StripInfoProps): JSX.Element {
-	return (
-		<>
-			<StripTypography prefix={<ChartNoAxesGantt size={13} />}>
-				Spans: {totalSpansCount}
-			</StripTypography>
-			<StripSeparator />
-			<StripTypography
-				prefix={
-					<TriangleAlert
-						size={13}
-						className={cx({ [styles.hasErrors]: totalErrorSpansCount > 0 })}
-					/>
-				}
-			>
-				Errors: {totalErrorSpansCount}
-			</StripTypography>
-		</>
-	);
-}
-
-export default StripInfo;

frontend/src/pages/TraceDetailsV3/StripInfo/__tests__/StripInfo.test.tsx

@@ -1,23 +0,0 @@
-import { render } from 'tests/test-utils';
-
-import StripInfo from '../StripInfo';
-
-describe('StripInfo', () => {
-	it('shows the span and error counts', () => {
-		const { getByText } = render(
-			<StripInfo totalSpansCount={600} totalErrorSpansCount={4} />,
-		);
-
-		expect(getByText('Spans: 600')).toBeInTheDocument();
-		expect(getByText('Errors: 4')).toBeInTheDocument();
-	});
-
-	it('shows zero counts rather than hiding them', () => {
-		const { getByText } = render(
-			<StripInfo totalSpansCount={0} totalErrorSpansCount={0} />,
-		);
-
-		expect(getByText('Spans: 0')).toBeInTheDocument();
-		expect(getByText('Errors: 0')).toBeInTheDocument();
-	});
-});

frontend/src/pages/TraceDetailsV3/TraceDetailsV3.module.scss

@@ -1,6 +1,5 @@
 .root {
-	flex: 1;
-	min-height: 0;
+	height: calc(100vh);
 	display: flex;
 	flex-direction: column;
 }

frontend/src/pages/TraceDetailsV3/index.tsx

@@ -14,9 +14,7 @@ import { Collapse } from 'antd';
 import { useDetailsPanel } from 'components/DetailsPanel';
 import WarningPopover from 'components/WarningPopover/WarningPopover';
 import { LOCALSTORAGE } from 'constants/localStorage';
-import { useBottomStripLeft } from 'container/BottomStrip/useBottomStripLeft';
 import useGetTraceV4 from 'hooks/trace/useGetTraceV4';
-import StripInfo from './StripInfo/StripInfo';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { ResizableBox } from 'periscope/components/ResizableBox';
@@ -146,19 +144,6 @@ function TraceDetailsV3(): JSX.Element {
 
 	const allSpans = traceData?.payload?.spans || [];
 	const totalSpansCount = traceData?.payload?.totalSpansCount || 0;
-	const totalErrorSpansCount = traceData?.payload?.totalErrorSpansCount || 0;
-
-	useBottomStripLeft(
-		useMemo(
-			() => (
-				<StripInfo
-					totalSpansCount={totalSpansCount}
-					totalErrorSpansCount={totalErrorSpansCount}
-				/>
-			),
-			[totalSpansCount, totalErrorSpansCount],
-		),
-	);
 	const isFullDataLoaded =
 		totalSpansCount > 0 && totalSpansCount <= allSpans.length;
 
@@ -456,10 +441,7 @@ function TraceDetailsV3(): JSX.Element {
 																})}
 															>
 																<TriangleAlert size={13} />
-																Errors:{' '}
-																{traceData.payload.totalErrorSpansCount ?? (
-																	<span className="translate-safe">{0}</span>
-																)}
+																Errors: {traceData.payload.totalErrorSpansCount ?? 0}
 															</span>
 														</span>
 													) : null}

frontend/src/pages/TracesFunnelDetails/TracesFunnelDetails.styles.scss

@@ -1,24 +1,13 @@
 .traces-funnel-details {
 	display: flex;
-	height: 100%;
+	// 45px -> height of the tab bar
+	height: calc(100vh - 45px);
 
 	&__steps-config {
 		flex-shrink: 0;
 		width: 600px;
 		border-right: 1px solid var(--l1-border);
-		// Positioning context for the absolute .steps-footer.
 		position: relative;
-		display: flex;
-		flex-direction: column;
-
-		// Scoped here so the modal usage of FunnelConfiguration on trace details
-		// stays in normal flow.
-		.funnel-configuration {
-			flex: 1;
-			min-height: 0;
-			display: flex;
-			flex-direction: column;
-		}
 	}
 	&__steps-results {
 		width: 100%;

frontend/src/pages/TracesFunnelDetails/components/FunnelConfiguration/FunnelConfiguration.styles.scss

@@ -4,17 +4,14 @@
 		flex-direction: column;
 		justify-content: flex-start;
 		&.funnel-details-page {
-			flex: 1;
-			min-height: 0;
-			// .steps-footer is absolute against the config column, so its 64px is
-			// reserved rather than laid out.
-			margin-bottom: 64px;
+			height: calc(
+				100vh - 170px
+			); // 64px bottom bar + 61px configuration header + 45px page navbar
 			overflow: auto;
 		}
 	}
 
 	&__header {
-		flex-shrink: 0;
 		display: flex;
 		align-items: center;
 		justify-content: space-between;

frontend/src/pages/TracesModulePage/stories/TracesModulePage.stories.tsx

@@ -116,16 +116,29 @@ export const QuickFiltersSettings: Story = {
 	play: openQuickFiltersSettings,
 };
 
+const dirtyQuickFiltersSettings = async (): Promise<void> => {
+	await openQuickFiltersSettings();
+	// One Remove per added filter; the first row's is the one clicked.
+	const [removeFilter] = await screen.findAllByRole('button', {
+		name: 'Remove',
+	});
+
+	await userEvent.click(removeFilter);
+	await screen.findByRole('button', { name: 'Save changes' });
+};
+
 /** Settings with an unsaved filter removal and the fixed action footer. */
 export const QuickFiltersSettingsDirty: Story = {
-	play: async (): Promise<void> => {
-		await openQuickFiltersSettings();
-		// One Remove per added filter; the first row's is the one clicked.
-		const [removeFilter] = await screen.findAllByRole('button', {
-			name: 'Remove',
-		});
-
-		await userEvent.click(removeFilter);
-		await screen.findByRole('button', { name: 'Save changes' });
-	},
+	play: dirtyQuickFiltersSettings,
+};
+
+/**
+ * The same panel with a banner above the shell. The banner takes 48px off the
+ * layout, so this is the case where the footer used to be pushed off screen:
+ * the panel is sized from the filters pane rather than the viewport, which
+ * keeps Save changes reachable.
+ */
+export const QuickFiltersSettingsWithBanner: Story = {
+	args: { banner: 'trial-expiry' },
+	play: dirtyQuickFiltersSettings,
 };

frontend/src/providers/preferences/__tests__/usePreferenceSync.test.tsx

@@ -0,0 +1,202 @@
+import { renderHook } from '@testing-library/react';
+import { useListSavedViews } from 'api/generated/services/saved-view';
+import {
+	SavedviewtypesSavedViewDTO,
+	SavedviewtypesSourceDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import {
+	defaultLogsSelectedColumns,
+	defaultTraceSelectedColumns,
+	ensureLogsRequiredColumns,
+} from 'container/OptionsMenu/constants';
+import { DataSource } from 'types/common/queryBuilder';
+
+import { usePreferenceSync } from '../sync/usePreferenceSync';
+import { PreferenceMode } from '../types';
+
+jest.mock('api/generated/services/saved-view');
+
+const loaderPreferences = { columns: [{ name: 'from-loader' }] };
+jest.mock('../loader/usePreferenceLoader', () => ({
+	usePreferenceLoader: jest.fn(() => ({
+		preferences: loaderPreferences,
+		loading: false,
+		error: null,
+	})),
+}));
+
+jest.mock('../updater/usePreferenceUpdater', () => ({
+	usePreferenceUpdater: jest.fn(() => ({
+		updateColumns: jest.fn(),
+		updateFormatting: jest.fn(),
+	})),
+}));
+
+const mockedUseListSavedViews = useListSavedViews as jest.MockedFunction<
+	typeof useListSavedViews
+>;
+
+function makeView(
+	id: string,
+	source: SavedviewtypesSourceDTO,
+	spec: Partial<SavedviewtypesSavedViewDTO['spec']>,
+): SavedviewtypesSavedViewDTO {
+	return {
+		id,
+		source,
+		schemaVersion: 'v2',
+		spec: {
+			displayName: id,
+			panelType: 'list',
+			requestType: 'raw',
+			queries: [],
+			...spec,
+		},
+	} as unknown as SavedviewtypesSavedViewDTO;
+}
+
+function mockViews(views: SavedviewtypesSavedViewDTO[]): void {
+	mockedUseListSavedViews.mockReturnValue({
+		data: { status: 'success', data: views },
+	} as unknown as ReturnType<typeof useListSavedViews>);
+}
+
+describe('usePreferenceSync in saved view mode', () => {
+	beforeEach(() => {
+		mockedUseListSavedViews.mockReset();
+	});
+
+	it('fetches the list for the data source only in saved view mode', () => {
+		mockViews([]);
+
+		renderHook(() =>
+			usePreferenceSync({
+				mode: PreferenceMode.DIRECT,
+				dataSource: DataSource.LOGS,
+				savedViewId: undefined,
+			}),
+		);
+
+		expect(mockedUseListSavedViews).toHaveBeenCalledWith(
+			{ source: 'logs' },
+			{ query: { enabled: false } },
+		);
+	});
+
+	it('returns loader preferences outside saved view mode', () => {
+		mockViews([]);
+
+		const { result } = renderHook(() =>
+			usePreferenceSync({
+				mode: PreferenceMode.DIRECT,
+				dataSource: DataSource.LOGS,
+				savedViewId: undefined,
+			}),
+		);
+
+		expect(result.current.preferences).toBe(loaderPreferences);
+	});
+
+	it('applies selectedFields and display of the active logs view', () => {
+		mockViews([
+			makeView('view-1', SavedviewtypesSourceDTO.logs, {
+				selectedFields: [{ name: 'service.name' }, { name: 'body' }],
+				display: { maxLines: 3, format: 'raw', fontSize: 'large', color: 'red' },
+			}),
+		]);
+
+		const { result } = renderHook(() =>
+			usePreferenceSync({
+				mode: PreferenceMode.SAVED_VIEW,
+				dataSource: DataSource.LOGS,
+				savedViewId: 'view-1',
+			}),
+		);
+
+		expect(result.current.preferences?.columns).toStrictEqual(
+			ensureLogsRequiredColumns([{ name: 'service.name' }, { name: 'body' }]),
+		);
+		expect(result.current.preferences?.formatting).toStrictEqual({
+			maxLines: 3,
+			format: 'raw',
+			fontSize: 'large',
+			version: 1,
+		});
+	});
+
+	it('falls back to defaults when the view has zero-valued display and no fields', () => {
+		mockViews([
+			makeView('view-1', SavedviewtypesSourceDTO.logs, {
+				selectedFields: undefined,
+				display: { maxLines: 0, format: '', fontSize: '', color: '' },
+			}),
+		]);
+
+		const { result } = renderHook(() =>
+			usePreferenceSync({
+				mode: PreferenceMode.SAVED_VIEW,
+				dataSource: DataSource.LOGS,
+				savedViewId: 'view-1',
+			}),
+		);
+
+		expect(result.current.preferences?.columns).toStrictEqual(
+			ensureLogsRequiredColumns(defaultLogsSelectedColumns),
+		);
+		expect(result.current.preferences?.formatting).toStrictEqual({
+			maxLines: 1,
+			format: 'table',
+			fontSize: 'small',
+			version: 1,
+		});
+	});
+
+	it('passes trace selectedFields through and defaults when absent', () => {
+		mockViews([
+			makeView('with-fields', SavedviewtypesSourceDTO.traces, {
+				selectedFields: [{ name: 'name' }, { name: 'durationNano' }],
+			}),
+			makeView('without-fields', SavedviewtypesSourceDTO.traces, {}),
+		]);
+
+		const withFields = renderHook(() =>
+			usePreferenceSync({
+				mode: PreferenceMode.SAVED_VIEW,
+				dataSource: DataSource.TRACES,
+				savedViewId: 'with-fields',
+			}),
+		);
+		const withoutFields = renderHook(() =>
+			usePreferenceSync({
+				mode: PreferenceMode.SAVED_VIEW,
+				dataSource: DataSource.TRACES,
+				savedViewId: 'without-fields',
+			}),
+		);
+
+		expect(withFields.result.current.preferences?.columns).toStrictEqual([
+			{ name: 'name' },
+			{ name: 'durationNano' },
+		]);
+		expect(withFields.result.current.preferences?.formatting).toBeUndefined();
+		expect(withoutFields.result.current.preferences?.columns).toBe(
+			defaultTraceSelectedColumns,
+		);
+	});
+
+	it('uses defaults when the saved view id is not in the list', () => {
+		mockViews([makeView('other', SavedviewtypesSourceDTO.logs, {})]);
+
+		const { result } = renderHook(() =>
+			usePreferenceSync({
+				mode: PreferenceMode.SAVED_VIEW,
+				dataSource: DataSource.LOGS,
+				savedViewId: 'missing',
+			}),
+		);
+
+		expect(result.current.preferences?.columns).toStrictEqual(
+			ensureLogsRequiredColumns(defaultLogsSelectedColumns),
+		);
+	});
+});

frontend/src/providers/preferences/sync/usePreferenceSync.ts

@@ -1,12 +1,14 @@
 /* eslint-disable sonarjs/cognitive-complexity */
 import { useEffect, useState } from 'react';
+import { useListSavedViews } from 'api/generated/services/saved-view';
 import { TelemetryFieldKey } from 'api/v5/v5';
 import {
 	defaultLogsSelectedColumns,
+	defaultTraceSelectedColumns,
 	ensureLogsRequiredColumns,
 } from 'container/OptionsMenu/constants';
-import { defaultSelectedColumns as defaultTracesSelectedColumns } from 'container/TracesExplorer/ListView/configs';
-import { useGetAllViews } from 'hooks/saveViews/useGetAllViews';
+import { FontSize, LogViewMode } from 'container/OptionsMenu/types';
+import { findSavedView, toSavedViewSource } from 'container/SavedViews/utils';
 import { DataSource } from 'types/common/queryBuilder';
 
 import { usePreferenceLoader } from '../loader/usePreferenceLoader';
@@ -28,16 +30,16 @@ export function usePreferenceSync({
 	updateColumns: (newColumns: TelemetryFieldKey[]) => void;
 	updateFormatting: (newFormatting: FormattingOptions) => void;
 } {
-	const { data: viewsData } = useGetAllViews(
-		dataSource,
-		mode === PreferenceMode.SAVED_VIEW,
+	const { data: viewsData } = useListSavedViews(
+		{ source: toSavedViewSource(dataSource) },
+		{ query: { enabled: mode === PreferenceMode.SAVED_VIEW } },
 	);
 
 	const [savedViewPreferences, setSavedViewPreferences] =
 		useState<Preferences | null>(null);
 
-	const updateExtraDataSelectColumns = (
-		columns: TelemetryFieldKey[],
+	const withColumnNames = (
+		columns: TelemetryFieldKey[] | undefined,
 	): TelemetryFieldKey[] | null => {
 		if (!columns) {
 			return null;
@@ -49,27 +51,28 @@ export function usePreferenceSync({
 	};
 
 	useEffect(() => {
-		const extraData = viewsData?.data?.data?.find(
-			(view) => view.id === savedViewId,
-		)?.extraData;
+		const spec = savedViewId
+			? findSavedView(viewsData?.data, savedViewId)?.spec
+			: undefined;
+		const selectedFields = spec?.selectedFields as
+			| TelemetryFieldKey[]
+			| undefined;
 
-		const parsedExtraData = JSON.parse(extraData || '{}');
 		let columns: TelemetryFieldKey[] = [];
 		let formatting: FormattingOptions | undefined;
 		if (dataSource === DataSource.LOGS) {
 			columns = ensureLogsRequiredColumns(
-				updateExtraDataSelectColumns(parsedExtraData?.selectColumns) ||
-					defaultLogsSelectedColumns,
+				withColumnNames(selectedFields) || defaultLogsSelectedColumns,
 			);
 			formatting = {
-				maxLines: parsedExtraData?.maxLines ?? 1,
-				format: parsedExtraData?.format ?? 'table',
-				fontSize: parsedExtraData?.fontSize ?? 'small',
-				version: parsedExtraData?.version ?? 1,
+				maxLines: spec?.display?.maxLines || 1,
+				format: (spec?.display?.format as LogViewMode) || 'table',
+				fontSize: (spec?.display?.fontSize as FontSize) || FontSize.SMALL,
+				version: 1,
 			};
 		}
 		if (dataSource === DataSource.TRACES) {
-			columns = parsedExtraData?.selectColumns || defaultTracesSelectedColumns;
+			columns = selectedFields || defaultTraceSelectedColumns;
 		}
 		setSavedViewPreferences({ columns, formatting });
 	}, [viewsData, dataSource, savedViewId, mode]);

frontend/src/styles.scss

@@ -813,12 +813,6 @@ body.ai-assistant-panel-open {
 	}
 }
 
-body.bottom-strip-on {
-	.PylonChat-chatWindowFrameContainer {
-		bottom: var(--bottom-strip-height, 0px) !important;
-	}
-}
-
 [role='tab'] {
 	color: var(--foreground) !important;
 }

pkg/apiserver/signozapiserver/alertmanager.go

@@ -145,6 +145,7 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusCreated,
 			ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusConflict},
 			Deprecated:          false,
+			Stability:           handler.StabilityDevelopment,
 			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceNotificationChannel.Scope(coretypes.VerbCreate)}),
 		},
 		handler.WithResourceDefs(handler.BasicResourceDef{
@@ -173,6 +174,7 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusOK,
 			ErrorStatusCodes:    []int{http.StatusBadRequest},
 			Deprecated:          false,
+			Stability:           handler.StabilityDevelopment,
 			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceNotificationChannel.Scope(coretypes.VerbList)}),
 		},
 		handler.WithResourceDefs(handler.BasicResourceDef{
@@ -199,6 +201,7 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusOK,
 			ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
 			Deprecated:          false,
+			Stability:           handler.StabilityDevelopment,
 			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceNotificationChannel.Scope(coretypes.VerbRead)}),
 		},
 		handler.WithResourceDefs(handler.BasicResourceDef{
@@ -226,6 +229,7 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusOK,
 			ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
 			Deprecated:          false,
+			Stability:           handler.StabilityDevelopment,
 			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceNotificationChannel.Scope(coretypes.VerbUpdate)}),
 		},
 		handler.WithResourceDefs(handler.BasicResourceDef{
@@ -253,6 +257,7 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusNoContent,
 			ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
 			Deprecated:          false,
+			Stability:           handler.StabilityDevelopment,
 			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceNotificationChannel.Scope(coretypes.VerbDelete)}),
 		},
 		handler.WithResourceDefs(handler.BasicResourceDef{
@@ -281,6 +286,7 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusOK,
 			ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
 			Deprecated:          false,
+			Stability:           handler.StabilityDevelopment,
 			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceNotificationChannel.Scope(coretypes.VerbUpdate)}),
 		},
 		handler.WithResourceDefs(handler.BasicResourceDef{
@@ -308,6 +314,7 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusNoContent,
 			ErrorStatusCodes:    []int{http.StatusBadRequest},
 			Deprecated:          false,
+			Stability:           handler.StabilityDevelopment,
 			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceNotificationChannel.Scope(coretypes.VerbCreate)}),
 		},
 		handler.WithResourceDefs(handler.BasicResourceDef{

pkg/apiserver/signozapiserver/ruler.go

@@ -15,10 +15,26 @@ func (provider *provider) addRulerRoutes(router *mux.Router) error {
 		ID:                  "ListRules",
 		Tags:                []string{"rules"},
 		Summary:             "List alert rules",
-		Description:         "This endpoint lists all alert rules with their current evaluation state",
+		Description:         "This endpoint lists all alert rules with their current evaluation state. Deprecated: use ListRulesV3, which supports filtering, sorting and pagination.",
 		Response:            make([]*ruletypes.Rule, 0),
 		ResponseContentType: "application/json",
 		SuccessStatusCode:   http.StatusOK,
+		Deprecated:          true,
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v3/rules", handler.New(provider.authzMiddleware.ViewAccess(provider.rulerHandler.ListRulesV3), handler.OpenAPIDef{
+		ID:                  "ListRulesV3",
+		Tags:                []string{"rules"},
+		Summary:             "List alert rules (v3)",
+		Description:         "Returns a page of alert rules with their current evaluation state, trimmed to the fields the list page renders. Supports a filter DSL (`query`), a repeated `states` filter applied after the state overlay, sort (`updated_at`/`created_at`/`name`/`state`/`severity`), order (`asc`/`desc`), and offset-based pagination (`limit`/`offset`). In the filter DSL, a non-reserved key is matched as a rule label directly (`team = infra`); a key that collides with a reserved keyword matches either interpretation (negative operators exclude both), and `labels.<key>` targets only the label. The response also carries the org's label pairs and the reserved filter keys for building filter suggestions.",
+		RequestQuery:        new(ruletypes.ListRulesParams),
+		Response:            new(ruletypes.ListableRules),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		ErrorStatusCodes:    []int{http.StatusBadRequest},
 		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
 	})).Methods(http.MethodGet).GetError(); err != nil {
 		return err

pkg/http/handler/handler_test.go

@@ -0,0 +1,75 @@
+package handler
+
+import (
+	"net/http"
+	"testing"
+
+	"github.com/gorilla/mux"
+	"github.com/stretchr/testify/assert"
+	"github.com/stretchr/testify/require"
+	"github.com/swaggest/openapi-go"
+	"github.com/swaggest/openapi-go/openapi3"
+)
+
+type bespokeOpenAPIHandler struct{}
+
+func (bespokeOpenAPIHandler) ServeHTTP(http.ResponseWriter, *http.Request) {}
+
+func (bespokeOpenAPIHandler) ServeOpenAPI(opCtx openapi.OperationContext) {
+	opCtx.SetID("Bespoke")
+	opCtx.AddRespStructure(nil, openapi.WithHTTPStatus(http.StatusOK))
+}
+
+func (bespokeOpenAPIHandler) ResourceDefs() []ResourceDef { return nil }
+
+func TestAttachStabilities(t *testing.T) {
+	router := mux.NewRouter()
+	router.Handle("/development", New(func(http.ResponseWriter, *http.Request) {}, OpenAPIDef{ID: "Development", SuccessStatusCode: http.StatusOK, Stability: StabilityDevelopment})).Methods(http.MethodGet)
+	router.Handle("/beta/{id}", New(func(http.ResponseWriter, *http.Request) {}, OpenAPIDef{ID: "Beta", SuccessStatusCode: http.StatusOK, Stability: StabilityBeta})).Methods(http.MethodPut)
+	router.Handle("/unset", New(func(http.ResponseWriter, *http.Request) {}, OpenAPIDef{ID: "Unset", SuccessStatusCode: http.StatusOK})).Methods(http.MethodGet)
+	router.Handle("/bespoke", bespokeOpenAPIHandler{}).Methods(http.MethodGet)
+
+	reflector := openapi3.NewReflector()
+	collector := NewOpenAPICollector(reflector)
+	require.NoError(t, router.Walk(collector.Walker))
+	collector.AttachStabilities(reflector.Spec)
+
+	testCases := []struct {
+		subtestName            string
+		path                   string
+		method                 string
+		expectedExtensionValue any
+	}{
+		{
+			subtestName:            "development handler",
+			path:                   "/development",
+			method:                 "get",
+			expectedExtensionValue: "development",
+		},
+		{
+			subtestName:            "beta handler with path parameter",
+			path:                   "/beta/{id}",
+			method:                 "put",
+			expectedExtensionValue: "beta",
+		},
+		{
+			subtestName:            "unset handler defaults to alpha",
+			path:                   "/unset",
+			method:                 "get",
+			expectedExtensionValue: "alpha",
+		},
+		{
+			subtestName:            "handler built outside New defaults to alpha",
+			path:                   "/bespoke",
+			method:                 "get",
+			expectedExtensionValue: "alpha",
+		},
+	}
+
+	for _, testCase := range testCases {
+		t.Run(testCase.subtestName, func(t *testing.T) {
+			operation := reflector.Spec.Paths.MapOfPathItemValues[testCase.path].MapOfOperationValues[testCase.method]
+			assert.Equal(t, testCase.expectedExtensionValue, operation.MapOfAnything["x-signoz-stability"])
+		})
+	}
+}

pkg/http/handler/openapi.go

@@ -1,14 +1,37 @@
 package handler
 
 import (
+	"net/http"
 	"reflect"
 
+	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
 	"github.com/swaggest/jsonschema-go"
 	openapigo "github.com/swaggest/openapi-go"
+	"github.com/swaggest/openapi-go/openapi3"
 	"github.com/swaggest/rest/openapi"
 )
 
+const signozStabilityKey string = "x-signoz-stability"
+
+var (
+	StabilityDevelopment = Stability{valuer.NewString("development")}
+	StabilityAlpha       = Stability{valuer.NewString("alpha")}
+	StabilityBeta        = Stability{valuer.NewString("beta")}
+	StabilityStable      = Stability{valuer.NewString("stable")}
+)
+
+// Stability is emitted as the x-signoz-stability extension on every operation; unset means alpha.
+type Stability struct{ valuer.String }
+
+func (stability Stability) StringValue() string {
+	if stability.IsZero() {
+		return StabilityAlpha.String.StringValue()
+	}
+
+	return stability.String.StringValue()
+}
+
 // OpenAPIExample is a named example for an OpenAPI operation.
 type OpenAPIExample struct {
 	Name        string
@@ -32,6 +55,7 @@ type OpenAPIDef struct {
 	SuccessStatusCode   int
 	ErrorStatusCodes    []int
 	Deprecated          bool
+	Stability           Stability
 	SecuritySchemes     []OpenAPISecurityScheme
 }
 
@@ -42,14 +66,16 @@ type OpenAPISecurityScheme struct {
 
 // OpenAPICollector is a collector for OpenAPI operations.
 type OpenAPICollector struct {
-	collector *openapi.Collector
+	collector   *openapi.Collector
+	stabilities map[operationKey]Stability
 }
 
 func NewOpenAPICollector(reflector openapigo.Reflector) *OpenAPICollector {
 	c := openapi.NewCollector(reflector)
 
 	return &OpenAPICollector{
-		collector: c,
+		collector:   c,
+		stabilities: make(map[operationKey]Stability),
 	}
 }
 
@@ -77,6 +103,9 @@ func (c *OpenAPICollector) Walker(route *mux.Route, _ *mux.Router, _ []*mux.Rout
 			if err := c.collector.CollectOperation(method, path, c.collect(method, path, handler.ServeOpenAPI)); err != nil {
 				return err
 			}
+			if err := c.recordStability(method, path, httpHandler); err != nil {
+				return err
+			}
 		}
 		return nil
 	}
@@ -84,6 +113,17 @@ func (c *OpenAPICollector) Walker(route *mux.Route, _ *mux.Router, _ []*mux.Rout
 	return nil
 }
 
+// AttachStabilities stamps every operation in spec, so handlers built outside New
+// carry the unset stability rather than none.
+func (c *OpenAPICollector) AttachStabilities(spec *openapi3.Spec) {
+	for path, pathItem := range spec.Paths.MapOfPathItemValues {
+		for method, operation := range pathItem.MapOfOperationValues {
+			operation.WithMapOfAnythingItem(signozStabilityKey, c.stabilities[operationKey{method: method, path: path}].StringValue())
+			pathItem.MapOfOperationValues[method] = operation
+		}
+	}
+}
+
 func (c *OpenAPICollector) collect(method string, path string, serveOpenAPIFunc ServeOpenAPIFunc) func(oc openapigo.OperationContext) error {
 	return func(oc openapigo.OperationContext) error {
 		// Serve the OpenAPI documentation for the handler
@@ -117,3 +157,23 @@ func (c *OpenAPICollector) collect(method string, path string, serveOpenAPIFunc
 		return nil
 	}
 }
+
+func (c *OpenAPICollector) recordStability(method string, path string, httpHandler http.Handler) error {
+	generic, ok := httpHandler.(*handler)
+	if !ok {
+		return nil
+	}
+
+	cleanMethod, cleanPath, _, err := openapigo.SanitizeMethodPath(method, path)
+	if err != nil {
+		return err
+	}
+
+	c.stabilities[operationKey{method: cleanMethod, path: cleanPath}] = generic.openAPIDef.Stability
+	return nil
+}
+
+type operationKey struct {
+	method string
+	path   string
+}

pkg/query-service/rules/filterquery.go

@@ -0,0 +1,20 @@
+package rules
+
+import (
+	"strings"
+
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/parser/filterquery/sqlcompiler"
+	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
+)
+
+// Compile wraps compiler errors in the rules list filter error code.
+func CompileListFilter(query string, formatter sqlstore.SQLFormatter) (*sqlcompiler.Compiled, error) {
+	compiled, errs := sqlcompiler.Compile(query, formatter, ruleFieldResolver{})
+	if len(errs) > 0 {
+		return nil, errors.NewInvalidInputf(ruletypes.ErrCodeRuleListFilterInvalid,
+			"invalid filter query: %s", strings.Join(errs, "; "))
+	}
+	return compiled, nil
+}

pkg/query-service/rules/filterquery_resolver.go

@@ -0,0 +1,196 @@
+package rules
+
+import (
+	"fmt"
+	"slices"
+	"strings"
+
+	grammar "github.com/SigNoz/signoz/pkg/parser/filterquery/grammar"
+	"github.com/SigNoz/signoz/pkg/parser/filterquery/sqlcompiler"
+	qbtypesv5 "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
+)
+
+const (
+	ruleDataColumn  = "rule.data"
+	ruleLabelsField = "labels"
+	nameJSONPath    = "$.alert"
+	descriptionPath = "$.description"
+	labelsJSONPath  = "$.labels"
+	alertTypePath   = "$.alertType"
+	ruleTypePath    = "$.ruleType"
+)
+
+// ruleFieldResolver maps rule list DSL keys; a non-reserved key is a case-sensitive label lookup.
+type ruleFieldResolver struct{}
+
+func (r ruleFieldResolver) ResolveComparison(v *sqlcompiler.Visitor, rawKey string, operation qbtypesv5.FilterOperator, ctx *grammar.ComparisonContext) string {
+	key := strings.ToLower(rawKey)
+
+	// labels.<key> is the explicit way to target only the label on a reserved-key collision.
+	if strings.HasPrefix(key, ruletypes.DSLLabelsKeyPrefix) {
+		labelKey := rawKey[len(ruletypes.DSLLabelsKeyPrefix):]
+		if labelKey == "" {
+			v.AddError("labels filter is missing a key, use labels.<key>")
+			return ""
+		}
+		if _, allowed := ruletypes.LabelsKeyOps[operation]; !allowed {
+			v.AddError("operator %s is not allowed on a labels.<key> filter", sqlcompiler.OperationName(operation))
+			return ""
+		}
+		return r.labelComparison(v, ctx, operation, labelKey)
+	}
+
+	allowedOperations, isReserved := ruletypes.ReservedOps[ruletypes.DSLKey(key)]
+	_, labelAllowed := ruletypes.LabelsKeyOps[operation]
+
+	if !isReserved {
+		if !labelAllowed {
+			v.AddError("operator %s is not allowed on the label filter %q", sqlcompiler.OperationName(operation), rawKey)
+			return ""
+		}
+		return r.labelComparison(v, ctx, operation, rawKey)
+	}
+
+	_, reservedAllowed := allowedOperations[operation]
+	// reserved severity is itself the severity-label lookup; an identical spelling would duplicate the predicate
+	if ruletypes.DSLKey(key) == ruletypes.DSLKeySeverity && rawKey == string(ruletypes.DSLKeySeverity) {
+		labelAllowed = false
+	}
+
+	switch {
+	case reservedAllowed && labelAllowed:
+		reservedPredicate := r.resolveReservedKey(v, ctx, operation, ruletypes.DSLKey(key))
+		labelPredicate := r.labelComparison(v, ctx, operation, rawKey)
+		if reservedPredicate == "" || labelPredicate == "" {
+			return ""
+		}
+		// the key matches both the reserved field and a same-named label; a negative term must exclude both
+		if operation.IsNegativeOperator() {
+			return v.Sb.And(reservedPredicate, labelPredicate)
+		}
+		return v.Sb.Or(reservedPredicate, labelPredicate)
+	case reservedAllowed:
+		return r.resolveReservedKey(v, ctx, operation, ruletypes.DSLKey(key))
+	case labelAllowed:
+		return r.labelComparison(v, ctx, operation, rawKey)
+	default:
+		v.AddError("operator %s is not allowed for key %q", sqlcompiler.OperationName(operation), key)
+		return ""
+	}
+}
+
+func (r ruleFieldResolver) resolveReservedKey(v *sqlcompiler.Visitor, ctx *grammar.ComparisonContext, operation qbtypesv5.FilterOperator, key ruletypes.DSLKey) string {
+	switch key {
+	case ruletypes.DSLKeyName:
+		columnExpression := string(v.Formatter.JSONExtractString(ruleDataColumn, nameJSONPath))
+		return v.BuildStringOperation(v.Sb, ctx, operation, columnExpression, string(key))
+	case ruletypes.DSLKeySeverity:
+		// severity is an alias for labels.severity, sharing its missing-label semantics.
+		return r.labelComparison(v, ctx, operation, "severity")
+	case ruletypes.DSLKeyCreatedBy:
+		return v.BuildStringOperation(v.Sb, ctx, operation, "rule.created_by", string(key))
+	case ruletypes.DSLKeyUpdatedBy:
+		return v.BuildStringOperation(v.Sb, ctx, operation, "rule.updated_by", string(key))
+	case ruletypes.DSLKeyCreatedAt:
+		return v.BuildTimestampComparison(ctx, operation, "rule.created_at")
+	case ruletypes.DSLKeyUpdatedAt:
+		return v.BuildTimestampComparison(ctx, operation, "rule.updated_at")
+	case ruletypes.DSLKeyAlertType:
+		return r.enumComparison(v, ctx, operation, key, alertTypePath, alertTypeValues)
+	case ruletypes.DSLKeyRuleType:
+		return r.enumComparison(v, ctx, operation, key, ruleTypePath, ruleTypeValues)
+	}
+	v.AddError("no handler for reserved key %q", key)
+	return ""
+}
+
+// A missing label evaluates as the empty string for every value operator; EXISTS/NOT EXISTS test the raw extraction.
+func (ruleFieldResolver) labelComparison(v *sqlcompiler.Visitor, ctx *grammar.ComparisonContext, operation qbtypesv5.FilterOperator, labelKey string) string {
+	columnExpression := string(v.Formatter.JSONExtractMapValue(ruleDataColumn, ruleLabelsField, labelKey))
+
+	switch operation {
+	case qbtypesv5.FilterOperatorExists:
+		return fmt.Sprintf("%s IS NOT NULL", columnExpression)
+	case qbtypesv5.FilterOperatorNotExists:
+		return fmt.Sprintf("%s IS NULL", columnExpression)
+	}
+
+	keyForError := ruletypes.DSLLabelsKeyPrefix + labelKey
+	columnExpression = fmt.Sprintf("COALESCE(%s, '')", columnExpression)
+	return v.BuildStringOperation(v.Sb, ctx, operation, columnExpression, keyForError)
+}
+
+func (ruleFieldResolver) enumComparison(v *sqlcompiler.Visitor, ctx *grammar.ComparisonContext, operation qbtypesv5.FilterOperator, key ruletypes.DSLKey, jsonPath string, allowedValues []string) string {
+	columnExpression := string(v.Formatter.JSONExtractString(ruleDataColumn, jsonPath))
+
+	var values []string
+	switch operation {
+	case qbtypesv5.FilterOperatorEqual, qbtypesv5.FilterOperatorNotEqual:
+		value, ok := v.ExtractSingleStringValue(ctx, string(key))
+		if !ok {
+			return ""
+		}
+		values = []string{value}
+	case qbtypesv5.FilterOperatorIn, qbtypesv5.FilterOperatorNotIn:
+		list, ok := v.ExtractStringValueList(ctx, string(key))
+		if !ok {
+			return ""
+		}
+		values = list
+	default:
+		v.AddError("operator %s on %q is not implemented", sqlcompiler.OperationName(operation), key)
+		return ""
+	}
+
+	for _, value := range values {
+		if !slices.Contains(allowedValues, value) {
+			v.AddError("invalid value %q for %q, expected one of: %s", value, key, strings.Join(allowedValues, ", "))
+			return ""
+		}
+	}
+
+	arguments := make([]any, len(values))
+	for i, s := range values {
+		arguments[i] = s
+	}
+	switch operation {
+	case qbtypesv5.FilterOperatorEqual:
+		return v.Sb.Equal(columnExpression, arguments[0])
+	case qbtypesv5.FilterOperatorNotEqual:
+		return v.Sb.NotEqual(columnExpression, arguments[0])
+	case qbtypesv5.FilterOperatorNotIn:
+		return v.Sb.NotIn(columnExpression, arguments...)
+	default:
+		return v.Sb.In(columnExpression, arguments...)
+	}
+}
+
+// ResolveFreeText searches name, description and the raw labels JSON (which also matches label keys).
+func (ruleFieldResolver) ResolveFreeText(v *sqlcompiler.Visitor, value string) string {
+	nameColumn := string(v.Formatter.JSONExtractString(ruleDataColumn, nameJSONPath))
+	descriptionColumn := string(v.Formatter.JSONExtractString(ruleDataColumn, descriptionPath))
+	labelsColumn := string(v.Formatter.JSONExtractString(ruleDataColumn, labelsJSONPath))
+
+	return v.Sb.Or(
+		v.BuildFreeTextContains(v.Sb, nameColumn, value),
+		v.BuildFreeTextContains(v.Sb, descriptionColumn, value),
+		v.BuildFreeTextContains(v.Sb, labelsColumn, value),
+	)
+}
+
+var alertTypeValues = func() []string {
+	values := make([]string, 0, 4)
+	for _, value := range (ruletypes.AlertType("")).Enum() {
+		values = append(values, string(value.(ruletypes.AlertType)))
+	}
+	return values
+}()
+
+var ruleTypeValues = func() []string {
+	values := make([]string, 0, 3)
+	for _, value := range (ruletypes.RuleType{}).Enum() {
+		values = append(values, value.(ruletypes.RuleType).StringValue())
+	}
+	return values
+}()

pkg/query-service/rules/filterquery_test.go

@@ -0,0 +1,488 @@
+package rules
+
+import (
+	"strings"
+	"testing"
+	"time"
+
+	"github.com/DATA-DOG/go-sqlmock"
+	"github.com/stretchr/testify/assert"
+	"github.com/stretchr/testify/require"
+
+	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/sqlstore/sqlstoretest"
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
+)
+
+type compileCase struct {
+	subtestName              string
+	dslQueryToCompile        string
+	emptyQueryExpected       bool
+	expectedSQL              string
+	expectedArgs             []any
+	expectedErrShouldContain string
+}
+
+func runCompileCases(t *testing.T, cases []compileCase) {
+	t.Helper()
+	for _, c := range cases {
+		t.Run(c.subtestName, func(t *testing.T) {
+			out, err := CompileListFilter(c.dslQueryToCompile, formatter(t))
+
+			if c.expectedErrShouldContain != "" {
+				require.Error(t, err)
+				assert.Contains(t, strings.ToLower(err.Error()), strings.ToLower(c.expectedErrShouldContain))
+				return
+			}
+
+			require.NoError(t, err)
+			if c.emptyQueryExpected {
+				assert.True(t, out.IsEmpty())
+				return
+			}
+			require.NotNil(t, out)
+
+			if c.expectedSQL != "" {
+				assert.Equal(t, normalizeSQL(c.expectedSQL), normalizeSQL(out.SQL))
+			}
+			if c.expectedArgs != nil {
+				require.Len(t, out.Args, len(c.expectedArgs))
+				for i, want := range c.expectedArgs {
+					// Equal instants can differ in *Location, so compare via .Equal() instead of DeepEqual.
+					if wantT, ok := want.(time.Time); ok {
+						gotT, ok := out.Args[i].(time.Time)
+						require.True(t, ok, "arg[%d]: want time.Time, got %T", i, out.Args[i])
+						assert.True(t, wantT.Equal(gotT), "arg[%d]: want %s, got %s", i, wantT, gotT)
+						continue
+					}
+					assert.Equal(t, want, out.Args[i], "arg[%d]", i)
+				}
+			}
+		})
+	}
+}
+
+func TestCompileEmpty(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{subtestName: "EmptyQuery_Nil", dslQueryToCompile: "", emptyQueryExpected: true},
+		{subtestName: "WhitespaceQuery_Nil", dslQueryToCompile: "   ", emptyQueryExpected: true},
+	})
+}
+
+func TestCompileName(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "NameEquals_MatchesReservedOrLabel",
+			dslQueryToCompile: "name = 'payment latency'",
+			expectedSQL:       `(json_extract("rule"."data", '$.alert') = ? OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') = ?)`,
+			expectedArgs:      []any{"payment latency", "payment latency"},
+		},
+		{
+			subtestName:       "NameContains_EscapesWildcardsBothSides",
+			dslQueryToCompile: "name CONTAINS '50%'",
+			expectedSQL:       `(json_extract("rule"."data", '$.alert') LIKE ? ESCAPE '\' OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') LIKE ? ESCAPE '\')`,
+			expectedArgs:      []any{`%50\%%`, `%50\%%`},
+		},
+		{
+			subtestName:       "NameILike",
+			dslQueryToCompile: "name ILIKE 'Prod%'",
+			expectedSQL:       `(lower(json_extract("rule"."data", '$.alert')) LIKE LOWER(?) ESCAPE '\' OR lower(COALESCE(json_extract("rule"."data", '$.labels."name"'), '')) LIKE LOWER(?) ESCAPE '\')`,
+			expectedArgs:      []any{"Prod%", "Prod%"},
+		},
+		{
+			subtestName:       "NameInList",
+			dslQueryToCompile: "name IN ['a', 'b']",
+			expectedSQL:       `(json_extract("rule"."data", '$.alert') IN (?, ?) OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') IN (?, ?))`,
+			expectedArgs:      []any{"a", "b", "a", "b"},
+		},
+		{
+			subtestName:       "NameNotEquals_ExcludesBoth",
+			dslQueryToCompile: "name != 'x'",
+			expectedSQL:       `(json_extract("rule"."data", '$.alert') <> ? AND COALESCE(json_extract("rule"."data", '$.labels."name"'), '') <> ?)`,
+			expectedArgs:      []any{"x", "x"},
+		},
+		{
+			subtestName:       "NameExists_LabelOnly",
+			dslQueryToCompile: "name EXISTS",
+			expectedSQL:       `json_extract("rule"."data", '$.labels."name"') IS NOT NULL`,
+		},
+		{
+			subtestName:              "RangeOperatorOnName_Rejected",
+			dslQueryToCompile:        "name > 'x'",
+			expectedErrShouldContain: `operator > is not allowed for key "name"`,
+		},
+		{
+			subtestName:              "RegexpOnName_Rejected",
+			dslQueryToCompile:        "name REGEXP 'x.*'",
+			expectedErrShouldContain: `operator REGEXP is not allowed for key "name"`,
+		},
+	})
+}
+
+func TestCompileSeverityAndLabels(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "SeverityEquals_TargetsLabelsMap",
+			dslQueryToCompile: "severity = 'critical'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') = ?`,
+			expectedArgs:      []any{"critical"},
+		},
+		{
+			subtestName:       "SeverityNotEquals_MissingLabelAsEmptyString",
+			dslQueryToCompile: "severity != 'critical'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') <> ?`,
+			expectedArgs:      []any{"critical"},
+		},
+		{
+			subtestName:       "SeverityNotEqualsEmpty_ExcludesRulesWithoutSeverity",
+			dslQueryToCompile: "severity != ''",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') <> ?`,
+			expectedArgs:      []any{""},
+		},
+		{
+			subtestName:       "SeverityExists_ThroughAlias",
+			dslQueryToCompile: "severity EXISTS",
+			expectedSQL:       `json_extract("rule"."data", '$.labels."severity"') IS NOT NULL`,
+		},
+		{
+			subtestName:       "SeverityNotExists_ThroughAlias",
+			dslQueryToCompile: "severity NOT EXISTS",
+			expectedSQL:       `json_extract("rule"."data", '$.labels."severity"') IS NULL`,
+		},
+		{
+			subtestName:       "LabelEquals",
+			dslQueryToCompile: "labels.team = 'infra'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."team"'), '') = ?`,
+			expectedArgs:      []any{"infra"},
+		},
+		{
+			subtestName:       "DottedLabelKey_OneMapEntry",
+			dslQueryToCompile: "labels.k8s.cluster = 'prod-1'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."k8s.cluster"'), '') = ?`,
+			expectedArgs:      []any{"prod-1"},
+		},
+		{
+			subtestName:       "LabelKey_CaseSensitive",
+			dslQueryToCompile: "labels.Team = 'infra'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."Team"'), '') = ?`,
+			expectedArgs:      []any{"infra"},
+		},
+		{
+			subtestName:       "LabelExists",
+			dslQueryToCompile: "labels.team EXISTS",
+			expectedSQL:       `json_extract("rule"."data", '$.labels."team"') IS NOT NULL`,
+		},
+		{
+			subtestName:       "LabelNotExists",
+			dslQueryToCompile: "labels.team NOT EXISTS",
+			expectedSQL:       `json_extract("rule"."data", '$.labels."team"') IS NULL`,
+		},
+		{
+			subtestName:       "LabelNotContains_IncludesLabelLessRules",
+			dslQueryToCompile: "labels.team NOT CONTAINS 'infra'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."team"'), '') NOT LIKE ? ESCAPE '\'`,
+			expectedArgs:      []any{"%infra%"},
+		},
+		{
+			subtestName:       "LabelNotIn_IncludesLabelLessRules",
+			dslQueryToCompile: "labels.team NOT IN ['a', 'b']",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."team"'), '') NOT IN (?, ?)`,
+			expectedArgs:      []any{"a", "b"},
+		},
+	})
+}
+
+func TestCompileEnums(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "AlertTypeEquals_MatchesEnumOrLabel",
+			dslQueryToCompile: "alert_type = 'LOGS_BASED_ALERT'",
+			expectedSQL:       `(json_extract("rule"."data", '$.alertType') = ? OR COALESCE(json_extract("rule"."data", '$.labels."alert_type"'), '') = ?)`,
+			expectedArgs:      []any{"LOGS_BASED_ALERT", "LOGS_BASED_ALERT"},
+		},
+		{
+			subtestName:       "RuleTypeInList",
+			dslQueryToCompile: "rule_type IN ['threshold_rule', 'promql_rule']",
+			expectedSQL:       `(json_extract("rule"."data", '$.ruleType') IN (?, ?) OR COALESCE(json_extract("rule"."data", '$.labels."rule_type"'), '') IN (?, ?))`,
+			expectedArgs:      []any{"threshold_rule", "promql_rule", "threshold_rule", "promql_rule"},
+		},
+		{
+			subtestName:              "InvalidAlertTypeValue_Rejected",
+			dslQueryToCompile:        "alert_type = 'bogus'",
+			expectedErrShouldContain: `invalid value "bogus" for "alert_type"`,
+		},
+		{
+			subtestName:       "ContainsOnRuleType_LabelOnly",
+			dslQueryToCompile: "rule_type CONTAINS 'thresh'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."rule_type"'), '') LIKE ? ESCAPE '\'`,
+			expectedArgs:      []any{"%thresh%"},
+		},
+	})
+}
+
+func TestCompileAuditColumns(t *testing.T) {
+	createdAt, err := time.Parse(time.RFC3339, "2026-01-02T15:04:05Z")
+	require.NoError(t, err)
+	updatedFrom, err := time.Parse(time.RFC3339, "2026-02-01T00:00:00Z")
+	require.NoError(t, err)
+	updatedTo, err := time.Parse(time.RFC3339, "2026-03-01T00:00:00Z")
+	require.NoError(t, err)
+
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "CreatedByEquals_MatchesColumnOrLabel",
+			dslQueryToCompile: "created_by = 'nikhil@signoz.io'",
+			expectedSQL:       `(rule.created_by = ? OR COALESCE(json_extract("rule"."data", '$.labels."created_by"'), '') = ?)`,
+			expectedArgs:      []any{"nikhil@signoz.io", "nikhil@signoz.io"},
+		},
+		{
+			subtestName:       "CreatedAtRange",
+			dslQueryToCompile: "created_at >= '2026-01-02T15:04:05Z'",
+			expectedSQL:       `rule.created_at >= ?`,
+			expectedArgs:      []any{createdAt},
+		},
+		{
+			subtestName:       "UpdatedAtBetween",
+			dslQueryToCompile: "updated_at BETWEEN '2026-02-01T00:00:00Z' AND '2026-03-01T00:00:00Z'",
+			expectedSQL:       `rule.updated_at BETWEEN ? AND ?`,
+			expectedArgs:      []any{updatedFrom, updatedTo},
+		},
+		{
+			subtestName:              "NonTimestampOnCreatedAt_Rejected",
+			dslQueryToCompile:        "created_at >= 'yesterday'",
+			expectedErrShouldContain: "invalid RFC3339 timestamp",
+		},
+	})
+}
+
+func TestCompileFreeText(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "BareWord_SearchesNameDescriptionLabels",
+			dslQueryToCompile: "payment",
+			expectedSQL: `(lower(COALESCE(json_extract("rule"."data", '$.alert'), '')) LIKE LOWER(?) ESCAPE '\' ` +
+				`OR lower(COALESCE(json_extract("rule"."data", '$.description'), '')) LIKE LOWER(?) ESCAPE '\' ` +
+				`OR lower(COALESCE(json_extract("rule"."data", '$.labels'), '')) LIKE LOWER(?) ESCAPE '\')`,
+			expectedArgs: []any{"%payment%", "%payment%", "%payment%"},
+		},
+	})
+}
+
+func TestCompileComposition(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "AndOfLabelAndColumn",
+			dslQueryToCompile: "labels.team = 'infra' AND created_by = 'x'",
+			expectedSQL: `(COALESCE(json_extract("rule"."data", '$.labels."team"'), '') = ? ` +
+				`AND (rule.created_by = ? OR COALESCE(json_extract("rule"."data", '$.labels."created_by"'), '') = ?))`,
+			expectedArgs: []any{"infra", "x", "x"},
+		},
+		{
+			subtestName:       "Not_WrapsInnerPredicate",
+			dslQueryToCompile: "NOT (name = 'x')",
+			expectedSQL:       `NOT ((json_extract("rule"."data", '$.alert') = ? OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') = ?))`,
+			expectedArgs:      []any{"x", "x"},
+		},
+		{
+			subtestName:       "OrOfNameAndSeverity",
+			dslQueryToCompile: "name CONTAINS 'pay' OR severity = 'critical'",
+			expectedSQL: `((json_extract("rule"."data", '$.alert') LIKE ? ESCAPE '\' OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') LIKE ? ESCAPE '\') ` +
+				`OR COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') = ?)`,
+			expectedArgs: []any{"%pay%", "%pay%", "critical"},
+		},
+	})
+}
+
+func TestCompileComplexExamples(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName: "NameContains_LabelEquals_SeverityIn_CreatedByNotEquals",
+			dslQueryToCompile: `name CONTAINS 'latency' AND labels.team = 'payments' ` +
+				`AND severity IN ['critical', 'error'] AND created_by != 'ops@signoz.io'`,
+			expectedSQL: `((json_extract("rule"."data", '$.alert') LIKE ? ESCAPE '\' OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') LIKE ? ESCAPE '\') ` +
+				`AND COALESCE(json_extract("rule"."data", '$.labels."team"'), '') = ? ` +
+				`AND COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') IN (?, ?) ` +
+				`AND (rule.created_by <> ? AND COALESCE(json_extract("rule"."data", '$.labels."created_by"'), '') <> ?))`,
+			expectedArgs: []any{"%latency%", "%latency%", "payments", "critical", "error", "ops@signoz.io", "ops@signoz.io"},
+		},
+		{
+			subtestName: "NestedOrAnd_WithParens",
+			dslQueryToCompile: `(labels.env IN ['prod', 'staging'] OR name LIKE '%prod%') ` +
+				`AND (severity = 'critical' OR labels.team EXISTS)`,
+			expectedSQL: `((COALESCE(json_extract("rule"."data", '$.labels."env"'), '') IN (?, ?) ` +
+				`OR (json_extract("rule"."data", '$.alert') LIKE ? ESCAPE '\' OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') LIKE ? ESCAPE '\')) ` +
+				`AND (COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') = ? ` +
+				`OR json_extract("rule"."data", '$.labels."team"') IS NOT NULL))`,
+			expectedArgs: []any{"prod", "staging", "%prod%", "%prod%", "critical"},
+		},
+		{
+			subtestName:       "NotOverGroup_AndedWithEnum",
+			dslQueryToCompile: `NOT (labels.team = 'infra' OR name CONTAINS 'cpu') AND alert_type = 'METRIC_BASED_ALERT'`,
+			expectedSQL: `(NOT ((COALESCE(json_extract("rule"."data", '$.labels."team"'), '') = ? ` +
+				`OR (json_extract("rule"."data", '$.alert') LIKE ? ESCAPE '\' OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') LIKE ? ESCAPE '\'))) ` +
+				`AND (json_extract("rule"."data", '$.alertType') = ? OR COALESCE(json_extract("rule"."data", '$.labels."alert_type"'), '') = ?))`,
+			expectedArgs: []any{"infra", "%cpu%", "%cpu%", "METRIC_BASED_ALERT", "METRIC_BASED_ALERT"},
+		},
+		{
+			subtestName: "FreeText_ThreeLevelNesting_Timestamp",
+			dslQueryToCompile: `prod AND (name ILIKE '%pay%' ` +
+				`OR (labels.team != 'infra' AND updated_at > '2026-01-02T15:04:05Z'))`,
+			expectedSQL: `((lower(COALESCE(json_extract("rule"."data", '$.alert'), '')) LIKE LOWER(?) ESCAPE '\' ` +
+				`OR lower(COALESCE(json_extract("rule"."data", '$.description'), '')) LIKE LOWER(?) ESCAPE '\' ` +
+				`OR lower(COALESCE(json_extract("rule"."data", '$.labels'), '')) LIKE LOWER(?) ESCAPE '\') ` +
+				`AND ((lower(json_extract("rule"."data", '$.alert')) LIKE LOWER(?) ESCAPE '\' ` +
+				`OR lower(COALESCE(json_extract("rule"."data", '$.labels."name"'), '')) LIKE LOWER(?) ESCAPE '\') ` +
+				`OR (COALESCE(json_extract("rule"."data", '$.labels."team"'), '') <> ? AND rule.updated_at > ?)))`,
+			expectedArgs: []any{"%prod%", "%prod%", "%prod%", "%pay%", "%pay%", "infra",
+				time.Date(2026, 1, 2, 15, 4, 5, 0, time.UTC)},
+		},
+	})
+}
+
+func TestCompileBareLabelKeys(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "BareKey_LabelMatch",
+			dslQueryToCompile: "team = 'infra'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."team"'), '') = ?`,
+			expectedArgs:      []any{"infra"},
+		},
+		{
+			subtestName:       "BareKey_CaseSensitive",
+			dslQueryToCompile: "Team CONTAINS 'inf'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."Team"'), '') LIKE ? ESCAPE '\'`,
+			expectedArgs:      []any{"%inf%"},
+		},
+		{
+			subtestName:       "BareKeyExists",
+			dslQueryToCompile: "env EXISTS",
+			expectedSQL:       `json_extract("rule"."data", '$.labels."env"') IS NOT NULL`,
+		},
+		{
+			subtestName:       "State_LabelLookupNotRuleState",
+			dslQueryToCompile: "state = 'firing'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."state"'), '') = ?`,
+			expectedArgs:      []any{"firing"},
+		},
+	})
+}
+
+func TestCompileReservedLabelCollisions(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "UppercaseReservedKey_MatchesReservedOrExactCaseLabel",
+			dslQueryToCompile: "NAME = 'x'",
+			expectedSQL:       `(json_extract("rule"."data", '$.alert') = ? OR COALESCE(json_extract("rule"."data", '$.labels."NAME"'), '') = ?)`,
+			expectedArgs:      []any{"x", "x"},
+		},
+		{
+			subtestName:       "SeverityExactSpelling_SinglePredicate",
+			dslQueryToCompile: "severity = 'critical'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') = ?`,
+			expectedArgs:      []any{"critical"},
+		},
+		{
+			subtestName:       "SeverityDifferentCase_MatchesBothLabelSpellings",
+			dslQueryToCompile: "Severity = 'critical'",
+			expectedSQL: `(COALESCE(json_extract("rule"."data", '$.labels."severity"'), '') = ? ` +
+				`OR COALESCE(json_extract("rule"."data", '$.labels."Severity"'), '') = ?)`,
+			expectedArgs: []any{"critical", "critical"},
+		},
+		{
+			subtestName:       "RangeOperator_ReservedOnly",
+			dslQueryToCompile: "created_at >= '2026-01-02T15:04:05Z'",
+			expectedSQL:       `rule.created_at >= ?`,
+			expectedArgs:      []any{time.Date(2026, 1, 2, 15, 4, 5, 0, time.UTC)},
+		},
+		{
+			subtestName:       "LabelsPrefix_LabelOnlyOnCollision",
+			dslQueryToCompile: "labels.name = 'x'",
+			expectedSQL:       `COALESCE(json_extract("rule"."data", '$.labels."name"'), '') = ?`,
+			expectedArgs:      []any{"x"},
+		},
+		{
+			subtestName:       "NotIn_ExcludesBoth",
+			dslQueryToCompile: "created_by NOT IN ['a', 'b']",
+			expectedSQL: `(rule.created_by NOT IN (?, ?) ` +
+				`AND COALESCE(json_extract("rule"."data", '$.labels."created_by"'), '') NOT IN (?, ?))`,
+			expectedArgs: []any{"a", "b", "a", "b"},
+		},
+	})
+}
+
+func TestCompileErrors(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:              "RangeOperatorOnBareLabelKey_Rejected",
+			dslQueryToCompile:        "team > 'infra'",
+			expectedErrShouldContain: `operator > is not allowed on the label filter "team"`,
+		},
+		{
+			subtestName:              "SyntaxError_SurfacesPosition",
+			dslQueryToCompile:        "created_by ==== (((",
+			expectedErrShouldContain: "syntax error",
+		},
+		{
+			subtestName:              "LikeDanglingEscape_Rejected",
+			dslQueryToCompile:        `name LIKE 'prod\\'`,
+			expectedErrShouldContain: "must not end with an unescaped backslash",
+		},
+		{
+			subtestName:              "ILikeDanglingEscape_Rejected",
+			dslQueryToCompile:        `name ILIKE '%\\'`,
+			expectedErrShouldContain: "must not end with an unescaped backslash",
+		},
+		{
+			subtestName:              "LabelLikeDanglingEscape_Rejected",
+			dslQueryToCompile:        `labels.team NOT LIKE 'infra\\'`,
+			expectedErrShouldContain: "must not end with an unescaped backslash",
+		},
+	})
+}
+
+func TestCompileTrailingLiteralBackslash(t *testing.T) {
+	runCompileCases(t, []compileCase{
+		{
+			subtestName:       "EscapedTrailingBackslash_Compiles",
+			dslQueryToCompile: `name LIKE '%\\\\'`,
+			expectedSQL:       `(json_extract("rule"."data", '$.alert') LIKE ? ESCAPE '\' OR COALESCE(json_extract("rule"."data", '$.labels."name"'), '') LIKE ? ESCAPE '\')`,
+			expectedArgs:      []any{`%\\`, `%\\`},
+		},
+	})
+}
+
+// Guards that every ruletypes.ReservedOps key has a case in resolveReservedKey.
+func TestCompileReservedKeysAllHandled(t *testing.T) {
+	sampleQueries := map[ruletypes.DSLKey]string{
+		ruletypes.DSLKeyName:      "name = 'x'",
+		ruletypes.DSLKeySeverity:  "severity = 'critical'",
+		ruletypes.DSLKeyCreatedBy: "created_by = 'x'",
+		ruletypes.DSLKeyUpdatedBy: "updated_by = 'x'",
+		ruletypes.DSLKeyCreatedAt: "created_at >= '2026-01-02T15:04:05Z'",
+		ruletypes.DSLKeyUpdatedAt: "updated_at >= '2026-01-02T15:04:05Z'",
+		ruletypes.DSLKeyAlertType: "alert_type = 'METRIC_BASED_ALERT'",
+		ruletypes.DSLKeyRuleType:  "rule_type = 'threshold_rule'",
+	}
+
+	for key := range ruletypes.ReservedOps {
+		query, ok := sampleQueries[key]
+		require.True(t, ok, "no sample query for reserved key %q, add one", key)
+
+		out, err := CompileListFilter(query, formatter(t))
+		require.NoError(t, err, "reserved key %q failed to compile", key)
+		assert.False(t, out.IsEmpty(), "reserved key %q compiled to empty SQL", key)
+	}
+}
+
+func formatter(t *testing.T) sqlstore.SQLFormatter {
+	t.Helper()
+	p := sqlstoretest.New(sqlstore.Config{Provider: "sqlite"}, sqlmock.QueryMatcherEqual)
+	return p.Formatter()
+}
+
+func normalizeSQL(s string) string {
+	s = strings.Join(strings.Fields(s), " ")
+	s = strings.ReplaceAll(s, "( ", "(")
+	s = strings.ReplaceAll(s, " )", ")")
+	return s
+}

pkg/query-service/rules/manager.go

@@ -851,6 +851,8 @@ func (m *Manager) ListRuleStates(ctx context.Context) (*ruletypes.GettableRules,
 	// initiate response object
 	resp := make([]*ruletypes.GettableRule, 0)
 
+	stateByRuleID := m.snapshotRuleStates()
+
 	for _, s := range storedRules {
 
 		ruleResponse := ruletypes.GettableRule{}
@@ -863,11 +865,11 @@ func (m *Manager) ListRuleStates(ctx context.Context) (*ruletypes.GettableRules,
 		ruleResponse.Id = s.ID.StringValue()
 
 		// fetch state of rule from memory
-		if rm, ok := m.rules[ruleResponse.Id]; !ok {
+		if state, ok := stateByRuleID[ruleResponse.Id]; !ok {
 			ruleResponse.State = ruletypes.StateDisabled
 			ruleResponse.Disabled = true
 		} else {
-			ruleResponse.State = rm.State()
+			ruleResponse.State = state
 		}
 		ruleResponse.CreatedAt = s.CreatedAt
 		ruleResponse.CreatedBy = &s.CreatedBy
@@ -879,6 +881,71 @@ func (m *Manager) ListRuleStates(ctx context.Context) (*ruletypes.GettableRules,
 	return &ruletypes.GettableRules{Rules: resp}, nil
 }
 
+// ListRules' total counts what is pageable after corrupt-row drops and the states filter.
+func (m *Manager) ListRules(ctx context.Context, params *ruletypes.ListRulesParams) (*ruletypes.ListableRules, error) {
+	// validated here too, not just in the handler: non-API callers reach the manager directly
+	if err := params.Validate(); err != nil {
+		return nil, err
+	}
+
+	claims, err := authtypes.ClaimsFromContext(ctx)
+	if err != nil {
+		return nil, err
+	}
+
+	states, err := params.GetAlertStates()
+	if err != nil {
+		return nil, err
+	}
+	stateFilter := make(map[ruletypes.AlertState]struct{}, len(states))
+	for _, state := range states {
+		stateFilter[state] = struct{}{}
+	}
+
+	compiled, err := CompileListFilter(params.Query, m.sqlstore.Formatter())
+	if err != nil {
+		return nil, err
+	}
+
+	storedRules, err := m.ruleStore.GetStoredRulesMatching(ctx, claims.OrgID, compiled.SQL, compiled.Args)
+	if err != nil {
+		return nil, err
+	}
+
+	stateByRuleID := m.snapshotRuleStates()
+
+	listableRules, errByRuleID := ruletypes.NewListableRulesFromStorableRules(storedRules, stateByRuleID, stateFilter)
+	for ruleID, err := range errByRuleID {
+		m.logger.ErrorContext(ctx, "failed to unmarshal rule from db", slog.String("rule.id", ruleID), errors.Attr(err))
+	}
+
+	total := int64(len(listableRules))
+	ruletypes.SortListableRules(listableRules, params.Sort, params.Order)
+
+	start := min(params.Offset, len(listableRules))
+	end := min(start+params.Limit, len(listableRules))
+	currentPageRules := listableRules[start:end]
+
+	rawLabels, err := m.ruleStore.GetStoredRuleLabels(ctx, claims.OrgID)
+	if err != nil {
+		return nil, err
+	}
+	labelPairs := ruletypes.NewLabelPairsFromRawJSON(rawLabels, ruletypes.MaxListLabelPairs)
+
+	return ruletypes.NewListableRules(currentPageRules, total, labelPairs), nil
+}
+
+func (m *Manager) snapshotRuleStates() map[string]ruletypes.AlertState {
+	m.mtx.RLock()
+	defer m.mtx.RUnlock()
+
+	states := make(map[string]ruletypes.AlertState, len(m.rules))
+	for id, rule := range m.rules {
+		states[id] = rule.State()
+	}
+	return states
+}
+
 func (m *Manager) GetRule(ctx context.Context, id valuer.UUID) (*ruletypes.GettableRule, error) {
 	claims, err := authtypes.ClaimsFromContext(ctx)
 	if err != nil {

pkg/query-service/rules/manager_test.go

@@ -20,6 +20,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/telemetrystore/telemetrystoretest"
 	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
 	"github.com/SigNoz/signoz/pkg/types/metrictypes"
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/stretchr/testify/assert"
 	"github.com/stretchr/testify/mock"
@@ -28,6 +29,17 @@ import (
 	cmock "github.com/SigNoz/clickhouse-go-mock"
 )
 
+func TestManager_ListRules_ValidatesParams(t *testing.T) {
+	m, err := NewManager(&ManagerOptions{})
+	require.NoError(t, err)
+
+	_, err = m.ListRules(context.Background(), &ruletypes.ListRulesParams{Limit: -1})
+	require.ErrorContains(t, err, "invalid limit")
+
+	_, err = m.ListRules(context.Background(), &ruletypes.ListRulesParams{States: []string{"bogus"}})
+	require.ErrorContains(t, err, `invalid state "bogus"`)
+}
+
 func TestManager_TestNotification_SendUnmatched_ThresholdRule(t *testing.T) {
 	target := 10.0
 	recovery := 5.0

pkg/querybuilder/exists_expr.go

@@ -94,10 +94,10 @@ func ExistsExpression(columns []*schema.Column, key *telemetrytypes.TelemetryFie
 
 		switch valueType := column.Type.(schema.MapColumnType).ValueType; valueType.GetType() {
 		case schema.ColumnTypeEnumString, schema.ColumnTypeEnumBool, schema.ColumnTypeEnumFloat64:
-			leftOperand := fmt.Sprintf("mapContains(%s, %s)", column.Name, clickhousesql.StringLiteral(key.Name))
 			if key.Materialized {
-				leftOperand = telemetrytypes.FieldKeyToMaterializedColumnNameForExists(key)
+				return telemetrytypes.FieldKeyToMaterializedExistsCondition(key, exists), nil
 			}
+			leftOperand := fmt.Sprintf("mapContains(%s, %s)", column.Name, clickhousesql.StringLiteral(key.Name))
 			if exists {
 				return leftOperand, nil
 			}

pkg/ruler/handler.go

@@ -4,6 +4,7 @@ import "net/http"
 
 type Handler interface {
 	ListRules(http.ResponseWriter, *http.Request)
+	ListRulesV3(http.ResponseWriter, *http.Request)
 	GetRuleByID(http.ResponseWriter, *http.Request)
 	CreateRule(http.ResponseWriter, *http.Request)
 	UpdateRuleByID(http.ResponseWriter, *http.Request)

pkg/ruler/ruler.go

@@ -17,6 +17,9 @@ type Ruler interface {
 	// ListRuleStates returns all rules with their current evaluation state.
 	ListRuleStates(ctx context.Context) (*ruletypes.GettableRules, error)
 
+	// ListRules returns a filtered, sorted page of rules with state, plus label pairs and reserved filter keys.
+	ListRules(ctx context.Context, params *ruletypes.ListRulesParams) (*ruletypes.ListableRules, error)
+
 	// GetRule returns a single rule by ID.
 	GetRule(ctx context.Context, id valuer.UUID) (*ruletypes.GettableRule, error)