test(storybook): hold Noz click-opened state past the thread remount

#### Description

- Reverts #13014 and #13015. The resource middleware goes back to
reading body-derived resource ids with `BodyJSONPath` / `BodyJSONArray`
over the raw body, and handlers decode their own request bodies again.
- Authz should not own request decoding; that ownership stays with the
handlers.

#### Additional Information

- Contributes to: https://github.com/SigNoz/keystone-pod/issues/37

docs/api/openapi.yml

@@ -1771,12 +1771,15 @@ components:
           additionalProperties: {}
           nullable: true
           type: object
+        syncState:
+          $ref: '#/components/schemas/CloudintegrationtypesSyncState'
         timestampMillis:
           format: int64
           type: integer
       required:
       - timestampMillis
       - data
+      - syncState
       type: object
     CloudintegrationtypesAzureAccountConfig:
       properties:
@@ -2021,6 +2024,8 @@ components:
           format: date-time
           nullable: true
           type: string
+        syncState:
+          $ref: '#/components/schemas/CloudintegrationtypesSyncState'
       required:
       - account_id
       - cloud_account_id
@@ -2030,6 +2035,7 @@ components:
       - providerAccountId
       - integrationConfig
       - removedAt
+      - syncState
       type: object
     CloudintegrationtypesGettableServicesMetadata:
       properties:
@@ -2129,6 +2135,9 @@ components:
           type: object
         providerAccountId:
           type: string
+        syncedVersion:
+          nullable: true
+          type: integer
       required:
       - data
       type: object
@@ -2141,6 +2150,18 @@ components:
         gcp:
           $ref: '#/components/schemas/CloudintegrationtypesGCPIntegrationConfig'
       type: object
+    CloudintegrationtypesRegionState:
+      enum:
+      - enabled
+      - disabled
+      type: string
+    CloudintegrationtypesRegionSyncState:
+      properties:
+        state:
+          $ref: '#/components/schemas/CloudintegrationtypesRegionState'
+      required:
+      - state
+      type: object
     CloudintegrationtypesService:
       properties:
         assets:
@@ -2282,6 +2303,23 @@ components:
         metrics:
           type: boolean
       type: object
+    CloudintegrationtypesSyncState:
+      nullable: true
+      properties:
+        inSync:
+          type: boolean
+        regions:
+          additionalProperties:
+            $ref: '#/components/schemas/CloudintegrationtypesRegionSyncState'
+          type: object
+        version:
+          format: int64
+          type: integer
+      required:
+      - version
+      - inSync
+      - regions
+      type: object
     CloudintegrationtypesUpdatableAccount:
       properties:
         config:

docs/contributing/go/authz.md

@@ -118,7 +118,7 @@ router.Handle("/api/v1/service_accounts", handler.New(
 The pieces:
 
 - **`CheckResources(handlerFn, roles...)`** — the resource-aware authorization wrapper from [pkg/http/middleware/authz.go](/pkg/http/middleware/authz.go). The role list is the community-edition fallback: which managed roles may call this route when per-resource checks are unavailable.
-- **`ResourceDef`** — declares the resource, verb, audit category, how to extract the instance ID, and how to turn that ID into selectors. ID extractors live in [pkg/types/coretypes/extractor.go](/pkg/types/coretypes/extractor.go): `PathParam("id")`, `BodyField(func(req *T) string)` / `BodyFields(func(req *T) []string)` reading the request body the resource middleware decoded into the route's `OpenAPIDef.Request` type `T`, and `ResponseJSONPath("data.id")` for IDs only known after the handler runs (e.g. `create`). A handler on such a route reads the same decoded value with `coretypes.BodyFromContext[T](r.Context())`.
+- **`ResourceDef`** — declares the resource, verb, audit category, how to extract the instance ID, and how to turn that ID into selectors. ID extractors live in [pkg/types/coretypes/extractor.go](/pkg/types/coretypes/extractor.go): `PathParam("id")`, `BodyJSONPath("data.id")`, `BodyJSONArray("ids")`, and `ResponseJSONPath("data.id")` for IDs only known after the handler runs (e.g. `create`).
 - **`SecuritySchemes`** — advertises the required scope (`resource.Scope(verb)`, e.g. `serviceaccount:create`) in the OpenAPI spec.
 
 For routes that link two resources, use `AttachDetachSiblingResourceDef` (both sides are authz-checked, e.g. attaching a role to a service account requires `attach` on **both** the service account and the role). For parent-child routes (e.g. creating an API key under a service account), both sides are checked too, but with different verbs: declare a `BasicResourceDef` checking the child with `create`/`delete`, alongside an `AttachDetachParentChildResourceDef` checking the parent with `attach`/`detach` (within that def the child is only recorded for audit) — see the `/api/v1/service_accounts/{id}/keys` route in [pkg/apiserver/signozapiserver/serviceaccount.go](/pkg/apiserver/signozapiserver/serviceaccount.go).

ee/modules/cloudintegration/implcloudintegration/module.go

@@ -183,32 +183,52 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		return nil, errors.New(errors.TypeAlreadyExists, cloudintegrationtypes.ErrCodeCloudIntegrationAlreadyConnected, errMessage)
 	}
 
-	account, err := module.store.GetAccountByID(ctx, orgID, req.CloudIntegrationID, provider)
+	storableAccount, err := module.store.GetAccountByID(ctx, orgID, req.CloudIntegrationID, provider)
 	if err != nil {
 		return nil, err
 	}
 
+	account, err := cloudintegrationtypes.NewAccountFromStorable(storableAccount)
+	if err != nil {
+		return nil, err
+	}
+
+	syncState := account.NextSyncState(req.SyncedVersion)
+
 	// If account has been removed (disconnected), return a minimal response with empty integration config.
-	// The agent uses this response to clean up resources
 	if account.RemovedAt != nil {
+		// Heartbeat stays frozen after removal, only the sync state is updated.
+		if account.AgentReport != nil && syncState != nil {
+			account.UpdateSyncState(syncState)
+
+			storableAccount, err = cloudintegrationtypes.NewStorableCloudIntegration(account)
+			if err != nil {
+				return nil, err
+			}
+
+			err = module.store.UpdateAgentReport(ctx, storableAccount)
+			if err != nil {
+				return nil, err
+			}
+		}
+
 		return cloudintegrationtypes.NewAgentCheckInResponse(
 			req.ProviderAccountID,
 			account.ID.StringValue(),
 			new(cloudintegrationtypes.ProviderIntegrationConfig),
 			account.RemovedAt,
+			syncState,
 		), nil
 	}
 
-	// update account with cloud provider account id and agent report (heartbeat)
-	account.Update(&req.ProviderAccountID, cloudintegrationtypes.NewAgentReport(req.Data))
+	account.UpdateAgentReport(&req.ProviderAccountID, cloudintegrationtypes.NewAgentReport(req.Data, syncState))
 
-	err = module.store.UpdateAccount(ctx, account)
+	storableAccount, err = cloudintegrationtypes.NewStorableCloudIntegration(account)
 	if err != nil {
 		return nil, err
 	}
 
-	// Get account as domain object for config access (enabled regions, etc.)
-	domainAccount, err := cloudintegrationtypes.NewAccountFromStorable(account)
+	err = module.store.UpdateAgentReport(ctx, storableAccount)
 	if err != nil {
 		return nil, err
 	}
@@ -223,8 +243,7 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		return nil, err
 	}
 
-	// Delegate integration config building entirely to the provider module
-	integrationConfig, err := cloudProvider.BuildIntegrationConfig(ctx, domainAccount, storedServices)
+	integrationConfig, err := cloudProvider.BuildIntegrationConfig(ctx, account, storedServices)
 	if err != nil {
 		return nil, err
 	}
@@ -234,6 +253,7 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		account.ID.StringValue(),
 		integrationConfig,
 		account.RemovedAt,
+		syncState,
 	), nil
 }
 

frontend/.storybook/preview-head.html

@@ -70,3 +70,49 @@
 		Object.defineProperty(window, 'Date', { value: FrozenDate, writable: true });
 	})();
 </script>
+
+<script>
+	// Storybook has no microphone. Chromium's recognizer asks for one and for
+	// Google's speech service, and the `not-allowed` or `network` it reports makes
+	// the assistant hide its mic for the rest of the tab. This one starts
+	// listening at once and hears only what a story passes to `hear`.
+	(() => {
+		class StorySpeechRecognition extends EventTarget {
+			static listening = null;
+			lang = 'en-US';
+			continuous = false;
+			interimResults = false;
+			onstart = null;
+			onresult = null;
+			onerror = null;
+			onend = null;
+
+			start() {
+				StorySpeechRecognition.listening = this;
+				setTimeout(() => this.onstart?.());
+			}
+
+			stop() {
+				if (StorySpeechRecognition.listening === this) {
+					StorySpeechRecognition.listening = null;
+				}
+				setTimeout(() => this.onend?.());
+			}
+
+			abort() {
+				this.stop();
+			}
+
+			/** An interim result: the words so far, still listening. */
+			hear(transcript) {
+				const result = Object.assign([{ transcript, confidence: 1 }], {
+					isFinal: false,
+				});
+				this.onresult?.({ resultIndex: 0, results: [result] });
+			}
+		}
+
+		window.SpeechRecognition = StorySpeechRecognition;
+		window.webkitSpeechRecognition = StorySpeechRecognition;
+	})();
+</script>

frontend/.storybook/preview.tsx

@@ -122,7 +122,21 @@ const preview: Preview = {
 							['List', 'New', 'Edit'],
 						],
 						'Dashboards',
-						['List', 'Detail', 'Panel Editor', 'Public'],
+						[
+							'List',
+							'Detail',
+							[
+								'Overview',
+								'Settings',
+								'Variables',
+								'New Variable',
+								'Edit Variable',
+								'Authz',
+							],
+							'Panel Editor',
+							['Overview', 'Chart Options', 'Thresholds and Links'],
+							'Public',
+						],
 						'Services',
 						['List', 'Detail', 'Top Level Operations', 'Service Map'],
 						'Logs',

frontend/.storybook/test-runner.ts

