chore: authz helpers

Co-authored-by: primus-bot[bot] <171087277+primus-bot[bot]@users.noreply.github.com>

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

@@ -0,0 +1,46 @@
+name: Check Permissions Type Generation
+
+on:
+  pull_request:
+    branches:
+      - main
+    paths:
+      - "pkg/authz/**"
+      - "pkg/types/authtypes/**"
+      - "pkg/types/roletypes/**"
+      - "cmd/**/Dockerfile*"
+      - "frontend/src/hooks/useAuthZ/**"
+  workflow_dispatch:
+
+jobs:
+  check-permissions-type-generation:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v5
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v5
+        with:
+          node-version: "22"
+
+      - name: Install frontend dependencies
+        working-directory: ./frontend
+        run: |
+          yarn install
+
+      - 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
+        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/docker-compose.ha.yaml

@@ -190,7 +190,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.112.1
+    image: signoz/signoz:v0.113.0
     ports:
       - "8080:8080" # signoz port
     #   - "6060:6060"     # pprof port
@@ -213,7 +213,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:v0.142.1
+    image: signoz/signoz-otel-collector:v0.144.1
     entrypoint:
       - /bin/sh
     command:
@@ -241,7 +241,7 @@ services:
       replicas: 3
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:v0.144.1
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_CLUSTER=cluster

deploy/docker-swarm/docker-compose.yaml

@@ -117,7 +117,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.112.1
+    image: signoz/signoz:v0.113.0
     ports:
       - "8080:8080" # signoz port
     volumes:
@@ -139,7 +139,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:v0.142.1
+    image: signoz/signoz-otel-collector:v0.144.1
     entrypoint:
       - /bin/sh
     command:
@@ -167,7 +167,7 @@ services:
       replicas: 3
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:v0.144.1
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_CLUSTER=cluster

deploy/docker/docker-compose.ha.yaml

@@ -181,7 +181,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.112.1}
+    image: signoz/signoz:${VERSION:-v0.113.0}
     container_name: signoz
     ports:
       - "8080:8080" # signoz port
@@ -204,7 +204,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.1}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-otel-collector
     entrypoint:
       - /bin/sh
@@ -229,7 +229,7 @@ services:
       - "4318:4318" # OTLP HTTP receiver
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-telemetrystore-migrator
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000

deploy/docker/docker-compose.yaml

@@ -109,7 +109,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.112.1}
+    image: signoz/signoz:${VERSION:-v0.113.0}
     container_name: signoz
     ports:
       - "8080:8080" # signoz port
@@ -132,7 +132,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.1}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-otel-collector
     entrypoint:
       - /bin/sh
@@ -157,7 +157,7 @@ services:
       - "4318:4318" # OTLP HTTP receiver
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-telemetrystore-migrator
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000

frontend/.eslintrc.js

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

frontend/package.json

@@ -19,7 +19,8 @@
 		"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:api": "orval --config ./orval.config.ts && sh scripts/post-types-generation.sh",
+		"generate:permissions-type": "node scripts/generate-permissions-type.js"
 	},
 	"engines": {
 		"node": ">=16.15.0"

frontend/scripts/generate-permissions-type.js

@@ -0,0 +1,279 @@
+#!/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

@@ -0,0 +1,321 @@
+import { ReactElement } from 'react-markdown/lib/react-markdown';
+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 { BrandedPermission } from 'hooks/useAuthZ/types';
+
+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

@@ -0,0 +1,50 @@
+import { ReactElement } from 'react';
+import {
+	AuthZObject,
+	AuthZRelation,
+	BrandedPermission,
+} from 'hooks/useAuthZ/types';
+import { useAuthZ } from 'hooks/useAuthZ/useAuthZ';
+import { 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

@@ -0,0 +1,41 @@
+.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(--l1-foreground);
+    line-height: 18px;
+  }
+
+  p {
+    font-size: 14px;
+    color: var(--l3-foreground);
+    line-height: 18px;
+
+    span {
+      background-color: var(--l3-background);
+      white-space: nowrap;
+      padding: 0 2px;
+    }
+  }
+}

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

