feat(no-auth): updated banner text

frontend/src/AppRoutes/__tests__/Private.test.tsx

@@ -166,6 +166,8 @@ function createMockAppContext(
 		userPreferences: [],
 		hostsData: null,
 		isLoggedIn: true,
+		isNoAuthMode: false,
+		isPreflightLoading: false,
 		org: [{ createdAt: 0, id: 'org-id', displayName: 'Test Org' }],
 		isFetchingUser: false,
 		isFetchingActiveLicense: false,

frontend/src/AppRoutes/index.tsx

@@ -59,6 +59,7 @@ function App(): JSX.Element {
 		isLoggedIn: isLoggedInState,
 		featureFlags,
 		org,
+		isPreflightLoading,
 	} = useAppContext();
 	const [routes, setRoutes] = useState<AppRoutes[]>(defaultRoutes);
 	const isAIAssistantEnabled = useIsAIAssistantEnabled();
@@ -386,6 +387,10 @@ function App(): JSX.Element {
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [isCloudUser, isEnterpriseSelfHostedUser]);
 
+	if (isPreflightLoading) {
+		return <Spinner tip="Loading..." />;
+	}
+
 	// if the user is in logged in state
 	if (isLoggedInState) {
 		// if the setup calls are loading then return a spinner

frontend/src/api/__tests__/interceptorRejected.no-auth.test.ts

@@ -0,0 +1,72 @@
+import axios from 'axios';
+import { getIsNoAuthMode } from 'utils/noAuthMode';
+
+import { interceptorRejected } from '../index';
+
+jest.mock('utils/noAuthMode', () => ({
+	getIsNoAuthMode: jest.fn(),
+}));
+
+jest.mock('api/v2/sessions/rotate/post', () => ({
+	__esModule: true,
+	default: jest.fn(),
+}));
+
+jest.mock('AppRoutes/utils', () => ({
+	__esModule: true,
+	default: jest.fn(),
+}));
+
+jest.mock('../utils', () => ({
+	Logout: jest.fn(),
+}));
+
+// oxlint-disable-next-line typescript/no-require-imports typescript/no-var-requires
+const post = require('api/v2/sessions/rotate/post').default;
+// oxlint-disable-next-line typescript/no-require-imports typescript/no-var-requires
+const { Logout } = require('../utils');
+
+describe('interceptorRejected — no-auth mode', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+		jest.spyOn(axios, 'isAxiosError').mockReturnValue(true);
+	});
+
+	it('does NOT call rotate or Logout when no-auth mode is enabled on 401', async () => {
+		(getIsNoAuthMode as jest.Mock).mockReturnValue(true);
+
+		const error = {
+			isAxiosError: true,
+			response: {
+				status: 401,
+				config: { url: '/dashboards', method: 'get' },
+			},
+			config: { url: '/dashboards', headers: {} },
+		};
+
+		await interceptorRejected(error as any).catch(() => {});
+
+		expect(post).not.toHaveBeenCalled();
+		expect(Logout).not.toHaveBeenCalled();
+	});
+
+	it('DOES attempt rotate when no-auth mode is disabled on 401', async () => {
+		(getIsNoAuthMode as jest.Mock).mockReturnValue(false);
+		(post as jest.Mock).mockResolvedValue({
+			data: { accessToken: 'a', refreshToken: 'b' },
+		});
+
+		const error = {
+			isAxiosError: true,
+			response: {
+				status: 401,
+				config: { url: '/dashboards', method: 'get' },
+			},
+			config: { url: '/dashboards', headers: {} },
+		};
+
+		await interceptorRejected(error as any).catch(() => {});
+
+		expect(post).toHaveBeenCalled();
+	});
+});

frontend/src/api/index.ts

@@ -13,6 +13,7 @@ import { Events } from 'constants/events';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import { getBasePath } from 'utils/basePath';
 import { eventEmitter } from 'utils/getEventEmitter';
+import { getIsNoAuthMode } from 'utils/noAuthMode';
 
 import apiV1, { apiAlertManager, apiV2, apiV3, apiV4, apiV5 } from './apiV1';
 import { Logout } from './utils';
@@ -108,7 +109,10 @@ export const interceptorRejected = async (
 		if (axios.isAxiosError(value) && value.response) {
 			const { response } = value;
 
+			const isNoAuthMode = getIsNoAuthMode();
+
 			if (
+				!isNoAuthMode &&
 				response.status === 401 &&
 				// if the session rotate call or the create session errors out with 401 or the delete sessions call returns 401 then we do not retry!
 				response.config.url !== '/sessions/rotate' &&
@@ -140,16 +144,20 @@ export const interceptorRejected = async (
 						return await Promise.resolve(reResponse);
 					} catch (error) {
 						if ((error as AxiosError)?.response?.status === 401) {
-							Logout();
+							void Logout();
 						}
 					}
 				} catch (error) {
-					Logout();
+					void Logout();
 				}
 			}
 
-			if (response.status === 401 && response.config.url === '/sessions/rotate') {
-				Logout();
+			if (
+				!isNoAuthMode &&
+				response.status === 401 &&
+				response.config.url === '/sessions/rotate'
+			) {
+				void Logout();
 			}
 		}
 		return await Promise.reject(value);

frontend/src/components/DropDown/DropDown.tsx

@@ -1,30 +1,46 @@
+import { useState } from 'react';
 import { Ellipsis } from '@signozhq/icons';
-import { DropdownMenuSimple, type MenuItem } from '@signozhq/ui/dropdown-menu';
-import { Button } from 'antd';
+import { Button, Dropdown, MenuProps } from 'antd';
 
 import './DropDown.styles.scss';
 
-type DropDownItemClick = (info: { key: string; keyPath: string[] }) => void;
-
 function DropDown({
 	element,
 	onDropDownItemClick,
 }: {
 	element: JSX.Element[];
-	onDropDownItemClick?: DropDownItemClick;
+	onDropDownItemClick?: MenuProps['onClick'];
 }): JSX.Element {
-	const items: MenuItem[] = element.map((e, index) => ({
-		key: String(index),
-		label: e,
-		onClick: onDropDownItemClick,
-	}));
+	const items: MenuProps['items'] = element.map(
+		(e: JSX.Element, index: number) => ({
+			label: e,
+			key: index,
+		}),
+	);
+
+	const [isDdOpen, setDdOpen] = useState<boolean>(false);
 
 	return (
-		<DropdownMenuSimple menu={{ items }}>
-			<Button type="link" className="dropdown-button">
+		<Dropdown
+			menu={{
+				items,
+				onMouseEnter: (): void => setDdOpen(true),
+				onMouseLeave: (): void => setDdOpen(false),
+				onClick: (item): void => onDropDownItemClick?.(item),
+			}}
+			open={isDdOpen}
+		>
+			<Button
+				type="link"
+				className={`dropdown-button`}
+				onClick={(e): void => {
+					e.preventDefault();
+					setDdOpen(true);
+				}}
+			>
 				<Ellipsis className="dropdown-icon" size={16} />
 			</Button>
-		</DropdownMenuSimple>
+		</Dropdown>
 	);
 }
 

frontend/src/components/EditMemberDrawer/EditMemberDrawer.tsx

@@ -19,6 +19,7 @@ import {
 } from 'api/generated/services/users';
 import { AxiosError } from 'axios';
 import { MemberRow } from 'components/MembersTable/MembersTable';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import RolesSelect, { useRoles } from 'components/RolesSelect';
 import SaveErrorItem from 'components/ServiceAccountDrawer/SaveErrorItem';
 import type { SaveError } from 'components/ServiceAccountDrawer/utils';
@@ -613,39 +614,43 @@ function EditMemberDrawer({
 					<div className="edit-member-drawer__footer-left">
 						<Tooltip title={getDeleteTooltip(isRootUser, isSelf)}>
 							<span className="edit-member-drawer__tooltip-wrapper">
-								<Button
-									onClick={(): void => setShowDeleteConfirm(true)}
-									disabled={isRootUser || isSelf}
-									variant="link"
-									color="destructive"
-								>
-									<Trash2 size={12} />
-									{isInvited ? 'Revoke Invite' : 'Delete Member'}
-								</Button>
+								<NoAuthGuard testId="no-auth-delete-member">
+									<Button
+										onClick={(): void => setShowDeleteConfirm(true)}
+										disabled={isRootUser || isSelf}
+										variant="link"
+										color="destructive"
+									>
+										<Trash2 size={12} />
+										{isInvited ? 'Revoke Invite' : 'Delete Member'}
+									</Button>
+								</NoAuthGuard>
 							</span>
 						</Tooltip>
 
 						<div className="edit-member-drawer__footer-divider" />
 						<Tooltip title={isRootUser ? ROOT_USER_TOOLTIP : undefined}>
 							<span className="edit-member-drawer__tooltip-wrapper">
-								<Button
-									onClick={handleGenerateResetLink}
-									disabled={isGeneratingLink || isRootUser || isLoadingTokenStatus}
-									variant="link"
-									color="warning"
-								>
-									<RefreshCw size={12} />
-									{isGeneratingLink
-										? 'Generating...'
-										: isInvited
-											? getInviteButtonLabel(
-													isLoadingTokenStatus,
-													existingToken,
-													isTokenExpired,
-													tokenNotFound,
-												)
-											: 'Generate Password Reset Link'}
-								</Button>
+								<NoAuthGuard testId="no-auth-generate-reset-link">
+									<Button
+										onClick={handleGenerateResetLink}
+										disabled={isGeneratingLink || isRootUser || isLoadingTokenStatus}
+										variant="link"
+										color="warning"
+									>
+										<RefreshCw size={12} />
+										{isGeneratingLink
+											? 'Generating...'
+											: isInvited
+												? getInviteButtonLabel(
+														isLoadingTokenStatus,
+														existingToken,
+														isTokenExpired,
+														tokenNotFound,
+													)
+												: 'Generate Password Reset Link'}
+									</Button>
+								</NoAuthGuard>
 							</span>
 						</Tooltip>
 					</div>
@@ -656,15 +661,17 @@ function EditMemberDrawer({
 							Cancel
 						</Button>
 
-						<Button
-							variant="solid"
-							color="primary"
-							disabled={!isDirty || isSaving || isRootUser}
-							onClick={handleSave}
-							loading={isSaving}
-						>
-							{isSaving ? 'Saving...' : 'Save Member Details'}
-						</Button>
+						<NoAuthGuard testId="no-auth-save-member">
+							<Button
+								variant="solid"
+								color="primary"
+								disabled={!isDirty || isSaving || isRootUser}
+								onClick={handleSave}
+								loading={isSaving}
+							>
+								{isSaving ? 'Saving...' : 'Save Member Details'}
+							</Button>
+						</NoAuthGuard>
 					</div>
 				</>
 			)}

frontend/src/components/EditMemberDrawer/__tests__/EditMemberDrawer.no-auth.test.tsx

@@ -0,0 +1,113 @@
+import {
+	useCreateResetPasswordToken,
+	useDeleteUser,
+	useGetResetPasswordToken,
+	useGetRolesByUserID,
+	useGetUser,
+	useRemoveUserRoleByUserIDAndRoleID,
+	useSetRoleByUserID,
+	useUpdateMyUserV2,
+	useUpdateUser,
+} from 'api/generated/services/users';
+import { MemberStatus } from 'container/MembersSettings/utils';
+import { managedRoles } from 'mocks-server/__mockdata__/roles';
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+import EditMemberDrawer from '../EditMemberDrawer';
+
+jest.mock('api/generated/services/users', () => ({
+	useDeleteUser: jest.fn(),
+	useGetUser: jest.fn(),
+	useGetRolesByUserID: jest.fn(),
+	useRemoveUserRoleByUserIDAndRoleID: jest.fn(),
+	useUpdateUser: jest.fn(),
+	useUpdateMyUserV2: jest.fn(),
+	useSetRoleByUserID: jest.fn(),
+	useGetResetPasswordToken: jest.fn(),
+	useCreateResetPasswordToken: jest.fn(),
+	getGetRolesByUserIDQueryKey: ({ id }: { id: string }): string[] => [
+		`/api/v2/users/${id}/roles`,
+	],
+}));
+
+const activeMember = {
+	id: 'user-1',
+	name: 'Alice Smith',
+	email: 'alice@signoz.io',
+	status: MemberStatus.Active,
+	joinedOn: '1700000000000',
+	updatedAt: '1710000000000',
+};
+
+function setupMocks(): void {
+	(useGetUser as jest.Mock).mockReturnValue({
+		data: {
+			data: {
+				id: 'user-1',
+				displayName: 'Alice Smith',
+				email: 'alice@signoz.io',
+				status: 'active',
+				userRoles: [
+					{ id: 'ur-1', roleId: managedRoles[0].id, role: managedRoles[0] },
+				],
+			},
+		},
+		isLoading: false,
+		refetch: jest.fn(),
+	});
+	(useGetRolesByUserID as jest.Mock).mockReturnValue({
+		data: { data: [managedRoles[0]] },
+		isLoading: false,
+	});
+	(useRemoveUserRoleByUserIDAndRoleID as jest.Mock).mockReturnValue({
+		mutateAsync: jest.fn().mockResolvedValue({}),
+		isLoading: false,
+	});
+	(useUpdateUser as jest.Mock).mockReturnValue({
+		mutateAsync: jest.fn().mockResolvedValue({}),
+		isLoading: false,
+	});
+	(useUpdateMyUserV2 as jest.Mock).mockReturnValue({
+		mutateAsync: jest.fn().mockResolvedValue({}),
+		isLoading: false,
+	});
+	(useSetRoleByUserID as jest.Mock).mockReturnValue({
+		mutateAsync: jest.fn().mockResolvedValue({}),
+		isLoading: false,
+	});
+	(useDeleteUser as jest.Mock).mockReturnValue({
+		mutate: jest.fn(),
+		isLoading: false,
+	});
+	(useGetResetPasswordToken as jest.Mock).mockReturnValue({
+		data: undefined,
+		isLoading: false,
+		isError: false,
+	});
+	(useCreateResetPasswordToken as jest.Mock).mockReturnValue({
+		mutateAsync: jest.fn().mockResolvedValue({}),
+		isLoading: false,
+	});
+}
+
+describe('EditMemberDrawer — no-auth mode', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+		setupMocks();
+	});
+
+	it('renders no-auth guard wrappers for all member mutation buttons', () => {
+		renderWithNoAuth(
+			<EditMemberDrawer
+				member={activeMember}
+				open
+				onClose={jest.fn()}
+				onComplete={jest.fn()}
+			/>,
+		);
+		expect(screen.getByTestId('no-auth-delete-member')).toBeInTheDocument();
+		expect(screen.getByTestId('no-auth-generate-reset-link')).toBeInTheDocument();
+		expect(screen.getByTestId('no-auth-save-member')).toBeInTheDocument();
+	});
+});

frontend/src/components/ExplorerCard/ExplorerCard.tsx

@@ -1,7 +1,15 @@
 import { useState } from 'react';
 import { useCopyToClipboard } from 'react-use';
-import { Button, Col, Popover, Row, Select, Space } from 'antd';
-import { DropdownMenuSimple, type MenuProps } from '@signozhq/ui/dropdown-menu';
+import {
+	Button,
+	Col,
+	Dropdown,
+	MenuProps,
+	Popover,
+	Row,
+	Select,
+	Space,
+} from 'antd';
 import { Typography } from '@signozhq/ui/typography';
 import axios from 'axios';
 import TextToolTip from 'components/TextToolTip';