@@ -23,6 +23,13 @@ const IGNORED_MESSAGES = [
 	// (YouTube embeds, the docs pane) so they hit the real network instead of
 	// an unanswered msw request; the block is the point, not a bug.
 	/violates the following Content Security Policy directive/,
+	// The filter editor's ANTLR parser reports every syntax error through
+	// `console.error` (`line 1:14 missing ...`), so each partial expression
+	// typed into it logs one; the editor shows the same errors on screen.
+	/^line \d+:\d+ /,
+	// Chromium's echo of a 4xx/5xx response, which the `[response]` entry below
+	// already reports with its URL and the time its request left.
+	/^Failed to load resource: the server responded with a status of /,
 ];
 
 interface CapturedMessage {
@@ -86,7 +93,9 @@ const config: TestRunnerConfig = {
 		page.on('response', (response) => {
 			if (response.status() >= 400) {
 				messages.push({
-					at: Date.now(),
+					// The browser's clock, when the request left: a busy runner receives
+					// the outgoing story's responses after the next story has started.
+					at: response.request().timing().startTime,
 					text: `[response] ${response.status()} ${response.url()}`,
 				});
 			}

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

@@ -3396,6 +3396,37 @@ export interface CloudintegrationtypesAWSServiceConfigDTO {
 	metrics?: CloudintegrationtypesAWSServiceMetricsConfigDTO;
 }
 
+export enum CloudintegrationtypesRegionStateDTO {
+	enabled = 'enabled',
+	disabled = 'disabled',
+}
+export interface CloudintegrationtypesRegionSyncStateDTO {
+	state: CloudintegrationtypesRegionStateDTO;
+}
+
+export type CloudintegrationtypesSyncStateDTORegions = {
+	[key: string]: CloudintegrationtypesRegionSyncStateDTO;
+};
+
+/**
+ * @nullable
+ */
+export type CloudintegrationtypesSyncStateDTO = {
+	/**
+	 * @type boolean
+	 */
+	inSync: boolean;
+	/**
+	 * @type object
+	 */
+	regions: CloudintegrationtypesSyncStateDTORegions;
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	version: number;
+} | null;
+
 export type CloudintegrationtypesAgentReportDTODataAnyOf = {
 	[key: string]: unknown;
 };
@@ -3414,6 +3445,7 @@ export type CloudintegrationtypesAgentReportDTO = {
 	 * @type object,null
 	 */
 	data: CloudintegrationtypesAgentReportDTOData;
+	syncState: CloudintegrationtypesSyncStateDTO | null;
 	/**
 	 * @type integer
 	 * @format int64
@@ -3842,6 +3874,7 @@ export interface CloudintegrationtypesGettableAgentCheckInDTO {
 	 * @format date-time
 	 */
 	removedAt: string | null;
+	syncState: CloudintegrationtypesSyncStateDTO | null;
 }
 
 export interface CloudintegrationtypesServiceMetadataDTO {
@@ -3912,6 +3945,10 @@ export interface CloudintegrationtypesPostableAgentCheckInDTO {
 	 * @type string
 	 */
 	providerAccountId?: string;
+	/**
+	 * @type integer,null
+	 */
+	syncedVersion?: number | null;
 }
 
 export interface CloudintegrationtypesStorableIntegrationDashboardDTO {

frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/stories/__story_mockdata__/querySearch.play.ts

@@ -0,0 +1,229 @@
+import { EditorView } from '@codemirror/view';
+import { userEvent, waitFor, within } from 'storybook/test';
+
+/** Suggestions wait on a 300ms debounce and a fetch, past the 1s default. */
+const untilLoaded = { timeout: 15_000 };
+
+/** Throws until `found` holds something, which is what `waitFor` retries on. */
+const present = <TValue>(
+	found: TValue | null | undefined,
+	what: string,
+): TValue => {
+	if (found === null || found === undefined) {
+		throw new Error(`${what} not found`);
+	}
+
+	return found;
+};
+
+const suggestionList = (canvasElement: HTMLElement): HTMLElement | null =>
+	canvasElement.querySelector<HTMLElement>('.cm-tooltip-autocomplete');
+
+const suggestionRow = (
+	canvasElement: HTMLElement,
+	text: string,
+): HTMLElement | undefined => {
+	const list = suggestionList(canvasElement);
+
+	return list
+		? within(list)
+				.queryAllByRole('option')
+				.find((option) => option.textContent?.includes(text))
+		: undefined;
+};
+
+/** Ctrl+Space, the editor's own shortcut for asking for suggestions. */
+const requestSuggestions = (editor: HTMLElement): void => {
+	editor.dispatchEvent(
+		new KeyboardEvent('keydown', {
+			key: ' ',
+			code: 'Space',
+			ctrlKey: true,
+			bubbles: true,
+		}),
+	);
+};
+
+const currentView = (
+	canvasElement: HTMLElement,
+): { editor: HTMLElement; view: EditorView } => {
+	// An explorer renders one editor per query; the first is the one on screen.
+	const editor = present(
+		canvasElement.querySelector<HTMLElement>(
+			'.code-mirror-where-clause .cm-content',
+		),
+		'filter editor',
+	);
+
+	return {
+		editor,
+		view: present(EditorView.findFromDOM(editor), 'editor view'),
+	};
+};
+
+/**
+ * The explorers wrap the filter in `OverlayScrollbar`, which initialises when
+ * the browser is idle. Initialising moves the content, the editor with it, and
+ * focuses the editor again through the DOM, which puts the caret back at the
+ * start and swaps the suggestions for the key list. Throws until every wrapper
+ * around the filter has initialised.
+ */
+const assertScrollbarsReady = (editor: HTMLElement): void => {
+	for (
+		let wrapper = editor.closest('.overlay-scrollbar');
+		wrapper;
+		wrapper = wrapper.parentElement?.closest('.overlay-scrollbar') ?? null
+	) {
+		if (!wrapper.hasAttribute('data-overlayscrollbars')) {
+			throw new Error('scrollbars around the filter still initialising');
+		}
+	}
+};
+
+/**
+ * Waits until `text` shows in the suggestion list, asking for suggestions
+ * whenever the list is shut. Focus and typing only open it once the keys have
+ * loaded, and moving the caret never does.
+ */
+const waitForSuggestion = (
+	canvasElement: HTMLElement,
+	text: string,
+): Promise<HTMLElement> =>
+	waitFor(
+		() => {
+			const { editor } = currentView(canvasElement);
+
+			if (!suggestionList(canvasElement)) {
+				requestSuggestions(editor);
+			}
+
+			return present(suggestionRow(canvasElement, text), `suggestion "${text}"`);
+		},
+		{ ...untilLoaded, interval: 250 },
+	);
+
+/**
+ * Focuses the filter once the scrollbars around it have initialised, and waits
+ * for its suggestion list.
+ */
+const focusFilter = async (canvasElement: HTMLElement): Promise<EditorView> => {
+	await waitFor(
+		() => {
+			const { editor, view } = currentView(canvasElement);
+
+			assertScrollbarsReady(editor);
+
+			if (!view.hasFocus) {
+				view.focus();
+			}
+
+			if (!suggestionList(canvasElement)) {
+				requestSuggestions(editor);
+			}
+
+			return present(suggestionList(canvasElement), 'suggestion list');
+		},
+		{ ...untilLoaded, interval: 250 },
+	);
+
+	return currentView(canvasElement).view;
+};
+
+/** Waits for a row of the suggestion list. */
+export const findSuggestion = (
+	canvasElement: HTMLElement,
+	text: string,
+): Promise<HTMLElement> => waitForSuggestion(canvasElement, text);
+
+/** Focuses the empty filter: every key, with any recent filters above them. */
+export const openKeySuggestions = async (
+	canvasElement: HTMLElement,
+	row: string,
+): Promise<void> => {
+	await focusFilter(canvasElement);
+	await waitForSuggestion(canvasElement, row);
+};
+
+/**
+ * Focuses the filter and types onto the end of it one character at a time,
+ * each as the transaction a keystroke makes, leaving the caret at the end so
+ * the suggestion list follows what was typed. Quotes and brackets are not
+ * closed for it: type both.
+ *
+ * `userEvent.type` cannot be used: CodeMirror redraws the line as tokens are
+ * highlighted, which strands the caret `userEvent` tracks.
+ */
+export const typeFilter = async (
+	canvasElement: HTMLElement,
+	text: string,
+): Promise<void> => {
+	const view = await focusFilter(canvasElement);
+
+	for (const character of text) {
+		const at = view.state.doc.length;
+
+		view.dispatch({
+			changes: { from: at, insert: character },
+			selection: { anchor: at + character.length },
+			userEvent: 'input.type',
+		});
+	}
+};
+
+/**
+ * Types an expression, then steps the caret back inside it, before a closing
+ * bracket or parenthesis, where the suggestions are about what goes in there.
+ */
+export const typeFilterWithCaretBack = async (
+	canvasElement: HTMLElement,
+	text: string,
+	stepsBack: number,
+	row: string,
+): Promise<void> => {
+	await typeFilter(canvasElement, text);
+
+	const { view } = currentView(canvasElement);
+
+	view.dispatch({
+		selection: { anchor: view.state.doc.length - stepsBack },
+		userEvent: 'select',
+	});
+	await waitForSuggestion(canvasElement, row);
+};
+
+/**
+ * Moves focus off the filter, which is when the expression is validated and
+ * the error marker can show.
+ */
+export const blurFilter = async (canvasElement: HTMLElement): Promise<void> => {
+	await userEvent.keyboard('{Escape}');
+	await userEvent.click(canvasElement.ownerDocument.body);
+};
+
+/** Types an expression, leaves the filter and opens its validation errors. */
+export const showFilterErrors = async (
+	canvasElement: HTMLElement,
+	text: string,
+): Promise<void> => {
+	await typeFilter(canvasElement, text);
+	await blurFilter(canvasElement);
+
+	const marker = await waitFor(
+		() =>
+			present(
+				canvasElement.querySelector<HTMLElement>('.query-status-container button'),
+				'error marker',
+			),
+		untilLoaded,
+	);
+
+	await userEvent.hover(marker);
+	await waitFor(
+		() =>
+			present(
+				canvasElement.ownerDocument.querySelector('.query-validation-error'),
+				'validation error',
+			),
+		untilLoaded,
+	);
+};

frontend/src/components/TanStackTableView/TanStackTable.tsx

@@ -233,12 +233,23 @@ function TanStackTableInner<TData, TItemKey = string>(
 		[effectiveColumns],
 	);
 
+	// A rebuilt column def is a new cell component to React, which remounts every
+	// cell it renders. Read the row callbacks through refs so inline ones do not.
+	const isRowActiveRef = useRef(isRowActive);
+	isRowActiveRef.current = isRowActive;
+	const getRowKeyDataRef = useRef(getRowKeyData);
+	getRowKeyDataRef.current = getRowKeyData;
+
 	const tanstackColumns = useMemo<ColumnDef<TData>[]>(
 		() =>
 			effectiveColumns.map((colDef) =>
-				buildTanstackColumnDef<TData, TItemKey>(colDef, isRowActive, getRowKeyData),
+				buildTanstackColumnDef<TData, TItemKey>(
+					colDef,
+					(row) => isRowActiveRef.current?.(row) ?? false,
+					(index) => getRowKeyDataRef.current(index),
+				),
 			),
-		[effectiveColumns, isRowActive, getRowKeyData],
+		[effectiveColumns],
 	);
 
 	const getRowId = useCallback(

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

@@ -1,8 +1,16 @@
+import { useEffect, useState } from 'react';
 import { fireEvent, screen, waitFor, within } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { UrlUpdateEvent } from 'nuqs/adapters/testing';
 
-import { renderTanStackTable } from './testUtils';
+import TanStackTable from '../index';
+import type { TableColumnDef } from '../types';
+import {
+	defaultData,
+	renderTanStackTable,
+	renderWithProviders,
+	type TestRow,
+} from './testUtils';
 
 jest.mock('hooks/useDarkMode', () => ({
 	useIsDarkMode: (): boolean => false,
@@ -810,6 +818,58 @@ describe('TanStackTableView Integration', () => {
 		});
 	});
 
+	describe('cell identity', () => {
+		it('keeps cells mounted across re-renders that pass new inline row callbacks', async () => {
+			const user = userEvent.setup();
+			const onMount = jest.fn();
+
+			function MountTracker({ id }: { id: string }): JSX.Element {
+				useEffect(() => onMount(id), [id]);
+				return <span data-testid={`tracked-${id}`}>Row {id}</span>;
+			}
+
+			const columns: TableColumnDef<TestRow>[] = [
+				{
+					id: 'id',
+					header: 'ID',
+					accessorKey: 'id',
+					cell: ({ row }): JSX.Element => <MountTracker id={row.id} />,
+				},
+			];
+
+			function Harness(): JSX.Element {
+				const [, setRenders] = useState(0);
+
+				return (
+					<>
+						<button
+							type="button"
+							data-testid="rerender"
+							onClick={(): void => setRenders((count) => count + 1)}
+						>
+							Re-render
+						</button>
+						<TanStackTable<TestRow>
+							data={defaultData}
+							columns={columns}
+							getRowKey={(row): string => row.id}
+							isRowActive={(row): boolean => row.id === '1'}
+						/>
+					</>
+				);
+			}
+
+			renderWithProviders(<Harness />);
+			await screen.findByTestId('tracked-2');
+			onMount.mockClear();
+
+			await user.click(screen.getByTestId('rerender'));
+			await user.hover(screen.getByTestId('tracked-2'));
+
+			expect(onMount).not.toHaveBeenCalled();
+		});
+	});
+
 	describe('disableVirtualScroll', () => {
 		it('throws error when used with onEndReached', () => {
 			expect(() => {

frontend/src/container/Integrations/CloudIntegration/AmazonWebServices/__tests__/mockData.ts

@@ -24,6 +24,7 @@ const accountsResponse: ListAccounts200 = {
 				agentReport: {
 					timestampMillis: 1747114366214,
 					data: null,
+					syncState: null,
 				},
 				providerAccountId: PROVIDER_ACCOUNT_ID,
 				removedAt: null,

frontend/src/modules/Servicemap/stories/ServiceMap.stories.mocks.tsx

@@ -8,6 +8,7 @@ import { QueryParams } from 'constants/query';
 import ROUTES from 'constants/routes';
 import { encode } from 'js-base64';
 import type { Tags } from 'hooks/useResourceAttribute/types';
+import { fireEvent, userEvent, waitFor, within } from 'storybook/test';
 
 import {
 	choiceControl,
@@ -31,6 +32,9 @@ import {
 	type ServiceHealth,
 } from './__story_mockdata__/serviceMap';
 
+/** The keys are only fetched once the select opens, past the 1s default. */
+const untilLoaded = { timeout: 15_000 };
+
 const GRAPH = 'Service map · graph';
 const FILTERS = 'Service map · filters';
 
@@ -129,3 +133,80 @@ export const serviceMapMocks = defineStoryMocks({
 	],
 	config: (values) => ({ route: serviceMapRoute(values.filters) }),
 });
+
+/** Opens the select under a test id; it closes again after every pick. */
+export const openSelect = async (
+	canvasElement: HTMLElement,
+	testId: string,
+): Promise<void> => {
+	const select = await within(canvasElement).findByTestId(
+		testId,
+		undefined,
+		untilLoaded,
+	);
+
+	await userEvent.click(within(select).getByRole('combobox'));
+};
+
+export const OPEN_DROPDOWN =
+	'.ant-select-dropdown:not(.ant-select-dropdown-hidden)';
+
+/** antd keeps a hidden copy of each label for screen readers; the title skips it. */
+const visibleOption = (title: string): HTMLElement | null =>
+	document.querySelector<HTMLElement>(
+		`${OPEN_DROPDOWN} .ant-select-item-option[title="${title}"]`,
+	);
+
+/**
+ * Picks the option titled `title` in the open dropdown. `userEvent.click`
+ * moves focus off the select on the way, which closes it before the option
+ * takes the click.
+ */
+export const pickOption = async (title: string): Promise<void> => {
+	const option = await waitFor(() => {
+		const match = visibleOption(title);
+
+		if (!match) {
+			throw new Error(`option "${title}" not found`);
+		}
+
+		return match;
+	}, untilLoaded);
+
+	await fireEvent.click(option);
+};
+
+/**
+ * Opens the attribute filter on its next step. Each single-choice pick closes
+ * the dropdown and swaps the select for the next step's, and a click that lands
+ * before the swap opens nothing, so it opens again until `title` shows.
+ */
+export const openAttributeFilterOn = (
+	canvasElement: HTMLElement,
+	title: string,
+): Promise<void> =>
+	waitFor(
+		async () => {
+			if (visibleOption(title)) {
+				return;
+			}
+
+			if (!document.querySelector(OPEN_DROPDOWN)) {
+				await openSelect(canvasElement, 'resource-attributes-filter');
+			}
+
+			throw new Error(`option "${title}" not shown`);
+		},
+		{ ...untilLoaded, interval: 500 },
+	);
+
+/** Stages `k8s.cluster.name IN` and leaves the filter open on its values. */
+export const stageClusterIn = async (
+	canvasElement: HTMLElement,
+): Promise<void> => {
+	await openAttributeFilterOn(canvasElement, 'k8s.cluster.name');
+	await pickOption('k8s.cluster.name');
+	await openAttributeFilterOn(canvasElement, 'IN');
+	await pickOption('IN');
+	await openAttributeFilterOn(canvasElement, 'staging-eu');
+};

frontend/src/modules/Servicemap/stories/ServiceMap.stories.tsx

@@ -1,10 +1,17 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { screen, userEvent, 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';
 
-import { serviceMapMocks } from './ServiceMap.stories.mocks';
+import {
+	OPEN_DROPDOWN,
+	openAttributeFilterOn,
+	openSelect,
+	pickOption,
+	serviceMapMocks,
+	stageClusterIn,
+} from './ServiceMap.stories.mocks';
 
 import ServiceMapContainer from '../index';
 
@@ -97,3 +104,49 @@ export const FilterAttributes: Story = {
 		await screen.findByText('k8s.cluster.name', undefined, untilLoaded);
 	},
 };
+
+/** A key staged as a chip, the filter open again on how to match it. */
+export const FilterOperators: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openAttributeFilterOn(canvasElement, 'k8s.cluster.name');
+		await pickOption('k8s.cluster.name');
+		await openAttributeFilterOn(canvasElement, 'Not IN');
+	},
+};
+
+/** A key and `IN` staged, the filter open on the values the key holds. */
+export const FilterValues: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await stageClusterIn(canvasElement);
+	},
+};
+
+/** Two values ticked before the filter is left, which is what applies it. */
+export const FilterValuesSelected: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await stageClusterIn(canvasElement);
+		await pickOption('prod-us-east');
+		await pickOption('prod-eu-west');
+		await waitFor(
+			() =>
+				expect(
+					document.querySelectorAll('.ant-select-item-option-selected'),
+				).toHaveLength(2),
+			untilLoaded,
+		);
+	},
+};
+
+/** The environment selector open on the environments the calls came from. */
+export const EnvironmentOptions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openSelect(canvasElement, 'resource-environment-filter');
+		await waitFor(
+			() =>
+				expect(
+					document.querySelector(`${OPEN_DROPDOWN} .ant-select-item-option`),
+				).not.toBeNull(),
+			untilLoaded,
+		);
+	},
+};

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

@@ -7,6 +7,7 @@ import { AI_API_PATH, setAIBackendUrl } from 'api/AIAPIInstance';
 import ROUTES from 'constants/routes';
 import { useAIAssistantStore } from 'container/AIAssistant/store/useAIAssistantStore';
 import { rest, type RequestHandler } from 'msw';
+import { expect, userEvent, waitFor, within } from 'storybook/test';
 
 import {
 	choiceControl,
@@ -270,3 +271,40 @@ export const longActionTooltipHandlers: RequestHandler[] = onBothBases(
 		);
 	},
 );
+
+/** The recognizer `.storybook/preview-head.html` installs in place of the browser's. */
+interface StorySpeechRecognition {
+	listening: { hear: (transcript: string) => void } | null;
+}
+
+/**
+ * Clicks the composer's mic and waits for the recording to start. The composer
+ * stays disabled until the thread has loaded.
+ */
+export const startVoiceInput = async (
+	canvasElement: HTMLElement,
+): Promise<void> => {
+	const canvas = within(canvasElement);
+	const mic = await waitFor(
+		async () => {
+			const button = canvas.getByRole('button', { name: /start voice input/i });
+
+			// Depending on its version, Button disables through `disabled` or `aria-disabled`.
+			await expect(button).toBeEnabled();
+			await expect(button).not.toHaveAttribute('aria-disabled', 'true');
+
+			return button;
+		},
+		{ timeout: 15_000 },
+	);
+
+	await userEvent.click(mic);
+	await canvas.findByRole('status', { name: /recording voice input/i });
+};
+
+/** Speaks into the open recording: the words so far, still listening. */
+export const speak = (transcript: string): void => {
+	(
+		window as unknown as { webkitSpeechRecognition: StorySpeechRecognition }
+	).webkitSpeechRecognition.listening?.hear(transcript);
+};

frontend/src/pages/AIAssistantPage/stories/AIAssistantPage.stories.tsx

@@ -10,6 +10,8 @@ import AIAssistantPage from '../AIAssistantPage';
 import {
 	aiAssistantMocks,
 	longActionTooltipHandlers,
+	speak,
+	startVoiceInput,
 } from './AIAssistantPage.stories.mocks';
 import type { ThreadPart } from './__story_mockdata__/aiAssistant';
 
@@ -47,11 +49,15 @@ type Story = StoryObj<AIAssistantArgs>;
 /** The thread list resolves before the thread does, which outlasts the 1s default. */
 const untilLoaded = { timeout: 15_000 };
 
+/** How long what a click opened has to stay on screen to count as open. */
+const HOLD_MS = 1_000;
+
 /**
  * Click something, and keep clicking until what it opens is on screen. The
  * message list remounts its items while it measures a freshly loaded thread, so
  * a single click can land on a row that is about to be replaced, taking the
- * state it just set with it.
+ * state it just set with it. The replacement can land after that state has
+ * rendered, so it has to still be there `HOLD_MS` later.
  */
 const clickUntil = async (
 	find: () => Promise<HTMLElement>,
@@ -60,6 +66,10 @@ const clickUntil = async (
 	await waitFor(async () => {
 		await userEvent.click(await find());
 		await screen.findByText(opens, undefined, { timeout: 1_000 });
+		await new Promise((resolve) => {
+			setTimeout(resolve, HOLD_MS);
+		});
+		screen.getByText(opens);
 	}, untilLoaded);
 };
 
@@ -173,6 +183,18 @@ export const ApprovalDiff: Story = {
 	play: openApprovalDiff,
 };
 
+/**
+ * Dictating a question: the mic listening, the words heard so far in the
+ * composer, and the controls to discard them or stop and send.
+ */
+export const VoiceRecording: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await startVoiceInput(canvasElement);
+		speak('why did checkout p99 jump after the 14:00 deploy');
+		await within(canvasElement).findByDisplayValue(/checkout p99 jump/);
+	},
+};
+
 /** The comment box a thumbs down opens, which a thumbs up does not. */
 export const NegativeFeedback: Story = {
 	play: async ({ canvasElement }): Promise<void> => {
@@ -243,3 +265,13 @@ export const TooltipsInApprovalDiff: Story = {
 	args: { tooltipsOpen: true, agent: 'awaiting-approval', contents: BRIEF },
 	play: openApprovalDiff,
 };
+
+/**
+ * The recording controls' tooltips, held open: discard, stop and send, and the
+ * send button beside them, which waits for words.
+ */
+export const TooltipsInVoiceRecording: Story = {
+	args: { tooltipsOpen: true, contents: BRIEF },
+	play: async ({ canvasElement }): Promise<void> =>
+		startVoiceInput(canvasElement),
+};

frontend/src/pages/AlertList/PlannedDowntime/stories/PlannedDowntime.stories.tsx

@@ -103,6 +103,18 @@ export const DeleteDowntimeConfirm: Story = {
 	},
 };
 
+/** The new-downtime form set to repeat weekly, which adds the days and duration. */
+export const NewDowntimeRecurring: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await NewDowntime.play?.({ canvasElement } as never);
+		await userEvent.click(
+			await screen.findByRole('combobox', { name: 'Repeats every' }),
+		);
+		await userEvent.click(await screen.findByText('Weekly'));
+		await screen.findByText('Duration');
+	},
+};
+
 /** A client-side search with no matching downtime schedule. */
 export const SearchNoResults: Story = {
 	play: async ({ canvasElement }): Promise<void> => {

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

@@ -6,9 +6,19 @@
 import { rest } from 'msw';
 import set from 'api/browser/localstorage/set';
 import { LOCALSTORAGE } from 'constants/localStorage';
+import { screen, userEvent, waitFor, within } from 'storybook/test';
 
-import { countControl, toggleControl } from '@/storybook/controls/controls';
+import {
+	choiceControl,
+	countControl,
+	toggleControl,
+} from '@/storybook/controls/controls';
 import { defineStoryMocks } from '@/storybook/controls/defineStoryMocks';
+import {
+	RESPONSE_STATES,
+	type ResponseState,
+	respondWith,
+} from '@/storybook/runtime/responseState';
 import { fieldValuesResponse } from '@/storybook/msw/__story_mockdata__/fields';
 
 import {
@@ -23,6 +33,9 @@ import {
 	type ListErrorsBody,
 } from './__story_mockdata__/exceptions';
 
+/** The page fetches before it renders a row, which outlasts the 1s default. */
+const untilLoaded = { timeout: 15_000 };
+
 const LIST = 'Exceptions · list';
 const FILTERS = 'Exceptions · filters';
 
@@ -42,6 +55,13 @@ export const exceptionsMocks = defineStoryMocks({
 			value: 6,
 			max: EXCEPTION_QUICK_FILTER_CAP,
 		}),
+		filterKeys: choiceControl<ResponseState>('Filter keys', {
+			group: FILTERS,
+			description:
+				'How `/autocomplete/attribute_keys` answers when the resource filter opens, apart from the page-wide Data control.',
+			options: RESPONSE_STATES,
+			value: 'loaded',
+		}),
 		filterPanel: toggleControl('Quick filters panel', {
 			group: FILTERS,
 			description:
@@ -92,7 +112,7 @@ export const exceptionsMocks = defineStoryMocks({
 
 		rest.get(
 			'http://localhost/api/v3/autocomplete/attribute_keys',
-			response.json((req) =>
+			respondWith(values.filterKeys, (req) =>
 				exceptionAttributeKeysResponse(req.url.searchParams.get('searchText')),
 			),
 		),
@@ -111,3 +131,61 @@ export const exceptionsMocks = defineStoryMocks({
 		set(LOCALSTORAGE.SHOW_EXCEPTIONS_QUICK_FILTERS, String(values.filterPanel));
 	},
 });
+
+export const openResourceFilter = async (
+	canvasElement: HTMLElement,
+): Promise<HTMLElement> => {
+	const filter = await within(canvasElement).findByTestId(
+		'qb-search-select',
+		undefined,
+		untilLoaded,
+	);
+
+	await userEvent.click(within(filter).getByRole('combobox'));
+
+	return filter;
+};
+
+/**
+ * Clicks the visible row whose label is `text`. The dropdown renders in the
+ * body, a key row carries its type beside the label, and antd keeps a hidden
+ * copy of each label for screen readers that takes no clicks.
+ *
+ * The key list renders twice after the filter opens, since a second key
+ * request empties it until it answers. The click happens in the same task as
+ * the lookup: `fireEvent` from `storybook/test` dispatches a tick later, which
+ * can land on a row already removed and never reach React.
+ */
+export const pickSuggestion = async (text: string): Promise<void> => {
+	await waitFor(() => {
+		const match = Array.from(
+			document.querySelectorAll<HTMLElement>(
+				'.query-builder-search.ant-select-dropdown:not(.ant-select-dropdown-hidden) .ant-select-item-option',
+			),
+		).find((option) =>
+			Array.from(option.querySelectorAll('*')).some(
+				(node) => node.children.length === 0 && node.textContent === text,
+			),
+		);
+
+		if (!match) {
+			throw new Error(`suggestion "${text}" not found`);
+		}
+
+		// `userEvent.click` moves focus off the search input on the way, which closes
+		// the dropdown before the row takes the click.
+		match.click();
+	}, untilLoaded);
+};
+
+export const commitFilter = async (
+	key: string,
+	operator: string,
+	value: string,
+): Promise<void> => {
+	await pickSuggestion(key);
+	await screen.findByText('Operator for', { exact: false }, untilLoaded);
+	await pickSuggestion(operator);
+	await screen.findByText('Value(s) for', { exact: false }, untilLoaded);
+	await pickSuggestion(value);
+};

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

@@ -5,7 +5,12 @@ import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
 import { storyMocks } from '@/storybook/controls/defineStoryMocks';
 import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
 
-import { exceptionsMocks } from './AllErrors.stories.mocks';
+import {
+	commitFilter,
+	exceptionsMocks,
+	openResourceFilter,
+	pickSuggestion,
+} from './AllErrors.stories.mocks';
 import AllErrors from '../index';
 
 type AllErrorsArgs = PageStoryArgs<typeof exceptionsMocks>;
@@ -125,3 +130,108 @@ export const QuickFiltersSettingsWithBanner: Story = {
 	args: { banner: 'trial-expiry' },
 	play: dirtyQuickFiltersSettings,
 };
+
+/** The resource filter opened: every key the exceptions can be narrowed by. */
+export const FilterKeySuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openResourceFilter(canvasElement);
+		await screen.findByText('Suggested Filters', undefined, untilLoaded);
+	},
+};
+
+/** The key list grown past its first rows with the Show all shortcut. */
+export const FilterAllKeys: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openResourceFilter(canvasElement);
+		await screen.findByText('Show all filter items', undefined, untilLoaded);
+		await userEvent.keyboard('{Control>}/{/Control}');
+		await screen.findByText('cloud.region', undefined, untilLoaded);
+	},
+};
+
+/** A partial key: the typed text as a free search, then the keys that match. */
+export const FilterPartialKey: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const filter = await openResourceFilter(canvasElement);
+
+		await userEvent.type(within(filter).getByRole('combobox'), 'serv');
+		await screen.findByText('service.namespace', undefined, untilLoaded);
+	},
+};
+
+/** A key picked: the operators the exceptions page allows for it. */
+export const FilterOperatorSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openResourceFilter(canvasElement);
+		await pickSuggestion('service.name');
+		await screen.findByText('Operator for', { exact: false }, untilLoaded);
+	},
+};
+
+/** A key and an operator picked: the values the key holds. */
+export const FilterValueSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openResourceFilter(canvasElement);
+		await pickSuggestion('service.name');
+		await pickSuggestion('=');
+		await screen.findByText('Value(s) for', { exact: false }, untilLoaded);
+	},
+};
+
+/** Two conditions committed as chips, with the dropdown closed again. */
+export const FilterChips: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openResourceFilter(canvasElement);
+		await commitFilter('service.name', '=', 'checkout');
+		await commitFilter('deployment.environment', '!=', 'staging');
+		await userEvent.click(canvasElement.ownerDocument.body);
+		await within(canvasElement).findByText(
+			'deployment.environment != staging',
+			undefined,
+			untilLoaded,
+		);
+	},
+};
+
+/**
+ * A committed chip clicked to change it: its text goes back into the input,
+ * with the dropdown shut until the input is typed into.
+ */
+export const FilterEditChip: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openResourceFilter(canvasElement);
+		await commitFilter('service.name', '=', 'checkout');
+		await userEvent.click(
+			await within(canvasElement).findByText(
+				'service.name = checkout',
+				undefined,
+				untilLoaded,
+			),
+		);
+		// The select remounts whenever its chips change, so it is looked up again.
+		await waitFor(
+			() =>
+				expect(
+					within(within(canvasElement).getByTestId('qb-search-select')).getByRole(
+						'combobox',
+					),
+				).toHaveValue('service.name = checkout'),
+			untilLoaded,
+		);
+	},
+};
+
+/** The key list while its request is still in flight. */
+export const FilterKeysLoading: Story = {
+	args: { filterKeys: 'loading' },
+	play: async ({ canvasElement }): Promise<void> => {
+		await openResourceFilter(canvasElement);
+		await waitFor(
+			() =>
+				expect(
+					document.querySelector('.query-builder-search .ant-spin'),
+				).not.toBeNull(),
+			untilLoaded,
+		);
+	},
+};

frontend/src/pages/DashboardPage/PanelEditorPage/stories/PanelEditorPage.stories.tsx

