feat: old bug stop propogating to parent on settings click

* fix: first query variable without all

* chore: resolve self comments

* chore: added tests for getOptions logic

.github/workflows/generate-permissions-type.yml

@@ -1,50 +0,0 @@
-name: Check Permissions Type Generation
-
-on:
-  pull_request:
-    branches:
-      - main
-    paths:
-      - "pkg/authz/**"
-      - "pkg/types/authtypes/**"
-      - "pkg/types/roletypes/**"
-      - "cmd/**/Dockerfile*"
-
-jobs:
-  check-permissions-type-generation:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-
-      - name: Set up Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: "18"
-          cache: "npm"
-          cache-dependency-path: frontend/package-lock.json
-
-      - name: Install frontend dependencies
-        run: |
-          cd frontend
-          npm ci
-
-      - name: Set up Docker Buildx
-        uses: docker/setup-buildx-action@v3
-
-      - name: Install Go
-        uses: actions/setup-go@v5
-        with:
-          go-version: "1.24"
-
-      - name: Generate permissions.type.ts
-        run: |
-          node frontend/scripts/generate-permissions-type.js
-
-      - name: Check for changes
-        if: github.event_name == 'pull_request'
-        run: |
-          if ! git diff --exit-code frontend/src/hooks/useAuthZ/permissions.type.ts; then
-            echo "::error::frontend/src/hooks/useAuthZ/permissions.type.ts is out of date. Please run the generator locally and commit the changes: npm run generate:permissions-type (from the frontend directory)"
-            exit 1
-          fi

deploy/docker-swarm/otel-collector-config.yaml

@@ -82,6 +82,12 @@ exporters:
     timeout: 45s
     sending_queue:
       enabled: false
+  metadataexporter:
+    cache:
+      provider: in_memory
+    dsn: tcp://clickhouse:9000/signoz_metadata
+    enabled: true
+    timeout: 45s
 service:
   telemetry:
     logs:
@@ -93,19 +99,19 @@ service:
     traces:
       receivers: [otlp]
       processors: [signozspanmetrics/delta, batch]
-      exporters: [clickhousetraces, signozmeter]
+      exporters: [clickhousetraces, metadataexporter, signozmeter]
     metrics:
       receivers: [otlp]
       processors: [batch]
-      exporters: [signozclickhousemetrics, signozmeter]
+      exporters: [signozclickhousemetrics, metadataexporter, signozmeter]
     metrics/prometheus:
       receivers: [prometheus]
       processors: [batch]
-      exporters: [signozclickhousemetrics, signozmeter]
+      exporters: [signozclickhousemetrics, metadataexporter, signozmeter]
     logs:
       receivers: [otlp]
       processors: [batch]
-      exporters: [clickhouselogsexporter, signozmeter]
+      exporters: [clickhouselogsexporter, metadataexporter, signozmeter]
     metrics/meter:
       receivers: [signozmeter]
       processors: [batch/meter]

deploy/docker/otel-collector-config.yaml

@@ -82,6 +82,12 @@ exporters:
     timeout: 45s
     sending_queue:
       enabled: false
+  metadataexporter:
+    cache:
+      provider: in_memory
+    dsn: tcp://clickhouse:9000/signoz_metadata
+    enabled: true
+    timeout: 45s
 service:
   telemetry:
     logs:
@@ -93,19 +99,19 @@ service:
     traces:
       receivers: [otlp]
       processors: [signozspanmetrics/delta, batch]
-      exporters: [clickhousetraces, signozmeter]
+      exporters: [clickhousetraces, metadataexporter, signozmeter]
     metrics:
       receivers: [otlp]
       processors: [batch]
-      exporters: [signozclickhousemetrics, signozmeter]
+      exporters: [signozclickhousemetrics, metadataexporter, signozmeter]
     metrics/prometheus:
       receivers: [prometheus]
       processors: [batch]
-      exporters: [signozclickhousemetrics, signozmeter]
+      exporters: [signozclickhousemetrics, metadataexporter, signozmeter]
     logs:
       receivers: [otlp]
       processors: [batch]
-      exporters: [clickhouselogsexporter, signozmeter]
+      exporters: [clickhouselogsexporter, metadataexporter, signozmeter]
     metrics/meter:
       receivers: [signozmeter]
       processors: [batch/meter]

frontend/.eslintrc.js

@@ -2,11 +2,7 @@
  * ESLint Configuration for SigNoz Frontend
  */
 module.exports = {
-	ignorePatterns: [
-		'src/parser/*.ts',
-		'scripts/update-registry.js',
-		'scripts/generate-permissions-type.js',
-	],
+	ignorePatterns: ['src/parser/*.ts', 'scripts/update-registry.js'],
 	env: {
 		browser: true,
 		es2021: true,

frontend/package.json

@@ -19,8 +19,7 @@
 		"commitlint": "commitlint --edit $1",
 		"test": "jest",
 		"test:changedsince": "jest --changedSince=main --coverage --silent",
-		"generate:api": "orval --config ./orval.config.ts && sh scripts/post-types-generation.sh",
-		"generate:permissions-type": "node scripts/generate-permissions-type.js"
+		"generate:api": "orval --config ./orval.config.ts && sh scripts/post-types-generation.sh"
 	},
 	"engines": {
 		"node": ">=16.15.0"

frontend/scripts/generate-permissions-type.js

@@ -1,279 +0,0 @@
-#!/usr/bin/env node
-
-const fs = require('fs');
-const path = require('path');
-const { execSync } = require('child_process');
-const axios = require('axios');
-
-const PERMISSIONS_TYPE_FILE = path.join(
-	__dirname,
-	'../src/hooks/useAuthZ/permissions.type.ts',
-);
-
-const DOCKER_IMAGE_NAME = 'signoz-enterprise-permissions-gen';
-const DOCKER_CONTAINER_NAME = 'signoz-permissions-gen';
-const CLICKHOUSE_COMPOSE_DIR = '.devenv/docker/clickhouse';
-const CLICKHOUSE_COMPOSE_FILE = 'compose.yaml';
-const BACKEND_PORT = 18080;
-const BACKEND_URL = `http://localhost:${BACKEND_PORT}`;
-
-const TARGETARCH = process.arch === 'x64' ? 'amd64' : process.arch;
-
-function log(message) {
-	console.log(`[generate-permissions-type] ${message}`);
-}
-
-function exec(command, options = {}) {
-	log(`Executing: ${command}`);
-	try {
-		return execSync(command, {
-			stdio: 'inherit',
-			...options,
-		});
-	} catch (error) {
-		log(`Error executing command: ${command}`);
-		throw error;
-	}
-}
-
-async function waitForBackend(maxAttempts = 60, delayMs = 2000) {
-	for (let attempt = 1; attempt <= maxAttempts; attempt++) {
-		try {
-			await axios.get(`${BACKEND_URL}/api/v1/health`, {
-				timeout: 5000,
-				validateStatus: (status) => status === 200,
-			});
-			log('Backend is ready');
-			return;
-		} catch (err) {
-			if (attempt < maxAttempts) {
-				log(`Waiting for backend... (attempt ${attempt}/${maxAttempts})`);
-				await new Promise((r) => setTimeout(r, delayMs));
-			} else {
-				throw new Error(
-					`Backend did not become ready after ${maxAttempts} attempts: ${err.message}`,
-				);
-			}
-		}
-	}
-}
-
-function waitForClickHouse(maxAttempts = 30, delayMs = 2000) {
-	for (let attempt = 1; attempt <= maxAttempts; attempt++) {
-		try {
-			const status = execSync(
-				`docker inspect clickhouse --format '{{.State.Health.Status}}'`,
-				{ encoding: 'utf8' },
-			).trim();
-			if (status === 'healthy') {
-				log('ClickHouse is healthy');
-				return;
-			}
-		} catch (e) {}
-		if (attempt < maxAttempts) {
-			log(`Waiting for ClickHouse... (${attempt}/${maxAttempts})`);
-			execSync(`sleep ${delayMs / 1000}`);
-		} else {
-			throw new Error('ClickHouse did not become healthy');
-		}
-	}
-}
-
-async function fetchResources() {
-	log('Fetching resources from API...');
-	const resourcesUrl = `${BACKEND_URL}/api/v1/authz/resources`;
-
-	const { data: response } = await axios.get(resourcesUrl);
-
-	return response;
-}
-
-function transformResponse(apiResponse) {
-	if (!apiResponse.data) {
-		throw new Error('Invalid API response: missing data field');
-	}
-
-	const { resources, relations } = apiResponse.data;
-
-	const transformedResources = (resources || []).map((resource) => {
-		let name = '';
-		if (typeof resource.name === 'string') {
-			name = resource.name;
-		} else if (resource.name && typeof resource.name === 'object') {
-			if (resource.name.value) {
-				name = resource.name.value;
-			} else {
-				const values = Object.values(resource.name);
-				name = values.length > 0 ? String(values[0]) : '';
-			}
-		}
-
-		if (!name) {
-			throw new Error(
-				`Invalid resource name format: ${JSON.stringify(resource.name)}`,
-			);
-		}
-
-		return {
-			name,
-			type: resource.type,
-		};
-	});
-
-	const transformedRelations = {};
-	if (relations) {
-		for (const [type, relationList] of Object.entries(relations)) {
-			if (Array.isArray(relationList)) {
-				transformedRelations[type] = relationList.map((r) => {
-					if (typeof r === 'string') {
-						return r;
-					}
-					if (r && typeof r === 'object' && r.value) {
-						return r.value;
-					}
-					return String(r);
-				});
-			}
-		}
-	}
-
-	return {
-		status: apiResponse.status || 'success',
-		data: {
-			resources: transformedResources,
-			relations: transformedRelations,
-		},
-	};
-}
-
-function generateTypeScriptFile(data) {
-	const resourcesStr = data.data.resources
-		.map(
-			(r) =>
-				`\t\t\t{\n\t\t\t\tname: '${r.name}',\n\t\t\t\ttype: '${r.type}',\n\t\t\t}`,
-		)
-		.join(',\n');
-
-	const relationsStr = Object.entries(data.data.relations)
-		.map(
-			([type, relations]) =>
-				`\t\t\t${type}: [${relations.map((r) => `'${r}'`).join(', ')}]`,
-		)
-		.join(',\n');
-
-	return `// AUTO GENERATED FILE - DO NOT EDIT - GENERATED BY scripts/generate-permissions-type\nexport default {
-\tstatus: '${data.status}',
-\tdata: {
-\t\tresources: [
-${resourcesStr}
-\t\t],
-\t\trelations: {
-${relationsStr}
-\t\t},
-\t},
-} as const;
-`;
-}
-
-async function main() {
-	try {
-		log('Starting permissions type generation...');
-
-		const rootDir = path.join(__dirname, '../..');
-		process.chdir(rootDir);
-
-		log('Building Go binary (linux, static for Alpine)...');
-		exec(`make go-build-enterprise-${TARGETARCH} OS=linux`, {
-			cwd: rootDir,
-			env: { ...process.env, CGO_ENABLED: '0' },
-		});
-
-		log('Building frontend...');
-		exec('make js-build', { cwd: rootDir });
-
-		log('Building Docker image...');
-		exec(
-			`docker build -t ${DOCKER_IMAGE_NAME} -f cmd/enterprise/Dockerfile --build-arg TARGETARCH=${TARGETARCH} .`,
-			{ cwd: rootDir },
-		);
-
-		log('Starting ClickHouse (compose)...');
-		exec(`docker compose -f ${CLICKHOUSE_COMPOSE_FILE} up -d`, {
-			cwd: path.join(rootDir, CLICKHOUSE_COMPOSE_DIR),
-		});
-		waitForClickHouse();
-
-		log('Stopping existing container if any...');
-		try {
-			exec(`docker stop ${DOCKER_CONTAINER_NAME}`, { stdio: 'pipe' });
-			exec(`docker rm ${DOCKER_CONTAINER_NAME}`, { stdio: 'pipe' });
-		} catch (error) {}
-
-		log('Starting Docker container...');
-		exec(
-			`docker run -d -p ${BACKEND_PORT}:8080 --add-host=host.docker.internal:host-gateway --name ${DOCKER_CONTAINER_NAME}` +
-				` -e SIGNOZ_SQLSTORE_SQLITE_PATH=/tmp/signoz.db` +
-				` -e SIGNOZ_WEB_ENABLED=false` +
-				` -e SIGNOZ_TELEMETRYSTORE_PROVIDER=clickhouse` +
-				` -e SIGNOZ_TELEMETRYSTORE_CLICKHOUSE_DSN=tcp://host.docker.internal:9000` +
-				` -e SIGNOZ_TELEMETRYSTORE_CLICKHOUSE_CLUSTER=cluster` +
-				` -e SIGNOZ_ALERTMANAGER_PROVIDER=signoz` +
-				` ${DOCKER_IMAGE_NAME}`,
-			{ cwd: rootDir },
-		);
-
-		try {
-			log('Waiting for backend to be ready...');
-			await waitForBackend();
-
-			log('Fetching resources...');
-			const apiResponse = await fetchResources();
-
-			log('Transforming response...');
-			const transformed = transformResponse(apiResponse);
-
-			log('Generating TypeScript file...');
-			const content = generateTypeScriptFile(transformed);
-
-			log(`Writing to ${PERMISSIONS_TYPE_FILE}...`);
-			fs.writeFileSync(PERMISSIONS_TYPE_FILE, content, 'utf8');
-
-			const relativePath = path.relative(
-				path.join(rootDir, 'frontend'),
-				PERMISSIONS_TYPE_FILE,
-			);
-			log('Linting generated file...');
-			exec(`cd frontend && yarn eslint --fix ${relativePath}`, {
-				cwd: rootDir,
-			});
-
-			log('Successfully generated permissions.type.ts');
-		} finally {
-			log('Cleaning up Docker container...');
-			try {
-				exec(`docker stop ${DOCKER_CONTAINER_NAME}`, { stdio: 'pipe' });
-				exec(`docker rm ${DOCKER_CONTAINER_NAME}`, { stdio: 'pipe' });
-			} catch (error) {
-				log(`Warning: Failed to cleanup container: ${error.message}`);
-			}
-			log('Stopping ClickHouse stack...');
-			try {
-				exec(`docker compose -f ${CLICKHOUSE_COMPOSE_FILE} down`, {
-					cwd: path.join(rootDir, CLICKHOUSE_COMPOSE_DIR),
-					stdio: 'pipe',
-				});
-			} catch (error) {
-				log(`Warning: Failed to stop ClickHouse: ${error.message}`);
-			}
-		}
-	} catch (error) {
-		log(`Error: ${error.message}`);
-		process.exit(1);
-	}
-}
-
-if (require.main === module) {
-	main();
-}
-
-module.exports = { main };

frontend/src/components/GuardAuthZ/GuardAuthZ.test.tsx

@@ -1,320 +0,0 @@
-import { ReactElement } from 'react-markdown/lib/react-markdown';
-import {
-	AuthtypesGettableTransactionDTO,
-	AuthtypesTransactionDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { ENVIRONMENT } from 'constants/env';
-import { BrandedPermission, buildPermission } from 'hooks/useAuthZ/utils';
-import { server } from 'mocks-server/server';
-import { rest } from 'msw';
-import { render, screen, waitFor } from 'tests/test-utils';
-
-import { GuardAuthZ } from './GuardAuthZ';
-
-const BASE_URL = ENVIRONMENT.baseURL || '';
-const AUTHZ_CHECK_URL = `${BASE_URL}/api/v1/authz/check`;
-
-function authzMockResponse(
-	payload: AuthtypesTransactionDTO[],
-	authorizedByIndex: boolean[],
-): { data: AuthtypesGettableTransactionDTO[]; status: string } {
-	return {
-		data: payload.map((txn, i) => ({
-			relation: txn.relation,
-			object: txn.object,
-			authorized: authorizedByIndex[i] ?? false,
-		})),
-		status: 'success',
-	};
-}
-
-describe('GuardAuthZ', () => {
-	const TestChild = (): ReactElement => <div>Protected Content</div>;
-	const LoadingFallback = (): ReactElement => <div>Loading...</div>;
-	const ErrorFallback = (error: Error): ReactElement => (
-		<div>Error occurred: {error.message}</div>
-	);
-	const NoPermissionFallback = (_response: {
-		requiredPermissionName: BrandedPermission;
-	}): ReactElement => <div>Access denied</div>;
-	const NoPermissionFallbackWithSuggestions = (response: {
-		requiredPermissionName: BrandedPermission;
-	}): ReactElement => (
-		<div>
-			Access denied. Required permission: {response.requiredPermissionName}
-		</div>
-	);
-
-	it('should render children when permission is granted', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		render(
-			<GuardAuthZ relation="read" object="dashboard:*">
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(screen.getByText('Protected Content')).toBeInTheDocument();
-		});
-	});
-
-	it('should render fallbackOnLoading when loading', () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (_req, res, ctx) => {
-				return res(
-					ctx.delay('infinite'),
-					ctx.status(200),
-					ctx.json({ data: [], status: 'success' }),
-				);
-			}),
-		);
-
-		render(
-			<GuardAuthZ
-				relation="read"
-				object="dashboard:*"
-				fallbackOnLoading={<LoadingFallback />}
-			>
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		expect(screen.getByText('Loading...')).toBeInTheDocument();
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should render null when loading and no fallbackOnLoading provided', () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (_req, res, ctx) => {
-				return res(
-					ctx.delay('infinite'),
-					ctx.status(200),
-					ctx.json({ data: [], status: 'success' }),
-				);
-			}),
-		);
-
-		const { container } = render(
-			<GuardAuthZ relation="read" object="dashboard:*">
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		expect(container.firstChild).toBeNull();
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should render fallbackOnError when API error occurs', async () => {
-		const errorMessage = 'Internal Server Error';
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => {
-				return res(ctx.status(500), ctx.json({ error: errorMessage }));
-			}),
-		);
-
-		render(
-			<GuardAuthZ
-				relation="read"
-				object="dashboard:*"
-				fallbackOnError={ErrorFallback}
-			>
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(screen.getByText(/Error occurred:/)).toBeInTheDocument();
-		});
-
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should pass error object to fallbackOnError function', async () => {
-		const errorMessage = 'Network request failed';
-		let receivedError: Error | null = null;
-
-		const errorFallbackWithCapture = (error: Error): ReactElement => {
-			receivedError = error;
-			return <div>Captured error: {error.message}</div>;
-		};
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => {
-				return res(ctx.status(500), ctx.json({ error: errorMessage }));
-			}),
-		);
-
-		render(
-			<GuardAuthZ
-				relation="read"
-				object="dashboard:*"
-				fallbackOnError={errorFallbackWithCapture}
-			>
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(receivedError).not.toBeNull();
-		});
-
-		expect(receivedError).toBeInstanceOf(Error);
-		expect(screen.getByText(/Captured error:/)).toBeInTheDocument();
-	});
-
-	it('should render null when error occurs and no fallbackOnError provided', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => {
-				return res(ctx.status(500), ctx.json({ error: 'Internal Server Error' }));
-			}),
-		);
-
-		const { container } = render(
-			<GuardAuthZ relation="read" object="dashboard:*">
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(container.firstChild).toBeNull();
-		});
-
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should render fallbackOnNoPermissions when permission is denied', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [false])));
-			}),
-		);
-
-		render(
-			<GuardAuthZ
-				relation="update"
-				object="dashboard:123"
-				fallbackOnNoPermissions={NoPermissionFallback}
-			>
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(screen.getByText('Access denied')).toBeInTheDocument();
-		});
-
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should render null when permission is denied and no fallbackOnNoPermissions provided', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [false])));
-			}),
-		);
-
-		const { container } = render(
-			<GuardAuthZ relation="update" object="dashboard:123">
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(container.firstChild).toBeNull();
-		});
-
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should render null when permissions object is null', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => {
-				return res(ctx.status(200), ctx.json({ data: [], status: 'success' }));
-			}),
-		);
-
-		const { container } = render(
-			<GuardAuthZ relation="read" object="dashboard:*">
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(container.firstChild).toBeNull();
-		});
-
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should pass requiredPermissionName to fallbackOnNoPermissions', async () => {
-		const permission = buildPermission('update', 'dashboard:123');
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [false])));
-			}),
-		);
-
-		render(
-			<GuardAuthZ
-				relation="update"
-				object="dashboard:123"
-				fallbackOnNoPermissions={NoPermissionFallbackWithSuggestions}
-			>
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(
-				screen.getByText(/Access denied. Required permission:/),
-			).toBeInTheDocument();
-		});
-
-		expect(
-			screen.getAllByText(
-				new RegExp(permission.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')),
-			).length,
-		).toBeGreaterThan(0);
-		expect(screen.queryByText('Protected Content')).not.toBeInTheDocument();
-	});
-
-	it('should handle different relation and object combinations', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		const { rerender } = render(
-			<GuardAuthZ relation="read" object="dashboard:*">
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(screen.getByText('Protected Content')).toBeInTheDocument();
-		});
-
-		rerender(
-			<GuardAuthZ relation="delete" object="dashboard:456">
-				<TestChild />
-			</GuardAuthZ>,
-		);
-
-		await waitFor(() => {
-			expect(screen.getByText('Protected Content')).toBeInTheDocument();
-		});
-	});
-});