@@ -233,9 +241,9 @@ function ExplorerCard({
 								</Popover>
 								<Share2 onClick={onCopyUrlHandler} size="md" />
 								{viewKey && (
-									<DropdownMenuSimple menu={moreOptionMenu}>
+									<Dropdown trigger={['click']} menu={moreOptionMenu}>
 										<Ellipsis size="md" />
-									</DropdownMenuSimple>
+									</Dropdown>
 								)}
 							</Space>
 						</OffSetCol>

frontend/src/components/NoAuthBanner/NoAuthBanner.module.scss

@@ -0,0 +1,13 @@
+.banner {
+	height: var(--spacing-20);
+
+	a {
+		color: var(--callout-warning-title);
+		text-decoration: underline;
+
+		&:hover {
+			color: var(--callout-warning-title);
+			opacity: 0.8;
+		}
+	}
+}

frontend/src/components/NoAuthBanner/NoAuthBanner.tsx

@@ -0,0 +1,26 @@
+import { PersistedAnnouncementBanner } from '@signozhq/ui/announcement-banner';
+
+import styles from './NoAuthBanner.module.scss';
+
+export function NoAuthBanner(): JSX.Element {
+	return (
+		<PersistedAnnouncementBanner
+			type="warning"
+			storageKey="no-auth-banner-v1"
+			testId="no-auth-banner"
+			className={styles.banner}
+		>
+			Impersonation mode: authentication is disabled. Anyone with access to this
+			instance has admin privileges.{' '}
+			<a
+				href="https://signoz.io/docs/manage/administrator-guide/configuration/no-auth-mode/"
+				target="_blank"
+				rel="noreferrer"
+			>
+				Learn more
+			</a>
+		</PersistedAnnouncementBanner>
+	);
+}
+
+export default NoAuthBanner;

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

@@ -0,0 +1,24 @@
+import { render, screen } from 'tests/test-utils';
+
+import { NoAuthBanner } from '../NoAuthBanner';
+
+describe('NoAuthBanner', () => {
+	it('renders the no-auth message', () => {
+		render(<NoAuthBanner />);
+		expect(
+			screen.getByText(/Impersonation mode: authentication is disabled/i),
+		).toBeInTheDocument();
+	});
+
+	it('renders with the warning test id', () => {
+		render(<NoAuthBanner />);
+		expect(screen.getByTestId('no-auth-banner')).toBeInTheDocument();
+	});
+
+	it('renders a docs link that opens in a new tab', () => {
+		render(<NoAuthBanner />);
+		const link = screen.getByRole('link', { name: /learn more/i });
+		expect(link).toHaveAttribute('target', '_blank');
+		expect(link).toHaveAttribute('rel', 'noreferrer');
+	});
+});

frontend/src/components/NoAuthGuard/NoAuthGuard.tsx

@@ -0,0 +1,52 @@
+import React from 'react';
+import {
+	TooltipRoot,
+	TooltipContent,
+	TooltipProvider,
+	TooltipTrigger,
+} from '@signozhq/ui/tooltip';
+import { useAppContext } from 'providers/App/App';
+
+export const DEFAULT_NO_AUTH_MESSAGE = 'Not available in no-auth mode';
+
+interface NoAuthGuardProps {
+	children: React.ReactElement;
+	message?: string;
+	disabled?: boolean;
+	testId?: string;
+}
+
+export function NoAuthGuard({
+	children,
+	message = DEFAULT_NO_AUTH_MESSAGE,
+	disabled,
+	testId,
+}: NoAuthGuardProps): JSX.Element {
+	const { isNoAuthMode } = useAppContext();
+
+	if (!isNoAuthMode) {
+		return disabled ? React.cloneElement(children, { disabled: true }) : children;
+	}
+
+	const disabledChild = React.cloneElement(children, {
+		disabled: true,
+		style: { ...(children.props.style ?? {}), pointerEvents: 'none' },
+	});
+
+	return (
+		<TooltipProvider>
+			<TooltipRoot>
+				<TooltipTrigger asChild>
+					<span
+						data-no-auth-trigger
+						data-testid={testId}
+						style={{ display: 'inline-flex', cursor: 'not-allowed' }}
+					>
+						{disabledChild}
+					</span>
+				</TooltipTrigger>
+				<TooltipContent>{message}</TooltipContent>
+			</TooltipRoot>
+		</TooltipProvider>
+	);
+}

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

@@ -0,0 +1,99 @@
+import React from 'react';
+import { render } from 'tests/test-utils';
+
+import { NoAuthGuard } from '..';
+
+describe('NoAuthGuard', () => {
+	it('renders children unchanged when isNoAuthMode is false', () => {
+		const { getByRole } = render(
+			<NoAuthGuard>
+				<button type="button">Action</button>
+			</NoAuthGuard>,
+			undefined,
+			{ appContextOverrides: { isNoAuthMode: false } },
+		);
+		expect(getByRole('button', { name: 'Action' })).not.toBeDisabled();
+	});
+
+	it('does not intercept onClick when isNoAuthMode is false', () => {
+		const handleClick = jest.fn();
+		const { getByRole } = render(
+			<NoAuthGuard>
+				<button type="button" onClick={handleClick}>
+					Action
+				</button>
+			</NoAuthGuard>,
+			undefined,
+			{ appContextOverrides: { isNoAuthMode: false } },
+		);
+		getByRole('button', { name: 'Action' }).click();
+		expect(handleClick).toHaveBeenCalledTimes(1);
+	});
+
+	it('disables children when isNoAuthMode is true', () => {
+		const { getByRole } = render(
+			<NoAuthGuard>
+				<button type="button">Action</button>
+			</NoAuthGuard>,
+			undefined,
+			{ appContextOverrides: { isNoAuthMode: true } },
+		);
+		expect(getByRole('button', { name: 'Action' })).toBeDisabled();
+	});
+
+	it('renders a tooltip trigger wrapper when isNoAuthMode is true', () => {
+		const { container } = render(
+			<NoAuthGuard>
+				<button type="button">Action</button>
+			</NoAuthGuard>,
+			undefined,
+			{ appContextOverrides: { isNoAuthMode: true } },
+		);
+		expect(
+			container.querySelector('span[data-no-auth-trigger]'),
+		).toBeInTheDocument();
+	});
+
+	it('blocks onClick when isNoAuthMode is true', () => {
+		const handleClick = jest.fn();
+		const { container } = render(
+			<NoAuthGuard>
+				<button type="button" onClick={handleClick}>
+					Action
+				</button>
+			</NoAuthGuard>,
+			undefined,
+			{ appContextOverrides: { isNoAuthMode: true } },
+		);
+		container
+			.querySelector('span[data-no-auth-trigger]')
+			?.dispatchEvent(new MouseEvent('click', { bubbles: true }));
+		expect(handleClick).not.toHaveBeenCalled();
+	});
+
+	it('overrides existing disabled prop — no-auth always wins', () => {
+		const { getByRole } = render(
+			<NoAuthGuard>
+				<button type="button" disabled={false}>
+					Action
+				</button>
+			</NoAuthGuard>,
+			undefined,
+			{ appContextOverrides: { isNoAuthMode: true } },
+		);
+		expect(getByRole('button', { name: 'Action' })).toBeDisabled();
+	});
+
+	it('sets pointerEvents none on child when isNoAuthMode is true', () => {
+		const { getByRole } = render(
+			<NoAuthGuard>
+				<button type="button">Action</button>
+			</NoAuthGuard>,
+			undefined,
+			{ appContextOverrides: { isNoAuthMode: true } },
+		);
+		expect(getByRole('button', { name: 'Action' })).toHaveStyle({
+			pointerEvents: 'none',
+		});
+	});
+});

frontend/src/components/NoAuthGuard/index.ts

@@ -0,0 +1 @@
+export { DEFAULT_NO_AUTH_MESSAGE, NoAuthGuard } from './NoAuthGuard';

frontend/src/components/ResizeTable/DynamicColumnTable.tsx

@@ -4,13 +4,13 @@ import type {
 	TableColumnsType as ColumnsType,
 	TableColumnType as ColumnType,
 } from 'antd';
-import { Button, Flex, Switch } from 'antd';
-import { DropdownMenuSimple, type MenuItem } from '@signozhq/ui/dropdown-menu';
+import { Button, Dropdown, Flex, MenuProps, Switch } from 'antd';
 import logEvent from 'api/common/logEvent';
 import LaunchChatSupport from 'components/LaunchChatSupport/LaunchChatSupport';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { SlidersHorizontal } from '@signozhq/icons';
+import { popupContainer } from 'utils/selectPopupContainer';
 
 import ResizeTable from './ResizeTable';
 import { DynamicColumnTableProps } from './types';
@@ -85,9 +85,8 @@ function DynamicColumnTable({
 			);
 		};
 
-	const items: MenuItem[] =
+	const items: MenuProps['items'] =
 		dynamicColumns?.map((column, index) => ({
-			key: String(index),
 			label: (
 				<div className="dynamicColumnsTable-items">
 					<div>{column.title?.toString()}</div>
@@ -97,6 +96,8 @@ function DynamicColumnTable({
 					/>
 				</div>
 			),
+			key: index,
+			type: 'checkbox',
 		})) || [];
 
 	// Get current page from URL or default to 1
@@ -125,14 +126,18 @@ function DynamicColumnTable({
 			<Flex justify="flex-end" align="center" gap={8}>
 				{facingIssueBtn && <LaunchChatSupport {...facingIssueBtn} />}
 				{dynamicColumns && (
-					<DropdownMenuSimple menu={{ items }}>
+					<Dropdown
+						getPopupContainer={popupContainer}
+						menu={{ items }}
+						trigger={['click']}
+					>
 						<Button
 							className="dynamicColumnTable-button filter-btn"
 							size="middle"
 							icon={<SlidersHorizontal size={14} />}
 							data-testid="additional-filters-button"
 						/>
-					</DropdownMenuSimple>
+					</Dropdown>
 				)}
 			</Flex>
 

frontend/src/components/ServiceAccountDrawer/AddKeyModal/KeyFormPhase.tsx

@@ -5,6 +5,7 @@ import { Input } from '@signozhq/ui/input';
 import { ToggleGroup, ToggleGroupItem } from '@signozhq/ui/toggle-group';
 import { DatePicker } from 'antd';
 import AuthZTooltip from 'components/AuthZTooltip/AuthZTooltip';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import {
 	APIKeyCreatePermission,
 	buildSAAttachPermission,
@@ -125,17 +126,19 @@ function KeyFormPhase({
 						]}
 						enabled={!!accountId}
 					>
-						<Button
-							type="submit"
-							// @ts-expect-error -- form prop not in @signozhq/ui Button type - TODO: Fix this - @SagarRajput
-							form={FORM_ID}
-							variant="solid"
-							color="primary"
-							loading={isSubmitting}
-							disabled={!isValid}
-						>
-							Create Key
-						</Button>
+						<NoAuthGuard testId="no-auth-create-key">
+							<Button
+								type="submit"
+								// @ts-expect-error -- form prop not in @signozhq/ui Button type - TODO: Fix this - @SagarRajput
+								form={FORM_ID}
+								variant="solid"
+								color="primary"
+								loading={isSubmitting}
+								disabled={!isValid}
+							>
+								Create Key
+							</Button>
+						</NoAuthGuard>
 					</AuthZTooltip>
 				</div>
 			</div>

frontend/src/components/ServiceAccountDrawer/EditKeyModal/EditKeyForm.tsx

@@ -8,6 +8,7 @@ import { ToggleGroup, ToggleGroupItem } from '@signozhq/ui/toggle-group';
 import { DatePicker } from 'antd';
 import type { ServiceaccounttypesGettableFactorAPIKeyDTO } from 'api/generated/services/sigNoz.schemas';
 import AuthZTooltip from 'components/AuthZTooltip/AuthZTooltip';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import {
 	buildAPIKeyDeletePermission,
 	buildAPIKeyUpdatePermission,
@@ -174,10 +175,12 @@ function EditKeyForm({
 					]}
 					enabled={!!accountId && !!keyItem?.id}
 				>
-					<Button variant="link" color="destructive" onClick={onRevokeClick}>
-						<Trash2 size={12} />
-						Revoke Key
-					</Button>
+					<NoAuthGuard testId="no-auth-revoke-key">
+						<Button variant="link" color="destructive" onClick={onRevokeClick}>
+							<Trash2 size={12} />
+							Revoke Key
+						</Button>
+					</NoAuthGuard>
 				</AuthZTooltip>
 				<div className="edit-key-modal__footer-right">
 					<Button variant="solid" color="secondary" onClick={onClose}>
@@ -188,17 +191,19 @@ function EditKeyForm({
 						checks={[buildAPIKeyUpdatePermission(keyItem?.id ?? '')]}
 						enabled={!!accountId && !!keyItem?.id}
 					>
-						<Button
-							type="submit"
-							// @ts-expect-error -- form prop not in @signozhq/ui Button type - TODO: Fix this - @SagarRajput
-							form={FORM_ID}
-							variant="solid"
-							color="primary"
-							loading={isSaving}
-							disabled={!isDirty}
-						>
-							Save Changes
-						</Button>
+						<NoAuthGuard testId="no-auth-save-key">
+							<Button
+								type="submit"
+								// @ts-expect-error -- form prop not in @signozhq/ui Button type - TODO: Fix this - @SagarRajput
+								form={FORM_ID}
+								variant="solid"
+								color="primary"
+								loading={isSaving}
+								disabled={!isDirty}
+							>
+								Save Changes
+							</Button>
+						</NoAuthGuard>
 					</AuthZTooltip>
 				</div>
 			</div>

frontend/src/components/ServiceAccountDrawer/KeysTab.tsx

@@ -1,7 +1,9 @@
 import React, { useCallback, useMemo } from 'react';
 import { KeyRound, X } from '@signozhq/icons';
 import { Button } from '@signozhq/ui/button';
-import { Skeleton, Table } from 'antd';
+import { Skeleton, Table, Tooltip } from 'antd';
+import { DEFAULT_NO_AUTH_MESSAGE, NoAuthGuard } from 'components/NoAuthGuard';
+import { useAppContext } from 'providers/App/App';
 import type { ColumnsType } from 'antd/es/table/interface';
 import type { ServiceaccounttypesGettableFactorAPIKeyDTO } from 'api/generated/services/sigNoz.schemas';
 import AuthZTooltip from 'components/AuthZTooltip/AuthZTooltip';
@@ -33,6 +35,7 @@ interface KeysTabProps {
 interface BuildColumnsParams {
 	isDisabled: boolean;
 	accountId: string;
+	isNoAuthMode: boolean;
 	onRevokeClick: (keyId: string) => void;
 	handleformatLastObservedAt: (
 		lastObservedAt: Date | null | undefined,
@@ -53,6 +56,7 @@ function formatExpiry(expiresAt: number): JSX.Element {
 function buildColumns({
 	isDisabled,
 	accountId,
+	isNoAuthMode,
 	onRevokeClick,
 	handleformatLastObservedAt,
 }: BuildColumnsParams): ColumnsType<ServiceaccounttypesGettableFactorAPIKeyDTO> {
@@ -110,28 +114,38 @@ function buildColumns({
 				onClick: (e): void => e.stopPropagation(),
 				style: { cursor: 'default' },
 			}),
-			render: (_, record): JSX.Element => (
-				<AuthZTooltip
-					checks={[
-						buildAPIKeyDeletePermission(record.id),
-						buildSADetachPermission(accountId),
-					]}
-					enabled={!isDisabled && !!accountId}
-				>
-					<Button
-						variant="ghost"
-						size="sm"
-						color="destructive"
-						disabled={isDisabled}
-						onClick={(): void => {
-							onRevokeClick(record.id);
-						}}
-						className="keys-tab__revoke-btn"
+			render: (_, record): JSX.Element => {
+				const tooltipTitle = isDisabled
+					? 'Service account disabled'
+					: isNoAuthMode
+						? DEFAULT_NO_AUTH_MESSAGE
+						: 'Revoke Key';
+				return (
+					<AuthZTooltip
+						checks={[
+							buildAPIKeyDeletePermission(record.id),
+							buildSADetachPermission(accountId),
+						]}
+						enabled={!isDisabled && !!accountId}
 					>
-						<X size={12} />
-					</Button>
-				</AuthZTooltip>
-			),
+						<Tooltip title={tooltipTitle}>
+							<Button
+								variant="ghost"
+								size="sm"
+								color="destructive"
+								disabled={isDisabled || isNoAuthMode}
+								onClick={(e): void => {
+									e.stopPropagation();
+									onRevokeClick(record.id);
+								}}
+								className="keys-tab__revoke-btn"
+							>
+								<X size={12} />
+							</Button>
+						</Tooltip>
+					</AuthZTooltip>
+				);
+			},
 		},
 	];
 }
@@ -158,6 +172,7 @@ function KeysTab({
 		parseAsString.withDefault(''),
 	);
 	const editKey = keys.find((k) => k.id === editKeyId) ?? null;
+	const { isNoAuthMode } = useAppContext();
 
 	const handleformatLastObservedAt = useCallback(
 		(lastObservedAt: Date | null | undefined): string =>
@@ -177,10 +192,17 @@ function KeysTab({
 			buildColumns({
 				isDisabled,
 				accountId,
+				isNoAuthMode,
 				onRevokeClick,
 				handleformatLastObservedAt,
 			}),
-		[isDisabled, accountId, onRevokeClick, handleformatLastObservedAt],
+		[
+			isDisabled,
+			accountId,
+			isNoAuthMode,
+			onRevokeClick,
+			handleformatLastObservedAt,
+		],
 	);
 
 	if (isLoading) {
@@ -210,16 +232,18 @@ function KeysTab({
 					checks={[APIKeyCreatePermission, buildSAAttachPermission(accountId)]}
 					enabled={!isDisabled && !!accountId}
 				>
-					<Button
-						variant="link"
-						color="primary"
-						onClick={async (): Promise<void> => {
-							await setIsAddKeyOpen(true);
-						}}
-						disabled={isDisabled}
-					>
-						+ Add your first key
-					</Button>
+					<NoAuthGuard testId="no-auth-add-first-key">
+						<Button
+							variant="link"
+							color="primary"
+							onClick={async (): Promise<void> => {
+								await setIsAddKeyOpen(true);
+							}}
+							disabled={isDisabled}
+						>
+							+ Add your first key
+						</Button>
+					</NoAuthGuard>
 				</AuthZTooltip>
 			</div>
 		);

frontend/src/components/ServiceAccountDrawer/RevokeKeyModal.tsx

@@ -2,6 +2,7 @@ import { useQueryClient } from 'react-query';
 import { Trash2, X } from '@signozhq/icons';
 import { Button } from '@signozhq/ui/button';
 import AuthZTooltip from 'components/AuthZTooltip/AuthZTooltip';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import {
 	buildAPIKeyDeletePermission,
 	buildSADetachPermission,
@@ -52,15 +53,17 @@ export function RevokeKeyFooter({
 				]}
 				enabled={!!accountId && !!keyId}
 			>
-				<Button
-					variant="solid"
-					color="destructive"
-					loading={isRevoking}
-					onClick={onConfirm}
-				>
-					<Trash2 size={12} />
-					Revoke Key
-				</Button>
+				<NoAuthGuard testId="no-auth-confirm-revoke">
+					<Button
+						variant="solid"
+						color="destructive"
+						loading={isRevoking}
+						onClick={onConfirm}
+					>
+						<Trash2 size={12} />
+						Revoke Key
+					</Button>
+				</NoAuthGuard>
 			</AuthZTooltip>
 		</>
 	);

frontend/src/components/ServiceAccountDrawer/ServiceAccountDrawer.tsx

@@ -49,6 +49,7 @@ import APIError from 'types/api/error';
 import { toAPIError } from 'utils/errorUtils';
 
 import AuthZTooltip from 'components/AuthZTooltip/AuthZTooltip';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import AddKeyModal from './AddKeyModal';
 import DeleteAccountModal from './DeleteAccountModal';
 import KeysTab from './KeysTab';
@@ -436,18 +437,20 @@ function ServiceAccountDrawer({
 						]}
 						enabled={!isDeleted && !!selectedAccountId}
 					>
-						<Button
-							variant="outlined"
-							size="sm"
-							color="secondary"
-							disabled={isDeleted}
-							onClick={(): void => {
-								void setIsAddKeyOpen(true);
-							}}
-						>
-							<Plus size={12} />
-							Add Key
-						</Button>
+						<NoAuthGuard testId="no-auth-add-key">
+							<Button
+								variant="outlined"
+								size="sm"
+								color="secondary"
+								disabled={isDeleted}
+								onClick={(): void => {
+									void setIsAddKeyOpen(true);
+								}}
+							>
+								<Plus size={12} />
+								Add Key
+							</Button>
+						</NoAuthGuard>
 					</AuthZTooltip>
 				)}
 			</div>
@@ -550,16 +553,18 @@ function ServiceAccountDrawer({
 							checks={[buildSADeletePermission(selectedAccountId ?? '')]}
 							enabled={!!selectedAccountId}
 						>
-							<Button
-								variant="link"
-								color="destructive"
-								onClick={(): void => {
-									void setIsDeleteOpen(true);
-								}}
-							>
-								<Trash2 size={12} />
-								Delete Service Account
-							</Button>
+							<NoAuthGuard testId="no-auth-delete-service-account">
+								<Button
+									variant="link"
+									color="destructive"
+									onClick={(): void => {
+										void setIsDeleteOpen(true);
+									}}
+								>
+									<Trash2 size={12} />
+									Delete Service Account
+								</Button>
+							</NoAuthGuard>
 						</AuthZTooltip>
 					)}
 					{!isDeleted && (
@@ -568,15 +573,17 @@ function ServiceAccountDrawer({
 								<X size={14} />
 								Cancel
 							</Button>
-							<Button
-								variant="solid"
-								color="primary"
-								loading={isSaving}
-								disabled={!isDirty}
-								onClick={handleSave}
-							>
-								Save Changes
-							</Button>
+							<NoAuthGuard testId="no-auth-save-service-account">
+								<Button
+									variant="solid"
+									color="primary"
+									loading={isSaving}
+									disabled={!isDirty}
+									onClick={handleSave}
+								>
+									Save Changes
+								</Button>
+							</NoAuthGuard>
 						</div>
 					)}
 				</>

frontend/src/components/ServiceAccountDrawer/__tests__/ServiceAccountDrawer.no-auth.test.tsx

@@ -0,0 +1,137 @@
+import type { ReactNode } from 'react';
+import { listRolesSuccessResponse } from 'mocks-server/__mockdata__/roles';
+import { rest, server } from 'mocks-server/server';
+import { NuqsTestingAdapter } from 'nuqs/adapters/testing';
+import { screen, waitFor } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+import ServiceAccountDrawer from '../ServiceAccountDrawer';
+
+const ROLES_ENDPOINT = '*/api/v1/roles';
+const SA_KEYS_ENDPOINT = '*/api/v1/service_accounts/:id/keys';
+const SA_ENDPOINT = '*/api/v1/service_accounts/sa-1';
+const SA_ROLES_ENDPOINT = '*/api/v1/service_accounts/:id/roles';
+const SA_ROLE_DELETE_ENDPOINT = '*/api/v1/service_accounts/:id/roles/:rid';
+
+const activeAccountResponse = {
+	id: 'sa-1',
+	name: 'CI Bot',
+	email: 'ci-bot@signoz.io',
+	roles: ['signoz-admin'],
+	status: 'ACTIVE',
+	createdAt: '2026-01-01T00:00:00Z',
+	updatedAt: '2026-01-02T00:00:00Z',
+};
+
+jest.mock('@signozhq/ui/drawer', () => ({
+	...jest.requireActual('@signozhq/ui/drawer'),
+	DrawerWrapper: ({
+		children,
+		footer,
+		open,
+	}: {
+		children?: ReactNode;
+		footer?: ReactNode;
+		open: boolean;
+	}): JSX.Element | null =>
+		open ? (
+			<div>
+				{children}
+				{footer}
+			</div>
+		) : null,
+}));
+
+jest.mock('@signozhq/ui/sonner', () => ({
+	...jest.requireActual('@signozhq/ui/sonner'),
+	toast: { success: jest.fn(), error: jest.fn() },
+}));
+
+function renderDrawer(
+	searchParams: Record<string, string> = { account: 'sa-1' },
+): ReturnType<typeof renderWithNoAuth> {
+	return renderWithNoAuth(
+		<NuqsTestingAdapter searchParams={searchParams} hasMemory>
+			<ServiceAccountDrawer onSuccess={jest.fn()} />
+		</NuqsTestingAdapter>,
+	);
+}
+
+function setupBaseHandlers(): void {
+	server.use(
+		rest.get(ROLES_ENDPOINT, (_, res, ctx) =>
+			res(ctx.status(200), ctx.json(listRolesSuccessResponse)),
+		),
+		rest.get(SA_KEYS_ENDPOINT, (_, res, ctx) =>
+			res(ctx.status(200), ctx.json({ data: [] })),
+		),
+		rest.get(SA_ENDPOINT, (_, res, ctx) =>
+			res(ctx.status(200), ctx.json({ data: activeAccountResponse })),
+		),
+		rest.put(SA_ENDPOINT, (_, res, ctx) =>
+			res(ctx.status(200), ctx.json({ status: 'success', data: {} })),
+		),
+		rest.delete(SA_ENDPOINT, (_, res, ctx) =>
+			res(ctx.status(200), ctx.json({ status: 'success', data: {} })),
+		),
+		rest.get(SA_ROLES_ENDPOINT, (_, res, ctx) =>
+			res(
+				ctx.status(200),
+				ctx.json({
+					data: listRolesSuccessResponse.data.filter(
+						(r) => r.name === 'signoz-admin',
+					),
+				}),
+			),
+		),
+		rest.post(SA_ROLES_ENDPOINT, (_, res, ctx) =>
+			res(ctx.status(200), ctx.json({ status: 'success', data: {} })),
+		),
+		rest.delete(SA_ROLE_DELETE_ENDPOINT, (_, res, ctx) =>
+			res(ctx.status(200), ctx.json({ status: 'success', data: {} })),
+		),
+	);
+}
+
+describe('ServiceAccountDrawer — no-auth mode', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+		setupBaseHandlers();
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('renders no-auth guards in the Overview tab footer', async () => {
+		renderDrawer();
+
+		await waitFor(() => {
+			expect(
+				screen.getByTestId('no-auth-delete-service-account'),
+			).toBeInTheDocument();
+			expect(
+				screen.getByTestId('no-auth-save-service-account'),
+			).toBeInTheDocument();
+		});
+	});
+
+	it('renders no-auth guard on Add Key button in Keys tab header', async () => {
+		renderDrawer({ account: 'sa-1', tab: 'keys' });
+
+		await waitFor(() => {
+			expect(screen.getByTestId('no-auth-add-key')).toBeInTheDocument();
+		});
+	});
+
+	it('does not render no-auth guards when drawer is closed', () => {
+		renderDrawer({});
+
+		expect(
+			screen.queryByTestId('no-auth-delete-service-account'),
+		).not.toBeInTheDocument();
+		expect(
+			screen.queryByTestId('no-auth-save-service-account'),
+		).not.toBeInTheDocument();
+	});
+});

frontend/src/container/Download/Download.tsx

@@ -1,7 +1,6 @@
 import { useState } from 'react';
 import { CloudDownload } from '@signozhq/icons';
-import { DropdownMenuSimple, type MenuProps } from '@signozhq/ui/dropdown-menu';
-import { Button, Flex } from 'antd';
+import { Button, Dropdown, MenuProps, Flex } from 'antd';
 import { unparse } from 'papaparse';
 
 import { DownloadProps } from './Download.types';
@@ -68,7 +67,7 @@ function Download({ data, isLoading, fileName }: DownloadProps): JSX.Element {
 	};
 
 	return (
-		<DropdownMenuSimple menu={menu}>
+		<Dropdown menu={menu} trigger={['click']}>
 			<Button
 				className="download-button"
 				loading={isLoading || isDownloading}
@@ -80,7 +79,7 @@ function Download({ data, isLoading, fileName }: DownloadProps): JSX.Element {
 					Download
 				</Flex>
 			</Button>
-		</DropdownMenuSimple>
+		</Dropdown>
 	);
 }
 

frontend/src/container/GridCardLayout/WidgetHeader/index.tsx

@@ -15,8 +15,7 @@ import {
 	X,
 } from '@signozhq/icons';
 import { Color } from '@signozhq/design-tokens';
-import { Button, Input, Tooltip } from 'antd';
-import { DropdownMenuSimple } from '@signozhq/ui/dropdown-menu';
+import { Button, Dropdown, Input, MenuProps, Tooltip } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
 import ErrorContent from 'components/ErrorModal/components/ErrorContent';
 import ErrorPopover from 'components/ErrorPopover/ErrorPopover';
@@ -129,7 +128,7 @@ function WidgetHeader({
 		],
 	);
 
-	const onMenuItemSelectHandler = useCallback(
+	const onMenuItemSelectHandler: MenuProps['onClick'] = useCallback(
 		({ key }: { key: string }): void => {
 			if (isTWidgetOptions(key)) {
 				const functionToCall = keyMethodMapping[key];
@@ -222,10 +221,8 @@ function WidgetHeader({
 
 	const menu = useMemo(
 		() => ({
-			items: updatedMenuList.map((item) => ({
-				...item,
-				onClick: onMenuItemSelectHandler,
-			})),
+			items: updatedMenuList,
+			onClick: onMenuItemSelectHandler,
 		}),
 		[updatedMenuList, onMenuItemSelectHandler],
 	);
@@ -324,7 +321,7 @@ function WidgetHeader({
 							/>
 						)}
 						{menu && Array.isArray(menu.items) && menu.items.length > 0 && (
-							<DropdownMenuSimple menu={menu} side="bottom" align="end">
+							<Dropdown menu={menu} trigger={['hover']} placement="bottomRight">
 								<Button
 									data-testid="widget-header-options"
 									className={`widget-header-more-options ${
@@ -332,7 +329,7 @@ function WidgetHeader({
 									}`}
 									icon={<EllipsisVertical size="md" />}
 								/>
-							</DropdownMenuSimple>
+							</Dropdown>
 						)}
 					</div>
 				</>

frontend/src/container/GridCardLayout/WidgetHeader/utils.ts

@@ -1,9 +1,9 @@
-import type { MenuItem as DropdownMenuItem } from '@signozhq/ui/dropdown-menu';
+import type { MenuItemType } from 'antd/es/menu/hooks/useItems';
 
 import { MenuItemKeys } from './contants';
 import { MenuItem } from './types';
 
-export const generateMenuList = (actions: MenuItem[]): DropdownMenuItem[] =>
+export const generateMenuList = (actions: MenuItem[]): MenuItemType[] =>
 	actions
 		.filter((action: MenuItem) => action.isVisible)
 		.map(({ key, icon: Icon, label, disabled, ...rest }) => ({

frontend/src/container/Home/Home.tsx

@@ -18,6 +18,7 @@ import listUserPreferences from 'api/v1/user/preferences/list';
 import updateUserPreferenceAPI from 'api/v1/user/preferences/name/update';
 import Header from 'components/Header/Header';
 import HeaderRightSection from 'components/HeaderRightSection/HeaderRightSection';
+import NoAuthBanner from 'components/NoAuthBanner/NoAuthBanner';
 import { ENTITY_VERSION_V5 } from 'constants/app';
 import { ORG_PREFERENCES } from 'constants/orgPreferences';
 import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
@@ -62,7 +63,7 @@ const homeInterval = 30 * 60 * 1000;
 
 // eslint-disable-next-line sonarjs/cognitive-complexity
 export default function Home(): JSX.Element {
-	const { user } = useAppContext();
+	const { user, isNoAuthMode } = useAppContext();
 	const { safeNavigate } = useSafeNavigate();
 	const isDarkMode = useIsDarkMode();
 
@@ -196,7 +197,7 @@ export default function Home(): JSX.Element {
 	const { mutate: updateUserPreference } = useMutation(updateUserPreferenceAPI, {
 		onSuccess: () => {
 			setUpdatingUserPreferences(false);
-			refetchUserPreferences();
+			void refetchUserPreferences();
 		},
 		onError: () => {
 			setUpdatingUserPreferences(false);
@@ -204,7 +205,7 @@ export default function Home(): JSX.Element {
 	});
 
 	const handleWillDoThisLater = (): void => {
-		logEvent('Welcome Checklist: Will do this later clicked', {});
+		void logEvent('Welcome Checklist: Will do this later clicked', {});
 		setUpdatingUserPreferences(true);
 
 		updateUserPreference({
@@ -271,11 +272,12 @@ export default function Home(): JSX.Element {
 	}, [metricsOnboardingData, handleUpdateChecklistDoneItem]);
 
 	useEffect(() => {
-		logEvent('Homepage: Visited', {});
+		void logEvent('Homepage: Visited', {});
 	}, []);
 
 	return (
 		<div className="home-container">
+			{isNoAuthMode && <NoAuthBanner />}
 			<div className="sticky-header">
 				<Header
 					leftComponent={
@@ -298,9 +300,9 @@ export default function Home(): JSX.Element {
 									autoAdjustOverflow
 									onOpenChange={(visible): void => {
 										if (visible) {
-											logEvent('Welcome Checklist: Expanded', {});
+											void logEvent('Welcome Checklist: Expanded', {});
 										} else {
-											logEvent('Welcome Checklist: Minimized', {});
+											void logEvent('Welcome Checklist: Minimized', {});
 										}
 									}}
 									content={renderWelcomeChecklistModal()}
@@ -353,7 +355,7 @@ export default function Home(): JSX.Element {
 											className="active-ingestion-card-actions"
 											onClick={(e: React.MouseEvent): void => {
 												// eslint-disable-next-line sonarjs/no-duplicate-string
-												logEvent('Homepage: Ingestion Active Explore clicked', {
+												void logEvent('Homepage: Ingestion Active Explore clicked', {
 													source: 'Logs',
 												});
 												safeNavigate(ROUTES.LOGS_EXPLORER, {
@@ -362,7 +364,7 @@ export default function Home(): JSX.Element {
 											}}
 											onKeyDown={(e): void => {
 												if (e.key === 'Enter') {
-													logEvent('Homepage: Ingestion Active Explore clicked', {
+													void logEvent('Homepage: Ingestion Active Explore clicked', {
 														source: 'Logs',
 													});
 													history.push(ROUTES.LOGS_EXPLORER);
@@ -396,7 +398,7 @@ export default function Home(): JSX.Element {
 											role="button"
 											tabIndex={0}
 											onClick={(e: React.MouseEvent): void => {
-												logEvent('Homepage: Ingestion Active Explore clicked', {
+												void logEvent('Homepage: Ingestion Active Explore clicked', {
 													source: 'Traces',
 												});
 												safeNavigate(ROUTES.TRACES_EXPLORER, {
@@ -405,7 +407,7 @@ export default function Home(): JSX.Element {
 											}}
 											onKeyDown={(e): void => {
 												if (e.key === 'Enter') {
-													logEvent('Homepage: Ingestion Active Explore clicked', {
+													void logEvent('Homepage: Ingestion Active Explore clicked', {
 														source: 'Traces',
 													});
 													history.push(ROUTES.TRACES_EXPLORER);
@@ -439,7 +441,7 @@ export default function Home(): JSX.Element {
 											role="button"
 											tabIndex={0}
 											onClick={(e: React.MouseEvent): void => {
-												logEvent('Homepage: Ingestion Active Explore clicked', {
+												void logEvent('Homepage: Ingestion Active Explore clicked', {
 													source: 'Metrics',
 												});
 												safeNavigate(ROUTES.METRICS_EXPLORER, {
@@ -448,7 +450,7 @@ export default function Home(): JSX.Element {
 											}}
 											onKeyDown={(e): void => {
 												if (e.key === 'Enter') {
-													logEvent('Homepage: Ingestion Active Explore clicked', {
+													void logEvent('Homepage: Ingestion Active Explore clicked', {
 														source: 'Metrics',
 													});
 													history.push(ROUTES.METRICS_EXPLORER);
@@ -496,7 +498,7 @@ export default function Home(): JSX.Element {
 												className="periscope-btn secondary"
 												prefix={<Wrench size={14} />}
 												onClick={(e: React.MouseEvent): void => {
-													logEvent('Homepage: Explore clicked', {
+													void logEvent('Homepage: Explore clicked', {
 														source: 'Logs',
 													});
 													safeNavigate(ROUTES.LOGS_EXPLORER, {
@@ -513,7 +515,7 @@ export default function Home(): JSX.Element {
 												className="periscope-btn secondary"
 												prefix={<Wrench size={14} />}
 												onClick={(e: React.MouseEvent): void => {
-													logEvent('Homepage: Explore clicked', {
+													void logEvent('Homepage: Explore clicked', {
 														source: 'Traces',
 													});
 													safeNavigate(ROUTES.TRACES_EXPLORER, {
@@ -530,7 +532,7 @@ export default function Home(): JSX.Element {
 												className="periscope-btn secondary"
 												prefix={<Wrench size={14} />}
 												onClick={(e: React.MouseEvent): void => {
-													logEvent('Homepage: Explore clicked', {
+													void logEvent('Homepage: Explore clicked', {
 														source: 'Metrics',
 													});
 													safeNavigate(ROUTES.METRICS_EXPLORER_EXPLORER, {
@@ -569,7 +571,7 @@ export default function Home(): JSX.Element {
 												className="periscope-btn secondary"
 												prefix={<Plus size={14} />}
 												onClick={(e: React.MouseEvent): void => {
-													logEvent('Homepage: Explore clicked', {
+													void logEvent('Homepage: Explore clicked', {
 														source: 'Dashboards',
 													});
 													safeNavigate(ROUTES.ALL_DASHBOARD, {
@@ -614,7 +616,7 @@ export default function Home(): JSX.Element {
 												className="periscope-btn secondary"
 												prefix={<Plus size={14} />}
 												onClick={(e: React.MouseEvent): void => {
-													logEvent('Homepage: Explore clicked', {
+													void logEvent('Homepage: Explore clicked', {
 														source: 'Alerts',
 													});
 													safeNavigate(ROUTES.ALERTS_NEW, {

frontend/src/container/ListOfDashboard/DashboardsList.tsx

@@ -12,11 +12,12 @@ import { useTranslation } from 'react-i18next';
 import { generatePath } from 'react-router-dom';
 import { useCopyToClipboard } from 'react-use';
 import { Color } from '@signozhq/design-tokens';
-import { DropdownMenuSimple, type MenuItem } from '@signozhq/ui/dropdown-menu';
 import {
 	Button,
+	Dropdown,
 	Flex,
 	Input,
+	MenuProps,
 	Modal,
 	Popover,
 	Skeleton,
@@ -552,7 +553,7 @@ function DashboardsList(): JSX.Element {
 	];
 
 	const getCreateDashboardItems = useMemo(() => {
-		const menuItems: MenuItem[] = [
+		const menuItems: MenuProps['items'] = [
 			{
 				label: (
 					<div
@@ -710,11 +711,11 @@ function DashboardsList(): JSX.Element {
 
 						{createNewDashboard && (
 							<section className="actions">
-								<DropdownMenuSimple
-									className="new-dashboard-menu"
+								<Dropdown
+									overlayClassName="new-dashboard-menu"
 									menu={{ items: getCreateDashboardItems }}
-									side="bottom"
-									align="end"
+									placement="bottomRight"
+									trigger={['click']}
 								>
 									<Button
 										type="text"
@@ -726,7 +727,7 @@ function DashboardsList(): JSX.Element {
 									>
 										New Dashboard
 									</Button>
-								</DropdownMenuSimple>
+								</Dropdown>
 								<Button
 									type="text"
 									className="learn-more"
@@ -755,11 +756,11 @@ function DashboardsList(): JSX.Element {
 								onChange={handleSearch}
 							/>
 							{createNewDashboard && (
-								<DropdownMenuSimple
-									className="new-dashboard-menu"
+								<Dropdown
+									overlayClassName="new-dashboard-menu"
 									menu={{ items: getCreateDashboardItems }}
-									side="bottom"
-									align="end"
+									placement="bottomRight"
+									trigger={['click']}
 								>
 									<Button
 										type="primary"
@@ -772,7 +773,7 @@ function DashboardsList(): JSX.Element {
 									>
 										New dashboard
 									</Button>
-								</DropdownMenuSimple>
+								</Dropdown>
 							)}
 						</div>
 

frontend/src/container/MembersSettings/MembersSettings.tsx

@@ -9,6 +9,7 @@ import { useListUsers } from 'api/generated/services/users';
 import EditMemberDrawer from 'components/EditMemberDrawer/EditMemberDrawer';
 import InviteMembersModal from 'components/InviteMembersModal/InviteMembersModal';
 import MembersTable, { MemberRow } from 'components/MembersTable/MembersTable';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { toISOString } from 'utils/app';
 
@@ -21,7 +22,6 @@ const PAGE_SIZE = 20;
 function MembersSettings(): JSX.Element {
 	const history = useHistory();
 	const urlQuery = useUrlQuery();
-
 	const pageParam = parseInt(urlQuery.get('page') ?? '1', 10);
 	const currentPage = Number.isNaN(pageParam) || pageParam < 1 ? 1 : pageParam;
 
@@ -146,7 +146,7 @@ function MembersSettings(): JSX.Element {
 				: `Deleted ⎯ ${deletedCount}`;
 
 	const handleInviteComplete = useCallback((): void => {
-		refetchUsers();
+		void refetchUsers();
 	}, [refetchUsers]);
 
 	const handleRowClick = useCallback((member: MemberRow): void => {
@@ -158,7 +158,7 @@ function MembersSettings(): JSX.Element {
 	}, []);
 
 	const handleMemberEditComplete = useCallback((): void => {
-		refetchUsers();
+		void refetchUsers();
 	}, [refetchUsers]);
 
 	return (
@@ -201,14 +201,16 @@ function MembersSettings(): JSX.Element {
 						/>
 					</div>
 
-					<Button
-						variant="solid"
-						color="primary"
-						onClick={(): void => setIsInviteModalOpen(true)}
-					>
-						<Plus size={12} />
-						Invite member
-					</Button>
+					<NoAuthGuard testId="no-auth-invite-member">
+						<Button
+							variant="solid"
+							color="primary"
+							onClick={(): void => setIsInviteModalOpen(true)}
+						>
+							<Plus size={12} />
+							Invite member
+						</Button>
+					</NoAuthGuard>
 				</div>
 			</div>
 			<MembersTable

frontend/src/container/MembersSettings/__tests__/MembersSettings.no-auth.test.tsx

@@ -0,0 +1,51 @@
+import type { TypesUserDTO } from 'api/generated/services/sigNoz.schemas';
+import { rest, server } from 'mocks-server/server';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+import { screen } from 'tests/test-utils';
+
+import MembersSettings from '../MembersSettings';
+
+jest.mock('@signozhq/ui/sonner', () => ({
+	...jest.requireActual('@signozhq/ui/sonner'),
+	toast: {
+		success: jest.fn(),
+		error: jest.fn(),
+	},
+}));
+
+const USERS_ENDPOINT = '*/api/v2/users';
+
+const mockUsers: TypesUserDTO[] = [
+	{
+		id: 'user-1',
+		displayName: 'Alice Smith',
+		email: 'alice@signoz.io',
+		status: 'active',
+		createdAt: '2024-01-01T00:00:00.000Z',
+		orgId: 'org-1',
+	},
+];
+
+describe('MembersSettings — no-auth mode', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+		server.use(
+			rest.get(USERS_ENDPOINT, (_, res, ctx) =>
+				res(ctx.status(200), ctx.json({ data: mockUsers })),
+			),
+		);
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('renders the no-auth sentinel and disables the Invite member button', async () => {
+		renderWithNoAuth(<MembersSettings />);
+
+		await screen.findByText('Alice Smith');
+
+		expect(screen.getByTestId('no-auth-invite-member')).toBeInTheDocument();
+		expect(screen.getByRole('button', { name: /invite member/i })).toBeDisabled();
+	});
+});

frontend/src/container/MySettings/UserInfo/index.tsx

@@ -7,6 +7,7 @@ import {
 	updateMyPassword,
 	useUpdateMyUserV2,
 } from 'api/generated/services/users';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import { useNotifications } from 'hooks/useNotifications';
 import { Check, FileTerminal, Mail, User } from '@signozhq/icons';
 import { useAppContext } from 'providers/App/App';
@@ -80,10 +81,10 @@ function UserInfo(): JSX.Element {
 		currentPassword === updatePassword;
 
 	const onSaveHandler = async (): Promise<void> => {
-		logEvent('Account Settings: Name Updated', {
+		void logEvent('Account Settings: Name Updated', {
 			name: changedName,
 		});
-		logEvent(
+		void logEvent(
 			'Account Settings: Name Updated',
 			{
 				name: changedName,
@@ -135,23 +136,27 @@ function UserInfo(): JSX.Element {
 			</div>
 
 			<div className="user-info-update-section">
-				<Button
-					type="default"
-					className="periscope-btn secondary"
-					icon={<FileTerminal size={16} />}
-					onClick={(): void => setIsUpdateNameModalOpen(true)}
-				>
-					Update name
-				</Button>
+				<NoAuthGuard testId="no-auth-update-name">
+					<Button
+						type="default"
+						className="periscope-btn secondary"
+						icon={<FileTerminal size={16} />}
+						onClick={(): void => setIsUpdateNameModalOpen(true)}
+					>
+						Update name
+					</Button>
+				</NoAuthGuard>
 
-				<Button
-					type="default"
-					className="periscope-btn secondary"
-					icon={<FileTerminal size={16} />}
-					onClick={(): void => setIsResetPasswordModalOpen(true)}
-				>
-					Reset password
-				</Button>
+				<NoAuthGuard testId="no-auth-reset-password">
+					<Button
+						type="default"
+						className="periscope-btn secondary"
+						icon={<FileTerminal size={16} />}
+						onClick={(): void => setIsResetPasswordModalOpen(true)}
+					>
+						Reset password
+					</Button>
+				</NoAuthGuard>
 			</div>
 
 			<Modal

frontend/src/container/MySettings/__tests__/UserInfo.no-auth.test.tsx

@@ -0,0 +1,33 @@
+import UserInfo from 'container/MySettings/UserInfo';
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+jest.mock('api/generated/services/users', () => ({
+	...jest.requireActual('api/generated/services/users'),
+	useUpdateMyUserV2: jest.fn(() => ({
+		mutateAsync: jest.fn(),
+		isLoading: false,
+	})),
+}));
+
+jest.mock('api/common/logEvent', () => ({
+	__esModule: true,
+	default: jest.fn(),
+}));
+
+jest.mock('hooks/useNotifications', () => ({
+	useNotifications: (): any => ({
+		notifications: {
+			error: jest.fn(),
+			success: jest.fn(),
+		},
+	}),
+}));
+
+describe('UserInfo — no-auth mode', () => {
+	it('renders no-auth guard wrappers for Update name and Reset password buttons', () => {
+		renderWithNoAuth(<UserInfo />);
+		expect(screen.getByTestId('no-auth-update-name')).toBeInTheDocument();
+		expect(screen.getByTestId('no-auth-reset-password')).toBeInTheDocument();
+	});
+});

frontend/src/container/NewWidget/LeftContainer/ExplorerColumnsRenderer.tsx

@@ -7,12 +7,7 @@ import {
 	DropResult,
 } from 'react-beautiful-dnd';
 import { Color } from '@signozhq/design-tokens';
-import { Button, Divider, Input, Tooltip } from 'antd';
-import {
-	DropdownMenu,
-	DropdownMenuContent,
-	DropdownMenuTrigger,
-} from '@signozhq/ui/dropdown-menu';
+import { Button, Divider, Dropdown, Input, MenuProps, Tooltip } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
 import { FieldDataType } from 'api/v5/v5';
 import { SOMETHING_WENT_WRONG } from 'constants/api';
@@ -164,12 +159,34 @@ function ExplorerColumnsRenderer({
 		debouncedSetQuerySearchText(e.target.value);
 	};
 
-	const handleOpenChange = (nextOpen: boolean): void => {
-		setOpen(nextOpen);
-		if (nextOpen) {
-			setSearchText('');
-		}
-	};
+	const items: MenuProps['items'] = [
+		{
+			key: 'search',
+			label: (
+				<Input
+					type="text"
+					placeholder="Search"
+					className="explorer-columns-search"
+					value={searchText}
+					onChange={handleSearchChange}
+					prefix={<Search size={16} style={{ padding: '6px' }} />}
+				/>
+			),
+		},
+		{
+			key: 'columns',
+			label: (
+				<ExplorerAttributeColumns
+					isLoading={isLoading}
+					data={data}
+					searchText={searchText}
+					isAttributeKeySelected={isAttributeKeySelected}
+					handleCheckboxChange={handleCheckboxChange}
+					dataSource={initialDataSource}
+				/>
+			),
+		},
+	];
 
 	const removeSelectedLogField = (name: string): void => {
 		if (
@@ -221,6 +238,13 @@ function ExplorerColumnsRenderer({
 		}
 	};
 
+	const toggleDropdown = (): void => {
+		setOpen(!open);
+		if (!open) {
+			setSearchText('');
+		}
+	};
+
 	const isDarkMode = useIsDarkMode();
 
 	return (
@@ -303,38 +327,25 @@ function ExplorerColumnsRenderer({
 						</Droppable>
 					</DragDropContext>
 					<div>
-						<DropdownMenu open={open} onOpenChange={handleOpenChange}>
-							<DropdownMenuTrigger asChild>
-								<Button
-									className="action-btn"
-									data-testid="add-columns-button"
-									icon={
-										<CirclePlus
-											size={16}
-											color={isDarkMode ? Color.BG_INK_400 : Color.BG_VANILLA_100}
-										/>
-									}
-								/>
-							</DropdownMenuTrigger>
-							<DropdownMenuContent side="top" className="explorer-columns-dropdown">
-								<Input
-									type="text"
-									placeholder="Search"
-									className="explorer-columns-search"
-									value={searchText}
-									onChange={handleSearchChange}
-									prefix={<Search size={16} style={{ padding: '6px' }} />}
-								/>
-								<ExplorerAttributeColumns
-									isLoading={isLoading}
-									data={data}
-									searchText={searchText}
-									isAttributeKeySelected={isAttributeKeySelected}
-									handleCheckboxChange={handleCheckboxChange}
-									dataSource={initialDataSource}
-								/>
-							</DropdownMenuContent>
-						</DropdownMenu>
+						<Dropdown
+							menu={{ items }}
+							arrow
+							placement="top"
+							open={open}
+							overlayClassName="explorer-columns-dropdown"
+						>
+							<Button
+								className="action-btn"
+								data-testid="add-columns-button"
+								icon={
+									<CirclePlus
+										size={16}
+										color={isDarkMode ? Color.BG_INK_400 : Color.BG_VANILLA_100}
+									/>
+								}
+								onClick={toggleDropdown}
+							/>
+						</Dropdown>
 					</div>
 				</div>
 			)}

frontend/src/container/NewWidget/RightContainer/Threshold/ColorSelector.tsx

@@ -1,7 +1,6 @@
 import { Dispatch, SetStateAction, useEffect, useState } from 'react';
 import { ChevronDown } from '@signozhq/icons';
-import { DropdownMenuSimple, type MenuItem } from '@signozhq/ui/dropdown-menu';
-import { Button, ColorPicker, Space } from 'antd';
+import { Button, ColorPicker, Dropdown, MenuProps, Space } from 'antd';
 import type { Color } from 'antd/es/color-picker';
 import useDebounce from 'hooks/useDebounce';
 
@@ -27,7 +26,7 @@ function ColorSelector({
 		setColorFromPicker(hex);
 	};
 
-	const items: MenuItem[] = [
+	const items: MenuProps['items'] = [
 		{
 			key: 'Red',
 			label: <CustomColor color="Red" />,
@@ -63,7 +62,7 @@ function ColorSelector({
 	];
 
 	return (
-		<DropdownMenuSimple menu={{ items }}>
+		<Dropdown menu={{ items }} trigger={['click']}>
 			<Button
 				onClick={(e): void => e.preventDefault()}
 				className="color-selector-button"
@@ -73,7 +72,7 @@ function ColorSelector({
 					<ChevronDown size="md" />
 				</Space>
 			</Button>
-		</DropdownMenuSimple>
+		</Dropdown>
 	);
 }
 

frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.tsx

@@ -8,7 +8,9 @@ import { Typography } from '@signozhq/ui/typography';
 import logEvent from 'api/common/logEvent';
 import inviteUsers from 'api/v1/invite/bulk/create';
 import AuthError from 'components/AuthError/AuthError';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import { useNotifications } from 'hooks/useNotifications';
+import { useAppContext } from 'providers/App/App';
 import { cloneDeep, debounce } from 'lodash-es';
 import {
 	ArrowRight,
@@ -140,6 +142,8 @@ function InviteTeamMembers({
 		}, 1000);
 	};
 
+	const { isNoAuthMode } = useAppContext();
+
 	const { mutate: sendInvites, isLoading: isSendingInvites } = useMutation(
 		inviteUsers,
 		{
@@ -257,7 +261,7 @@ function InviteTeamMembers({
 	const hasInvites =
 		(teamMembersToInvite?.filter(isMemberTouched) ?? []).length > 0;
 	const isButtonDisabled = isSendingInvites || isLoading;
-	const isInviteButtonDisabled = isButtonDisabled || !hasInvites;
+	const isInviteButtonDisabled = isButtonDisabled || !hasInvites || isNoAuthMode;
 
 	return (
 		<div className="questions-container">
@@ -365,24 +369,26 @@ function InviteTeamMembers({
 				)}
 
 				<div className="onboarding-buttons-container">
-					<Button
-						variant="solid"
-						color="primary"
-						className={`onboarding-next-button ${
-							isInviteButtonDisabled ? 'disabled' : ''
-						}`}
-						onClick={handleNext}
-						disabled={isInviteButtonDisabled}
-						suffix={
-							isButtonDisabled ? (
-								<LoaderCircle className="animate-spin" size={12} />
-							) : (
-								<ArrowRight size={12} />
-							)
-						}
-					>
-						Send Invites
-					</Button>
+					<NoAuthGuard testId="no-auth-onboarding-invite">
+						<Button
+							variant="solid"
+							color="primary"
+							className={`onboarding-next-button ${
+								isInviteButtonDisabled ? 'disabled' : ''
+							}`}
+							onClick={handleNext}
+							disabled={isInviteButtonDisabled}
+							suffix={
+								isButtonDisabled ? (
+									<LoaderCircle className="animate-spin" size={12} />
+								) : (
+									<ArrowRight size={12} />
+								)
+							}
+						>
+							Send Invites
+						</Button>
+					</NoAuthGuard>
 					<Button
 						variant="ghost"
 						color="secondary"

frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/__tests__/InviteTeamMembers.no-auth.test.tsx

@@ -0,0 +1,31 @@
+import InviteTeamMembers from 'container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers';
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+jest.mock('api/common/logEvent', () => ({
+	__esModule: true,
+	default: jest.fn(),
+}));
+
+jest.mock('hooks/useNotifications', () => ({
+	useNotifications: (): any => ({
+		notifications: {
+			error: jest.fn(),
+			success: jest.fn(),
+		},
+	}),
+}));
+
+describe('OnboardingQuestionaire InviteTeamMembers — no-auth mode', () => {
+	it('renders no-auth guard wrapper for the invite button', () => {
+		renderWithNoAuth(
+			<InviteTeamMembers
+				isLoading={false}
+				teamMembers={null}
+				setTeamMembers={jest.fn()}
+				onNext={jest.fn()}
+			/>,
+		);
+		expect(screen.getByTestId('no-auth-onboarding-invite')).toBeInTheDocument();
+	});
+});

frontend/src/container/OnboardingV2Container/AddDataSource/AddDataSource.tsx

@@ -21,6 +21,7 @@ import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import { isEmpty } from 'lodash-es';
 import { useAppContext } from 'providers/App/App';
 import { isModifierKeyPressed } from 'utils/app';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 
 import signozBrandLogoUrl from '@/assets/Logos/signoz-brand-logo.svg';
 
@@ -209,7 +210,7 @@ function OnboardingAddDataSource(): JSX.Element {
 	};
 
 	useEffect(() => {
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.STARTED}`,
 			{},
 		);
@@ -253,7 +254,7 @@ function OnboardingAddDataSource(): JSX.Element {
 		setSelectedFramework(null);
 		setSelectedEnvironment(null);
 
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.DATA_SOURCE_SELECTED}`,
 			{
 				dataSource: dataSource.label,
@@ -276,7 +277,7 @@ function OnboardingAddDataSource(): JSX.Element {
 	};
 
 	const handleSelectFramework = (option: any): void => {
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.FRAMEWORK_SELECTED}`,
 			{
 				dataSource: selectedDataSource?.label,
@@ -309,7 +310,7 @@ function OnboardingAddDataSource(): JSX.Element {
 		selectedEnvironment: any,
 		baseURL?: string,
 	): void => {
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.ENVIRONMENT_SELECTED}`,
 			{
 				dataSource: selectedDataSource?.label,
@@ -351,7 +352,7 @@ function OnboardingAddDataSource(): JSX.Element {
 			groupDataSourcesByTags(filteredDataSources as Entity[]),
 		);
 
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.DATA_SOURCE_SEARCHED}`,
 			{
 				searchedDataSource: query,
@@ -485,7 +486,7 @@ function OnboardingAddDataSource(): JSX.Element {
 	};
 
 	const handleShowInviteTeamMembersModal = (): void => {
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.INVITE_TEAM_MEMBER_BUTTON_CLICKED}`,
 			{
 				dataSource: selectedDataSource?.label,
@@ -498,7 +499,7 @@ function OnboardingAddDataSource(): JSX.Element {
 	};
 
 	const handleSubmitDataSourceRequest = (): void => {
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.DATA_SOURCE_REQUESTED}`,
 			{
 				requestedDataSource: dataSourceRequest,
@@ -513,7 +514,7 @@ function OnboardingAddDataSource(): JSX.Element {
 	};
 
 	const handleRaiseRequest = (): void => {
-		logEvent(
+		void logEvent(
 			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.DATA_SOURCE_REQUESTED}`,
 			{
 				requestedDataSource: searchQuery,
@@ -635,7 +636,7 @@ function OnboardingAddDataSource(): JSX.Element {
 								size={14}
 								className="onboarding-header-container-close-icon"
 								onClick={(e): void => {
-									logEvent(
+									void logEvent(
 										`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.CLOSE_ONBOARDING_CLICKED}`,
 										{
 											currentPage: setupStepItems[currentStep]?.title || '',
@@ -649,14 +650,16 @@ function OnboardingAddDataSource(): JSX.Element {
 						</div>
 
 						<div className="header-right-section">
-							<Button
-								type="default"
-								className="periscope-btn invite-teammate-btn outlined"
-								onClick={handleShowInviteTeamMembersModal}
-								icon={<UserPlus size={16} />}
-							>
-								Invite a teammate
-							</Button>
+							<NoAuthGuard testId="no-auth-invite-teammate">
+								<Button
+									type="default"
+									className="periscope-btn invite-teammate-btn outlined"
+									onClick={handleShowInviteTeamMembersModal}
+									icon={<UserPlus size={16} />}
+								>
+									Invite a teammate
+								</Button>
+							</NoAuthGuard>
 
 							<LaunchChatSupport
 								attributes={{
@@ -970,7 +973,7 @@ function OnboardingAddDataSource(): JSX.Element {
 													disabled={!selectedDataSource}
 													shape="round"
 													onClick={(e): void => {
-														logEvent(
+														void logEvent(
 															`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.CONFIGURED_PRODUCT}`,
 															{
 																dataSource: selectedDataSource?.label,
@@ -1038,7 +1041,7 @@ function OnboardingAddDataSource(): JSX.Element {
 										type="default"
 										shape="round"
 										onClick={(): void => {
-											logEvent(
+											void logEvent(
 												`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BACK_BUTTON_CLICKED}`,
 												{
 													dataSource: selectedDataSource?.label,
@@ -1057,7 +1060,7 @@ function OnboardingAddDataSource(): JSX.Element {
 										type="primary"
 										shape="round"
 										onClick={(e): void => {
-											logEvent(
+											void logEvent(
 												`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.CONTINUE_BUTTON_CLICKED}`,
 												{
 													dataSource: selectedDataSource?.label,

frontend/src/container/OnboardingV2Container/AddDataSource/__tests__/AddDataSource.no-auth.test.tsx

@@ -0,0 +1,31 @@
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+import OnboardingAddDataSource from '../AddDataSource';
+
+jest.mock('api/common/logEvent', () => ({
+	__esModule: true,
+	default: jest.fn().mockResolvedValue(undefined),
+}));
+
+jest.mock('hooks/useSafeNavigate', () => ({
+	useSafeNavigate: (): { safeNavigate: jest.Mock } => ({
+		safeNavigate: jest.fn(),
+	}),
+}));
+
+jest.mock('api/generated/services/global', () => ({
+	useGetGlobalConfig: jest.fn(() => ({ data: undefined })),
+}));
+
+jest.mock('components/LaunchChatSupport/LaunchChatSupport', () => ({
+	__esModule: true,
+	default: (): JSX.Element => <button type="button">Contact Support</button>,
+}));
+
+describe('OnboardingAddDataSource — no-auth mode', () => {
+	it('renders no-auth guard wrapper for the invite teammate button', () => {
+		renderWithNoAuth(<OnboardingAddDataSource />);
+		expect(screen.getByTestId('no-auth-invite-teammate')).toBeInTheDocument();
+	});
+});

frontend/src/container/OnboardingV2Container/InviteTeamMembers/InviteTeamMembers.no-auth.test.tsx

@@ -0,0 +1,32 @@
+import InviteTeamMembers from 'container/OnboardingV2Container/InviteTeamMembers/InviteTeamMembers';
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+jest.mock('api/common/logEvent', () => ({
+	__esModule: true,
+	default: jest.fn(),
+}));
+
+jest.mock('hooks/useNotifications', () => ({
+	useNotifications: (): any => ({
+		notifications: {
+			error: jest.fn(),
+			success: jest.fn(),
+		},
+	}),
+}));
+
+describe('OnboardingV2Container InviteTeamMembers — no-auth mode', () => {
+	it('renders no-auth guard wrapper for the invite button', () => {
+		renderWithNoAuth(
+			<InviteTeamMembers
+				isLoading={false}
+				teamMembers={null}
+				setTeamMembers={jest.fn()}
+				onNext={jest.fn()}
+				onClose={jest.fn()}
+			/>,
+		);
+		expect(screen.getByTestId('no-auth-v2-invite')).toBeInTheDocument();
+	});
+});

frontend/src/container/OnboardingV2Container/InviteTeamMembers/InviteTeamMembers.tsx

@@ -5,6 +5,7 @@ import { Button, Input, Select } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
 import logEvent from 'api/common/logEvent';
 import inviteUsers from 'api/v1/invite/bulk/create';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import { useNotifications } from 'hooks/useNotifications';
 import { cloneDeep, debounce, isEmpty } from 'lodash-es';
 import {
@@ -281,15 +282,17 @@ function InviteTeamMembers({
 					Cancel
 				</Button>
 
-				<Button
-					type="primary"
-					className="next-button periscope-btn primary"
-					onClick={handleNext}
-					loading={isSendingInvites || isLoading}
-				>
-					Send Invites
-					<ArrowRight size={14} />
-				</Button>
+				<NoAuthGuard testId="no-auth-v2-invite">
+					<Button
+						type="primary"
+						className="next-button periscope-btn primary"
+						onClick={handleNext}
+						loading={isSendingInvites || isLoading}
+					>
+						Send Invites
+						<ArrowRight size={14} />
+					</Button>
+				</NoAuthGuard>
 			</div>
 		</div>
 	);

frontend/src/container/OrganizationSettings/AuthDomain/CreateEdit/CreateEdit.no-auth.test.tsx

@@ -0,0 +1,32 @@
+import { fireEvent, screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+import CreateEdit from './CreateEdit';
+import { mockGoogleAuthDomain } from '../__tests__/mocks';
+
+describe('CreateEdit — no-auth mode', () => {
+	it('renders no-auth guard sentinel for Save Changes button', () => {
+		renderWithNoAuth(
+			<CreateEdit
+				isCreate={false}
+				record={mockGoogleAuthDomain}
+				onClose={jest.fn()}
+			/>,
+		);
+
+		expect(screen.getByTestId('no-auth-save-auth-domain')).toBeInTheDocument();
+	});
+
+	it('renders no-auth guard sentinel for Save Changes button in create mode after selecting provider', async () => {
+		renderWithNoAuth(<CreateEdit isCreate onClose={jest.fn()} />);
+
+		const configureButtons = await screen.findAllByRole('button', {
+			name: /configure/i,
+		});
+		fireEvent.click(configureButtons[0]);
+
+		await expect(
+			screen.findByTestId('no-auth-save-auth-domain'),
+		).resolves.toBeInTheDocument();
+	});
+});

frontend/src/container/OrganizationSettings/AuthDomain/CreateEdit/CreateEdit.tsx

@@ -17,6 +17,7 @@ import {
 import { AxiosError } from 'axios';
 import { FeatureKeys } from 'constants/features';
 import { defaultTo } from 'lodash-es';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import { useAppContext } from 'providers/App/App';
 import { useErrorModal } from 'providers/ErrorModalProvider';
 import { ErrorV2Resp } from 'types/api';
@@ -257,14 +258,16 @@ function CreateOrEdit(props: CreateOrEditProps): JSX.Element {
 									Cancel
 								</Button>
 							)}
-							<Button
-								onClick={onSubmitHandler}
-								variant="solid"
-								color="primary"
-								loading={isCreating || isUpdating}
-							>
-								Save Changes
-							</Button>
+							<NoAuthGuard testId="no-auth-save-auth-domain">
+								<Button
+									onClick={onSubmitHandler}
+									variant="solid"
+									color="primary"
+									loading={isCreating || isUpdating}
+								>
+									Save Changes
+								</Button>
+							</NoAuthGuard>
 						</section>
 					</div>
 				)}

frontend/src/container/OrganizationSettings/AuthDomain/SSOEnforcementToggle.tsx

@@ -1,5 +1,6 @@
 import { useEffect, useState } from 'react';
 import { Switch } from '@signozhq/ui/switch';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import { ErrorResponseHandlerV2 } from 'api/ErrorResponseHandlerV2';
 import { useUpdateAuthDomain } from 'api/generated/services/authdomains';
 import {
@@ -65,7 +66,9 @@ function SSOEnforcementToggle({
 	};
 
 	return (
-		<Switch disabled={isLoading} value={isChecked} onChange={onChangeHandler} />
+		<NoAuthGuard testId="no-auth-sso-toggle">
+			<Switch disabled={isLoading} value={isChecked} onChange={onChangeHandler} />
+		</NoAuthGuard>
 	);
 }
 

frontend/src/container/OrganizationSettings/AuthDomain/__tests__/AuthDomain.no-auth.test.tsx

@@ -0,0 +1,26 @@
+import { rest, server } from 'mocks-server/server';
+import { screen, waitFor } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+import AuthDomain from '../index';
+import { AUTH_DOMAINS_LIST_ENDPOINT, mockEmptyDomainsResponse } from './mocks';
+
+describe('AuthDomain — no-auth mode', () => {
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('renders no-auth guard sentinel for Add Domain button', async () => {
+		server.use(
+			rest.get(AUTH_DOMAINS_LIST_ENDPOINT, (_, res, ctx) =>
+				res(ctx.status(200), ctx.json(mockEmptyDomainsResponse)),
+			),
+		);
+
+		renderWithNoAuth(<AuthDomain />);
+
+		await waitFor(() => {
+			expect(screen.getByTestId('no-auth-add-domain')).toBeInTheDocument();
+		});
+	});
+});

frontend/src/container/OrganizationSettings/AuthDomain/__tests__/SSOEnforcementToggle.no-auth.test.tsx

@@ -0,0 +1,36 @@
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+jest.mock('@signozhq/ui/switch', () => ({
+	...jest.requireActual('@signozhq/ui/switch'),
+	Switch: ({
+		value,
+		disabled,
+	}: {
+		value: boolean;
+		disabled?: boolean;
+	}): JSX.Element => (
+		<button
+			type="button"
+			role="switch"
+			aria-checked={value}
+			disabled={disabled}
+		/>
+	),
+}));
+
+import SSOEnforcementToggle from '../SSOEnforcementToggle';
+import { mockGoogleAuthDomain } from './mocks';
+
+describe('SSOEnforcementToggle — no-auth mode', () => {
+	it('renders no-auth guard sentinel when isNoAuthMode is true', () => {
+		renderWithNoAuth(
+			<SSOEnforcementToggle
+				isDefaultChecked={false}
+				record={mockGoogleAuthDomain}
+			/>,
+		);
+
+		expect(screen.getByTestId('no-auth-sso-toggle')).toBeInTheDocument();
+	});
+});

frontend/src/container/OrganizationSettings/AuthDomain/index.tsx

@@ -14,6 +14,7 @@ import {
 } from 'api/generated/services/sigNoz.schemas';
 import { AxiosError } from 'axios';
 import ErrorContent from 'components/ErrorModal/components/ErrorContent';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import CopyToClipboard from 'periscope/components/CopyToClipboard';
 import { useErrorModal } from 'providers/ErrorModalProvider';
 import APIError from 'types/api/error';
@@ -75,7 +76,7 @@ function AuthDomain(): JSX.Element {
 			{
 				onSuccess: () => {
 					toast.success('Domain deleted successfully');
-					refetchAuthDomainListResponse();
+					void refetchAuthDomainListResponse();
 					hideDeleteModal();
 				},
 				onError: (error) => {
@@ -153,20 +154,24 @@ function AuthDomain(): JSX.Element {
 				width: 100,
 				render: (_, record: AuthtypesGettableAuthDomainDTO): JSX.Element => (
 					<section className="auth-domain-list-column-action">
-						<Button
-							className="auth-domain-list-action-link"
-							onClick={(): void => setRecord(record)}
-							variant="link"
-						>
-							Configure {SSOType.get(record.config?.ssoType || '')}
-						</Button>
-						<Button
-							className="auth-domain-list-action-link delete"
-							onClick={(): void => showDeleteModal(record)}
-							variant="link"
-						>
-							Delete
-						</Button>
+						<NoAuthGuard testId="no-auth-configure-sso">
+							<Button
+								className="auth-domain-list-action-link"
+								onClick={(): void => setRecord(record)}
+								variant="link"
+							>
+								Configure {SSOType.get(record.config?.ssoType || '')}
+							</Button>
+						</NoAuthGuard>
+						<NoAuthGuard testId="no-auth-delete-domain">
+							<Button
+								className="auth-domain-list-action-link delete"
+								onClick={(): void => showDeleteModal(record)}
+								variant="link"
+							>
+								Delete
+							</Button>
+						</NoAuthGuard>
 					</section>
 				),
 			},
@@ -178,17 +183,19 @@ function AuthDomain(): JSX.Element {
 		<div className="auth-domain">
 			<section className="auth-domain-header">
 				<h3 className="auth-domain-title">Authenticated Domains</h3>
-				<Button
-					prefix={<Plus size="md" />}
-					onClick={(): void => {
-						setAddDomain(true);
-					}}
-					variant="solid"
-					size="sm"
-					color="primary"
-				>
-					Add Domain
-				</Button>
+				<NoAuthGuard testId="no-auth-add-domain">
+					<Button
+						prefix={<Plus size="md" />}
+						onClick={(): void => {
+							setAddDomain(true);
+						}}
+						variant="solid"
+						size="sm"
+						color="primary"
+					>
+						Add Domain
+					</Button>
+				</NoAuthGuard>
 			</section>
 			{formattedError && <ErrorContent error={formattedError} />}
 			{!errorFetchingAuthDomainListResponse && (
@@ -231,15 +238,16 @@ function AuthDomain(): JSX.Element {
 					>
 						Cancel
 					</Button>,
-					<Button
-						key="submit"
-						prefix={<Trash2 size={16} />}
-						onClick={handleDeleteDomain}
-						className="delete-btn"
-						loading={isLoading}
-					>
-						Delete Domain
-					</Button>,
+					<NoAuthGuard key="submit" testId="no-auth-delete-domain-confirm">
+						<Button
+							prefix={<Trash2 size={16} />}
+							onClick={handleDeleteDomain}
+							className="delete-btn"
+							loading={isLoading}
+						>
+							Delete Domain
+						</Button>
+					</NoAuthGuard>,
 				]}
 			>
 				<p className="delete-text">

frontend/src/container/OrganizationSettings/InviteUserModal/InviteUserModal.no-auth.test.tsx

@@ -0,0 +1,37 @@
+import { Form } from 'antd';
+import InviteUserModal from 'container/OrganizationSettings/InviteUserModal/InviteUserModal';
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+jest.mock('hooks/useNotifications', () => ({
+	useNotifications: (): any => ({
+		notifications: {
+			error: jest.fn(),
+			success: jest.fn(),
+		},
+	}),
+}));
+
+jest.mock('api/v1/invite/create', () => ({
+	__esModule: true,
+	default: jest.fn(),
+}));
+
+function TestWrapper(): JSX.Element {
+	const [form] = Form.useForm();
+	return (
+		<InviteUserModal
+			isInviteTeamMemberModalOpen
+			toggleModal={jest.fn()}
+			form={form}
+			onClose={jest.fn()}
+		/>
+	);
+}
+
+describe('InviteUserModal — no-auth mode', () => {
+	it('renders no-auth guard wrapper for the invite submit button', () => {
+		renderWithNoAuth(<TestWrapper />);
+		expect(screen.getByTestId('no-auth-invite-user')).toBeInTheDocument();
+	});
+});

frontend/src/container/OrganizationSettings/InviteUserModal/InviteUserModal.tsx

@@ -1,6 +1,7 @@
 import { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Button, Form, FormInstance, Modal } from 'antd';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import sendInvite from 'api/v1/invite/create';
 import { useNotifications } from 'hooks/useNotifications';
 import APIError from 'types/api/error';
@@ -85,16 +86,20 @@ function InviteUserModal(props: InviteUserModalProps): JSX.Element {
 						ns: 'common',
 					})}
 				</Button>,
-				<Button
+				<NoAuthGuard
 					key={t('invite_team_members').toString()}
-					onClick={modalForm.submit}
-					data-testid="invite-team-members-button"
-					type="primary"
-					disabled={isInvitingMembers}
-					loading={isInvitingMembers}
+					testId="no-auth-invite-user"
 				>
-					{t('invite_team_members')}
-				</Button>,
+					<Button
+						onClick={modalForm.submit}
+						data-testid="invite-team-members-button"
+						type="primary"
+						disabled={isInvitingMembers}
+						loading={isInvitingMembers}
+					>
+						{t('invite_team_members')}
+					</Button>
+				</NoAuthGuard>,
 			]}
 		>
 			<InviteTeamMembers form={modalForm} onFinish={onInviteClickHandler} />

frontend/src/container/RolesSettings/RolesComponents/CreateRoleModal.no-auth.test.tsx

@@ -0,0 +1,12 @@
+import { screen } from 'tests/test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+
+import CreateRoleModal from './CreateRoleModal';
+
+describe('CreateRoleModal — no-auth mode', () => {
+	it('renders no-auth guard sentinel for Create Role button', () => {
+		renderWithNoAuth(<CreateRoleModal isOpen onClose={jest.fn()} />);
+
+		expect(screen.getByTestId('no-auth-save-role')).toBeInTheDocument();
+	});
+});

frontend/src/container/RolesSettings/RolesComponents/CreateRoleModal.tsx

@@ -18,6 +18,7 @@ import {
 } from 'api/generated/services/sigNoz.schemas';
 import { ErrorType } from 'api/generatedAPIInstance';
 import ROUTES from 'constants/routes';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 import { useErrorModal } from 'providers/ErrorModalProvider';
 import { handleApiError } from 'utils/errorUtils';
 
@@ -148,16 +149,17 @@ function CreateRoleModal({
 					<X size={14} />
 					Cancel
 				</Button>,
-				<Button
-					key="submit"
-					variant="solid"
-					color="primary"
-					onClick={onSubmit}
-					loading={isLoading}
-					size="sm"
-				>
-					{isEditMode ? 'Save Changes' : 'Create Role'}
-				</Button>,
+				<NoAuthGuard key="submit" testId="no-auth-save-role">
+					<Button
+						variant="solid"
+						color="primary"
+						onClick={onSubmit}
+						loading={isLoading}
+						size="sm"
+					>
+						{isEditMode ? 'Save Changes' : 'Create Role'}
+					</Button>
+				</NoAuthGuard>,
 			]}
 			destroyOnClose
 			className="create-role-modal"

frontend/src/container/RolesSettings/RolesSettings.tsx

@@ -5,6 +5,7 @@ import { Input } from '@signozhq/ui/input';
 import AuthZTooltip from 'components/AuthZTooltip/AuthZTooltip';
 import { RoleCreatePermission } from 'hooks/useAuthZ/permissions/role.permissions';
 import { useRolesFeatureGate } from 'hooks/useRolesFeatureGate';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 
 import CreateRoleModal from './RolesComponents/CreateRoleModal';
 import RolesListingTable from './RolesComponents/RolesListingTable';
@@ -42,15 +43,17 @@ function RolesSettings(): JSX.Element {
 					/>
 					{isRolesEnabled && (
 						<AuthZTooltip checks={[RoleCreatePermission]}>
-							<Button
-								variant="solid"
-								color="primary"
-								className="role-settings-toolbar-button"
-								onClick={(): void => setIsCreateModalOpen(true)}
-							>
-								<Plus size={14} />
-								Custom role
-							</Button>
+							<NoAuthGuard testId="no-auth-create-custom-role">
+								<Button
+									variant="solid"
+									color="primary"
+									className="role-settings-toolbar-button"
+									onClick={(): void => setIsCreateModalOpen(true)}
+								>
+									<Plus size={14} />
+									Custom role
+								</Button>
+							</NoAuthGuard>
 						</AuthZTooltip>
 					)}
 				</div>

frontend/src/container/RolesSettings/__tests__/RolesSettings.no-auth.test.tsx

@@ -0,0 +1,37 @@
+import { listRolesSuccessResponse } from 'mocks-server/__mockdata__/roles';
+import { rest, server } from 'mocks-server/server';
+import { useAuthZ } from 'hooks/useAuthZ/useAuthZ';
+import { mockUseAuthZGrantAll } from 'tests/authz-test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+import { screen } from 'tests/test-utils';
+
+import RolesSettings from '../RolesSettings';
+
+jest.mock('hooks/useAuthZ/useAuthZ');
+const mockUseAuthZ = useAuthZ as jest.MockedFunction<typeof useAuthZ>;
+
+const ROLES_ENDPOINT = '*/api/v1/roles';
+
+describe('RolesSettings — no-auth mode', () => {
+	beforeEach(() => {
+		mockUseAuthZ.mockImplementation(mockUseAuthZGrantAll);
+		server.use(
+			rest.get(ROLES_ENDPOINT, (_req, res, ctx) =>
+				res(ctx.status(200), ctx.json(listRolesSuccessResponse)),
+			),
+		);
+	});
+
+	afterEach(() => {
+		jest.clearAllMocks();
+		server.resetHandlers();
+	});
+
+	it('renders the no-auth sentinel for the Custom role button', async () => {
+		renderWithNoAuth(<RolesSettings />);
+
+		await screen.findByText('signoz-admin');
+
+		expect(screen.getByTestId('no-auth-create-custom-role')).toBeInTheDocument();
+	});
+});

frontend/src/container/RoutingPolicies/__tests__/testUtils.ts

@@ -101,6 +101,8 @@ export function getAppContextMockState(
 		userPreferences: null,
 		hostsData: null,
 		isLoggedIn: false,
+		isNoAuthMode: false,
+		isPreflightLoading: false,
 		org: null,
 		isFetchingUser: false,
 		isFetchingActiveLicense: false,

frontend/src/container/ServiceAccountsSettings/ServiceAccountsSettings.tsx

@@ -37,6 +37,7 @@ import {
 } from './utils';
 
 import './ServiceAccountsSettings.styles.scss';
+import { NoAuthGuard } from 'components/NoAuthGuard';
 
 function ServiceAccountsSettings(): JSX.Element {
 	const [currentPage, setPage] = useQueryState(
@@ -264,16 +265,18 @@ function ServiceAccountsSettings(): JSX.Element {
 						</div>
 
 						<AuthZTooltip checks={[SACreatePermission]}>
-							<Button
-								variant="solid"
-								color="primary"
-								onClick={async (): Promise<void> => {
-									await setIsCreateModalOpen(true);
-								}}
-							>
-								<Plus size={12} />
-								New Service Account
-							</Button>
+							<NoAuthGuard testId="no-auth-new-service-account">
+								<Button
+									variant="solid"
+									color="primary"
+									onClick={async (): Promise<void> => {
+										await setIsCreateModalOpen(true);
+									}}
+								>
+									<Plus size={12} />
+									New Service Account
+								</Button>
+							</NoAuthGuard>
 						</AuthZTooltip>
 					</div>
 

frontend/src/container/ServiceAccountsSettings/__tests__/ServiceAccountsSettings.no-auth.test.tsx

@@ -0,0 +1,70 @@
+import { listRolesSuccessResponse } from 'mocks-server/__mockdata__/roles';
+import { rest, server } from 'mocks-server/server';
+import { NuqsTestingAdapter } from 'nuqs/adapters/testing';
+import { setupAuthzAdmin } from 'tests/authz-test-utils';
+import { renderWithNoAuth } from 'tests/no-auth-test-utils';
+import { screen } from 'tests/test-utils';
+
+import ServiceAccountsSettings from '../ServiceAccountsSettings';
+
+const SA_LIST_ENDPOINT = '*/api/v1/service_accounts';
+const SA_ENDPOINT = '*/api/v1/service_accounts/:id';
+const SA_KEYS_ENDPOINT = '*/api/v1/service_accounts/:id/keys';
+const SA_ROLES_ENDPOINT = '*/api/v1/service_accounts/:id/roles';
+const ROLES_ENDPOINT = '*/api/v1/roles';
+
+const mockServiceAccountsAPI = [
+	{
+		id: 'sa-1',
+		name: 'CI Bot',
+		email: 'ci-bot@signoz.io',
+		roles: ['signoz-admin'],
+		status: 'ACTIVE',
+		createdAt: 1700000000,
+		updatedAt: 1700000001,
+	},
+];
+
+describe('ServiceAccountsSettings — no-auth mode', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+		server.use(
+			setupAuthzAdmin(),
+			rest.get(SA_LIST_ENDPOINT, (_, res, ctx) =>
+				res(ctx.status(200), ctx.json({ data: mockServiceAccountsAPI })),
+			),
+			rest.get(SA_ENDPOINT, (req, res, ctx) => {
+				const { id } = req.params as { id: string };
+				const account = mockServiceAccountsAPI.find((a) => a.id === id);
+				return account
+					? res(ctx.status(200), ctx.json({ data: account }))
+					: res(ctx.status(404), ctx.json({ message: 'Not found' }));
+			}),
+			rest.get(SA_KEYS_ENDPOINT, (_, res, ctx) =>
+				res(ctx.status(200), ctx.json({ data: [] })),
+			),
+			rest.get(SA_ROLES_ENDPOINT, (_, res, ctx) =>
+				res(ctx.status(200), ctx.json({ data: [] })),
+			),
+			rest.get(ROLES_ENDPOINT, (_, res, ctx) =>
+				res(ctx.status(200), ctx.json(listRolesSuccessResponse)),
+			),
+		);
+	});
+
+	afterEach(() => {
+		server.resetHandlers();
+	});
+
+	it('renders the no-auth sentinel for the New Service Account button', async () => {
+		renderWithNoAuth(
+			<NuqsTestingAdapter>
+				<ServiceAccountsSettings />
+			</NuqsTestingAdapter>,
+		);
+
+		await screen.findByText('CI Bot');
+
+		expect(screen.getByTestId('no-auth-new-service-account')).toBeInTheDocument();
+	});
+});

frontend/src/container/SideNav/SideNav.styles.scss

@@ -1120,6 +1120,7 @@
 
 		.user-settings-dropdown-logout-section {
 			color: var(--danger-background);
+			pointer-events: auto;
 		}
 	}
 }

frontend/src/container/SideNav/SideNav.tsx

@@ -1,6 +1,5 @@
 import {
 	MouseEvent,
-	ReactNode,
 	useCallback,
 	useEffect,
 	useMemo,
@@ -26,14 +25,7 @@ import {
 	verticalListSortingStrategy,
 } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
-import {
-	DropdownMenu,
-	DropdownMenuContent,
-	DropdownMenuItem,
-	DropdownMenuSeparator,
-	DropdownMenuTrigger,
-} from '@signozhq/ui/dropdown-menu';
-import { Button, MenuProps, Modal, Tooltip } from 'antd';
+import { Button, Dropdown, MenuProps, Modal, Tooltip } from 'antd';
 import logEvent from 'api/common/logEvent';
 import { Logout } from 'api/utils';
 import updateUserPreference from 'api/v1/user/preferences/name/update';
@@ -142,6 +134,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 		featureFlags,
 		trialInfo,
 		isLoggedIn,
+		isNoAuthMode,
 		userPreferences,
 		changelog,
 		toggleChangelogModal,
@@ -416,7 +409,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 	);
 
 	const handleReorderShortcutNavItems = (): void => {
-		logEvent('Sidebar V2: Save shortcuts clicked', {
+		void logEvent('Sidebar V2: Save shortcuts clicked', {
 			shortcuts: tempPinnedMenuItems.map((item) => item.key),
 		});
 		setPinnedMenuItems(tempPinnedMenuItems);
@@ -444,7 +437,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 	const isWorkspaceBlocked = trialInfo?.workSpaceBlock || false;
 
 	const onClickGetStarted = (event: MouseEvent): void => {
-		logEvent('Sidebar: Menu clicked', {
+		void logEvent('Sidebar: Menu clicked', {
 			menuRoute: '/get-started',
 			menuLabel: 'Get Started',
 		});
@@ -497,12 +490,14 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 				isWorkspaceBlocked,
 				isEnterpriseSelfHostedUser,
 				isCommunityEnterpriseUser,
+				isNoAuthMode,
 			}),
 		[
 			isEnterpriseSelfHostedUser,
 			isCommunityEnterpriseUser,
 			user.email,
 			isWorkspaceBlocked,
+			isNoAuthMode,
 		],
 	);
 
@@ -659,7 +654,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 		} else if (item) {
 			onClickHandler(item?.key as string, event);
 		}
-		logEvent('Sidebar V2: Menu clicked', {
+		void logEvent('Sidebar V2: Menu clicked', {
 			menuRoute: item?.key,
 			menuLabel: item?.label,
 		});
@@ -802,7 +797,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 					onTogglePin={
 						allowPin
 							? (item): void => {
-									logEvent(
+									void logEvent(
 										`Sidebar V2: Menu item ${item.isPinned ? 'unpinned' : 'pinned'}`,
 										{
 											menuRoute: item.key,
@@ -849,7 +844,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 		const event = (info as SidebarItem & { domEvent?: MouseEvent }).domEvent;
 
 		if (item && !('type' in item)) {
-			logEvent('Help Popover: Item clicked', {
+			void logEvent('Help Popover: Item clicked', {
 				menuRoute: item.key,
 				menuLabel: String(item.label),
 			});
@@ -898,7 +893,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 			menuLabel = item.label;
 		}
 
-		logEvent('Settings Popover: Item clicked', {
+		void logEvent('Settings Popover: Item clicked', {
 			menuRoute: item?.key,
 			menuLabel,
 		});
@@ -935,7 +930,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 				}
 				break;
 			case 'logout':
-				Logout();
+				void Logout();
 				break;
 			default:
 		}
@@ -1089,7 +1084,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 													<div
 														className="nav-section-title-icon reorder"
 														onClick={(): void => {
-															logEvent('Sidebar V2: Manage shortcuts clicked', {});
+															void logEvent('Sidebar V2: Manage shortcuts clicked', {});
 															setIsReorderShortcutNavItemsModalOpen(true);
 														}}
 													>
@@ -1136,7 +1131,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 													return;
 												}
 												const newCollapsedState = !isMoreMenuCollapsed;
-												logEvent('Sidebar V2: More menu clicked', {
+												void logEvent('Sidebar V2: More menu clicked', {
 													action: isMoreMenuCollapsed ? 'expand' : 'collapse',
 												});
 												setIsMoreMenuCollapsed(newCollapsedState);
@@ -1190,95 +1185,46 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 							{isAIAssistantEnabled && renderNavItems([aiAssistantMenuItem], false)}
 
 							<div className="nav-dropdown-item">
-								<DropdownMenu onOpenChange={(open): void => setIsDropdownOpen(open)}>
-									<DropdownMenuTrigger asChild>
-										<div className="nav-item">
-											<div className="nav-item-data" data-testid="help-support-nav-item">
-												<div className="nav-item-icon">{helpSupportMenuItem.icon}</div>
+								<Dropdown
+									menu={{
+										items: helpSupportDropdownMenuItems,
+										onClick: handleHelpSupportMenuItemClick,
+									}}
+									placement="topLeft"
+									overlayClassName="nav-dropdown-overlay help-support-dropdown"
+									trigger={['click']}
+									onOpenChange={(open): void => setIsDropdownOpen(open)}
+								>
+									<div className="nav-item">
+										<div className="nav-item-data" data-testid="help-support-nav-item">
+											<div className="nav-item-icon">{helpSupportMenuItem.icon}</div>
 
-												<div className="nav-item-label">{helpSupportMenuItem.label}</div>
-											</div>
+											<div className="nav-item-label">{helpSupportMenuItem.label}</div>
 										</div>
-									</DropdownMenuTrigger>
-									<DropdownMenuContent
-										side="top"
-										align="start"
-										className="nav-dropdown-overlay help-support-dropdown"
-									>
-										{helpSupportDropdownMenuItems.map((item, idx) => {
-											if ('type' in item) {
-												// eslint-disable-next-line react/no-array-index-key
-												return <DropdownMenuSeparator key={`help-sep-${idx}`} />;
-											}
-											return (
-												<DropdownMenuItem
-													key={String(item.key)}
-													leftIcon={item.icon}
-													onClick={(e): void =>
-														handleHelpSupportMenuItemClick({
-															...item,
-															key: String(item.key),
-															domEvent: e.nativeEvent,
-														} as unknown as SidebarItem)
-													}
-												>
-													{item.label}
-												</DropdownMenuItem>
-											);
-										})}
-									</DropdownMenuContent>
-								</DropdownMenu>
+									</div>
+								</Dropdown>
 							</div>
 
 							<div className="nav-dropdown-item">
-								<DropdownMenu onOpenChange={(open): void => setIsDropdownOpen(open)}>
-									<DropdownMenuTrigger asChild>
-										<div className={cx('nav-item', isSettingsPage && 'active')}>
-											<div className="nav-item-active-marker" />
-											<div className="nav-item-data" data-testid="settings-nav-item">
-												<div className="nav-item-icon">{userSettingsMenuItem.icon}</div>
+								<Dropdown
+									menu={{
+										items: userSettingsDropdownMenuItems,
+										onClick: handleSettingsMenuItemClick,
+									}}
+									placement="topLeft"
+									overlayClassName="nav-dropdown-overlay settings-dropdown"
+									trigger={['click']}
+									onOpenChange={(open): void => setIsDropdownOpen(open)}
+								>
+									<div className={cx('nav-item', isSettingsPage && 'active')}>
+										<div className="nav-item-active-marker" />
+										<div className="nav-item-data" data-testid="settings-nav-item">
+											<div className="nav-item-icon">{userSettingsMenuItem.icon}</div>
 
-												<div className="nav-item-label">{userSettingsMenuItem.label}</div>
-											</div>
+											<div className="nav-item-label">{userSettingsMenuItem.label}</div>
 										</div>
-									</DropdownMenuTrigger>
-									<DropdownMenuContent
-										side="top"
-										align="start"
-										className="nav-dropdown-overlay settings-dropdown"
-									>
-										{(userSettingsDropdownMenuItems ?? []).map((item, idx) => {
-											if (!item) {
-												return null;
-											}
-											if ('type' in item && item.type === 'divider') {
-												// eslint-disable-next-line react/no-array-index-key
-												return <DropdownMenuSeparator key={`settings-sep-${idx}`} />;
-											}
-											const settingsItem = item as {
-												key?: string | number;
-												label?: ReactNode;
-												icon?: ReactNode;
-												disabled?: boolean;
-											};
-											return (
-												<DropdownMenuItem
-													key={String(settingsItem.key)}
-													leftIcon={settingsItem.icon}
-													disabled={settingsItem.disabled}
-													onClick={(e): void =>
-														handleSettingsMenuItemClick({
-															key: String(settingsItem.key),
-															domEvent: e.nativeEvent,
-														} as unknown as SidebarItem)
-													}
-												>
-													{settingsItem.label}
-												</DropdownMenuItem>
-											);
-										})}
-									</DropdownMenuContent>
-								</DropdownMenu>
+									</div>
+								</Dropdown>
 							</div>
 						</div>
 					</div>
@@ -1291,14 +1237,14 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 				open={isReorderShortcutNavItemsModalOpen}
 				closable
 				onCancel={(): void => {
-					logEvent('Sidebar V2: Manage shortcuts dismissed', {});
+					void logEvent('Sidebar V2: Manage shortcuts dismissed', {});
 					hideReorderShortcutNavItemsModal();
 				}}
 				footer={[
 					<Button
 						key="cancel"
 						onClick={(): void => {
-							logEvent('Sidebar V2: Manage shortcuts dismissed', {});
+							void logEvent('Sidebar V2: Manage shortcuts dismissed', {});
 							hideReorderShortcutNavItemsModal();
 						}}
 						className="periscope-btn cancel-btn secondary-btn"

frontend/src/container/SideNav/__tests__/menuItems.test.tsx

@@ -5,6 +5,7 @@ const BASE_PARAMS = {
 	isWorkspaceBlocked: false,
 	isEnterpriseSelfHostedUser: false,
 	isCommunityEnterpriseUser: false,
+	isNoAuthMode: false,
 };
 
 describe('getUserSettingsDropdownMenuItems', () => {
@@ -71,4 +72,15 @@ describe('getUserSettingsDropdownMenuItems', () => {
 		expect(keys[3]).toBe('account');
 		expect(keys[keys.length - 1]).toBe('logout');
 	});
+
+	it('omits sign out and its preceding divider when isNoAuthMode=true', () => {
+		const items =
+			getUserSettingsDropdownMenuItems({ ...BASE_PARAMS, isNoAuthMode: true }) ??
+			[];
+		const keys = items.map((item: any) => item.key ?? item.type);
+
+		expect(keys).not.toContain('logout');
+		// the trailing divider before logout should also be gone
+		expect(keys[keys.length - 1]).toBe('keyboard-shortcuts');
+	});
 });

frontend/src/container/SideNav/menuItems.tsx

@@ -1,3 +1,5 @@
+import { MenuProps } from 'antd';
+import ROUTES from 'constants/routes';
 import {
 	ArrowUpRight,
 	BarChart,
@@ -35,15 +37,13 @@ import {
 	Users,
 	Binoculars,
 } from '@signozhq/icons';
-import { Style } from '@signozhq/design-tokens';
-import { MenuProps } from 'antd';
-import ROUTES from 'constants/routes';
 
 import {
 	SecondaryMenuItemKey,
 	SettingsNavSection,
 	SidebarItem,
 } from './sideNav.types';
+import { Style } from '@signozhq/design-tokens';
 
 export const getStartedMenuItem = {
 	key: ROUTES.GET_STARTED,
@@ -487,6 +487,7 @@ export interface UserSettingsMenuItemsParams {
 	isWorkspaceBlocked: boolean;
 	isEnterpriseSelfHostedUser: boolean;
 	isCommunityEnterpriseUser: boolean;
+	isNoAuthMode: boolean;
 }
 
 export const getUserSettingsDropdownMenuItems = ({
@@ -494,6 +495,7 @@ export const getUserSettingsDropdownMenuItems = ({
 	isWorkspaceBlocked,
 	isEnterpriseSelfHostedUser,
 	isCommunityEnterpriseUser,
+	isNoAuthMode,
 }: UserSettingsMenuItemsParams): MenuProps['items'] =>
 	[
 		{
@@ -537,21 +539,25 @@ export const getUserSettingsDropdownMenuItems = ({
 			icon: <Keyboard size={14} color={Style.L1_FOREGROUND} />,
 			dataTestId: 'keyboard-shortcuts-nav-item',
 		},
-		{ type: 'divider' as const },
-		{
-			key: 'logout',
-			label: (
-				<span className="user-settings-dropdown-logout-section">Sign out</span>
-			),
-			icon: (
-				<LogOut
-					size={14}
-					className="user-settings-dropdown-logout-section"
-					color={Style.DANGER_BACKGROUND}
-				/>
-			),
-			dataTestId: 'logout-nav-item',
-		},
+		...(isNoAuthMode
+			? []
+			: [
+					{ type: 'divider' as const },
+					{
+						key: 'logout',
+						label: (
+							<span className="user-settings-dropdown-logout-section">Sign out</span>
+						),
+						icon: (
+							<LogOut
+								size={14}
+								className="user-settings-dropdown-logout-section"
+								color={Style.DANGER_BACKGROUND}
+							/>
+						),
+						dataTestId: 'logout-nav-item',
+					},
+				]),
 	].filter(Boolean);
 
 /** Mapping of some newly added routes and their corresponding active sidebar menu key */

frontend/src/pages/AlertDetails/AlertHeader/ActionButtons/ActionButtons.tsx

@@ -1,7 +1,6 @@
 import { useCallback, useEffect, useState } from 'react';
 import { Color } from '@signozhq/design-tokens';
-import { Divider, Switch, Tooltip } from 'antd';
-import { DropdownMenuSimple, type MenuItem } from '@signozhq/ui/dropdown-menu';
+import { Divider, Dropdown, MenuProps, Switch, Tooltip } from 'antd';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { Copy, Ellipsis, PenLine, Trash2 } from '@signozhq/icons';
 import {
@@ -12,6 +11,7 @@ import {
 } from 'pages/AlertDetails/hooks';
 import CopyToClipboard from 'periscope/components/CopyToClipboard';
 import { useAlertRule } from 'providers/Alert';
+import { CSSProperties } from 'styled-components';
 import { NEW_ALERT_SCHEMA_VERSION } from 'types/api/alerts/alertTypesV2';
 import { AlertDef } from 'types/api/alerts/def';
 
@@ -20,6 +20,16 @@ import RenameModal from './RenameModal';
 
 import './ActionButtons.styles.scss';
 
+const menuItemStyle: CSSProperties = {
+	fontSize: '14px',
+	letterSpacing: '0.14px',
+};
+
+const menuItemStyleV2: CSSProperties = {
+	fontSize: '13px',
+	letterSpacing: '0.13px',
+};
+
 function AlertActionButtons({
 	ruleId,
 	alertDetails,
@@ -58,7 +68,9 @@ function AlertActionButtons({
 
 	const isV2Alert = alertDetails.schemaVersion === NEW_ALERT_SCHEMA_VERSION;
 
-	const menuItems: MenuItem[] = [
+	const finalMenuItemStyle = isV2Alert ? menuItemStyleV2 : menuItemStyle;
+
+	const menuItems: MenuProps['items'] = [
 		...(!isV2Alert
 			? [
 					{
@@ -66,6 +78,7 @@ function AlertActionButtons({
 						label: 'Rename',
 						icon: <PenLine size={16} color={Color.BG_VANILLA_400} />,
 						onClick: handleRename,
+						style: finalMenuItemStyle,
 					},
 				]
 			: []),
@@ -74,13 +87,17 @@ function AlertActionButtons({
 			label: 'Duplicate',
 			icon: <Copy size={16} color={Color.BG_VANILLA_400} />,
 			onClick: handleAlertDuplicate,
+			style: finalMenuItemStyle,
 		},
 		{
 			key: 'delete-rule',
 			label: 'Delete',
 			icon: <Trash2 size={16} color={Color.BG_CHERRY_400} />,
 			onClick: handleAlertDelete,
-			danger: true,
+			style: {
+				...finalMenuItemStyle,
+				color: Color.BG_CHERRY_400,
+			},
 		},
 	];
 
@@ -121,7 +138,7 @@ function AlertActionButtons({
 
 				<Divider type="vertical" />
 
-				<DropdownMenuSimple menu={{ items: menuItems }}>
+				<Dropdown trigger={['click']} menu={{ items: menuItems }}>
 					<Tooltip title="More options">
 						<Ellipsis
 							size={16}
@@ -130,7 +147,7 @@ function AlertActionButtons({
 							className="dropdown-icon"
 						/>
 					</Tooltip>
-				</DropdownMenuSimple>
+				</Dropdown>
 			</div>
 
 			<RenameModal

frontend/src/pages/Settings/Settings.tsx

@@ -321,7 +321,7 @@ function SettingsPage(): JSX.Element {
 										isDisabled={false}
 										showIcon={false}
 										onClick={(event): void => {
-											logEvent('Settings V2: Menu clicked', {
+											void logEvent('Settings V2: Menu clicked', {
 												menuLabel: item.label,
 												menuRoute: item.key,
 											});

frontend/src/pages/TracesFunnelDetails/components/FunnelConfiguration/FunnelStep.tsx

@@ -1,6 +1,14 @@
 import { useMemo, useState } from 'react';
-import { Button, Divider, Form, Space, Switch, Tooltip } from 'antd';
-import { DropdownMenuSimple, type MenuItem } from '@signozhq/ui/dropdown-menu';
+import {
+	Button,
+	Divider,
+	Dropdown,
+	Form,
+	MenuProps,
+	Space,
+	Switch,
+	Tooltip,
+} from 'antd';
 import cx from 'classnames';
 import { FilterSelect } from 'components/CeleryOverview/CeleryOverviewConfigOptions/CeleryOverviewConfigOptions';
 import { QueryParams } from 'constants/query';
@@ -36,22 +44,16 @@ function FunnelStep({
 	const [isAddDetailsModalOpen, setIsAddDetailsModalOpen] =
 		useState<boolean>(false);
 
-	const latencyPointerItems: MenuItem[] = [
-		{
-			type: 'radio-group',
-			value: stepData.latency_pointer,
-			onChange: (value): void =>
-				onStepChange(index, {
-					latency_pointer: value as FunnelStepData['latency_pointer'],
-				}),
-			children: LatencyPointers.map((option) => ({
-				type: 'radio',
-				key: option.value,
-				label: option.key,
-				value: option.value,
-			})),
-		},
-	];
+	const latencyPointerItems: MenuProps['items'] = LatencyPointers.map(
+		(option) => ({
+			key: option.value,
+			label: option.key,
+			style:
+				option.value === stepData.latency_pointer
+					? { backgroundColor: 'var(--bg-slate-100)' }
+					: {},
+		}),
+	);
 
 	const updatedCurrentQuery = useMemo(
 		() => ({
@@ -210,18 +212,17 @@ function FunnelStep({
 					</div>
 					<div className="latency-pointer">
 						<div className="latency-pointer__label">Latency pointer</div>
-						{hasEditPermission ? (
-							<DropdownMenuSimple menu={{ items: latencyPointerItems }}>
-								<Space>
-									{
-										LatencyPointers.find(
-											(option) => option.value === stepData.latency_pointer,
-										)?.key
-									}
-									<ChevronDown size={14} color="var(--bg-vanilla-400)" />
-								</Space>
-							</DropdownMenuSimple>
-						) : (
+						<Dropdown
+							menu={{
+								items: latencyPointerItems,
+								onClick: ({ key }): void =>
+									onStepChange(index, {
+										latency_pointer: key as FunnelStepData['latency_pointer'],
+									}),
+							}}
+							trigger={['click']}
+							disabled={!hasEditPermission}
+						>
 							<Space>
 								{
 									LatencyPointers.find(
@@ -230,7 +231,7 @@ function FunnelStep({
 								}
 								<ChevronDown size={14} color="var(--bg-vanilla-400)" />
 							</Space>
-						)}
+						</Dropdown>
 					</div>
 				</div>
 			</Form>

frontend/src/providers/App/App.tsx

@@ -13,8 +13,11 @@ import { useQuery } from 'react-query';
 import getLocalStorageApi from 'api/browser/localstorage/get';
 import setLocalStorageApi from 'api/browser/localstorage/set';
 import { useGetHosts } from 'api/generated/services/zeus';
+import { useGetGlobalConfig } from 'api/generated/services/global';
 import { useGetMyUser } from 'api/generated/services/users';
 import listOrgPreferences from 'api/v1/org/preferences/list';
+import { clearAuthStorage } from 'utils/clearAuthStorage';
+import { setNoAuthMode } from 'utils/noAuthMode';
 import listUserPreferences from 'api/v1/user/preferences/list';
 import getUserVersion from 'api/v1/version/get';
 import { LOCALSTORAGE } from 'constants/localStorage';
@@ -70,11 +73,51 @@ export function AppProvider({ children }: PropsWithChildren): JSX.Element {
 	const [isLoggedIn, setIsLoggedIn] = useState<boolean>(
 		(): boolean => getLocalStorageApi(LOCALSTORAGE.IS_LOGGED_IN) === 'true',
 	);
+	const [isNoAuthMode, setIsNoAuthMode] = useState<boolean>(false);
+	const [isPreflightLoading, setIsPreflightLoading] = useState<boolean>(true);
 	const [org, setOrg] = useState<Organization[] | null>(null);
 	const [changelog, setChangelog] = useState<ChangelogSchema | null>(null);
 
 	const [showChangelogModal, setShowChangelogModal] = useState<boolean>(false);
 
+	// Pre-flight: discover auth mode from public global config.
+	// On success: in impersonation mode → clear stale tokens, force isLoggedIn=true,
+	//             set noAuthMode singleton so the axios interceptor (outside React)
+	//             can skip the rotate-logout chain.
+	// On failure: fail-safe to normal auth flow (treat as not no-auth).
+	const { data: globalConfigData, isLoading: isFetchingGlobalConfig } =
+		useGetGlobalConfig({
+			query: {
+				retry: 2,
+				retryDelay: 1000,
+				refetchOnWindowFocus: false,
+				staleTime: Infinity,
+			},
+		});
+
+	useEffect(() => {
+		if (isFetchingGlobalConfig) {
+			return;
+		}
+
+		const impersonationEnabled =
+			globalConfigData?.data?.identN?.impersonation?.enabled === true;
+
+		if (impersonationEnabled) {
+			clearAuthStorage();
+			setDefaultUser(getUserDefaults());
+			setLocalStorageApi(LOCALSTORAGE.IS_LOGGED_IN, 'true');
+			setNoAuthMode(true);
+			setIsNoAuthMode(true);
+			setIsLoggedIn(true);
+		} else {
+			setNoAuthMode(false);
+			setIsNoAuthMode(false);
+		}
+
+		setIsPreflightLoading(false);
+	}, [globalConfigData, isFetchingGlobalConfig]);
+
 	// fetcher for current user
 	// user will only be fetched if the user id and token is present
 	// if logged out and trying to hit any route none of these calls will trigger
@@ -366,6 +409,9 @@ export function AppProvider({ children }: PropsWithChildren): JSX.Element {
 
 	// global event listener for LOGOUT event to clean the app context state
 	useGlobalEventListener('LOGOUT', () => {
+		if (isNoAuthMode) {
+			return;
+		} // logout is meaningless in no-auth; defensively no-op
 		setIsLoggedIn(false);
 		setDefaultUser(getUserDefaults());
 		setActiveLicense(null);
@@ -385,6 +431,8 @@ export function AppProvider({ children }: PropsWithChildren): JSX.Element {
 			orgPreferences,
 			hostsData,
 			isLoggedIn,
+			isNoAuthMode,
+			isPreflightLoading,
 			org,
 			isFetchingUser,
 			isFetchingActiveLicense,
@@ -425,6 +473,8 @@ export function AppProvider({ children }: PropsWithChildren): JSX.Element {
 			isLoggedIn,
 			hostsData,
 			hostsFetchError,
+			isNoAuthMode,
+			isPreflightLoading,
 			org,
 			orgPreferences,
 			activeLicenseRefetch,

frontend/src/providers/App/__tests__/App.test.tsx

@@ -2,6 +2,7 @@ import { ReactElement } from 'react';
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { renderHook, waitFor } from '@testing-library/react';
 import setLocalStorageApi from 'api/browser/localstorage/set';
+import { getIsNoAuthMode, setNoAuthMode } from 'utils/noAuthMode';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import { SINGLE_FLIGHT_WAIT_TIME_MS } from 'hooks/useAuthZ/constants';
 import { server } from 'mocks-server/server';
@@ -13,6 +14,7 @@ import { AppProvider, useAppContext } from '../App';
 
 const MY_USER_URL = 'http://localhost/api/v2/users/me';
 const MY_ORG_URL = 'http://localhost/api/v2/orgs/me';
+const GLOBAL_CONFIG_URL = 'http://localhost/api/v1/global/config';
 
 jest.mock('constants/env', () => ({
 	ENVIRONMENT: { baseURL: 'http://localhost', wsURL: '' },
@@ -336,3 +338,127 @@ describe('AppProvider when authz/check fails', () => {
 		);
 	});
 });
+
+describe('AppProvider no-auth preflight', () => {
+	beforeEach(() => {
+		queryClient.clear();
+	});
+
+	afterEach(() => {
+		setNoAuthMode(false);
+	});
+
+	it('sets isNoAuthMode=true and noAuthMode singleton when impersonation is enabled', async () => {
+		server.use(
+			rest.get(GLOBAL_CONFIG_URL, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({
+						data: { identN: { impersonation: { enabled: true } } },
+					}),
+				),
+			),
+		);
+
+		const wrapper = createWrapper();
+		const { result } = renderHook(() => useAppContext(), { wrapper });
+
+		await waitFor(
+			() => {
+				expect(result.current.isNoAuthMode).toBe(true);
+			},
+			{ timeout: 3000 },
+		);
+
+		expect(getIsNoAuthMode()).toBe(true);
+	});
+
+	it('leaves isNoAuthMode=false and clears noAuthMode singleton when impersonation is disabled', async () => {
+		server.use(
+			rest.get(GLOBAL_CONFIG_URL, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({
+						data: { identN: { impersonation: { enabled: false } } },
+					}),
+				),
+			),
+		);
+
+		const wrapper = createWrapper();
+		const { result } = renderHook(() => useAppContext(), { wrapper });
+
+		await waitFor(
+			() => {
+				expect(result.current.isPreflightLoading).toBe(false);
+			},
+			{ timeout: 3000 },
+		);
+
+		expect(result.current.isNoAuthMode).toBe(false);
+		expect(getIsNoAuthMode()).toBe(false);
+	});
+
+	it('clears stale auth tokens from localStorage and resets in-memory JWT state when impersonation is enabled', async () => {
+		setLocalStorageApi(LOCALSTORAGE.AUTH_TOKEN, 'stale-access-token');
+		setLocalStorageApi(LOCALSTORAGE.REFRESH_AUTH_TOKEN, 'stale-refresh-token');
+		setLocalStorageApi(LOCALSTORAGE.LOGGED_IN_USER_EMAIL, 'old@example.com');
+		setLocalStorageApi(LOCALSTORAGE.LOGGED_IN_USER_NAME, 'Old Name');
+
+		server.use(
+			rest.get(GLOBAL_CONFIG_URL, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({
+						data: { identN: { impersonation: { enabled: true } } },
+					}),
+				),
+			),
+		);
+
+		const wrapper = createWrapper();
+		const { result } = renderHook(() => useAppContext(), { wrapper });
+
+		await waitFor(
+			() => {
+				expect(result.current.isNoAuthMode).toBe(true);
+			},
+			{ timeout: 3000 },
+		);
+
+		// localStorage cleared
+		expect(localStorage.getItem(LOCALSTORAGE.AUTH_TOKEN)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.REFRESH_AUTH_TOKEN)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.LOGGED_IN_USER_EMAIL)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.LOGGED_IN_USER_NAME)).toBeNull();
+
+		// in-memory JWTs reset so stale tokens don't linger in context or React Query keys
+		expect(result.current.user.accessJwt).toBe('');
+		expect(result.current.user.refreshJwt).toBe('');
+	});
+
+	it('transitions isPreflightLoading from true to false once preflight resolves', async () => {
+		server.use(
+			rest.get(GLOBAL_CONFIG_URL, (_, res, ctx) =>
+				res(
+					ctx.status(200),
+					ctx.json({
+						data: { identN: { impersonation: { enabled: false } } },
+					}),
+				),
+			),
+		);
+
+		const wrapper = createWrapper();
+		const { result } = renderHook(() => useAppContext(), { wrapper });
+
+		expect(result.current.isPreflightLoading).toBe(true);
+
+		await waitFor(
+			() => {
+				expect(result.current.isPreflightLoading).toBe(false);
+			},
+			{ timeout: 3000 },
+		);
+	});
+});

frontend/src/providers/App/types.ts

@@ -20,6 +20,8 @@ export interface IAppContext {
 	userPreferences: UserPreference[] | null;
 	hostsData: GetHosts200 | null;
 	isLoggedIn: boolean;
+	isNoAuthMode: boolean;
+	isPreflightLoading: boolean;
 	org: Organization[] | null;
 	isFetchingUser: boolean;
 	isFetchingActiveLicense: boolean;

frontend/src/tests/no-auth-test-utils.ts

@@ -0,0 +1,25 @@
+import type { IAppContext } from 'providers/App/types';
+
+import { render } from './test-utils';
+
+export const NO_AUTH_CONTEXT: Partial<IAppContext> = {
+	isNoAuthMode: true,
+	isPreflightLoading: false,
+};
+
+/**
+ * Renders a component with no-auth mode enabled in the app context.
+ * Mirrors the authz-test-utils pattern for consistent no-auth test setup.
+ */
+export function renderWithNoAuth(
+	...args: Parameters<typeof render>
+): ReturnType<typeof render> {
+	const [ui, options, providerProps = {}] = args;
+	return render(ui, options, {
+		...providerProps,
+		appContextOverrides: {
+			...providerProps.appContextOverrides,
+			...NO_AUTH_CONTEXT,
+		},
+	});
+}

frontend/src/tests/test-utils.tsx

@@ -243,6 +243,8 @@ export function getAppContextMock(
 		isFetchingOrgPreferences: false,
 		orgPreferencesFetchError: null,
 		isLoggedIn: true,
+		isNoAuthMode: false,
+		isPreflightLoading: false,
 		showChangelogModal: false,
 		updateUser: jest.fn(),
 		updateOrg: jest.fn(),

frontend/src/utils/__tests__/clearAuthStorage.test.ts

@@ -0,0 +1,39 @@
+import { LOCALSTORAGE } from 'constants/localStorage';
+
+import { clearAuthStorage } from '../clearAuthStorage';
+
+describe('clearAuthStorage', () => {
+	beforeEach(() => {
+		localStorage.clear();
+	});
+
+	it('removes all auth-related localStorage keys', () => {
+		localStorage.setItem(LOCALSTORAGE.AUTH_TOKEN, 'access');
+		localStorage.setItem(LOCALSTORAGE.REFRESH_AUTH_TOKEN, 'refresh');
+		localStorage.setItem(LOCALSTORAGE.IS_LOGGED_IN, 'true');
+		localStorage.setItem(LOCALSTORAGE.LOGGED_IN_USER_EMAIL, 'old@example.com');
+		localStorage.setItem(LOCALSTORAGE.LOGGED_IN_USER_NAME, 'old');
+		localStorage.setItem(LOCALSTORAGE.IS_IDENTIFIED_USER, 'true');
+		localStorage.setItem(LOCALSTORAGE.USER_ID, 'abc');
+
+		clearAuthStorage();
+
+		expect(localStorage.getItem(LOCALSTORAGE.AUTH_TOKEN)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.REFRESH_AUTH_TOKEN)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.IS_LOGGED_IN)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.LOGGED_IN_USER_EMAIL)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.LOGGED_IN_USER_NAME)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.IS_IDENTIFIED_USER)).toBeNull();
+		expect(localStorage.getItem(LOCALSTORAGE.USER_ID)).toBeNull();
+	});
+
+	it('preserves non-auth localStorage keys', () => {
+		localStorage.setItem(LOCALSTORAGE.THEME, 'dark');
+		localStorage.setItem(LOCALSTORAGE.AUTH_TOKEN, 'access');
+
+		clearAuthStorage();
+
+		expect(localStorage.getItem(LOCALSTORAGE.THEME)).toBe('dark');
+		expect(localStorage.getItem(LOCALSTORAGE.AUTH_TOKEN)).toBeNull();
+	});
+});

frontend/src/utils/clearAuthStorage.ts

@@ -0,0 +1,16 @@
+import deleteLocalStorageKey from 'api/browser/localstorage/remove';
+import { LOCALSTORAGE } from 'constants/localStorage';
+
+const AUTH_KEYS: LOCALSTORAGE[] = [
+	LOCALSTORAGE.AUTH_TOKEN,
+	LOCALSTORAGE.REFRESH_AUTH_TOKEN,
+	LOCALSTORAGE.IS_LOGGED_IN,
+	LOCALSTORAGE.LOGGED_IN_USER_EMAIL,
+	LOCALSTORAGE.LOGGED_IN_USER_NAME,
+	LOCALSTORAGE.IS_IDENTIFIED_USER,
+	LOCALSTORAGE.USER_ID,
+];
+
+export const clearAuthStorage = (): void => {
+	AUTH_KEYS.forEach((key) => deleteLocalStorageKey(key));
+};

frontend/src/utils/noAuthMode.ts

@@ -0,0 +1,7 @@
+let _isNoAuthMode = false;
+
+export const setNoAuthMode = (value: boolean): void => {
+	_isNoAuthMode = value;
+};
+
+export const getIsNoAuthMode = (): boolean => _isNoAuthMode;