@@ -21,7 +21,8 @@ const pageStory = storyMocks(panelEditorMocks, { layout: 'app' });
  * Route: `/dashboard/:dashboardId/panel/:panelId`.
  */
 const meta = {
-	title: 'Pages/Dashboards/Panel Editor',
+	title: 'Pages/Dashboards/Panel Editor/Overview',
+	tags: ['authz'],
 	// The page is wrapped in `withAuthZPage`, which types its props as an index
 	// signature; the story's args are what the controls resolve to.
 	component: PanelEditorPage as ComponentType<PanelEditorArgs>,
@@ -49,6 +50,36 @@ export const NewPanel: Story = {
 	args: { panel: 'new' },
 };
 
+/** A number panel: one value, formatted, with comparison thresholds. */
+export const NumberPanel: Story = {
+	args: { panel: 'p99-latency' },
+};
+
+/** A bar chart, whose Visualization section offers stacking. */
+export const BarChartPanel: Story = {
+	args: { panel: 'errors-by-status' },
+};
+
+/** A pie chart, with a legend per slice and no axes. */
+export const PieChartPanel: Story = {
+	args: { panel: 'traffic-share' },
+};
+
+/** A new area chart: the time series options with the area filled. */
+export const AreaChartPanel: Story = {
+	args: { panel: 'new', newPanelKind: 'area-chart' },
+};
+
+/** A new histogram, where the display options are its buckets. */
+export const HistogramPanel: Story = {
+	args: { panel: 'new', newPanelKind: 'histogram' },
+};
+
+/** A new text panel: a markdown body in place of the query builder. */
+export const TextPanel: Story = {
+	args: { panel: 'new', newPanelKind: 'text' },
+};
+
 /** A list panel, where the config pane is the column editor. */
 export const ListPanel: Story = {
 	args: { panel: 'recent-logs' },

frontend/src/pages/DashboardPage/PanelEditorPage/stories/__story_mockdata__/panelEditor.ts

@@ -22,11 +22,13 @@ import type { PanelKind } from '../../../DashboardContainer/Panels/types/panelKi
 export const NEW_PANEL_KINDS = [
 	'time-series',
 	'bar-chart',
+	'area-chart',
 	'number',
 	'pie-chart',
 	'table',
 	'histogram',
 	'list',
+	'text',
 ] as const;
 
 export type NewPanelKind = (typeof NEW_PANEL_KINDS)[number];
@@ -34,11 +36,13 @@ export type NewPanelKind = (typeof NEW_PANEL_KINDS)[number];
 const KIND_BY_OPTION: Record<NewPanelKind, PanelKind> = {
 	'time-series': 'signoz/TimeSeriesPanel',
 	'bar-chart': 'signoz/BarChartPanel',
+	'area-chart': 'signoz/AreaChartPanel',
 	number: 'signoz/NumberPanel',
 	'pie-chart': 'signoz/PieChartPanel',
 	table: 'signoz/TablePanel',
 	histogram: 'signoz/HistogramPanel',
 	list: 'signoz/ListPanel',
+	text: 'signoz/TextPanel',
 };
 
 export const newPanelKindOf = (option: NewPanelKind): PanelKind =>

frontend/src/pages/DashboardPage/PanelEditorPage/stories/sections/ChartOptions.stories.tsx

@@ -0,0 +1,190 @@
+import type { ComponentType } from 'react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Route } from 'react-router-dom';
+import ROUTES from 'constants/routes';
+import { expect, screen, userEvent, waitFor } from 'storybook/test';
+
+import { storyMocks } from '@/storybook/controls/defineStoryMocks';
+import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
+
+import { panelEditorMocks } from '../PanelEditorPage.stories.mocks';
+import {
+	expandSection,
+	openConfigSelect,
+	pickSegment,
+} from './panelEditorPlay';
+
+import PanelEditorPage from '../../PanelEditorPage';
+
+type PanelEditorArgs = PageStoryArgs<typeof panelEditorMocks>;
+
+const pageStory = storyMocks(panelEditorMocks, { layout: 'app' });
+
+/**
+ * The panel editor's display options, one section open at a time: what each
+ * panel kind lets a user tune about how its data is drawn, and the preview
+ * following along.
+ *
+ * Route: `/dashboard/:dashboardId/panel/:panelId`.
+ */
+const meta = {
+	title: 'Pages/Dashboards/Panel Editor/Chart Options',
+	tags: ['authz', 'play'],
+	component: PanelEditorPage as ComponentType<PanelEditorArgs>,
+	render: (): JSX.Element => (
+		<Route path={ROUTES.DASHBOARD_PANEL_EDITOR} component={PanelEditorPage} />
+	),
+	...pageStory,
+	parameters: { ...pageStory.parameters },
+} satisfies Meta<PanelEditorArgs>;
+
+export default meta;
+
+type Story = StoryObj<PanelEditorArgs>;
+
+/** The panel type picker, open on the kinds this query can be drawn as. */
+export const PanelTypeOpen: Story = {
+	play: async () => {
+		await openConfigSelect('panel-editor-v2-type-switcher');
+		await screen.findByRole('listbox');
+	},
+};
+
+/** The time range the panel reads, open on its choices. */
+export const TimePreferenceOpen: Story = {
+	play: async () => {
+		await openConfigSelect('panel-editor-v2-time-preference');
+		await screen.findByRole('listbox');
+	},
+};
+
+/** Formatting & Units: the unit and decimals the values are shown with. */
+export const Formatting: Story = {
+	play: async () => {
+		await expandSection('Formatting & Units');
+		await screen.findByTestId('panel-editor-v2-decimals');
+	},
+};
+
+/** The unit picker, open on its categories. */
+export const UnitPickerOpen: Story = {
+	play: async (context) => {
+		await Formatting.play?.(context);
+		await openConfigSelect('panel-editor-v2-unit');
+		await screen.findByRole('listbox');
+	},
+};
+
+/** Axes: soft bounds for the y axis and its scale. */
+export const Axes: Story = {
+	play: async () => {
+		await expandSection('Axes');
+		await screen.findByTestId('panel-editor-v2-log-scale');
+	},
+};
+
+/** The y axis on a log scale, which the preview redraws with. */
+export const AxesLogScale: Story = {
+	play: async (context) => {
+		await Axes.play?.(context);
+		await pickSegment('panel-editor-v2-log-scale', 'Log');
+	},
+};
+
+/** Legend: its position, and a color per series the query returned. */
+export const Legend: Story = {
+	play: async () => {
+		await expandSection('Legend');
+		await screen.findByTestId('panel-editor-v2-legend-position');
+	},
+};
+
+/** The legend moved to the right of the preview. */
+export const LegendRight: Story = {
+	play: async (context) => {
+		await Legend.play?.(context);
+		await pickSegment('panel-editor-v2-legend-position', 'Right');
+	},
+};
+
+/** Chart appearance: line style, interpolation, fill and points. */
+export const ChartAppearance: Story = {
+	play: async () => {
+		await expandSection('Chart appearance');
+		await screen.findByTestId('panel-editor-v2-line-style');
+	},
+};
+
+/** Dashed lines under a gradient fill, with the points drawn. */
+export const ChartAppearanceDashedGradient: Story = {
+	play: async (context) => {
+		await ChartAppearance.play?.(context);
+		await pickSegment('panel-editor-v2-line-style', 'Dashed');
+		await pickSegment('panel-editor-v2-fill-mode', 'Gradient');
+		const points = screen.getByTestId('panel-editor-v2-show-points');
+
+		await userEvent.click(points);
+		await waitFor(() => expect(points).toHaveAttribute('aria-checked', 'true'));
+	},
+};
+
+/** An area chart's appearance, which adds the fill opacity. */
+export const AreaChartAppearance: Story = {
+	args: { panel: 'new', newPanelKind: 'area-chart' },
+	play: async () => {
+		await expandSection('Chart appearance');
+		await screen.findByTestId('panel-editor-v2-fill-opacity');
+	},
+};
+
+/** A bar chart with its series stacked on each other. */
+export const BarStacked: Story = {
+	args: { panel: 'errors-by-status' },
+	play: async () => {
+		await expandSection('Visualization');
+		const stack = await screen.findByTestId(
+			'panel-editor-v2-stacked-bar-chart',
+			{},
+			{ timeout: 10000 },
+		);
+
+		await userEvent.click(stack);
+		await waitFor(() => expect(stack).toHaveAttribute('aria-checked', 'true'));
+	},
+};
+
+/** A table's formatting: a unit per value column. */
+export const TableColumnUnits: Story = {
+	args: { panel: 'top-endpoints' },
+	play: async () => {
+		await expandSection('Formatting & Units');
+		await screen.findByTestId('panel-editor-v2-decimals');
+	},
+};
+
+/** A pie chart's legend, colored per slice. */
+export const PieLegend: Story = {
+	args: { panel: 'traffic-share' },
+	play: async () => {
+		await expandSection('Legend');
+		await screen.findByTestId('panel-editor-v2-legend-position');
+	},
+};
+
+/** A histogram's buckets: how many, how wide, and whether queries merge. */
+export const HistogramBuckets: Story = {
+	args: { panel: 'new', newPanelKind: 'histogram' },
+	play: async () => {
+		await expandSection('Histogram / Buckets');
+		await screen.findByTestId('panel-editor-v2-bucket-count');
+	},
+};
+
+/** A text panel's appearance: alignment and background. */
+export const TextAppearance: Story = {
+	args: { panel: 'new', newPanelKind: 'text' },
+	play: async () => {
+		await expandSection('Panel appearance');
+		await screen.findByTestId('text-layout-horizontal-align');
+	},
+};

frontend/src/pages/DashboardPage/PanelEditorPage/stories/sections/ThresholdsAndLinks.stories.tsx

@@ -0,0 +1,131 @@
+import type { ComponentType } from 'react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Route } from 'react-router-dom';
+import ROUTES from 'constants/routes';
+import { expect, screen, userEvent, waitFor } from 'storybook/test';
+
+import { storyMocks } from '@/storybook/controls/defineStoryMocks';
+import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
+
+import { panelEditorMocks } from '../PanelEditorPage.stories.mocks';
+import { addThreshold, openLinkDialog } from './panelEditorPlay';
+
+import PanelEditorPage from '../../PanelEditorPage';
+
+type PanelEditorArgs = PageStoryArgs<typeof panelEditorMocks>;
+
+const pageStory = storyMocks(panelEditorMocks, { layout: 'app' });
+
+/**
+ * The panel editor's Thresholds and Context Links sections. A threshold row
+ * takes the shape of its panel kind: a labelled line on a chart, a comparison
+ * on a number, a column rule on a table. A context link opens a dialog whose
+ * URL can carry the dashboard's variables.
+ *
+ * Route: `/dashboard/:dashboardId/panel/:panelId`.
+ */
+const meta = {
+	title: 'Pages/Dashboards/Panel Editor/Thresholds and Links',
+	tags: ['authz', 'play'],
+	component: PanelEditorPage as ComponentType<PanelEditorArgs>,
+	render: (): JSX.Element => (
+		<Route path={ROUTES.DASHBOARD_PANEL_EDITOR} component={PanelEditorPage} />
+	),
+	...pageStory,
+	parameters: { ...pageStory.parameters },
+} satisfies Meta<PanelEditorArgs>;
+
+export default meta;
+
+type Story = StoryObj<PanelEditorArgs>;
+
+/** A time series threshold: a value, a color and a label drawn on the chart. */
+export const Threshold: Story = {
+	play: async () => {
+		await addThreshold();
+		await screen.findByTestId('threshold-value-0');
+	},
+};
+
+/** The threshold's color picker, open on the palette presets. */
+export const ThresholdColorOpen: Story = {
+	play: async (context) => {
+		await Threshold.play?.(context);
+		await userEvent.click(screen.getByTestId('threshold-color-0'));
+		await screen.findByText('Defaults');
+	},
+};
+
+/** A number panel's threshold, which compares the value and recolors it. */
+export const NumberThreshold: Story = {
+	args: { panel: 'p99-latency' },
+	play: async () => {
+		await addThreshold('panel-editor-v2-add-comparison-threshold');
+		await screen.findByTestId('comparison-threshold-operator-0');
+	},
+};
+
+/** A table's threshold, which picks the column it colors. */
+export const TableThreshold: Story = {
+	args: { panel: 'top-endpoints' },
+	play: async () => {
+		await addThreshold('panel-editor-v2-add-table-threshold');
+		await screen.findByTestId('table-threshold-column-0');
+	},
+};
+
+/** The add-link dialog, empty, with Save waiting for a URL. */
+export const ContextLinkDialog: Story = {
+	play: async () => {
+		await openLinkDialog();
+	},
+};
+
+/** The URL field focused, offering the variables it can interpolate. */
+export const ContextLinkVariables: Story = {
+	play: async () => {
+		await openLinkDialog();
+		await userEvent.click(screen.getByTestId('context-link-url'));
+		await screen.findByTestId('context-link-variable-service');
+	},
+};
+
+/** A URL with query parameters, split into rows that can be edited one by one. */
+export const ContextLinkParams: Story = {
+	play: async () => {
+		await openLinkDialog();
+		await userEvent.type(
+			screen.getByTestId('context-link-label'),
+			'Open service traces',
+		);
+		await userEvent.click(screen.getByTestId('context-link-url'));
+		await userEvent.paste(
+			'/traces-explorer?service={{service}}&env={{environment}}',
+		);
+		// Leaving the URL closes the variables list that covers the rows.
+		await userEvent.click(screen.getByTestId('context-link-label'));
+		await screen.findByTestId('context-link-param-key-1');
+	},
+};
+
+/** A URL the link cannot open, which the field flags and Save refuses. */
+export const ContextLinkInvalidUrl: Story = {
+	play: async () => {
+		await openLinkDialog();
+		await userEvent.click(screen.getByTestId('context-link-url'));
+		await userEvent.paste('traces for {{service}}');
+		await screen.findByTestId('context-link-url-error');
+	},
+};
+
+/** A saved link, listed in the section with its edit and remove actions. */
+export const ContextLinkSaved: Story = {
+	play: async (context) => {
+		await ContextLinkParams.play?.(context);
+		await userEvent.click(screen.getByTestId('context-link-save'));
+		await waitFor(() =>
+			expect(screen.queryByTestId('context-link-dialog')).toBeNull(),
+		);
+		await screen.findByTestId('context-link-item-0');
+	},
+};

frontend/src/pages/DashboardPage/PanelEditorPage/stories/sections/panelEditorPlay.ts

@@ -0,0 +1,62 @@
+import { screen, userEvent, within } from 'storybook/test';
+
+// The editor resolves its panel from the dashboard document before it renders.
+const PAGE_LOAD = { timeout: 10000 };
+
+/**
+ * Opens a display-options section and scrolls it to the top of the pane, where
+ * a screenshot of the viewport can see it. Returns the section to query in.
+ */
+export const expandSection = async (title: string): Promise<HTMLElement> => {
+	// The toggle's test id is the title, lowercased, with whitespace as dashes.
+	const toggle = await screen.findByTestId(
+		`config-section-${title.toLowerCase().replace(/\s+/g, '-')}`,
+		{},
+		PAGE_LOAD,
+	);
+
+	if (toggle.getAttribute('aria-expanded') !== 'true') {
+		await userEvent.click(toggle);
+	}
+	toggle.scrollIntoView({ block: 'start' });
+
+	return toggle.closest('section') ?? document.body;
+};
+
+/** Picks one option of a segmented control by the label it shows. */
+export const pickSegment = async (
+	testId: string,
+	label: string,
+): Promise<void> => {
+	await userEvent.click(within(screen.getByTestId(testId)).getByText(label));
+};
+
+/**
+ * The pane's pickers are antd Selects: the element carrying the test id does
+ * nothing on click, the combobox inside it is what opens the list.
+ */
+export const openConfigSelect = async (testId: string): Promise<void> => {
+	const select = await screen.findByTestId(testId, {}, PAGE_LOAD);
+
+	await userEvent.click(within(select).getByRole('combobox'));
+};
+
+/**
+ * Opens Thresholds and adds one row through the section's own button, whose
+ * test id depends on the panel kind.
+ */
+export const addThreshold = async (
+	testId = 'panel-editor-v2-add-threshold',
+): Promise<void> => {
+	const section = await expandSection('Thresholds');
+
+	await userEvent.click(within(section).getByTestId(testId));
+};
+
+export const openLinkDialog = async (): Promise<void> => {
+	const section = await expandSection('Context Links');
+
+	// The header's quick add carries the same name, so the body button goes by id.
+	await userEvent.click(within(section).getByTestId('panel-editor-v2-add-link'));
+	await screen.findByTestId('context-link-dialog');
+};

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

@@ -7,6 +7,7 @@ import { rest } from 'msw';
 import { generatePath } from 'react-router-dom';
 import ROUTES from 'constants/routes';
 import type { GetPublicDashboard200 } from 'api/generated/services/sigNoz.schemas';
+import { useDashboardPreferencesStore } from 'hooks/dashboard/useDashboardPreference';
 import type { QueryRangeRequestV5 } from 'types/api/v5/queryRange';
 
 import {
@@ -15,11 +16,15 @@ 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 { queryRangeV5ScalarResponse } from '@/storybook/msw/__story_mockdata__/queryRange';
 
 import {
 	currentDashboardDocument,
+	cyclicVariablesDashboardResponse,
 	patchDashboardDocument,
 	PANEL_IDS,
 	seedDashboardDocument,
@@ -29,8 +34,9 @@ import {
 	type VariableKind,
 } from './__story_mockdata__/dashboard';
 import {
+	attributeValues,
 	emptyPanelResponse,
-	NAMESPACE_VALUES,
+	VARIABLE_ATTRIBUTES,
 	panelResponse,
 	serviceVariableValues,
 } from './__story_mockdata__/panelData';
@@ -65,6 +71,14 @@ const NOT_FOUND = {
 
 const ok = { status: 'success', data: null };
 
+// The editor rewrites any `Syntax error:` into its own hint, so the ClickHouse
+// wording only shows through the variable bar.
+const VARIABLE_QUERY_ERROR = {
+	status: 'error',
+	error:
+		"Code: 62. DB::Exception: Syntax error: failed at position 58 ('$environment'). (SYNTAX_ERROR)",
+};
+
 const publicMeta = (): GetPublicDashboard200 => ({
 	status: 'success',
 	data: {
@@ -137,6 +151,12 @@ export const dashboardMocks = defineStoryMocks({
 			value: 4,
 			max: 12,
 		}),
+		variableQueryFails: toggleControl('Variable query fails', {
+			group: DATA,
+			description:
+				"The query-backed `service` variable answers with a ClickHouse syntax error, which the variable bar and the editor's Test Run both report.",
+			value: false,
+		}),
 		noData: toggleControl('Panels return nothing', {
 			group: DATA,
 			description:
@@ -225,17 +245,31 @@ export const dashboardMocks = defineStoryMocks({
 				}),
 			),
 
-			rest.post(
-				'http://localhost/api/v2/variables/query',
-				response.json(() => ({
-					status: 'success',
-					data: { variableValues: serviceVariableValues(values.variableValues) },
-				})),
-			),
+			values.variableQueryFails
+				? rest.post('http://localhost/api/v2/variables/query', (_req, res, ctx) =>
+						res(ctx.status(400), ctx.json(VARIABLE_QUERY_ERROR)),
+					)
+				: rest.post(
+						'http://localhost/api/v2/variables/query',
+						response.json(() => ({
+							status: 'success',
+							data: {
+								variableValues: serviceVariableValues(values.variableValues),
+							},
+						})),
+					),
 
 			rest.get(
 				'http://localhost/api/v1/fields/values',
-				response.json(() => fieldValuesResponse(NAMESPACE_VALUES)),
+				response.json((req) =>
+					fieldValuesResponse(attributeValues(req.url.searchParams.get('name'))),
+				),
+			),
+
+			// The dynamic variable editor lists the attributes a variable can read.
+			rest.get(
+				'http://localhost/api/v1/fields/keys',
+				response.json(() => fieldKeysResponse(VARIABLE_ATTRIBUTES)),
 			),
 
 			// The header reads the public link on every load, so it answers even while
@@ -269,6 +303,9 @@ export const dashboardMocks = defineStoryMocks({
 			variables: values.variables,
 			locked: values.locked,
 		});
+		// The sync mode persists per dashboard, so one story's pick would open the
+		// next one on it.
+		useDashboardPreferencesStore.setState({ preferences: {} });
 	},
 });
 
@@ -327,3 +364,9 @@ export const metricsListHandler = rest.get(
 	(_req, res, ctx) =>
 		res(ctx.status(200), ctx.json({ status: 'success', data: { metrics: [] } })),
 );
+
+export const cyclicVariablesDashboardHandler = rest.get(
+	'http://localhost/api/v2/dashboards/:id',
+	(_req, res, ctx) =>
+		res(ctx.status(200), ctx.json(cyclicVariablesDashboardResponse())),
+);

frontend/src/pages/DashboardPage/stories/DashboardPage.stories.tsx

@@ -2,7 +2,7 @@ import type { ComponentType } from 'react';
 import type { Meta, StoryObj } from '@storybook/react-vite';
 import { Route } from 'react-router-dom';
 import ROUTES from 'constants/routes';
-import { screen, userEvent, 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';
@@ -30,8 +30,8 @@ const pageStory = storyMocks(dashboardMocks, { layout: 'app' });
  * Route: `/dashboard/:dashboardId`.
  */
 const meta = {
-	title: 'Pages/Dashboards/Detail',
-	tags: ['role-gated', 'play'],
+	title: 'Pages/Dashboards/Detail/Overview',
+	tags: ['authz', 'play'],
 	// The page is wrapped in `withAuthZPage`, which types its props as an index
 	// signature; the story's args are what the controls resolve to.
 	component: DashboardPage as ComponentType<DashboardArgs>,
@@ -159,53 +159,6 @@ export const TooltipsInJsonDrawer: Story = {
 	},
 };
 
-/**
- * The Overview tab of dashboard settings, where Cross-Panel Sync explains what
- * syncing the crosshair does and links out to the docs.
- */
-export const TooltipsInSettings: Story = {
-	args: { tooltipsOpen: true },
-	play: async ({ canvasElement }) => {
-		const canvas = within(canvasElement);
-
-		await userEvent.click(
-			await canvas.findByTestId('show-drawer', {}, { timeout: 10000 }),
-		);
-		await screen.findByText('Sync Mode');
-	},
-};
-
-/**
- * The Variables tab of dashboard settings, where a dynamic variable's Apply to
- * all says whether it is already a filter on every panel. The row keeps its
- * actions invisible until it is hovered, which the story does first.
- */
-export const TooltipsInVariableSettings: Story = {
-	args: { tooltipsOpen: true },
-	play: async ({ canvasElement }) => {
-		const canvas = within(canvasElement);
-
-		await userEvent.click(
-			await canvas.findByTestId('show-drawer', {}, { timeout: 10000 }),
-		);
-		await userEvent.click(await screen.findByRole('tab', { name: 'Variables' }));
-
-		// The tooltip trigger's Slot merge drops the button's own test id.
-		await userEvent.hover(
-			await screen.findByRole(
-				'button',
-				{ name: 'Apply to all' },
-				{ timeout: 10000 },
-			),
-		);
-		await screen.findByText(
-			'Add this variable as a filter to every panel',
-			undefined,
-			{ timeout: 10000 },
-		);
-	},
-};
-
 /**
  * A panel expanded into view mode, whose header carries the full panel name its
  * title truncates, over the dashboard's own tooltips behind the dialog.
@@ -285,6 +238,18 @@ export const SectionActionsMenu: Story = {
 	},
 };
 
+/** The panel menu's move-to-section submenu, open on the sections it can go to. */
+export const PanelMoveToSectionSubmenu: Story = {
+	play: async (context) => {
+		await PanelActionsMenu.play?.(context);
+		await userEvent.hover(await screen.findByText('Move to section'));
+		// The submenu lists the sections the panel is not already in.
+		await waitFor(() => expect(screen.getAllByRole('menu')).toHaveLength(2), {
+			timeout: 10000,
+		});
+	},
+};
+
 /**
  * A dashboard id nobody has, which is what a deleted or mistyped link opens on.
  *

frontend/src/pages/DashboardPage/stories/__story_mockdata__/dashboard.ts

@@ -336,6 +336,28 @@ const VARIABLES: Record<VariableKind, DashboardtypesVariableDTO> = {
 	},
 };
 
+/**
+ * `service` already filters on `$environment`, so an `environment` that reads
+ * `$service` back closes the loop. An imported dashboard can arrive like this;
+ * the editor only refuses it on save.
+ */
+const CYCLIC_ENVIRONMENT: DashboardtypesVariableDTO = {
+	kind: ListVariableKind.ListVariable,
+	spec: {
+		name: 'environment',
+		display: { name: 'environment' },
+		allowMultiple: false,
+		allowAllValue: false,
+		plugin: {
+			kind: QueryVariableKind['signoz/QueryVariable'],
+			spec: {
+				queryValue:
+					'SELECT DISTINCT env FROM signoz_metrics WHERE service_name IN $service',
+			},
+		},
+	},
+};
+
 export interface PanelQueryShape {
 	requestType: string;
 	metricName?: string;
@@ -451,3 +473,18 @@ export const patchDashboardDocument = (
 
 	return envelope(document);
 };
+
+export const cyclicVariablesDashboardResponse = (): GetDashboardV2200 => {
+	const response = dashboardResponse({
+		panels: PANEL_IDS.length,
+		sectioned: true,
+		variables: VARIABLE_KINDS,
+		locked: false,
+	});
+
+	response.data.spec.variables = response.data.spec.variables.map((variable) =>
+		variable === VARIABLES.custom ? CYCLIC_ENVIRONMENT : variable,
+	);
+
+	return response;
+};

frontend/src/pages/DashboardPage/stories/__story_mockdata__/panelData.ts

@@ -173,3 +173,20 @@ export const NAMESPACE_VALUES = [
 	'payments-prod',
 	'platform-prod',
 ] as const;
+
+/**
+ * The attributes the dynamic variable editor offers a variable to read, with
+ * the values each one resolves to.
+ */
+const ATTRIBUTE_VALUES: Record<string, readonly string[]> = {
+	'k8s.namespace.name': NAMESPACE_VALUES,
+	'k8s.cluster.name': ['prod-us-east-1', 'prod-eu-west-1'],
+	'service.name': SERVICES,
+	'deployment.environment': ['production', 'staging', 'development'],
+	'host.name': ['ip-10-0-1-12', 'ip-10-0-1-37', 'ip-10-0-2-4'],
+};
+
+export const VARIABLE_ATTRIBUTES = Object.keys(ATTRIBUTE_VALUES);
+
+export const attributeValues = (name: string | null): readonly string[] =>
+	ATTRIBUTE_VALUES[name ?? ''] ?? NAMESPACE_VALUES;

frontend/src/pages/DashboardPage/stories/authz/DashboardPage.authz.stories.tsx

@@ -0,0 +1,206 @@
+import type { ComponentType } from 'react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Route } from 'react-router-dom';
+import ROUTES from 'constants/routes';
+import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
+
+import { storyMocks } from '@/storybook/controls/defineStoryMocks';
+import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
+
+import { dashboardMocks } from '../DashboardPage.stories.mocks';
+import {
+	expectDisabled,
+	menuItem,
+	openActionsMenu,
+	toolbarButton,
+} from './authzPlay';
+
+import DashboardPage from '../../DashboardPage';
+
+type DashboardArgs = PageStoryArgs<typeof dashboardMocks>;
+
+const pageStory = storyMocks(dashboardMocks, { layout: 'app' });
+
+/**
+ * The dashboard with one permission missing at a time. Every story here is an
+ * admin denied exactly what its name says. `read` decides whether the page
+ * renders at all; `update` is every edit, the settings drawer included, so
+ * Configure is as far as a user without it gets.
+ *
+ * Route: `/dashboard/:dashboardId`.
+ */
+const meta = {
+	title: 'Pages/Dashboards/Detail/Authz',
+	tags: ['authz', 'play'],
+	component: DashboardPage as ComponentType<DashboardArgs>,
+	render: (): JSX.Element => (
+		<Route path={ROUTES.DASHBOARD} component={DashboardPage} />
+	),
+	...pageStory,
+	parameters: { ...pageStory.parameters },
+} satisfies Meta<DashboardArgs>;
+
+export default meta;
+
+type Story = StoryObj<DashboardArgs>;
+
+const READ = 'read:dashboard';
+const UPDATE = 'update:dashboard';
+const DELETE = 'delete:dashboard';
+const CREATE = 'create:dashboard';
+
+/** The page refuses to render: `read` is the one check it mounts on. */
+export const NoRead: Story = {
+	args: { revoked: [READ] },
+	play: async () => {
+		await screen.findByText('Uh-oh! You are not authorized', undefined, {
+			timeout: 10000,
+		});
+	},
+};
+
+/**
+ * The panels still render, and Configure and New Panel stay in the toolbar,
+ * disabled.
+ */
+export const NoUpdate: Story = {
+	args: { revoked: [UPDATE] },
+	play: async ({ canvasElement }) => {
+		await expectDisabled(await toolbarButton(canvasElement, 'Configure'));
+		await expectDisabled(await toolbarButton(canvasElement, 'New Panel'));
+	},
+};
+
+/** The same toolbar with its tooltips open, each naming what is missing. */
+export const TooltipsWithoutUpdate: Story = {
+	args: { revoked: [UPDATE], tooltipsOpen: true },
+	play: NoUpdate.play,
+};
+
+/**
+ * A locked dashboard the user could not have edited anyway: the tooltips name
+ * the permission rather than the lock.
+ */
+export const TooltipsWithoutUpdateWhenLocked: Story = {
+	args: { revoked: [UPDATE], locked: true, tooltipsOpen: true },
+	play: NoUpdate.play,
+};
+
+/** The Actions menu: rename, lock and new section locked; clone and delete open. */
+export const NoUpdateActionsMenu: Story = {
+	args: { revoked: [UPDATE] },
+	play: async ({ canvasElement }) => {
+		await openActionsMenu(canvasElement);
+		await expectDisabled(menuItem('Rename'));
+		await expectDisabled(menuItem('Lock dashboard'));
+		await expectDisabled(menuItem('New section'));
+		await expectDisabled(menuItem('Clone dashboard'), false);
+		await expectDisabled(menuItem('Delete dashboard'), false);
+	},
+};
+
+/** A panel's menu: view and download stay, every edit is locked. */
+export const NoUpdatePanelMenu: Story = {
+	args: { revoked: [UPDATE] },
+	play: async ({ canvasElement }) => {
+		await userEvent.click(
+			await within(canvasElement).findByTestId(
+				'panel-actions-p99-latency',
+				{},
+				{ timeout: 10000 },
+			),
+		);
+		const menu = await screen.findByRole('menu');
+
+		await expectDisabled(
+			within(menu).getByRole('menuitem', { name: /Edit panel/ }),
+		);
+		await expectDisabled(
+			within(menu).getByRole('menuitem', { name: /Delete panel/ }),
+		);
+	},
+};
+
+/** The JSON editor opens read-only, and Apply says why it is locked. */
+export const NoUpdateJsonEditor: Story = {
+	args: { revoked: [UPDATE], tooltipsOpen: true },
+	play: async ({ canvasElement }) => {
+		await userEvent.click(
+			await within(canvasElement).findByTestId(
+				'edit-json',
+				{},
+				{ timeout: 10000 },
+			),
+		);
+		await expectDisabled(await screen.findByTestId('json-editor-apply'));
+	},
+};
+
+/** A blank dashboard whose add-panel prompts are locked. */
+export const NoUpdateEmpty: Story = {
+	args: { revoked: [UPDATE], panels: 0, sectioned: false },
+	play: async () => {
+		await expectDisabled(
+			await screen.findByTestId('add-panel', {}, { timeout: 10000 }),
+		);
+	},
+};
+
+/** Delete dashboard locked in the Actions menu; every edit still works. */
+export const NoDelete: Story = {
+	args: { revoked: [DELETE] },
+	play: async ({ canvasElement }) => {
+		await openActionsMenu(canvasElement);
+		await expectDisabled(menuItem('Delete dashboard'));
+		await expectDisabled(menuItem('Rename'), false);
+	},
+};
+
+/** Cloning is a create, so the copy is locked while the original stays editable. */
+export const NoCreate: Story = {
+	args: { revoked: [CREATE] },
+	play: async ({ canvasElement }) => {
+		await openActionsMenu(canvasElement);
+		await expectDisabled(menuItem('Clone dashboard'));
+		await expectDisabled(menuItem('Rename'), false);
+	},
+};
+
+/** Everything but reading: the Actions menu with only full screen left. */
+export const ReadOnly: Story = {
+	args: { revoked: [UPDATE, DELETE, CREATE] },
+	play: async ({ canvasElement }) => {
+		await openActionsMenu(canvasElement);
+		await expectDisabled(menuItem('Clone dashboard'));
+		await expectDisabled(menuItem('Delete dashboard'));
+		await expectDisabled(menuItem('Full screen'), false);
+	},
+};
+
+/**
+ * The page holds on its spinner until the permission check answers. The
+ * spinner's `Loading dashboard...` tip never shows: antd only renders a tip
+ * around nested content.
+ */
+export const CheckLoading: Story = {
+	args: { authzState: 'loading' },
+	play: async ({ canvasElement }) => {
+		await waitFor(() =>
+			expect(canvasElement.querySelector('.ant-spin')).not.toBeNull(),
+		);
+	},
+};
+
+/**
+ * The permission check failing rather than denying: the page renders, and
+ * every edit stays locked as if `update` were denied.
+ */
+export const CheckFailed: Story = {
+	args: { authzState: 'error' },
+	// The mocked check intentionally fails; the resulting console error is the
+	// point of the story, not a regression.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }) => {
+		await expectDisabled(await toolbarButton(canvasElement, 'Configure'));
+	},
+};

frontend/src/pages/DashboardPage/stories/authz/authzPlay.ts

@@ -0,0 +1,38 @@
+import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
+
+// The permission check resolves after the dashboard document loads.
+const PAGE_LOAD = { timeout: 10000 };
+
+/**
+ * A denied control stays on screen, disabled. Buttons say so through
+ * `disabled` or `aria-disabled` depending on the Button, menu rows through
+ * `data-disabled`.
+ */
+const isDisabled = (element: HTMLElement): boolean =>
+	element.hasAttribute('disabled') ||
+	element.getAttribute('aria-disabled') === 'true' ||
+	element.hasAttribute('data-disabled');
+
+export const expectDisabled = (
+	element: HTMLElement,
+	disabled = true,
+): Promise<void> =>
+	waitFor(() => expect(isDisabled(element)).toBe(disabled), PAGE_LOAD);
+
+export const toolbarButton = (
+	canvasElement: HTMLElement,
+	name: string,
+): Promise<HTMLElement> =>
+	within(canvasElement).findByRole('button', { name }, PAGE_LOAD);
+
+export const openActionsMenu = async (
+	canvasElement: HTMLElement,
+): Promise<void> => {
+	// The dropdown trigger's Slot merge drops the button's own test id.
+	await userEvent.click(await toolbarButton(canvasElement, 'Actions'));
+	await screen.findByText('Clone dashboard');
+};
+
+// Not by test id: the Actions menu only carries them on some Dropdown versions.
+export const menuItem = (name: string): HTMLElement =>
+	screen.getByRole('menuitem', { name });

frontend/src/pages/DashboardPage/stories/settings/EditVariable.stories.tsx

@@ -0,0 +1,131 @@
+import type { ComponentType } from 'react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Route } from 'react-router-dom';
+import ROUTES from 'constants/routes';
+import { expect, screen, userEvent, waitFor } from 'storybook/test';
+
+import { storyMocks } from '@/storybook/controls/defineStoryMocks';
+import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
+
+import {
+	cyclicVariablesDashboardHandler,
+	dashboardMocks,
+} from '../DashboardPage.stories.mocks';
+import {
+	findPreviewValue,
+	openVariableEditor,
+	openVariableSelect,
+} from './settingsPlay';
+
+import DashboardPage from '../../DashboardPage';
+
+type DashboardArgs = PageStoryArgs<typeof dashboardMocks>;
+
+const pageStory = storyMocks(dashboardMocks, { layout: 'app' });
+
+/**
+ * The variable editor on each of the dashboard's variables, reached from a
+ * row's edit action in the Variables tab: what every type saved, the values it
+ * resolves to, and the query failures and dependency loops it reports.
+ *
+ * Route: `/dashboard/:dashboardId`.
+ */
+const meta = {
+	title: 'Pages/Dashboards/Detail/Edit Variable',
+	tags: ['authz', 'play'],
+	component: DashboardPage as ComponentType<DashboardArgs>,
+	render: (): JSX.Element => (
+		<Route path={ROUTES.DASHBOARD} component={DashboardPage} />
+	),
+	...pageStory,
+	parameters: { ...pageStory.parameters },
+} satisfies Meta<DashboardArgs>;
+
+export default meta;
+
+type Story = StoryObj<DashboardArgs>;
+
+/**
+ * `$environment`: a comma-separated list with one value by default. The preview
+ * stays empty until the options are edited.
+ */
+export const Custom: Story = {
+	play: async ({ canvasElement }) => {
+		await openVariableEditor(canvasElement, 'environment');
+		await screen.findByDisplayValue('production,staging,development');
+	},
+};
+
+/**
+ * `$service`: a ClickHouse query that reads `$environment`, run once on open so
+ * the preview and default value have its values.
+ */
+export const Query: Story = {
+	play: async ({ canvasElement }) => {
+		await openVariableEditor(canvasElement, 'service');
+		await findPreviewValue('inventory');
+	},
+};
+
+/** `$service` with its query failing, which the preview reports in its place. */
+export const QueryFailed: Story = {
+	args: { variableQueryFails: true },
+	// The failed variable query is the state under test.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }) => {
+		await openVariableEditor(canvasElement, 'service');
+		await screen.findByText(
+			'Please make sure query is valid and dependent variables are selected',
+			undefined,
+			{ timeout: 10000 },
+		);
+	},
+};
+
+/** The sort picker, open over the previewed values it reorders. */
+export const SortOpen: Story = {
+	play: async (context) => {
+		await Query.play?.(context);
+		await openVariableSelect('variable-sort-select');
+		await screen.findByTitle('Alphabetical (descending)');
+	},
+};
+
+/**
+ * `$namespace`: a dynamic variable reading `k8s.namespace.name` from metrics,
+ * with the panels it could be applied to.
+ */
+export const Dynamic: Story = {
+	play: async ({ canvasElement }) => {
+		await openVariableEditor(canvasElement, 'namespace');
+		await findPreviewValue('payments-prod');
+	},
+};
+
+/** `$owner`: a Textbox variable with its default value. */
+export const Textbox: Story = {
+	play: async ({ canvasElement }) => {
+		await openVariableEditor(canvasElement, 'owner');
+		await waitFor(() =>
+			expect(screen.getByTestId('variable-text-input')).toHaveValue(
+				'platform-team',
+			),
+		);
+	},
+};
+
+/**
+ * `$environment` and `$service` reading each other, as an imported dashboard
+ * can arrive: saving either one is refused and names the loop.
+ *
+ * The document is answered by the story, so the Panels, Sections, Variables and
+ * Locked controls do not reach it.
+ */
+export const CircularDependency: Story = {
+	parameters: { msw: { handlers: [cyclicVariablesDashboardHandler] } },
+	play: async ({ canvasElement }) => {
+		await openVariableEditor(canvasElement, 'service');
+		await userEvent.click(screen.getByTestId('variable-save'));
+		await screen.findByText(/circular dependency detected/);
+	},
+};

frontend/src/pages/DashboardPage/stories/settings/NewVariable.stories.tsx

@@ -0,0 +1,184 @@
+import type { ComponentType } from 'react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Route } from 'react-router-dom';
+import ROUTES from 'constants/routes';
+import { screen, userEvent } from 'storybook/test';
+
+import { storyMocks } from '@/storybook/controls/defineStoryMocks';
+import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
+
+import { dashboardMocks } from '../DashboardPage.stories.mocks';
+import {
+	findPreviewValue,
+	openNewVariable,
+	openVariableSelect,
+	pickVariableType,
+	typeVariableName,
+} from './settingsPlay';
+
+import DashboardPage from '../../DashboardPage';
+
+type DashboardArgs = PageStoryArgs<typeof dashboardMocks>;
+
+const pageStory = storyMocks(dashboardMocks, { layout: 'app' });
+
+/**
+ * The variable editor on a new variable, reached from Add variable in the
+ * Variables tab: each type's own fields, the pickers they open, and the name
+ * and attribute checks that keep Save disabled.
+ *
+ * Route: `/dashboard/:dashboardId`.
+ */
+const meta = {
+	title: 'Pages/Dashboards/Detail/New Variable',
+	tags: ['authz', 'play'],
+	component: DashboardPage as ComponentType<DashboardArgs>,
+	render: (): JSX.Element => (
+		<Route path={ROUTES.DASHBOARD} component={DashboardPage} />
+	),
+	...pageStory,
+	parameters: { ...pageStory.parameters },
+} satisfies Meta<DashboardArgs>;
+
+export default meta;
+
+type Story = StoryObj<DashboardArgs>;
+
+/** The editor as it opens, on the Dynamic type with no field picked. */
+export const Default: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+	},
+};
+
+/** The dynamic variable's field picker, open on the attributes it can read. */
+export const FieldPickerOpen: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await openVariableSelect('variable-field-select');
+		await screen.findByRole(
+			'option',
+			{ name: 'k8s.cluster.name' },
+			{ timeout: 10000 },
+		);
+	},
+};
+
+/** The telemetry source the field is read from, open. */
+export const SignalPickerOpen: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await openVariableSelect('variable-signal-select');
+		await screen.findByTitle('Traces');
+	},
+};
+
+/**
+ * A field picked: the name follows it until typed over, and the values it
+ * resolves to fill the preview and the default value.
+ */
+export const DynamicFieldPicked: Story = {
+	play: async (context) => {
+		await FieldPickerOpen.play?.(context);
+		await userEvent.click(
+			screen.getByRole('option', { name: 'k8s.cluster.name' }),
+		);
+		await findPreviewValue('prod-us-east-1');
+	},
+};
+
+/** A field another dynamic variable already reads, which Save refuses. */
+export const AttributeTaken: Story = {
+	play: async (context) => {
+		await FieldPickerOpen.play?.(context);
+		await userEvent.click(
+			screen.getByRole('option', { name: 'k8s.namespace.name' }),
+		);
+		await screen.findByText('A variable with this attribute key already exists');
+	},
+};
+
+/** The panels the new filter can be added to, open. */
+export const ApplyToPanelsOpen: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await openVariableSelect('variable-apply-panels');
+		await screen.findByRole('listbox');
+	},
+};
+
+/** A name typed and cleared again. */
+export const NameRequired: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await userEvent.type(screen.getByTestId('variable-name'), 'x{Backspace}');
+		await screen.findByText('Variable name is required');
+	},
+};
+
+/** A name another variable on the dashboard has. */
+export const NameTaken: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await typeVariableName('environment');
+		await screen.findByText('Variable name already exists');
+	},
+};
+
+/** A name with a space in it, which a `$name` reference could not spell. */
+export const NameWithSpaces: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await typeVariableName('build id');
+		await screen.findByText('Variable name cannot contain whitespaces');
+	},
+};
+
+/** A Textbox variable: a free-text value with an optional default. */
+export const Textbox: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await typeVariableName('region');
+		await pickVariableType('textbox');
+		await userEvent.type(
+			await screen.findByTestId('variable-text-input'),
+			'us-east-1',
+		);
+	},
+};
+
+/**
+ * A Custom variable with its options typed in, previewed as they are parsed,
+ * and multiple values on, which adds the ALL option toggle.
+ */
+export const Custom: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await typeVariableName('region');
+		await pickVariableType('custom');
+		await userEvent.type(
+			await screen.findByTestId('variable-custom-input'),
+			'us-east-1,eu-west-1,ap-south-1',
+		);
+		await userEvent.click(screen.getByTestId('variable-multi-switch'));
+		await screen.findByText('Include an option for ALL values');
+	},
+};
+
+/** The Custom variable's default value picker, open on the parsed options. */
+export const CustomDefaultOpen: Story = {
+	play: async (context) => {
+		await Custom.play?.(context);
+		await openVariableSelect('variable-default-select');
+		await screen.findByRole('option', { name: 'eu-west-1' });
+	},
+};
+
+/** A Query variable before its query is written: Test Run waits for one. */
+export const Query: Story = {
+	play: async ({ canvasElement }) => {
+		await openNewVariable(canvasElement);
+		await pickVariableType('query');
+		await screen.findByText('Test Run Query');
+	},
+};