frontend/src/components/GuardAuthZ/GuardAuthZ.tsx

@@ -1,50 +0,0 @@
-import { ReactElement } from 'react';
-import { useAuthZ } from 'hooks/useAuthZ/useAuthZ';
-import {
-	AuthZObject,
-	AuthZRelation,
-	BrandedPermission,
-	buildPermission,
-} from 'hooks/useAuthZ/utils';
-
-export type GuardAuthZProps<R extends AuthZRelation> = {
-	children: ReactElement;
-	relation: R;
-	object: AuthZObject<R>;
-	fallbackOnLoading?: JSX.Element;
-	fallbackOnError?: (error: Error) => JSX.Element;
-	fallbackOnNoPermissions?: (response: {
-		requiredPermissionName: BrandedPermission;
-	}) => JSX.Element;
-};
-
-export function GuardAuthZ<R extends AuthZRelation>({
-	children,
-	relation,
-	object,
-	fallbackOnLoading,
-	fallbackOnError,
-	fallbackOnNoPermissions,
-}: GuardAuthZProps<R>): JSX.Element | null {
-	const permission = buildPermission<R>(relation, object);
-
-	const { permissions, isLoading, error } = useAuthZ([permission]);
-
-	if (isLoading) {
-		return fallbackOnLoading ?? null;
-	}
-
-	if (error) {
-		return fallbackOnError?.(error) ?? null;
-	}
-
-	if (!permissions?.[permission]?.isGranted) {
-		return (
-			fallbackOnNoPermissions?.({
-				requiredPermissionName: permission,
-			}) ?? null
-		);
-	}
-
-	return children;
-}

frontend/src/components/GuardAuthZ/createGuardedRoute.styles.scss

@@ -1,46 +0,0 @@
-.guard-authz-error-no-authz {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-
-	width: 100%;
-	height: 100%;
-
-	padding: 24px;
-
-	.guard-authz-error-no-authz-content {
-		display: flex;
-		flex-direction: column;
-		justify-content: flex-start;
-		gap: 8px;
-		max-width: 500px;
-	}
-
-	img {
-		width: 32px;
-		height: 32px;
-	}
-
-	h3 {
-		font-size: 18px;
-		color: var(--bg-vanilla-100);
-		line-height: 18px;
-	}
-
-	p {
-		font-size: 14px;
-		color: var(--bg-vanilla-400);
-		line-height: 18px;
-
-		pre {
-			display: flex;
-			align-items: center;
-			background-color: var(--bg-slate-400);
-			cursor: pointer;
-
-			svg {
-				margin-left: 2px;
-			}
-		}
-	}
-}

frontend/src/components/GuardAuthZ/createGuardedRoute.test.tsx

@@ -1,478 +0,0 @@
-import { ReactElement } from 'react';
-import type { RouteComponentProps } from 'react-router-dom';
-import {
-	AuthtypesGettableTransactionDTO,
-	AuthtypesTransactionDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { ENVIRONMENT } from 'constants/env';
-import { buildPermission } from 'hooks/useAuthZ/utils';
-import { server } from 'mocks-server/server';
-import { rest } from 'msw';
-import { render, screen, waitFor } from 'tests/test-utils';
-
-import { createGuardedRoute } from './createGuardedRoute';
-
-const BASE_URL = ENVIRONMENT.baseURL || '';
-const AUTHZ_CHECK_URL = `${BASE_URL}/api/v1/authz/check`;
-
-function authzMockResponse(
-	payload: AuthtypesTransactionDTO[],
-	authorizedByIndex: boolean[],
-): { data: AuthtypesGettableTransactionDTO[]; status: string } {
-	return {
-		data: payload.map((txn, i) => ({
-			relation: txn.relation,
-			object: txn.object,
-			authorized: authorizedByIndex[i] ?? false,
-		})),
-		status: 'success',
-	};
-}
-
-describe('createGuardedRoute', () => {
-	const TestComponent = ({ testProp }: { testProp: string }): ReactElement => (
-		<div>Test Component: {testProp}</div>
-	);
-
-	it('should render component when permission is granted', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'read',
-			'dashboard:*',
-		);
-
-		const mockMatch = {
-			params: {},
-			isExact: true,
-			path: '/dashboard',
-			url: '/dashboard',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('Test Component: test-value')).toBeInTheDocument();
-		});
-	});
-
-	it('should substitute route parameters in object string', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'read',
-			'dashboard:{id}',
-		);
-
-		const mockMatch = {
-			params: { id: '123' },
-			isExact: true,
-			path: '/dashboard/:id',
-			url: '/dashboard/123',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('Test Component: test-value')).toBeInTheDocument();
-		});
-	});
-
-	it('should handle multiple route parameters', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = (await req.json()) as AuthtypesTransactionDTO[];
-				const txn = payload[0];
-				const responseData: AuthtypesGettableTransactionDTO[] = [
-					{
-						relation: txn.relation,
-						object: {
-							resource: {
-								name: txn.object.resource.name,
-								type: txn.object.resource.type,
-							},
-							selector: '123:456',
-						},
-						authorized: true,
-					},
-				];
-				return res(
-					ctx.status(200),
-					ctx.json({ data: responseData, status: 'success' }),
-				);
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'update',
-			'dashboard:{id}:{version}',
-		);
-
-		const mockMatch = {
-			params: { id: '123', version: '456' },
-			isExact: true,
-			path: '/dashboard/:id/:version',
-			url: '/dashboard/123/456',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('Test Component: test-value')).toBeInTheDocument();
-		});
-	});
-
-	it('should keep placeholder when route parameter is missing', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'read',
-			'dashboard:{id}',
-		);
-
-		const mockMatch = {
-			params: {},
-			isExact: true,
-			path: '/dashboard',
-			url: '/dashboard',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('Test Component: test-value')).toBeInTheDocument();
-		});
-	});
-
-	it('should render loading fallback when loading', () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (_req, res, ctx) => {
-				return res(
-					ctx.delay('infinite'),
-					ctx.status(200),
-					ctx.json({ data: [], status: 'success' }),
-				);
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'read',
-			'dashboard:*',
-		);
-
-		const mockMatch = {
-			params: {},
-			isExact: true,
-			path: '/dashboard',
-			url: '/dashboard',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		expect(screen.getByText('SigNoz')).toBeInTheDocument();
-		expect(
-			screen.queryByText('Test Component: test-value'),
-		).not.toBeInTheDocument();
-	});
-
-	it('should render error fallback when API error occurs', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => {
-				return res(ctx.status(500), ctx.json({ error: 'Internal Server Error' }));
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'read',
-			'dashboard:*',
-		);
-
-		const mockMatch = {
-			params: {},
-			isExact: true,
-			path: '/dashboard',
-			url: '/dashboard',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			expect(screen.getByText(/Something went wrong/i)).toBeInTheDocument();
-		});
-
-		expect(
-			screen.queryByText('Test Component: test-value'),
-		).not.toBeInTheDocument();
-	});
-
-	it('should render no permissions fallback when permission is denied', async () => {
-		const permission = buildPermission('update', 'dashboard:123');
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [false])));
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'update',
-			'dashboard:{id}',
-		);
-
-		const mockMatch = {
-			params: { id: '123' },
-			isExact: true,
-			path: '/dashboard/:id',
-			url: '/dashboard/123',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			const heading = document.querySelector('h3');
-			expect(heading).toBeInTheDocument();
-			expect(heading?.textContent).toMatch(/permission to view/i);
-		});
-
-		expect(
-			screen.getAllByText(
-				new RegExp(permission.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')),
-			).length,
-		).toBeGreaterThan(0);
-		expect(
-			screen.queryByText('Test Component: test-value'),
-		).not.toBeInTheDocument();
-	});
-
-	it('should pass all props to wrapped component', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		const ComponentWithMultipleProps = ({
-			prop1,
-			prop2,
-			prop3,
-		}: {
-			prop1: string;
-			prop2: number;
-			prop3: boolean;
-		}): ReactElement => (
-			<div>
-				{prop1} - {prop2} - {prop3.toString()}
-			</div>
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			ComponentWithMultipleProps,
-			'read',
-			'dashboard:*',
-		);
-
-		const mockMatch = {
-			params: {},
-			isExact: true,
-			path: '/dashboard',
-			url: '/dashboard',
-		};
-
-		const props = {
-			prop1: 'value1',
-			prop2: 42,
-			prop3: true,
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('value1 - 42 - true')).toBeInTheDocument();
-		});
-	});
-
-	it('should memoize resolved object based on route params', async () => {
-		let requestCount = 0;
-		const requestedObjects: string[] = [];
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				requestCount++;
-				const payload = (await req.json()) as AuthtypesTransactionDTO[];
-				const obj = payload[0]?.object;
-				const name = obj?.resource?.name;
-				const selector = obj?.selector ?? '*';
-				const objectStr =
-					obj?.resource?.type === 'metaresources' ? name : `${name}:${selector}`;
-				requestedObjects.push(objectStr ?? '');
-
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'read',
-			'dashboard:{id}',
-		);
-
-		const mockMatch1 = {
-			params: { id: '123' },
-			isExact: true,
-			path: '/dashboard/:id',
-			url: '/dashboard/123',
-		};
-
-		const props1 = {
-			testProp: 'test-value-1',
-			match: mockMatch1,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		const { unmount } = render(<GuardedComponent {...props1} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('Test Component: test-value-1')).toBeInTheDocument();
-		});
-
-		expect(requestCount).toBe(1);
-		expect(requestedObjects).toContain('dashboard:123');
-
-		unmount();
-
-		const mockMatch2 = {
-			params: { id: '456' },
-			isExact: true,
-			path: '/dashboard/:id',
-			url: '/dashboard/456',
-		};
-
-		const props2 = {
-			testProp: 'test-value-2',
-			match: mockMatch2,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props2} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('Test Component: test-value-2')).toBeInTheDocument();
-		});
-
-		expect(requestCount).toBe(2);
-		expect(requestedObjects).toContain('dashboard:456');
-	});
-
-	it('should handle different relation types', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-			}),
-		);
-
-		const GuardedComponent = createGuardedRoute(
-			TestComponent,
-			'delete',
-			'dashboard:{id}',
-		);
-
-		const mockMatch = {
-			params: { id: '789' },
-			isExact: true,
-			path: '/dashboard/:id',
-			url: '/dashboard/789',
-		};
-
-		const props = {
-			testProp: 'test-value',
-			match: mockMatch,
-			location: ({} as unknown) as RouteComponentProps['location'],
-			history: ({} as unknown) as RouteComponentProps['history'],
-		};
-
-		render(<GuardedComponent {...props} />);
-
-		await waitFor(() => {
-			expect(screen.getByText('Test Component: test-value')).toBeInTheDocument();
-		});
-	});
-});