@@ -0,0 +1,472 @@
+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 { 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 () => {
+		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.getByText('update')).toBeInTheDocument();
+		expect(screen.getByText('dashboard:123')).toBeInTheDocument();
+		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

@@ -0,0 +1,73 @@
+import { ComponentType, ReactElement, useMemo } from 'react';
+import { RouteComponentProps } from 'react-router-dom';
+import {
+	AuthZObject,
+	AuthZRelation,
+	BrandedPermission,
+} from 'hooks/useAuthZ/types';
+import { parsePermission } from 'hooks/useAuthZ/utils';
+
+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 { relation, object } = parsePermission(response.requiredPermissionName);
+
+	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 />
+					Relation: <span>{relation}</span>
+					<br />
+					Object: <span>{object}</span>
+					<br />
+					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/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/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/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,7 +1,6 @@
-import { ReactNode, useCallback, useEffect, useRef, useState } from 'react';
+import { ReactNode, 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,
@@ -53,17 +52,6 @@ function Overview({
 	);
 	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'] = {
@@ -208,7 +196,7 @@ function Overview({
 							<>
 								{isSearchVisible && (
 									<Input
-										ref={searchInputRef}
+										autoFocus
 										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/LogsExplorerList/InfinityTableView/index.tsx

@@ -139,8 +139,7 @@ const InfinityTable = forwardRef<TableVirtuosoHandle, InfinityTableProps>(
 					{tableColumns
 						.filter((column) => column.key)
 						.map((column) => {
-							const isDragColumn =
-								column.key !== 'expand' && column.key !== 'state-indicator';
+							const isDragColumn = column.key !== 'expand';
 
 							return (
 								<TableHeaderCellStyled

frontend/src/container/PipelinePage/PipelineListsView/AddNewPipeline/FormFields/FilterInput/index.tsx

@@ -1,7 +1,7 @@
 import { useTranslation } from 'react-i18next';
 import { Form } from 'antd';
 import { initialQueryBuilderFormValuesMap } from 'constants/queryBuilder';
-import QueryBuilderSearch from 'container/QueryBuilder/filters/QueryBuilderSearch';
+import QueryBuilderSearchV2 from 'container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2';
 import isEqual from 'lodash-es/isEqual';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
@@ -30,7 +30,7 @@ function TagFilterInput({
 	};
 
 	return (
-		<QueryBuilderSearch
+		<QueryBuilderSearchV2
 			query={query}
 			onChange={onQueryChange}
 			placeholder={placeholder}

frontend/src/container/PipelinePage/tests/PipelineListsView.test.tsx

@@ -86,7 +86,7 @@ jest.mock('providers/preferences/sync/usePreferenceSync', () => ({
 }));
 
 const BASE_URL = ENVIRONMENT.baseURL;
-const attributeKeysURL = `${BASE_URL}/api/v3/autocomplete/attribute_keys`;
+const attributeKeysURL = `${BASE_URL}/api/v3/filter_suggestions`;
 
 describe('PipelinePage container test', () => {
 	beforeAll(() => {
@@ -333,26 +333,34 @@ describe('PipelinePage container test', () => {
 					ctx.json({
 						status: 'success',
 						data: {
-							attributeKeys: [
+							attributes: [
 								{
 									key: 'otelServiceName',
 									dataType: DataTypes.String,
 									type: 'tag',
+									isColumn: false,
+									isJSON: false,
+								},
+								{
+									key: 'service.name',
+									dataType: DataTypes.String,
+									type: 'resource',
+									isColumn: false,
+									isJSON: false,
 								},
 								{
 									key: 'service.instance.id',
 									dataType: DataTypes.String,
 									type: 'resource',
-								},
-								{
-									key: 'service.name',
-									dataType: DataTypes.String,
-									type: 'resource',
+									isColumn: false,
+									isJSON: false,
 								},
 								{
 									key: 'service.name',
 									dataType: DataTypes.String,
 									type: 'tag',
+									isColumn: false,
+									isJSON: false,
 								},
 							],
 						},

frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.tsx

@@ -973,6 +973,7 @@ function QueryBuilderSearchV2(
 	return (
 		<div className="query-builder-search-v2">
 			<Select
+				data-testid={'qb-search-select'}
 				ref={selectRef}
 				// eslint-disable-next-line react/jsx-props-no-spreading
 				{...(hasPopupContainer ? { getPopupContainer: popupContainer } : {})}

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/useAuthZ/permissions.type.ts

@@ -0,0 +1,23 @@
+// 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/types.ts

@@ -0,0 +1,57 @@
+import permissionsType from './permissions.type';
+import { ObjectSeparator } from './utils';
+
+type PermissionsData = typeof permissionsType.data;
+export type Resource = PermissionsData['resources'][number];
+export type ResourceName = Resource['name'];
+export 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 type AuthZCheckResponse = Record<
+	BrandedPermission,
+	{
+		isGranted: boolean;
+	}
+>;
+
+export type UseAuthZResult = {
+	isLoading: boolean;
+	error: Error | null;
+	permissions: AuthZCheckResponse | null;
+};

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

@@ -0,0 +1,496 @@
+import { ReactElement } from 'react';
+import { renderHook, waitFor } from '@testing-library/react';
+import {
+	AuthtypesGettableTransactionDTO,
+	AuthtypesTransactionDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import { ENVIRONMENT } from 'constants/env';
+import { server } from 'mocks-server/server';
+import { rest } from 'msw';
+import { AllTheProviders } from 'tests/test-utils';
+
+import { BrandedPermission } from './types';
+import { useAuthZ } from './useAuthZ';
+import { 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

@@ -0,0 +1,129 @@
+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 { AuthZCheckResponse, BrandedPermission, UseAuthZResult } from './types';
+import {
+	gettableTransactionToPermission,
+	permissionToTransactionDto,
+} from './utils';
+
+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

@@ -0,0 +1,85 @@
+import { AuthtypesTransactionDTO } from '../../api/generated/services/sigNoz.schemas';
+import permissionsType from './permissions.type';
+import {
+	AuthZObject,
+	AuthZRelation,
+	AuthZResource,
+	BrandedPermission,
+	ResourceName,
+	ResourceType,
+} from './types';
+
+export const PermissionSeparator = '||__||';
+export const ObjectSeparator = ':';
+
+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;
+}

pkg/modules/promote/implpromote/module.go

@@ -87,7 +87,7 @@ func (m *module) ListPromotedAndIndexedPaths(ctx context.Context) ([]promotetype
 }
 
 func (m *module) listPromotedPaths(ctx context.Context) ([]string, error) {
-	paths, err := m.metadataStore.ListPromotedPaths(ctx)
+	paths, err := m.metadataStore.GetPromotedPaths(ctx)
 	if err != nil {
 		return nil, err
 	}
@@ -142,7 +142,7 @@ func (m *module) PromoteAndIndexPaths(
 		pathsStr = append(pathsStr, path.Path)
 	}
 
-	existingPromotedPaths, err := m.metadataStore.ListPromotedPaths(ctx, pathsStr...)
+	existingPromotedPaths, err := m.metadataStore.GetPromotedPaths(ctx, pathsStr...)
 	if err != nil {
 		return err
 	}

pkg/telemetrymetadata/body_json_metadata.go

@@ -10,7 +10,6 @@ import (
 	"github.com/ClickHouse/clickhouse-go/v2/lib/chcol"
 	schemamigrator "github.com/SigNoz/signoz-otel-collector/cmd/signozschemamigrator/schema_migrator"
 	"github.com/SigNoz/signoz-otel-collector/constants"
-	"github.com/SigNoz/signoz-otel-collector/utils"
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/querybuilder"
 	"github.com/SigNoz/signoz/pkg/telemetrylogs"
@@ -113,7 +112,7 @@ func (t *telemetryMetaStore) buildBodyJSONPaths(ctx context.Context,
 
 	for _, fieldKey := range fieldKeys {
 		promotedKey := strings.Split(fieldKey.Name, telemetrytypes.ArraySep)[0]
-		fieldKey.Materialized = promoted.Contains(promotedKey)
+		fieldKey.Materialized = promoted[promotedKey]
 		fieldKey.Indexes = indexes[fieldKey.Name]
 	}
 
@@ -295,33 +294,6 @@ func (t *telemetryMetaStore) ListLogsJSONIndexes(ctx context.Context, filters ..
 	return indexes, nil
 }
 
-func (t *telemetryMetaStore) ListPromotedPaths(ctx context.Context, paths ...string) (map[string]struct{}, error) {
-	sb := sqlbuilder.Select("path").From(fmt.Sprintf("%s.%s", DBName, PromotedPathsTableName))
-	pathConditions := []string{}
-	for _, path := range paths {
-		pathConditions = append(pathConditions, sb.Equal("path", path))
-	}
-	sb.Where(sb.Or(pathConditions...))
-	query, args := sb.BuildWithFlavor(sqlbuilder.ClickHouse)
-
-	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, args...)
-	if err != nil {
-		return nil, errors.WrapInternalf(err, CodeFailLoadPromotedPaths, "failed to load promoted paths")
-	}
-	defer rows.Close()
-
-	next := make(map[string]struct{})
-	for rows.Next() {
-		var path string
-		if err := rows.Scan(&path); err != nil {
-			return nil, errors.WrapInternalf(err, CodeFailLoadPromotedPaths, "failed to scan promoted path")
-		}
-		next[path] = struct{}{}
-	}
-
-	return next, nil
-}
-
 // TODO(Piyush): Remove this if not used in future
 func (t *telemetryMetaStore) ListJSONValues(ctx context.Context, path string, limit int) (*telemetrytypes.TelemetryFieldValues, bool, error) {
 	path = CleanPathPrefixes(path)
@@ -484,11 +456,12 @@ func derefValue(v any) any {
 	return val.Interface()
 }
 
-// IsPathPromoted checks if a specific path is promoted
+// IsPathPromoted checks if a specific path is promoted (Column Evolution table: field_name for logs body).
 func (t *telemetryMetaStore) IsPathPromoted(ctx context.Context, path string) (bool, error) {
 	split := strings.Split(path, telemetrytypes.ArraySep)
-	query := fmt.Sprintf("SELECT 1 FROM %s.%s WHERE path = ? LIMIT 1", DBName, PromotedPathsTableName)
-	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, split[0])
+	pathSegment := split[0]
+	query := fmt.Sprintf("SELECT 1 FROM %s.%s WHERE signal = ? AND column_name = ? AND field_context = ? AND field_name = ? LIMIT 1", DBName, PromotedPathsTableName)
+	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, telemetrytypes.SignalLogs, telemetrylogs.LogsV2BodyPromotedColumn, telemetrytypes.FieldContextBody, pathSegment)
 	if err != nil {
 		return false, errors.WrapInternalf(err, CodeFailCheckPathPromoted, "failed to check if path %s is promoted", path)
 	}
@@ -497,15 +470,24 @@ func (t *telemetryMetaStore) IsPathPromoted(ctx context.Context, path string) (b
 	return rows.Next(), nil
 }
 
-// GetPromotedPaths checks if a specific path is promoted
-func (t *telemetryMetaStore) GetPromotedPaths(ctx context.Context, paths ...string) (*utils.ConcurrentSet[string], error) {
-	sb := sqlbuilder.Select("path").From(fmt.Sprintf("%s.%s", DBName, PromotedPathsTableName))
-	pathConditions := []string{}
-	for _, path := range paths {
-		split := strings.Split(path, telemetrytypes.ArraySep)
-		pathConditions = append(pathConditions, sb.Equal("path", split[0]))
+// GetPromotedPaths returns promoted paths from the Column Evolution table (field_name for logs body).
+func (t *telemetryMetaStore) GetPromotedPaths(ctx context.Context, paths ...string) (map[string]bool, error) {
+	sb := sqlbuilder.Select("field_name").From(fmt.Sprintf("%s.%s", DBName, PromotedPathsTableName))
+	conditions := []string{
+		sb.Equal("signal", telemetrytypes.SignalLogs),
+		sb.Equal("column_name", telemetrylogs.LogsV2BodyPromotedColumn),
+		sb.Equal("field_context", telemetrytypes.FieldContextBody),
+		sb.NotEqual("field_name", "__all__"),
 	}
-	sb.Where(sb.Or(pathConditions...))
+	if len(paths) > 0 {
+		pathArgs := make([]interface{}, len(paths))
+		for i, path := range paths {
+			split := strings.Split(path, telemetrytypes.ArraySep)
+			pathArgs[i] = split[0]
+		}
+		conditions = append(conditions, sb.In("field_name", pathArgs))
+	}
+	sb.Where(sb.And(conditions...))
 
 	query, args := sb.BuildWithFlavor(sqlbuilder.ClickHouse)
 	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, args...)
@@ -514,13 +496,13 @@ func (t *telemetryMetaStore) GetPromotedPaths(ctx context.Context, paths ...stri
 	}
 	defer rows.Close()
 
-	promotedPaths := utils.NewConcurrentSet[string]()
+	promotedPaths := make(map[string]bool)
 	for rows.Next() {
-		var path string
-		if err := rows.Scan(&path); err != nil {
+		var fieldName string
+		if err := rows.Scan(&fieldName); err != nil {
 			return nil, errors.WrapInternalf(err, CodeFailCheckPathPromoted, "failed to scan promoted path")
 		}
-		promotedPaths.Insert(path)
+		promotedPaths[fieldName] = true
 	}
 
 	return promotedPaths, nil
@@ -534,21 +516,22 @@ func CleanPathPrefixes(path string) string {
 	return path
 }
 
+// PromotePaths inserts promoted paths into the Column Evolution table (same schema as signoz-otel-collector metadata_migrations).
 func (t *telemetryMetaStore) PromotePaths(ctx context.Context, paths ...string) error {
 	batch, err := t.telemetrystore.ClickhouseDB().PrepareBatch(ctx,
-		fmt.Sprintf("INSERT INTO %s.%s (path, created_at) VALUES", DBName,
+		fmt.Sprintf("INSERT INTO %s.%s (signal, column_name, column_type, field_context, field_name, version, release_time) VALUES", DBName,
 			PromotedPathsTableName))
 	if err != nil {
 		return errors.WrapInternalf(err, CodeFailedToPrepareBatch, "failed to prepare batch")
 	}
 
-	nowMs := uint64(time.Now().UnixMilli())
+	releaseTime := time.Now().UnixNano()
 	for _, p := range paths {
 		trimmed := strings.TrimSpace(p)
 		if trimmed == "" {
 			continue
 		}
-		if err := batch.Append(trimmed, nowMs); err != nil {
+		if err := batch.Append(telemetrytypes.SignalLogs, telemetrylogs.LogsV2BodyPromotedColumn, "JSON()", telemetrytypes.FieldContextBody, trimmed, 0, releaseTime); err != nil {
 			_ = batch.Abort()
 			return errors.WrapInternalf(err, CodeFailedToAppendPath, "failed to append path")
 		}

pkg/telemetrymetadata/tables.go

@@ -7,6 +7,7 @@ const (
 	AttributesMetadataTableName      = "distributed_attributes_metadata"
 	AttributesMetadataLocalTableName = "attributes_metadata"
 	PathTypesTableName               = otelcollectorconst.DistributedPathTypesTable
-	PromotedPathsTableName           = otelcollectorconst.DistributedPromotedPathsTable
+	// Column Evolution table stores promoted paths as (signal, column_name, field_context, field_name); see signoz-otel-collector metadata_migrations.
+	PromotedPathsTableName           = "distributed_column_evolution_metadata"
 	SkipIndexTableName               = "system.data_skipping_indices"
 )

pkg/types/telemetrytypes/store.go

@@ -36,7 +36,7 @@ type MetadataStore interface {
 	ListLogsJSONIndexes(ctx context.Context, filters ...string) (map[string][]schemamigrator.Index, error)
 
 	// ListPromotedPaths lists the promoted paths.
-	ListPromotedPaths(ctx context.Context, paths ...string) (map[string]struct{}, error)
+	GetPromotedPaths(ctx context.Context, paths ...string) (map[string]bool, error)
 
 	// PromotePaths promotes the paths.
 	PromotePaths(ctx context.Context, paths ...string) error

pkg/types/telemetrytypes/telemetrytypestest/metadata_store.go

@@ -16,7 +16,7 @@ type MockMetadataStore struct {
 	RelatedValuesMap   map[string][]string
 	AllValuesMap       map[string]*telemetrytypes.TelemetryFieldValues
 	TemporalityMap     map[string]metrictypes.Temporality
-	PromotedPathsMap   map[string]struct{}
+	PromotedPathsMap   map[string]bool
 	LogsJSONIndexesMap map[string][]schemamigrator.Index
 	LookupKeysMap      map[telemetrytypes.MetricMetadataLookupKey]int64
 }
@@ -28,7 +28,7 @@ func NewMockMetadataStore() *MockMetadataStore {
 		RelatedValuesMap:   make(map[string][]string),
 		AllValuesMap:       make(map[string]*telemetrytypes.TelemetryFieldValues),
 		TemporalityMap:     make(map[string]metrictypes.Temporality),
-		PromotedPathsMap:   make(map[string]struct{}),
+		PromotedPathsMap:   make(map[string]bool),
 		LogsJSONIndexesMap: make(map[string][]schemamigrator.Index),
 		LookupKeysMap:      make(map[telemetrytypes.MetricMetadataLookupKey]int64),
 	}
@@ -295,13 +295,13 @@ func (m *MockMetadataStore) SetTemporality(metricName string, temporality metric
 // PromotePaths promotes the paths.
 func (m *MockMetadataStore) PromotePaths(ctx context.Context, paths ...string) error {
 	for _, path := range paths {
-		m.PromotedPathsMap[path] = struct{}{}
+		m.PromotedPathsMap[path] = true
 	}
 	return nil
 }
 
-// ListPromotedPaths lists the promoted paths.
-func (m *MockMetadataStore) ListPromotedPaths(ctx context.Context, paths ...string) (map[string]struct{}, error) {
+// GetPromotedPaths returns the promoted paths.
+func (m *MockMetadataStore) GetPromotedPaths(ctx context.Context, paths ...string) (map[string]bool, error) {
 	return m.PromotedPathsMap, nil
 }