frontend/src/pages/DashboardPage/stories/settings/Settings.stories.tsx

@@ -0,0 +1,121 @@
+import type { ComponentType } from 'react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Route } from 'react-router-dom';
+import ROUTES from 'constants/routes';
+import { screen, userEvent, within } from 'storybook/test';
+
+import { storyMocks } from '@/storybook/controls/defineStoryMocks';
+import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
+
+import { dashboardMocks } from '../DashboardPage.stories.mocks';
+import { openSettings } from './settingsPlay';
+
+import DashboardPage from '../../DashboardPage';
+
+type DashboardArgs = PageStoryArgs<typeof dashboardMocks>;
+
+const pageStory = storyMocks(dashboardMocks, { layout: 'app' });
+
+/**
+ * The dashboard's settings drawer on its Overview and Publish tabs: the name,
+ * icon, description and tags, the cross-panel sync mode, and the public link.
+ * The Publish tab only exists on cloud and enterprise licenses.
+ *
+ * Route: `/dashboard/:dashboardId`.
+ */
+const meta = {
+	title: 'Pages/Dashboards/Detail/Settings',
+	tags: ['authz', 'play'],
+	component: DashboardPage as ComponentType<DashboardArgs>,
+	render: (): JSX.Element => (
+		<Route path={ROUTES.DASHBOARD} component={DashboardPage} />
+	),
+	...pageStory,
+	parameters: { ...pageStory.parameters },
+} satisfies Meta<DashboardArgs>;
+
+export default meta;
+
+type Story = StoryObj<DashboardArgs>;
+
+/** The drawer as Configure opens it, on the Overview tab. */
+export const Overview: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement);
+		await screen.findByText('Sync Mode');
+	},
+};
+
+/** Two fields edited, so the footer counts them and offers to save or discard. */
+export const OverviewUnsavedChanges: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement);
+		await userEvent.type(await screen.findByTestId('dashboard-name'), ' (v2)');
+		await userEvent.type(
+			screen.getByTestId('dashboard-desc'),
+			' Owned by the platform team.',
+		);
+		await screen.findByText('2 unsaved changes');
+	},
+};
+
+/** The icon picker beside the name, open on the system icons. */
+export const OverviewIconPicker: Story = {
+	play: async ({ canvasElement }) => {
+		const panel = await openSettings(canvasElement);
+
+		await userEvent.click(within(panel).getAllByRole('combobox')[0]);
+		await screen.findByRole('listbox');
+	},
+};
+
+/**
+ * Sync set to Tooltip, which adds the choice between every series and only the
+ * ones that share the group-by.
+ */
+export const OverviewTooltipSync: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement);
+		await userEvent.click(await screen.findByRole('radio', { name: 'Tooltip' }));
+		await screen.findByText('Synced Tooltip Series');
+	},
+};
+
+/**
+ * The Overview tab's own tooltip: Cross-Panel Sync explains what syncing does
+ * and links out to the docs.
+ */
+export const TooltipsInOverview: Story = {
+	args: { tooltipsOpen: true },
+	play: Overview.play,
+};
+
+/** The Publish tab of a dashboard with a public link. */
+export const Publish: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Publish');
+		await screen.findByText('Default time range');
+	},
+};
+
+/** The Publish tab with its default time range select open. */
+export const PublishTimeRangeOpen: Story = {
+	play: async (context) => {
+		await Publish.play?.(context);
+		await userEvent.click(
+			within(screen.getByRole('tabpanel')).getByRole('combobox'),
+		);
+		await screen.findByRole('listbox');
+	},
+};
+
+/** The Publish tab of a dashboard nobody published: no link, one Publish button. */
+export const PublishPrivate: Story = {
+	args: { published: false },
+	// The 404 an unpublished dashboard answers with is the state under test.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Publish');
+		await screen.findByText('This dashboard is private');
+	},
+};

frontend/src/pages/DashboardPage/stories/settings/Variables.stories.tsx

@@ -0,0 +1,132 @@
+import type { ComponentType } from 'react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { Route } from 'react-router-dom';
+import ROUTES from 'constants/routes';
+import { screen, userEvent } from 'storybook/test';
+
+import { storyMocks } from '@/storybook/controls/defineStoryMocks';
+import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
+
+import { dashboardMocks } from '../DashboardPage.stories.mocks';
+import {
+	clickRowAction,
+	openSettings,
+	openVariableEditor,
+	typeVariableName,
+	variableRow,
+} from './settingsPlay';
+
+import DashboardPage from '../../DashboardPage';
+
+type DashboardArgs = PageStoryArgs<typeof dashboardMocks>;
+
+const pageStory = storyMocks(dashboardMocks, { layout: 'app' });
+
+/**
+ * The Variables tab of dashboard settings: the variables in the order the bar
+ * shows them, and what deleting, renaming or applying one does to the panels
+ * that read it. Every panel filters on `$environment`, and `$service` reads it
+ * too; nothing reads `$namespace` or `$owner`.
+ *
+ * Route: `/dashboard/:dashboardId`.
+ */
+const meta = {
+	title: 'Pages/Dashboards/Detail/Variables',
+	tags: ['authz', 'play'],
+	component: DashboardPage as ComponentType<DashboardArgs>,
+	render: (): JSX.Element => (
+		<Route path={ROUTES.DASHBOARD} component={DashboardPage} />
+	),
+	...pageStory,
+	parameters: { ...pageStory.parameters },
+} satisfies Meta<DashboardArgs>;
+
+export default meta;
+
+type Story = StoryObj<DashboardArgs>;
+
+/** One variable of each type, listed by name and description. */
+export const Default: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Variables');
+		await variableRow('owner');
+	},
+};
+
+/** A dashboard without variables, where the tab is its add-variable prompt. */
+export const Empty: Story = {
+	args: { variables: [] },
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Variables');
+		await screen.findByText('No variables yet');
+	},
+};
+
+/**
+ * A dynamic variable's Apply to all says whether it is already a filter on
+ * every panel. The row keeps its actions invisible until it is hovered, which
+ * the story does first.
+ */
+export const TooltipsInVariables: Story = {
+	args: { tooltipsOpen: true },
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Variables');
+
+		// The tooltip trigger's Slot merge drops the button's own test id.
+		await userEvent.hover(
+			await screen.findByRole(
+				'button',
+				{ name: 'Apply to all' },
+				{ timeout: 10000 },
+			),
+		);
+		await screen.findByText(
+			'Add this variable as a filter to every panel',
+			undefined,
+			{ timeout: 10000 },
+		);
+	},
+};
+
+/** Deleting a variable nothing reads, which the row confirms inline. */
+export const DeleteConfirm: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Variables');
+		await clickRowAction('owner', 'delete');
+		await screen.findByText('Delete?');
+	},
+};
+
+/**
+ * Deleting `$environment`, which the panels and `$service` read, so each usage
+ * is listed for review before anything is removed.
+ */
+export const DeleteReferenced: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Variables');
+		await clickRowAction('environment', 'delete');
+		await screen.findByText('Delete $environment');
+	},
+};
+
+/** Apply to all on `$namespace`: the filter it would add to every panel query. */
+export const ApplyToAll: Story = {
+	play: async ({ canvasElement }) => {
+		await openSettings(canvasElement, 'Variables');
+		await clickRowAction('namespace', 'apply-all');
+		await screen.findByText('Apply $namespace to panels');
+	},
+};
+
+/**
+ * Renaming `$environment` to `$env`: saving the editor holds the rename until
+ * the rewritten queries are reviewed.
+ */
+export const RenameReferenced: Story = {
+	play: async ({ canvasElement }) => {
+		await openVariableEditor(canvasElement, 'environment');
+		await typeVariableName('env');
+		await userEvent.click(screen.getByTestId('variable-save'));
+		await screen.findByText('Rename $environment');
+	},
+};

frontend/src/pages/DashboardPage/stories/settings/settingsPlay.ts

@@ -0,0 +1,110 @@
+import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
+
+// The dashboard document loads before the toolbar renders.
+const PAGE_LOAD = { timeout: 10000 };
+
+export type SettingsTab = 'Overview' | 'Variables' | 'Publish';
+
+export type VariableType = 'dynamic' | 'textbox' | 'custom' | 'query';
+
+type RowAction = 'edit' | 'delete' | 'apply-all';
+
+/** Opens the settings drawer from the toolbar and returns the tab's panel. */
+export const openSettings = async (
+	canvasElement: HTMLElement,
+	tab: SettingsTab = 'Overview',
+): Promise<HTMLElement> => {
+	await userEvent.click(
+		await within(canvasElement).findByTestId('show-drawer', {}, PAGE_LOAD),
+	);
+
+	if (tab !== 'Overview') {
+		await userEvent.click(await screen.findByRole('tab', { name: tab }));
+	}
+
+	return screen.findByRole('tabpanel');
+};
+
+export const variableRow = (name: string): Promise<HTMLElement> =>
+	screen.findByTestId(`variable-row-${name}`, {}, PAGE_LOAD);
+
+/** Row actions render once the edit permission resolves. */
+export const clickRowAction = async (
+	name: string,
+	action: RowAction,
+): Promise<void> => {
+	const row = await variableRow(name);
+
+	await userEvent.click(
+		action === 'apply-all'
+			? // The tooltip trigger's Slot merge drops this button's test id.
+				await within(row).findByRole('button', { name: 'Apply to all' }, PAGE_LOAD)
+			: await within(row).findByTestId(
+					`variable-${action}-${name}`,
+					{},
+					PAGE_LOAD,
+				),
+	);
+};
+
+/** A new variable's editor, which opens on the Dynamic type. */
+export const openNewVariable = async (
+	canvasElement: HTMLElement,
+): Promise<void> => {
+	const panel = await openSettings(canvasElement, 'Variables');
+	const add = await within(panel).findByTestId('add-variable', {}, PAGE_LOAD);
+
+	// Disabled until its permission check resolves: through `disabled` or
+	// `aria-disabled`, depending on the Button.
+	await waitFor(() => expect(add).toBeEnabled(), PAGE_LOAD);
+	await waitFor(
+		() => expect(add).not.toHaveAttribute('aria-disabled', 'true'),
+		PAGE_LOAD,
+	);
+	await userEvent.click(add);
+	await screen.findByText('Variable Type');
+};
+
+export const openVariableEditor = async (
+	canvasElement: HTMLElement,
+	name: string,
+): Promise<void> => {
+	await openSettings(canvasElement, 'Variables');
+	await clickRowAction(name, 'edit');
+	await screen.findByText('Variable Type');
+};
+
+/**
+ * A value in the editor's preview. The toolbar's selector for the same variable
+ * resolves to its first value too, whenever its own query returns.
+ */
+export const findPreviewValue = async (value: string): Promise<HTMLElement> => {
+	const label = await screen.findByText('Preview of Values');
+
+	return within(label.parentElement as HTMLElement).findByText(
+		value,
+		undefined,
+		PAGE_LOAD,
+	);
+};
+
+export const pickVariableType = async (type: VariableType): Promise<void> => {
+	await userEvent.click(await screen.findByTestId(`variable-type-${type}`));
+};
+
+export const typeVariableName = async (name: string): Promise<void> => {
+	const input = await screen.findByTestId('variable-name');
+
+	await userEvent.clear(input);
+	await userEvent.type(input, name);
+};
+
+/**
+ * The editor's pickers are antd Selects: the element carrying the test id does
+ * nothing on click, the combobox inside it is what opens the list.
+ */
+export const openVariableSelect = async (testId: string): Promise<void> => {
+	const select = await screen.findByTestId(testId);
+
+	await userEvent.click(within(select).getByRole('combobox'));
+};

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

@@ -6,6 +6,7 @@
 import { rest } from 'msw';
 import type { GetDashboardV2200 } from 'api/generated/services/sigNoz.schemas';
 import ROUTES from 'constants/routes';
+import { screen, userEvent, waitFor, within } from 'storybook/test';
 
 import {
 	choiceControl,
@@ -342,3 +343,30 @@ export const dashboardsListMocks = defineStoryMocks({
 		});
 	},
 });
+
+/** Opens the actions menu of the row at `index`. */
+export const openRowActions = async (
+	canvasElement: HTMLElement,
+	index: number,
+): Promise<void> => {
+	// The icon-only trigger carries no accessible name.
+	const triggers = await within(canvasElement).findAllByTestId(
+		'dashboard-action-icon',
+		{},
+		{ timeout: 10000 },
+	);
+
+	await userEvent.click(triggers[index]);
+	await screen.findByText('Rename');
+};
+
+/** Picks a row action, retrying while its permission check still disables it. */
+export const pickRowAction = async (label: string | RegExp): Promise<void> => {
+	await waitFor(
+		async () => {
+			await userEvent.click(screen.getByText(label));
+			await screen.findByRole('dialog', {}, { timeout: 500 });
+		},
+		{ timeout: 10000 },
+	);
+};

frontend/src/pages/DashboardsListPage/stories/DashboardsListPage.stories.tsx

@@ -6,7 +6,9 @@ import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
 
 import {
 	dashboardsListMocks,
+	openRowActions,
 	overflowingRows,
+	pickRowAction,
 } from './DashboardsListPage.stories.mocks';
 import { BuiltinViewId } from '../types';
 
@@ -114,6 +116,45 @@ export const Tooltips: Story = {
 	parameters: { msw: { handlers: [overflowingRows] } },
 };
 
+/** The first row's actions menu, open over the list. */
+export const RowActionsMenu: Story = {
+	play: async ({ canvasElement }) => {
+		await openRowActions(canvasElement, 0);
+	},
+};
+
+/** The rename dialog, opened from the menu of the second row (the first is locked). */
+export const RenameDashboardDialog: Story = {
+	play: async ({ canvasElement }) => {
+		await openRowActions(canvasElement, 1);
+		await pickRowAction('Rename');
+		await screen.findByRole('dialog', { name: 'Rename dashboard' });
+	},
+};
+
+/** The tags dialog, opened from the menu of the second row (the first is locked). */
+export const EditTagsDialog: Story = {
+	play: async ({ canvasElement }) => {
+		await openRowActions(canvasElement, 1);
+		await pickRowAction(/^(Edit|Add) Tags$/);
+		await screen.findByRole('dialog', { name: /^(Edit|Add) tags$/ });
+	},
+};
+
+/** The popover that names the current filters as a new saved view. */
+export const SaveViewPopover: Story = {
+	play: async ({ canvasElement }) => {
+		await userEvent.click(
+			await within(canvasElement).findByRole(
+				'button',
+				{ name: 'Save current filters as a view' },
+				{ timeout: 10000 },
+			),
+		);
+		await screen.findByText('Save as view');
+	},
+};
+
 /**
  * The query the backend refused: the parse error it returned replaces the
  * generic failure copy, and there is nothing to retry.

frontend/src/pages/InfrastructureMonitoring/stories/Pods.stories.tsx

@@ -1,4 +1,9 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
+import {
+	findSuggestion,
+	openKeySuggestions,
+	typeFilter,
+} from 'components/QueryBuilderV2/QueryV2/QuerySearch/stories/__story_mockdata__/querySearch.play';
 import { screen, userEvent, within } from 'storybook/test';
 import { VIEWS } from 'container/InfraMonitoringK8sV2/constants';
 
@@ -41,6 +46,21 @@ export const PodDetailsEvents: StoryObj<PodsArgs> = {
 	args: { drawer: true, drawerTab: VIEWS.EVENTS },
 };
 
+/** The selected pod's details drawer, switched to its logs tab. */
+export const DetailsDrawerLogsTab: StoryObj<PodsArgs> = {
+	args: { drawer: true },
+	play: async () => {
+		const drawer = within(
+			await screen.findByRole('dialog', {}, { timeout: 10000 }),
+		);
+
+		await userEvent.click(
+			await drawer.findByText('Logs', {}, { timeout: 10000 }),
+		);
+		await drawer.findAllByText(/handled request in/, {}, { timeout: 10000 });
+	},
+};
+
 /**
  * Every tooltip the pod list carries, held open: Collapse Filters beside the
  * quick filters, Options above the table, the Pod Name, Status, Age and Restarts
@@ -86,3 +106,27 @@ export const TooltipsInOptionsPanel: StoryObj<PodsArgs> = {
 		await screen.findByText('Columns');
 	},
 };
+
+/**
+ * The pod list re-renders the filter when the viewport grows, and each render
+ * reconfigures the editor, which closes its suggestions. Shot at the height
+ * the page opened at.
+ */
+const heldViewport = { sbshot: { viewport: { height: 1200 } } };
+
+/** The pod filter focused: the Kubernetes keys pods can be narrowed by. */
+export const FilterKeySuggestions: StoryObj<PodsArgs> = {
+	parameters: heldViewport,
+	play: async ({ canvasElement }): Promise<void> => {
+		await openKeySuggestions(canvasElement, 'k8s.node.name');
+	},
+};
+
+/** The pod filter on a namespace: the namespaces the pods run in. */
+export const FilterValueSuggestions: StoryObj<PodsArgs> = {
+	parameters: heldViewport,
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'k8s.namespace.name = ');
+		await findSuggestion(canvasElement, 'kube-system');
+	},
+};