frontend/src/components/GuardAuthZ/createGuardedRoute.tsx

@@ -1,79 +0,0 @@
-import { ComponentType, ReactElement, useMemo } from 'react';
-import { RouteComponentProps } from 'react-router-dom';
-import { toast } from '@signozhq/sonner';
-import {
-	AuthZObject,
-	AuthZRelation,
-	BrandedPermission,
-} from 'hooks/useAuthZ/utils';
-import { Copy } from 'lucide-react';
-
-import { useCopyToClipboard } from '../../hooks/useCopyToClipboard';
-import ErrorBoundaryFallback from '../../pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
-import AppLoading from '../AppLoading/AppLoading';
-import { GuardAuthZ } from './GuardAuthZ';
-
-import './createGuardedRoute.styles.scss';
-
-const onErrorFallback = (): JSX.Element => <ErrorBoundaryFallback />;
-
-function OnNoPermissionsFallback(response: {
-	requiredPermissionName: BrandedPermission;
-}): ReactElement {
-	const { copyToClipboard } = useCopyToClipboard();
-	const onClickToCopy = (): void => {
-		copyToClipboard(response.requiredPermissionName, 'required-permission');
-
-		toast.success('Permission copied to clipboard');
-	};
-
-	return (
-		<div className="guard-authz-error-no-authz">
-			<div className="guard-authz-error-no-authz-content">
-				<img src="/Icons/no-data.svg" alt="No permission" />
-				<h3>Uh-oh! You don’t have permission to view this page.</h3>
-				<p>
-					You need the following permission to view this page:
-					<br />
-					<pre onClick={onClickToCopy}>
-						{response.requiredPermissionName} <Copy size={12} />
-					</pre>
-					Ask your SigNoz administrator to grant access.
-				</p>
-			</div>
-		</div>
-	);
-}
-
-// eslint-disable-next-line @typescript-eslint/ban-types
-export function createGuardedRoute<P extends object, R extends AuthZRelation>(
-	Component: ComponentType<P>,
-	relation: R,
-	object: AuthZObject<R>,
-): ComponentType<P & RouteComponentProps<Record<string, string>>> {
-	return function GuardedRouteComponent(
-		props: P & RouteComponentProps<Record<string, string>>,
-	): ReactElement {
-		const resolvedObject = useMemo(() => {
-			const paramPattern = /\{([^}]+)\}/g;
-			return object.replace(paramPattern, (match, paramName) => {
-				const paramValue = props.match?.params?.[paramName];
-				return paramValue !== undefined ? paramValue : match;
-			}) as AuthZObject<R>;
-		}, [props.match?.params]);
-
-		return (
-			<GuardAuthZ
-				relation={relation}
-				object={resolvedObject}
-				fallbackOnLoading={<AppLoading />}
-				fallbackOnError={onErrorFallback}
-				fallbackOnNoPermissions={(response): ReactElement => (
-					<OnNoPermissionsFallback {...response} />
-				)}
-			>
-				<Component {...props} />
-			</GuardAuthZ>
-		);
-	};
-}

frontend/src/components/GuardAuthZ/index.ts

@@ -1,3 +0,0 @@
-export { createGuardedRoute } from './createGuardedRoute';
-export type { GuardAuthZProps } from './GuardAuthZ';
-export { GuardAuthZ } from './GuardAuthZ';

frontend/src/components/LogDetail/index.tsx