frontend/src/pages/IntegrationsDetailsPage/CloudIntegration/stories/__story_mockdata__/cloudIntegration.ts

@@ -295,7 +295,11 @@ const account = (
 	provider,
 	providerAccountId: ACCOUNTS[provider][index],
 	config: accountConfig(provider),
-	agentReport: { timestampMillis: Date.now() - 45 * 1000, data: null },
+	agentReport: {
+		timestampMillis: Date.now() - 45 * 1000,
+		data: null,
+		syncState: null,
+	},
 	createdAt: new Date(Date.now() - 21 * 24 * 60 * 60 * 1000).toISOString(),
 	updatedAt: new Date(Date.now() - 60 * 60 * 1000).toISOString(),
 	removedAt: null,

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

@@ -69,3 +69,12 @@ export const GroupActionsMenu: Story = {
 		await screen.findByRole('menu');
 	},
 };
+
+/** The first mapping group's edit drawer, opened from its menu. */
+export const GroupFormDrawer: Story = {
+	play: async (context): Promise<void> => {
+		await GroupActionsMenu.play?.(context);
+		await userEvent.click(await screen.findByText('Edit'));
+		await screen.findByText('Edit group');
+	},
+};

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

@@ -54,3 +54,24 @@ export const ModelCostActionsMenu: Story = {
 		await screen.findByRole('menu');
 	},
 };
+
+/** The first pricing rule's drawer, opened from its row menu. */
+export const ModelCostDrawer: Story = {
+	play: async (context): Promise<void> => {
+		await ModelCostActionsMenu.play?.(context);
+		await userEvent.click(await screen.findByText('Edit'));
+		await screen.findByText('Edit model cost');
+	},
+};
+
+/** The drawer with its cache mode select open. */
+export const ModelCostDrawerCacheModeOpen: Story = {
+	play: async (context): Promise<void> => {
+		await ModelCostDrawer.play?.(context);
+
+		await userEvent.click(
+			await screen.findByRole('combobox', { name: 'Cache mode' }),
+		);
+		await screen.findByRole('listbox');
+	},
+};

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

@@ -25,6 +25,11 @@ import {
 	toggleControl,
 } from '@/storybook/controls/controls';
 import { defineStoryMocks } from '@/storybook/controls/defineStoryMocks';
+import {
+	RESPONSE_STATES,
+	type ResponseState,
+	respondWith,
+} from '@/storybook/runtime/responseState';
 
 import {
 	logsSavedViewsResponse,
@@ -44,6 +49,8 @@ import {
 	logRowsResponse,
 	QUICK_FILTER_MAX,
 	logsQuickFiltersResponse,
+	RECENT_FILTER_MAX,
+	recentFiltersStorage,
 	RELATIVE_TIME,
 	timeRangeState,
 } from './__story_mockdata__/logs';
@@ -158,6 +165,20 @@ export const logsMocks = defineStoryMocks({
 			value: QUICK_FILTER_MAX,
 			max: QUICK_FILTER_MAX,
 		}),
+		filterValues: choiceControl<ResponseState>('Filter values', {
+			group: FILTERS,
+			description:
+				'How `/fields/values` answers once a key and an operator are typed in the filter, apart from the page-wide Data control.',
+			options: RESPONSE_STATES,
+			value: 'loaded',
+		}),
+		recentFilters: countControl('Recent filters', {
+			group: FILTERS,
+			description:
+				'Filters run before in this browser, which the filter offers above its key suggestions.',
+			value: 0,
+			max: RECENT_FILTER_MAX,
+		}),
 		savedViews: countControl('Saved views', {
 			group: FILTERS,
 			description: 'The views the view picker above the query builder lists.',
@@ -217,7 +238,7 @@ export const logsMocks = defineStoryMocks({
 
 			rest.get(
 				'http://localhost/api/v1/fields/values',
-				response.json((req) =>
+				respondWith(values.filterValues, (req) =>
 					logFieldValuesResponse(
 						req.url.searchParams.get('name') ?? '',
 						req.url.searchParams.get('searchText') ?? '',
@@ -264,8 +285,16 @@ export const logsMocks = defineStoryMocks({
 				}
 			: {},
 	}),
-	effect: ({ frequencyChart, filtersPanel, format, maxLines, fontSize }) => {
+	effect: ({
+		frequencyChart,
+		filtersPanel,
+		format,
+		maxLines,
+		fontSize,
+		recentFilters,
+	}) => {
 		setLocalStorage(LOCALSTORAGE.SHOW_FREQUENCY_CHART, String(frequencyChart));
+		setLocalStorage(...recentFiltersStorage(recentFilters));
 		setLocalStorage(LOCALSTORAGE.SHOW_LOGS_QUICK_FILTERS, String(filtersPanel));
 
 		// The preferences loader reads localStorage ahead of the URL, so this is

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

@@ -1,4 +1,12 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
+import {
+	blurFilter,
+	openKeySuggestions,
+	showFilterErrors,
+	typeFilter,
+	typeFilterWithCaretBack,
+	findSuggestion,
+} from 'components/QueryBuilderV2/QueryV2/QuerySearch/stories/__story_mockdata__/querySearch.play';
 import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
 
 import { storyMocks } from '@/storybook/controls/defineStoryMocks';
@@ -209,3 +217,138 @@ export const Tooltips: Story = {
 		);
 	},
 };
+
+/** The filter focused before anything is typed: every key the logs carry. */
+export const FilterKeySuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openKeySuggestions(canvasElement, 'severity_text');
+	},
+};
+
+/** A partial key, with the keys that still match and the typed part marked. */
+export const FilterPartialKey: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'serv');
+		await findSuggestion(canvasElement, 'service.name');
+	},
+};
+
+/** A string key followed by a space: the operators a string compares with. */
+export const FilterOperatorSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'service.name ');
+		await findSuggestion(canvasElement, 'CONTAINS');
+	},
+};
+
+/** A number key puts the range comparisons first. */
+export const FilterNumberOperatorSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'http.status_code ');
+		await findSuggestion(canvasElement, 'BETWEEN');
+	},
+};
+
+/** `NOT` after a key narrows the list to the operators it can negate. */
+export const FilterNegatedOperatorSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'service.name NOT ');
+		await findSuggestion(canvasElement, 'IN');
+	},
+};
+
+/** A key and an operator: the values the key holds, fetched for it. */
+export const FilterValueSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'service.name = ');
+		await findSuggestion(canvasElement, 'checkout');
+	},
+};
+
+/** Values still being fetched for the key. */
+export const FilterValuesLoading: Story = {
+	args: { filterValues: 'loading' },
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'service.name = ');
+		await findSuggestion(canvasElement, 'Loading suggestions');
+	},
+};
+
+/** A key the backend holds no values for, such as the free-text body. */
+export const FilterNoValueSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'body = ');
+		await findSuggestion(canvasElement, 'No suggestions available');
+	},
+};
+
+/** The values request failed. */
+export const FilterValuesError: Story = {
+	args: { filterValues: 'error' },
+	// The values request deliberately fails.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'service.name = ');
+		await findSuggestion(canvasElement, 'Error loading suggestions');
+	},
+};
+
+/** Inside an `IN` list, after the first value: the rest of the values. */
+export const FilterInList: Story = {
+	// The editor logs a TypeError while the list is open, which it survives.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilterWithCaretBack(
+			canvasElement,
+			"service.name IN ['auth', ]",
+			1,
+			'checkout',
+		);
+	},
+};
+
+/** A complete condition: the conjunctions that start the next one. */
+export const FilterConjunctionSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, "service.name = 'checkout' ");
+		await findSuggestion(canvasElement, 'OR');
+	},
+};
+
+/** Inside an opened group: keys, another group and `NOT`. */
+export const FilterNestedGroup: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilterWithCaretBack(canvasElement, '()', 1, 'NOT');
+	},
+};
+
+/** A long valid expression mixing operators, left for the next run. */
+export const FilterComplete: Story = {
+	// The editor logs a TypeError while the `IN` list is typed, which it survives.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(
+			canvasElement,
+			"service.name IN ['checkout', 'payments'] AND severity_text = 'ERROR' AND http.status_code >= 500 AND body CONTAINS 'timeout'",
+		);
+		await blurFilter(canvasElement);
+	},
+};
+
+/** An incomplete expression after focus left: the marker and its errors. */
+export const FilterSyntaxError: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await showFilterErrors(canvasElement, 'service.name = ');
+	},
+};
+
+/** Filters run before, offered above the key suggestions. */
+export const FilterRecentSearches: Story = {
+	args: { recentFilters: 3 },
+	play: async ({ canvasElement }): Promise<void> => {
+		await openKeySuggestions(
+			canvasElement,
+			"k8s.namespace.name = 'observability'",
+		);
+	},
+};

frontend/src/pages/LogsModulePage/stories/__story_mockdata__/logs.ts

@@ -15,6 +15,9 @@ import {
 } from 'api/generated/services/sigNoz.schemas';
 import { defaultLogsSelectedColumns } from 'container/OptionsMenu/constants';
 import type { OptionsQuery } from 'container/OptionsMenu/types';
+import { STORAGE_VERSION } from 'lib/recentQueries/constants';
+import type { RecentQueriesStoreShape } from 'lib/recentQueries/types';
+import { makeId, storageKeyFor } from 'lib/recentQueries/utils';
 import type { Time } from 'container/TopNav/DateTimeSelectionV2/types';
 import { quickFiltersListResponse } from 'mocks-server/__mockdata__/customQuickFilters';
 import type { AppState } from 'store/reducers';
@@ -470,3 +473,34 @@ const DASHBOARD_NAMES = [
 
 export const dashboardsResponse = (): ListDashboardsForUserV2200 =>
 	dashboardsForUserResponse(DASHBOARD_NAMES);
+
+const RECENT_FILTERS = [
+	"service.name = 'checkout' AND severity_text = 'ERROR'",
+	"k8s.namespace.name = 'observability'",
+	"body CONTAINS 'timeout'",
+	'http.status_code >= 500',
+	"deployment.environment IN ['production', 'staging']",
+];
+
+/** The filter lists this many recent entries at most. */
+export const RECENT_FILTER_MAX = RECENT_FILTERS.length;
+
+/**
+ * The explorer's recent filters as the store keeps them in localStorage,
+ * newest first, five minutes apart. Dated off `new Date()`, which the story
+ * clock freezes, so the "5 minutes ago" labels hold still.
+ */
+export const recentFiltersStorage = (count: number): [string, string] => {
+	const store: RecentQueriesStoreShape = {
+		version: STORAGE_VERSION,
+		entries: RECENT_FILTERS.slice(0, count).map((expression, index) => ({
+			id: makeId('logs', '', expression),
+			signal: 'logs',
+			source: '',
+			filter: { expression },
+			lastUsedAt: new Date().getTime() - (index + 1) * 5 * 60_000,
+		})),
+	};
+
+	return [storageKeyFor('logs', ''), JSON.stringify(store)];
+};

frontend/src/pages/MetricsExplorer/stories/MetricsExplorerPage.stories.tsx

@@ -1,4 +1,9 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
+import {
+	findSuggestion,
+	openKeySuggestions,
+	typeFilter,
+} from 'components/QueryBuilderV2/QueryV2/QuerySearch/stories/__story_mockdata__/querySearch.play';
 import { screen, userEvent } from 'storybook/test';
 
 import { storyMocks } from '@/storybook/controls/defineStoryMocks';
@@ -114,3 +119,18 @@ export const MetricDetailsDashboardsMenu: Story = {
 		await screen.findByRole('menu');
 	},
 };
+
+/** The summary's metric search focused: the attributes metrics can be found by. */
+export const FilterKeySuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openKeySuggestions(canvasElement, 'k8s.cluster.name');
+	},
+};
+
+/** The metric search on an attribute and an operator: the values it holds. */
+export const FilterValueSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'service.name = ');
+		await findSuggestion(canvasElement, 'checkout');
+	},
+};

frontend/src/pages/Settings/Ingestion/stories/Ingestion.stories.mocks.tsx

@@ -15,10 +15,14 @@ import {
 	toggleControl,
 } from '@/storybook/controls/controls';
 import { defineStoryMocks } from '@/storybook/controls/defineStoryMocks';
+import type { MockResolver } from '@/storybook/msw/types';
 
 import {
+	CREATE_OUTCOMES,
+	type CreateOutcome,
 	EXPIRIES,
 	type Expiry,
+	ingestionKeyCreateError,
 	ingestionKeysResponse,
 	KEYS_PER_PAGE,
 	legacyIngestionResponse,
@@ -29,6 +33,11 @@ import {
 const KEYS = 'Ingestion · keys';
 const LIMITS = 'Ingestion · limits';
 
+const rejectCreate: MockResolver = (_req, res, ctx) =>
+	res(ctx.status(409), ctx.json(ingestionKeyCreateError()));
+
+const holdCreate: MockResolver = (_req, res, ctx) => res(ctx.delay('infinite'));
+
 export const ingestionMocks = defineStoryMocks({
 	controls: {
 		gateway: toggleControl('Gateway', {
@@ -50,6 +59,13 @@ export const ingestionMocks = defineStoryMocks({
 			options: EXPIRIES,
 			value: 'none',
 		}),
+		create: choiceControl<CreateOutcome>('Creating a key', {
+			group: KEYS,
+			description:
+				'What the create behind the new key form answers. `hangs` holds the submit button in its loading state.',
+			options: CREATE_OUTCOMES,
+			value: 'succeeds',
+		}),
 		limits: multiChoiceControl<LimitSignal>('Signals with a limit', {
 			group: LIMITS,
 			description:
@@ -85,10 +101,14 @@ export const ingestionMocks = defineStoryMocks({
 
 		rest.post(
 			'http://localhost/api/v2/gateway/ingestion_keys',
-			response.json(() => ({
-				status: 'success',
-				data: { id: 'ingestion-key-new', value: 'sk_new' },
-			})),
+			{
+				succeeds: response.json(() => ({
+					status: 'success',
+					data: { id: 'ingestion-key-new', value: 'sk_new' },
+				})),
+				fails: rejectCreate,
+				hangs: holdCreate,
+			}[values.create],
 		),
 
 		rest.patch(

frontend/src/pages/Settings/Ingestion/stories/Ingestion.stories.tsx

@@ -1,5 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { screen, userEvent, within } from 'storybook/test';
+import dayjs from 'dayjs';
+import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
 
 import { storyMocks } from '@/storybook/controls/defineStoryMocks';
 import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
@@ -76,16 +77,149 @@ export const KeyLimits: Story = {
 	},
 };
 
+async function openCreateKey(
+	canvasElement: HTMLElement,
+): Promise<ReturnType<typeof within>> {
+	await userEvent.click(
+		await within(canvasElement).findByText(
+			'New Ingestion key',
+			undefined,
+			untilLoaded,
+		),
+	);
+	return within(
+		await screen.findByRole(
+			'dialog',
+			{ name: 'Create new ingestion key' },
+			untilLoaded,
+		),
+	);
+}
+
+async function addTag(
+	dialog: ReturnType<typeof within>,
+	tag: string,
+): Promise<void> {
+	await userEvent.click(await dialog.findByRole('button', { name: /New Tag/ }));
+	await userEvent.keyboard(`${tag}{Enter}`);
+}
+
+async function submitCreateKey(
+	dialog: ReturnType<typeof within>,
+): Promise<void> {
+	await userEvent.type(dialog.getByLabelText('Name'), 'otel-collectors');
+	await userEvent.click(dialog.getByLabelText('Expiration'));
+	await userEvent.click(
+		await screen.findByTitle(dayjs().add(1, 'day').format('YYYY-MM-DD')),
+	);
+	await userEvent.click(
+		dialog.getByRole('button', { name: 'Create new Ingestion key' }),
+	);
+}
+
 /** The form a new key is named and dated in. */
 export const CreateKey: Story = {
 	play: async ({ canvasElement }): Promise<void> => {
-		await userEvent.click(
-			await within(canvasElement).findByText(
-				'New Ingestion key',
-				undefined,
-				untilLoaded,
-			),
-		);
-		await screen.findByText('Create new ingestion key', undefined, untilLoaded);
+		await openCreateKey(canvasElement);
+	},
+};
+
+/** A tag typed on the new key and not confirmed yet. */
+export const CreateKeyAddingTag: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		await userEvent.click(dialog.getByRole('button', { name: /New Tag/ }));
+		await userEvent.keyboard('team-payments');
+	},
+};
+
+/** The new key with its tags confirmed, each one removable. */
+export const CreateKeyTagsAdded: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		for (const tag of ['team-payments', 'env:production']) {
+			await addTag(dialog, tag);
+			await dialog.findByText(tag);
+		}
+	},
+};
+
+/**
+ * A tag typed again while the key already has it: Enter keeps the input open
+ * and adds nothing, with no message saying why.
+ */
+export const CreateKeyDuplicateTag: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		await addTag(dialog, 'team-payments');
+		await addTag(dialog, 'team-payments');
+		await dialog.findByDisplayValue('team-payments');
+	},
+};
+
+/** A tag longer than its pill, cut short with an ellipsis. */
+export const CreateKeyLongTag: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		const tag =
+			'team-payments-platform-observability-production-us-east-1-canary-collectors';
+		await addTag(dialog, tag);
+		await dialog.findByText(tag);
+	},
+};
+
+/** A name with a space and no expiration, submitted: each field names its rule. */
+export const CreateKeyInvalid: Story = {
+	// The page logs the rejected validation through `console.error`.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		await userEvent.type(dialog.getByLabelText('Name'), 'otel collectors');
+		await userEvent.click(
+			dialog.getByRole('button', { name: 'Create new Ingestion key' }),
+		);
+		await dialog.findByText(/should only contain letters/);
+	},
+};
+
+/** The expiration calendar, where today and every day before it are disabled. */
+export const CreateKeyExpirationOpen: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		await userEvent.click(dialog.getByLabelText('Expiration'));
+		await screen.findByTitle(dayjs().format('YYYY-MM-DD'));
+	},
+};
+
+/** The new key sent, with the create still in flight. */
+export const CreateKeySubmitting: Story = {
+	args: { create: 'hangs' },
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		await submitCreateKey(dialog);
+		await waitFor(() =>
+			expect(
+				dialog.getByRole('button', { name: 'Create new Ingestion key' }),
+			).toBeDisabled(),
+		);
+	},
+};
+
+/**
+ * A create the gateway rejects: the notification names the conflict and the
+ * form keeps what was typed.
+ */
+export const CreateKeyFailed: Story = {
+	args: { create: 'fails' },
+	// The deliberate 409 is the state under test.
+	parameters: { allowConsoleErrors: true },
+	play: async ({ canvasElement }): Promise<void> => {
+		const dialog = await openCreateKey(canvasElement);
+		await submitCreateKey(dialog);
+		await screen.findByText(
+			'An ingestion key with this name already exists.',
+			undefined,
+			untilLoaded,
+		);
 	},
 };

frontend/src/pages/Settings/Ingestion/stories/__story_mockdata__/ingestion.ts

@@ -7,6 +7,7 @@ import type {
 	GatewaytypesIngestionKeyDTO,
 	GatewaytypesLimitDTO,
 	GetIngestionKeys200,
+	RenderErrorResponseDTO,
 } from 'api/generated/services/sigNoz.schemas';
 import type { IngestionInfo } from 'types/api/settings/ingestion';
 
@@ -21,6 +22,10 @@ export const EXPIRIES = ['none', 'soon', 'expired'] as const;
 
 export type Expiry = (typeof EXPIRIES)[number];
 
+export const CREATE_OUTCOMES = ['succeeds', 'fails', 'hangs'] as const;
+
+export type CreateOutcome = (typeof CREATE_OUTCOMES)[number];
+
 const KEY_NAMES = [
 	'production-us-east',
 	'production-eu-west',
@@ -117,6 +122,18 @@ export const ingestionKeysResponse = (
 	},
 });
 
+export const ingestionKeyCreateError = (): RenderErrorResponseDTO => ({
+	status: 'error',
+	error: {
+		code: 'already_exists',
+		type: 'already_exists',
+		message: 'An ingestion key with this name already exists.',
+		url: '',
+		errors: [],
+		suggestions: [],
+	},
+});
+
 /**
  * The pre-gateway endpoint, which answers with one record and no limits: the tab
  * falls back to it when the gateway feature is off.

frontend/src/pages/Settings/Roles/RoleEditor/stories/RoleEditor.stories.mocks.tsx

@@ -5,6 +5,7 @@
 
 import ROUTES from 'constants/routes';
 import { rest } from 'msw';
+import { userEvent, within } from 'storybook/test';
 import { RoleType } from 'types/roles';
 
 import { choiceControl } from '@/storybook/controls/controls';
@@ -84,3 +85,18 @@ export const roleEditorMocks = defineStoryMocks({
 	],
 	config: (values) => ({ route: routeFor(values.mode, values.editor) }),
 });
+
+/** Opens the Logs card and returns it. */
+export const openLogsCard = async (
+	canvasElement: HTMLElement,
+): Promise<HTMLElement> => {
+	const header = await within(canvasElement).findByRole(
+		'button',
+		{ name: /^Logs:/ },
+		{ timeout: 15_000 },
+	);
+
+	await userEvent.click(header);
+
+	return header.parentElement as HTMLElement;
+};

frontend/src/pages/Settings/Roles/RoleEditor/stories/RoleEditor.stories.tsx

@@ -1,10 +1,10 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { userEvent, within } from 'storybook/test';
+import { screen, userEvent, within } from 'storybook/test';
 
 import { storyMocks } from '@/storybook/controls/defineStoryMocks';
 import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
 
-import { roleEditorMocks } from './RoleEditor.stories.mocks';
+import { openLogsCard, roleEditorMocks } from './RoleEditor.stories.mocks';
 
 import SettingsPage from '../../../Settings';
 
@@ -75,3 +75,27 @@ export const Tooltips: Story = {
 export const TooltipsInJsonEditor: Story = {
 	args: { tooltipsOpen: true, mode: 'edit', editor: 'json' },
 };
+
+/** The Logs card's first verb granted over everything instead of nothing. */
+export const PermissionEditorScope: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const card = await openLogsCard(canvasElement);
+		const [all] = await within(card).findAllByText('All');
+
+		await userEvent.click(all);
+	},
+};
+
+/** The selector wizard, opened from a Logs verb scoped to named objects. */
+export const TelemetrySelectorWizard: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		const card = await openLogsCard(canvasElement);
+		const [onlySelected] = await within(card).findAllByText('Only selected');
+
+		await userEvent.click(onlySelected);
+		await userEvent.click(
+			await within(card).findByRole('button', { name: 'Wizard' }),
+		);
+		await screen.findByRole('dialog', { name: 'Selector Wizard' });
+	},
+};

frontend/src/pages/TraceDetailsV3/stories/TraceDetailsV3.stories.tsx

@@ -172,3 +172,31 @@ export const TraceOptionsMenu: Story = {
 		await screen.findByText('Preview fields');
 	},
 };
+
+/** The span panel moved from the right edge to the bottom through its dock toggle. */
+export const DockModeSwitched: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		// The dock options are icon-only and carry no accessible name.
+		const option = await within(canvasElement).findByTestId(
+			'dock-mode-docked',
+			undefined,
+			untilLoaded,
+		);
+
+		await userEvent.click(option.querySelector('button') ?? option);
+	},
+};
+
+/** The span's percentile badge expanded into the distribution it was ranked in. */
+export const SpanPercentileOpen: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await userEvent.click(
+			await within(canvasElement).findByRole(
+				'button',
+				{ name: /^p\d+/ },
+				untilLoaded,
+			),
+		);
+		await screen.findByText(/This span duration is/);
+	},
+};

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

@@ -1,4 +1,10 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
+import {
+	findSuggestion,
+	openKeySuggestions,
+	showFilterErrors,
+	typeFilter,
+} from 'components/QueryBuilderV2/QueryV2/QuerySearch/stories/__story_mockdata__/querySearch.play';
 import { ExplorerViews } from 'pages/LogsExplorer/utils';
 import { expect, screen, userEvent, waitFor } from 'storybook/test';
 