@@ -86,8 +86,13 @@ function LogDetailInner({
 		const handleClickOutside = (e: MouseEvent): void => {
 			const target = e.target as HTMLElement;
 
-			// Don't close if clicking on explicitly ignored regions
-			if (target.closest('[data-log-detail-ignore="true"]')) {
+			// Don't close if clicking on drawer content, overlays, or portal elements
+			if (
+				target.closest('[data-log-detail-ignore="true"]') ||
+				target.closest('.cm-tooltip-autocomplete') ||
+				target.closest('.drawer-popover') ||
+				target.closest('.query-status-popover')
+			) {
 				return;
 			}
 
@@ -400,7 +405,11 @@ function LogDetailInner({
 			<div className="log-detail-drawer__content" data-log-detail-ignore="true">
 				<div className="log-detail-drawer__log">
 					<Divider type="vertical" className={cx('log-type-indicator', logType)} />
-					<Tooltip title={removeEscapeCharacters(log?.body)} placement="left">
+					<Tooltip
+						title={removeEscapeCharacters(log?.body)}
+						placement="left"
+						mouseLeaveDelay={0}
+					>
 						<div className="log-body" dangerouslySetInnerHTML={htmlBody} />
 					</Tooltip>
 
@@ -466,6 +475,7 @@ function LogDetailInner({
 								title="Show Filters"
 								placement="topLeft"
 								aria-label="Show Filters"
+								mouseLeaveDelay={0}
 							>
 								<Button
 									className="action-btn"
@@ -481,6 +491,7 @@ function LogDetailInner({
 							aria-label={
 								selectedView === VIEW_TYPES.JSON ? 'Copy JSON' : 'Copy Log Link'
 							}
+							mouseLeaveDelay={0}
 						>
 							<Button
 								className="action-btn"

frontend/src/components/Logs/AddToQueryHOC.tsx

@@ -27,7 +27,11 @@ function AddToQueryHOC({
 	return (
 		// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
 		<div className={cx('addToQueryContainer', fontSize)} onClick={handleQueryAdd}>
-			<Popover placement="top" content={popOverContent}>
+			<Popover
+				overlayClassName="drawer-popover"
+				placement="top"
+				content={popOverContent}
+			>
 				{children}
 			</Popover>
 		</div>

frontend/src/components/Logs/CopyClipboardHOC.tsx

@@ -32,6 +32,7 @@ function CopyClipboardHOC({
 		<span onClick={onClick} role="presentation" tabIndex={-1}>
 			<Popover
 				placement="top"
+				overlayClassName="drawer-popover"
 				content={<span style={{ fontSize: '0.9rem' }}>{tooltipText}</span>}
 			>
 				{children}

frontend/src/components/Logs/TableView/config.ts

@@ -21,7 +21,7 @@ export function getDefaultCellStyle(isDarkMode?: boolean): CSSProperties {
 
 export const defaultTableStyle: CSSProperties = {
 	minWidth: '40rem',
-	maxWidth: '60rem',
+	maxWidth: '90rem',
 };
 
 export const defaultListViewPanelStyle: CSSProperties = {

frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch.tsx

@@ -1328,7 +1328,10 @@ function QuerySearch({
 			)}
 
 			<div className="query-where-clause-editor-container">
-				<Tooltip title={getTooltipContent()} placement="left">
+				<Tooltip
+					title={<div data-log-detail-ignore="true">{getTooltipContent()}</div>}
+					placement="left"
+				>
 					<a
 						href="https://signoz.io/docs/userguide/search-syntax/"
 						target="_blank"

frontend/src/container/DashboardContainer/DashboardVariablesSelection/DashboardVariableSelection.tsx

@@ -9,6 +9,7 @@ import {
 import useVariablesFromUrl from 'hooks/dashboard/useVariablesFromUrl';
 import { useDashboard } from 'providers/Dashboard/Dashboard';
 import { initializeDefaultVariables } from 'providers/Dashboard/initializeDefaultVariables';
+import { updateDashboardVariablesStore } from 'providers/Dashboard/store/dashboardVariables/dashboardVariablesStore';
 import {
 	enqueueDescendantsOfVariable,
 	enqueueFetchOfAllVariables,
@@ -31,6 +32,9 @@ function DashboardVariableSelection(): JSX.Element | null {
 	const { updateUrlVariable, getUrlVariables } = useVariablesFromUrl();
 
 	const { dashboardVariables } = useDashboardVariables();
+	const dashboardId = useDashboardVariablesSelector(
+		(state) => state.dashboardId,
+	);
 	const sortedVariablesArray = useDashboardVariablesSelector(
 		(state) => state.sortedVariablesArray,
 	);
@@ -96,6 +100,28 @@ function DashboardVariableSelection(): JSX.Element | null {
 				updateUrlVariable(name || id, value);
 			}
 
+			// Synchronously update the external store with the new variable value so that
+			// child variables see the updated parent value when they refetch, rather than
+			// waiting for setSelectedDashboard → useEffect → updateDashboardVariablesStore.
+			const updatedVariables = { ...dashboardVariables };
+			if (updatedVariables[id]) {
+				updatedVariables[id] = {
+					...updatedVariables[id],
+					selectedValue: value,
+					allSelected,
+					haveCustomValuesSelected,
+				};
+			}
+			if (updatedVariables[name]) {
+				updatedVariables[name] = {
+					...updatedVariables[name],
+					selectedValue: value,
+					allSelected,
+					haveCustomValuesSelected,
+				};
+			}
+			updateDashboardVariablesStore({ dashboardId, variables: updatedVariables });
+
 			setSelectedDashboard((prev) => {
 				if (prev) {
 					const oldVariables = { ...prev?.data.variables };
@@ -130,10 +156,12 @@ function DashboardVariableSelection(): JSX.Element | null {
 				return prev;
 			});
 
-			// Cascade: enqueue query-type descendants for refetching
+			// Cascade: enqueue query-type descendants for refetching.
+			// Safe to call synchronously now that the store already has the updated value.
 			enqueueDescendantsOfVariable(name);
 		},
 		[
+			dashboardId,
 			dashboardVariables,
 			updateLocalStorageDashboardVariables,
 			updateUrlVariable,

frontend/src/container/DashboardContainer/DashboardVariablesSelection/QueryVariableInput.tsx

@@ -5,7 +5,7 @@ import dashboardVariablesQuery from 'api/dashboard/variables/dashboardVariablesQ
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import { useVariableFetchState } from 'hooks/dashboard/useVariableFetchState';
 import sortValues from 'lib/dashboardVariables/sortVariableValues';
-import { isArray, isEmpty, isString } from 'lodash-es';
+import { isArray, isEmpty } from 'lodash-es';
 import { AppState } from 'store/reducers';
 import { VariableResponseProps } from 'types/api/dashboard/variables/query';
 import { GlobalReducer } from 'types/reducer/globalTime';
@@ -54,7 +54,7 @@ function QueryVariableInput({
 		onChange,
 		onDropdownVisibleChange,
 		handleClear,
-		applyDefaultIfNeeded,
+		getDefaultValue,
 	} = useDashboardVariableSelectHelper({
 		variableData,
 		optionsData,
@@ -68,81 +68,93 @@ function QueryVariableInput({
 			try {
 				setErrorMessage(null);
 
+				// This is just a check given the previously undefined typed name prop. Not significant
+				// This will be changed when we change the schema
+				// TODO: @AshwinBhatkal Perses
+				if (!variableData.name) {
+					return;
+				}
+
+				// if the response is not an array, premature return
 				if (
-					variablesRes?.variableValues &&
-					Array.isArray(variablesRes?.variableValues)
+					!variablesRes?.variableValues ||
+					!Array.isArray(variablesRes?.variableValues)
 				) {
-					const newOptionsData = sortValues(
-						variablesRes?.variableValues,
-						variableData.sort,
+					return;
+				}
+
+				const sortedNewOptions = sortValues(
+					variablesRes.variableValues,
+					variableData.sort,
+				);
+				const sortedOldOptions = sortValues(optionsData, variableData.sort);
+
+				// if options are the same as before, no need to update state or check for selected value validity
+				// ! selectedValue needs to be set in the first pass though, as options are initially empty array and we need to apply default if needed
+				// Expecatation is that when oldOptions are not empty, then there is always some selectedValue
+				if (areArraysEqual(sortedNewOptions, sortedOldOptions)) {
+					return;
+				}
+
+				setOptionsData(sortedNewOptions);
+
+				let isSelectedValueMissingInNewOptions = false;
+
+				// Check if currently selected value(s) are present in the new options list
+				if (isArray(variableData.selectedValue)) {
+					isSelectedValueMissingInNewOptions = variableData.selectedValue.some(
+						(val) => !sortedNewOptions.includes(val),
 					);
+				} else if (
+					variableData.selectedValue &&
+					!sortedNewOptions.includes(variableData.selectedValue)
+				) {
+					isSelectedValueMissingInNewOptions = true;
+				}
 
-					const oldOptionsData = sortValues(optionsData, variableData.sort) as never;
+				// If multi-select with ALL option enabled, and ALL is currently selected, we want to maintain that state and select all new options
+				// This block does not depend on selected value because of ALL and also because we would only come here if options are different from the previous
+				if (
+					variableData.multiSelect &&
+					variableData.showALLOption &&
+					variableData.allSelected &&
+					isSelectedValueMissingInNewOptions
+				) {
+					onValueUpdate(variableData.name, variableData.id, sortedNewOptions, true);
 
-					if (!areArraysEqual(newOptionsData, oldOptionsData)) {
-						let valueNotInList = false;
+					// Update tempSelection to maintain ALL state when dropdown is open
+					if (tempSelection !== undefined) {
+						setTempSelection(sortedNewOptions.map((option) => option.toString()));
+					}
+					return;
+				}
 
-						if (isArray(variableData.selectedValue)) {
-							variableData.selectedValue.forEach((val) => {
-								if (!newOptionsData.includes(val)) {
-									valueNotInList = true;
-								}
-							});
-						} else if (
-							isString(variableData.selectedValue) &&
-							!newOptionsData.includes(variableData.selectedValue)
-						) {
-							valueNotInList = true;
-						}
+				const value = variableData.selectedValue;
+				let allSelected = false;
 
-						if (variableData.name && (valueNotInList || variableData.allSelected)) {
-							if (
-								variableData.allSelected &&
-								variableData.multiSelect &&
-								variableData.showALLOption
-							) {
-								if (
-									variableData.name &&
-									variableData.id &&
-									!isEmpty(variableData.selectedValue)
-								) {
-									onValueUpdate(
-										variableData.name,
-										variableData.id,
-										newOptionsData,
-										true,
-									);
-								}
+				if (variableData.multiSelect) {
+					const { selectedValue } = variableData;
+					allSelected =
+						sortedNewOptions.length > 0 &&
+						Array.isArray(selectedValue) &&
+						sortedNewOptions.every((option) => selectedValue.includes(option));
+				}
 
-								// Update tempSelection to maintain ALL state when dropdown is open
-								if (tempSelection !== undefined) {
-									setTempSelection(newOptionsData.map((option) => option.toString()));
-								}
-							} else {
-								const value = variableData.selectedValue;
-								let allSelected = false;
-
-								if (variableData.multiSelect) {
-									const { selectedValue } = variableData;
-									allSelected =
-										newOptionsData.length > 0 &&
-										Array.isArray(selectedValue) &&
-										newOptionsData.every((option) => selectedValue.includes(option));
-								}
-
-								if (
-									variableData.name &&
-									variableData.id &&
-									!isEmpty(variableData.selectedValue)
-								) {
-									onValueUpdate(variableData.name, variableData.id, value, allSelected);
-								}
-							}
-						}
-
-						setOptionsData(newOptionsData);
-						// Apply default if no value is selected (e.g., new variable, first load)
-						applyDefaultIfNeeded(newOptionsData);
+				if (
+					variableData.name &&
+					variableData.id &&
+					!isEmpty(variableData.selectedValue)
+				) {
+					onValueUpdate(variableData.name, variableData.id, value, allSelected);
+				} else {
+					const defaultValue = getDefaultValue(sortedNewOptions);
+					if (defaultValue !== undefined) {
+						onValueUpdate(
+							variableData.name,
+							variableData.id,
+							defaultValue,
+							allSelected,
+						);
 					}
 				}
 			} catch (e) {
@@ -155,7 +167,7 @@ function QueryVariableInput({
 			onValueUpdate,
 			tempSelection,
 			setTempSelection,
-			applyDefaultIfNeeded,
+			getDefaultValue,
 		],
 	);
 

frontend/src/container/DashboardContainer/DashboardVariablesSelection/__test__/DashboardVariableSelection.test.tsx

@@ -1,5 +1,6 @@
 /* eslint-disable sonarjs/no-duplicate-string */
 import { act, render } from '@testing-library/react';
+import * as dashboardVariablesStoreModule from 'providers/Dashboard/store/dashboardVariables/dashboardVariablesStore';
 import {
 	dashboardVariablesStore,
 	setDashboardVariablesStore,
@@ -10,6 +11,7 @@ import {
 	IDashboardVariablesStoreState,
 } from 'providers/Dashboard/store/dashboardVariables/dashboardVariablesStoreTypes';
 import {
+	enqueueDescendantsOfVariable,
 	enqueueFetchOfAllVariables,
 	initializeVariableFetchStore,
 } from 'providers/Dashboard/store/variableFetchStore';
@@ -17,6 +19,17 @@ import { IDashboardVariable } from 'types/api/dashboard/getAll';
 
 import DashboardVariableSelection from '../DashboardVariableSelection';
 
+// Mutable container to capture the onValueUpdate callback from VariableItem
+const mockVariableItemCallbacks: {
+	onValueUpdate?: (
+		name: string,
+		id: string,
+		value: IDashboardVariable['selectedValue'],
+		allSelected: boolean,
+		haveCustomValuesSelected?: boolean,
+	) => void;
+} = {};
+
 // Mock providers/Dashboard/Dashboard
 const mockSetSelectedDashboard = jest.fn();
 const mockUpdateLocalStorageDashboardVariables = jest.fn();
@@ -56,10 +69,14 @@ jest.mock('react-redux', () => ({
 	useSelector: jest.fn().mockReturnValue({ minTime: 1000, maxTime: 2000 }),
 }));
 
-// Mock VariableItem to avoid rendering complexity
+// VariableItem mock captures the onValueUpdate prop for use in onValueUpdate tests
 jest.mock('../VariableItem', () => ({
 	__esModule: true,
-	default: (): JSX.Element => <div data-testid="variable-item" />,
+	// eslint-disable-next-line @typescript-eslint/no-explicit-any
+	default: (props: any): JSX.Element => {
+		mockVariableItemCallbacks.onValueUpdate = props.onValueUpdate;
+		return <div data-testid="variable-item" />;
+	},
 }));
 
 function createVariable(
@@ -200,4 +217,162 @@ describe('DashboardVariableSelection', () => {
 		expect(initializeVariableFetchStore).not.toHaveBeenCalled();
 		expect(enqueueFetchOfAllVariables).not.toHaveBeenCalled();
 	});
+
+	describe('onValueUpdate', () => {
+		let updateStoreSpy: jest.SpyInstance;
+
+		beforeEach(() => {
+			resetStore();
+			jest.clearAllMocks();
+			// Real implementation pass-through — we just want to observe calls
+			updateStoreSpy = jest.spyOn(
+				dashboardVariablesStoreModule,
+				'updateDashboardVariablesStore',
+			);
+		});
+
+		afterEach(() => {
+			updateStoreSpy.mockRestore();
+		});
+
+		it('updates dashboardVariablesStore synchronously before enqueueDescendantsOfVariable', () => {
+			setDashboardVariablesStore({
+				dashboardId: 'dash-1',
+				variables: {
+					env: createVariable({ name: 'env', id: 'env-id', order: 0 }),
+				},
+			});
+
+			render(<DashboardVariableSelection />);
+
+			const callOrder: string[] = [];
+			updateStoreSpy.mockImplementation(() => {
+				callOrder.push('updateDashboardVariablesStore');
+			});
+			(enqueueDescendantsOfVariable as jest.Mock).mockImplementation(() => {
+				callOrder.push('enqueueDescendantsOfVariable');
+			});
+
+			act(() => {
+				mockVariableItemCallbacks.onValueUpdate?.(
+					'env',
+					'env-id',
+					'production',
+					false,
+				);
+			});
+
+			expect(callOrder).toEqual([
+				'updateDashboardVariablesStore',
+				'enqueueDescendantsOfVariable',
+			]);
+		});
+
+		it('passes updated variable value to dashboardVariablesStore', () => {
+			setDashboardVariablesStore({
+				dashboardId: 'dash-1',
+				variables: {
+					env: createVariable({
+						name: 'env',
+						id: 'env-id',
+						order: 0,
+						selectedValue: 'staging',
+					}),
+				},
+			});
+
+			render(<DashboardVariableSelection />);
+
+			// Clear spy calls that happened during setup/render
+			updateStoreSpy.mockClear();
+
+			act(() => {
+				mockVariableItemCallbacks.onValueUpdate?.(
+					'env',
+					'env-id',
+					'production',
+					false,
+				);
+			});
+
+			expect(updateStoreSpy).toHaveBeenCalledWith(
+				expect.objectContaining({
+					dashboardId: 'dash-1',
+					variables: expect.objectContaining({
+						env: expect.objectContaining({
+							selectedValue: 'production',
+							allSelected: false,
+						}),
+					}),
+				}),
+			);
+		});
+
+		it('calls enqueueDescendantsOfVariable synchronously without a timer', () => {
+			jest.useFakeTimers();
+
+			setDashboardVariablesStore({
+				dashboardId: 'dash-1',
+				variables: {
+					env: createVariable({ name: 'env', id: 'env-id', order: 0 }),
+				},
+			});
+
+			render(<DashboardVariableSelection />);
+
+			act(() => {
+				mockVariableItemCallbacks.onValueUpdate?.(
+					'env',
+					'env-id',
+					'production',
+					false,
+				);
+			});
+
+			// Must be called immediately — no timer advancement needed
+			expect(enqueueDescendantsOfVariable).toHaveBeenCalledWith('env');
+
+			jest.useRealTimers();
+		});
+
+		it('propagates allSelected and haveCustomValuesSelected to the store', () => {
+			setDashboardVariablesStore({
+				dashboardId: 'dash-1',
+				variables: {
+					env: createVariable({
+						name: 'env',
+						id: 'env-id',
+						order: 0,
+						multiSelect: true,
+						showALLOption: true,
+					}),
+				},
+			});
+
+			render(<DashboardVariableSelection />);
+			updateStoreSpy.mockClear();
+
+			act(() => {
+				mockVariableItemCallbacks.onValueUpdate?.(
+					'env',
+					'env-id',
+					['production', 'staging'],
+					true,
+					false,
+				);
+			});
+
+			expect(updateStoreSpy).toHaveBeenCalledWith(
+				expect.objectContaining({
+					variables: expect.objectContaining({
+						env: expect.objectContaining({
+							selectedValue: ['production', 'staging'],
+							allSelected: true,
+							haveCustomValuesSelected: false,
+						}),
+					}),
+				}),
+			);
+		});
+	});
 });

frontend/src/container/DashboardContainer/DashboardVariablesSelection/__test__/QueryVariableInput.test.tsx

@@ -0,0 +1,275 @@
+/* eslint-disable sonarjs/no-duplicate-string */
+import { QueryClient, QueryClientProvider } from 'react-query';
+import { act, render, waitFor } from '@testing-library/react';
+import dashboardVariablesQuery from 'api/dashboard/variables/dashboardVariablesQuery';
+import { variableFetchStore } from 'providers/Dashboard/store/variableFetchStore';
+import { IDashboardVariable } from 'types/api/dashboard/getAll';
+
+import QueryVariableInput from '../QueryVariableInput';
+
+jest.mock('api/dashboard/variables/dashboardVariablesQuery');
+
+jest.mock('react-redux', () => ({
+	...jest.requireActual('react-redux'),
+	useSelector: jest.fn().mockReturnValue({ minTime: 1000, maxTime: 2000 }),
+}));
+
+function createTestQueryClient(): QueryClient {
+	return new QueryClient({
+		defaultOptions: {
+			queries: { retry: false, refetchOnWindowFocus: false },
+		},
+	});
+}
+
+function Wrapper({
+	children,
+	queryClient,
+}: {
+	children: React.ReactNode;
+	queryClient: QueryClient;
+}): JSX.Element {
+	return (
+		<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
+	);
+}
+
+function createVariable(
+	overrides: Partial<IDashboardVariable> = {},
+): IDashboardVariable {
+	return {
+		id: 'env-id',
+		name: 'env',
+		description: '',
+		type: 'QUERY',
+		sort: 'DISABLED',
+		showALLOption: false,
+		multiSelect: false,
+		order: 0,
+		queryValue: 'SELECT env FROM table',
+		...overrides,
+	};
+}
+
+/** Put the named variable into 'loading' state so useQuery fires on mount */
+function setVariableLoading(name: string): void {
+	variableFetchStore.update((draft) => {
+		draft.states[name] = 'loading';
+		draft.cycleIds[name] = (draft.cycleIds[name] || 0) + 1;
+	});
+}
+
+function resetFetchStore(): void {
+	variableFetchStore.set(() => ({
+		states: {},
+		lastUpdated: {},
+		cycleIds: {},
+	}));
+}
+
+describe('QueryVariableInput - getOptions logic', () => {
+	const mockOnValueUpdate = jest.fn();
+
+	beforeEach(() => {
+		jest.clearAllMocks();
+		resetFetchStore();
+	});
+
+	afterEach(() => {
+		resetFetchStore();
+	});
+
+	it('applies default value (first option) when selectedValue is empty on first load', async () => {
+		(dashboardVariablesQuery as jest.Mock).mockResolvedValue({
+			statusCode: 200,
+			payload: { variableValues: ['production', 'staging', 'dev'] },
+		});
+
+		const variable = createVariable({ selectedValue: undefined });
+		setVariableLoading('env');
+
+		const queryClient = createTestQueryClient();
+		render(
+			<Wrapper queryClient={queryClient}>
+				<QueryVariableInput
+					variableData={variable}
+					existingVariables={{ 'env-id': variable }}
+					onValueUpdate={mockOnValueUpdate}
+				/>
+			</Wrapper>,
+		);
+
+		await waitFor(() => {
+			expect(mockOnValueUpdate).toHaveBeenCalledWith(
+				'env',
+				'env-id',
+				'production', // first option by default
+				false,
+			);
+		});
+	});
+
+	it('keeps existing selectedValue when it is present in new options', async () => {
+		(dashboardVariablesQuery as jest.Mock).mockResolvedValue({
+			statusCode: 200,
+			payload: { variableValues: ['production', 'staging'] },
+		});
+
+		const variable = createVariable({ selectedValue: 'staging' });
+		setVariableLoading('env');
+
+		const queryClient = createTestQueryClient();
+		render(
+			<Wrapper queryClient={queryClient}>
+				<QueryVariableInput
+					variableData={variable}
+					existingVariables={{ 'env-id': variable }}
+					onValueUpdate={mockOnValueUpdate}
+				/>
+			</Wrapper>,
+		);
+
+		await waitFor(() => {
+			expect(mockOnValueUpdate).toHaveBeenCalledWith(
+				'env',
+				'env-id',
+				'staging',
+				false,
+			);
+		});
+	});
+
+	it('selects all new options when allSelected=true and value is missing from new options', async () => {
+		(dashboardVariablesQuery as jest.Mock).mockResolvedValue({
+			statusCode: 200,
+			payload: { variableValues: ['production', 'staging'] },
+		});
+
+		const variable = createVariable({
+			selectedValue: ['old-env'],
+			allSelected: true,
+			multiSelect: true,
+			showALLOption: true,
+		});
+		setVariableLoading('env');
+
+		const queryClient = createTestQueryClient();
+		render(
+			<Wrapper queryClient={queryClient}>
+				<QueryVariableInput
+					variableData={variable}
+					existingVariables={{ 'env-id': variable }}
+					onValueUpdate={mockOnValueUpdate}
+				/>
+			</Wrapper>,
+		);
+
+		await waitFor(() => {
+			expect(mockOnValueUpdate).toHaveBeenCalledWith(
+				'env',
+				'env-id',
+				['production', 'staging'],
+				true,
+			);
+		});
+	});
+
+	it('does not call onValueUpdate a second time when options have not changed', async () => {
+		const mockQueryFn = jest.fn().mockResolvedValue({
+			statusCode: 200,
+			payload: { variableValues: ['production', 'staging'] },
+		});
+		(dashboardVariablesQuery as jest.Mock).mockImplementation(mockQueryFn);
+
+		const variable = createVariable({ selectedValue: 'production' });
+		setVariableLoading('env');
+
+		const queryClient = createTestQueryClient();
+		render(
+			<Wrapper queryClient={queryClient}>
+				<QueryVariableInput
+					variableData={variable}
+					existingVariables={{ 'env-id': variable }}
+					onValueUpdate={mockOnValueUpdate}
+				/>
+			</Wrapper>,
+		);
+
+		// Wait for first fetch and onValueUpdate call
+		await waitFor(() => {
+			expect(mockOnValueUpdate).toHaveBeenCalledTimes(1);
+		});
+
+		mockOnValueUpdate.mockClear();
+
+		// Trigger a second fetch cycle with the same API response
+		act(() => {
+			variableFetchStore.update((draft) => {
+				draft.states['env'] = 'revalidating';
+				draft.cycleIds['env'] = (draft.cycleIds['env'] || 0) + 1;
+			});
+		});
+
+		// Wait for second query to fire
+		await waitFor(() => {
+			expect(mockQueryFn).toHaveBeenCalledTimes(2);
+		});
+
+		// Options are unchanged, so onValueUpdate must not fire again
+		expect(mockOnValueUpdate).not.toHaveBeenCalled();
+	});
+
+	it('does not call onValueUpdate when API returns a non-array response', async () => {
+		(dashboardVariablesQuery as jest.Mock).mockResolvedValue({
+			statusCode: 200,
+			payload: { variableValues: null },
+		});
+
+		const variable = createVariable({ selectedValue: 'production' });
+		setVariableLoading('env');
+
+		const queryClient = createTestQueryClient();
+		render(
+			<Wrapper queryClient={queryClient}>
+				<QueryVariableInput
+					variableData={variable}
+					existingVariables={{ 'env-id': variable }}
+					onValueUpdate={mockOnValueUpdate}
+				/>
+			</Wrapper>,
+		);
+
+		await waitFor(() => {
+			expect(dashboardVariablesQuery).toHaveBeenCalled();
+		});
+
+		expect(mockOnValueUpdate).not.toHaveBeenCalled();
+	});
+
+	it('does not fire the query when variableData.name is empty', () => {
+		(dashboardVariablesQuery as jest.Mock).mockResolvedValue({
+			statusCode: 200,
+			payload: { variableValues: ['production'] },
+		});
+
+		// Variable with no name — useVariableFetchState will be called with ''
+		// and the query key will have an empty name, leaving it disabled
+		const variable = createVariable({ name: '' });
+		// Note: we do NOT put it in 'loading' state since name is empty
+		// (no variableFetchStore entry for '' means isVariableFetching=false)
+
+		const queryClient = createTestQueryClient();
+		render(
+			<Wrapper queryClient={queryClient}>
+				<QueryVariableInput
+					variableData={variable}
+					existingVariables={{ 'env-id': variable }}
+					onValueUpdate={mockOnValueUpdate}
+				/>
+			</Wrapper>,
+		);
+
+		expect(dashboardVariablesQuery).not.toHaveBeenCalled();
+		expect(mockOnValueUpdate).not.toHaveBeenCalled();
+	});
+});

frontend/src/container/DashboardContainer/DashboardVariablesSelection/useDashboardVariableSelectHelper.ts

@@ -46,6 +46,9 @@ interface UseDashboardVariableSelectHelperReturn {
 	applyDefaultIfNeeded: (
 		overrideOptions?: (string | number | boolean)[],
 	) => void;
+	getDefaultValue: (
+		overrideOptions?: (string | number | boolean)[],
+	) => string | string[] | undefined;
 }
 
 // eslint-disable-next-line sonarjs/cognitive-complexity
@@ -248,5 +251,6 @@ export function useDashboardVariableSelectHelper({
 		defaultValue,
 		onChange,
 		applyDefaultIfNeeded,
+		getDefaultValue,
 	};
 }

frontend/src/container/LogDetailedView/BodyTitleRenderer.tsx

@@ -121,9 +121,23 @@ function BodyTitleRenderer({
 	return (
 		<TitleWrapper onClick={handleNodeClick}>
 			{typeof value !== 'object' && (
-				<Dropdown menu={menu} trigger={['click']}>
-					<SettingOutlined style={{ marginRight: 8 }} className="hover-reveal" />
-				</Dropdown>
+				<span
+					onClick={(e): void => {
+						e.stopPropagation();
+						e.preventDefault();
+					}}
+					onMouseDown={(e): void => e.preventDefault()}
+				>
+					<Dropdown
+						menu={menu}
+						trigger={['click']}
+						dropdownRender={(originNode): React.ReactNode => (
+							<div data-log-detail-ignore="true">{originNode}</div>
+						)}
+					>
+						<SettingOutlined style={{ marginRight: 8 }} className="hover-reveal" />
+					</Dropdown>
+				</span>
 			)}
 			{title.toString()}{' '}
 			{!parentIsArray && typeof value !== 'object' && (

frontend/src/container/LogDetailedView/FieldRenderer.tsx

@@ -13,7 +13,7 @@ function FieldRenderer({ field }: FieldRendererProps): JSX.Element {
 		<span className="field-renderer-container">
 			{dataType && newField && logType ? (
 				<>
-					<Tooltip placement="left" title={newField}>
+					<Tooltip placement="left" title={newField} mouseLeaveDelay={0}>
 						<Typography.Text ellipsis className="label">
 							{newField}{' '}
 						</Typography.Text>

frontend/src/container/LogDetailedView/Overview.tsx

@@ -1,6 +1,7 @@
-import { ReactNode, useState } from 'react';
+import { ReactNode, useCallback, useEffect, useRef, useState } from 'react';
 import MEditor, { EditorProps, Monaco } from '@monaco-editor/react';
 import { Color } from '@signozhq/design-tokens';
+import type { InputRef } from 'antd';
 import {
 	Button,
 	Collapse,
@@ -46,12 +47,23 @@ function Overview({
 	handleChangeSelectedView,
 }: Props): JSX.Element {
 	const [isWrapWord, setIsWrapWord] = useState<boolean>(true);
-	const [isSearchVisible, setIsSearchVisible] = useState<boolean>(false);
+	const [isSearchVisible, setIsSearchVisible] = useState<boolean>(true);
 	const [isAttributesExpanded, setIsAttributesExpanded] = useState<boolean>(
 		true,
 	);
 	const [fieldSearchInput, setFieldSearchInput] = useState<string>('');
 
+	const focusTimerRef = useRef<ReturnType<typeof setTimeout>>();
+
+	const searchInputRef = useCallback((node: InputRef | null) => {
+		clearTimeout(focusTimerRef.current);
+		if (node) {
+			focusTimerRef.current = setTimeout(() => node.focus(), 100);
+		}
+	}, []);
+
+	useEffect(() => (): void => clearTimeout(focusTimerRef.current), []);
+
 	const isDarkMode = useIsDarkMode();
 
 	const options: EditorProps['options'] = {
@@ -196,7 +208,7 @@ function Overview({
 							<>
 								{isSearchVisible && (
 									<Input
-										autoFocus
+										ref={searchInputRef}
 										placeholder="Search for a field..."
 										className="search-input"
 										value={fieldSearchInput}

frontend/src/container/LogDetailedView/TableView.tsx

@@ -245,7 +245,7 @@ function TableView({
 							<Typography.Text>{renderedField}</Typography.Text>
 
 							{traceId && (
-								<Tooltip title="Inspect in Trace">
+								<Tooltip title="Inspect in Trace" mouseLeaveDelay={0}>
 									<Button
 										className="periscope-btn"
 										onClick={(

frontend/src/container/LogsExplorerChart/__tests__/frequencyGraphColor.test.ts

@@ -0,0 +1,34 @@
+import { Color } from '@signozhq/design-tokens';
+
+import { getColorsForSeverityLabels, isRedLike } from '../utils';
+
+describe('getColorsForSeverityLabels', () => {
+	it('should return slate for blank labels', () => {
+		expect(getColorsForSeverityLabels('', 0)).toBe(Color.BG_SLATE_300);
+		expect(getColorsForSeverityLabels('   ', 0)).toBe(Color.BG_SLATE_300);
+	});
+
+	it('should return correct colors for known severity variants', () => {
+		expect(getColorsForSeverityLabels('INFO', 0)).toBe(Color.BG_ROBIN_600);
+		expect(getColorsForSeverityLabels('ERROR', 0)).toBe(Color.BG_CHERRY_600);
+		expect(getColorsForSeverityLabels('WARN', 0)).toBe(Color.BG_AMBER_600);
+		expect(getColorsForSeverityLabels('DEBUG', 0)).toBe(Color.BG_AQUA_600);
+		expect(getColorsForSeverityLabels('TRACE', 0)).toBe(Color.BG_FOREST_600);
+		expect(getColorsForSeverityLabels('FATAL', 0)).toBe(Color.BG_SAKURA_600);
+	});
+
+	it('should return non-red colors for unrecognized labels at any index', () => {
+		for (let i = 0; i < 30; i++) {
+			const color = getColorsForSeverityLabels('4', i);
+			expect(isRedLike(color)).toBe(false);
+		}
+	});
+
+	it('should return non-red colors for numeric severity text', () => {
+		const numericLabels = ['1', '2', '4', '9', '13', '17', '21'];
+		numericLabels.forEach((label) => {
+			const color = getColorsForSeverityLabels(label, 0);
+			expect(isRedLike(color)).toBe(false);
+		});
+	});
+});

frontend/src/container/LogsExplorerChart/utils.ts

@@ -1,7 +1,16 @@
 import { Color } from '@signozhq/design-tokens';
-import { themeColors } from 'constants/theme';
 import { colors } from 'lib/getRandomColor';
 
+// Function to determine if a color is "red-like" based on its RGB values
+export function isRedLike(hex: string): boolean {
+	const r = parseInt(hex.slice(1, 3), 16);
+	const g = parseInt(hex.slice(3, 5), 16);
+	const b = parseInt(hex.slice(5, 7), 16);
+	return r > 180 && r > g * 1.4 && r > b * 1.4;
+}
+
+const SAFE_FALLBACK_COLORS = colors.filter((c) => !isRedLike(c));
+
 const SEVERITY_VARIANT_COLORS: Record<string, string> = {
 	TRACE: Color.BG_FOREST_600,
 	Trace: Color.BG_FOREST_500,
@@ -67,8 +76,13 @@ export function getColorsForSeverityLabels(
 	label: string,
 	index: number,
 ): string {
-	// Check if we have a direct mapping for this severity variant
-	const variantColor = SEVERITY_VARIANT_COLORS[label.trim()];
+	const trimmed = label.trim();
+
+	if (!trimmed) {
+		return Color.BG_SLATE_300;
+	}
+
+	const variantColor = SEVERITY_VARIANT_COLORS[trimmed];
 	if (variantColor) {
 		return variantColor;
 	}
@@ -103,5 +117,8 @@ export function getColorsForSeverityLabels(
 		return Color.BG_SAKURA_500;
 	}
 
-	return colors[index % colors.length] || themeColors.red;
+	return (
+		SAFE_FALLBACK_COLORS[index % SAFE_FALLBACK_COLORS.length] ||
+		Color.BG_SLATE_400
+	);
 }

frontend/src/container/LogsExplorerList/InfinityTableView/index.tsx

@@ -111,23 +111,19 @@ const InfinityTable = forwardRef<TableVirtuosoHandle, InfinityTableProps>(
 		);
 
 		const itemContent = useCallback(
-			(index: number, log: Record<string, unknown>): JSX.Element => {
-				return (
-					<div key={log.id as string}>
-						<TableRow
-							tableColumns={tableColumns}
-							index={index}
-							log={log}
-							logs={tableViewProps.logs}
-							hasActions
-							fontSize={tableViewProps.fontSize}
-							onShowLogDetails={onSetActiveLog}
-							isActiveLog={activeLog?.id === log.id}
-							onClearActiveLog={onCloseActiveLog}
-						/>
-					</div>
-				);
-			},
+			(index: number, log: Record<string, unknown>): JSX.Element => (
+				<TableRow
+					tableColumns={tableColumns}
+					index={index}
+					log={log}
+					logs={tableViewProps.logs}
+					hasActions
+					fontSize={tableViewProps.fontSize}
+					onShowLogDetails={onSetActiveLog}
+					isActiveLog={activeLog?.id === log.id}
+					onClearActiveLog={onCloseActiveLog}
+				/>
+			),
 			[
 				tableColumns,
 				onSetActiveLog,

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

@@ -0,0 +1,94 @@
+import { act, renderHook } from '@testing-library/react';
+import { useActiveLog } from 'hooks/logs/useActiveLog';
+import { useIsTextSelected } from 'hooks/useIsTextSelected';
+import { ILog } from 'types/api/logs/log';
+
+import useLogDetailHandlers from '../useLogDetailHandlers';
+
+jest.mock('hooks/logs/useActiveLog');
+jest.mock('hooks/useIsTextSelected');
+
+const mockOnSetActiveLog = jest.fn();
+const mockOnClearActiveLog = jest.fn();
+const mockOnAddToQuery = jest.fn();
+const mockOnGroupByAttribute = jest.fn();
+const mockIsTextSelected = jest.fn();
+
+const mockLog: ILog = {
+	id: 'log-1',
+	timestamp: '2024-01-01T00:00:00Z',
+	date: '2024-01-01',
+	body: 'test log body',
+	severityText: 'INFO',
+	severityNumber: 9,
+	traceFlags: 0,
+	traceId: '',
+	spanID: '',
+	attributesString: {},
+	attributesInt: {},
+	attributesFloat: {},
+	resources_string: {},
+	scope_string: {},
+	attributes_string: {},
+	severity_text: '',
+	severity_number: 0,
+};
+
+beforeEach(() => {
+	jest.clearAllMocks();
+
+	jest.mocked(useIsTextSelected).mockReturnValue(mockIsTextSelected);
+
+	jest.mocked(useActiveLog).mockReturnValue({
+		activeLog: null,
+		onSetActiveLog: mockOnSetActiveLog,
+		onClearActiveLog: mockOnClearActiveLog,
+		onAddToQuery: mockOnAddToQuery,
+		onGroupByAttribute: mockOnGroupByAttribute,
+	});
+});
+
+it('should not open log detail when text is selected', () => {
+	mockIsTextSelected.mockReturnValue(true);
+
+	const { result } = renderHook(() => useLogDetailHandlers());
+
+	act(() => {
+		result.current.handleSetActiveLog(mockLog);
+	});
+
+	expect(mockOnSetActiveLog).not.toHaveBeenCalled();
+});
+
+it('should open log detail when no text is selected', () => {
+	mockIsTextSelected.mockReturnValue(false);
+
+	const { result } = renderHook(() => useLogDetailHandlers());
+
+	act(() => {
+		result.current.handleSetActiveLog(mockLog);
+	});
+
+	expect(mockOnSetActiveLog).toHaveBeenCalledWith(mockLog);
+});
+
+it('should toggle off when clicking the same active log', () => {
+	mockIsTextSelected.mockReturnValue(false);
+
+	jest.mocked(useActiveLog).mockReturnValue({
+		activeLog: mockLog,
+		onSetActiveLog: mockOnSetActiveLog,
+		onClearActiveLog: mockOnClearActiveLog,
+		onAddToQuery: mockOnAddToQuery,
+		onGroupByAttribute: mockOnGroupByAttribute,
+	});
+
+	const { result } = renderHook(() => useLogDetailHandlers());
+
+	act(() => {
+		result.current.handleSetActiveLog(mockLog);
+	});
+
+	expect(mockOnClearActiveLog).toHaveBeenCalled();
+	expect(mockOnSetActiveLog).not.toHaveBeenCalled();
+});

frontend/src/hooks/logs/useActiveLog.ts

@@ -1,15 +1,17 @@
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useQueryClient } from 'react-query';
 import { useDispatch, useSelector } from 'react-redux';
 import { useHistory, useLocation } from 'react-router-dom';
 import { getAggregateKeys } from 'api/queryBuilder/getAttributeKeys';
 import { SOMETHING_WENT_WRONG } from 'constants/api';
+import { QueryParams } from 'constants/query';
 import { OPERATORS, QueryBuilderKeys } from 'constants/queryBuilder';
 import ROUTES from 'constants/routes';
 import { MetricsType } from 'container/MetricsApplication/constant';
 import { getOperatorValue } from 'container/QueryBuilder/filters/QueryBuilderSearch/utils';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useNotifications } from 'hooks/useNotifications';
+import useUrlQuery from 'hooks/useUrlQuery';
 import { getGeneratedFilterQueryString } from 'lib/getGeneratedFilterQueryString';
 import { chooseAutocompleteFromCustomValue } from 'lib/newQueryBuilder/chooseAutocompleteFromCustomValue';
 import { AppState } from 'store/reducers';
@@ -54,6 +56,20 @@ export const useActiveLog = (): UseActiveLog => {
 
 	const [activeLog, setActiveLog] = useState<ILog | null>(null);
 
+	// Close drawer/clear active log when query in URL changes
+	const urlQuery = useUrlQuery();
+	const compositeQuery = urlQuery.get(QueryParams.compositeQuery) ?? '';
+	const prevQueryRef = useRef<string | null>(null);
+	useEffect(() => {
+		if (
+			prevQueryRef.current !== null &&
+			prevQueryRef.current !== compositeQuery
+		) {
+			setActiveLog(null);
+		}
+		prevQueryRef.current = compositeQuery;
+	}, [compositeQuery]);
+
 	const onSetDetailedLogData = useCallback(
 		(logData: ILog) => {
 			dispatch({

frontend/src/hooks/logs/useLogDetailHandlers.ts

@@ -2,6 +2,7 @@ import { useCallback, useState } from 'react';
 import { VIEW_TYPES } from 'components/LogDetail/constants';
 import type { UseActiveLog } from 'hooks/logs/types';
 import { useActiveLog } from 'hooks/logs/useActiveLog';
+import { useIsTextSelected } from 'hooks/useIsTextSelected';
 import { ILog } from 'types/api/logs/log';
 
 type SelectedTab = typeof VIEW_TYPES[keyof typeof VIEW_TYPES] | undefined;
@@ -28,9 +29,13 @@ function useLogDetailHandlers({
 		onAddToQuery,
 	} = useActiveLog();
 	const [selectedTab, setSelectedTab] = useState<SelectedTab>(defaultTab);
+	const isTextSelected = useIsTextSelected();
 
 	const handleSetActiveLog = useCallback(
 		(log: ILog, nextTab: SelectedTab = defaultTab): void => {
+			if (isTextSelected()) {
+				return;
+			}
 			if (activeLog?.id === log.id) {
 				onClearActiveLog();
 				setSelectedTab(undefined);
@@ -39,7 +44,7 @@ function useLogDetailHandlers({
 			onSetActiveLog(log);
 			setSelectedTab(nextTab ?? defaultTab);
 		},
-		[activeLog?.id, defaultTab, onClearActiveLog, onSetActiveLog],
+		[activeLog?.id, defaultTab, onClearActiveLog, onSetActiveLog, isTextSelected],
 	);
 
 	const handleCloseLogDetail = useCallback((): void => {

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

@@ -1,23 +0,0 @@
-// AUTO GENERATED FILE - DO NOT EDIT - GENERATED BY scripts/generate-permissions-type
-export default {
-	status: 'success',
-	data: {
-		resources: [
-			{
-				name: 'dashboard',
-				type: 'metaresource',
-			},
-			{
-				name: 'dashboards',
-				type: 'metaresources',
-			},
-		],
-		relations: {
-			create: ['metaresources'],
-			delete: ['user', 'role', 'organization', 'metaresource'],
-			list: ['metaresources'],
-			read: ['user', 'role', 'organization', 'metaresource'],
-			update: ['user', 'role', 'organization', 'metaresource'],
-		},
-	},
-} as const;

frontend/src/hooks/useAuthZ/useAuthZ.test.tsx

@@ -1,495 +0,0 @@
-import { ReactElement } from 'react';
-import { renderHook, waitFor } from '@testing-library/react';
-import { ENVIRONMENT } from 'constants/env';
-import { server } from 'mocks-server/server';
-import { rest } from 'msw';
-import { AllTheProviders } from 'tests/test-utils';
-
-import {
-	AuthtypesGettableTransactionDTO,
-	AuthtypesTransactionDTO,
-} from '../../api/generated/services/sigNoz.schemas';
-import { useAuthZ } from './useAuthZ';
-import { BrandedPermission, buildPermission } from './utils';
-
-const BASE_URL = ENVIRONMENT.baseURL || '';
-const AUTHZ_CHECK_URL = `${BASE_URL}/api/v1/authz/check`;
-
-function authzMockResponse(
-	payload: AuthtypesTransactionDTO[],
-	authorizedByIndex: boolean[],
-): { data: AuthtypesGettableTransactionDTO[]; status: string } {
-	return {
-		data: payload.map((txn, i) => ({
-			relation: txn.relation,
-			object: txn.object,
-			authorized: authorizedByIndex[i] ?? false,
-		})),
-		status: 'success',
-	};
-}
-
-const wrapper = ({ children }: { children: ReactElement }): ReactElement => (
-	<AllTheProviders>{children}</AllTheProviders>
-);
-
-describe('useAuthZ', () => {
-	it('should fetch and return permissions successfully', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-
-		const expectedResponse = {
-			[permission1]: {
-				isGranted: true,
-			},
-			[permission2]: {
-				isGranted: false,
-			},
-		};
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				return res(
-					ctx.status(200),
-					ctx.json(authzMockResponse(payload, [true, false])),
-				);
-			}),
-		);
-
-		const { result } = renderHook(() => useAuthZ([permission1, permission2]), {
-			wrapper,
-		});
-
-		expect(result.current.isLoading).toBe(true);
-		expect(result.current.permissions).toBeNull();
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(result.current.error).toBeNull();
-		expect(result.current.permissions).toEqual(expectedResponse);
-	});
-
-	it('should handle API errors', async () => {
-		const permission = buildPermission('read', 'dashboard:*');
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => {
-				return res(ctx.status(500), ctx.json({ error: 'Internal Server Error' }));
-			}),
-		);
-
-		const { result } = renderHook(() => useAuthZ([permission]), {
-			wrapper,
-		});
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(result.current.error).not.toBeNull();
-		expect(result.current.permissions).toBeNull();
-	});
-
-	it('should refetch when permissions array changes', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-		const permission3 = buildPermission('delete', 'dashboard:456');
-
-		let requestCount = 0;
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				requestCount++;
-				const payload = await req.json();
-
-				if (payload.length === 1) {
-					return res(ctx.status(200), ctx.json(authzMockResponse(payload, [true])));
-				}
-
-				const authorized = payload.map(
-					(txn: { relation: string }) =>
-						txn.relation === 'read' || txn.relation === 'delete',
-				);
-				return res(
-					ctx.status(200),
-					ctx.json(authzMockResponse(payload, authorized)),
-				);
-			}),
-		);
-
-		const { result, rerender } = renderHook<
-			ReturnType<typeof useAuthZ>,
-			BrandedPermission[]
-		>((permissions) => useAuthZ(permissions), {
-			wrapper,
-			initialProps: [permission1],
-		});
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(requestCount).toBe(1);
-		expect(result.current.permissions).toEqual({
-			[permission1]: {
-				isGranted: true,
-			},
-		});
-
-		rerender([permission1, permission2, permission3]);
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(requestCount).toBe(2);
-		expect(result.current.permissions).toEqual({
-			[permission1]: {
-				isGranted: true,
-			},
-			[permission2]: {
-				isGranted: false,
-			},
-			[permission3]: {
-				isGranted: true,
-			},
-		});
-	});
-
-	it('should not refetch when permissions array order changes but content is the same', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-
-		let requestCount = 0;
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				requestCount++;
-				const payload = await req.json();
-				return res(
-					ctx.status(200),
-					ctx.json(authzMockResponse(payload, [true, false])),
-				);
-			}),
-		);
-
-		const { result, rerender } = renderHook<
-			ReturnType<typeof useAuthZ>,
-			BrandedPermission[]
-		>((permissions) => useAuthZ(permissions), {
-			wrapper,
-			initialProps: [permission1, permission2],
-		});
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(requestCount).toBe(1);
-
-		rerender([permission2, permission1]);
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(requestCount).toBe(1);
-	});
-
-	it('should handle empty permissions array', async () => {
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => {
-				return res(ctx.status(200), ctx.json({ data: [], status: 'success' }));
-			}),
-		);
-
-		const { result } = renderHook(() => useAuthZ([]), {
-			wrapper,
-		});
-
-		expect(result.current.isLoading).toBe(false);
-		expect(result.current.error).toBeNull();
-		expect(result.current.permissions).toEqual({});
-	});
-
-	it('should send correct payload format to API', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-
-		let receivedPayload: any = null;
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				receivedPayload = await req.json();
-				return res(
-					ctx.status(200),
-					ctx.json(authzMockResponse(receivedPayload, [true, false])),
-				);
-			}),
-		);
-
-		const { result } = renderHook(() => useAuthZ([permission1, permission2]), {
-			wrapper,
-		});
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(receivedPayload).toHaveLength(2);
-		expect(receivedPayload[0]).toMatchObject({
-			relation: 'read',
-			object: {
-				resource: { name: 'dashboard', type: 'metaresource' },
-				selector: '*',
-			},
-		});
-		expect(receivedPayload[1]).toMatchObject({
-			relation: 'update',
-			object: {
-				resource: { name: 'dashboard', type: 'metaresource' },
-				selector: '123',
-			},
-		});
-	});
-
-	it('should batch multiple hooks into single flight request', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-		const permission3 = buildPermission('delete', 'dashboard:456');
-
-		let requestCount = 0;
-		const receivedPayloads: any[] = [];
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				requestCount++;
-				const payload = await req.json();
-				receivedPayloads.push(payload);
-				return res(
-					ctx.status(200),
-					ctx.json(authzMockResponse(payload, [true, false, true])),
-				);
-			}),
-		);
-
-		const { result: result1 } = renderHook(() => useAuthZ([permission1]), {
-			wrapper,
-		});
-
-		const { result: result2 } = renderHook(() => useAuthZ([permission2]), {
-			wrapper,
-		});
-
-		const { result: result3 } = renderHook(() => useAuthZ([permission3]), {
-			wrapper,
-		});
-
-		await waitFor(
-			() => {
-				expect(result1.current.isLoading).toBe(false);
-				expect(result2.current.isLoading).toBe(false);
-				expect(result3.current.isLoading).toBe(false);
-			},
-			{ timeout: 200 },
-		);
-
-		expect(requestCount).toBe(1);
-		expect(receivedPayloads).toHaveLength(1);
-		expect(receivedPayloads[0]).toHaveLength(3);
-		expect(receivedPayloads[0][0]).toMatchObject({
-			relation: 'read',
-			object: {
-				resource: { name: 'dashboard', type: 'metaresource' },
-				selector: '*',
-			},
-		});
-		expect(receivedPayloads[0][1]).toMatchObject({
-			relation: 'update',
-			object: { resource: { name: 'dashboard' }, selector: '123' },
-		});
-		expect(receivedPayloads[0][2]).toMatchObject({
-			relation: 'delete',
-			object: { resource: { name: 'dashboard' }, selector: '456' },
-		});
-
-		expect(result1.current.permissions).toEqual({
-			[permission1]: { isGranted: true },
-		});
-		expect(result2.current.permissions).toEqual({
-			[permission2]: { isGranted: false },
-		});
-		expect(result3.current.permissions).toEqual({
-			[permission3]: { isGranted: true },
-		});
-	});
-
-	it('should create separate batches for calls after single flight window', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-		const permission3 = buildPermission('delete', 'dashboard:456');
-
-		let requestCount = 0;
-		const receivedPayloads: any[] = [];
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				requestCount++;
-				const payload = await req.json();
-				receivedPayloads.push(payload);
-				const authorized = payload.length === 1 ? [true] : [false, true];
-				return res(
-					ctx.status(200),
-					ctx.json(authzMockResponse(payload, authorized)),
-				);
-			}),
-		);
-
-		const { result: result1 } = renderHook(() => useAuthZ([permission1]), {
-			wrapper,
-		});
-
-		await waitFor(
-			() => {
-				expect(result1.current.isLoading).toBe(false);
-			},
-			{ timeout: 200 },
-		);
-
-		expect(requestCount).toBe(1);
-		expect(receivedPayloads[0]).toHaveLength(1);
-
-		await new Promise((resolve) => setTimeout(resolve, 100));
-
-		const { result: result2 } = renderHook(() => useAuthZ([permission2]), {
-			wrapper,
-		});
-
-		const { result: result3 } = renderHook(() => useAuthZ([permission3]), {
-			wrapper,
-		});
-
-		await waitFor(
-			() => {
-				expect(result2.current.isLoading).toBe(false);
-				expect(result3.current.isLoading).toBe(false);
-			},
-			{ timeout: 200 },
-		);
-
-		expect(requestCount).toBe(2);
-		expect(receivedPayloads).toHaveLength(2);
-		expect(receivedPayloads[1]).toHaveLength(2);
-		expect(receivedPayloads[1][0]).toMatchObject({
-			relation: 'update',
-			object: { resource: { name: 'dashboard' }, selector: '123' },
-		});
-		expect(receivedPayloads[1][1]).toMatchObject({
-			relation: 'delete',
-			object: { resource: { name: 'dashboard' }, selector: '456' },
-		});
-	});
-
-	it('should map permissions correctly when API returns response out of order', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-		const permission3 = buildPermission('delete', 'dashboard:456');
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				const payload = await req.json();
-				const reversed = [...payload].reverse();
-				const authorizedByReversed = [true, false, true];
-				return res(
-					ctx.status(200),
-					ctx.json({
-						data: reversed.map((txn: any, i: number) => ({
-							relation: txn.relation,
-							object: txn.object,
-							authorized: authorizedByReversed[i],
-						})),
-						status: 'success',
-					}),
-				);
-			}),
-		);
-
-		const { result } = renderHook(
-			() => useAuthZ([permission1, permission2, permission3]),
-			{ wrapper },
-		);
-
-		await waitFor(() => {
-			expect(result.current.isLoading).toBe(false);
-		});
-
-		expect(result.current.permissions).toEqual({
-			[permission1]: { isGranted: true },
-			[permission2]: { isGranted: false },
-			[permission3]: { isGranted: true },
-		});
-	});
-
-	it('should not leak state between separate batches', async () => {
-		const permission1 = buildPermission('read', 'dashboard:*');
-		const permission2 = buildPermission('update', 'dashboard:123');
-
-		let requestCount = 0;
-
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, async (req, res, ctx) => {
-				requestCount++;
-				const payload = await req.json();
-				const authorized = payload.map(
-					(txn: { relation: string }) => txn.relation === 'read',
-				);
-				return res(
-					ctx.status(200),
-					ctx.json(authzMockResponse(payload, authorized)),
-				);
-			}),
-		);
-
-		const { result: result1 } = renderHook(() => useAuthZ([permission1]), {
-			wrapper,
-		});
-
-		await waitFor(
-			() => {
-				expect(result1.current.isLoading).toBe(false);
-			},
-			{ timeout: 200 },
-		);
-
-		expect(requestCount).toBe(1);
-		expect(result1.current.permissions).toEqual({
-			[permission1]: { isGranted: true },
-		});
-
-		await new Promise((resolve) => setTimeout(resolve, 100));
-
-		const { result: result2 } = renderHook(() => useAuthZ([permission2]), {
-			wrapper,
-		});
-
-		await waitFor(
-			() => {
-				expect(result2.current.isLoading).toBe(false);
-			},
-			{ timeout: 200 },
-		);
-
-		expect(requestCount).toBe(2);
-		expect(result1.current.permissions).toEqual({
-			[permission1]: { isGranted: true },
-		});
-		expect(result2.current.permissions).toEqual({
-			[permission2]: { isGranted: false },
-		});
-		expect(result1.current.permissions).not.toHaveProperty(permission2);
-		expect(result2.current.permissions).not.toHaveProperty(permission1);
-	});
-});

frontend/src/hooks/useAuthZ/useAuthZ.tsx

@@ -1,144 +0,0 @@
-import { useMemo } from 'react';
-import { useQueries } from 'react-query';
-
-import { authzCheck } from '../../api/generated/services/authz';
-import type {
-	AuthtypesObjectDTO,
-	AuthtypesTransactionDTO,
-} from '../../api/generated/services/sigNoz.schemas';
-import {
-	BrandedPermission,
-	gettableTransactionToPermission,
-	permissionToTransactionDto,
-} from './utils';
-
-export type UseAuthZPermissionResult = {
-	isGranted: boolean;
-};
-
-export type AuthZCheckResponse = Record<
-	BrandedPermission,
-	UseAuthZPermissionResult
->;
-
-export type UseAuthZResult = {
-	isLoading: boolean;
-	error: Error | null;
-	permissions: AuthZCheckResponse | null;
-};
-
-let ctx: Promise<AuthZCheckResponse> | null;
-let pendingPermissions: BrandedPermission[] = [];
-const SINGLE_FLIGHT_WAIT_TIME_MS = 50;
-const AUTHZ_CACHE_TIME = 20_000;
-
-function dispatchPermission(
-	permission: BrandedPermission,
-): Promise<AuthZCheckResponse> {
-	pendingPermissions.push(permission);
-
-	if (!ctx) {
-		let resolve: (v: AuthZCheckResponse) => void, reject: (reason?: any) => void;
-		ctx = new Promise<AuthZCheckResponse>((r, re) => {
-			resolve = r;
-			reject = re;
-		});
-
-		setTimeout(() => {
-			const copiedPermissions = pendingPermissions.slice();
-			pendingPermissions = [];
-			ctx = null;
-
-			fetchManyPermissions(copiedPermissions).then(resolve).catch(reject);
-		}, SINGLE_FLIGHT_WAIT_TIME_MS);
-	}
-
-	return ctx;
-}
-
-async function fetchManyPermissions(
-	permissions: BrandedPermission[],
-): Promise<AuthZCheckResponse> {
-	const payload: AuthtypesTransactionDTO[] = permissions.map((permission) => {
-		const dto = permissionToTransactionDto(permission);
-		const object: AuthtypesObjectDTO = {
-			resource: {
-				name: dto.object.resource.name,
-				type: dto.object.resource.type,
-			},
-			selector: dto.object.selector,
-		};
-		return { relation: dto.relation, object };
-	});
-
-	const { data } = await authzCheck(payload);
-
-	const fromApi = (data ?? []).reduce<AuthZCheckResponse>((acc, item) => {
-		const permission = gettableTransactionToPermission(item);
-		acc[permission] = { isGranted: !!item.authorized };
-		return acc;
-	}, {} as AuthZCheckResponse);
-
-	return permissions.reduce<AuthZCheckResponse>((acc, permission) => {
-		acc[permission] = fromApi[permission] ?? { isGranted: false };
-		return acc;
-	}, {} as AuthZCheckResponse);
-}
-
-export function useAuthZ(permissions: BrandedPermission[]): UseAuthZResult {
-	const queryResults = useQueries(
-		permissions.map((permission) => {
-			return {
-				queryKey: ['authz', permission],
-				cacheTime: AUTHZ_CACHE_TIME,
-				refetchOnMount: false,
-				refetchIntervalInBackground: false,
-				refetchOnWindowFocus: false,
-				refetchOnReconnect: true,
-				queryFn: async (): Promise<AuthZCheckResponse> => {
-					const response = await dispatchPermission(permission);
-
-					return {
-						[permission]: {
-							isGranted: response[permission].isGranted,
-						},
-					};
-				},
-			};
-		}),
-	);
-
-	const isLoading = useMemo(() => queryResults.some((q) => q.isLoading), [
-		queryResults,
-	]);
-	const error = useMemo(
-		() =>
-			!isLoading
-				? (queryResults.find((q) => !!q.error)?.error as Error) || null
-				: null,
-		[isLoading, queryResults],
-	);
-	const data = useMemo(() => {
-		if (isLoading || error) {
-			return null;
-		}
-
-		return queryResults.reduce((acc, q) => {
-			if (!q.data) {
-				return acc;
-			}
-
-			for (const [key, value] of Object.entries(q.data)) {
-				acc[key as BrandedPermission] = value;
-			}
-
-			return acc;
-		}, {} as AuthZCheckResponse);
-	}, [isLoading, error, queryResults]);
-
-	return {
-		isLoading,
-		error,
-		permissions: data ?? null,
-	};
-}

frontend/src/hooks/useAuthZ/utils.ts

@@ -1,118 +0,0 @@
-import { AuthtypesTransactionDTO } from '../../api/generated/services/sigNoz.schemas';
-import permissionsType from './permissions.type';
-
-export const PermissionSeparator = '||__||';
-export const ObjectSeparator = ':';
-
-type PermissionsData = typeof permissionsType.data;
-type Resource = PermissionsData['resources'][number];
-type ResourceName = Resource['name'];
-type ResourceType = Resource['type'];
-type RelationsByType = PermissionsData['relations'];
-
-type ResourceTypeMap = {
-	[K in ResourceName]: Extract<Resource, { name: K }>['type'];
-};
-
-type RelationName = keyof RelationsByType;
-
-type ResourcesForRelation<R extends RelationName> = Extract<
-	Resource,
-	{ type: RelationsByType[R][number] }
->['name'];
-
-type IsPluralResource<
-	R extends ResourceName
-> = ResourceTypeMap[R] extends 'metaresources' ? true : false;
-
-type ObjectForResource<R extends ResourceName> = R extends infer U
-	? U extends ResourceName
-		? IsPluralResource<U> extends true
-			? U
-			: `${U}${typeof ObjectSeparator}${string}`
-		: never
-	: never;
-
-type RelationToObject<R extends RelationName> = ObjectForResource<
-	ResourcesForRelation<R>
->;
-
-type AllRelations = RelationName;
-
-export type AuthZRelation = AllRelations;
-export type AuthZResource = ResourceName;
-export type AuthZObject<R extends AuthZRelation> = RelationToObject<R>;
-
-export type BrandedPermission = string & { __brandedPermission: true };
-
-export function buildPermission<R extends AuthZRelation>(
-	relation: R,
-	object: AuthZObject<R>,
-): BrandedPermission {
-	return `${relation}${PermissionSeparator}${object}` as BrandedPermission;
-}
-
-export function buildObjectString(
-	resource: AuthZResource,
-	objectId: string,
-): `${AuthZResource}${typeof ObjectSeparator}${string}` {
-	return `${resource}${ObjectSeparator}${objectId}` as const;
-}
-
-export function parsePermission(
-	permission: BrandedPermission,
-): {
-	relation: AuthZRelation;
-	object: string;
-} {
-	const [relation, object] = permission.split(PermissionSeparator);
-	return { relation: relation as AuthZRelation, object };
-}
-
-const resourceNameToType = permissionsType.data.resources.reduce((acc, r) => {
-	acc[r.name] = r.type;
-	return acc;
-}, {} as Record<ResourceName, ResourceType>);
-
-export function permissionToTransactionDto(
-	permission: BrandedPermission,
-): AuthtypesTransactionDTO {
-	const { relation, object: objectStr } = parsePermission(permission);
-	const directType = resourceNameToType[objectStr as ResourceName];
-	if (directType === 'metaresources') {
-		return {
-			relation,
-			object: {
-				resource: { name: objectStr, type: directType },
-				selector: '*',
-			},
-		};
-	}
-	const [resourceName, selector] = objectStr.split(ObjectSeparator);
-	const type =
-		resourceNameToType[resourceName as ResourceName] ?? 'metaresource';
-
-	return {
-		relation,
-		object: {
-			resource: { name: resourceName, type },
-			selector: selector || '*',
-		},
-	};
-}
-
-export function gettableTransactionToPermission(
-	item: AuthtypesTransactionDTO,
-): BrandedPermission {
-	const {
-		relation,
-		object: { resource, selector },
-	} = item;
-	const resourceName = String(resource.name);
-	const selectorStr = typeof selector === 'string' ? selector : '*';
-	const objectStr =
-		resource.type === 'metaresources'
-			? resourceName
-			: `${resourceName}${ObjectSeparator}${selectorStr}`;
-	return `${relation}${PermissionSeparator}${objectStr}` as BrandedPermission;
-}

frontend/src/hooks/useIsTextSelected.ts

@@ -0,0 +1,10 @@
+import { useCallback } from 'react';
+
+export function useIsTextSelected(): () => boolean {
+	return useCallback((): boolean => {
+		const selection = window.getSelection();
+		return (
+			!!selection && !selection.isCollapsed && selection.toString().length > 0
+		);
+	}, []);
+}

pkg/signoz/provider.go

@@ -169,6 +169,7 @@ func NewSQLMigrationProviderFactories(
 		sqlmigration.NewAddAnonymousPublicDashboardTransactionFactory(sqlstore),
 		sqlmigration.NewAddRootUserFactory(sqlstore, sqlschema),
 		sqlmigration.NewAddUserEmailOrgIDIndexFactory(sqlstore, sqlschema),
+		sqlmigration.NewMigrateRulesV4ToV5Factory(sqlstore, telemetryStore),
 	)
 }
 

pkg/sqlmigration/066_migrate_rules_v4_to_v5_post_deprecation.go

@@ -0,0 +1,209 @@
+package sqlmigration
+
+import (
+	"context"
+	"database/sql"
+	"encoding/json"
+	"log/slog"
+
+	"github.com/SigNoz/signoz/pkg/factory"
+	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/telemetrystore"
+	"github.com/SigNoz/signoz/pkg/transition"
+	"github.com/uptrace/bun"
+	"github.com/uptrace/bun/migrate"
+)
+
+type migrateRulesV4ToV5 struct {
+	store          sqlstore.SQLStore
+	telemetryStore telemetrystore.TelemetryStore
+	logger         *slog.Logger
+}
+
+func NewMigrateRulesV4ToV5Factory(
+	store sqlstore.SQLStore,
+	telemetryStore telemetrystore.TelemetryStore,
+) factory.ProviderFactory[SQLMigration, Config] {
+	return factory.NewProviderFactory(
+		factory.MustNewName("migrate_rules_post_deprecation"),
+		func(ctx context.Context, ps factory.ProviderSettings, c Config) (SQLMigration, error) {
+			return &migrateRulesV4ToV5{
+				store:          store,
+				telemetryStore: telemetryStore,
+				logger:         ps.Logger,
+			}, nil
+		})
+}
+
+func (migration *migrateRulesV4ToV5) Register(migrations *migrate.Migrations) error {
+	if err := migrations.Register(migration.Up, migration.Down); err != nil {
+		return err
+	}
+	return nil
+}
+
+func (migration *migrateRulesV4ToV5) getLogDuplicateKeys(ctx context.Context) ([]string, error) {
+	query := `
+		SELECT name
+		FROM (
+			SELECT DISTINCT name FROM signoz_logs.distributed_logs_attribute_keys
+			INTERSECT
+			SELECT DISTINCT name FROM signoz_logs.distributed_logs_resource_keys
+		)
+		ORDER BY name
+	`
+
+	rows, err := migration.telemetryStore.ClickhouseDB().Query(ctx, query)
+	if err != nil {
+		migration.logger.WarnContext(ctx, "failed to query log duplicate keys", "error", err)
+		return nil, nil
+	}
+	defer rows.Close()
+
+	var keys []string
+	for rows.Next() {
+		var key string
+		if err := rows.Scan(&key); err != nil {
+			migration.logger.WarnContext(ctx, "failed to scan log duplicate key", "error", err)
+			continue
+		}
+		keys = append(keys, key)
+	}
+
+	return keys, nil
+}
+
+func (migration *migrateRulesV4ToV5) getTraceDuplicateKeys(ctx context.Context) ([]string, error) {
+	query := `
+		SELECT tagKey
+		FROM signoz_traces.distributed_span_attributes_keys
+		WHERE tagType IN ('tag', 'resource')
+		GROUP BY tagKey
+		HAVING COUNT(DISTINCT tagType) > 1
+		ORDER BY tagKey
+	`
+
+	rows, err := migration.telemetryStore.ClickhouseDB().Query(ctx, query)
+	if err != nil {
+		migration.logger.WarnContext(ctx, "failed to query trace duplicate keys", "error", err)
+		return nil, nil
+	}
+	defer rows.Close()
+
+	var keys []string
+	for rows.Next() {
+		var key string
+		if err := rows.Scan(&key); err != nil {
+			migration.logger.WarnContext(ctx, "failed to scan trace duplicate key", "error", err)
+			continue
+		}
+		keys = append(keys, key)
+	}
+
+	return keys, nil
+}
+
+func (migration *migrateRulesV4ToV5) Up(ctx context.Context, db *bun.DB) error {
+	logsKeys, err := migration.getLogDuplicateKeys(ctx)
+	if err != nil {
+		return err
+	}
+
+	tracesKeys, err := migration.getTraceDuplicateKeys(ctx)
+	if err != nil {
+		return err
+	}
+
+	tx, err := db.BeginTx(ctx, nil)
+	if err != nil {
+		return err
+	}
+
+	defer func() {
+		_ = tx.Rollback()
+	}()
+
+	var rules []struct {
+		ID   string         `bun:"id"`
+		Data map[string]any `bun:"data"`
+	}
+
+	err = tx.NewSelect().
+		Table("rule").
+		Column("id", "data").
+		Scan(ctx, &rules)
+	if err != nil {
+		if err == sql.ErrNoRows {
+			return nil
+		}
+		return err
+	}
+
+	alertsMigrator := transition.NewAlertMigrateV5(migration.logger, logsKeys, tracesKeys)
+
+	count := 0
+
+	for _, rule := range rules {
+		version, _ := rule.Data["version"].(string)
+
+		if version == "v5" {
+			continue
+		}
+
+		if version == "" {
+			migration.logger.WarnContext(ctx, "unexpected empty version for rule", "rule_id", rule.ID)
+		}
+
+		migration.logger.InfoContext(ctx, "migrating rule v4 to v5", "rule_id", rule.ID, "current_version", version)
+
+		// Check if the queries envelope already exists and is non-empty
+		hasQueriesEnvelope := false
+		if condition, ok := rule.Data["condition"].(map[string]any); ok {
+			if compositeQuery, ok := condition["compositeQuery"].(map[string]any); ok {
+				if queries, ok := compositeQuery["queries"].([]any); ok && len(queries) > 0 {
+					hasQueriesEnvelope = true
+				}
+			}
+		}
+
+		if hasQueriesEnvelope {
+			// already has queries envelope, just bump version
+			// this is because user made a mistake of choosing version
+			migration.logger.InfoContext(ctx, "rule already has queries envelope, bumping version", "rule_id", rule.ID)
+			rule.Data["version"] = "v5"
+		} else {
+			// old format, run full migration
+			migration.logger.InfoContext(ctx, "rule has old format, running full migration", "rule_id", rule.ID)
+			updated := alertsMigrator.Migrate(ctx, rule.Data)
+			if !updated {
+				migration.logger.WarnContext(ctx, "expected updated to be true but got false", "rule_id", rule.ID)
+				continue
+			}
+			rule.Data["version"] = "v5"
+		}
+
+		dataJSON, err := json.Marshal(rule.Data)
+		if err != nil {
+			return err
+		}
+
+		_, err = tx.NewUpdate().
+			Table("rule").
+			Set("data = ?", string(dataJSON)).
+			Where("id = ?", rule.ID).
+			Exec(ctx)
+		if err != nil {
+			return err
+		}
+		count++
+	}
+	if count != 0 {
+		migration.logger.InfoContext(ctx, "migrate v4 alerts", "count", count)
+	}
+
+	return tx.Commit()
+}
+
+func (migration *migrateRulesV4ToV5) Down(ctx context.Context, db *bun.DB) error {
+	return nil
+}

pkg/types/ruletypes/api_params.go

@@ -355,6 +355,10 @@ func (r *PostableRule) validate() error {
 		errs = append(errs, signozError.NewInvalidInputf(signozError.CodeInvalidInput, "composite query is required"))
 	}
 
+	if r.Version != "v5" {
+		errs = append(errs, signozError.NewInvalidInputf(signozError.CodeInvalidInput, "only version v5 is supported, got %q", r.Version))
+	}
+
 	if isAllQueriesDisabled(r.RuleCondition.CompositeQuery) {
 		errs = append(errs, signozError.NewInvalidInputf(signozError.CodeInvalidInput, "all queries are disabled in rule condition"))
 	}

pkg/types/ruletypes/api_params_test.go

@@ -108,6 +108,7 @@ func TestParseIntoRule(t *testing.T) {
 				"ruleType": "threshold_rule",
 				"evalWindow": "5m",
 				"frequency": "1m",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -150,6 +151,7 @@ func TestParseIntoRule(t *testing.T) {
 			content: []byte(`{
 				"alert": "DefaultsRule",
 				"ruleType": "threshold_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -187,6 +189,7 @@ func TestParseIntoRule(t *testing.T) {
 			initRule: PostableRule{},
 			content: []byte(`{
 				"alert": "PromQLRule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "promql",
@@ -256,6 +259,7 @@ func TestParseIntoRuleSchemaVersioning(t *testing.T) {
 			content: []byte(`{
 				"alert": "SeverityLabelTest",
 				"schemaVersion": "v1",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -344,6 +348,7 @@ func TestParseIntoRuleSchemaVersioning(t *testing.T) {
 			content: []byte(`{
 				"alert": "NoLabelsTest",
 				"schemaVersion": "v1",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -384,6 +389,7 @@ func TestParseIntoRuleSchemaVersioning(t *testing.T) {
 			content: []byte(`{
 				"alert": "OverwriteTest",
 				"schemaVersion": "v1",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -474,6 +480,7 @@ func TestParseIntoRuleSchemaVersioning(t *testing.T) {
 			content: []byte(`{
 				"alert": "V2Test",
 				"schemaVersion": "v2",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -517,6 +524,7 @@ func TestParseIntoRuleSchemaVersioning(t *testing.T) {
 			initRule: PostableRule{},
 			content: []byte(`{
 				"alert": "DefaultSchemaTest",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -569,6 +577,7 @@ func TestParseIntoRuleSchemaVersioning(t *testing.T) {
 func TestParseIntoRuleThresholdGeneration(t *testing.T) {
 	content := []byte(`{
 		"alert": "TestThresholds",
+		"version": "v5",
 		"condition": {
 			"compositeQuery": {
 				"queryType": "builder",
@@ -639,6 +648,7 @@ func TestParseIntoRuleMultipleThresholds(t *testing.T) {
 		"schemaVersion": "v2",
 		"alert": "MultiThresholdAlert",
 		"ruleType": "threshold_rule",
+		"version": "v5",
 		"condition": {
 			"compositeQuery": {
 				"queryType": "builder",
@@ -732,6 +742,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "AnomalyBelowTest",
 				"ruleType": "anomaly_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -766,6 +777,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "AnomalyBelowTest",
 				"ruleType": "anomaly_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -799,6 +811,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "AnomalyAboveTest",
 				"ruleType": "anomaly_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -833,6 +846,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "AnomalyAboveTest",
 				"ruleType": "anomaly_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -866,6 +880,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "AnomalyBelowAllTest",
 				"ruleType": "anomaly_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -901,6 +916,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "AnomalyBelowAllTest",
 				"ruleType": "anomaly_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -935,6 +951,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "AnomalyOutOfBoundsTest",
 				"ruleType": "anomaly_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -969,6 +986,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "ThresholdTest",
 				"ruleType": "threshold_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",
@@ -1003,6 +1021,7 @@ func TestAnomalyNegationEval(t *testing.T) {
 			ruleJSON: []byte(`{
 				"alert": "ThresholdTest",
 				"ruleType": "threshold_rule",
+				"version": "v5",
 				"condition": {
 					"compositeQuery": {
 						"queryType": "builder",