@@ -142,3 +148,41 @@ export const QuickFiltersSettingsWithBanner: Story = {
 	args: { banner: 'trial-expiry' },
 	play: dirtyQuickFiltersSettings,
 };
+
+/** The filter focused before anything is typed: span and resource keys together. */
+export const FilterKeySuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await openKeySuggestions(canvasElement, 'status_code_string');
+	},
+};
+
+/** A context prefix: only the keys that live on the resource. */
+export const FilterResourceKeys: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'resource.');
+		await findSuggestion(canvasElement, 'resource.service.name');
+	},
+};
+
+/** A key and an operator: the services the spans came from. */
+export const FilterValueSuggestions: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'service.name = ');
+		await findSuggestion(canvasElement, 'checkout');
+	},
+};
+
+/** A boolean key offers its two values. */
+export const FilterBooleanValues: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await typeFilter(canvasElement, 'has_error = ');
+		await findSuggestion(canvasElement, 'false');
+	},
+};
+
+/** A dangling conjunction after focus left: the marker and its errors. */
+export const FilterSyntaxError: Story = {
+	play: async ({ canvasElement }): Promise<void> => {
+		await showFilterErrors(canvasElement, 'has_error = true AND');
+	},
+};

frontend/src/storybook/README.md

@@ -116,6 +116,10 @@ Storybook fills the seams with:
   because elapsed-time code reads it — `lodash.debounce` compares two readings
   to decide its trailing call is due, and a frozen one leaves every debounced
   input in the app filtering nothing. `?storyClock=live` opts out.
+- A speech recognizer in place of the browser's, also in
+  `.storybook/preview-head.html`, because Storybook has no microphone. It
+  starts listening on `start()` and hears only what a `play` passes to
+  `webkitSpeechRecognition.listening.hear(text)`.
 - Theme from the toolbar (dark/light). `applyThemeBodyClass` puts `<body>` in the
   state the app gets from `index.html` plus `AppLayout`: `data-theme="default"`
   (every `@signozhq/design-tokens` semantic token is scoped to it, and without it

pkg/apiserver/signozapiserver/authdomain.go

@@ -1,15 +1,18 @@
 package signozapiserver
 
 import (
+	"encoding/json"
 	"net/http"
 	"slices"
 
+	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/http/handler"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
+	"github.com/tidwall/gjson"
 )
 
 func (provider *provider) addAuthDomainRoutes(router *mux.Router) error {
@@ -74,7 +77,7 @@ func (provider *provider) addAuthDomainRoutes(router *mux.Router) error {
 				SourceIDs:      coretypes.OneID(coretypes.ResponseJSONPath("data.id")),
 				SourceSelector: coretypes.WildcardSelector,
 				TargetResource: coretypes.ResourceRole,
-				TargetIDs:      authDomainPostableRoleNamesExtractor(),
+				TargetIDs:      authDomainRoleNamesExtractor(),
 				TargetSelector: coretypes.IDSelector,
 			},
 		),
@@ -146,7 +149,7 @@ func (provider *provider) addAuthDomainRoutes(router *mux.Router) error {
 				SourceIDs:      coretypes.OneID(coretypes.PathParam("id")),
 				SourceSelector: coretypes.IDSelector,
 				TargetResource: coretypes.ResourceRole,
-				TargetIDs:      authDomainUpdatableRoleNamesExtractor(),
+				TargetIDs:      authDomainRoleNamesExtractor(),
 				TargetSelector: coretypes.IDSelector,
 			},
 			handler.AttachDetachSiblingResourceDef{
@@ -196,16 +199,20 @@ func (provider *provider) addAuthDomainRoutes(router *mux.Router) error {
 
 // The extracted names are the roles the request body's mapping grants at SSO
 // login — see authDomainEffectiveRoleNames.
-func authDomainPostableRoleNamesExtractor() coretypes.ResourceIDsExtractor {
-	return coretypes.BodyFields(func(req *authtypes.PostableAuthDomain) []string {
-		return authDomainEffectiveRoleNames(req.RoleMapping)
-	})
-}
+func authDomainRoleNamesExtractor() coretypes.ResourceIDsExtractor {
+	return coretypes.ResourceIDsExtractor{Phase: coretypes.PhaseRequest, Fn: func(ec coretypes.ExtractorContext) ([]string, error) {
+		roleMappingJSON := gjson.GetBytes(ec.RequestBody, "roleMapping")
+		if !roleMappingJSON.Exists() || roleMappingJSON.Type == gjson.Null {
+			return authDomainEffectiveRoleNames(nil), nil
+		}
 
-func authDomainUpdatableRoleNamesExtractor() coretypes.ResourceIDsExtractor {
-	return coretypes.BodyFields(func(req *authtypes.UpdatableAuthDomain) []string {
-		return authDomainEffectiveRoleNames(req.RoleMapping)
-	})
+		roleMapping := new(authtypes.RoleMapping)
+		if err := json.Unmarshal([]byte(roleMappingJSON.Raw), roleMapping); err != nil {
+			return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "invalid role mapping: %v", err)
+		}
+
+		return authDomainEffectiveRoleNames(roleMapping), nil
+	}}
 }
 
 // The extracted names are the roles the stored domain's mapping grants at SSO

pkg/apiserver/signozapiserver/cloudintegration.go

@@ -350,7 +350,7 @@ func (provider *provider) addCloudIntegrationRoutes(router *mux.Router) error {
 			Resource: coretypes.ResourceMetaResourceCloudIntegration,
 			Verb:     coretypes.VerbRead,
 			Category: coretypes.ActionCategoryDataAccess,
-			ID:       coretypes.BodyField(func(req *citypes.PostableAgentCheckIn) string { return req.ID }),
+			ID:       coretypes.BodyJSONPath("account_id"),
 			Selector: coretypes.IDSelector,
 		}),
 	)).Methods(http.MethodPost).GetError(); err != nil {
@@ -377,12 +377,7 @@ func (provider *provider) addCloudIntegrationRoutes(router *mux.Router) error {
 			Resource: coretypes.ResourceMetaResourceCloudIntegration,
 			Verb:     coretypes.VerbRead,
 			Category: coretypes.ActionCategoryDataAccess,
-			ID: coretypes.BodyField(func(req *citypes.PostableAgentCheckIn) string {
-				if req.CloudIntegrationID.IsZero() {
-					return ""
-				}
-				return req.CloudIntegrationID.StringValue()
-			}),
+			ID:       coretypes.BodyJSONPath("cloudIntegrationId"),
 			Selector: coretypes.IDSelector,
 		}),
 	)).Methods(http.MethodPost).GetError(); err != nil {

pkg/apiserver/signozapiserver/gateway.go

@@ -332,7 +332,7 @@ func (provider *provider) addGatewayRoutes(router *mux.Router) error {
 				Verb:           coretypes.VerbAttach,
 				Category:       coretypes.ActionCategoryConfigurationChange,
 				ParentResource: coretypes.ResourceMetaResourceIngestionKey,
-				ParentID:       coretypes.BodyField(func(req *gatewaytypes.PostableIngestionKeyLimit) string { return req.KeyID }),
+				ParentID:       coretypes.BodyJSONPath("keyId"),
 				ParentSelector: coretypes.IDSelector,
 				ChildResource:  coretypes.ResourceMetaResourceIngestionLimit,
 				ChildIDs:       coretypes.OneID(coretypes.ResponseJSONPath("data.id")),

pkg/apiserver/signozapiserver/prometheus.go

@@ -5,7 +5,6 @@ import (
 	"strings"
 
 	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/http/handler"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/prometheus"
@@ -80,14 +79,6 @@ func (h *prometheusOpenAPIHandler) ResourceDefs() []handler.ResourceDef {
 	}}
 }
 
-func (h *prometheusOpenAPIHandler) Request() any {
-	return nil
-}
-
-func (h *prometheusOpenAPIHandler) BindBodyOptions() []binding.BindBodyOption {
-	return nil
-}
-
 func (provider *provider) addPrometheusRoutes(router *mux.Router) error {
 	if err := router.Handle("/prometheus/api/v1/query", &prometheusOpenAPIHandler{
 		handlerFunc: provider.authzMiddleware.CheckResources(provider.prometheusHandler.Query, authtypes.SigNozAdminRoleName, authtypes.SigNozEditorRoleName, authtypes.SigNozViewerRoleName),

pkg/apiserver/signozapiserver/querier.go

@@ -461,11 +461,10 @@ func (provider *provider) addQuerierRoutes(router *mux.Router) error {
 		ErrorStatusCodes:    []int{http.StatusBadRequest},
 		SecuritySchemes:     newScopedSecuritySchemes(telemetryReadScopes()),
 	}, handler.WithResourceDefs(handler.TelemetryResourceDef{
-		Verb:         coretypes.VerbRead,
-		Category:     coretypes.ActionCategoryDataAccess,
-		Selector:     querybuilder.TelemetrySelector,
-		Resources:    querybuilder.QueryRangeResources,
-		RequiresBody: true,
+		Verb:      coretypes.VerbRead,
+		Category:  coretypes.ActionCategoryDataAccess,
+		Selector:  querybuilder.TelemetrySelector,
+		Resources: querybuilder.QueryRangeResources,
 	}))).Methods(http.MethodPost).GetError(); err != nil {
 		return err
 	}
@@ -484,11 +483,10 @@ func (provider *provider) addQuerierRoutes(router *mux.Router) error {
 		ErrorStatusCodes:    []int{http.StatusBadRequest},
 		SecuritySchemes:     newScopedSecuritySchemes(telemetryReadScopes()),
 	}, handler.WithResourceDefs(handler.TelemetryResourceDef{
-		Verb:         coretypes.VerbRead,
-		Category:     coretypes.ActionCategoryDataAccess,
-		Selector:     querybuilder.TelemetrySelector,
-		Resources:    querybuilder.QueryRangeResources,
-		RequiresBody: true,
+		Verb:      coretypes.VerbRead,
+		Category:  coretypes.ActionCategoryDataAccess,
+		Selector:  querybuilder.TelemetrySelector,
+		Resources: querybuilder.QueryRangeResources,
 	}))).Methods(http.MethodPost).GetError(); err != nil {
 		return err
 	}

pkg/apiserver/signozapiserver/registry.go

@@ -4,7 +4,6 @@ import (
 	"net/http"
 
 	"github.com/SigNoz/signoz/pkg/factory"
-	"github.com/SigNoz/signoz/pkg/http/binding"
 	pkghandler "github.com/SigNoz/signoz/pkg/http/handler"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/gorilla/mux"
@@ -56,14 +55,6 @@ func (handler *healthOpenAPIHandler) ResourceDefs() []pkghandler.ResourceDef {
 	return nil
 }
 
-func (handler *healthOpenAPIHandler) Request() any {
-	return nil
-}
-
-func (handler *healthOpenAPIHandler) BindBodyOptions() []binding.BindBodyOption {
-	return nil
-}
-
 func (provider *provider) addRegistryRoutes(router *mux.Router) error {
 	if err := router.Handle("/api/v2/healthz", newHealthOpenAPIHandler(
 		provider.authzMiddleware.OpenAccess(provider.factoryHandler.Healthz),

pkg/apiserver/signozapiserver/serviceaccount.go

@@ -358,20 +358,10 @@ func (provider *provider) addServiceAccountRoutes(router *mux.Router) error {
 			Verb:           coretypes.VerbAttach,
 			Category:       coretypes.ActionCategoryAccessControl,
 			SourceResource: coretypes.ResourceServiceAccount,
-			SourceIDs: coretypes.OneID(coretypes.BodyField(func(req *serviceaccounttypes.PostableServiceAccountRole) string {
-				if req.ServiceAccountID.IsZero() {
-					return ""
-				}
-				return req.ServiceAccountID.StringValue()
-			})),
+			SourceIDs:      coretypes.OneID(coretypes.BodyJSONPath("serviceAccountId")),
 			SourceSelector: coretypes.IDSelector,
 			TargetResource: coretypes.ResourceRole,
-			TargetIDs: coretypes.OneID(coretypes.BodyField(func(req *serviceaccounttypes.PostableServiceAccountRole) string {
-				if req.RoleID.IsZero() {
-					return ""
-				}
-				return req.RoleID.StringValue()
-			})),
+			TargetIDs:      coretypes.OneID(coretypes.BodyJSONPath("roleId")),
 			TargetSelector: provider.roleSelector,
 		}),
 	)).Methods(http.MethodPost).GetError(); err != nil {

pkg/apiserver/signozapiserver/zeus.go

@@ -68,7 +68,7 @@ func (provider *provider) addZeusRoutes(router *mux.Router) error {
 		Resource: coretypes.ResourceMetaResourceDeploymentHost,
 		Verb:     coretypes.VerbUpdate,
 		Category: coretypes.ActionCategoryConfigurationChange,
-		ID:       coretypes.BodyField(func(req *zeustypes.PostableHost) string { return req.Name }),
+		ID:       coretypes.BodyJSONPath("name"),
 		Selector: coretypes.WildcardSelector,
 	}))).Methods(http.MethodPut).GetError(); err != nil {
 		return err

pkg/gateway/handler.go

@@ -8,7 +8,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/types/gatewaytypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
@@ -285,8 +284,8 @@ func (handler *handler) CreateIngestionKeyLimit(rw http.ResponseWriter, r *http.
 
 	orgID := valuer.MustNewUUID(claims.OrgID)
 
-	req, err := coretypes.BodyFromContext[gatewaytypes.PostableIngestionKeyLimit](r.Context())
-	if err != nil {
+	var req gatewaytypes.PostableIngestionKeyLimit
+	if err := binding.JSON.BindBody(r.Body, &req); err != nil {
 		render.Error(rw, err)
 		return
 	}

pkg/http/handler/handler.go

@@ -1,13 +1,10 @@
 package handler
 
 import (
-	"fmt"
 	"net/http"
-	"reflect"
 	"slices"
 
 	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/swaggest/openapi-go"
 	"github.com/swaggest/openapi-go/openapi3"
@@ -19,15 +16,12 @@ type Handler interface {
 	http.Handler
 	ServeOpenAPI(openapi.OperationContext)
 	ResourceDefs() []ResourceDef
-	Request() any
-	BindBodyOptions() []binding.BindBodyOption
 }
 
 type handler struct {
-	handlerFunc     http.HandlerFunc
-	openAPIDef      OpenAPIDef
-	resourceDefs    []ResourceDef
-	bindBodyOptions []binding.BindBodyOption
+	handlerFunc  http.HandlerFunc
+	openAPIDef   OpenAPIDef
+	resourceDefs []ResourceDef
 }
 
 func New(handlerFunc http.HandlerFunc, openAPIDef OpenAPIDef, opts ...Option) Handler {
@@ -53,10 +47,6 @@ func New(handlerFunc http.HandlerFunc, openAPIDef OpenAPIDef, opts ...Option) Ha
 		opt(handler)
 	}
 
-	if RequiresBody(handler.resourceDefs) && (openAPIDef.Request == nil || reflect.TypeOf(openAPIDef.Request).Kind() != reflect.Pointer) {
-		panic(fmt.Sprintf("handler %s: a body extractor needs OpenAPIDef.Request to be a pointer, got %T", openAPIDef.ID, openAPIDef.Request))
-	}
-
 	return handler
 }
 
@@ -145,11 +135,3 @@ func (handler *handler) ServeOpenAPI(opCtx openapi.OperationContext) {
 func (handler *handler) ResourceDefs() []ResourceDef {
 	return handler.resourceDefs
 }
-
-func (handler *handler) Request() any {
-	return handler.openAPIDef.Request
-}
-
-func (handler *handler) BindBodyOptions() []binding.BindBodyOption {
-	return handler.bindBodyOptions
-}

pkg/http/handler/handler_test.go

@@ -4,8 +4,6 @@ import (
 	"net/http"
 	"testing"
 
-	"github.com/SigNoz/signoz/pkg/http/binding"
-	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/gorilla/mux"
 	"github.com/stretchr/testify/assert"
 	"github.com/stretchr/testify/require"
@@ -24,41 +22,6 @@ func (bespokeOpenAPIHandler) ServeOpenAPI(opCtx openapi.OperationContext) {
 
 func (bespokeOpenAPIHandler) ResourceDefs() []ResourceDef { return nil }
 
-func (bespokeOpenAPIHandler) Request() any { return nil }
-
-func (bespokeOpenAPIHandler) BindBodyOptions() []binding.BindBodyOption { return nil }
-
-func TestNewPanicsWhenBodyExtractorHasNoPointerRequest(t *testing.T) {
-	type body struct{ ID string }
-	bodyDef := BasicResourceDef{Resource: coretypes.ResourceRole, Verb: coretypes.VerbRead, ID: coretypes.BodyField(func(req *body) string { return req.ID }), Selector: coretypes.IDSelector}
-	pathDef := BasicResourceDef{Resource: coretypes.ResourceRole, Verb: coretypes.VerbRead, ID: coretypes.PathParam("id"), Selector: coretypes.IDSelector}
-
-	testCases := []struct {
-		name    string
-		request any
-		def     ResourceDef
-		panics  bool
-	}{
-		{name: "BodyExtractor_ValueRequest_Panics", request: body{}, def: bodyDef, panics: true},
-		{name: "BodyExtractor_NilRequest_Panics", request: nil, def: bodyDef, panics: true},
-		{name: "BodyExtractor_PointerRequest_Registers", request: new(body), def: bodyDef, panics: false},
-		{name: "PathExtractor_ValueRequest_Registers", request: body{}, def: pathDef, panics: false},
-	}
-
-	for _, testCase := range testCases {
-		t.Run(testCase.name, func(t *testing.T) {
-			register := func() {
-				New(func(http.ResponseWriter, *http.Request) {}, OpenAPIDef{ID: testCase.name, Request: testCase.request}, WithResourceDefs(testCase.def))
-			}
-			if testCase.panics {
-				assert.Panics(t, register)
-			} else {
-				assert.NotPanics(t, register)
-			}
-		})
-	}
-}
-
 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)

pkg/http/handler/option.go

@@ -1,7 +1,5 @@
 package handler
 
-import "github.com/SigNoz/signoz/pkg/http/binding"
-
 type Option func(*handler)
 
 func WithResourceDefs(defs ...ResourceDef) Option {
@@ -9,9 +7,3 @@ func WithResourceDefs(defs ...ResourceDef) Option {
 		h.resourceDefs = append(h.resourceDefs, defs...)
 	}
 }
-
-func WithBindBodyOptions(opts ...binding.BindBodyOption) Option {
-	return func(h *handler) {
-		h.bindBodyOptions = append(h.bindBodyOptions, opts...)
-	}
-}

pkg/http/handler/resourcedef.go

@@ -9,7 +9,6 @@ type ResourceDef interface {
 	// resolveRequest is unexported to seal the interface. It returns a slice so a
 	// single def can fan out (e.g. a telemetry query touching multiple signals).
 	resolveRequest(ec coretypes.ExtractorContext) []coretypes.ResolvedResource
-	requiresBody() bool
 }
 
 func ResolveRequest(defs []ResourceDef, ec coretypes.ExtractorContext) []coretypes.ResolvedResource {
@@ -21,17 +20,6 @@ func ResolveRequest(defs []ResourceDef, ec coretypes.ExtractorContext) []coretyp
 	return resolved
 }
 
-// RequiresBody reports whether any def needs the decoded request body.
-func RequiresBody(defs []ResourceDef) bool {
-	for _, def := range defs {
-		if def.requiresBody() {
-			return true
-		}
-	}
-
-	return false
-}
-
 // BasicResourceDef checks a single resource for one verb.
 type BasicResourceDef struct {
 	Resource coretypes.Resource
@@ -54,10 +42,6 @@ func (def BasicResourceDef) resolveRequest(ec coretypes.ExtractorContext) []core
 	}
 }
 
-func (def BasicResourceDef) requiresBody() bool {
-	return def.ID.RequiresBody
-}
-
 // AttachDetachSiblingResourceDef checks an attach/detach between peer resources;
 // both source and target are authz-checked.
 type AttachDetachSiblingResourceDef struct {
@@ -88,10 +72,6 @@ func (def AttachDetachSiblingResourceDef) resolveRequest(ec coretypes.ExtractorC
 	}
 }
 
-func (def AttachDetachSiblingResourceDef) requiresBody() bool {
-	return def.SourceIDs.RequiresBody || def.TargetIDs.RequiresBody
-}
-
 // AttachDetachParentChildResourceDef authz-checks only the parent; the child
 // rides along for audit context.
 type AttachDetachParentChildResourceDef struct {
@@ -121,20 +101,11 @@ func (def AttachDetachParentChildResourceDef) resolveRequest(ec coretypes.Extrac
 	}
 }
 
-func (def AttachDetachParentChildResourceDef) requiresBody() bool {
-	return def.ParentID.RequiresBody || def.ChildIDs.RequiresBody
-}
-
 type TelemetryResourceDef struct {
-	Verb         coretypes.Verb
-	Category     coretypes.ActionCategory
-	Selector     coretypes.SelectorFunc
-	Resources    coretypes.ResourceExtractor
-	RequiresBody bool
-}
-
-func (def TelemetryResourceDef) requiresBody() bool {
-	return def.RequiresBody
+	Verb      coretypes.Verb
+	Category  coretypes.ActionCategory
+	Selector  coretypes.SelectorFunc
+	Resources coretypes.ResourceExtractor
 }
 
 func (def TelemetryResourceDef) resolveRequest(ec coretypes.ExtractorContext) []coretypes.ResolvedResource {

pkg/http/middleware/resource.go

@@ -5,9 +5,7 @@ import (
 	"io"
 	"log/slog"
 	"net/http"
-	"reflect"
 
-	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/http/handler"
 	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/gorilla/mux"
@@ -25,8 +23,8 @@ func NewResource(logger *slog.Logger) *Resource {
 
 func (middleware *Resource) Wrap(next http.Handler) http.Handler {
 	return http.HandlerFunc(func(rw http.ResponseWriter, req *http.Request) {
-		provider := handlerFromRequest(req)
-		if provider == nil || len(provider.ResourceDefs()) == 0 {
+		defs := resourceDefsFromRequest(req)
+		if len(defs) == 0 {
 			next.ServeHTTP(rw, req)
 			return
 		}
@@ -38,40 +36,18 @@ func (middleware *Resource) Wrap(next http.Handler) http.Handler {
 			req.Body = io.NopCloser(bytes.NewReader(body))
 		}
 
-		defs := provider.ResourceDefs()
-
-		var decoded any
-		var decodeErr error
-		if handler.RequiresBody(defs) {
-			decoded, decodeErr = decodeBody(provider.Request(), body, provider.BindBodyOptions()...)
+		extractorCtx := coretypes.ExtractorContext{
+			Request:     req,
+			RequestBody: body,
 		}
+		resolved := handler.ResolveRequest(defs, extractorCtx)
 
-		extractorCtx := coretypes.ExtractorContext{Request: req, RequestBody: decoded}
-
-		var resolved []coretypes.ResolvedResource
-		if decodeErr != nil {
-			// authz renders the error inside the audit middleware, so the request is still logged
-			resolved = []coretypes.ResolvedResource{coretypes.NewResolvedResourceWithError(coretypes.Verb{}, coretypes.ActionCategory{}, decodeErr)}
-		} else {
-			resolved = handler.ResolveRequest(defs, extractorCtx)
-		}
-
-		ctx := coretypes.NewContextWithExtractorContext(req.Context(), extractorCtx)
-		ctx = coretypes.NewContextWithResolvedResources(ctx, resolved)
+		ctx := coretypes.NewContextWithResolvedResources(req.Context(), resolved)
 		next.ServeHTTP(rw, req.WithContext(ctx))
 	})
 }
 
-func decodeBody(prototype any, body []byte, opts ...binding.BindBodyOption) (any, error) {
-	decoded := reflect.New(reflect.TypeOf(prototype).Elem()).Interface()
-	if err := binding.JSON.BindBody(bytes.NewReader(body), decoded, opts...); err != nil {
-		return nil, err
-	}
-
-	return decoded, nil
-}
-
-func handlerFromRequest(req *http.Request) handler.Handler {
+func resourceDefsFromRequest(req *http.Request) []handler.ResourceDef {
 	route := mux.CurrentRoute(req)
 	if route == nil {
 		return nil
@@ -87,5 +63,5 @@ func handlerFromRequest(req *http.Request) handler.Handler {
 		return nil
 	}
 
-	return provider
+	return provider.ResourceDefs()
 }

pkg/modules/authdomain/implauthdomain/handler.go

@@ -5,11 +5,11 @@ import (
 	"net/http"
 	"time"
 
+	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/modules/authdomain"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
 )
@@ -32,8 +32,8 @@ func (handler *handler) Create(rw http.ResponseWriter, req *http.Request) {
 		return
 	}
 
-	body, err := coretypes.BodyFromContext[authtypes.PostableAuthDomain](req.Context())
-	if err != nil {
+	body := new(authtypes.PostableAuthDomain)
+	if err := binding.JSON.BindBody(req.Body, body); err != nil {
 		render.Error(rw, err)
 		return
 	}
@@ -142,8 +142,8 @@ func (handler *handler) Update(rw http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	body, err := coretypes.BodyFromContext[authtypes.UpdatableAuthDomain](r.Context())
-	if err != nil {
+	body := new(authtypes.UpdatableAuthDomain)
+	if err := binding.JSON.BindBody(r.Body, body); err != nil {
 		render.Error(rw, err)
 		return
 	}

pkg/modules/cloudintegration/config.go

@@ -22,7 +22,7 @@ func newConfig() factory.Config {
 		Agent: AgentConfig{
 			// we will maintain the latest version of cloud integration agent from here,
 			// till we automate it externally or figure out a way to validate it.
-			Version: "v0.0.14",
+			Version: "v0.0.15",
 		},
 	}
 }

pkg/modules/cloudintegration/implcloudintegration/handler.go

@@ -10,7 +10,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/modules/cloudintegration"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/types/cloudintegrationtypes"
-	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
 )
@@ -468,8 +467,8 @@ func (handler *handler) AgentCheckIn(rw http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	req, err := coretypes.BodyFromContext[cloudintegrationtypes.PostableAgentCheckIn](r.Context())
-	if err != nil {
+	req := new(cloudintegrationtypes.PostableAgentCheckIn)
+	if err := binding.JSON.BindBody(r.Body, req); err != nil {
 		render.Error(rw, err)
 		return
 	}

pkg/modules/cloudintegration/implcloudintegration/store.go

@@ -134,6 +134,24 @@ func (store *store) UpdateAccount(ctx context.Context, account *cloudintegration
 		BunDBCtx(ctx).
 		NewUpdate().
 		Model(account).
+		Column("config").
+		Column("updated_at").
+		WherePK().
+		Where("org_id = ?", account.OrgID).
+		Where("provider = ?", account.Provider).
+		Exec(ctx)
+
+	return err
+}
+
+func (store *store) UpdateAgentReport(ctx context.Context, account *cloudintegrationtypes.StorableCloudIntegration) error {
+	_, err := store.
+		store.
+		BunDBCtx(ctx).
+		NewUpdate().
+		Model(account).
+		Column("account_id").
+		Column("last_agent_report").
 		WherePK().
 		Where("org_id = ?", account.OrgID).
 		Where("provider = ?", account.Provider).

pkg/modules/serviceaccount/implserviceaccount/handler.go

@@ -8,7 +8,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/modules/serviceaccount"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/types/serviceaccounttypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
@@ -223,8 +222,8 @@ func (handler *handler) CreateServiceAccountRole(rw http.ResponseWriter, r *http
 		return
 	}
 
-	req, err := coretypes.BodyFromContext[serviceaccounttypes.PostableServiceAccountRole](r.Context())
-	if err != nil {
+	req := new(serviceaccounttypes.PostableServiceAccountRole)
+	if err := binding.JSON.BindBody(r.Body, req); err != nil {
 		render.Error(rw, err)
 		return
 	}

pkg/querier/api.go

@@ -14,7 +14,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/types/ctxtypes"
 	"github.com/SigNoz/signoz/pkg/types/instrumentationtypes"
 	qbtypes "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
@@ -53,8 +52,8 @@ func (handler *handler) QueryRange(rw http.ResponseWriter, req *http.Request) {
 		return
 	}
 
-	queryRangeRequest, err := coretypes.BodyFromContext[qbtypes.QueryRangeRequest](req.Context())
-	if err != nil {
+	var queryRangeRequest qbtypes.QueryRangeRequest
+	if err := binding.JSON.BindBody(req.Body, &queryRangeRequest); err != nil {
 		render.Error(rw, err)
 		return
 	}
@@ -71,7 +70,7 @@ func (handler *handler) QueryRange(rw http.ResponseWriter, req *http.Request) {
 		return
 	}
 
-	queryRangeResponse, err := handler.querier.QueryRange(ctx, orgID, queryRangeRequest)
+	queryRangeResponse, err := handler.querier.QueryRange(ctx, orgID, &queryRangeRequest)
 	if err != nil {
 		render.Error(rw, err)
 		return
@@ -97,8 +96,8 @@ func (handler *handler) QueryRangePreview(rw http.ResponseWriter, req *http.Requ
 		return
 	}
 
-	queryRangeRequest, err := coretypes.BodyFromContext[qbtypes.QueryRangeRequest](req.Context())
-	if err != nil {
+	var queryRangeRequest qbtypes.QueryRangeRequest
+	if err := json.NewDecoder(req.Body).Decode(&queryRangeRequest); err != nil {
 		render.Error(rw, err)
 		return
 	}
@@ -119,7 +118,7 @@ func (handler *handler) QueryRangePreview(rw http.ResponseWriter, req *http.Requ
 		return
 	}
 
-	preview, err := handler.querier.QueryRangePreview(ctx, orgID, queryRangeRequest, previewOpts)
+	preview, err := handler.querier.QueryRangePreview(ctx, orgID, &queryRangeRequest, previewOpts)
 	if err != nil {
 		render.Error(rw, err)
 		return

pkg/querybuilder/query_range_resources.go

@@ -2,6 +2,7 @@ package querybuilder
 
 import (
 	"context"
+	"encoding/json"
 	"strings"
 
 	"github.com/SigNoz/signoz/pkg/errors"
@@ -9,6 +10,7 @@ import (
 	qbtypes "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
 	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
+	"github.com/tidwall/gjson"
 )
 
 func TelemetrySelector(_ context.Context, resource coretypes.Resource, id string, _ valuer.UUID) ([]coretypes.Selector, error) {
@@ -27,19 +29,20 @@ func TelemetrySelector(_ context.Context, resource coretypes.Resource, id string
 }
 
 func QueryRangeResources(ec coretypes.ExtractorContext) ([]coretypes.ResourceWithID, error) {
-	req, err := coretypes.BodyAs[qbtypes.QueryRangeRequest](ec)
+	queries := gjson.GetBytes(ec.RequestBody, "compositeQuery.queries")
+	if !queries.IsArray() || len(queries.Array()) == 0 {
+		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "atleast one query is required")
+	}
+
+	variables, err := queryRangeVariables(ec.RequestBody)
 	if err != nil {
 		return nil, err
 	}
 
-	if len(req.CompositeQuery.Queries) == 0 {
-		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "atleast one query is required")
-	}
-
-	refs := make([]coretypes.ResourceWithID, 0, len(req.CompositeQuery.Queries))
+	refs := make([]coretypes.ResourceWithID, 0, len(queries.Array()))
 	seen := make(map[string]struct{})
-	for _, query := range req.CompositeQuery.Queries {
-		queryRefs, err := resourcesForQuery(query, req.Variables)
+	for _, query := range queries.Array() {
+		queryRefs, err := resourcesForQuery(query, variables)
 		if err != nil {
 			return nil, err
 		}
@@ -57,6 +60,21 @@ func QueryRangeResources(ec coretypes.ExtractorContext) ([]coretypes.ResourceWit
 	return refs, nil
 }
 
+func queryRangeVariables(body []byte) (map[string]qbtypes.VariableItem, error) {
+	variables := make(map[string]qbtypes.VariableItem)
+
+	raw := gjson.GetBytes(body, "variables")
+	if !raw.Exists() {
+		return variables, nil
+	}
+
+	if err := json.Unmarshal([]byte(raw.Raw), &variables); err != nil {
+		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "invalid variables in query range request")
+	}
+
+	return variables, nil
+}
+
 // PromQLResources is the resource set of a bare PromQL query: metrics on
 // the promql wildcard, the same ID resourcesForQuery assigns to a PromQL
 // query inside a composite — one grant covers both entry points.
@@ -67,53 +85,42 @@ func PromQLResources(coretypes.ExtractorContext) ([]coretypes.ResourceWithID, er
 	}}, nil
 }
 
-func resourcesForQuery(query qbtypes.QueryEnvelope, variables map[string]qbtypes.VariableItem) ([]coretypes.ResourceWithID, error) {
-	queryType := query.Type.StringValue()
+func resourcesForQuery(query gjson.Result, variables map[string]qbtypes.VariableItem) ([]coretypes.ResourceWithID, error) {
+	queryType := query.Get("type").String()
 	typeWildcard := queryType + "/" + coretypes.WildCardSelectorString
 
-	switch query.Type {
-	case qbtypes.QueryTypeBuilder, qbtypes.QueryTypeSubQuery:
-		return resourcesForBuilderQuery(queryType, query.Spec, variables)
-	case qbtypes.QueryTypeBuilderAI:
+	switch queryType {
+	case qbtypes.QueryTypeBuilder.StringValue(), qbtypes.QueryTypeSubQuery.StringValue():
+		return resourcesForBuilderQuery(queryType, query.Get("spec"), variables)
+	case qbtypes.QueryTypeBuilderAI.StringValue():
 		// always a traces query; the signal may be absent from the payload
-		_, _, expression, err := builderQuerySpec(query.Spec)
-		if err != nil {
-			return nil, err
-		}
-
-		return builderQueryResourceRefs(queryType, coretypes.ResourceTelemetryResourceTraces, expression, variables)
-	case qbtypes.QueryTypePromQL:
+		return builderQueryResourceRefs(queryType, coretypes.ResourceTelemetryResourceTraces, query.Get("spec"), variables)
+	case qbtypes.QueryTypePromQL.StringValue():
 		return []coretypes.ResourceWithID{{Resource: coretypes.ResourceTelemetryResourceMetrics, ID: typeWildcard}}, nil
-	case qbtypes.QueryTypeClickHouseSQL:
+	case qbtypes.QueryTypeClickHouseSQL.StringValue():
 		return []coretypes.ResourceWithID{
 			{Resource: coretypes.ResourceTelemetryResourceLogs, ID: typeWildcard},
 			{Resource: coretypes.ResourceTelemetryResourceTraces, ID: typeWildcard},
 			{Resource: coretypes.ResourceTelemetryResourceMetrics, ID: typeWildcard},
 			{Resource: coretypes.ResourceTelemetryResourceMeterMetrics, ID: typeWildcard},
 		}, nil
-	case qbtypes.QueryTypeFormula, qbtypes.QueryTypeJoin, qbtypes.QueryTypeTraceOperator:
+	case qbtypes.QueryTypeFormula.StringValue(), qbtypes.QueryTypeJoin.StringValue(), qbtypes.QueryTypeTraceOperator.StringValue():
 		return nil, nil
 	default:
 		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "unsupported query type %q", queryType)
 	}
 }
 
-func resourcesForBuilderQuery(queryType string, spec any, variables map[string]qbtypes.VariableItem) ([]coretypes.ResourceWithID, error) {
-	signal, source, expression, err := builderQuerySpec(spec)
+func resourcesForBuilderQuery(queryType string, spec gjson.Result, variables map[string]qbtypes.VariableItem) ([]coretypes.ResourceWithID, error) {
+	resource, err := builderQueryResource(spec)
 	if err != nil {
 		return nil, err
 	}
-
-	resource, err := builderQueryResource(signal, source)
-	if err != nil {
-		return nil, err
-	}
-
-	return builderQueryResourceRefs(queryType, resource, expression, variables)
+	return builderQueryResourceRefs(queryType, resource, spec, variables)
 }
 
-func builderQueryResourceRefs(queryType string, resource coretypes.Resource, expression string, variables map[string]qbtypes.VariableItem) ([]coretypes.ResourceWithID, error) {
-	ids, err := builderQuerySelectors(queryType, expression, variables)
+func builderQueryResourceRefs(queryType string, resource coretypes.Resource, spec gjson.Result, variables map[string]qbtypes.VariableItem) ([]coretypes.ResourceWithID, error) {
+	ids, err := builderQuerySelectors(queryType, spec.Get("filter.expression").String(), variables)
 	if err != nil {
 		return nil, err
 	}
@@ -126,46 +133,27 @@ func builderQueryResourceRefs(queryType string, resource coretypes.Resource, exp
 	return refs, nil
 }
 
-func builderQueryResource(signal telemetrytypes.Signal, source telemetrytypes.Source) (coretypes.Resource, error) {
-	switch signal {
-	case telemetrytypes.SignalTraces:
+func builderQueryResource(spec gjson.Result) (coretypes.Resource, error) {
+	source := spec.Get("source").String()
+
+	switch spec.Get("signal").String() {
+	case telemetrytypes.SignalTraces.StringValue():
 		return coretypes.ResourceTelemetryResourceTraces, nil
-	case telemetrytypes.SignalLogs:
-		if source == telemetrytypes.SourceAudit {
+	case telemetrytypes.SignalLogs.StringValue():
+		if source == telemetrytypes.SourceAudit.StringValue() {
 			return coretypes.ResourceTelemetryResourceAuditLogs, nil
 		}
 		return coretypes.ResourceTelemetryResourceLogs, nil
-	case telemetrytypes.SignalMetrics:
-		if source == telemetrytypes.SourceMeter {
+	case telemetrytypes.SignalMetrics.StringValue():
+		if source == telemetrytypes.SourceMeter.StringValue() {
 			return coretypes.ResourceTelemetryResourceMeterMetrics, nil
 		}
 		return coretypes.ResourceTelemetryResourceMetrics, nil
 	default:
-		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "unsupported signal %q", signal.StringValue())
+		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "unsupported signal %q", spec.Get("signal").String())
 	}
 }
 
-func builderQuerySpec(spec any) (telemetrytypes.Signal, telemetrytypes.Source, string, error) {
-	switch typed := spec.(type) {
-	case qbtypes.QueryBuilderQuery[qbtypes.TraceAggregation]:
-		return typed.Signal, typed.Source, filterExpression(typed.Filter), nil
-	case qbtypes.QueryBuilderQuery[qbtypes.LogAggregation]:
-		return typed.Signal, typed.Source, filterExpression(typed.Filter), nil
-	case qbtypes.QueryBuilderQuery[qbtypes.MetricAggregation]:
-		return typed.Signal, typed.Source, filterExpression(typed.Filter), nil
-	default:
-		return telemetrytypes.Signal{}, telemetrytypes.Source{}, "", errors.Newf(errors.TypeInternal, errors.CodeInternal, "unexpected builder query spec %T", spec)
-	}
-}
-
-func filterExpression(filter *qbtypes.Filter) string {
-	if filter == nil {
-		return ""
-	}
-
-	return filter.Expression
-}
-
 func builderQuerySelectors(queryType, expression string, variables map[string]qbtypes.VariableItem) ([]string, error) {
 	typeWildcard := queryType + "/" + coretypes.WildCardSelectorString
 

pkg/querybuilder/query_range_resources_test.go

@@ -2,24 +2,14 @@ package querybuilder
 
 import (
 	"context"
-	"strings"
 	"testing"
 
-	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/types/coretypes"
-	qbtypes "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/stretchr/testify/assert"
 	"github.com/stretchr/testify/require"
 )
 
-func queryRangeExtractorContext(t *testing.T, body string) coretypes.ExtractorContext {
-	t.Helper()
-	req := new(qbtypes.QueryRangeRequest)
-	require.NoError(t, binding.JSON.BindBody(strings.NewReader(body), req))
-	return coretypes.ExtractorContext{RequestBody: req}
-}
-
 func builderQueryBody(signal, filterExpression string) string {
 	return `{"compositeQuery":{"queries":[{"type":"builder_query","spec":{"signal":"` + signal + `","filter":{"expression":"` + filterExpression + `"}}}]}}`
 }
@@ -152,13 +142,6 @@ func TestQueryRangeResources(t *testing.T) {
 				{Resource: coretypes.ResourceTelemetryResourceLogs, ID: "builder_query/signoz.workspace.key.id/checkout"},
 			},
 		},
-		{
-			name: "DuplicateSignalKey_LastValueWins",
-			body: `{"compositeQuery":{"queries":[{"type":"builder_query","spec":{"signal":"logs","signal":"traces","filter":{"expression":"signoz.workspace.key.id = 'a'"}}}]}}`,
-			expected: []coretypes.ResourceWithID{
-				{Resource: coretypes.ResourceTelemetryResourceTraces, ID: "builder_query/signoz.workspace.key.id/a"},
-			},
-		},
 		{
 			name: "duplicate queries dedupe",
 			body: `{"compositeQuery":{"queries":[{"type":"builder_query","spec":{"signal":"logs","filter":{"expression":"signoz.workspace.key.id = 'a'"}}},{"type":"builder_query","spec":{"signal":"logs","filter":{"expression":"signoz.workspace.key.id='a'"}}}]}}`,
@@ -170,7 +153,7 @@ func TestQueryRangeResources(t *testing.T) {
 
 	for _, testCase := range testCases {
 		t.Run(testCase.name, func(t *testing.T) {
-			refs, err := QueryRangeResources(queryRangeExtractorContext(t, testCase.body))
+			refs, err := QueryRangeResources(coretypes.ExtractorContext{RequestBody: []byte(testCase.body)})
 			require.NoError(t, err)
 			assert.Equal(t, testCase.expected, refs)
 		})
@@ -182,20 +165,14 @@ func TestQueryRangeResourcesErrors(t *testing.T) {
 		`{"compositeQuery":{"queries":[]}}`,
 		`{}`,
 		builderQueryBody("logs", "signoz.workspace.key.id = "),
+		`{"compositeQuery":{"queries":[{"type":"builder_query","spec":{"signal":"unknown"}}]}}`,
+		`{"compositeQuery":{"queries":[{"type":"unknown_type"}]}}`,
 	}
 
 	for _, body := range bodies {
-		_, err := QueryRangeResources(queryRangeExtractorContext(t, body))
+		_, err := QueryRangeResources(coretypes.ExtractorContext{RequestBody: []byte(body)})
 		assert.Error(t, err, "body %s", body)
 	}
-
-	// rejected by the decode the middleware runs, before any extractor
-	for _, body := range []string{
-		`{"compositeQuery":{"queries":[{"type":"builder_query","spec":{"signal":"unknown"}}]}}`,
-		`{"compositeQuery":{"queries":[{"type":"unknown_type"}]}}`,
-	} {
-		assert.Error(t, binding.JSON.BindBody(strings.NewReader(body), new(qbtypes.QueryRangeRequest)), "body %s", body)
-	}
 }
 
 func TestTelemetrySelector(t *testing.T) {

pkg/types/cloudintegrationtypes/account.go

@@ -3,6 +3,7 @@ package cloudintegrationtypes
 import (
 	"encoding/json"
 	"fmt"
+	"maps"
 	"time"
 
 	"github.com/SigNoz/signoz/pkg/errors"
@@ -26,6 +27,17 @@ type Account struct {
 type AgentReport struct {
 	TimestampMillis int64          `json:"timestampMillis" required:"true"`
 	Data            map[string]any `json:"data" required:"true" nullable:"true"`
+	SyncState       *SyncState     `json:"syncState" required:"true" nullable:"true"`
+}
+
+type SyncState struct {
+	Version int64                       `json:"version" required:"true"`
+	InSync  bool                        `json:"inSync" required:"true"`
+	Regions map[string]*RegionSyncState `json:"regions" required:"true" nullable:"false"`
+}
+
+type RegionSyncState struct {
+	State RegionState `json:"state" required:"true"`
 }
 
 type AccountConfig struct {
@@ -150,6 +162,7 @@ func NewAccountFromStorable(storableAccount *StorableCloudIntegration) (*Account
 		account.AgentReport = &AgentReport{
 			TimestampMillis: storableAccount.LastAgentReport.TimestampMillis,
 			Data:            storableAccount.LastAgentReport.Data,
+			SyncState:       NewSyncStateFromStorable(storableAccount.LastAgentReport.SyncState),
 		}
 	}
 
@@ -308,10 +321,28 @@ func NewAccountConfigFromUpdatable(provider CloudProviderType, config *Updatable
 	}
 }
 
-func NewAgentReport(data map[string]any) *AgentReport {
+func NewAgentReport(data map[string]any, syncState *SyncState) *AgentReport {
 	return &AgentReport{
 		TimestampMillis: time.Now().UnixMilli(),
 		Data:            data,
+		SyncState:       syncState,
+	}
+}
+
+func NewSyncStateFromStorable(storableSyncState *StorableSyncState) *SyncState {
+	if storableSyncState == nil {
+		return nil
+	}
+
+	regions := make(map[string]*RegionSyncState, len(storableSyncState.Regions))
+	for region, regionSyncState := range storableSyncState.Regions {
+		regions[region] = &RegionSyncState{State: regionSyncState.State}
+	}
+
+	return &SyncState{
+		Version: storableSyncState.Version,
+		InSync:  storableSyncState.InSync,
+		Regions: regions,
 	}
 }
 
@@ -335,6 +366,40 @@ func (account *Account) Update(provider CloudProviderType, config *AccountConfig
 	return nil
 }
 
+func (account *Account) UpdateAgentReport(providerAccountID *string, agentReport *AgentReport) {
+	account.ProviderAccountID = providerAccountID
+	account.AgentReport = agentReport
+}
+
+// UpdateSyncState keeps the rest of the agent report, and is a no-op when the agent has never checked in.
+func (account *Account) UpdateSyncState(syncState *SyncState) {
+	if account.AgentReport == nil {
+		return
+	}
+
+	account.AgentReport.SyncState = syncState
+}
+
+// NextSyncState returns the sync state for this check-in, or nil for providers without one.
+func (account *Account) NextSyncState(syncedVersion *int64) *SyncState {
+	if account.Provider != CloudProviderTypeAWS {
+		return nil
+	}
+
+	var previous *SyncState
+	if account.AgentReport != nil {
+		previous = account.AgentReport.SyncState
+	}
+
+	regions := account.Config.AWS.Regions
+	// Removed before the agent ever checked in: no region was sent to it, so there is nothing to clean up.
+	if account.AgentReport == nil && account.RemovedAt != nil {
+		regions = nil
+	}
+
+	return newSyncState(previous, regions, account.RemovedAt != nil, syncedVersion)
+}
+
 func (postableAccount *PostableAccount) UnmarshalJSON(data []byte) error {
 	type Alias PostableAccount
 
@@ -406,3 +471,79 @@ func (config *AccountConfig) ToJSON() ([]byte, error) {
 func NewIngestionKeyName(provider CloudProviderType) string {
 	return fmt.Sprintf("%s-integration", provider.StringValue())
 }
+
+// newSyncState returns the sync state after a check-in without mutating previous.
+func newSyncState(previous *SyncState, regions []string, removed bool, syncedVersion *int64) *SyncState {
+	if previous == nil {
+		previous = newSyncStateFromRegions(regions)
+	}
+
+	next := previous.copy()
+
+	// The agent synced this version, so its disabled regions are cleaned up and can be dropped.
+	if syncedVersion != nil && *syncedVersion == next.Version {
+		next.InSync = true
+		maps.DeleteFunc(next.Regions, func(_ string, regionSyncState *RegionSyncState) bool {
+			return regionSyncState.State == RegionStateDisabled
+		})
+	}
+
+	// Once the integration is removed, every region is disabled.
+	if removed {
+		regions = nil
+	}
+
+	changed := false
+	desiredRegionsMap := make(map[string]struct{}, len(regions))
+
+	for _, region := range regions {
+		desiredRegionsMap[region] = struct{}{}
+
+		if regionSyncState, ok := next.Regions[region]; ok && regionSyncState.State == RegionStateEnabled {
+			continue
+		}
+
+		next.Regions[region] = &RegionSyncState{State: RegionStateEnabled}
+		changed = true
+	}
+
+	for region, regionSyncState := range next.Regions {
+		_, ok := desiredRegionsMap[region]
+		if ok && regionSyncState.State == RegionStateEnabled {
+			continue
+		}
+
+		if !ok && regionSyncState.State == RegionStateDisabled {
+			continue
+		}
+
+		regionSyncState.State = RegionStateDisabled
+		changed = true
+	}
+
+	if changed {
+		next.Version++
+		next.InSync = false
+	}
+
+	return next
+}
+
+// newSyncStateFromRegions is used on the first check-in, when the agent has already deployed regions, so it starts in sync.
+func newSyncStateFromRegions(regions []string) *SyncState {
+	syncState := &SyncState{Version: 1, InSync: true, Regions: make(map[string]*RegionSyncState, len(regions))}
+	for _, region := range regions {
+		syncState.Regions[region] = &RegionSyncState{State: RegionStateEnabled}
+	}
+
+	return syncState
+}
+
+func (syncState *SyncState) copy() *SyncState {
+	regions := make(map[string]*RegionSyncState, len(syncState.Regions))
+	for region, regionSyncState := range syncState.Regions {
+		regions[region] = &RegionSyncState{State: regionSyncState.State}
+	}
+
+	return &SyncState{Version: syncState.Version, InSync: syncState.InSync, Regions: regions}
+}

pkg/types/cloudintegrationtypes/checkin.go

@@ -12,7 +12,8 @@ type AgentCheckInRequest struct {
 	ProviderAccountID  string      `json:"providerAccountId" required:"false"`
 	CloudIntegrationID valuer.UUID `json:"cloudIntegrationId" required:"false"`
 
-	Data map[string]any `json:"data" required:"true" nullable:"true"`
+	Data          map[string]any `json:"data" required:"true" nullable:"true"`
+	SyncedVersion *int64         `json:"syncedVersion" required:"false" nullable:"true"`
 }
 
 type PostableAgentCheckIn struct {
@@ -28,6 +29,7 @@ type AgentCheckInResponse struct {
 	ProviderAccountID  string                     `json:"providerAccountId" required:"true"`
 	IntegrationConfig  *ProviderIntegrationConfig `json:"integrationConfig" required:"true"`
 	RemovedAt          *time.Time                 `json:"removedAt" required:"true" nullable:"true"`
+	SyncState          *SyncState                 `json:"syncState" required:"true" nullable:"true"`
 }
 
 type GettableAgentCheckIn struct {
@@ -73,12 +75,13 @@ func NewGettableAgentCheckIn(provider CloudProviderType, resp *AgentCheckInRespo
 	return gettable
 }
 
-func NewAgentCheckInResponse(providerAccountID, cloudIntegrationID string, integrationConfig *ProviderIntegrationConfig, removedAt *time.Time) *AgentCheckInResponse {
+func NewAgentCheckInResponse(providerAccountID, cloudIntegrationID string, integrationConfig *ProviderIntegrationConfig, removedAt *time.Time, syncState *SyncState) *AgentCheckInResponse {
 	return &AgentCheckInResponse{
 		CloudIntegrationID: cloudIntegrationID,
 		ProviderAccountID:  providerAccountID,
 		IntegrationConfig:  integrationConfig,
 		RemovedAt:          removedAt,
+		SyncState:          syncState,
 	}
 }
 

pkg/types/cloudintegrationtypes/cloudintegration.go

@@ -25,6 +25,17 @@ var (
 	ErrCodeServiceDefinitionNotFound            = errors.MustNewCode("service_definition_not_found")
 )
 
+var (
+	RegionStateEnabled  = RegionState{valuer.NewString("enabled")}
+	RegionStateDisabled = RegionState{valuer.NewString("disabled")}
+)
+
+type RegionState struct{ valuer.String }
+
+func (RegionState) Enum() []any {
+	return []any{RegionStateEnabled, RegionStateDisabled}
+}
+
 // StorableCloudIntegration represents a cloud integration stored in the database.
 // This is also referred as "Account" in the context of cloud integrations.
 type StorableCloudIntegration struct {
@@ -43,8 +54,16 @@ type StorableCloudIntegration struct {
 // StorableAgentReport represents the last heartbeat and arbitrary data sent by the agent
 // as of now there is no use case for Data field, but keeping it for backwards compatibility with older structure.
 type StorableAgentReport struct {
-	TimestampMillis int64          `json:"timestamp_millis"` // backward compatibility
-	Data            map[string]any `json:"data"`
+	TimestampMillis int64              `json:"timestamp_millis"` // backward compatibility
+	Data            map[string]any     `json:"data"`
+	SyncState       *StorableSyncState `json:"sync_state,omitempty"`
+}
+
+// StorableSyncState holds every region sent to the agent. A disabled region is dropped only after the agent acks Version.
+type StorableSyncState struct {
+	Version int64                       `json:"version"`
+	InSync  bool                        `json:"in_sync"`
+	Regions map[string]*RegionSyncState `json:"regions"`
 }
 
 // StorableCloudIntegrationService is to store service config for a cloud integration, which is a cloud provider specific configuration.
@@ -148,12 +167,30 @@ func NewStorableCloudIntegration(account *Account) (*StorableCloudIntegration, e
 		storableAccount.LastAgentReport = &StorableAgentReport{
 			TimestampMillis: account.AgentReport.TimestampMillis,
 			Data:            account.AgentReport.Data,
+			SyncState:       NewStorableSyncState(account.AgentReport.SyncState),
 		}
 	}
 
 	return storableAccount, nil
 }
 
+func NewStorableSyncState(syncState *SyncState) *StorableSyncState {
+	if syncState == nil {
+		return nil
+	}
+
+	regions := make(map[string]*RegionSyncState, len(syncState.Regions))
+	for region, regionSyncState := range syncState.Regions {
+		regions[region] = &RegionSyncState{State: regionSyncState.State}
+	}
+
+	return &StorableSyncState{
+		Version: syncState.Version,
+		InSync:  syncState.InSync,
+		Regions: regions,
+	}
+}
+
 // NewStorableCloudIntegrationService creates a new StorableCloudIntegrationService with
 // generated ID and timestamps from a CloudIntegrationService and its serialized config JSON.
 func NewStorableCloudIntegrationService(svc *CloudIntegrationService, configJSON string) *StorableCloudIntegrationService {
@@ -172,6 +209,7 @@ func (account *StorableCloudIntegration) Update(providerAccountID *string, agent
 		account.LastAgentReport = &StorableAgentReport{
 			TimestampMillis: agentReport.TimestampMillis,
 			Data:            agentReport.Data,
+			SyncState:       NewStorableSyncState(agentReport.SyncState),
 		}
 	}
 }

pkg/types/cloudintegrationtypes/store.go

@@ -25,9 +25,12 @@ type Store interface {
 	// CreateAccount creates a new cloud integration account
 	CreateAccount(ctx context.Context, account *StorableCloudIntegration) error
 
-	// UpdateAccount updates an existing cloud integration account
+	// UpdateAccount updates the user updatable fields (config) of an existing cloud integration account
 	UpdateAccount(ctx context.Context, account *StorableCloudIntegration) error
 
+	// UpdateAgentReport updates the provider account id and last agent report of an existing cloud integration account
+	UpdateAgentReport(ctx context.Context, account *StorableCloudIntegration) error
+
 	// RemoveAccount marks a cloud integration account as removed by setting the RemovedAt field
 	RemoveAccount(ctx context.Context, orgID, id valuer.UUID, provider CloudProviderType) error
 

pkg/types/coretypes/extractor.go

@@ -1,10 +1,8 @@
 package coretypes
 
 import (
-	"context"
 	"net/http"
 
-	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/gorilla/mux"
 	"github.com/tidwall/gjson"
 )
@@ -14,70 +12,24 @@ const (
 	PhaseResponse
 )
 
-var (
-	errCodeExtractorContextNotFound = errors.MustNewCode("extractor_context_not_found")
-	errCodeRequestTypeUndeclared    = errors.MustNewCode("request_type_undeclared")
-	errCodeRequestTypeMismatch      = errors.MustNewCode("request_type_mismatch")
-)
-
 type ExtractPhase int
 
-type extractorContextKey struct{}
-
 // ExtractorContext carries everything an extractor may read: Request + RequestBody
-// are filled pre-handler, ResponseBody post-handler. RequestBody is the body
-// decoded by the resource middleware into the route's declared request type.
+// are filled pre-handler, ResponseBody post-handler.
 type ExtractorContext struct {
 	Request      *http.Request
-	RequestBody  any
+	RequestBody  []byte
 	ResponseBody []byte
 }
 
-func NewContextWithExtractorContext(ctx context.Context, ec ExtractorContext) context.Context {
-	return context.WithValue(ctx, extractorContextKey{}, ec)
-}
-
-func ExtractorContextFromContext(ctx context.Context) (ExtractorContext, error) {
-	ec, ok := ctx.Value(extractorContextKey{}).(ExtractorContext)
-	if !ok {
-		return ExtractorContext{}, errors.New(errors.TypeInternal, errCodeExtractorContextNotFound, "extractor context not found in context")
-	}
-
-	return ec, nil
-}
-
-func BodyAs[T any](ec ExtractorContext) (*T, error) {
-	if ec.RequestBody == nil {
-		return nil, errors.New(errors.TypeInternal, errCodeRequestTypeUndeclared, "route does not declare a request type")
-	}
-
-	typed, ok := ec.RequestBody.(*T)
-	if !ok {
-		return nil, errors.Newf(errors.TypeInternal, errCodeRequestTypeMismatch, "route declares request type %T, expected %T", ec.RequestBody, (*T)(nil))
-	}
-
-	return typed, nil
-}
-
-func BodyFromContext[T any](ctx context.Context) (*T, error) {
-	ec, err := ExtractorContextFromContext(ctx)
-	if err != nil {
-		return nil, err
-	}
-
-	return BodyAs[T](ec)
-}
-
 type ResourceIDExtractor struct {
-	Phase        ExtractPhase
-	RequiresBody bool
-	Fn           func(ExtractorContext) (string, error)
+	Phase ExtractPhase
+	Fn    func(ExtractorContext) (string, error)
 }
 
 type ResourceIDsExtractor struct {
-	Phase        ExtractPhase
-	RequiresBody bool
-	Fn           func(ExtractorContext) ([]string, error)
+	Phase ExtractPhase
+	Fn    func(ExtractorContext) ([]string, error)
 }
 
 func NewResourceIDExtractor(phase ExtractPhase, fn func(ExtractorContext) (string, error)) ResourceIDExtractor {
@@ -98,7 +50,7 @@ func OneID(extractor ResourceIDExtractor) ResourceIDsExtractor {
 		return ResourceIDsExtractor{}
 	}
 
-	return ResourceIDsExtractor{Phase: extractor.Phase, RequiresBody: extractor.RequiresBody, Fn: func(ec ExtractorContext) ([]string, error) {
+	return ResourceIDsExtractor{Phase: extractor.Phase, Fn: func(ec ExtractorContext) ([]string, error) {
 		id, err := extractor.Fn(ec)
 		if err != nil || id == "" {
 			return nil, err
@@ -123,25 +75,26 @@ func PathParam(name string) ResourceIDExtractor {
 	}}
 }
 
-func BodyField[T any](pick func(*T) string) ResourceIDExtractor {
-	return ResourceIDExtractor{Phase: PhaseRequest, RequiresBody: true, Fn: func(ec ExtractorContext) (string, error) {
-		req, err := BodyAs[T](ec)
-		if err != nil {
-			return "", err
-		}
-
-		return pick(req), nil
+func BodyJSONPath(path string) ResourceIDExtractor {
+	return ResourceIDExtractor{Phase: PhaseRequest, Fn: func(ec ExtractorContext) (string, error) {
+		return gjson.GetBytes(ec.RequestBody, path).String(), nil
 	}}
 }
 
-func BodyFields[T any](pick func(*T) []string) ResourceIDsExtractor {
-	return ResourceIDsExtractor{Phase: PhaseRequest, RequiresBody: true, Fn: func(ec ExtractorContext) ([]string, error) {
-		req, err := BodyAs[T](ec)
-		if err != nil {
-			return nil, err
+func BodyJSONArray(path string) ResourceIDsExtractor {
+	return ResourceIDsExtractor{Phase: PhaseRequest, Fn: func(ec ExtractorContext) ([]string, error) {
+		result := gjson.GetBytes(ec.RequestBody, path)
+		if !result.Exists() {
+			return nil, nil
 		}
 
-		return pick(req), nil
+		array := result.Array()
+		ids := make([]string, 0, len(array))
+		for _, r := range array {
+			ids = append(ids, r.String())
+		}
+
+		return ids, nil
 	}}
 }
 

pkg/zeus/handler.go

@@ -8,7 +8,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/licensing"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/types/zeustypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 )
@@ -95,8 +94,8 @@ func (h *handler) PutHost(rw http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	req, err := coretypes.BodyFromContext[zeustypes.PostableHost](r.Context())
-	if err != nil {
+	req := new(zeustypes.PostableHost)
+	if err := binding.JSON.BindBody(r.Body, req); err != nil {
 		render.Error(rw, err)
 		return
 	}

tests/fixtures/cloudintegrations.py

@@ -34,6 +34,8 @@ class ProviderAccountSpec:
     expected_config: Callable[[dict], dict]
     # only the suites that exercise updates need to supply it.
     updated_params: dict = field(default_factory=dict)
+    # params -> the agentReport.syncState the API is expected to return after the first check-in.
+    expected_sync_state: Callable[[dict], dict | None] = lambda p: None
     # id shown in parametrized test names; defaults to the provider slug.
     id: str = field(default="")
 
@@ -315,6 +317,7 @@ def simulate_agent_checkin(
     account_id: str,
     cloud_account_id: str,
     data: dict | None = None,
+    synced_version: int | None = None,
 ) -> requests.Response:
     endpoint = f"/api/v1/cloud_integrations/{cloud_provider}/accounts/check_in"
 
@@ -323,6 +326,8 @@ def simulate_agent_checkin(
         "providerAccountId": cloud_account_id,
         "data": data or {},
     }
+    if synced_version is not None:
+        checkin_payload["syncedVersion"] = synced_version
 
     response = requests.post(
         signoz.self.host_configs["8080"].get(endpoint),

tests/integration/tests/cloudintegrations/03_agent_check_in.py

@@ -3,6 +3,7 @@ from collections.abc import Callable
 from http import HTTPStatus
 
 import pytest
+import requests
 
 from fixtures import types
 from fixtures.auth import USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD, add_license
@@ -152,3 +153,230 @@ def test_duplicate_cloud_account_checkins(
     # Second check-in: account2 tries to claim the same provider account ID → 409
     response = simulate_agent_checkin(signoz, admin_token, spec.provider, account2["id"], same_provider_account_id)
     assert response.status_code == HTTPStatus.CONFLICT, f"Expected 409 for duplicate providerAccountId, got {response.status_code}: {response.text}"
+
+
+def test_sync_state_drops_removed_region_after_ack(
+    signoz: types.SigNoz,
+    create_user_admin: types.Operation,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    create_cloud_integration_account: Callable,
+) -> None:
+    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+    account_id = create_cloud_integration_account(admin_token, "aws", regions=["us-east-1", "us-west-2"])["id"]
+    provider_account_id = str(uuid.uuid4())
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+    assert response.status_code == HTTPStatus.OK, response.text
+
+    response = requests.put(
+        signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/aws/accounts/{account_id}"),
+        headers={"Authorization": f"Bearer {admin_token}"},
+        json={"config": {"aws": {"regions": ["us-east-1"]}}},
+        timeout=10,
+    )
+    assert response.status_code == HTTPStatus.NO_CONTENT, response.text
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+    assert response.status_code == HTTPStatus.OK, response.text
+    assert response.json()["data"]["syncState"] == {
+        "version": 2,
+        "inSync": False,
+        "regions": {"us-east-1": {"state": "enabled"}, "us-west-2": {"state": "disabled"}},
+    }, "removed region should be marked disabled and the version bumped"
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id, synced_version=2)
+    assert response.status_code == HTTPStatus.OK, response.text
+    assert response.json()["data"]["syncState"] == {
+        "version": 2,
+        "inSync": True,
+        "regions": {"us-east-1": {"state": "enabled"}},
+    }, "acked removed region should be dropped"
+
+
+def test_sync_state_keeps_removed_region_without_ack(
+    signoz: types.SigNoz,
+    create_user_admin: types.Operation,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    create_cloud_integration_account: Callable,
+) -> None:
+    """The agent failed to clean up or crashed, so it never acks: the removed region stays and the version stays put."""
+    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+    account_id = create_cloud_integration_account(admin_token, "aws", regions=["us-east-1", "us-west-2"])["id"]
+    provider_account_id = str(uuid.uuid4())
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+    assert response.status_code == HTTPStatus.OK, response.text
+
+    response = requests.put(
+        signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/aws/accounts/{account_id}"),
+        headers={"Authorization": f"Bearer {admin_token}"},
+        json={"config": {"aws": {"regions": ["us-east-1"]}}},
+        timeout=10,
+    )
+    assert response.status_code == HTTPStatus.NO_CONTENT, response.text
+
+    for _ in range(3):
+        response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+        assert response.status_code == HTTPStatus.OK, response.text
+        assert response.json()["data"]["syncState"] == {
+            "version": 2,
+            "inSync": False,
+            "regions": {"us-east-1": {"state": "enabled"}, "us-west-2": {"state": "disabled"}},
+        }, "unacked removed region should stay without bumping the version"
+
+
+@pytest.mark.parametrize("synced_version", [2, 9], ids=["stale", "ahead"])
+def test_sync_state_ignores_mismatched_ack(
+    signoz: types.SigNoz,
+    create_user_admin: types.Operation,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    create_cloud_integration_account: Callable,
+    synced_version: int,
+) -> None:
+    """An ack for any version other than the current one (v3) is ignored,
+    so us-west-2, removed at v2 and still unacked, is not dropped.
+    """
+    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+    account_id = create_cloud_integration_account(admin_token, "aws", regions=["us-east-1", "us-west-2"])["id"]
+    provider_account_id = str(uuid.uuid4())
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+    assert response.status_code == HTTPStatus.OK, response.text
+
+    for regions in (["us-east-1"], ["us-east-1", "eu-west-1"]):
+        response = requests.put(
+            signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/aws/accounts/{account_id}"),
+            headers={"Authorization": f"Bearer {admin_token}"},
+            json={"config": {"aws": {"regions": regions}}},
+            timeout=10,
+        )
+        assert response.status_code == HTTPStatus.NO_CONTENT, response.text
+
+        response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+        assert response.status_code == HTTPStatus.OK, response.text
+
+    expected_sync_state = {
+        "version": 3,
+        "inSync": False,
+        "regions": {"us-east-1": {"state": "enabled"}, "us-west-2": {"state": "disabled"}, "eu-west-1": {"state": "enabled"}},
+    }
+    assert response.json()["data"]["syncState"] == expected_sync_state
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id, synced_version=synced_version)
+    assert response.status_code == HTTPStatus.OK, response.text
+    assert response.json()["data"]["syncState"] == expected_sync_state, "an ack for another version should be ignored"
+
+
+def test_sync_state_applies_ack_before_config_change(
+    signoz: types.SigNoz,
+    create_user_admin: types.Operation,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    create_cloud_integration_account: Callable,
+) -> None:
+    """The user changes regions while the agent syncs: the ack for the version it synced still lands."""
+    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+    account_id = create_cloud_integration_account(admin_token, "aws", regions=["us-east-1", "us-west-2"])["id"]
+    provider_account_id = str(uuid.uuid4())
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+    assert response.status_code == HTTPStatus.OK, response.text
+
+    for regions, synced_version in ((["us-east-1"], None), (["us-east-1", "eu-west-1"], 2)):
+        response = requests.put(
+            signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/aws/accounts/{account_id}"),
+            headers={"Authorization": f"Bearer {admin_token}"},
+            json={"config": {"aws": {"regions": regions}}},
+            timeout=10,
+        )
+        assert response.status_code == HTTPStatus.NO_CONTENT, response.text
+
+        response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id, synced_version=synced_version)
+        assert response.status_code == HTTPStatus.OK, response.text
+
+    assert response.json()["data"]["syncState"] == {
+        "version": 3,
+        "inSync": False,
+        "regions": {"us-east-1": {"state": "enabled"}, "eu-west-1": {"state": "enabled"}},
+    }, "ack should drop the removed region before the new region bumps the version"
+
+
+@pytest.mark.parametrize("synced_version", [1, None], ids=["agent_acks_synced_version", "agent_crashed"])
+def test_sync_state_region_removed_during_sync(
+    signoz: types.SigNoz,
+    create_user_admin: types.Operation,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    create_cloud_integration_account: Callable,
+    synced_version: int | None,
+) -> None:
+    """The user removes a region while the agent syncs v1; whether the agent acks v1 or crashed, the region must not be lost."""
+    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+    account_id = create_cloud_integration_account(admin_token, "aws", regions=["us-east-1", "us-west-2"])["id"]
+    provider_account_id = str(uuid.uuid4())
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+    assert response.status_code == HTTPStatus.OK, response.text
+    assert response.json()["data"]["syncState"] == {
+        "version": 1,
+        "inSync": True,
+        "regions": {"us-east-1": {"state": "enabled"}, "us-west-2": {"state": "enabled"}},
+    }
+
+    response = requests.put(
+        signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/aws/accounts/{account_id}"),
+        headers={"Authorization": f"Bearer {admin_token}"},
+        json={"config": {"aws": {"regions": ["us-east-1"]}}},
+        timeout=10,
+    )
+    assert response.status_code == HTTPStatus.NO_CONTENT, response.text
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id, synced_version=synced_version)
+    assert response.status_code == HTTPStatus.OK, response.text
+    assert response.json()["data"]["syncState"] == {
+        "version": 2,
+        "inSync": False,
+        "regions": {"us-east-1": {"state": "enabled"}, "us-west-2": {"state": "disabled"}},
+    }, "region removed mid-sync should be marked disabled"
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id, synced_version=2)
+    assert response.status_code == HTTPStatus.OK, response.text
+    assert response.json()["data"]["syncState"] == {
+        "version": 2,
+        "inSync": True,
+        "regions": {"us-east-1": {"state": "enabled"}},
+    }
+
+
+def test_sync_state_after_disconnect(
+    signoz: types.SigNoz,
+    create_user_admin: types.Operation,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    create_cloud_integration_account: Callable,
+) -> None:
+    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+    account_id = create_cloud_integration_account(admin_token, "aws", regions=["us-east-1", "us-west-2"])["id"]
+    provider_account_id = str(uuid.uuid4())
+
+    response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+    assert response.status_code == HTTPStatus.OK, response.text
+
+    response = requests.delete(
+        signoz.self.host_configs["8080"].get(f"/api/v1/cloud_integrations/aws/accounts/{account_id}"),
+        headers={"Authorization": f"Bearer {admin_token}"},
+        timeout=10,
+    )
+    assert response.status_code == HTTPStatus.NO_CONTENT, response.text
+
+    for _ in range(2):
+        response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id)
+        assert response.status_code == HTTPStatus.OK, response.text
+        assert response.json()["data"]["removedAt"] is not None, "removedAt should be set after disconnect"
+        assert response.json()["data"]["syncState"] == {
+            "version": 2,
+            "inSync": False,
+            "regions": {"us-east-1": {"state": "disabled"}, "us-west-2": {"state": "disabled"}},
+        }, "every region should be disabled once, without bumping the version on later check-ins"
+
+    for _ in range(2):
+        response = simulate_agent_checkin(signoz, admin_token, "aws", account_id, provider_account_id, synced_version=2)
+        assert response.status_code == HTTPStatus.OK, response.text
+        assert response.json()["data"]["syncState"] == {"version": 2, "inSync": True, "regions": {}}, "acked removal should leave no regions"

tests/integration/tests/cloudintegrations/04_accounts.py

@@ -21,6 +21,11 @@ AWS_ACCOUNT_SPEC = ProviderAccountSpec(
     updated_params={"deployment_region": "us-east-1", "regions": ["us-east-1", "us-west-2", "eu-west-1"]},
     build_config=lambda p: {"aws": {"deploymentRegion": p["deployment_region"], "regions": p["regions"]}},
     expected_config=lambda p: {"regions": p["regions"]},
+    expected_sync_state=lambda p: {
+        "version": 1,
+        "inSync": True,
+        "regions": {region: {"state": "enabled"} for region in p["regions"]},
+    },
 )
 
 GCP_ACCOUNT_SPEC = ProviderAccountSpec(
@@ -128,6 +133,7 @@ def test_list_accounts_after_checkin(
     assert found["providerAccountId"] == provider_account_id, "providerAccountId should match"
     assert found["config"][spec.provider] == spec.expected_config(spec.initial_params), "config should match account config"
     assert found["agentReport"] is not None, "agentReport should be present after check-in"
+    assert found["agentReport"]["syncState"] == spec.expected_sync_state(spec.initial_params), "syncState should be seeded from the account regions on first check-in"
     assert found["removedAt"] is None, "removedAt should be null for a live account"
 
 
@@ -282,6 +288,7 @@ def test_update_account_after_checkin_preserves_connected_status(
     assert found_after is not None, "Account must still be listed after config update (account_id should not be reset)"
     assert found_after["providerAccountId"] == provider_account_id, "providerAccountId should be preserved after update"
     assert found_after["agentReport"] is not None, "agentReport should be preserved after update"
+    assert found_after["agentReport"]["syncState"] == found_before["agentReport"]["syncState"], "config update must not change syncState"
     assert found_after["config"][spec.provider] == spec.expected_config(spec.updated_params), "Config should reflect the update"
     assert found_after["removedAt"] is None, "removedAt should still be null"
 

tests/integration/tests/querierauthz/03_query_types.py

@@ -2,8 +2,6 @@ from collections.abc import Callable
 from datetime import UTC, datetime, timedelta
 from http import HTTPStatus
 
-import requests
-
 from fixtures import querier, types
 from fixtures.auth import USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD, change_user_role, create_active_user
 from fixtures.querier import make_query_request
@@ -152,27 +150,3 @@ def test_managed_viewer_meter_and_clickhouse_allowed_audit_denied(
     # audit-logs builder queries remain admin-only.
     audit = make_query_request(signoz, token, start, end, audit_query, request_type=querier.RequestType.RAW)
     assert audit.status_code == HTTPStatus.FORBIDDEN, audit.text
-
-
-def test_duplicate_signal_key_is_checked_on_the_bound_value(
-    signoz: types.SigNoz,
-    get_token: Callable[[str, str], str],
-) -> None:
-    now = datetime.now(tz=UTC)
-    start, end = int((now - timedelta(hours=1)).timestamp() * 1000), int(now.timestamp() * 1000)
-
-    # raw string: json= would collapse the duplicate "signal" key
-    body = (
-        f'{{"schemaVersion":"v1","start":{start},"end":{end},"requestType":"scalar",'
-        '"compositeQuery":{"queries":[{"type":"builder_query","spec":{"name":"A","signal":"traces","signal":"logs",'
-        '"disabled":false,"filter":{"expression":"signoz.workspace.key.id = \'key-a\'"},'
-        '"aggregations":[{"expression":"count()"}]}}]},"noCache":true}'
-    )
-
-    response = requests.post(
-        signoz.self.host_configs["8080"].get("/api/v5/query_range"),
-        timeout=querier.QUERY_TIMEOUT,
-        headers={"authorization": f"Bearer {get_token(key_a_email, user_password)}", "content-type": "application/json"},
-        data=body,
-    )
-    assert response.status_code == HTTPStatus.FORBIDDEN, response.text

tests/integration/tests/serviceaccount/06_fga.py

@@ -246,15 +246,6 @@ def test_attach_detach_dual_scoped(
     )
     assert resp.status_code == HTTPStatus.FORBIDDEN, f"assign viewer to target: expected 403, got {resp.status_code}: {resp.text}"
 
-    # duplicate roleId: the server binds the last one (viewer) -> forbidden. Raw string, json= would collapse the key.
-    resp = requests.post(
-        signoz.self.host_configs["8080"].get("/api/v1/service_account_roles"),
-        data=f'{{"serviceAccountId": "{target_id}", "roleId": "{editor_role_id}", "roleId": "{viewer_role_id}"}}',
-        headers={"Authorization": f"Bearer {token}", "Content-Type": "application/json"},
-        timeout=5,
-    )
-    assert resp.status_code == HTTPStatus.FORBIDDEN, f"assign duplicate roleId to target: expected 403, got {resp.status_code}: {resp.text}"
-
     # Both SA-detach (target id) and role-detach (editor) present -> remove allowed.
     resp = requests.delete(
         signoz.self.host_configs["8080"].get(f"/api/v1/service_account_roles/{editor_entry_id}"),