test: format file

deploy/docker-swarm/docker-compose.ha.yaml

@@ -190,7 +190,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.122.0
+    image: signoz/signoz:v0.123.0
     ports:
       - "8080:8080" # signoz port
     #   - "6060:6060"     # pprof port

deploy/docker-swarm/docker-compose.yaml

@@ -117,7 +117,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.122.0
+    image: signoz/signoz:v0.123.0
     ports:
       - "8080:8080" # signoz port
     volumes:

deploy/docker/docker-compose.ha.yaml

@@ -181,7 +181,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.122.0}
+    image: signoz/signoz:${VERSION:-v0.123.0}
     container_name: signoz
     ports:
       - "8080:8080" # signoz port

deploy/docker/docker-compose.yaml

@@ -109,7 +109,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.122.0}
+    image: signoz/signoz:${VERSION:-v0.123.0}
     container_name: signoz
     ports:
       - "8080:8080" # signoz port

frontend/src/components/EditMemberDrawer/EditMemberDrawer.tsx

@@ -103,7 +103,7 @@ function EditMemberDrawer({
 	const { user: currentUser } = useAppContext();
 
 	const [localDisplayName, setLocalDisplayName] = useState('');
-	const [localRoles, setLocalRoles] = useState<string[]>([]);
+	const [localRole, setLocalRole] = useState('');
 	const [isSaving, setIsSaving] = useState(false);
 	const [saveErrors, setSaveErrors] = useState<SaveError[]>([]);
 	const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
@@ -141,7 +141,7 @@ function EditMemberDrawer({
 	} = useRoles();
 
 	const {
-		currentRoles: currentMemberRoles,
+		fetchedRoleIds,
 		isLoading: isMemberRolesLoading,
 		applyDiff,
 	} = useMemberRoleManager(member?.id ?? '', open && !!member?.id);
@@ -188,24 +188,16 @@ function EditMemberDrawer({
 		if (!member?.id) {
 			roleSessionRef.current = null;
 		} else if (member.id !== roleSessionRef.current && !isMemberRolesLoading) {
-			setLocalRoles(
-				currentMemberRoles.map((r) => r.id).filter(Boolean) as string[],
-			);
+			setLocalRole(fetchedRoleIds[0] ?? '');
 			roleSessionRef.current = member.id;
 		}
-	}, [member?.id, currentMemberRoles, isMemberRolesLoading]);
+	}, [member?.id, fetchedRoleIds, isMemberRolesLoading]);
 
 	const isDirty =
 		member !== null &&
 		fetchedUser != null &&
 		(localDisplayName !== fetchedDisplayName ||
-			JSON.stringify([...localRoles].sort()) !==
-				JSON.stringify(
-					currentMemberRoles
-						.map((r) => r.id)
-						.filter(Boolean)
-						.sort(),
-				));
+			localRole !== (fetchedRoleIds[0] ?? ''));
 
 	const { mutateAsync: updateMyUser } = useUpdateMyUserV2();
 	const { mutateAsync: updateUser } = useUpdateUser();
@@ -280,14 +272,7 @@ function EditMemberDrawer({
 		setIsSaving(true);
 		try {
 			const nameChanged = localDisplayName !== fetchedDisplayName;
-			const rolesChanged =
-				JSON.stringify([...localRoles].sort()) !==
-				JSON.stringify(
-					currentMemberRoles
-						.map((r) => r.id)
-						.filter(Boolean)
-						.sort(),
-				);
+			const rolesChanged = localRole !== (fetchedRoleIds[0] ?? '');
 
 			const namePromise = nameChanged
 				? isSelf
@@ -301,7 +286,7 @@ function EditMemberDrawer({
 			const [nameResult, rolesResult] = await Promise.allSettled([
 				namePromise,
 				rolesChanged
-					? applyDiff([...localRoles], availableRoles)
+					? applyDiff([localRole].filter(Boolean), availableRoles)
 					: Promise.resolve([]),
 			]);
 
@@ -320,7 +305,10 @@ function EditMemberDrawer({
 					context: 'Roles update',
 					apiError: toSaveApiError(rolesResult.reason),
 					onRetry: async (): Promise<void> => {
-						const failures = await applyDiff([...localRoles], availableRoles);
+						const failures = await applyDiff(
+							[localRole].filter(Boolean),
+							availableRoles,
+						);
 						setSaveErrors((prev) => {
 							const rest = prev.filter((e) => e.context !== 'Roles update');
 							return [
@@ -365,9 +353,9 @@ function EditMemberDrawer({
 		isDirty,
 		isSelf,
 		localDisplayName,
-		localRoles,
+		localRole,
 		fetchedDisplayName,
-		currentMemberRoles,
+		fetchedRoleIds,
 		updateMyUser,
 		updateUser,
 		applyDiff,
@@ -515,15 +503,10 @@ function EditMemberDrawer({
 					>
 						<div className="edit-member-drawer__input-wrapper edit-member-drawer__input-wrapper--disabled">
 							<div className="edit-member-drawer__disabled-roles">
-								{localRoles.length > 0 ? (
-									localRoles.map((roleId) => {
-										const role = availableRoles.find((r) => r.id === roleId);
-										return (
-											<Badge key={roleId} color="vanilla">
-												{role?.name ?? roleId}
-											</Badge>
-										);
-									})
+								{localRole ? (
+									<Badge color="vanilla">
+										{availableRoles.find((r) => r.id === localRole)?.name ?? localRole}
+									</Badge>
 								) : (
 									<span className="edit-member-drawer__email-text">—</span>
 								)}
@@ -534,15 +517,14 @@ function EditMemberDrawer({
 				) : (
 					<RolesSelect
 						id="member-role"
-						mode="multiple"
 						roles={availableRoles}
 						loading={rolesLoading}
 						isError={rolesError}
 						error={rolesErrorObj}
 						onRefetch={refetchRoles}
-						value={localRoles}
-						onChange={(roles): void => {
-							setLocalRoles(roles);
+						value={localRole}
+						onChange={(role): void => {
+							setLocalRole(role ?? '');
 							setSaveErrors((prev) =>
 								prev.filter(
 									(err) =>
@@ -550,7 +532,8 @@ function EditMemberDrawer({
 								),
 							);
 						}}
-						placeholder="Select roles"
+						placeholder="Select role"
+						allowClear={false}
 					/>
 				)}
 			</div>

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

@@ -5,9 +5,7 @@ import {
 	useCreateResetPasswordToken,
 	useDeleteUser,
 	useGetResetPasswordToken,
-	useGetRolesByUserID,
 	useGetUser,
-	useRemoveUserRoleByUserIDAndRoleID,
 	useSetRoleByUserID,
 	useUpdateMyUserV2,
 	useUpdateUser,
@@ -25,16 +23,11 @@ import EditMemberDrawer, { EditMemberDrawerProps } 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`,
-	],
 }));
 
 jest.mock('api/ErrorResponseHandlerForGeneratedAPIs', () => ({
@@ -105,7 +98,6 @@ jest.mock('react-use', () => ({
 const ROLES_ENDPOINT = '*/api/v1/roles';
 
 const mockDeleteMutate = jest.fn();
-const mockRemoveMutateAsync = jest.fn();
 const mockCreateTokenMutateAsync = jest.fn();
 
 const showErrorModal = jest.fn();
@@ -194,14 +186,6 @@ describe('EditMemberDrawer', () => {
 			isLoading: false,
 			refetch: jest.fn(),
 		});
-		(useGetRolesByUserID as jest.Mock).mockReturnValue({
-			data: { data: [managedRoles[0]] },
-			isLoading: false,
-		});
-		(useRemoveUserRoleByUserIDAndRoleID as jest.Mock).mockReturnValue({
-			mutateAsync: mockRemoveMutateAsync.mockResolvedValue({}),
-			isLoading: false,
-		});
 		(useUpdateUser as jest.Mock).mockReturnValue({
 			mutateAsync: jest.fn().mockResolvedValue({}),
 			isLoading: false,
@@ -312,7 +296,7 @@ describe('EditMemberDrawer', () => {
 		expect(onClose).not.toHaveBeenCalled();
 	});
 
-	it('adding a new role calls setRole without removing existing ones', async () => {
+	it('selecting a different role calls setRole with the new role name', async () => {
 		const onComplete = jest.fn();
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 		const mockSet = jest.fn().mockResolvedValue({});
@@ -324,7 +308,7 @@ describe('EditMemberDrawer', () => {
 
 		renderDrawer({ onComplete });
 
-		// signoz-admin is already selected; add signoz-editor on top
+		// Open the roles dropdown and select signoz-editor
 		await user.click(screen.getByLabelText('Roles'));
 		await user.click(await screen.findByTitle('signoz-editor'));
 
@@ -337,31 +321,34 @@ describe('EditMemberDrawer', () => {
 				pathParams: { id: 'user-1' },
 				data: { name: 'signoz-editor' },
 			});
-			expect(mockRemoveMutateAsync).not.toHaveBeenCalled();
 			expect(onComplete).toHaveBeenCalled();
 		});
 	});
 
-	it('deselecting a role calls removeRole with the role id', async () => {
+	it('does not call removeRole when the role is changed', async () => {
 		const onComplete = jest.fn();
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		const mockSet = jest.fn().mockResolvedValue({});
+
+		(useSetRoleByUserID as jest.Mock).mockReturnValue({
+			mutateAsync: mockSet,
+			isLoading: false,
+		});
 
 		renderDrawer({ onComplete });
 
-		// signoz-admin appears as a selected tag — click its remove button to deselect
-		const adminTag = await screen.findByTitle('signoz-admin');
-		const removeBtn = adminTag.querySelector(
-			'.ant-select-selection-item-remove',
-		) as Element;
-		await user.click(removeBtn);
+		// Switch from signoz-admin to signoz-viewer using single-select
+		await user.click(screen.getByLabelText('Roles'));
+		await user.click(await screen.findByTitle('signoz-viewer'));
 
 		const saveBtn = screen.getByRole('button', { name: /save member details/i });
 		await waitFor(() => expect(saveBtn).not.toBeDisabled());
 		await user.click(saveBtn);
 
 		await waitFor(() => {
-			expect(mockRemoveMutateAsync).toHaveBeenCalledWith({
-				pathParams: { id: 'user-1', roleId: managedRoles[0].id },
+			expect(mockSet).toHaveBeenCalledWith({
+				pathParams: { id: 'user-1' },
+				data: { name: 'signoz-viewer' },
 			});
 			expect(onComplete).toHaveBeenCalled();
 		});

frontend/src/hooks/member/useMemberRoleManager.ts

@@ -1,19 +1,8 @@
 import { useCallback, useMemo } from 'react';
-import { useQueryClient } from 'react-query';
 import type { AuthtypesRoleDTO } from 'api/generated/services/sigNoz.schemas';
-import {
-	getGetRolesByUserIDQueryKey,
-	useGetRolesByUserID,
-	useRemoveUserRoleByUserIDAndRoleID,
-	useSetRoleByUserID,
-} from 'api/generated/services/users';
+import { useGetUser, useSetRoleByUserID } from 'api/generated/services/users';
 import { retryOn429 } from 'utils/errorUtils';
 
-const enum PromiseStatus {
-	Fulfilled = 'fulfilled',
-	Rejected = 'rejected',
-}
-
 export interface MemberRoleUpdateFailure {
 	roleName: string;
 	error: unknown;
@@ -21,7 +10,7 @@ export interface MemberRoleUpdateFailure {
 }
 
 interface UseMemberRoleManagerResult {
-	currentRoles: AuthtypesRoleDTO[];
+	fetchedRoleIds: string[];
 	isLoading: boolean;
 	applyDiff: (
 		localRoleIds: string[],
@@ -33,96 +22,66 @@ export function useMemberRoleManager(
 	userId: string,
 	enabled: boolean,
 ): UseMemberRoleManagerResult {
-	const queryClient = useQueryClient();
-
-	const { data, isLoading } = useGetRolesByUserID(
+	const { data: fetchedUser, isLoading } = useGetUser(
 		{ id: userId },
 		{ query: { enabled: !!userId && enabled } },
 	);
 
-	const currentRoles = useMemo<AuthtypesRoleDTO[]>(
-		() => data?.data ?? [],
-		[data?.data],
+	const currentUserRoles = useMemo(
+		() => fetchedUser?.data?.userRoles ?? [],
+		[fetchedUser],
+	);
+
+	const fetchedRoleIds = useMemo(
+		() =>
+			currentUserRoles
+				.map((ur) => ur.role?.id ?? ur.roleId)
+				.filter((id): id is string => Boolean(id)),
+		[currentUserRoles],
 	);
 
 	const { mutateAsync: setRole } = useSetRoleByUserID({
 		mutation: { retry: retryOn429 },
 	});
-	const { mutateAsync: removeRole } = useRemoveUserRoleByUserIDAndRoleID({
-		mutation: { retry: retryOn429 },
-	});
-
-	const invalidateRoles = useCallback(
-		() =>
-			queryClient.invalidateQueries(getGetRolesByUserIDQueryKey({ id: userId })),
-		[userId, queryClient],
-	);
 
 	const applyDiff = useCallback(
 		async (
 			localRoleIds: string[],
 			availableRoles: AuthtypesRoleDTO[],
 		): Promise<MemberRoleUpdateFailure[]> => {
-			const currentRoleIds = new Set(
-				currentRoles.map((r) => r.id).filter(Boolean),
-			);
-			const desiredRoleIds = new Set(
-				localRoleIds.filter((id) => id != null && id !== ''),
+			const currentRoleIdSet = new Set(fetchedRoleIds);
+			const desiredRoleIdSet = new Set(localRoleIds.filter(Boolean));
+
+			const toAdd = availableRoles.filter(
+				(r) => r.id && desiredRoleIdSet.has(r.id) && !currentRoleIdSet.has(r.id),
 			);
 
-			const addedRoles = availableRoles.filter(
-				(r) => r.id && desiredRoleIds.has(r.id) && !currentRoleIds.has(r.id),
-			);
-			const removedRoles = currentRoles.filter(
-				(r) => r.id && !desiredRoleIds.has(r.id),
-			);
-
-			const allOperations = [
-				...addedRoles.map((role) => ({
-					role,
+			/// TODO: re-enable deletes once BE for this is streamlined
+			const allOps = [
+				...toAdd.map((role) => ({
+					roleName: role.name ?? 'unknown',
 					run: (): ReturnType<typeof setRole> =>
 						setRole({
 							pathParams: { id: userId },
 							data: { name: role.name ?? '' },
 						}),
 				})),
-				...removedRoles.map((role) => ({
-					role,
-					run: (): ReturnType<typeof removeRole> =>
-						removeRole({ pathParams: { id: userId, roleId: role.id ?? '' } }),
-				})),
 			];
 
-			const results = await Promise.allSettled(
-				allOperations.map((op) => op.run()),
-			);
-
-			const successCount = results.filter(
-				(r) => r.status === PromiseStatus.Fulfilled,
-			).length;
-			if (successCount > 0) {
-				await invalidateRoles();
-			}
+			const results = await Promise.allSettled(allOps.map((op) => op.run()));
 
 			const failures: MemberRoleUpdateFailure[] = [];
-			results.forEach((result, index) => {
-				if (result.status === PromiseStatus.Rejected) {
-					const { role, run } = allOperations[index];
-					failures.push({
-						roleName: role.name ?? 'unknown',
-						error: result.reason,
-						onRetry: async (): Promise<void> => {
-							await run();
-							await invalidateRoles();
-						},
-					});
+			results.forEach((result, i) => {
+				if (result.status === 'rejected') {
+					const { roleName, run } = allOps[i];
+					failures.push({ roleName, error: result.reason, onRetry: run });
 				}
 			});
 
 			return failures;
 		},
-		[userId, currentRoles, setRole, removeRole, invalidateRoles],
+		[userId, fetchedRoleIds, setRole],
 	);
 
-	return { currentRoles, isLoading, applyDiff };
+	return { fetchedRoleIds, isLoading, applyDiff };
 }

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

@@ -1,89 +0,0 @@
-.body {
-	padding: 12px 6px;
-	display: flex;
-	flex-direction: column;
-	flex: 1;
-	min-height: 0;
-	overflow: hidden;
-	background: var(--l1-background);
-
-	// TabsRoot — last direct child div
-	> div:last-child {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		min-height: 0;
-		overflow: hidden;
-	}
-
-	[role='tablist'] {
-		flex-shrink: 0;
-	}
-
-	// Tabs library wrapper — scoped by `.body` so the global match is contained.
-	:global([class*='tabs__list-wrapper']) {
-		padding-left: 0 !important;
-	}
-}
-
-.tabsScroll {
-	flex: 1;
-	min-height: 0;
-	overflow-y: auto;
-	scrollbar-width: none;
-}
-
-.list {
-	display: grid;
-	grid-template-columns: auto auto 1fr;
-	gap: 4px 8px;
-	padding: 8px 0;
-	align-items: center;
-}
-
-.dot {
-	width: 8px;
-	height: 8px;
-	border-radius: 2px;
-}
-
-.serviceName {
-	font-size: 13px;
-	color: var(--l1-foreground);
-	word-break: break-word;
-}
-
-.barCell {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-}
-
-.bar {
-	flex: 1;
-	height: 6px;
-	background: var(--l3-background);
-	border-radius: 3px;
-	min-width: 40px;
-}
-
-.barFill {
-	height: 100%;
-	border-radius: 3px;
-}
-
-.value {
-	flex-shrink: 0;
-	text-align: right;
-	font-size: 13px;
-	font-weight: 500;
-	color: var(--l1-foreground);
-}
-
-.valueWide {
-	min-width: 55px;
-}
-
-.valueNarrow {
-	min-width: 25px;
-}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/AnalyticsPanel/AnalyticsPanel.styles.scss

@@ -0,0 +1,96 @@
+.analytics-panel {
+	&__body {
+		padding: 12px 6px;
+		display: flex;
+		flex-direction: column;
+		flex: 1;
+		min-height: 0;
+		overflow: hidden;
+		background: var(--l1-background);
+
+		// TabsRoot — last direct child div
+		> div:last-child {
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			min-height: 0;
+			overflow: hidden;
+		}
+
+		[role='tablist'] {
+			flex-shrink: 0;
+		}
+	}
+
+	&__tabs-scroll {
+		flex: 1;
+		min-height: 0;
+		overflow-y: auto;
+		scrollbar-width: none;
+	}
+
+	&__list {
+		display: grid;
+		grid-template-columns: auto auto 1fr;
+		gap: 4px 8px;
+		padding: 8px 0;
+		align-items: center;
+	}
+
+	&__dot {
+		width: 8px;
+		height: 8px;
+		border-radius: 2px;
+	}
+
+	&__service-name {
+		font-size: 13px;
+		color: var(--l1-foreground);
+		word-break: break-word;
+	}
+
+	&__bar-cell {
+		display: flex;
+		align-items: center;
+		gap: 8px;
+	}
+
+	&__bar {
+		flex: 1;
+		height: 6px;
+		background: var(--l3-background);
+		border-radius: 3px;
+		min-width: 40px;
+
+		&--small {
+			max-width: 80px;
+			flex: 0 0 80px;
+		}
+	}
+
+	&__bar-fill {
+		height: 100%;
+		border-radius: 3px;
+	}
+
+	&__value {
+		flex-shrink: 0;
+		text-align: right;
+		font-size: 13px;
+		font-weight: 500;
+		color: var(--l1-foreground);
+
+		&--wide {
+			min-width: 55px;
+		}
+
+		&--narrow {
+			min-width: 25px;
+		}
+	}
+
+	// Tabs root
+	[class*='tabs__list-wrapper'] {
+		padding-left: 0 !important;
+	}
+}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/AnalyticsPanel/AnalyticsPanel.tsx

@@ -5,7 +5,6 @@ import {
 	TabsRoot,
 	TabsTrigger,
 } from '@signozhq/ui/tabs';
-import cx from 'classnames';
 import { DetailsHeader } from 'components/DetailsPanel';
 import { themeColors } from 'constants/theme';
 import { generateColor } from 'lib/uPlotLib/utils/generateColor';
@@ -17,7 +16,7 @@ import {
 	getAggregationMap as findAggregationMap,
 } from '../../utils/aggregations';
 
-import styles from './AnalyticsPanel.module.scss';
+import './AnalyticsPanel.styles.scss';
 
 interface AnalyticsPanelProps {
 	isOpen: boolean;
@@ -87,6 +86,7 @@ function AnalyticsPanel({
 	return (
 		<FloatingPanel
 			isOpen
+			className="analytics-panel"
 			width={PANEL_WIDTH}
 			height={window.innerHeight - PANEL_MARGIN_TOP - PANEL_MARGIN_BOTTOM}
 			defaultPosition={{
@@ -110,7 +110,7 @@ function AnalyticsPanel({
 				className="floating-panel__drag-handle"
 			/>
 
-			<div className={styles.body}>
+			<div className="analytics-panel__body">
 				<TabsRoot defaultValue="exec-time">
 					<TabsList variant="secondary">
 						<TabsTrigger value="exec-time" variant="secondary">
@@ -121,30 +121,33 @@ function AnalyticsPanel({
 						</TabsTrigger>
 					</TabsList>
 
-					<div className={styles.tabsScroll}>
+					<div className="analytics-panel__tabs-scroll">
 						<TabsContent value="exec-time">
-							<div className={styles.list}>
+							<div className="analytics-panel__list">
 								{execTimeRows.map((row) => (
 									<>
 										<div
 											key={`${row.group}-dot`}
-											className={styles.dot}
+											className="analytics-panel__dot"
 											style={{ backgroundColor: row.color }}
 										/>
-										<span key={`${row.group}-name`} className={styles.serviceName}>
+										<span
+											key={`${row.group}-name`}
+											className="analytics-panel__service-name"
+										>
 											{row.group}
 										</span>
-										<div key={`${row.group}-bar`} className={styles.barCell}>
-											<div className={styles.bar}>
+										<div key={`${row.group}-bar`} className="analytics-panel__bar-cell">
+											<div className="analytics-panel__bar">
 												<div
-													className={styles.barFill}
+													className="analytics-panel__bar-fill"
 													style={{
 														width: `${Math.min(row.percentage, 100)}%`,
 														backgroundColor: row.color,
 													}}
 												/>
 											</div>
-											<span className={cx(styles.value, styles.valueWide)}>
+											<span className="analytics-panel__value analytics-panel__value--wide">
 												{row.percentage.toFixed(2)}%
 											</span>
 										</div>
@@ -154,28 +157,31 @@ function AnalyticsPanel({
 						</TabsContent>
 
 						<TabsContent value="spans">
-							<div className={styles.list}>
+							<div className="analytics-panel__list">
 								{spanCountRows.map((row) => (
 									<>
 										<div
 											key={`${row.group}-dot`}
-											className={styles.dot}
+											className="analytics-panel__dot"
 											style={{ backgroundColor: row.color }}
 										/>
-										<span key={`${row.group}-name`} className={styles.serviceName}>
+										<span
+											key={`${row.group}-name`}
+											className="analytics-panel__service-name"
+										>
 											{row.group}
 										</span>
-										<div key={`${row.group}-bar`} className={styles.barCell}>
-											<div className={styles.bar}>
+										<div key={`${row.group}-bar`} className="analytics-panel__bar-cell">
+											<div className="analytics-panel__bar">
 												<div
-													className={styles.barFill}
+													className="analytics-panel__bar-fill"
 													style={{
 														width: `${(row.count / row.max) * 100}%`,
 														backgroundColor: row.color,
 													}}
 												/>
 											</div>
-											<span className={cx(styles.value, styles.valueNarrow)}>
+											<span className="analytics-panel__value analytics-panel__value--narrow">
 												{row.count}
 											</span>
 										</div>

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

@@ -1,26 +0,0 @@
-.root {
-	position: relative;
-}
-
-.toggle {
-	display: inline-flex;
-	align-items: center;
-	gap: 4px;
-	background: none;
-	border: none;
-	padding: 0;
-	cursor: pointer;
-	color: inherit;
-	font: inherit;
-}
-
-.label {
-	white-space: nowrap;
-}
-
-.list {
-	display: flex;
-	flex-direction: column;
-	gap: 12px;
-	padding: 12px 0;
-}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/LinkedSpans/LinkedSpans.styles.scss

@@ -0,0 +1,34 @@
+.linked-spans {
+	position: relative;
+
+	&__toggle {
+		display: inline-flex;
+		align-items: center;
+		gap: 4px;
+		background: none;
+		border: none;
+		padding: 0;
+		cursor: pointer;
+		color: inherit;
+		font: inherit;
+	}
+
+	&__label {
+		white-space: nowrap;
+	}
+
+	&__chevron {
+		transition: transform 0.15s ease;
+
+		&--open {
+			transform: rotate(90deg);
+		}
+	}
+
+	&__list {
+		display: flex;
+		flex-direction: column;
+		gap: 12px;
+		padding: 12px 0;
+	}
+}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/LinkedSpans/LinkedSpans.tsx

@@ -5,7 +5,7 @@ import { Badge } from '@signozhq/ui/badge';
 import ROUTES from 'constants/routes';
 import KeyValueLabel from 'periscope/components/KeyValueLabel';
 
-import styles from './LinkedSpans.module.scss';
+import './LinkedSpans.styles.scss';
 
 interface SpanReference {
 	traceId: string;
@@ -56,12 +56,12 @@ export function LinkedSpansToggle({
 	toggleOpen: () => void;
 }): JSX.Element {
 	if (count === 0) {
-		return <span className={styles.label}>0 linked spans</span>;
+		return <span className="linked-spans__label">0 linked spans</span>;
 	}
 
 	return (
-		<button type="button" className={styles.toggle} onClick={toggleOpen}>
-			<span className={styles.label}>
+		<button type="button" className="linked-spans__toggle" onClick={toggleOpen}>
+			<span className="linked-spans__label">
 				{count} linked span{count !== 1 ? 's' : ''}
 			</span>
 			{isOpen ? <ChevronDown size={12} /> : <ChevronRight size={12} />}
@@ -87,7 +87,7 @@ export function LinkedSpansPanel({
 	}
 
 	return (
-		<div className={styles.list}>
+		<div className="linked-spans__list">
 			{linkedSpans.map((item) => (
 				<KeyValueLabel
 					key={item.spanId}
@@ -108,7 +108,7 @@ function LinkedSpans({ references }: LinkedSpansProps): JSX.Element {
 	const { linkedSpans, count, isOpen, toggleOpen } = useLinkedSpans(references);
 
 	return (
-		<div className={styles.root}>
+		<div className="linked-spans">
 			<LinkedSpansToggle count={count} isOpen={isOpen} toggleOpen={toggleOpen} />
 			<LinkedSpansPanel linkedSpans={linkedSpans} isOpen={isOpen} />
 		</div>

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

@@ -1,146 +0,0 @@
-.root {
-	height: 100%;
-	display: flex;
-	flex-direction: column;
-	overflow: hidden;
-}
-
-.body {
-	padding: 12px;
-	display: flex;
-	flex-direction: column;
-	flex: 1;
-	min-height: 0;
-	overflow-y: auto;
-	scrollbar-width: none;
-	background: var(--l1-background);
-	font-size: 14px;
-	gap: 16px;
-
-	// DataViewer keeps its global `.data-viewer` class — give it a min-height
-	// so the tab area doesn't collapse on short content.
-	:global(.data-viewer) {
-		min-height: 500px;
-	}
-}
-
-.detailsSection {
-	flex-shrink: 0;
-	min-width: 0;
-}
-
-.tabsSection {
-	flex: 1;
-	min-width: 0;
-	max-height: 100%;
-	min-height: 400px;
-	display: flex;
-	flex-direction: column;
-	overflow: hidden;
-
-	// TabsRoot — direct child of tabs-section
-	> div {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		min-height: 0;
-		overflow: hidden;
-	}
-
-	[role='tablist'] {
-		flex-shrink: 0;
-	}
-
-	[class*='tabs__list-wrapper'] {
-		padding-left: 0 !important;
-	}
-}
-
-.tabsScroll {
-	flex: 1;
-	min-height: 0;
-	overflow-y: auto;
-	scrollbar-width: none;
-	display: flex;
-	flex-direction: column;
-
-	[role='tabpanel'] {
-		padding: 0;
-		flex: 1;
-		min-height: 0;
-	}
-}
-
-.spanRow {
-	display: flex;
-	align-items: center;
-	flex-wrap: wrap;
-	gap: 8px;
-	justify-content: space-between;
-}
-
-.spanInfo {
-	display: flex;
-	flex-wrap: wrap;
-	gap: 4px 16px;
-	padding: 8px 0;
-}
-
-.spanInfoItem {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	font-size: 13px;
-	color: var(--l2-foreground);
-	white-space: nowrap;
-}
-
-.highlightedOptions {
-	padding: 8px 0;
-	display: grid;
-	grid-template-columns: repeat(2, minmax(0, 1fr));
-	gap: 0;
-
-	// KeyValueLabel uses a global `.key-value-label` root; constrain it
-	// inside the two-column grid so values can ellipsize cleanly.
-	:global(.key-value-label) {
-		width: auto;
-		min-width: 0;
-		overflow: hidden;
-	}
-}
-
-.serviceDot {
-	display: inline-block;
-	width: 6px;
-	height: 6px;
-	border-radius: 50%;
-	background: var(--accent-forest);
-	flex-shrink: 0;
-}
-
-.traceId {
-	color: var(--accent-primary);
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	display: block;
-}
-
-.traceIdCopy {
-	display: block;
-	max-width: 100%;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	padding: 0;
-	height: auto;
-	justify-content: flex-start;
-}
-
-// Tooltip is rendered in a portal but the SpanDetailsPanel can be docked as a
-// FloatingPanel (z-index 999), which would otherwise sit on top of the default
-// tooltip (z-index 50). Bump the tooltip above the panel.
-.dockToggleTooltip {
-	--tooltip-z-index: 1000;
-}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanDetailsPanel.styles.scss

@@ -0,0 +1,170 @@
+.span-details-panel {
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+	overflow: hidden;
+
+	&__header-nav {
+		display: flex;
+		align-items: center;
+		gap: 2px;
+	}
+
+	&__body {
+		padding: 12px;
+		display: flex;
+		flex-direction: column;
+		flex: 1;
+		min-height: 0;
+		overflow-y: auto;
+		scrollbar-width: none;
+		background: var(--l1-background);
+		font-size: 14px;
+		gap: 16px;
+
+		.data-viewer {
+			min-height: 500px;
+		}
+	}
+
+	&__details-section {
+		flex-shrink: 0;
+		min-width: 0;
+	}
+
+	&__tabs-section {
+		flex: 1;
+		min-width: 0;
+		max-height: 100%;
+		min-height: 400px;
+		display: flex;
+		flex-direction: column;
+		overflow: hidden;
+
+		// TabsRoot — direct child of tabs-section
+		> div {
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			min-height: 0;
+			overflow: hidden;
+		}
+
+		[role='tablist'] {
+			flex-shrink: 0;
+		}
+
+		[class*='tabs__list-wrapper'] {
+			padding-left: 0 !important;
+		}
+	}
+
+	&__tabs-scroll {
+		flex: 1;
+		min-height: 0;
+		overflow-y: auto;
+		scrollbar-width: none;
+		display: flex;
+		flex-direction: column;
+
+		[role='tabpanel'] {
+			padding: 0;
+			flex: 1;
+			min-height: 0;
+		}
+	}
+
+	&__span-row {
+		display: flex;
+		align-items: center;
+		flex-wrap: wrap;
+		gap: 8px;
+		justify-content: space-between;
+	}
+
+	&__span-info {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 4px 16px;
+		padding: 8px 0;
+	}
+
+	&__span-info-item {
+		display: flex;
+		align-items: center;
+		gap: 8px;
+		font-size: 13px;
+		color: var(--l2-foreground);
+		white-space: nowrap;
+	}
+
+	&__highlighted-options {
+		padding: 8px 0;
+		display: grid;
+		grid-template-columns: repeat(2, minmax(0, 1fr));
+		gap: 0;
+
+		.key-value-label {
+			width: auto;
+			min-width: 0;
+			overflow: hidden;
+		}
+	}
+
+	&__service-dot {
+		display: inline-block;
+		width: 6px;
+		height: 6px;
+		border-radius: 50%;
+		background: var(--accent-forest);
+		flex-shrink: 0;
+	}
+
+	&__trace-id {
+		color: var(--accent-primary);
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		display: block;
+	}
+
+	&__trace-id-copy {
+		display: block;
+		max-width: 100%;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		padding: 0;
+		height: auto;
+		justify-content: flex-start;
+	}
+
+	&__key-attributes {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+		padding: 8px 0;
+
+		&-label {
+			font-size: var(--font-size-xs);
+			font-weight: var(--font-weight-medium);
+			color: var(--l2-foreground);
+			text-transform: uppercase;
+			letter-spacing: 0.48px;
+			line-height: var(--line-height-20);
+		}
+
+		&-chips {
+			display: flex;
+			flex-wrap: wrap;
+			gap: 6px;
+		}
+	}
+}
+
+// Tooltip is rendered in a portal but the SpanDetailsPanel can be docked as a
+// FloatingPanel (z-index 999), which would otherwise sit on top of the default
+// tooltip (z-index 50). Bump the tooltip above the panel.
+.dock-toggle-tooltip {
+	--tooltip-z-index: 1000;
+}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanDetailsPanel.tsx

@@ -72,7 +72,7 @@ import SpanPercentileBadge from './SpanPercentile/SpanPercentileBadge';
 import SpanPercentilePanel from './SpanPercentile/SpanPercentilePanel';
 import useSpanPercentile from './SpanPercentile/useSpanPercentile';
 
-import styles from './SpanDetailsPanel.module.scss';
+import './SpanDetailsPanel.styles.scss';
 
 interface SpanDetailsPanelProps {
 	panelState: DetailsPanelState;
@@ -275,9 +275,9 @@ function SpanDetailsContent({
 	// }, [selectedSpan]);
 
 	return (
-		<div className={styles.body}>
-			<div className={styles.detailsSection}>
-				<div className={styles.spanRow}>
+		<div className="span-details-panel__body">
+			<div className="span-details-panel__details-section">
+				<div className="span-details-panel__span-row">
 					<KeyValueLabel
 						badgeKey="Span name"
 						badgeValue={selectedSpan.name}
@@ -296,8 +296,8 @@ function SpanDetailsContent({
 				<SpanPercentilePanel selectedSpan={selectedSpan} percentile={percentile} />
 
 				{/* Span info: exec time + start time */}
-				<div className={styles.spanInfo}>
-					<div className={styles.spanInfoItem}>
+				<div className="span-details-panel__span-info">
+					<div className="span-details-panel__span-info-item">
 						<Timer size={14} />
 						<span>
 							{getYAxisFormattedValue(`${selectedSpan.duration_nano / 1000000}`, 'ms')}
@@ -316,13 +316,13 @@ function SpanDetailsContent({
 							)}
 						</span>
 					</div>
-					<div className={styles.spanInfoItem}>
+					<div className="span-details-panel__span-info-item">
 						<CalendarClock size={14} />
 						<span>
 							{dayjs(selectedSpan.timestamp).format('HH:mm:ss — MMM D, YYYY')}
 						</span>
 					</div>
-					<div className={styles.spanInfoItem}>
+					<div className="span-details-panel__span-info-item">
 						<Link2 size={14} />
 						<LinkedSpansToggle
 							count={linkedSpans.count}
@@ -338,7 +338,7 @@ function SpanDetailsContent({
 				/>
 
 				{/* Step 6: HighlightedOptions */}
-				<div className={styles.highlightedOptions}>
+				<div className="span-details-panel__highlighted-options">
 					{HIGHLIGHTED_OPTIONS.map((option) => {
 						const rendered = option.render(selectedSpan);
 						if (!rendered) {
@@ -382,7 +382,7 @@ function SpanDetailsContent({
 				{/* Step 8: MiniTraceContext */}
 			</div>
 
-			<div className={styles.tabsSection}>
+			<div className="span-details-panel__tabs-section">
 				{/* Step 9: ContentTabs */}
 				<TabsRoot defaultValue="overview">
 					<TabsList variant="secondary">
@@ -402,7 +402,7 @@ function SpanDetailsContent({
 						)}
 					</TabsList>
 
-					<div className={styles.tabsScroll}>
+					<div className="span-details-panel__tabs-scroll">
 						<TabsContent value="overview">
 							<DataViewer
 								data={spanDisplayData}
@@ -512,7 +512,7 @@ function SpanDetailsPanel({
 									{isDocked ? <Dock size={14} /> : <PanelBottom size={14} />}
 								</Button>
 							</TooltipTrigger>
-							<TooltipContent className={styles.dockToggleTooltip}>
+							<TooltipContent className="dock-toggle-tooltip">
 								{isDocked ? 'Open as floating panel' : 'Dock at the bottom'}
 							</TooltipContent>
 						</Tooltip>
@@ -546,7 +546,7 @@ function SpanDetailsPanel({
 					traceEndTime={traceEndTime}
 				/>
 			) : (
-				<div className={styles.body}>
+				<div className="span-details-panel__body">
 					<Skeleton active paragraph={{ rows: 6 }} title={{ width: '60%' }} />
 				</div>
 			)}
@@ -554,7 +554,7 @@ function SpanDetailsPanel({
 	);
 
 	if (variant === SpanDetailVariant.DOCKED) {
-		return <div className={styles.root}>{content}</div>;
+		return <div className="span-details-panel">{content}</div>;
 	}
 
 	if (variant === SpanDetailVariant.DRAWER) {
@@ -562,7 +562,7 @@ function SpanDetailsPanel({
 			<DetailsPanelDrawer
 				isOpen={panelState.isOpen}
 				onClose={panelState.close}
-				className={styles.root}
+				className="span-details-panel"
 			>
 				{content}
 			</DetailsPanelDrawer>
@@ -572,7 +572,7 @@ function SpanDetailsPanel({
 	return (
 		<FloatingPanel
 			isOpen={panelState.isOpen}
-			className={styles.root}
+			className="span-details-panel"
 			width={PANEL_WIDTH}
 			minWidth={480}
 			height={window.innerHeight - PANEL_MARGIN_TOP - PANEL_MARGIN_BOTTOM}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanPercentile/SpanPercentile.styles.scss

@@ -0,0 +1,258 @@
+// Badge — wraps a KeyValueLabel, clickable to toggle panel
+.span-percentile-badge {
+	cursor: pointer;
+
+	// Override key color for the percentile value (p99)
+	.key-value-label__key {
+		color: var(--destructive);
+	}
+
+	&__loader {
+		display: inline-flex;
+		align-items: center;
+		padding: 2px 4px;
+		color: var(--foreground);
+	}
+
+	&__value {
+		display: inline-flex;
+		align-items: center;
+		gap: 4px;
+	}
+
+	&__icon {
+		flex-shrink: 0;
+		color: var(--l2-foreground);
+	}
+}
+
+// Panel — collapsible, renders below the row
+.span-percentile-panel {
+	display: flex;
+	flex-direction: column;
+	position: relative;
+	border: 1px solid var(--l1-border);
+	border-radius: 4px;
+	filter: drop-shadow(2px 4px 16px rgba(0, 0, 0, 0.2));
+	backdrop-filter: blur(20px);
+	margin: 8px 16px;
+
+	&__header {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		gap: 8px;
+		padding: 8px 12px;
+		border-bottom: 1px solid var(--l1-border);
+
+		&-text {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+			cursor: pointer;
+		}
+
+		&-icon {
+			color: var(--l2-foreground);
+		}
+	}
+
+	&__content {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+		padding: 8px;
+
+		&-title {
+			font-size: var(--font-size-sm);
+			line-height: var(--line-height-20);
+		}
+
+		&-highlight {
+			color: var(--destructive);
+		}
+
+		&-loader {
+			display: inline-flex;
+			align-items: flex-end;
+			margin: 0 4px;
+			line-height: 18px;
+		}
+	}
+
+	&__timerange {
+		width: 100%;
+
+		&-select {
+			width: 100%;
+			margin-top: 8px;
+			margin-bottom: 16px;
+
+			.ant-select-selector {
+				border-radius: 50px;
+				border: 1px solid var(--l1-border);
+				background: var(--l1-background);
+				color: var(--l1-foreground);
+				font-size: 12px;
+				height: 32px;
+			}
+		}
+	}
+
+	&__table {
+		&-header {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			gap: 8px;
+
+			&-text {
+				color: var(--l1-foreground);
+				font-size: 11px;
+				font-weight: 500;
+				line-height: 20px;
+				text-transform: uppercase;
+			}
+		}
+
+		&-rows {
+			margin-top: 8px;
+			display: flex;
+			flex-direction: column;
+			gap: 4px;
+		}
+
+		&-skeleton {
+			.ant-skeleton-title {
+				width: 100% !important;
+				margin-top: 0 !important;
+			}
+
+			.ant-skeleton-paragraph {
+				margin-top: 8px;
+
+				& > li + li {
+					margin-top: 10px;
+					width: 100% !important;
+				}
+			}
+		}
+
+		&-row {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			gap: 12px;
+			padding: 0 4px;
+
+			&-key {
+				flex: 0 0 auto;
+				color: var(--l1-foreground);
+				font-size: 12px;
+				font-weight: 500;
+				line-height: 20px;
+			}
+
+			&-value {
+				color: var(--l2-foreground);
+				font-size: 12px;
+				line-height: 20px;
+			}
+
+			&-dash {
+				flex: 1;
+				height: 0;
+				margin: 0 8px;
+				border-top: 1px solid transparent;
+				border-image: repeating-linear-gradient(
+						to right,
+						var(--l1-border) 0,
+						var(--l1-border) 10px,
+						transparent 10px,
+						transparent 20px
+					)
+					1 stretch;
+			}
+
+			&--current {
+				border-radius: 2px;
+				background: rgba(78, 116, 248, 0.2);
+
+				.span-percentile-panel__table-row-key {
+					color: var(--text-robin-300);
+				}
+
+				.span-percentile-panel__table-row-dash {
+					border-image: repeating-linear-gradient(
+							to right,
+							#abbdff 0,
+							#abbdff 10px,
+							transparent 10px,
+							transparent 20px
+						)
+						1 stretch;
+				}
+
+				.span-percentile-panel__table-row-value {
+					color: var(--text-robin-400);
+				}
+			}
+		}
+	}
+
+	&__resource-selector {
+		overflow: hidden;
+		width: calc(100% + 16px);
+		position: absolute;
+		top: 32px;
+		left: -8px;
+		z-index: 1000;
+		border-radius: 4px;
+		border: 1px solid var(--l1-border);
+		background: var(--l1-background);
+		box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
+		backdrop-filter: blur(20px);
+
+		&-header {
+			border-bottom: 1px solid var(--l1-border);
+		}
+
+		&-input {
+			border-radius: 0;
+			border: none !important;
+			box-shadow: none !important;
+			height: 36px;
+		}
+
+		&-items {
+			height: 200px;
+			overflow-y: auto;
+
+			&::-webkit-scrollbar {
+				width: 0.3rem;
+				height: 0.3rem;
+			}
+
+			&::-webkit-scrollbar-track {
+				background: transparent;
+			}
+
+			&::-webkit-scrollbar-thumb {
+				background: var(--l3-background);
+			}
+		}
+
+		&-item {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+			padding: 8px 12px;
+
+			&-value {
+				color: var(--l1-foreground);
+				font-size: 13px;
+				line-height: 20px;
+			}
+		}
+	}
+}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanPercentile/SpanPercentileBadge.module.scss

@@ -1,28 +0,0 @@
-// Badge — wraps a KeyValueLabel, clickable to toggle panel
-.root {
-	cursor: pointer;
-
-	// KeyValueLabel renders its key with a global class; recolor only the badge
-	// instance inside this badge wrapper.
-	:global(.key-value-label__key) {
-		color: var(--destructive);
-	}
-}
-
-.loader {
-	display: inline-flex;
-	align-items: center;
-	padding: 2px 4px;
-	color: var(--foreground);
-}
-
-.value {
-	display: inline-flex;
-	align-items: center;
-	gap: 4px;
-}
-
-.icon {
-	flex-shrink: 0;
-	color: var(--l2-foreground);
-}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanPercentile/SpanPercentileBadge.tsx

@@ -3,7 +3,7 @@ import KeyValueLabel from 'periscope/components/KeyValueLabel';
 
 import { UseSpanPercentileReturn } from './useSpanPercentile';
 
-import styles from './SpanPercentileBadge.module.scss';
+import './SpanPercentile.styles.scss';
 
 type SpanPercentileBadgeProps = Pick<
 	UseSpanPercentileReturn,
@@ -25,7 +25,7 @@ function SpanPercentileBadge({
 }: SpanPercentileBadgeProps): JSX.Element | null {
 	if (loading) {
 		return (
-			<div className={styles.loader}>
+			<div className="span-percentile-badge__loader">
 				<Loader size={14} className="animate-spin" />
 			</div>
 		);
@@ -37,7 +37,7 @@ function SpanPercentileBadge({
 
 	return (
 		<div
-			className={styles.root}
+			className="span-percentile-badge"
 			onClick={toggleOpen}
 			role="button"
 			tabIndex={0}
@@ -50,12 +50,12 @@ function SpanPercentileBadge({
 			<KeyValueLabel
 				badgeKey={`p${percentileValue}`}
 				badgeValue={
-					<span className={styles.value}>
+					<span className="span-percentile-badge__value">
 						{duration}
 						{isOpen ? (
-							<ChevronUp size={14} className={styles.icon} />
+							<ChevronUp size={14} className="span-percentile-badge__icon" />
 						) : (
-							<ChevronDown size={14} className={styles.icon} />
+							<ChevronDown size={14} className="span-percentile-badge__icon" />
 						)}
 					</span>
 				}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanPercentile/SpanPercentilePanel.module.scss

@@ -1,217 +0,0 @@
-// Panel — collapsible, renders below the row
-.root {
-	display: flex;
-	flex-direction: column;
-	position: relative;
-	border: 1px solid var(--l1-border);
-	border-radius: 4px;
-	filter: drop-shadow(2px 4px 16px rgba(0, 0, 0, 0.2));
-	backdrop-filter: blur(20px);
-	margin: 8px 16px;
-}
-
-.header {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: 8px;
-	padding: 8px;
-	border-bottom: 1px solid var(--l1-border);
-}
-
-.content {
-	display: flex;
-	flex-direction: column;
-	gap: 8px;
-	padding: 8px;
-}
-
-.contentTitle {
-	font-size: var(--font-size-sm);
-	line-height: var(--line-height-20);
-}
-
-.contentHighlight {
-	color: var(--destructive);
-}
-
-.contentLoader {
-	display: inline-flex;
-	align-items: flex-end;
-	margin: 0 4px;
-	line-height: 18px;
-}
-
-.timerange {
-	width: 100%;
-}
-
-.timerangeSelect {
-	width: 100%;
-	margin-top: 8px;
-	margin-bottom: 16px;
-
-	:global(.ant-select-selector) {
-		border-radius: 50px;
-		border: 1px solid var(--l1-border);
-		background: var(--l1-background);
-		color: var(--l1-foreground);
-		font-size: 12px;
-		height: 32px;
-	}
-}
-
-.tableHeader {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: 8px;
-}
-
-.tableHeaderText {
-	color: var(--l1-foreground);
-	font-size: 11px;
-	font-weight: 500;
-	line-height: 20px;
-	text-transform: uppercase;
-}
-
-.tableRows {
-	margin-top: 8px;
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-}
-
-.tableSkeleton {
-	:global(.ant-skeleton-title) {
-		width: 100% !important;
-		margin-top: 0 !important;
-	}
-
-	:global(.ant-skeleton-paragraph) {
-		margin-top: 8px;
-
-		& > li + li {
-			margin-top: 10px;
-			width: 100% !important;
-		}
-	}
-}
-
-.tableRow {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: 12px;
-	padding: 0 4px;
-}
-
-.tableRowKey {
-	flex: 0 0 auto;
-	color: var(--l1-foreground);
-	font-size: 12px;
-	font-weight: 500;
-	line-height: 20px;
-}
-
-.tableRowValue {
-	color: var(--l2-foreground);
-	font-size: 12px;
-	line-height: 20px;
-}
-
-.tableRowDash {
-	flex: 1;
-	height: 0;
-	margin: 0 8px;
-	border-top: 1px solid transparent;
-	border-image: repeating-linear-gradient(
-			to right,
-			var(--l1-border) 0,
-			var(--l1-border) 10px,
-			transparent 10px,
-			transparent 20px
-		)
-		1 stretch;
-}
-
-.isCurrent {
-	border-radius: 2px;
-	background: rgba(78, 116, 248, 0.2);
-
-	.tableRowKey {
-		color: var(--text-robin-300);
-	}
-
-	.tableRowDash {
-		border-image: repeating-linear-gradient(
-				to right,
-				#abbdff 0,
-				#abbdff 10px,
-				transparent 10px,
-				transparent 20px
-			)
-			1 stretch;
-	}
-
-	.tableRowValue {
-		color: var(--text-robin-400);
-	}
-}
-
-.resourceSelector {
-	overflow: hidden;
-	width: calc(100% + 16px);
-	position: absolute;
-	top: 32px;
-	left: -8px;
-	z-index: 1000;
-	border-radius: 4px;
-	border: 1px solid var(--l1-border);
-	background: var(--l1-background);
-	box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
-	backdrop-filter: blur(20px);
-}
-
-.resourceSelectorHeader {
-	border-bottom: 1px solid var(--l1-border);
-}
-
-.resourceSelectorInput {
-	border-radius: 0;
-	border: none !important;
-	box-shadow: none !important;
-	height: 36px;
-}
-
-.resourceSelectorItems {
-	height: 200px;
-	overflow-y: auto;
-
-	&::-webkit-scrollbar {
-		width: 0.3rem;
-		height: 0.3rem;
-	}
-
-	&::-webkit-scrollbar-track {
-		background: transparent;
-	}
-
-	&::-webkit-scrollbar-thumb {
-		background: var(--l3-background);
-	}
-}
-
-.resourceSelectorItem {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	padding: 8px 12px;
-}
-
-.resourceSelectorItemValue {
-	color: var(--l1-foreground);
-	font-size: 13px;
-	line-height: 20px;
-}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanPercentile/SpanPercentilePanel.tsx

@@ -1,7 +1,5 @@
 import { Checkbox, Input, Select, Skeleton } from 'antd';
-import { Button } from '@signozhq/ui/button';
 import { Typography } from '@signozhq/ui/typography';
-import cx from 'classnames';
 import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 import dayjs from 'dayjs';
@@ -10,7 +8,7 @@ import { SpanV3 } from 'types/api/trace/getTraceV3';
 
 import { UseSpanPercentileReturn } from './useSpanPercentile';
 
-import styles from './SpanPercentilePanel.module.scss';
+import './SpanPercentile.styles.scss';
 
 const DEFAULT_RESOURCE_ATTRIBUTES = {
 	serviceName: 'service.name',
@@ -55,46 +53,46 @@ function SpanPercentilePanel({
 	}
 
 	return (
-		<div className={styles.root}>
-			<div className={styles.header}>
-				<Button
-					variant="link"
-					color="secondary"
+		<div className="span-percentile-panel">
+			<div className="span-percentile-panel__header">
+				<Typography.Text
+					className="span-percentile-panel__header-text"
 					onClick={toggleOpen}
-					prefix={<ChevronDown size={16} />}
 				>
-					Span Percentile
-				</Button>
+					<ChevronDown size={16} /> Span Percentile
+				</Typography.Text>
 
-				<Button
-					variant="link"
-					color="secondary"
-					size="icon"
-					onClick={(): void =>
-						setShowResourceAttributesSelector(!showResourceAttributesSelector)
-					}
-					prefix={
-						showResourceAttributesSelector ? <Check size={16} /> : <Plus size={16} />
-					}
-				/>
+				{showResourceAttributesSelector ? (
+					<Check
+						size={16}
+						className="cursor-pointer span-percentile-panel__header-icon"
+						onClick={(): void => setShowResourceAttributesSelector(false)}
+					/>
+				) : (
+					<Plus
+						size={16}
+						className="cursor-pointer span-percentile-panel__header-icon"
+						onClick={(): void => setShowResourceAttributesSelector(true)}
+					/>
+				)}
 			</div>
 
 			{showResourceAttributesSelector && (
 				<div
-					className={styles.resourceSelector}
+					className="span-percentile-panel__resource-selector"
 					ref={resourceAttributesSelectorRef}
 				>
-					<div className={styles.resourceSelectorHeader}>
+					<div className="span-percentile-panel__resource-selector-header">
 						<Input
 							placeholder="Search resource attributes"
-							className={styles.resourceSelectorInput}
+							className="span-percentile-panel__resource-selector-input"
 							value={resourceAttributesSearchQuery}
 							onChange={(e): void =>
 								setResourceAttributesSearchQuery(e.target.value as string)
 							}
 						/>
 					</div>
-					<div className={styles.resourceSelectorItems}>
+					<div className="span-percentile-panel__resource-selector-items">
 						{spanResourceAttributes
 							.filter((attr) =>
 								attr.key
@@ -102,7 +100,10 @@ function SpanPercentilePanel({
 									.includes(resourceAttributesSearchQuery.toLowerCase()),
 							)
 							.map((attr) => (
-								<div className={styles.resourceSelectorItem} key={attr.key}>
+								<div
+									className="span-percentile-panel__resource-selector-item"
+									key={attr.key}
+								>
 									<Checkbox
 										checked={attr.isSelected}
 										onChange={(e): void => {
@@ -117,7 +118,9 @@ function SpanPercentilePanel({
 											attr.key === DEFAULT_RESOURCE_ATTRIBUTES.name
 										}
 									>
-										<div className={styles.resourceSelectorItemValue}>{attr.key}</div>
+										<div className="span-percentile-panel__resource-selector-item-value">
+											{attr.key}
+										</div>
 									</Checkbox>
 								</div>
 							))}
@@ -125,15 +128,15 @@ function SpanPercentilePanel({
 				</div>
 			)}
 
-			<div className={styles.content}>
-				<Typography.Text className={styles.contentTitle}>
+			<div className="span-percentile-panel__content">
+				<Typography.Text className="span-percentile-panel__content-title">
 					This span duration is{' '}
 					{!loading && spanPercentileData ? (
-						<span className={styles.contentHighlight}>
+						<span className="span-percentile-panel__content-highlight">
 							p{Math.floor(spanPercentileData.percentile || 0)}
 						</span>
 					) : (
-						<span className={styles.contentLoader}>
+						<span className="span-percentile-panel__content-loader">
 							<Loader size={12} className="animate-spin" />
 						</span>
 					)}{' '}
@@ -141,11 +144,11 @@ function SpanPercentilePanel({
 					hour(s) since the span start time.
 				</Typography.Text>
 
-				<div className={styles.timerange}>
+				<div className="span-percentile-panel__timerange">
 					<Select
 						labelInValue
 						placeholder="Select timerange"
-						className={styles.timerangeSelect}
+						className="span-percentile-panel__timerange-select"
 						getPopupContainer={(trigger): HTMLElement =>
 							trigger.parentElement || document.body
 						}
@@ -164,45 +167,45 @@ function SpanPercentilePanel({
 					/>
 				</div>
 
-				<div>
-					<div className={styles.tableHeader}>
-						<Typography.Text className={styles.tableHeaderText}>
+				<div className="span-percentile-panel__table">
+					<div className="span-percentile-panel__table-header">
+						<Typography.Text className="span-percentile-panel__table-header-text">
 							Percentile
 						</Typography.Text>
-						<Typography.Text className={styles.tableHeaderText}>
+						<Typography.Text className="span-percentile-panel__table-header-text">
 							Duration
 						</Typography.Text>
 					</div>
 
-					<div className={styles.tableRows}>
+					<div className="span-percentile-panel__table-rows">
 						{isLoadingData || isFetchingData ? (
 							<Skeleton
 								active
 								paragraph={{ rows: 3 }}
-								className={styles.tableSkeleton}
+								className="span-percentile-panel__table-skeleton"
 							/>
 						) : (
 							<>
 								{Object.entries(spanPercentileData?.percentiles || {}).map(
 									([pKey, pDuration]) => (
-										<div className={styles.tableRow} key={pKey}>
-											<Typography.Text className={styles.tableRowKey}>
+										<div className="span-percentile-panel__table-row" key={pKey}>
+											<Typography.Text className="span-percentile-panel__table-row-key">
 												{pKey}
 											</Typography.Text>
-											<div className={styles.tableRowDash} />
-											<Typography.Text className={styles.tableRowValue}>
+											<div className="span-percentile-panel__table-row-dash" />
+											<Typography.Text className="span-percentile-panel__table-row-value">
 												{getYAxisFormattedValue(`${pDuration / 1000000}`, 'ms')}
 											</Typography.Text>
 										</div>
 									),
 								)}
 
-								<div className={cx(styles.tableRow, styles.isCurrent)}>
-									<Typography.Text className={styles.tableRowKey}>
+								<div className="span-percentile-panel__table-row span-percentile-panel__table-row--current">
+									<Typography.Text className="span-percentile-panel__table-row-key">
 										p{Math.floor(spanPercentileData?.percentile || 0)}
 									</Typography.Text>
-									<div className={styles.tableRowDash} />
-									<Typography.Text className={styles.tableRowValue}>
+									<div className="span-percentile-panel__table-row-dash" />
+									<Typography.Text className="span-percentile-panel__table-row-value">
 										(this span){' '}
 										{getYAxisFormattedValue(
 											`${selectedSpan.duration_nano / 1000000}`,

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/TraceIdField.tsx

@@ -5,8 +5,6 @@ import { toast } from '@signozhq/ui/sonner';
 import ROUTES from 'constants/routes';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 
-import styles from './SpanDetailsPanel.module.scss';
-
 interface TraceIdFieldProps {
 	span: SpanV3;
 }
@@ -38,7 +36,7 @@ export function TraceIdField({ span }: TraceIdFieldProps): JSX.Element {
 			<Button
 				variant="link"
 				color="secondary"
-				className={styles.traceIdCopy}
+				className="span-details-panel__trace-id-copy"
 				onClick={handleCopy}
 				title="Click to copy trace ID"
 			>
@@ -53,7 +51,7 @@ export function TraceIdField({ span }: TraceIdFieldProps): JSX.Element {
 				pathname: `/trace/${span.trace_id}`,
 				search: window.location.search,
 			}}
-			className={styles.traceId}
+			className="span-details-panel__trace-id"
 		>
 			{span.trace_id}
 		</Link>

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/config.tsx

@@ -2,7 +2,6 @@ import { ReactNode } from 'react';
 import { Badge } from '@signozhq/ui/badge';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 
-import styles from './SpanDetailsPanel.module.scss';
 import { TraceIdField } from './TraceIdField';
 
 interface HighlightedOption {
@@ -18,7 +17,7 @@ export const HIGHLIGHTED_OPTIONS: HighlightedOption[] = [
 		render: (span): ReactNode | null =>
 			span['service.name'] ? (
 				<Badge color="vanilla">
-					<span className={styles.serviceDot} />
+					<span className="span-details-panel__service-dot" />
 					{span['service.name']}
 				</Badge>
 			) : null,

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

@@ -1,60 +0,0 @@
-.root {
-	font-size: 12px;
-	color: var(--l1-foreground);
-	max-width: 300px;
-}
-
-.header {
-	display: inline-flex;
-	align-items: center;
-	gap: 4px;
-	background: var(--l2-background);
-	border: 1px solid var(--l2-border);
-	border-radius: 3px;
-	padding: 2px 6px;
-	font-size: 10px;
-	font-weight: 600;
-	text-transform: uppercase;
-	letter-spacing: 0.5px;
-	color: var(--l2-foreground);
-	margin-bottom: 6px;
-}
-
-.name {
-	font-weight: 600;
-	margin-bottom: 2px;
-	color: var(--text-robin-400);
-}
-
-.hasError {
-	color: var(--destructive);
-}
-
-.time {
-	font-size: 11px;
-	color: var(--l2-foreground);
-	margin-bottom: 4px;
-}
-
-.divider {
-	border-top: 1px solid var(--l2-border);
-	margin: 6px 0;
-}
-
-.attributes {
-	font-size: 11px;
-}
-
-.kv {
-	margin-bottom: 2px;
-	line-height: 1.4;
-	word-break: break-all;
-}
-
-.key {
-	color: var(--l2-foreground);
-}
-
-.value {
-	color: var(--l1-foreground);
-}

frontend/src/pages/TraceDetailsV3/SpanHoverCard/EventTooltipContent.styles.scss

@@ -0,0 +1,60 @@
+.event-tooltip-content {
+	font-size: 12px;
+	color: var(--l1-foreground);
+	max-width: 300px;
+
+	&__header {
+		display: inline-flex;
+		align-items: center;
+		gap: 4px;
+		background: var(--l2-background);
+		border: 1px solid var(--l2-border);
+		border-radius: 3px;
+		padding: 2px 6px;
+		font-size: 10px;
+		font-weight: 600;
+		text-transform: uppercase;
+		letter-spacing: 0.5px;
+		color: var(--l2-foreground);
+		margin-bottom: 6px;
+	}
+
+	&__name {
+		font-weight: 600;
+		margin-bottom: 2px;
+		color: var(--text-robin-400);
+
+		&.error {
+			color: var(--destructive);
+		}
+	}
+
+	&__time {
+		font-size: 11px;
+		color: var(--l2-foreground);
+		margin-bottom: 4px;
+	}
+
+	&__divider {
+		border-top: 1px solid var(--l2-border);
+		margin: 6px 0;
+	}
+
+	&__attributes {
+		font-size: 11px;
+	}
+
+	&__kv {
+		margin-bottom: 2px;
+		line-height: 1.4;
+		word-break: break-all;
+	}
+
+	&__key {
+		color: var(--l2-foreground);
+	}
+
+	&__value {
+		color: var(--l1-foreground);
+	}
+}

frontend/src/pages/TraceDetailsV3/SpanHoverCard/EventTooltipContent.tsx

@@ -1,9 +1,8 @@
 import { convertTimeToRelevantUnit } from 'container/TraceDetail/utils';
 import { Diamond } from '@signozhq/icons';
-import cx from 'classnames';
 import { toFixed } from 'utils/toFixed';
 
-import styles from './EventTooltipContent.module.scss';
+import './EventTooltipContent.styles.scss';
 
 export interface EventTooltipContentProps {
 	eventName: string;
@@ -21,25 +20,25 @@ export function EventTooltipContent({
 	const { time, timeUnitName } = convertTimeToRelevantUnit(timeOffsetMs);
 
 	return (
-		<div className={styles.root}>
-			<div className={styles.header}>
+		<div className="event-tooltip-content">
+			<div className="event-tooltip-content__header">
 				<Diamond size={10} />
 				<span>EVENT DETAILS</span>
 			</div>
-			<div className={cx(styles.name, isError && styles.hasError)}>
+			<div className={`event-tooltip-content__name ${isError ? 'error' : ''}`}>
 				{eventName}
 			</div>
-			<div className={styles.time}>
+			<div className="event-tooltip-content__time">
 				{toFixed(time, 2)} {timeUnitName} since span start
 			</div>
 			{Object.keys(attributeMap).length > 0 && (
 				<>
-					<div className={styles.divider} />
-					<div className={styles.attributes}>
+					<div className="event-tooltip-content__divider" />
+					<div className="event-tooltip-content__attributes">
 						{Object.entries(attributeMap).map(([key, value]) => (
-							<div key={key} className={styles.kv}>
-								<span className={styles.key}>{key}:</span>{' '}
-								<span className={styles.value}>{value}</span>
+							<div key={key} className="event-tooltip-content__kv">
+								<span className="event-tooltip-content__key">{key}:</span>{' '}
+								<span className="event-tooltip-content__value">{value}</span>
 							</div>
 						))}
 					</div>

frontend/src/pages/TraceDetailsV3/SpanHoverCard/SpanHoverCard.styles.scss

@@ -2,13 +2,13 @@
 // `top` is updated by the parent to track the hovered row's Y; its `left`
 // is the sidebar/timeline boundary so the popover always opens at the same
 // X regardless of which row is hovered.
-.anchor {
+.span-hover-card-anchor {
 	position: absolute;
 	width: 1px;
 	pointer-events: none;
 }
 
-.popover {
+.span-hover-card-popover {
 	// Hover card may be rendered while the SpanDetailsPanel is docked as
 	// a FloatingPanel (z-index 999); bump above the default tooltip z-index.
 	--tooltip-z-index: 1000;
@@ -20,29 +20,31 @@
 	color: var(--l1-foreground);
 }
 
-.content {
+// Flamegraph tooltip — rendered as a portal, uses same semantic tokens.
+// Position is set inline on the element (left/top track the cursor); the
+// static layout/decoration lives here.
+.flamegraph-tooltip {
+	position: fixed;
+	z-index: 1000;
+	pointer-events: none;
+	background-color: var(--l1-background);
+	padding: 8px 12px;
+	border-radius: 4px;
+	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
+	border: 1px solid var(--l2-border);
+}
+
+.span-hover-card-content {
 	font-size: 12px;
 	color: var(--l1-foreground);
-}
 
-.name {
-	font-weight: 600;
-	margin-bottom: 4px;
-}
+	&__name {
+		font-weight: 600;
+		margin-bottom: 4px;
+	}
 
-.row {
-	line-height: 1.5;
-	color: var(--l2-foreground);
-}
-
-.preview {
-	// container for additional preview rows
-}
-
-.previewKey {
-	color: var(--l2-foreground);
-}
-
-.previewValue {
-	color: var(--l1-foreground);
+	&__row {
+		line-height: 1.5;
+		color: var(--l2-foreground);
+	}
 }

frontend/src/pages/TraceDetailsV3/SpanHoverCard/SpanHoverCard.tsx

@@ -11,7 +11,7 @@ import { useMemo } from 'react';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 import { toFixed } from 'utils/toFixed';
 
-import styles from './SpanHoverCard.module.scss';
+import './SpanHoverCard.styles.scss';
 
 /**
  * Span-level fields that the tooltip always shows (as the colored title or
@@ -51,21 +51,27 @@ export function SpanTooltipContent({
 		convertTimeToRelevantUnit(durationMs);
 
 	return (
-		<div className={styles.content}>
-			<div className={styles.name} style={{ color }}>
+		<div className="span-hover-card-content">
+			<div className="span-hover-card-content__name" style={{ color }}>
 				{spanName}
 			</div>
-			<div className={styles.row}>status: {hasError ? 'error' : 'ok'}</div>
-			<div className={styles.row}>start: {toFixed(relativeStartMs, 2)} ms</div>
-			<div className={styles.row}>
+			<div className="span-hover-card-content__row">
+				status: {hasError ? 'error' : 'ok'}
+			</div>
+			<div className="span-hover-card-content__row">
+				start: {toFixed(relativeStartMs, 2)} ms
+			</div>
+			<div className="span-hover-card-content__row">
 				duration: {toFixed(formattedDuration, 2)} {timeUnitName}
 			</div>
 			{previewRows && previewRows.length > 0 && (
-				<div className={styles.preview}>
+				<div className="span-hover-card-content__preview">
 					{previewRows.map((row) => (
-						<div key={row.key} className={styles.row}>
-							<span className={styles.previewKey}>{row.key}:</span>{' '}
-							<span className={styles.previewValue}>{row.value}</span>
+						<div key={row.key} className="span-hover-card-content__row">
+							<span className="span-hover-card-content__preview-key">{row.key}:</span>{' '}
+							<span className="span-hover-card-content__preview-value">
+								{row.value}
+							</span>
 						</div>
 					))}
 				</div>
@@ -146,7 +152,7 @@ export function SpanHoverCard({
 			<Tooltip open={hoverCardData !== null} onOpenChange={onOpenChange}>
 				<TooltipTrigger asChild>
 					<div
-						className={styles.anchor}
+						className="span-hover-card-anchor"
 						style={{
 							top: hoverCardData?.anchorTop ?? 0,
 							left: anchorLeft,
@@ -158,7 +164,7 @@ export function SpanHoverCard({
 					side="right"
 					align="start"
 					sideOffset={8}
-					className={styles.popover}
+					className="span-hover-card-popover"
 				>
 					{hoverCardData && <SpanTooltipContent {...hoverCardData.tooltip} />}
 				</TooltipContent>

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

@@ -1,75 +0,0 @@
-.wrapper {
-	flex-shrink: 0;
-	position: relative;
-}
-
-.header {
-	display: flex;
-	align-items: center;
-	padding: 8px 16px;
-	gap: 8px;
-
-	// KeyValueLabel renders with a global `.key-value-label` root; keep it from
-	// shrinking on the trace details header.
-	:global(.key-value-label) {
-		flex-shrink: 0;
-	}
-}
-
-.backBtn {
-	flex-shrink: 0;
-}
-
-.filter {
-	min-width: 0;
-}
-
-.isExpanded {
-	max-width: none;
-	flex: 1;
-}
-
-.oldViewBtn {
-	flex-shrink: 0;
-}
-
-.analyticsBtn {
-	flex-shrink: 0;
-	margin-left: auto;
-}
-
-.subHeader {
-	display: flex;
-	align-items: center;
-	gap: 16px;
-	padding: 4px 16px 8px;
-	font-size: 13px;
-	color: var(--l2-foreground);
-}
-
-.subItem {
-	display: flex;
-	align-items: center;
-	gap: 6px;
-	white-space: nowrap;
-}
-
-.separator {
-	color: var(--l2-foreground);
-	opacity: 0.5;
-}
-
-.entryPointBadge {
-	padding: 2px 8px;
-	border: 1px solid var(--l2-border);
-	border-radius: 4px;
-	font-size: 12px;
-}
-
-.skeleton {
-	:global(.ant-skeleton-input) {
-		width: 160px !important;
-		min-height: 20px !important;
-		height: 20px !important;
-	}
-}

frontend/src/pages/TraceDetailsV3/TraceDetailsHeader/TraceDetailsHeader.styles.scss

@@ -0,0 +1,74 @@
+.trace-details-header-wrapper {
+	flex-shrink: 0;
+	position: relative;
+}
+
+.trace-details-header {
+	display: flex;
+	align-items: center;
+	padding: 8px 16px;
+	gap: 8px;
+
+	&__back-btn {
+		flex-shrink: 0;
+	}
+
+	.key-value-label {
+		flex-shrink: 0;
+	}
+
+	&__filter {
+		&.trace-v3-filter-row {
+			padding: 0;
+		}
+		min-width: 0;
+
+		&--expanded {
+			max-width: none;
+			flex: 1;
+		}
+	}
+
+	&__old-view-btn {
+		flex-shrink: 0;
+	}
+
+	&__analytics-btn {
+		flex-shrink: 0;
+		margin-left: auto;
+	}
+
+	&__sub-header {
+		display: flex;
+		align-items: center;
+		gap: 16px;
+		padding: 4px 16px 8px;
+		font-size: 13px;
+		color: var(--l2-foreground);
+	}
+
+	&__sub-item {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+		white-space: nowrap;
+	}
+
+	&__separator {
+		color: var(--l2-foreground);
+		opacity: 0.5;
+	}
+
+	&__entry-point-badge {
+		padding: 2px 8px;
+		border: 1px solid var(--l2-border);
+		border-radius: 4px;
+		font-size: 12px;
+	}
+
+	&__skeleton .ant-skeleton-input {
+		width: 160px !important;
+		min-height: 20px !important;
+		height: 20px !important;
+	}
+}

frontend/src/pages/TraceDetailsV3/TraceDetailsHeader/TraceDetailsHeader.tsx

@@ -9,7 +9,6 @@ import {
 } from '@signozhq/ui/tooltip';
 import { Skeleton } from 'antd';
 import setLocalStorageKey from 'api/browser/localstorage/set';
-import cx from 'classnames';
 import HttpStatusBadge from 'components/HttpStatusBadge/HttpStatusBadge';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import ROUTES from 'constants/routes';
@@ -34,7 +33,7 @@ import AnalyticsPanel from '../SpanDetailsPanel/AnalyticsPanel/AnalyticsPanel';
 import Filters from '../TraceWaterfall/TraceWaterfallStates/Success/Filters/Filters';
 import TraceOptionsMenu from './TraceOptionsMenu';
 
-import styles from './TraceDetailsHeader.module.scss';
+import './TraceDetailsHeader.styles.scss';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 
 interface FilterMetadata {
@@ -69,7 +68,7 @@ function DetailsLoader(): JSX.Element {
 					key={i}
 					active
 					size="small"
-					className={styles.skeleton}
+					className="trace-details-header__skeleton"
 				/>
 			))}
 		</>
@@ -121,15 +120,15 @@ function TraceDetailsHeader({
 		convertTimeToRelevantUnit(durationMs);
 
 	return (
-		<div className={styles.wrapper}>
-			<div className={styles.header}>
+		<div className="trace-details-header-wrapper">
+			<div className="trace-details-header">
 				{!isFilterExpanded && (
 					<>
 						<Button
 							variant="solid"
 							color="secondary"
 							size="md"
-							className={styles.backBtn}
+							className="trace-details-header__back-btn"
 							onClick={handlePreviousBtnClick}
 						>
 							<ArrowLeft size={14} />
@@ -152,7 +151,7 @@ function TraceDetailsHeader({
 												variant="ghost"
 												size="icon"
 												color="secondary"
-												className={styles.analyticsBtn}
+												className="trace-details-header__analytics-btn"
 												onClick={(): void => setIsAnalyticsOpen((prev) => !prev)}
 											>
 												<ChartPie size={14} />
@@ -168,7 +167,11 @@ function TraceDetailsHeader({
 								/>
 							</>
 						)}
-						<div className={cx(styles.filter, isFilterExpanded && styles.isExpanded)}>
+						<div
+							className={`trace-details-header__filter${
+								isFilterExpanded ? ' trace-details-header__filter--expanded' : ''
+							}`}
+						>
 							<Filters
 								startTime={filterMetadata.startTime}
 								endTime={filterMetadata.endTime}
@@ -184,7 +187,7 @@ function TraceDetailsHeader({
 								variant="solid"
 								color="secondary"
 								size="sm"
-								className={styles.oldViewBtn}
+								className="trace-details-header__old-view-btn"
 								onClick={handleSwitchToOldView}
 							>
 								Legacy View
@@ -195,22 +198,22 @@ function TraceDetailsHeader({
 			</div>
 
 			{showTraceDetails && (
-				<div className={styles.subHeader}>
+				<div className="trace-details-header__sub-header">
 					{traceMetadata ? (
 						<>
-							<span className={styles.subItem}>
+							<span className="trace-details-header__sub-item">
 								<Server size={13} />
 								{traceMetadata.rootServiceName}
-								<span className={styles.separator}>—</span>
-								<span className={styles.entryPointBadge}>
+								<span className="trace-details-header__separator">—</span>
+								<span className="trace-details-header__entry-point-badge">
 									{traceMetadata.rootServiceEntryPoint}
 								</span>
 							</span>
-							<span className={styles.subItem}>
+							<span className="trace-details-header__sub-item">
 								<Timer size={13} />
 								{parseFloat(formattedDuration.toFixed(2))} {timeUnitName}
 							</span>
-							<span className={styles.subItem}>
+							<span className="trace-details-header__sub-item">
 								<CalendarClock size={13} />
 								{dayjs(traceMetadata.startTimestampMillis).format(
 									DATE_TIME_FORMATS.DD_MMM_YYYY_HH_MM_SS,

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

@@ -1,127 +0,0 @@
-.root {
-	height: calc(100vh);
-	display: flex;
-	flex-direction: column;
-}
-
-.content {
-	display: flex;
-	flex-direction: column;
-	flex: 1;
-	overflow: hidden;
-}
-
-// Shared Ant Collapse chrome reset for both the flamegraph and waterfall
-// collapse panels.
-.flameCollapse,
-.waterfallCollapse {
-	border: none;
-	border-radius: 0;
-	background: transparent;
-
-	:global(.ant-collapse-item) {
-		border: none;
-	}
-
-	:global(.ant-collapse-header) {
-		border-top: 1px solid var(--l2-border);
-		border-bottom: 1px solid var(--l2-border);
-	}
-
-	:global(.ant-collapse-content) {
-		background: transparent;
-		border-top: none;
-		// Disable collapse animation — virtualizer and canvas flicker during
-		// height transitions.
-		transition: none !important;
-	}
-}
-
-.collapseLabel {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	width: 100%;
-}
-
-.collapseTitle {
-	display: inline-flex;
-	align-items: center;
-	gap: 6px;
-}
-
-.collapseCount {
-	display: flex;
-	gap: 12px;
-	align-items: center;
-	font-size: 12px;
-	font-weight: 400;
-	color: var(--l2-foreground);
-}
-
-.collapseCountItem {
-	display: inline-flex;
-	align-items: center;
-	gap: 4px;
-}
-
-.hasErrors {
-	color: var(--destructive);
-}
-
-.flameCollapse {
-	flex-shrink: 0;
-
-	:global(.ant-collapse-content-box) {
-		padding: 0 !important;
-	}
-}
-
-.waterfallCollapse {
-	flex: 1;
-	display: flex;
-	flex-direction: column;
-	overflow: hidden;
-
-	:global(.ant-collapse-item) {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		min-height: 0;
-	}
-
-	:global(.ant-collapse-content.ant-collapse-content-active) {
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		min-height: 0;
-	}
-
-	:global(.ant-collapse-content-box) {
-		padding: 0 !important;
-		flex: 1;
-		display: flex;
-		flex-direction: column;
-		min-height: 0;
-	}
-
-	&.isDocked {
-		flex: none;
-
-		:global(.ant-collapse-item) {
-			flex: none;
-			display: block;
-		}
-
-		:global(.ant-collapse-content-box) {
-			flex: none;
-			display: block;
-		}
-	}
-}
-
-.dockedSpanDetails {
-	flex: 1;
-	overflow: auto;
-	min-height: 0;
-}

frontend/src/pages/TraceDetailsV3/TraceDetailsV3.styles.scss

@@ -0,0 +1,124 @@
+.trace-details-v3 {
+	height: calc(100vh);
+	display: flex;
+	flex-direction: column;
+
+	&__content {
+		display: flex;
+		flex-direction: column;
+		flex: 1;
+		overflow: hidden;
+	}
+
+	&__flame-collapse,
+	&__waterfall-collapse {
+		border: none;
+		border-radius: 0;
+		background: transparent;
+
+		.ant-collapse-item {
+			border: none;
+		}
+
+		.ant-collapse-header {
+			border-top: 1px solid var(--l2-border);
+			border-bottom: 1px solid var(--l2-border);
+		}
+
+		.ant-collapse-content {
+			background: transparent;
+			border-top: none;
+			// Disable collapse animation — virtualizer and canvas flicker during height transitions
+			transition: none !important;
+		}
+	}
+
+	&__collapse-label {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		width: 100%;
+	}
+
+	&__collapse-title {
+		display: inline-flex;
+		align-items: center;
+		gap: 6px;
+	}
+
+	&__collapse-count {
+		display: flex;
+		gap: 12px;
+		align-items: center;
+		font-size: 12px;
+		font-weight: 400;
+		color: var(--l2-foreground);
+	}
+
+	&__collapse-count-item {
+		display: inline-flex;
+		align-items: center;
+		gap: 4px;
+	}
+
+	&__collapse-count-errors {
+		color: var(--destructive);
+	}
+
+	&__flame-collapse {
+		flex-shrink: 0;
+
+		.ant-collapse-content-box {
+			padding: 0 !important;
+		}
+	}
+
+	&__waterfall-collapse {
+		flex: 1;
+		display: flex;
+		flex-direction: column;
+		overflow: hidden;
+
+		.ant-collapse-item {
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			min-height: 0;
+		}
+
+		.ant-collapse-content.ant-collapse-content-active {
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			min-height: 0;
+		}
+
+		.ant-collapse-content-box {
+			padding: 0 !important;
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			min-height: 0;
+		}
+
+		&--docked {
+			flex: none;
+
+			.ant-collapse-item {
+				flex: none;
+				display: block;
+			}
+
+			.ant-collapse-content-box {
+				flex: none;
+				display: block;
+			}
+		}
+	}
+
+	&__docked-span-details {
+		flex: 1;
+		overflow: auto;
+		min-height: 0;
+	}
+}

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

@@ -1,42 +0,0 @@
-.root {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-	padding: 0 15px;
-}
-
-.viewport {
-	flex: 1;
-	overflow: hidden;
-	position: relative;
-}
-
-.main {
-	display: block;
-	width: 100%;
-	cursor: grab;
-}
-
-.overlay {
-	position: absolute;
-	top: 0;
-	left: 0;
-	width: 100%;
-	pointer-events: none;
-}
-
-// Flamegraph tooltip — rendered as a portal, follows the cursor.
-// Position is set inline on the element (left/top); the layout/decoration
-// lives here. Shares visual treatment with the waterfall hover popover
-// but is positioned `fixed` instead of anchored.
-.tooltip {
-	position: fixed;
-	z-index: 1000;
-	pointer-events: none;
-	background-color: var(--l1-background);
-	padding: 8px 12px;
-	border-radius: 4px;
-	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-	border: 1px solid var(--l2-border);
-	color: var(--l1-foreground);
-}

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/FlamegraphCanvas.styles.scss

@@ -0,0 +1,26 @@
+.flamegraph-canvas {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	padding: 0 15px;
+}
+
+.flamegraph-canvas__viewport {
+	flex: 1;
+	overflow: hidden;
+	position: relative;
+}
+
+.flamegraph-canvas__main {
+	display: block;
+	width: 100%;
+	cursor: grab;
+}
+
+.flamegraph-canvas__overlay {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	pointer-events: none;
+}

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/FlamegraphCanvas.tsx

@@ -16,7 +16,7 @@ import { useFlamegraphZoom } from './hooks/useFlamegraphZoom';
 import { useScrollToSpan } from './hooks/useScrollToSpan';
 import { EventRect, FlamegraphCanvasProps, SpanRect } from './types';
 
-import styles from './FlamegraphCanvas.module.scss';
+import './FlamegraphCanvas.styles.scss';
 
 function FlamegraphCanvas(props: FlamegraphCanvasProps): JSX.Element {
 	const {
@@ -194,7 +194,7 @@ function FlamegraphCanvas(props: FlamegraphCanvasProps): JSX.Element {
 	const tooltipElement = tooltipContent
 		? createPortal(
 				<div
-					className={styles.tooltip}
+					className="span-hover-card-popover flamegraph-tooltip"
 					style={{
 						left: Math.min(tooltipContent.clientX + 15, window.innerWidth - 220),
 						top: Math.min(tooltipContent.clientY + 15, window.innerHeight - 100),
@@ -223,7 +223,7 @@ function FlamegraphCanvas(props: FlamegraphCanvasProps): JSX.Element {
 		: null;
 
 	return (
-		<div className={styles.root}>
+		<div className="flamegraph-canvas">
 			{tooltipElement}
 			<TimelineV3
 				startTimestamp={viewStartTs}
@@ -234,7 +234,7 @@ function FlamegraphCanvas(props: FlamegraphCanvasProps): JSX.Element {
 			/>
 			<div
 				ref={containerRef}
-				className={styles.viewport}
+				className="flamegraph-canvas__viewport"
 				onMouseEnter={(): void => {
 					isOverFlamegraphRef.current = true;
 				}}
@@ -242,7 +242,7 @@ function FlamegraphCanvas(props: FlamegraphCanvasProps): JSX.Element {
 			>
 				<canvas
 					ref={canvasRef}
-					className={styles.main}
+					className="flamegraph-canvas__main"
 					onMouseDown={(e): void => {
 						handleMouseDown(e);
 						handleMouseDownForClick(e);
@@ -251,7 +251,7 @@ function FlamegraphCanvas(props: FlamegraphCanvasProps): JSX.Element {
 					onMouseUp={handleMouseUp}
 					onClick={handleClick}
 				/>
-				<canvas ref={overlayCanvasRef} className={styles.overlay} />
+				<canvas ref={overlayCanvasRef} className="flamegraph-canvas__overlay" />
 			</div>
 		</div>
 	);

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

@@ -1,230 +0,0 @@
-// Container — applied to the `.ant-modal` element via SignozModal's className
-// prop. Ant Modal portals into document.body, but the className still lives on
-// the modal root, so descendant overrides work via `:global` nesting.
-.container {
-	:global(.ant-modal-content),
-	:global(.ant-modal-header) {
-		background: var(--l1-background);
-	}
-
-	:global(.ant-modal-header) {
-		border-bottom: none;
-
-		:global(.ant-modal-title) {
-			color: var(--l1-foreground);
-		}
-	}
-
-	:global(.ant-modal-body) {
-		padding: 14px 16px !important;
-		padding-bottom: 0 !important;
-		border-bottom-left-radius: 0;
-		border-bottom-right-radius: 0;
-	}
-
-	:global(.ant-modal-footer) {
-		margin-top: 0;
-		background: var(--l2-background);
-		border-top: 1px solid var(--l2-border);
-		padding: 16px !important;
-
-		.saveButton {
-			display: flex;
-			align-items: center;
-			justify-content: center;
-			gap: 4px;
-			color: var(--l1-foreground);
-			font-size: 12px;
-			font-weight: 500;
-			line-height: 24px;
-			width: 135px;
-
-			:global(.ant-btn-icon) {
-				display: flex;
-			}
-
-			&:disabled {
-				color: var(--l2-foreground);
-
-				:global(.ant-btn-icon svg) {
-					stroke: var(--l2-foreground);
-				}
-			}
-		}
-
-		.discardButton {
-			background: var(--l3-background);
-		}
-
-		:global(.ant-btn) {
-			border-radius: 2px;
-			padding: 4px 8px;
-			margin: 0 !important;
-			border: none;
-			box-shadow: none;
-		}
-	}
-}
-
-// Inner content wrapper (sibling of modal chrome)
-.root {
-	// Funnel-detail view overrides — only when the inner wrapper has
-	// `.isDetails` applied alongside `.root`.
-	&.isDetails {
-		:global(.traces-funnel-details) {
-			height: unset;
-
-			:global(.traces-funnel-details__steps-config) {
-				width: unset;
-				border: none;
-			}
-
-			:global(.funnel-step-wrapper) {
-				gap: 15px;
-			}
-
-			:global(.steps-content) {
-				max-height: 500px;
-			}
-		}
-	}
-
-	:global(.funnel-item) {
-		padding: 8px 8px 12px 16px;
-
-		&,
-		&:first-child {
-			border-radius: 6px;
-		}
-
-		:global(.funnel-item__header) {
-			line-height: 20px;
-		}
-
-		:global(.funnel-item__details) {
-			line-height: 18px;
-		}
-	}
-}
-
-.loadingSpinner {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	height: 400px;
-}
-
-.search {
-	display: flex;
-	gap: 12px;
-	margin-bottom: 14px;
-	align-items: center;
-}
-
-.searchInput {
-	flex: 1;
-	padding: 6px 8px;
-	background: var(--l3-background);
-
-	:global(.ant-input-prefix) {
-		height: 18px;
-		margin-inline-end: 6px;
-
-		svg {
-			opacity: 0.4;
-		}
-	}
-
-	&,
-	input {
-		font-size: 14px;
-		line-height: 18px;
-		letter-spacing: -0.07px;
-		font-weight: 400;
-		background: var(--l3-background);
-	}
-
-	input::placeholder {
-		color: var(--l2-foreground);
-		opacity: 0.6;
-	}
-}
-
-.createButton {
-	width: 153px;
-	padding: 4px 8px;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	gap: 4px;
-	flex-shrink: 0;
-	border-radius: 2px;
-	background: var(--l3-background);
-	border: none;
-	box-shadow: none;
-	color: var(--l2-foreground);
-	font-size: 12px;
-	font-weight: 500;
-	line-height: 24px;
-}
-
-.list {
-	max-height: 400px;
-	overflow-y: scroll;
-
-	:global(.funnels-empty__content) {
-		padding: 0;
-	}
-
-	:global(.funnels-list) {
-		gap: 8px;
-
-		:global(.funnel-item) {
-			padding: 8px 16px 12px;
-
-			:global(.funnel-item__details) {
-				margin-top: 8px;
-			}
-		}
-	}
-}
-
-.spinner {
-	height: 400px;
-}
-
-.backButton {
-	display: flex;
-	align-items: center;
-	gap: 6px;
-	color: var(--l2-foreground);
-	font-size: 14px;
-	line-height: 20px;
-	margin-bottom: 14px;
-}
-
-.detailsView {
-	display: flex;
-	flex-direction: column;
-	gap: 24px;
-
-	:global(.funnel-configuration__steps) {
-		padding: 0;
-
-		:global(.funnel-step__content .filters__service-and-span .ant-select) {
-			width: 170px;
-		}
-
-		:global(.funnel-step__footer .error) {
-			width: 25%;
-		}
-
-		:global(.inter-step-config) {
-			width: calc(100% - 104px);
-		}
-	}
-
-	:global(.funnel-item__actions-popover) {
-		display: none;
-	}
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/AddSpanToFunnelModal/AddSpanToFunnelModal.styles.scss

@@ -0,0 +1,236 @@
+// Modal base styles
+.add-span-to-funnel-modal {
+	&__loading-spinner {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		height: 400px;
+	}
+	&-container {
+		.ant-modal {
+			&-content,
+			&-header {
+				background: var(--l1-background);
+			}
+
+			&-header {
+				border-bottom: none;
+
+				.ant-modal-title {
+					color: var(--l1-foreground);
+				}
+			}
+
+			&-body {
+				padding: 14px 16px !important;
+				padding-bottom: 0 !important;
+				border-bottom-left-radius: 0;
+				border-bottom-right-radius: 0;
+			}
+
+			&-footer {
+				margin-top: 0;
+				background: var(--l2-background);
+				border-top: 1px solid var(--l2-border);
+				padding: 16px !important;
+				.add-span-to-funnel-modal {
+					&__save-button {
+						display: flex;
+						align-items: center;
+						justify-content: center;
+						gap: 4px;
+						color: var(--l1-foreground);
+						font-size: 12px;
+						font-weight: 500;
+						line-height: 24px;
+						width: 135px;
+
+						.ant-btn-icon {
+							display: flex;
+						}
+						&:disabled {
+							color: var(--l2-foreground);
+							.ant-btn-icon {
+								svg {
+									stroke: var(--l2-foreground);
+								}
+							}
+						}
+					}
+					&__discard-button {
+						background: var(--l3-background);
+					}
+				}
+				.ant-btn {
+					border-radius: 2px;
+					padding: 4px 8px;
+					margin: 0 !important;
+					border: none;
+					box-shadow: none;
+				}
+			}
+		}
+	}
+}
+
+// Main modal styles
+.add-span-to-funnel-modal {
+	// Common button styles
+	%button-base {
+		display: flex;
+		align-items: center;
+	}
+
+	// Details view styles
+	&--details {
+		.traces-funnel-details {
+			height: unset;
+
+			&__steps-config {
+				width: unset;
+				border: none;
+			}
+
+			.funnel-step-wrapper {
+				gap: 15px;
+			}
+
+			.steps-content {
+				max-height: 500px;
+			}
+		}
+	}
+
+	// Search section
+	&__search {
+		display: flex;
+		gap: 12px;
+		margin-bottom: 14px;
+		align-items: center;
+
+		&-input {
+			flex: 1;
+			padding: 6px 8px;
+			background: var(--l3-background);
+
+			.ant-input-prefix {
+				height: 18px;
+				margin-inline-end: 6px;
+				svg {
+					opacity: 0.4;
+				}
+			}
+
+			&,
+			input {
+				font-size: 14px;
+				line-height: 18px;
+				letter-spacing: -0.07px;
+				font-weight: 400;
+				background: var(--l3-background);
+			}
+
+			input::placeholder {
+				color: var(--l2-foreground);
+				opacity: 0.6;
+			}
+		}
+	}
+
+	// Create button
+	&__create-button {
+		@extend %button-base;
+		width: 153px;
+		padding: 4px 8px;
+		justify-content: center;
+		gap: 4px;
+		flex-shrink: 0;
+		border-radius: 2px;
+		background: var(--l3-background);
+		border: none;
+		box-shadow: none;
+		color: var(--l2-foreground);
+		font-size: 12px;
+		font-weight: 500;
+		line-height: 24px;
+	}
+	.funnel-item {
+		padding: 8px 8px 12px 16px;
+		&,
+		&:first-child {
+			border-radius: 6px;
+		}
+
+		&__header {
+			line-height: 20px;
+		}
+		&__details {
+			line-height: 18px;
+		}
+	}
+
+	// List section
+	&__list {
+		max-height: 400px;
+		overflow-y: scroll;
+		.funnels-empty {
+			&__content {
+				padding: 0;
+			}
+		}
+
+		.funnels-list {
+			gap: 8px;
+
+			.funnel-item {
+				padding: 8px 16px 12px;
+
+				&__details {
+					margin-top: 8px;
+				}
+			}
+		}
+	}
+
+	&__spinner {
+		height: 400px;
+	}
+
+	// Back button
+	&__back-button {
+		@extend %button-base;
+		gap: 6px;
+		color: var(--l2-foreground);
+		font-size: 14px;
+		line-height: 20px;
+		margin-bottom: 14px;
+	}
+
+	// Details section
+	&__details {
+		display: flex;
+		flex-direction: column;
+		gap: 24px;
+
+		.funnel-configuration__steps {
+			padding: 0;
+
+			.funnel-step {
+				&__content .filters__service-and-span .ant-select {
+					width: 170px;
+				}
+
+				&__footer .error {
+					width: 25%;
+				}
+			}
+
+			.inter-step-config {
+				width: calc(100% - 104px);
+			}
+		}
+		.funnel-item__actions-popover {
+			display: none;
+		}
+	}
+}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/AddSpanToFunnelModal/AddSpanToFunnelModal.tsx

@@ -22,7 +22,7 @@ import { filterFunnelsByQuery } from 'pages/TracesFunnels/utils';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 import { FunnelData } from 'types/api/traceFunnels';
 
-import styles from './AddSpanToFunnelModal.module.scss';
+import './AddSpanToFunnelModal.styles.scss';
 
 enum ModalView {
 	LIST = 'list',
@@ -62,7 +62,7 @@ function FunnelDetailsView({
 	}, [triggerDiscard, funnel.steps, handleRestoreSteps]);
 
 	return (
-		<div className={styles.detailsView}>
+		<div className="add-span-to-funnel-modal__details">
 			<FunnelListItem
 				funnel={funnel}
 				shouldRedirectToTracesListOnDeleteSuccess={false}
@@ -161,11 +161,11 @@ function AddSpanToFunnelModal({
 	};
 
 	const renderListView = (): JSX.Element => (
-		<div className={styles.root}>
+		<div className="add-span-to-funnel-modal">
 			{!!filteredData?.length && (
-				<div className={styles.search}>
+				<div className="add-span-to-funnel-modal__search">
 					<Input
-						className={styles.searchInput}
+						className="add-span-to-funnel-modal__search-input"
 						placeholder="Search by name, description, or tags..."
 						prefix={<Search size={12} />}
 						value={searchQuery}
@@ -173,7 +173,7 @@ function AddSpanToFunnelModal({
 					/>
 				</div>
 			)}
-			<div className={styles.list}>
+			<div className="add-span-to-funnel-modal__list">
 				<OverlayScrollbar>
 					<TracesFunnelsContentRenderer
 						isError={isError}
@@ -201,11 +201,11 @@ function AddSpanToFunnelModal({
 	);
 
 	const renderDetailsView = ({ span }: { span: SpanV3 }): JSX.Element => (
-		<div className={cx(styles.root, styles.isDetails)}>
+		<div className="add-span-to-funnel-modal add-span-to-funnel-modal--details">
 			<Button
 				variant="ghost"
 				color="secondary"
-				className={styles.backButton}
+				className="add-span-to-funnel-modal__back-button"
 				onClick={handleBack}
 				prefix={<ArrowLeft size={14} />}
 			>
@@ -214,7 +214,7 @@ function AddSpanToFunnelModal({
 			<div className="traces-funnel-details">
 				<div className="traces-funnel-details__steps-config">
 					<Spin
-						className={styles.loadingSpinner}
+						className="add-span-to-funnel-modal__loading-spinner"
 						spinning={isFunnelDetailsLoading || isFunnelDetailsFetching}
 						indicator={<LoaderCircle size={14} className="animate-spin" />}
 					>
@@ -245,7 +245,10 @@ function AddSpanToFunnelModal({
 			onCancel={onClose}
 			width={570}
 			title="Add span to funnel"
-			className={styles.container}
+			className={cx('add-span-to-funnel-modal-container', {
+				'add-span-to-funnel-modal-container--details':
+					activeView === ModalView.DETAILS,
+			})}
 			footer={
 				activeView === ModalView.DETAILS
 					? [
@@ -254,7 +257,7 @@ function AddSpanToFunnelModal({
 								color="secondary"
 								key="discard"
 								onClick={handleDiscard}
-								className={styles.discardButton}
+								className="add-span-to-funnel-modal__discard-button"
 								disabled={!isUnsavedChanges}
 							>
 								Discard
@@ -263,7 +266,7 @@ function AddSpanToFunnelModal({
 								key="save"
 								variant="solid"
 								color="primary"
-								className={styles.saveButton}
+								className="add-span-to-funnel-modal__save-button"
 								onClick={handleSaveFunnel}
 								disabled={!isUnsavedChanges}
 								prefix={<Check size={14} />}
@@ -276,7 +279,7 @@ function AddSpanToFunnelModal({
 								key="create"
 								variant="outlined"
 								color="secondary"
-								className={styles.createButton}
+								className="add-span-to-funnel-modal__create-button"
 								onClick={handleCreateNewClick}
 								prefix={<Plus size={14} />}
 							>

frontend/src/pages/TraceDetailsV3/TraceWaterfall/SpanLineActionButtons/SpanLineActionButtons.styles.scss

@@ -1,4 +1,4 @@
-.root {
+.span-line-action-buttons {
 	display: flex;
 	position: absolute;
 	transform: translate(-50%, -50%);
@@ -8,20 +8,20 @@
 	border-radius: 2px;
 	border: 1px solid var(--l1-border);
 	background: var(--l2-background);
-}
 
-.copyBtn {
-	border: none;
-	box-shadow: none;
-	padding: 9px;
-	justify-content: center;
-	align-items: center;
-	display: flex;
-	border-color: var(--l1-border) !important;
+	.copy-span-btn {
+		border: none;
+		box-shadow: none;
+		padding: 9px;
+		justify-content: center;
+		align-items: center;
+		display: flex;
+		border-color: var(--l1-border) !important;
+	}
 }
 
 // Tooltip rendered in a portal; bump above FloatingPanel (z-index 999) so it
 // stays visible when the SpanDetailsPanel is docked as a floating panel.
-.tooltip {
+.span-line-action-tooltip {
 	--tooltip-z-index: 1000;
 }

frontend/src/pages/TraceDetailsV3/TraceWaterfall/SpanLineActionButtons/__tests__/SpanLineActionButtons.test.tsx

@@ -70,6 +70,24 @@ describe('SpanLineActionButtons', () => {
 		expect(mockOnSpanCopy).toHaveBeenCalledTimes(1);
 	});
 
+	it('applies correct styling classes', () => {
+		(useCopySpanLink as jest.Mock).mockReturnValue({
+			onSpanCopy: jest.fn(),
+		});
+
+		render(<SpanLineActionButtons span={mockSpan} />);
+
+		// Check if the main container has the correct class
+		const container = screen
+			.getByRole('button')
+			.closest('.span-line-action-buttons');
+		expect(container).toHaveClass('span-line-action-buttons');
+
+		// Check if the button has the correct class
+		const copyButton = screen.getByRole('button');
+		expect(copyButton).toHaveClass('copy-span-btn');
+	});
+
 	it('copies span link to clipboard when copy button is clicked', () => {
 		const mockSetCopy = jest.fn();
 		const mockUrlQuery = {

frontend/src/pages/TraceDetailsV3/TraceWaterfall/SpanLineActionButtons/index.tsx

@@ -9,7 +9,7 @@ import { useCopySpanLink } from 'hooks/trace/useCopySpanLink';
 import { Link } from '@signozhq/icons';
 import { Span } from 'types/api/trace/getTraceV2';
 
-import styles from './SpanLineActionButtons.module.scss';
+import './SpanLineActionButtons.styles.scss';
 
 export interface SpanLineActionButtonsProps {
 	span: Span;
@@ -20,7 +20,7 @@ export default function SpanLineActionButtons({
 	const { onSpanCopy } = useCopySpanLink(span);
 
 	return (
-		<div className={styles.root}>
+		<div className="span-line-action-buttons">
 			<TooltipProvider>
 				<Tooltip>
 					<TooltipTrigger asChild>
@@ -29,12 +29,14 @@ export default function SpanLineActionButtons({
 							size="icon"
 							color="secondary"
 							onClick={onSpanCopy}
-							className={styles.copyBtn}
+							className="copy-span-btn"
 						>
 							<Link size={14} />
 						</Button>
 					</TooltipTrigger>
-					<TooltipContent className={styles.tooltip}>Copy Span Link</TooltipContent>
+					<TooltipContent className="span-line-action-tooltip">
+						Copy Span Link
+					</TooltipContent>
 				</Tooltip>
 			</TooltipProvider>
 		</div>

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

@@ -1,11 +0,0 @@
-.root {
-	height: 100%;
-	display: flex;
-	flex-direction: column;
-}
-
-.loadingSkeleton {
-	justify-content: center;
-	align-items: center;
-	padding: 20px;
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfall.styles.scss

@@ -0,0 +1,11 @@
+.trace-waterfall {
+	height: 100%;
+	display: flex;
+	flex-direction: column;
+
+	.loading-skeleton {
+		justify-content: center;
+		align-items: center;
+		padding: 20px;
+	}
+}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfall.tsx

@@ -13,7 +13,7 @@ import { getVisibleSpans } from './utils';
 
 import { IInterestedSpan } from './types';
 
-import styles from './TraceWaterfall.module.scss';
+import './TraceWaterfall.styles.scss';
 
 interface ITraceWaterfallProps {
 	traceId: string;
@@ -100,7 +100,7 @@ function TraceWaterfall(props: ITraceWaterfallProps): JSX.Element {
 		switch (traceWaterfallState) {
 			case TraceWaterfallStates.LOADING:
 				return (
-					<div className={styles.loadingSkeleton}>
+					<div className="loading-skeleton">
 						<Skeleton active paragraph={{ rows: 6 }} />
 					</div>
 				);
@@ -158,7 +158,7 @@ function TraceWaterfall(props: ITraceWaterfallProps): JSX.Element {
 		uncollapsedNodes,
 	]);
 
-	return <div className={styles.root}>{getContent}</div>;
+	return <div className="trace-waterfall">{getContent}</div>;
 }
 
 export default TraceWaterfall;

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Error/Error.module.scss

@@ -1,24 +0,0 @@
-.root {
-	display: flex;
-	padding: 12px;
-	margin: 20px;
-	gap: 12px;
-	align-items: flex-start;
-	border-radius: 4px;
-	background: var(--destructive);
-}
-
-.text,
-.value {
-	color: var(--destructive-foreground);
-	font-family: Inter;
-	font-size: 14px;
-	font-style: normal;
-	font-weight: 400;
-	line-height: 20px;
-	letter-spacing: -0.07px;
-}
-
-.text {
-	flex-shrink: 0;
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Error/Error.styles.scss

@@ -0,0 +1,30 @@
+.error-waterfall {
+	display: flex;
+	padding: 12px;
+	margin: 20px;
+	gap: 12px;
+	align-items: flex-start;
+	border-radius: 4px;
+	background: var(--destructive);
+
+	.text {
+		color: var(--destructive-foreground);
+		font-family: Inter;
+		font-size: 14px;
+		font-style: normal;
+		font-weight: 400;
+		line-height: 20px; /* 142.857% */
+		letter-spacing: -0.07px;
+		flex-shrink: 0;
+	}
+
+	.value {
+		color: var(--destructive-foreground);
+		font-family: Inter;
+		font-size: 14px;
+		font-style: normal;
+		font-weight: 400;
+		line-height: 20px; /* 142.857% */
+		letter-spacing: -0.07px;
+	}
+}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Error/Error.tsx

@@ -2,7 +2,7 @@ import { Tooltip } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
 import { AxiosError } from 'axios';
 
-import styles from './Error.module.scss';
+import './Error.styles.scss';
 
 interface IErrorProps {
 	error: AxiosError;
@@ -12,16 +12,10 @@ function Error(props: IErrorProps): JSX.Element {
 	const { error } = props;
 
 	return (
-		<div className={styles.root}>
-			<Typography.Text className={styles.text}>
-				Something went wrong!
-			</Typography.Text>
+		<div className="error-waterfall">
+			<Typography.Text className="text">Something went wrong!</Typography.Text>
 			<Tooltip title={error?.message}>
-				<Typography.Text
-					className={styles.value}
-					title={error?.message}
-					truncate={1}
-				>
+				<Typography.Text className="value" title={error?.message} truncate={1}>
 					{error?.message}
 				</Typography.Text>
 			</Tooltip>

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Filters/Filters.module.scss

@@ -1,136 +0,0 @@
-.root {
-	display: flex;
-	align-items: center;
-	gap: 12px;
-
-	// QuerySearch child sets `query-builder-search-v2` globally; size it to the
-	// search container by reaching into the descendant.
-	:global(.query-builder-search-v2) {
-		width: 100%;
-	}
-
-	// ToggleGroup children use generated class names; nest the global selectors
-	// under the local row so they only apply inside this filter row.
-	:global([class*='toggle-group']) {
-		flex-shrink: 0;
-
-		:global([class*='toggle-group-item']) {
-			flex: 0 0 auto;
-		}
-	}
-}
-
-.isExpanded {
-	flex: 1;
-}
-
-.searchContainer {
-	flex: 1;
-	min-width: 0;
-}
-
-.pill {
-	display: flex;
-	align-items: center;
-	gap: 6px;
-	padding: 4px 10px;
-	border: 1px solid var(--l1-border);
-	border-radius: 4px;
-	cursor: pointer;
-	max-width: 220px;
-	min-width: 120px;
-	height: 32px;
-	background: var(--l1-background);
-
-	&:hover {
-		border-color: var(--l3-border);
-	}
-}
-
-.pillText {
-	font-size: 12px;
-	color: var(--l2-foreground);
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	flex: 1;
-}
-
-.pillIndicator {
-	width: 6px;
-	height: 6px;
-	border-radius: 50%;
-	background: var(--primary-background);
-	flex-shrink: 0;
-}
-
-.pillPopover {
-	max-width: 400px;
-}
-
-.pillPopoverHeader {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	margin-bottom: 8px;
-}
-
-.pillPopoverExpression {
-	font-family: 'Geist Mono', 'Fira Code', monospace;
-	font-size: 12px;
-	color: var(--l1-foreground);
-	word-break: break-all;
-	padding: 6px 8px;
-	background: var(--l2-background);
-	border-radius: 4px;
-}
-
-.collapseBtn {
-	flex-shrink: 0;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	box-shadow: none;
-}
-
-.highlightErrorsToggle {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	flex-shrink: 0;
-	white-space: nowrap;
-}
-
-.preNextToggle {
-	display: flex;
-	flex-shrink: 0;
-	gap: 12px;
-}
-
-.preNextCount {
-	display: flex;
-	align-items: center;
-	margin: auto;
-	color: var(--l2-foreground);
-	font-family: 'Geist Mono';
-	font-size: 12px;
-	font-weight: 400;
-	line-height: 18px;
-}
-
-.filterStatus {
-	display: flex;
-	align-items: center;
-	gap: 6px;
-	flex-shrink: 0;
-	color: var(--l2-foreground);
-	font-family: 'Geist Mono';
-	font-size: 12px;
-	font-weight: 400;
-	line-height: 18px;
-}
-
-.hasError {
-	color: var(--destructive);
-	cursor: help;
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Filters/Filters.styles.scss

@@ -0,0 +1,145 @@
+.trace-v3-filter-row {
+	display: flex;
+	align-items: center;
+	gap: 12px;
+
+	&.expanded {
+		flex: 1;
+	}
+
+	.filter-search-container {
+		flex: 1;
+		min-width: 0;
+	}
+
+	.query-builder-search-v2 {
+		width: 100%;
+	}
+
+	// --- Collapsed pill ---
+	.filter-pill {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+		padding: 4px 10px;
+		border: 1px solid var(--l1-border);
+		border-radius: 4px;
+		cursor: pointer;
+		max-width: 220px;
+		min-width: 120px;
+		height: 32px;
+		background: var(--l1-background);
+
+		&:hover {
+			border-color: var(--l3-border);
+		}
+
+		&__text {
+			font-size: 12px;
+			color: var(--l2-foreground);
+			overflow: hidden;
+			text-overflow: ellipsis;
+			white-space: nowrap;
+			flex: 1;
+		}
+
+		&__indicator {
+			width: 6px;
+			height: 6px;
+			border-radius: 50%;
+			background: var(--primary-background);
+			flex-shrink: 0;
+		}
+	}
+
+	// --- Collapsed pill popover ---
+	.filter-pill-popover {
+		max-width: 400px;
+
+		&__header {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			margin-bottom: 8px;
+		}
+
+		&__expression {
+			font-family: 'Geist Mono', 'Fira Code', monospace;
+			font-size: 12px;
+			color: var(--l1-foreground);
+			word-break: break-all;
+			padding: 6px 8px;
+			background: var(--l2-background);
+			border-radius: 4px;
+		}
+	}
+
+	// --- ToggleGroup override: size to content, don't stretch items ---
+	[class*='toggle-group'] {
+		flex-shrink: 0;
+
+		[class*='toggle-group-item'] {
+			flex: 0 0 auto;
+		}
+	}
+
+	// --- Collapse button ---
+	.filter-collapse-btn {
+		flex-shrink: 0;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		box-shadow: none;
+	}
+
+	// --- Highlight errors toggle ---
+	.highlight-errors-toggle {
+		display: flex;
+		align-items: center;
+		gap: 8px;
+		flex-shrink: 0;
+		white-space: nowrap;
+	}
+
+	// --- Prev/next navigation ---
+	.pre-next-toggle {
+		display: flex;
+		flex-shrink: 0;
+		gap: 12px;
+
+		&__count {
+			display: flex;
+			align-items: center;
+			margin: auto;
+			color: var(--l2-foreground);
+			font-family: 'Geist Mono';
+			font-size: 12px;
+			font-weight: 400;
+			line-height: 18px;
+		}
+
+		.ant-btn {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			box-shadow: none;
+		}
+	}
+
+	.filter-status {
+		display: flex;
+		align-items: center;
+		gap: 6px;
+		flex-shrink: 0;
+		color: var(--l2-foreground);
+		font-family: 'Geist Mono';
+		font-size: 12px;
+		font-weight: 400;
+		line-height: 18px;
+
+		&--error {
+			color: var(--destructive);
+			cursor: help;
+		}
+	}
+}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Filters/Filters.tsx

@@ -22,7 +22,6 @@ import {
 } from '@signozhq/ui/tooltip';
 import { Typography } from '@signozhq/ui/typography';
 import { AxiosError } from 'axios';
-import cx from 'classnames';
 import QuerySearch from 'components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch';
 import { convertExpressionToFilters } from 'components/QueryBuilderV2/utils';
 import { DEFAULT_ENTITY_VERSION } from 'constants/app';
@@ -43,7 +42,7 @@ import {
 	useSpanCategoryFilter,
 } from './hooks/useSpanCategoryFilter';
 
-import styles from './Filters.module.scss';
+import './Filters.styles.scss';
 
 function prepareQuery(filters: TagFilter, traceID: string): Query {
 	return {
@@ -256,7 +255,7 @@ function Filters({
 	);
 
 	const highlightErrorsToggle = (
-		<div className={styles.highlightErrorsToggle}>
+		<div className="highlight-errors-toggle">
 			<Typography.Text>Highlight errors</Typography.Text>
 			<Switch
 				color="cherry"
@@ -272,7 +271,7 @@ function Filters({
 			{error && (
 				<Tooltip>
 					<TooltipTrigger asChild>
-						<span className={cx(styles.filterStatus, styles.hasError)}>
+						<span className="filter-status filter-status--error">
 							<Info />
 							API error
 						</span>
@@ -283,7 +282,7 @@ function Filters({
 				</Tooltip>
 			)}
 			{!error && noData && (
-				<Typography.Text className={styles.filterStatus}>
+				<Typography.Text className="filter-status">
 					No results found
 				</Typography.Text>
 			)}
@@ -294,22 +293,22 @@ function Filters({
 	if (!isExpanded) {
 		const pill = (
 			/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */
-			<div className={styles.pill} onClick={onExpand}>
+			<div className="filter-pill" onClick={onExpand}>
 				<Search size={12} />
-				<span className={styles.pillText}>{expression || 'Search...'}</span>
-				{expression && <span className={styles.pillIndicator} />}
+				<span className="filter-pill__text">{expression || 'Search...'}</span>
+				{expression && <span className="filter-pill__indicator" />}
 			</div>
 		);
 
 		return (
 			<TooltipProvider>
-				<div className={styles.root}>
+				<div className="trace-v3-filter-row collapsed">
 					{expression ? (
 						<Tooltip>
 							<TooltipTrigger asChild>{pill}</TooltipTrigger>
 							<TooltipContent side="bottom" align="start">
-								<div className={styles.pillPopover}>
-									<div className={styles.pillPopoverHeader}>
+								<div className="filter-pill-popover">
+									<div className="filter-pill-popover__header">
 										<Typography.Text>Search query</Typography.Text>
 										<Button
 											variant="ghost"
@@ -326,7 +325,7 @@ function Filters({
 											<Copy size={12} />
 										</Button>
 									</div>
-									<div className={styles.pillPopoverExpression}>{expression}</div>
+									<div className="filter-pill-popover__expression">{expression}</div>
 								</div>
 							</TooltipContent>
 						</Tooltip>
@@ -343,7 +342,7 @@ function Filters({
 	// --- EXPANDED VIEW ---
 	return (
 		<TooltipProvider>
-			<div className={cx(styles.root, styles.isExpanded)}>
+			<div className="trace-v3-filter-row expanded">
 				<ToggleGroup
 					type="single"
 					value={selectedCategory}
@@ -362,7 +361,7 @@ function Filters({
 				</ToggleGroup>
 				{/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}
 				<div
-					className={styles.searchContainer}
+					className="filter-search-container"
 					ref={containerRef}
 					onBlur={(e): void => {
 						if (!containerRef.current?.contains(e.relatedTarget as Node)) {
@@ -383,8 +382,8 @@ function Filters({
 					/>
 				</div>
 				{filteredSpanIds.length > 0 && (
-					<div className={styles.preNextToggle}>
-						<Typography.Text className={styles.preNextCount}>
+					<div className="pre-next-toggle">
+						<Typography.Text className="pre-next-toggle__count">
 							{currentSearchedIndex + 1} / {filteredSpanIds.length}
 						</Typography.Text>
 						<Button
@@ -417,7 +416,7 @@ function Filters({
 					variant="ghost"
 					size="icon"
 					color="secondary"
-					className={styles.collapseBtn}
+					className="filter-collapse-btn"
 					onClick={onCollapse}
 				>
 					<X size={14} />

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Success.module.scss

@@ -1,634 +0,0 @@
-// Inside a .module.scss, postcss-modules auto-scopes `@keyframes` identifiers
-// and rewrites `animation`/`animation-name` references to match.
-@keyframes waterfallLoading {
-	0% {
-		opacity: 0.3;
-		transform: scaleX(0.3);
-		transform-origin: left;
-	}
-	50% {
-		opacity: 1;
-		transform: scaleX(1);
-		transform-origin: left;
-	}
-	100% {
-		opacity: 0.3;
-		transform: scaleX(0.3);
-		transform-origin: right;
-	}
-}
-
-.loadingBar {
-	height: 2px;
-	background: var(--primary);
-	animation: waterfallLoading 1.5s ease-in-out infinite;
-	flex-shrink: 0;
-}
-
-// Event-dot tooltip. Visually matches SpanHoverCard's popover; styles are
-// inlined rather than `compose`d from another module because postcss-modules
-// loads cross-module composes through the plain CSS parser, which chokes on
-// SCSS `//` comments in the target file.
-.popover {
-	--tooltip-z-index: 1000;
-	background-color: var(--l1-background);
-	padding: 8px 12px;
-	border-radius: 4px;
-	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
-	border: 1px solid var(--l2-border);
-	color: var(--l1-foreground);
-}
-
-.root {
-	overflow-y: hidden;
-	overflow-x: hidden;
-	max-width: 100%;
-	flex: 1;
-	min-height: 0;
-	display: flex;
-	flex-direction: column;
-}
-
-.missingSpans {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	height: 44px;
-	margin: 16px;
-	padding: 12px;
-	border-radius: 4px;
-	background: rgba(69, 104, 220, 0.1);
-}
-
-.leftInfo {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	color: var(--bg-robin-400);
-	font-family: Inter;
-	font-size: 14px;
-	font-style: normal;
-	font-weight: 400;
-	line-height: 20px;
-	letter-spacing: -0.07px;
-}
-
-.text {
-	color: var(--bg-robin-400);
-	font-family: Inter;
-	font-size: 14px;
-	font-style: normal;
-	font-weight: 400;
-	line-height: 20px;
-	letter-spacing: -0.07px;
-}
-
-.rightInfo {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	gap: 8px;
-	color: var(--bg-robin-400);
-	font-family: Inter;
-	font-size: 14px;
-	font-style: normal;
-	font-weight: 400;
-	line-height: 20px;
-	letter-spacing: -0.07px;
-
-	&:hover {
-		background-color: unset;
-		color: var(--bg-robin-200);
-	}
-}
-
-.splitPanel {
-	flex: 1;
-	min-height: 0;
-	overflow-y: auto;
-	overflow-x: hidden;
-	padding: 0px 20px 0px 20px;
-
-	&::-webkit-scrollbar {
-		width: 0.1rem;
-	}
-}
-
-.splitHeader {
-	position: sticky;
-	top: 0;
-	z-index: 2;
-	display: flex;
-	height: 25px;
-	background-color: var(--l1-background);
-}
-
-.sidebarHeader {
-	flex-shrink: 0;
-}
-
-.resizeHandleHeader {
-	width: 4px;
-	flex-shrink: 0;
-}
-
-.statusHeader {
-	width: 50px;
-	flex-shrink: 0;
-}
-
-.timelineHeader {
-	flex: 1;
-	overflow: hidden;
-	padding: 0 15px;
-}
-
-.splitBody {
-	display: flex;
-	position: relative;
-}
-
-// Invisible IntersectionObserver targets pinned at the top and bottom of the
-// virtualized content. See `useBoundaryPagination`.
-.loadMoreSentinel {
-	position: absolute;
-	left: 0;
-	right: 0;
-	height: 1px;
-	pointer-events: none;
-}
-
-.loadMoreSentinelTop {
-	top: 0;
-}
-
-.loadMoreSentinelBottom {
-	bottom: 0;
-}
-
-.sidebar {
-	overflow-x: auto;
-	overflow-y: hidden;
-	flex-shrink: 0;
-	border-right: 1px solid var(--l1-border);
-
-	// ResizableBox child renders with a global `.resizable-box__content` class
-	// — give it independent horizontal scrolling.
-	:global(.resizable-box__content) {
-		overflow-x: auto;
-		overflow-y: hidden;
-
-		&::-webkit-scrollbar {
-			height: 0;
-		}
-
-		scrollbar-width: none;
-	}
-
-	&::-webkit-scrollbar {
-		height: 0.3rem;
-	}
-
-	&::-webkit-scrollbar-thumb {
-		background: var(--l3-background);
-		border-radius: 4px;
-	}
-}
-
-.treeTable {
-	position: relative;
-	border-collapse: collapse;
-}
-
-.treeRow {
-	display: flex;
-	align-items: center;
-}
-
-.treeCell {
-	display: flex;
-	width: 100%;
-	height: 28px;
-	align-items: center;
-	overflow: visible;
-	padding: 0;
-}
-
-.treeRow:hover,
-.treeRow.hoveredSpan {
-	border-radius: 4px;
-	background: color-mix(
-		in srgb,
-		var(--l3-background) 20%,
-		transparent
-	) !important;
-
-	.spanOverview {
-		background: unset !important;
-	}
-}
-
-.sidebarResizeHandle {
-	width: 4px;
-	flex-shrink: 0;
-	cursor: col-resize;
-	user-select: none;
-	touch-action: none;
-	background: transparent;
-	transition: background 0.15s ease;
-	z-index: 1;
-
-	&:hover,
-	&:active {
-		background: rgba(35, 196, 248, 0.2);
-	}
-}
-
-.statusCol {
-	width: 50px;
-	flex-shrink: 0;
-	position: relative;
-}
-
-.statusCell {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	cursor: pointer;
-
-	--badge-border-radius: 2px;
-	--badge-padding: 3px 6px;
-	--badge-line-height: 12px;
-	--badge-border-width: 0px;
-
-	&.hoveredSpan {
-		border-radius: 4px;
-		background: color-mix(
-			in srgb,
-			var(--l3-background) 20%,
-			transparent
-		) !important;
-	}
-
-	&.isInterested,
-	&.isSelectedNonMatching {
-		border-radius: 4px;
-		background: color-mix(
-			in srgb,
-			var(--l3-background) 40%,
-			transparent
-		) !important;
-	}
-
-	&.isDimmed {
-		opacity: 0.15;
-	}
-}
-
-.timeline {
-	flex: 1;
-	position: relative;
-	overflow: hidden;
-}
-
-.crosshair {
-	position: absolute;
-	top: 0;
-	bottom: 0;
-	width: 1px;
-	background: var(--l3-background);
-	pointer-events: none;
-	z-index: 1;
-}
-
-.timelineRow {
-	display: flex;
-	align-items: center;
-	// Match timelineHeader's 15px padding so bars align with ticks
-	padding: 0 15px;
-
-	&:hover,
-	&.hoveredSpan {
-		border-radius: 4px;
-		background: color-mix(
-			in srgb,
-			var(--l3-background) 20%,
-			transparent
-		) !important;
-	}
-
-	&:has(.isInterested),
-	&:has(.isSelectedNonMatching) {
-		border-radius: 4px;
-		background: color-mix(
-			in srgb,
-			var(--l3-background) 40%,
-			transparent
-		) !important;
-	}
-}
-
-.spanOverview {
-	display: flex;
-	align-items: center;
-	flex-shrink: 0;
-	height: 100%;
-	width: 100%;
-	cursor: pointer;
-	position: relative;
-	white-space: nowrap;
-
-	&:hover .rowActions {
-		opacity: 1;
-		pointer-events: auto;
-	}
-
-	&.isInterested,
-	&.isSelectedNonMatching {
-		border-radius: 4px;
-		background: color-mix(
-			in srgb,
-			var(--l3-background) 40%,
-			transparent
-		) !important;
-	}
-}
-
-.treeIndent {
-	display: inline-block;
-	flex-shrink: 0;
-}
-
-.treeLine {
-	position: absolute;
-	background-color: var(--l2-border);
-	pointer-events: none;
-}
-
-.treeConnector {
-	position: absolute;
-	width: 14px;
-	height: 50%;
-	border-left: 1px solid var(--l2-border);
-	border-bottom: 1px solid var(--l2-border);
-	border-bottom-left-radius: 6px;
-	pointer-events: none;
-}
-
-// Reserved horizontal space for the chevron — present on every row, filled
-// only when the span has children. Keeps sibling icons aligned.
-.treeArrowSlot {
-	width: 18px;
-	flex-shrink: 0;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-}
-
-.treeArrow {
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	width: 18px;
-	height: 18px;
-	flex-shrink: 0;
-	cursor: pointer;
-	color: var(--l1-foreground);
-	border-radius: 4px;
-
-	&:hover {
-		background: var(--l3-background);
-	}
-}
-
-// Reserved horizontal space for the subtree-count badge — same reason.
-// Right-aligns the badge inside so single-digit counts don't push the icon
-// left of where multi-digit counts would put it.
-.subtreeCountSlot {
-	min-width: 34px;
-	flex-shrink: 0;
-	display: inline-flex;
-	align-items: center;
-	justify-content: flex-end;
-	padding-right: 4px;
-}
-
-.subtreeCount {
-	display: inline-flex;
-	align-items: center;
-	flex-shrink: 0;
-
-	:global(.badge) {
-		font-size: 10px;
-		line-height: 14px;
-		padding: 0 4px;
-		height: 14px;
-	}
-}
-
-.treeIcon {
-	display: inline-block;
-	width: 7px;
-	height: 7px;
-	border-radius: 50%;
-	flex-shrink: 0;
-	margin: 0 6px;
-
-	&.hasError {
-		box-shadow: 0 0 0 2px rgba(255, 70, 70, 0.3);
-	}
-}
-
-.treeLabel {
-	color: var(--l1-foreground);
-	font-family: 'Inter';
-	font-size: 13px;
-	font-weight: 400;
-	line-height: 28px;
-	letter-spacing: 0.01em;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	flex: 1;
-	min-width: 0;
-}
-
-.treeServiceName {
-	margin-left: 18px;
-	color: var(--l3-foreground);
-	font-weight: 400;
-}
-
-.rowActions {
-	position: sticky;
-	right: 0;
-	display: flex;
-	align-items: center;
-	gap: 2px;
-	margin-left: auto;
-	padding-right: 4px;
-	padding-left: 8px;
-	flex-shrink: 0;
-	height: 100%;
-	background: linear-gradient(to left, var(--l1-background) 60%, transparent);
-	z-index: 2;
-	opacity: 0;
-	pointer-events: none;
-}
-
-.actionBtn {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 22px;
-	height: 22px;
-	border-radius: 2px;
-	cursor: pointer;
-	color: var(--l1-foreground);
-	background: transparent;
-	border: none;
-	padding: 0;
-
-	&:hover {
-		background: var(--l3-background);
-	}
-}
-
-// Also reveal the actions when the parent tree row is hovered.
-.treeRow:hover .rowActions,
-.treeRow.hoveredSpan .rowActions {
-	opacity: 1;
-	pointer-events: auto;
-}
-
-.spanDuration {
-	display: flex;
-	align-items: center;
-	height: 28px;
-	position: relative;
-	width: 100%;
-	padding: 0 15px;
-	cursor: pointer;
-}
-
-.spanBar {
-	position: absolute;
-	height: 18px;
-	top: 5px;
-	border-radius: 2px;
-	display: flex;
-	align-items: center;
-	padding: 0 8px;
-	overflow: hidden;
-	cursor: pointer;
-	white-space: nowrap;
-	color: rgba(0, 0, 0, 0.9);
-	background-color: var(--span-color);
-	border: 1px solid transparent;
-}
-
-.spanInfo {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	width: 100%;
-	overflow: hidden;
-	z-index: 1;
-}
-
-.spanName {
-	font-weight: 500;
-	font-size: 11px;
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	flex-grow: 1;
-	min-width: 0;
-}
-
-.spanDurationText {
-	color: inherit;
-	opacity: 0.8;
-	font-size: 10px;
-	margin-left: 8px;
-	flex-shrink: 0;
-}
-
-.eventDot {
-	position: absolute;
-	top: 50%;
-	transform: translate(-50%, -50%) rotate(45deg);
-	width: 5px;
-	height: 5px;
-	background-color: var(--event-dot-bg, var(--bg-robin-500));
-	border: 1px solid var(--event-dot-border, var(--bg-robin-600));
-	cursor: pointer;
-	z-index: 1;
-
-	&.hasError {
-		background-color: var(--destructive);
-		border-color: var(--destructive);
-	}
-
-	&:hover {
-		transform: translate(-50%, -50%) rotate(45deg) scale(1.5);
-	}
-}
-
-// Hover state: solid l2-background fill + border (matches flamegraph)
-.timelineRow:hover .spanBar,
-.timelineRow.hoveredSpan .spanBar {
-	color: var(--span-color);
-	background-color: var(--l2-background);
-	background-image: none;
-	border: 1px solid var(--span-color);
-}
-
-// Selected state: solid l3-background fill + dashed border (matches flamegraph)
-.isInterested .spanBar,
-.isSelectedNonMatching .spanBar {
-	color: var(--span-color);
-	background-color: var(--l2-background);
-	background-image: none;
-	border: 1px dashed var(--span-color);
-}
-
-.isDimmed {
-	opacity: 0.15;
-}
-
-.isHighlighted {
-	opacity: 1;
-}
-
-.isSelectedNonMatching {
-	.treeLabel {
-		opacity: 0.5;
-	}
-}
-
-// `.spanBar` text color is the one place where semantic tokens don't fit
-// cleanly: in dark mode the bar's bright `--span-color` background needs dark
-// text; in light mode `generateColor` produces darker bar fills, so the text
-// must flip to white.
-:global(.lightMode) {
-	.root {
-		.spanDuration .spanBar {
-			color: rgba(255, 255, 255, 0.9);
-		}
-
-		.timelineRow:hover .spanBar,
-		.timelineRow.hoveredSpan .spanBar,
-		.isInterested .spanBar,
-		.isSelectedNonMatching .spanBar {
-			color: var(--span-color);
-		}
-	}
-}
-
-// Tooltips for the row's hover-revealed action buttons (Copy / Add to Funnel).
-// Bumped above FloatingPanel (z-index 999) so they stay visible when the
-// SpanDetailsPanel is docked as a floating panel.
-.actionTooltip {
-	--tooltip-z-index: 1000;
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Success.styles.scss

@@ -0,0 +1,636 @@
+.waterfall-loading-bar {
+	height: 2px;
+	background: var(--primary);
+	animation: waterfall-loading 1.5s ease-in-out infinite;
+	flex-shrink: 0;
+}
+
+@keyframes waterfall-loading {
+	0% {
+		opacity: 0.3;
+		transform: scaleX(0.3);
+		transform-origin: left;
+	}
+	50% {
+		opacity: 1;
+		transform: scaleX(1);
+		transform-origin: left;
+	}
+	100% {
+		opacity: 0.3;
+		transform: scaleX(0.3);
+		transform-origin: right;
+	}
+}
+
+.success-content {
+	overflow-y: hidden;
+	overflow-x: hidden;
+	max-width: 100%;
+	flex: 1;
+	min-height: 0;
+	display: flex;
+	flex-direction: column;
+
+	.missing-spans {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		height: 44px;
+		margin: 16px;
+		padding: 12px;
+		border-radius: 4px;
+		background: rgba(69, 104, 220, 0.1);
+
+		.left-info {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+			color: var(--bg-robin-400);
+			font-family: Inter;
+			font-size: 14px;
+			font-style: normal;
+			font-weight: 400;
+			line-height: 20px; /* 142.857% */
+			letter-spacing: -0.07px;
+
+			.text {
+				color: var(--bg-robin-400);
+				font-family: Inter;
+				font-size: 14px;
+				font-style: normal;
+				font-weight: 400;
+				line-height: 20px; /* 142.857% */
+				letter-spacing: -0.07px;
+			}
+		}
+
+		.right-info {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			gap: 8px;
+			color: var(--bg-robin-400);
+			font-family: Inter;
+			font-size: 14px;
+			font-style: normal;
+			font-weight: 400;
+			line-height: 20px; /* 142.857% */
+			letter-spacing: -0.07px;
+		}
+
+		.right-info:hover {
+			background-color: unset;
+			color: var(--bg-robin-200);
+		}
+	}
+
+	.waterfall-split-panel {
+		flex: 1;
+		min-height: 0;
+		overflow-y: auto;
+		overflow-x: hidden;
+		padding: 0px 20px 0px 20px;
+
+		&::-webkit-scrollbar {
+			width: 0.1rem;
+		}
+	}
+
+	.waterfall-split-header {
+		position: sticky;
+		top: 0;
+		z-index: 2;
+		display: flex;
+		height: 25px;
+		background-color: var(--l1-background);
+
+		.sidebar-header {
+			flex-shrink: 0;
+		}
+
+		.resize-handle-header {
+			width: 4px;
+			flex-shrink: 0;
+		}
+
+		.status-header {
+			width: 50px;
+			flex-shrink: 0;
+		}
+
+		.timeline-header {
+			flex: 1;
+			overflow: hidden;
+			padding: 0 15px;
+		}
+	}
+
+	.waterfall-split-body {
+		display: flex;
+		position: relative;
+	}
+
+	// Invisible IntersectionObserver targets pinned at the top and bottom of
+	// the virtualized content. See `useBoundaryPagination`.
+	.waterfall-load-more-sentinel {
+		position: absolute;
+		left: 0;
+		right: 0;
+		height: 1px;
+		pointer-events: none;
+
+		&--top {
+			top: 0;
+		}
+
+		&--bottom {
+			bottom: 0;
+		}
+	}
+
+	.waterfall-sidebar {
+		overflow-x: auto;
+		overflow-y: hidden;
+		flex-shrink: 0;
+		border-right: 1px solid var(--l1-border);
+
+		.resizable-box__content {
+			overflow-x: auto;
+			overflow-y: hidden;
+
+			&::-webkit-scrollbar {
+				height: 0;
+			}
+
+			scrollbar-width: none;
+		}
+
+		&::-webkit-scrollbar {
+			height: 0.3rem;
+		}
+
+		&::-webkit-scrollbar-thumb {
+			background: var(--l3-background);
+			border-radius: 4px;
+		}
+	}
+
+	.span-tree-table {
+		position: relative;
+		border-collapse: collapse;
+
+		.span-tree-row {
+			display: flex;
+			align-items: center;
+		}
+
+		.span-tree-cell {
+			display: flex;
+			width: 100%;
+			height: 28px;
+			align-items: center;
+			overflow: visible;
+			padding: 0;
+		}
+
+		.span-tree-row:hover,
+		.span-tree-row.hovered-span {
+			border-radius: 4px;
+			background: color-mix(
+				in srgb,
+				var(--l3-background) 20%,
+				transparent
+			) !important;
+
+			.span-overview {
+				background: unset !important;
+			}
+		}
+	}
+
+	.sidebar-resize-handle {
+		width: 4px;
+		flex-shrink: 0;
+		cursor: col-resize;
+		user-select: none;
+		touch-action: none;
+		background: transparent;
+		transition: background 0.15s ease;
+		z-index: 1;
+
+		&:hover,
+		&:active {
+			background: rgba(35, 196, 248, 0.2);
+		}
+	}
+
+	.waterfall-status-col {
+		width: 50px;
+		flex-shrink: 0;
+		position: relative;
+
+		.status-cell {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			cursor: pointer;
+
+			--badge-border-radius: 2px;
+			--badge-padding: 3px 6px;
+			--badge-line-height: 12px;
+			--badge-border-width: 0px;
+
+			&.hovered-span {
+				border-radius: 4px;
+				background: color-mix(
+					in srgb,
+					var(--l3-background) 20%,
+					transparent
+				) !important;
+			}
+
+			&.interested-span,
+			&.selected-non-matching-span {
+				border-radius: 4px;
+				background: color-mix(
+					in srgb,
+					var(--l3-background) 40%,
+					transparent
+				) !important;
+			}
+
+			&.dimmed-span {
+				opacity: 0.15;
+			}
+		}
+	}
+
+	.waterfall-timeline {
+		flex: 1;
+		position: relative;
+		overflow: hidden;
+
+		.waterfall-crosshair {
+			position: absolute;
+			top: 0;
+			bottom: 0;
+			width: 1px;
+			background: var(--l3-background);
+			pointer-events: none;
+			z-index: 1;
+		}
+
+		.timeline-row {
+			display: flex;
+			align-items: center;
+			// Match timeline-header's 15px padding so bars align with ticks
+			padding: 0 15px;
+		}
+
+		.timeline-row:hover,
+		.timeline-row.hovered-span {
+			border-radius: 4px;
+			background: color-mix(
+				in srgb,
+				var(--l3-background) 20%,
+				transparent
+			) !important;
+		}
+
+		.timeline-row:has(.interested-span),
+		.timeline-row:has(.selected-non-matching-span) {
+			border-radius: 4px;
+			background: color-mix(
+				in srgb,
+				var(--l3-background) 40%,
+				transparent
+			) !important;
+		}
+	}
+
+	// Shared span component styles (used in both panels)
+	.span-overview {
+		display: flex;
+		align-items: center;
+		flex-shrink: 0;
+		height: 100%;
+		width: 100%;
+		cursor: pointer;
+		position: relative;
+		white-space: nowrap;
+
+		.tree-indent {
+			display: inline-block;
+			flex-shrink: 0;
+		}
+
+		.tree-line {
+			position: absolute;
+			background-color: var(--l2-border);
+			pointer-events: none;
+		}
+
+		.tree-connector {
+			position: absolute;
+			width: 14px;
+			height: 50%;
+			border-left: 1px solid var(--l2-border);
+			border-bottom: 1px solid var(--l2-border);
+			border-bottom-left-radius: 6px;
+			pointer-events: none;
+		}
+
+		// Reserved horizontal space for the chevron — present on every row,
+		// filled only when the span has children. Keeps sibling icons aligned.
+		.tree-arrow-slot {
+			width: 18px;
+			flex-shrink: 0;
+			display: inline-flex;
+			align-items: center;
+			justify-content: center;
+		}
+
+		.tree-arrow {
+			display: inline-flex;
+			align-items: center;
+			justify-content: center;
+			width: 18px;
+			height: 18px;
+			flex-shrink: 0;
+			cursor: pointer;
+			color: var(--l1-foreground);
+			border-radius: 4px;
+
+			&:hover {
+				background: var(--l3-background);
+			}
+		}
+
+		// Reserved horizontal space for the subtree-count badge — same reason.
+		// Right-aligns the badge inside so single-digit counts don't push the
+		// icon left of where multi-digit counts would put it.
+		.subtree-count-slot {
+			min-width: 34px;
+			flex-shrink: 0;
+			display: inline-flex;
+			align-items: center;
+			justify-content: flex-end;
+			padding-right: 4px;
+		}
+
+		.subtree-count {
+			display: inline-flex;
+			align-items: center;
+			flex-shrink: 0;
+
+			.badge {
+				font-size: 10px;
+				line-height: 14px;
+				padding: 0 4px;
+				height: 14px;
+			}
+		}
+
+		.tree-icon {
+			display: inline-block;
+			width: 7px;
+			height: 7px;
+			border-radius: 50%;
+			flex-shrink: 0;
+			margin: 0 6px;
+
+			&.is-error {
+				box-shadow: 0 0 0 2px rgba(255, 70, 70, 0.3);
+			}
+		}
+
+		.tree-label {
+			color: var(--l1-foreground);
+			font-family: 'Inter';
+			font-size: 13px;
+			font-weight: 400;
+			line-height: 28px;
+			letter-spacing: 0.01em;
+			overflow: hidden;
+			text-overflow: ellipsis;
+			white-space: nowrap;
+			flex: 1;
+			min-width: 0;
+
+			.tree-service-name {
+				margin-left: 18px;
+				color: var(--l3-foreground);
+				font-weight: 400;
+			}
+		}
+
+		.span-row-actions {
+			position: sticky;
+			right: 0;
+			display: flex;
+			align-items: center;
+			gap: 2px;
+			margin-left: auto;
+			padding-right: 4px;
+			padding-left: 8px;
+			flex-shrink: 0;
+			height: 100%;
+			background: linear-gradient(to left, var(--l1-background) 60%, transparent);
+			z-index: 2;
+			opacity: 0;
+			pointer-events: none;
+
+			.span-action-btn {
+				display: flex;
+				align-items: center;
+				justify-content: center;
+				width: 22px;
+				height: 22px;
+				border-radius: 2px;
+				cursor: pointer;
+				color: var(--l1-foreground);
+				background: transparent;
+				border: none;
+				padding: 0;
+
+				&:hover {
+					background: var(--l3-background);
+				}
+			}
+		}
+
+		&:hover .span-row-actions {
+			opacity: 1;
+			pointer-events: auto;
+		}
+	}
+
+	// Also show action buttons when hovering the tree row (parent of span-overview)
+	.span-tree-row:hover .span-row-actions,
+	.span-tree-row.hovered-span .span-row-actions {
+		opacity: 1;
+		pointer-events: auto;
+	}
+
+	.span-duration {
+		display: flex;
+		align-items: center;
+		height: 28px;
+		position: relative;
+		width: 100%;
+		padding: 0 15px;
+		cursor: pointer;
+
+		.span-bar {
+			position: absolute;
+			height: 18px;
+			top: 5px;
+			border-radius: 2px;
+			display: flex;
+			align-items: center;
+			padding: 0 8px;
+			overflow: hidden;
+			cursor: pointer;
+			white-space: nowrap;
+			color: rgba(0, 0, 0, 0.9);
+			background-color: var(--span-color);
+			border: 1px solid transparent;
+
+			.span-info {
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				width: 100%;
+				overflow: hidden;
+				z-index: 1;
+
+				.span-name {
+					font-weight: 500;
+					font-size: 11px;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+					flex-grow: 1;
+					min-width: 0;
+				}
+
+				.span-duration-text {
+					color: inherit;
+					opacity: 0.8;
+					font-size: 10px;
+					margin-left: 8px;
+					flex-shrink: 0;
+				}
+			}
+		}
+
+		.event-dot {
+			position: absolute;
+			top: 50%;
+			transform: translate(-50%, -50%) rotate(45deg);
+			width: 5px;
+			height: 5px;
+			background-color: var(--event-dot-bg, var(--bg-robin-500));
+			border: 1px solid var(--event-dot-border, var(--bg-robin-600));
+			cursor: pointer;
+			z-index: 1;
+
+			&.error {
+				background-color: var(--destructive);
+				border-color: var(--destructive);
+			}
+
+			&:hover {
+				transform: translate(-50%, -50%) rotate(45deg) scale(1.5);
+			}
+		}
+	}
+
+	// Hover state: solid l2-background fill + border (matches flamegraph)
+	.timeline-row:hover .span-bar,
+	.timeline-row.hovered-span .span-bar {
+		color: var(--span-color);
+		background-color: var(--l2-background);
+		background-image: none;
+		border: 1px solid var(--span-color);
+	}
+
+	// Selected state: solid l3-background fill + dashed border (matches flamegraph)
+	.interested-span .span-bar,
+	.selected-non-matching-span .span-bar {
+		color: var(--span-color);
+		background-color: var(--l2-background);
+		background-image: none;
+		border: 1px dashed var(--span-color);
+	}
+
+	// Shared state classes for both panels
+	// Background highlight for selection is on .timeline-row via :has() — see .waterfall-timeline
+	// Only apply on .span-overview (left panel) where there's no parent row with :has()
+	.span-overview.interested-span,
+	.span-overview.selected-non-matching-span {
+		border-radius: 4px;
+		background: color-mix(
+			in srgb,
+			var(--l3-background) 40%,
+			transparent
+		) !important;
+	}
+
+	.dimmed-span {
+		opacity: 0.15;
+	}
+	.highlighted-span {
+		opacity: 1;
+	}
+
+	.selected-non-matching-span {
+		.tree-label {
+			opacity: 0.5;
+		}
+	}
+}
+
+.span-dets {
+	.related-logs {
+		display: flex;
+		width: 160px;
+		padding: 4px 8px;
+		justify-content: center;
+		align-items: center;
+		gap: 8px;
+		border-radius: 2px;
+		border: 1px solid var(--l1-border);
+		background: var(--l2-background);
+		box-shadow: none;
+	}
+}
+
+// `.span-bar` text color is the one place where semantic tokens don't fit
+// cleanly: in dark mode the bar's bright `--span-color` background needs dark
+// text; in light mode `generateColor` produces darker bar fills, so the text
+// must flip to white. This is the only `.lightMode` carve-out left after the
+// migration to semantic tokens — the hover/selected rules are repeated here
+// to beat the default-state rule's specificity inside `.lightMode`.
+.lightMode {
+	.success-content {
+		.span-duration .span-bar {
+			color: rgba(255, 255, 255, 0.9);
+		}
+
+		.timeline-row:hover .span-bar,
+		.timeline-row.hovered-span .span-bar,
+		.interested-span .span-bar,
+		.selected-non-matching-span .span-bar {
+			color: var(--span-color);
+		}
+	}
+}
+
+// Tooltips for the row's hover-revealed action buttons (Copy / Add to Funnel).
+// Bumped above FloatingPanel (z-index 999) so they stay visible when the
+// SpanDetailsPanel is docked as a floating panel.
+.span-action-tooltip {
+	--tooltip-z-index: 1000;
+}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Success.tsx

@@ -53,7 +53,7 @@ import { SpanHoverCard } from '../../../SpanHoverCard/SpanHoverCard';
 import AddSpanToFunnelModal from '../../AddSpanToFunnelModal/AddSpanToFunnelModal';
 import { IInterestedSpan } from '../../types';
 
-import styles from './Success.module.scss';
+import './Success.styles.scss';
 
 /**
  * Lazy event dot — only mounts the tooltip when the user hovers.
@@ -91,7 +91,7 @@ const LazyEventDotPopover = memo(function LazyEventDotPopover({
 
 	const dot = (
 		<div
-			className={cx(styles.eventDot, isError && styles.hasError)}
+			className={`event-dot ${isError ? 'error' : ''}`}
 			style={
 				{
 					left: `${dotLeft}%`,
@@ -121,7 +121,7 @@ const LazyEventDotPopover = memo(function LazyEventDotPopover({
 				}}
 			>
 				<TooltipTrigger asChild>{dot}</TooltipTrigger>
-				<TooltipContent className={styles.popover}>
+				<TooltipContent className="span-hover-card-popover">
 					<EventTooltipContent
 						eventName={event.name}
 						timeOffsetMs={eventTimeMs - spanTimestamp}
@@ -243,11 +243,11 @@ const SpanOverview = memo(function SpanOverview({
 
 	return (
 		<div
-			className={cx(styles.spanOverview, {
-				[styles.isInterested]: isSelected && (!isFilterActive || isMatching),
-				[styles.isHighlighted]: isHighlighted,
-				[styles.isSelectedNonMatching]: isSelectedNonMatching,
-				[styles.isDimmed]: isDimmed,
+			className={cx('span-overview', {
+				'interested-span': isSelected && (!isFilterActive || isMatching),
+				'highlighted-span': isHighlighted,
+				'selected-non-matching-span': isSelectedNonMatching,
+				'dimmed-span': isDimmed,
 			})}
 			onClick={(): void => handleSpanClick(span)}
 			onMouseEnter={(): void => onHoverEnter(span.span_id)}
@@ -264,7 +264,7 @@ const SpanOverview = memo(function SpanOverview({
 						return (
 							<div
 								key={lvl}
-								className={styles.treeLine}
+								className="tree-line"
 								style={{
 									left: xPos,
 									top: 0,
@@ -277,25 +277,25 @@ const SpanOverview = memo(function SpanOverview({
 					return (
 						<div key={lvl}>
 							<div
-								className={styles.treeLine}
+								className="tree-line"
 								style={{ left: xPos, top: 0, width: 1, height: '50%' }}
 							/>
-							<div className={styles.treeConnector} style={{ left: xPos, top: 0 }} />
+							<div className="tree-connector" style={{ left: xPos, top: 0 }} />
 						</div>
 					);
 				})}
 
 			{/* Indent spacer */}
-			<span className={styles.treeIndent} style={{ width: `${indentWidth}px` }} />
+			<span className="tree-indent" style={{ width: `${indentWidth}px` }} />
 
 			{/* Expand/collapse arrow + child count slots — always render the
 				    slots, fill them only when the span has children. Reserving the
 				    horizontal space on leaf rows aligns sibling icons regardless
 				    of whether each sibling is a parent or a leaf. */}
-			<span className={styles.treeArrowSlot}>
+			<span className="tree-arrow-slot">
 				{span.has_children && (
 					<span
-						className={styles.treeArrow}
+						className={cx('tree-arrow', { expanded: !isSpanCollapsed })}
 						onClick={(event): void => {
 							event.stopPropagation();
 							event.preventDefault();
@@ -306,9 +306,9 @@ const SpanOverview = memo(function SpanOverview({
 					</span>
 				)}
 			</span>
-			<span className={styles.subtreeCountSlot}>
+			<span className="subtree-count-slot">
 				{span.has_children && (
-					<span className={styles.subtreeCount}>
+					<span className="subtree-count">
 						<Badge color="vanilla">{span.sub_tree_node_count}</Badge>
 					</span>
 				)}
@@ -316,18 +316,18 @@ const SpanOverview = memo(function SpanOverview({
 
 			{/* Colored service dot */}
 			<span
-				className={cx(styles.treeIcon, { [styles.hasError]: span.has_error })}
+				className={cx('tree-icon', { 'is-error': span.has_error })}
 				style={{ backgroundColor: color }}
 			/>
 
 			{/* Span name + service name */}
-			<span className={styles.treeLabel}>
+			<span className="tree-label">
 				{span.name}
-				<span className={styles.treeServiceName}>{span['service.name']}</span>
+				<span className="tree-service-name">{span['service.name']}</span>
 			</span>
 
 			{/* Action buttons — shown on hover via CSS, right-aligned */}
-			<span className={styles.rowActions}>
+			<span className="span-row-actions">
 				<TooltipProvider delayDuration={200}>
 					<Tooltip>
 						<TooltipTrigger asChild>
@@ -335,13 +335,13 @@ const SpanOverview = memo(function SpanOverview({
 								variant="ghost"
 								size="icon"
 								color="secondary"
-								className={styles.actionBtn}
+								className="span-action-btn"
 								onClick={onSpanCopy}
 							>
 								<Link size={12} />
 							</Button>
 						</TooltipTrigger>
-						<TooltipContent className={styles.actionTooltip}>
+						<TooltipContent className="span-action-tooltip">
 							Copy Span Link
 						</TooltipContent>
 					</Tooltip>
@@ -351,13 +351,13 @@ const SpanOverview = memo(function SpanOverview({
 								variant="ghost"
 								size="icon"
 								color="secondary"
-								className={styles.actionBtn}
+								className="span-action-btn"
 								onClick={handleFunnelClick}
 							>
 								<ListPlus size={12} />
 							</Button>
 						</TooltipTrigger>
-						<TooltipContent className={styles.actionTooltip}>
+						<TooltipContent className="span-action-tooltip">
 							Add to Trace Funnel
 						</TooltipContent>
 					</Tooltip>
@@ -410,16 +410,16 @@ export const SpanDuration = memo(function SpanDuration({
 
 	return (
 		<div
-			className={cx(styles.spanDuration, {
-				[styles.isInterested]: isSelected && (!isFilterActive || isMatching),
-				[styles.isHighlighted]: isHighlighted,
-				[styles.isSelectedNonMatching]: isSelectedNonMatching,
-				[styles.isDimmed]: isDimmed,
+			className={cx('span-duration', {
+				'interested-span': isSelected && (!isFilterActive || isMatching),
+				'highlighted-span': isHighlighted,
+				'selected-non-matching-span': isSelectedNonMatching,
+				'dimmed-span': isDimmed,
 			})}
 			onClick={(): void => handleSpanClick(span)}
 		>
 			<div
-				className={styles.spanBar}
+				className="span-bar"
 				style={
 					{
 						left: `${leftOffset}%`,
@@ -429,9 +429,9 @@ export const SpanDuration = memo(function SpanDuration({
 					} as React.CSSProperties
 				}
 			>
-				<span className={styles.spanInfo}>
-					<span className={styles.spanName}>{span.name}</span>
-					<span className={styles.spanDurationText}>{`${toFixed(
+				<span className="span-info">
+					<span className="span-name">{span.name}</span>
+					<span className="span-duration-text">{`${toFixed(
 						time,
 						2,
 					)} ${timeUnitName}`}</span>
@@ -529,11 +529,11 @@ function Success(props: ISuccessProps): JSX.Element {
 
 		if (prev) {
 			const prevElements = document.querySelectorAll(`[data-span-id="${prev}"]`);
-			prevElements.forEach((el) => el.classList.remove(styles.hoveredSpan));
+			prevElements.forEach((el) => el.classList.remove('hovered-span'));
 		}
 		if (spanId) {
 			const nextElements = document.querySelectorAll(`[data-span-id="${spanId}"]`);
-			nextElements.forEach((el) => el.classList.add(styles.hoveredSpan));
+			nextElements.forEach((el) => el.classList.add('hovered-span'));
 		}
 		prevHoveredSpanIdRef.current = spanId;
 	}, []);
@@ -798,17 +798,17 @@ function Success(props: ISuccessProps): JSX.Element {
 	}, []);
 
 	return (
-		<div className={styles.root}>
+		<div className="success-content">
 			{traceMetadata.hasMissingSpans && (
-				<div className={styles.missingSpans}>
-					<section className={styles.leftInfo}>
+				<div className="missing-spans">
+					<section className="left-info">
 						<CircleAlert size={14} />
-						<span className={styles.text}>This trace has missing spans</span>
+						<span className="text">This trace has missing spans</span>
 					</section>
 					<Button
 						variant="ghost"
 						color="secondary"
-						className={styles.rightInfo}
+						className="right-info"
 						suffix={<ArrowUpRight size={14} />}
 						onClick={(): WindowProxy | null =>
 							window.open(
@@ -821,17 +821,17 @@ function Success(props: ISuccessProps): JSX.Element {
 					</Button>
 				</div>
 			)}
-			{isFetching && <div className={styles.loadingBar} />}
-			<div className={styles.splitPanel} ref={scrollContainerRef}>
+			{isFetching && <div className="waterfall-loading-bar" />}
+			<div className="waterfall-split-panel" ref={scrollContainerRef}>
 				{/* Sticky header row */}
-				<div className={styles.splitHeader}>
+				<div className="waterfall-split-header">
 					<div
-						className={styles.sidebarHeader}
+						className="sidebar-header"
 						style={{ width: sidebarWidth, flexShrink: 0 }}
 					/>
-					<div className={styles.resizeHandleHeader} />
-					<div className={styles.statusHeader} />
-					<div className={styles.timelineHeader}>
+					<div className="resize-handle-header" />
+					<div className="status-header" />
+					<div className="timeline-header">
 						<TimelineV3
 							startTimestamp={traceMetadata.startTime}
 							endTimestamp={traceMetadata.endTime}
@@ -844,7 +844,7 @@ function Success(props: ISuccessProps): JSX.Element {
 
 				{/* Split body */}
 				<div
-					className={styles.splitBody}
+					className="waterfall-split-body"
 					style={{
 						minHeight: virtualizer.getTotalSize(),
 						height: '100%',
@@ -854,11 +854,11 @@ function Success(props: ISuccessProps): JSX.Element {
 					    fires a load-more via useBoundaryPagination. */}
 					<div
 						ref={loadMoreTopSentinelRef}
-						className={cx(styles.loadMoreSentinel, styles.loadMoreSentinelTop)}
+						className="waterfall-load-more-sentinel waterfall-load-more-sentinel--top"
 					/>
 					<div
 						ref={loadMoreBottomSentinelRef}
-						className={cx(styles.loadMoreSentinel, styles.loadMoreSentinelBottom)}
+						className="waterfall-load-more-sentinel waterfall-load-more-sentinel--bottom"
 					/>
 					<SpanHoverCard
 						hoveredSpanId={hoveredSpanId}
@@ -875,9 +875,9 @@ function Success(props: ISuccessProps): JSX.Element {
 						minWidth={MIN_SIDEBAR_WIDTH}
 						maxWidth={MAX_SIDEBAR_WIDTH}
 						onResize={setSidebarWidth}
-						className={styles.sidebar}
+						className="waterfall-sidebar"
 					>
-						<table className={styles.treeTable} style={{ width: maxContentWidth }}>
+						<table className="span-tree-table" style={{ width: maxContentWidth }}>
 							<tbody>
 								{virtualItems.map((virtualRow) => {
 									const row = leftRows[virtualRow.index];
@@ -887,7 +887,7 @@ function Success(props: ISuccessProps): JSX.Element {
 											key={String(virtualRow.key)}
 											data-testid={`cell-0-${span.span_id}`}
 											data-span-id={span.span_id}
-											className={styles.treeRow}
+											className="span-tree-row"
 											style={{
 												position: 'absolute',
 												top: 0,
@@ -900,7 +900,7 @@ function Success(props: ISuccessProps): JSX.Element {
 											onMouseLeave={handleRowMouseLeave}
 										>
 											{row.getVisibleCells().map((cell) => (
-												<td key={cell.id} className={styles.treeCell}>
+												<td key={cell.id} className="span-tree-cell">
 													{flexRender(cell.column.columnDef.cell, cell.getContext())}
 												</td>
 											))}
@@ -912,7 +912,7 @@ function Success(props: ISuccessProps): JSX.Element {
 					</ResizableBox>
 
 					{/* Status code column */}
-					<div className={styles.statusCol}>
+					<div className="waterfall-status-col">
 						{virtualItems.map((virtualRow) => {
 							const span = spans[virtualRow.index];
 							const { isSelected, isDimmed, isSelectedNonMatching, isMatching } =
@@ -925,10 +925,10 @@ function Success(props: ISuccessProps): JSX.Element {
 							return (
 								<div
 									key={`status-${String(virtualRow.key)}`}
-									className={cx(styles.statusCell, {
-										[styles.isInterested]: isSelected && (!isFilterActive || isMatching),
-										[styles.isDimmed]: isDimmed,
-										[styles.isSelectedNonMatching]: isSelectedNonMatching,
+									className={cx('status-cell', {
+										'interested-span': isSelected && (!isFilterActive || isMatching),
+										'dimmed-span': isDimmed,
+										'selected-non-matching-span': isSelectedNonMatching,
 									})}
 									style={{
 										position: 'absolute',
@@ -953,13 +953,13 @@ function Success(props: ISuccessProps): JSX.Element {
 
 					{/* Right panel - timeline bars */}
 					<div
-						className={styles.timeline}
+						className="waterfall-timeline"
 						ref={timelineAreaRef}
 						onMouseMove={onCrosshairMove}
 						onMouseLeave={onCrosshairLeave}
 					>
 						{cursorX !== null && (
-							<div className={styles.crosshair} style={{ left: cursorX }} />
+							<div className="waterfall-crosshair" style={{ left: cursorX }} />
 						)}
 						{virtualItems.map((virtualRow) => {
 							const span = spans[virtualRow.index];
@@ -968,7 +968,7 @@ function Success(props: ISuccessProps): JSX.Element {
 									key={String(virtualRow.key)}
 									data-testid={`cell-1-${span.span_id}`}
 									data-span-id={span.span_id}
-									className={styles.timelineRow}
+									className="timeline-row"
 									style={{
 										position: 'absolute',
 										top: 0,

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/__tests__/SpanDuration.test.tsx

@@ -2,33 +2,18 @@ import useUrlQuery from 'hooks/useUrlQuery';
 import { fireEvent, render, screen } from 'tests/test-utils';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 
-// Local identity-proxy mock for this module so `styles.foo` resolves to
-// `'foo'` in test assertions. The global `__mocks__/cssMock.ts` stays as
-// `export default {}`; we override resolution for this specific file only.
-jest.mock(
-	'../Success.module.scss',
-	() =>
-		new Proxy(
-			{},
-			{
-				get: (_target, prop): string | undefined =>
-					typeof prop === 'string' && prop !== '__esModule' ? prop : undefined,
-			},
-		),
-);
-
 import { SpanDuration } from '../Success';
-import successStyles from '../Success.module.scss';
 
 const renderWithTraceProvider: typeof render = (ui, options) =>
 	render(ui, options);
 
+// Constants to avoid string duplication
 const SPAN_DURATION_TEXT = '1.16 ms';
-const SPAN_DURATION_CLASS = `.${successStyles.spanDuration}`;
-const INTERESTED_SPAN_CLASS = successStyles.isInterested;
-const HIGHLIGHTED_SPAN_CLASS = successStyles.isHighlighted;
-const DIMMED_SPAN_CLASS = successStyles.isDimmed;
-const SELECTED_NON_MATCHING_SPAN_CLASS = successStyles.isSelectedNonMatching;
+const SPAN_DURATION_CLASS = '.span-duration';
+const INTERESTED_SPAN_CLASS = 'interested-span';
+const HIGHLIGHTED_SPAN_CLASS = 'highlighted-span';
+const DIMMED_SPAN_CLASS = 'dimmed-span';
+const SELECTED_NON_MATCHING_SPAN_CLASS = 'selected-non-matching-span';
 
 jest.mock('components/TimelineV3/TimelineV3', () => ({
 	__esModule: true,
@@ -142,7 +127,10 @@ describe('SpanDuration', () => {
 
 		const spanElement = screen.getByText(SPAN_DURATION_TEXT);
 
+		// Hover over the span should add hovered-span class
 		fireEvent.mouseEnter(spanElement);
+
+		// Mouse leave should remove hovered-span class
 		fireEvent.mouseLeave(spanElement);
 	});
 
@@ -271,8 +259,8 @@ describe('SpanDuration', () => {
 				traceMetadata={mockTraceMetadata}
 				selectedSpan={undefined}
 				handleSpanClick={mockSetSelectedSpan}
-				filteredSpanIds={[]}
-				isFilterActive
+				filteredSpanIds={[]} // Empty array but filter is active
+				isFilterActive // This is the key difference
 			/>,
 		);
 

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/__tests__/UnifiedSpanClick.test.tsx

@@ -2,23 +2,7 @@ import React from 'react';
 import { render, screen, userEvent, waitFor } from 'tests/test-utils';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 
-// Local identity-proxy mock for this module so `styles.foo` resolves to
-// `'foo'` in test assertions. The global `__mocks__/cssMock.ts` stays as
-// `export default {}`; we override resolution for this specific file only.
-jest.mock(
-	'../Success.module.scss',
-	() =>
-		new Proxy(
-			{},
-			{
-				get: (_target, prop): string | undefined =>
-					typeof prop === 'string' && prop !== '__esModule' ? prop : undefined,
-			},
-		),
-);
-
 import Success from '../Success';
-import successStyles from '../Success.module.scss';
 
 const renderWithTraceProvider: typeof render = (ui, options, customOptions) =>
 	render(ui, options, customOptions);
@@ -227,10 +211,10 @@ describe('Span Click User Flows', () => {
 	const FIRST_SPAN_TEST_ID = 'cell-0-span-1';
 	const FIRST_SPAN_DURATION_TEST_ID = 'cell-1-span-1';
 	const SECOND_SPAN_TEST_ID = 'cell-0-span-2';
+	const SPAN_OVERVIEW_CLASS = '.span-overview';
+	const SPAN_DURATION_CLASS = '.span-duration';
+	const INTERESTED_SPAN_CLASS = 'interested-span';
 	const SECOND_SPAN_DURATION_TEST_ID = 'cell-1-span-2';
-	const SPAN_OVERVIEW_CLASS = `.${successStyles.spanOverview}`;
-	const SPAN_DURATION_CLASS = `.${successStyles.spanDuration}`;
-	const INTERESTED_SPAN_CLASS = successStyles.isInterested;
 
 	beforeEach(() => {
 		jest.clearAllMocks();
@@ -284,6 +268,7 @@ describe('Span Click User Flows', () => {
 			initialRoute: '/trace',
 		});
 
+		// Wait for initial render and selection
 		await waitFor(() => {
 			const spanDuration = screen.getByTestId(FIRST_SPAN_DURATION_TEST_ID);
 			const spanDurationElement = spanDuration.querySelector(
@@ -292,12 +277,14 @@ describe('Span Click User Flows', () => {
 			expect(spanDurationElement).toHaveClass(INTERESTED_SPAN_CLASS);
 		});
 
+		// Click on span-2 to test selection change
 		const span2Duration = screen.getByTestId(SECOND_SPAN_DURATION_TEST_ID);
 		const span2DurationElement = span2Duration.querySelector(
 			SPAN_DURATION_CLASS,
 		) as HTMLElement;
 		await user.click(span2DurationElement);
 
+		// Wait for the state update and re-render
 		await waitFor(() => {
 			const spanDuration = screen.getByTestId(FIRST_SPAN_DURATION_TEST_ID);
 			const spanDurationElement = spanDuration.querySelector(
@@ -320,6 +307,7 @@ describe('Span Click User Flows', () => {
 			initialRoute: '/trace',
 		});
 
+		// Wait for initial render and selection
 		await waitFor(() => {
 			const spanOverview = screen.getByTestId(FIRST_SPAN_TEST_ID);
 			const spanDuration = screen.getByTestId(FIRST_SPAN_DURATION_TEST_ID);
@@ -330,16 +318,19 @@ describe('Span Click User Flows', () => {
 				SPAN_DURATION_CLASS,
 			) as HTMLElement;
 
+			// Initially both areas should show the same visual selection (first span is auto-selected)
 			expect(spanOverviewElement).toHaveClass(INTERESTED_SPAN_CLASS);
 			expect(spanDurationElement).toHaveClass(INTERESTED_SPAN_CLASS);
 		});
 
+		// Click span-2 to test selection change
 		const span2Overview = screen.getByTestId(SECOND_SPAN_TEST_ID);
 		const span2Element = span2Overview.querySelector(
 			SPAN_OVERVIEW_CLASS,
 		) as HTMLElement;
 		await user.click(span2Element);
 
+		// Wait for the state update and re-render
 		await waitFor(() => {
 			const spanOverview = screen.getByTestId(FIRST_SPAN_TEST_ID);
 			const spanDuration = screen.getByTestId(FIRST_SPAN_DURATION_TEST_ID);
@@ -350,15 +341,17 @@ describe('Span Click User Flows', () => {
 				SPAN_DURATION_CLASS,
 			) as HTMLElement;
 
+			// Now span-2 should be selected, span-1 should not
 			expect(spanOverviewElement).not.toHaveClass(INTERESTED_SPAN_CLASS);
 			expect(spanDurationElement).not.toHaveClass(INTERESTED_SPAN_CLASS);
 
-			const span2OverviewSub = screen.getByTestId(SECOND_SPAN_TEST_ID);
-			const span2DurationSub = screen.getByTestId(SECOND_SPAN_DURATION_TEST_ID);
-			const span2OverviewElement = span2OverviewSub.querySelector(
+			// Check that span-2 is selected
+			const span2Overview = screen.getByTestId(SECOND_SPAN_TEST_ID);
+			const span2Duration = screen.getByTestId(SECOND_SPAN_DURATION_TEST_ID);
+			const span2OverviewElement = span2Overview.querySelector(
 				SPAN_OVERVIEW_CLASS,
 			) as HTMLElement;
-			const span2DurationElement = span2DurationSub.querySelector(
+			const span2DurationElement = span2Duration.querySelector(
 				SPAN_DURATION_CLASS,
 			) as HTMLElement;
 
@@ -374,6 +367,7 @@ describe('Span Click User Flows', () => {
 			initialRoute: '/trace',
 		});
 
+		// Wait for initial render and selection
 		await waitFor(() => {
 			const span1Overview = screen.getByTestId(FIRST_SPAN_TEST_ID);
 			const span1Element = span1Overview.querySelector(
@@ -382,24 +376,27 @@ describe('Span Click User Flows', () => {
 			expect(span1Element).toHaveClass(INTERESTED_SPAN_CLASS);
 		});
 
+		// Click second span
 		const span2Overview = screen.getByTestId(SECOND_SPAN_TEST_ID);
 		const span2Element = span2Overview.querySelector(
 			SPAN_OVERVIEW_CLASS,
 		) as HTMLElement;
 		await user.click(span2Element);
 
+		// Wait for the state update and re-render
 		await waitFor(() => {
 			const span1Overview = screen.getByTestId(FIRST_SPAN_TEST_ID);
 			const span1Element = span1Overview.querySelector(
 				SPAN_OVERVIEW_CLASS,
 			) as HTMLElement;
-			const span2OverviewSub = screen.getByTestId(SECOND_SPAN_TEST_ID);
-			const span2ElementSub = span2OverviewSub.querySelector(
+			const span2Overview = screen.getByTestId(SECOND_SPAN_TEST_ID);
+			const span2Element = span2Overview.querySelector(
 				SPAN_OVERVIEW_CLASS,
 			) as HTMLElement;
 
+			// Second span should be selected, first should not
 			expect(span1Element).not.toHaveClass(INTERESTED_SPAN_CLASS);
-			expect(span2ElementSub).toHaveClass(INTERESTED_SPAN_CLASS);
+			expect(span2Element).toHaveClass(INTERESTED_SPAN_CLASS);
 		});
 	});
 
@@ -429,6 +426,7 @@ describe('Span Click User Flows', () => {
 			{ initialRoute: '/trace' },
 		);
 
+		// Click on the actual span element (not the wrapper)
 		const spanOverview = screen.getByTestId(FIRST_SPAN_TEST_ID);
 		const spanElement = spanOverview.querySelector(
 			SPAN_OVERVIEW_CLASS,
@@ -440,6 +438,7 @@ describe('Span Click User Flows', () => {
 		expect(mockUrlQuery.get('anotherParam')).toBe('anotherValue');
 		expect(mockUrlQuery.get('spanId')).toBe('span-1');
 
+		// Verify navigation was called with all parameters
 		expect(mockSafeNavigate).toHaveBeenCalledWith({
 			search: expect.stringMatching(
 				/existingParam=existingValue.*anotherParam=anotherValue.*spanId=span-1/,

frontend/src/pages/TraceDetailsV3/components/FieldsSettings/AddedFields.tsx

@@ -15,13 +15,10 @@ import {
 } from '@dnd-kit/sortable';
 import { CSS } from '@dnd-kit/utilities';
 import { Button } from '@signozhq/ui/button';
-import cx from 'classnames';
 import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import { GripVertical } from '@signozhq/icons';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
-import styles from './FieldsSettings.module.scss';
-
 function SortableField({
 	field,
 	onRemove,
@@ -43,17 +40,14 @@ function SortableField({
 		<div
 			ref={setNodeRef}
 			style={style}
-			className={cx(
-				styles.fieldItem,
-				allowDrag ? styles.isDragEnabled : styles.isDragDisabled,
-			)}
+			className={`fs-field-item ${allowDrag ? 'drag-enabled' : 'drag-disabled'}`}
 		>
-			<div {...attributes} {...listeners} className={styles.dragHandle}>
+			<div {...attributes} {...listeners} className="drag-handle">
 				{allowDrag && <GripVertical size={14} />}
-				<span className={styles.fieldKey}>{field.key}</span>
+				<span className="fs-field-key">{field.key}</span>
 			</div>
 			<Button
-				className={cx(styles.removeBtn, 'periscope-btn')}
+				className="remove-field-btn periscope-btn"
 				variant="outlined"
 				color="destructive"
 				size="sm"
@@ -100,9 +94,9 @@ function AddedFields({
 	const allowDrag = inputValue.length === 0;
 
 	return (
-		<div className={cx(styles.section, styles.sectionAdded)}>
-			<div className={styles.sectionHeader}>ADDED FIELDS</div>
-			<div className={styles.addedList}>
+		<div className="fs-section fs-added">
+			<div className="fs-section-header">ADDED FIELDS</div>
+			<div className="fs-added-list">
 				<OverlayScrollbar>
 					<DndContext
 						sensors={sensors}
@@ -110,7 +104,7 @@ function AddedFields({
 						onDragEnd={handleDragEnd}
 					>
 						{filteredFields.length === 0 ? (
-							<div className={styles.noValues}>No values found</div>
+							<div className="fs-no-values">No values found</div>
 						) : (
 							<SortableContext
 								items={fields.map((f) => f.key)}

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

@@ -1,161 +0,0 @@
-.root {
-	display: flex;
-	flex-direction: column;
-	height: 100%;
-	background: var(--l1-background);
-	color: var(--l1-foreground);
-	overflow: hidden;
-}
-
-.header {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	padding: 10px 12px;
-	border-bottom: 1px solid var(--l1-border);
-}
-
-.title {
-	display: flex;
-	align-items: center;
-	gap: 10px;
-	font-size: 13px;
-	font-weight: 500;
-}
-
-.closeIcon {
-	cursor: pointer;
-	color: var(--l2-foreground);
-
-	&:hover {
-		color: var(--l1-foreground);
-	}
-}
-
-.searchInput {
-	background-color: var(--l1-background);
-	height: 40px;
-	border-radius: 0;
-	border-left: none;
-	border-right: none;
-}
-
-.section {
-	display: flex;
-	flex-direction: column;
-}
-
-.sectionAdded {
-	max-height: 40%;
-	border-bottom: 1px solid var(--l1-border);
-}
-
-.sectionOther {
-	flex: 1;
-	min-height: 0;
-}
-
-.sectionHeader {
-	color: var(--muted-foreground);
-	font-size: 11px;
-	font-weight: 500;
-	line-height: 18px;
-	letter-spacing: 0.88px;
-	text-transform: uppercase;
-	padding: 8px 12px;
-}
-
-.addedList {
-	overflow: hidden;
-}
-
-.otherList {
-	flex: 1;
-	min-height: 0;
-	overflow: hidden;
-
-	// Ant Skeleton.Input rendered inside the loading state — override its
-	// hard-coded width.
-	:global(.ant-skeleton-input) {
-		width: 300px;
-		margin: 8px 12px;
-	}
-}
-
-.noValues {
-	padding: 8px;
-	text-align: center;
-	color: var(--l2-foreground);
-	font-size: 12px;
-}
-
-.limitHint {
-	padding: 8px 12px;
-	text-align: center;
-	color: var(--muted-foreground);
-	font-size: 11px;
-}
-
-.fieldItem {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	padding: 6px 12px;
-	border-radius: 4px;
-	user-select: none;
-	font-size: 13px;
-
-	&:hover {
-		background-color: var(--l2-background);
-
-		.removeBtn,
-		.addBtn {
-			opacity: 1;
-		}
-	}
-}
-
-.dragHandle {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	flex-grow: 1;
-}
-
-.fieldKey {
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
-.isDragEnabled {
-	cursor: grab;
-
-	&:active {
-		cursor: grabbing;
-	}
-}
-
-.isDragDisabled {
-	padding: 6px 12px;
-}
-
-.otherFieldItem {
-	height: 32px;
-}
-
-.removeBtn,
-.addBtn {
-	padding: 4px 10px;
-	opacity: 0;
-	transition: opacity 0.15s ease-in-out;
-	flex-shrink: 0;
-}
-
-.footer {
-	display: flex;
-	gap: 12px;
-	padding: 12px;
-	border-top: 1px solid var(--l1-border);
-	justify-content: space-between;
-}

frontend/src/pages/TraceDetailsV3/components/FieldsSettings/FieldsSettings.styles.scss

@@ -0,0 +1,161 @@
+.fields-settings {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	background: var(--l1-background);
+	color: var(--l1-foreground);
+	overflow: hidden;
+
+	.fs-header {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 10px 12px;
+		border-bottom: 1px solid var(--l1-border);
+
+		.fs-title {
+			display: flex;
+			align-items: center;
+			gap: 10px;
+			font-size: 13px;
+			font-weight: 500;
+		}
+
+		.fs-close-icon {
+			cursor: pointer;
+			color: var(--l2-foreground);
+
+			&:hover {
+				color: var(--l1-foreground);
+			}
+		}
+	}
+
+	.fs-search {
+		.fs-search-input {
+			background-color: var(--l1-background);
+			height: 40px;
+			border-radius: 0;
+			border-left: none;
+			border-right: none;
+		}
+	}
+
+	.fs-section {
+		display: flex;
+		flex-direction: column;
+
+		&.fs-added {
+			max-height: 40%;
+			border-bottom: 1px solid var(--l1-border);
+		}
+
+		&.fs-other {
+			flex: 1;
+			min-height: 0;
+		}
+	}
+
+	.fs-section-header {
+		color: var(--muted-foreground);
+		font-size: 11px;
+		font-weight: 500;
+		line-height: 18px;
+		letter-spacing: 0.88px;
+		text-transform: uppercase;
+		padding: 8px 12px;
+	}
+
+	.fs-added-list {
+		overflow: hidden;
+	}
+
+	.fs-other-list {
+		flex: 1;
+		min-height: 0;
+		overflow: hidden;
+
+		.ant-skeleton-input {
+			width: 300px;
+			margin: 8px 12px;
+		}
+	}
+
+	.fs-no-values {
+		padding: 8px;
+		text-align: center;
+		color: var(--l2-foreground);
+		font-size: 12px;
+	}
+
+	.fs-limit-hint {
+		padding: 8px 12px;
+		text-align: center;
+		color: var(--muted-foreground);
+		font-size: 11px;
+	}
+}
+
+.fs-field-item {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 6px 12px;
+	border-radius: 4px;
+	user-select: none;
+	font-size: 13px;
+
+	.drag-handle {
+		display: flex;
+		align-items: center;
+		gap: 8px;
+		flex-grow: 1;
+	}
+
+	.fs-field-key {
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+
+	&.drag-enabled {
+		cursor: grab;
+
+		&:active {
+			cursor: grabbing;
+		}
+	}
+
+	&.drag-disabled {
+		padding: 6px 12px;
+	}
+
+	&.other-field-item {
+		height: 32px;
+	}
+
+	.remove-field-btn,
+	.add-field-btn {
+		padding: 4px 10px;
+		opacity: 0;
+		transition: opacity 0.15s ease-in-out;
+		flex-shrink: 0;
+	}
+
+	&:hover {
+		background-color: var(--l2-background);
+
+		.remove-field-btn,
+		.add-field-btn {
+			opacity: 1;
+		}
+	}
+}
+
+.fs-footer {
+	display: flex;
+	gap: 12px;
+	padding: 12px;
+	border-top: 1px solid var(--l1-border);
+	justify-content: space-between;
+}

frontend/src/pages/TraceDetailsV3/components/FieldsSettings/FieldsSettings.tsx

@@ -10,7 +10,7 @@ import { DataSource } from 'types/common/queryBuilder';
 import AddedFields from './AddedFields';
 import OtherFields from './OtherFields';
 
-import styles from './FieldsSettings.module.scss';
+import './FieldsSettings.styles.scss';
 
 const MAX_FIELDS_DEFAULT = 10;
 
@@ -89,18 +89,18 @@ function FieldsSettings({
 	const isAtLimit = draftFields.length >= maxFields;
 
 	return (
-		<div className={styles.root}>
-			<div className={styles.header}>
-				<div className={styles.title}>
+		<div className="fields-settings">
+			<div className="fs-header">
+				<div className="fs-title">
 					<TableColumnsSplit size={16} />
 					{title}
 				</div>
-				<X className={styles.closeIcon} size={16} onClick={onClose} />
+				<X className="fs-close-icon" size={16} onClick={onClose} />
 			</div>
 
-			<section>
+			<section className="fs-search">
 				<Input
-					className={styles.searchInput}
+					className="fs-search-input"
 					type="text"
 					value={inputValue}
 					placeholder="Search for a field..."
@@ -123,7 +123,7 @@ function FieldsSettings({
 			/>
 
 			{hasUnsavedChanges && (
-				<div className={styles.footer}>
+				<div className="fs-footer">
 					<Button
 						variant="outlined"
 						color="secondary"

frontend/src/pages/TraceDetailsV3/components/FieldsSettings/OtherFields.tsx

@@ -1,15 +1,12 @@
 import { useMemo } from 'react';
 import { Button } from '@signozhq/ui/button';
 import { Skeleton } from 'antd';
-import cx from 'classnames';
 import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import { useGetAggregateKeys } from 'hooks/queryBuilder/useGetAggregateKeys';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { DataSource } from 'types/common/queryBuilder';
 
-import styles from './FieldsSettings.module.scss';
-
 interface OtherFieldsProps {
 	dataSource: DataSource;
 	debouncedInputValue: string;
@@ -53,9 +50,9 @@ function OtherFields({
 
 	if (isFetching) {
 		return (
-			<div className={cx(styles.section, styles.sectionOther)}>
-				<div className={styles.sectionHeader}>OTHER FIELDS</div>
-				<div className={styles.otherList}>
+			<div className="fs-section fs-other">
+				<div className="fs-section-header">OTHER FIELDS</div>
+				<div className="fs-other-list">
 					{Array.from({ length: 5 }).map((_, i) => (
 						// eslint-disable-next-line react/no-array-index-key
 						<Skeleton.Input active size="small" key={i} />
@@ -66,23 +63,20 @@ function OtherFields({
 	}
 
 	return (
-		<div className={cx(styles.section, styles.sectionOther)}>
-			<div className={styles.sectionHeader}>OTHER FIELDS</div>
-			<div className={styles.otherList}>
+		<div className="fs-section fs-other">
+			<div className="fs-section-header">OTHER FIELDS</div>
+			<div className="fs-other-list">
 				<OverlayScrollbar>
 					<>
 						{otherFields.length === 0 ? (
-							<div className={styles.noValues}>No values found</div>
+							<div className="fs-no-values">No values found</div>
 						) : (
 							otherFields.map((attr) => (
-								<div
-									key={attr.key}
-									className={cx(styles.fieldItem, styles.otherFieldItem)}
-								>
-									<span className={styles.fieldKey}>{attr.key}</span>
+								<div key={attr.key} className="fs-field-item other-field-item">
+									<span className="fs-field-key">{attr.key}</span>
 									{!isAtLimit && (
 										<Button
-											className={cx(styles.addBtn, 'periscope-btn')}
+											className="add-field-btn periscope-btn"
 											variant="outlined"
 											color="secondary"
 											size="sm"
@@ -94,7 +88,7 @@ function OtherFields({
 								</div>
 							))
 						)}
-						{isAtLimit && <div className={styles.limitHint}>Maximum 10 fields</div>}
+						{isAtLimit && <div className="fs-limit-hint">Maximum 10 fields</div>}
 					</>
 				</OverlayScrollbar>
 			</div>

frontend/src/pages/TraceDetailsV3/index.tsx

@@ -32,9 +32,7 @@ import TraceWaterfall from './TraceWaterfall/TraceWaterfall';
 import { IInterestedSpan } from './TraceWaterfall/types';
 import { getAncestorSpanIds } from './TraceWaterfall/utils';
 
-import cx from 'classnames';
-
-import styles from './TraceDetailsV3.module.scss';
+import './TraceDetailsV3.styles.scss';
 
 function TraceDetailsV3(): JSX.Element {
 	const { id: traceId } = useParams<TraceDetailV3URLProps>();
@@ -287,7 +285,7 @@ function TraceDetailsV3(): JSX.Element {
 
 	return (
 		<TraceStoreSync aggregations={traceData?.payload?.aggregations}>
-			<div className={styles.root}>
+			<div className="trace-details-v3">
 				<TraceDetailsHeader
 					filterMetadata={filterMetadata}
 					onFilteredSpansChange={handleFilteredSpansChange}
@@ -299,20 +297,20 @@ function TraceDetailsV3(): JSX.Element {
 					<NoData />
 				) : (
 					<>
-						<div className={styles.content}>
+						<div className="trace-details-v3__content">
 							<Collapse
 								// @ts-expect-error motion is passed through to rc-collapse to disable animation
 								motion={false}
 								activeKey={activeKeys.filter((k) => k === 'flame')}
 								onChange={(): void => handleCollapseChange('flame')}
 								size="small"
-								className={styles.flameCollapse}
+								className="trace-details-v3__flame-collapse"
 								items={[
 									{
 										key: 'flame',
 										label: (
-											<div className={styles.collapseLabel}>
-												<span className={styles.collapseTitle}>
+											<div className="trace-details-v3__collapse-label">
+												<span className="trace-details-v3__collapse-title">
 													Flame Graph
 													{traceData?.payload?.totalSpansCount &&
 														traceData.payload.totalSpansCount > FLAMEGRAPH_SPAN_LIMIT && (
@@ -323,15 +321,17 @@ function TraceDetailsV3(): JSX.Element {
 														)}
 												</span>
 												{traceData?.payload?.totalSpansCount ? (
-													<span className={styles.collapseCount}>
-														<span className={styles.collapseCountItem}>
+													<span className="trace-details-v3__collapse-count">
+														<span className="trace-details-v3__collapse-count-item">
 															<ChartNoAxesGantt size={13} />
 															Spans: {traceData.payload.totalSpansCount}
 														</span>
 														<span
-															className={cx(styles.collapseCountItem, {
-																[styles.hasErrors]: traceData.payload.totalErrorSpansCount > 0,
-															})}
+															className={`trace-details-v3__collapse-count-item${
+																traceData.payload.totalErrorSpansCount > 0
+																	? ' trace-details-v3__collapse-count-errors'
+																	: ''
+															}`}
 														>
 															<TriangleAlert size={13} />
 															Errors: {traceData.payload.totalErrorSpansCount ?? 0}
@@ -360,9 +360,11 @@ function TraceDetailsV3(): JSX.Element {
 								activeKey={activeKeys.filter((k) => k === 'waterfall')}
 								onChange={(): void => handleCollapseChange('waterfall')}
 								size="small"
-								className={cx(styles.waterfallCollapse, {
-									[styles.isDocked]: isWaterfallDocked,
-								})}
+								className={`trace-details-v3__waterfall-collapse${
+									isWaterfallDocked
+										? ' trace-details-v3__waterfall-collapse--docked'
+										: ''
+								}`}
 								items={[
 									{
 										key: 'waterfall',
@@ -373,7 +375,7 @@ function TraceDetailsV3(): JSX.Element {
 							/>
 
 							{panelState.isOpen && isDocked && (
-								<div className={styles.dockedSpanDetails}>
+								<div className="trace-details-v3__docked-span-details">
 									<SpanDetailsPanel
 										panelState={panelState}
 										selectedSpan={selectedSpan}

pkg/modules/user/impluser/setter.go

@@ -874,22 +874,45 @@ func (module *setter) AddUserRole(ctx context.Context, orgID, userID valuer.UUID
 		return errors.NewInvalidInputf(errors.CodeInvalidInput, "role name not found: %s", roleName)
 	}
 
-	// grant via authz (additive, idempotent — OpenFGA uses OnDuplicate: "ignore")
-	if err := module.authz.Grant(
+	// check if user already has this role
+	existingUserRoles, err := module.getter.GetRolesByUserID(ctx, existingUser.ID)
+	if err != nil {
+		return err
+	}
+
+	existingRoles := make([]string, len(existingUserRoles))
+	for idx, role := range existingUserRoles {
+		existingRoles[idx] = role.Role.Name
+	}
+
+	// grant via authz (idempotent)
+	if err := module.authz.ModifyGrant(
 		ctx,
 		orgID,
+		existingRoles,
 		[]string{roleName},
 		authtypes.MustNewSubject(coretypes.NewResourceUser(), existingUser.ID.StringValue(), existingUser.OrgID, nil),
 	); err != nil {
 		return err
 	}
 
-	// create user_role entry (swallow AlreadyExists for idempotency — DB has unique constraint on user_id+role_id)
+	// create user_role entry
 	userRoles := authtypes.NewUserRoles(userID, foundRoles)
-	if err := module.userRoleStore.CreateUserRoles(ctx, userRoles); err != nil {
-		if !errors.Ast(err, errors.TypeAlreadyExists) {
+	err = module.store.RunInTx(ctx, func(ctx context.Context) error {
+		err = module.userRoleStore.DeleteUserRoles(ctx, existingUser.ID)
+		if err != nil {
 			return err
 		}
+
+		err := module.userRoleStore.CreateUserRoles(ctx, userRoles)
+		if err != nil {
+			return err
+		}
+
+		return nil
+	})
+	if err != nil {
+		return err
 	}
 
 	return module.tokenizer.DeleteIdentity(ctx, userID)

tests/conftest.py

@@ -27,6 +27,7 @@ pytest_plugins = [
     "fixtures.seeder",
     "fixtures.serviceaccount",
     "fixtures.role",
+    "fixtures.seed_golden_dataset",
 ]
 
 

tests/e2e/bootstrap/global.setup.ts

@@ -0,0 +1,13 @@
+import { expect, test as setup } from '@playwright/test';
+
+const seederUrl = process.env.SIGNOZ_E2E_SEEDER_URL ?? '';
+
+setup('refresh golden dataset', async ({ request }) => {
+	expect(seederUrl, 'SIGNOZ_E2E_SEEDER_URL not set').not.toBe('');
+	const response = await request.post(`${seederUrl}/seed/golden`, {
+		timeout: 120_000,
+	});
+	expect(response.ok()).toBeTruthy();
+	// eslint-disable-next-line no-console
+	console.log(`[setup] refreshed golden dataset: ${await response.text()}`);
+});

tests/e2e/bootstrap/global.teardown.ts

@@ -0,0 +1,13 @@
+import { expect, test as teardown } from '@playwright/test';
+
+const seederUrl = process.env.SIGNOZ_E2E_SEEDER_URL ?? '';
+
+teardown('clear seeded telemetry', async ({ request }) => {
+	expect(seederUrl, 'SIGNOZ_E2E_SEEDER_URL not set').not.toBe('');
+	for (const signal of ['metrics', 'traces', 'logs'] as const) {
+		const response = await request.delete(`${seederUrl}/telemetry/${signal}`, {
+			timeout: 60_000,
+		});
+		expect(response.ok()).toBeTruthy();
+	}
+});

tests/e2e/bootstrap/setup.py

@@ -2,6 +2,7 @@ import os
 from pathlib import Path
 
 import pytest
+import requests
 
 from fixtures import types
 from fixtures.auth import USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD
@@ -38,6 +39,13 @@ def test_teardown(
     signoz: types.SigNoz,  # pylint: disable=unused-argument
     create_user_admin: types.Operation,  # pylint: disable=unused-argument
     apply_license: types.Operation,  # pylint: disable=unused-argument
-    seeder: types.TestContainerDocker,  # pylint: disable=unused-argument
+    seeder: types.TestContainerDocker,
 ) -> None:
-    """Fixture dependencies trigger container teardown via --teardown."""
+    """Truncate seeded telemetry; containers come down via fixture
+    dependency under `--teardown`."""
+    base = seeder.host_configs["8080"].base().rstrip("/")
+    for signal in ("metrics", "traces", "logs"):
+        try:
+            requests.delete(f"{base}/telemetry/{signal}", timeout=30).raise_for_status()
+        except Exception as e:  # pylint: disable=broad-exception-caught
+            print(f"seeder DELETE /telemetry/{signal} failed: {e}")

tests/e2e/playwright.config.ts

@@ -50,12 +50,36 @@ export default defineConfig({
 		viewport: { width: 1280, height: 720 },
 	},
 
-	// Browser projects. No project-level auth — specs opt in via the
-	// authedPage fixture in tests/e2e/fixtures/auth.ts, which logs a user
-	// in on first use and caches the resulting storageState per worker.
+	// `setup` runs `bootstrap/global.setup.ts` once before any browser
+	// project — refreshes the golden dataset so chart-data assertions
+	// land inside default panel time windows. Per
+	// https://playwright.dev/docs/test-global-setup-teardown#option-1-project-dependencies.
 	projects: [
-		{ name: 'chromium', use: devices['Desktop Chrome'] },
-		{ name: 'firefox', use: devices['Desktop Firefox'] },
-		{ name: 'webkit', use: devices['Desktop Safari'] },
+		{
+			name: 'setup',
+			testDir: './bootstrap',
+			testMatch: /global\.setup\.ts/,
+			teardown: 'teardown',
+		},
+		{
+			name: 'teardown',
+			testDir: './bootstrap',
+			testMatch: /global\.teardown\.ts/,
+		},
+		{
+			name: 'chromium',
+			use: devices['Desktop Chrome'],
+			dependencies: ['setup'],
+		},
+		{
+			name: 'firefox',
+			use: devices['Desktop Firefox'],
+			dependencies: ['setup'],
+		},
+		{
+			name: 'webkit',
+			use: devices['Desktop Safari'],
+			dependencies: ['setup'],
+		},
 	],
 });

tests/e2e/tsconfig.json

@@ -18,6 +18,6 @@
     "outDir": "./dist",
     "rootDir": "."
   },
-  "include": ["tests/**/*.ts", "helpers/**/*.ts", "fixtures/**/*.ts", "playwright.config.ts"],
+  "include": ["tests/**/*.ts", "helpers/**/*.ts", "fixtures/**/*.ts", "bootstrap/**/*.ts", "playwright.config.ts"],
   "exclude": ["node_modules", "dist"]
 }

tests/e2e/yarn.lock

@@ -1,352 +0,0 @@
-# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
-# yarn lockfile v1
-
-
-"@oxfmt/binding-android-arm-eabi@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-android-arm-eabi/-/binding-android-arm-eabi-0.41.0.tgz#09438448ab9479730582cd00fb86e4c33795a364"
-  integrity sha512-REfrqeMKGkfMP+m/ScX4f5jJBSmVNYcpoDF8vP8f8eYPDuPGZmzp56NIUsYmx3h7f6NzC6cE3gqh8GDWrJHCKw==
-
-"@oxfmt/binding-android-arm64@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-android-arm64/-/binding-android-arm64-0.41.0.tgz#b01eef08ff2a6be90f5805fe28339ec0130a955c"
-  integrity sha512-s0b1dxNgb2KomspFV2LfogC2XtSJB42POXF4bMCLJyvQmAGos4ZtjGPfQreToQEaY0FQFjz3030ggI36rF1q5g==
-
-"@oxfmt/binding-darwin-arm64@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-darwin-arm64/-/binding-darwin-arm64-0.41.0.tgz#a2e24b7c52d40e3bb01939fa9c994d56923294ce"
-  integrity sha512-EGXGualADbv/ZmamE7/2DbsrYmjoPlAmHEpTL4vapLF4EfVD6fr8/uQDFnPJkUBjiSWFJZtFNsGeN1B6V3owmA==
-
-"@oxfmt/binding-darwin-x64@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-darwin-x64/-/binding-darwin-x64-0.41.0.tgz#c114c0a30195a65cfe0247e2ffd000416df4d4bc"
-  integrity sha512-WxySJEvdQQYMmyvISH3qDpTvoS0ebnIP63IMxLLWowJyPp/AAH0hdWtlo+iGNK5y3eVfa5jZguwNaQkDKWpGSw==
-
-"@oxfmt/binding-freebsd-x64@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-freebsd-x64/-/binding-freebsd-x64-0.41.0.tgz#a9057a31860ec79970a16b5a0a801a51fab99168"
-  integrity sha512-Y2kzMkv3U3oyuYaR4wTfGjOTYTXiFC/hXmG0yVASKkbh02BJkvD98Ij8bIevr45hNZ0DmZEgqiXF+9buD4yMYQ==
-
-"@oxfmt/binding-linux-arm-gnueabihf@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-0.41.0.tgz#1a2be3cbbf2d9e90808858ba8fc38b24023ac44c"
-  integrity sha512-ptazDjdUyhket01IjPTT6ULS1KFuBfTUU97osTP96X5y/0oso+AgAaJzuH81oP0+XXyrWIHbRzozSAuQm4p48g==
-
-"@oxfmt/binding-linux-arm-musleabihf@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-arm-musleabihf/-/binding-linux-arm-musleabihf-0.41.0.tgz#f0a12feca29bfaf7437d94c32919ff3ac60c213f"
-  integrity sha512-UkoL2OKxFD+56bPEBcdGn+4juTW4HRv/T6w1dIDLnvKKWr6DbarB/mtHXlADKlFiJubJz8pRkttOR7qjYR6lTA==
-
-"@oxfmt/binding-linux-arm64-gnu@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-0.41.0.tgz#b304c7ede72119f7fe7ce7861007c0ee6eb60c08"
-  integrity sha512-gofu0PuumSOHYczD8p62CPY4UF6ee+rSLZJdUXkpwxg6pILiwSDBIouPskjF/5nF3A7QZTz2O9KFNkNxxFN9tA==
-
-"@oxfmt/binding-linux-arm64-musl@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-arm64-musl/-/binding-linux-arm64-musl-0.41.0.tgz#295d6ce8d846ca1a287165bf4ff6e7b3cd51f823"
-  integrity sha512-VfVZxL0+6RU86T8F8vKiDBa+iHsr8PAjQmKGBzSCAX70b6x+UOMFl+2dNihmKmUwqkCazCPfYjt6SuAPOeQJ3g==
-
-"@oxfmt/binding-linux-ppc64-gnu@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-0.41.0.tgz#6c702f37bd69bb88bf78264eef5df9dbcdcada49"
-  integrity sha512-bwzokz2eGvdfJbc0i+zXMJ4BBjQPqg13jyWpEEZDOrBCQ91r8KeY2Mi2kUeuMTZNFXju+jcAbAbpyJxRGla0eg==
-
-"@oxfmt/binding-linux-riscv64-gnu@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-riscv64-gnu/-/binding-linux-riscv64-gnu-0.41.0.tgz#9dac4f7f4cf10d94ade5a109554f810a43525595"
-  integrity sha512-POLM//PCH9uqDeNDwWL3b3DkMmI3oI2cU6hwc2lnztD1o7dzrQs3R9nq555BZ6wI7t2lyhT9CS+CRaz5X0XqLA==
-
-"@oxfmt/binding-linux-riscv64-musl@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-riscv64-musl/-/binding-linux-riscv64-musl-0.41.0.tgz#ddd573ad4fc8e5d017ab27177eaabea700d68754"
-  integrity sha512-NNK7PzhFqLUwx/G12Xtm6scGv7UITvyGdAR5Y+TlqsG+essnuRWR4jRNODWRjzLZod0T3SayRbnkSIWMBov33w==
-
-"@oxfmt/binding-linux-s390x-gnu@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-0.41.0.tgz#3300ee81681382c1ec0a4013807c362c27ef4821"
-  integrity sha512-qVf/zDC5cN9eKe4qI/O/m445er1IRl6swsSl7jHkqmOSVfknwCe5JXitYjZca+V/cNJSU/xPlC5EFMabMMFDpw==
-
-"@oxfmt/binding-linux-x64-gnu@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-x64-gnu/-/binding-linux-x64-gnu-0.41.0.tgz#be9068d48bb521eea83ea6bea2b0e08b39d7638b"
-  integrity sha512-ojxYWu7vUb6ysYqVCPHuAPVZHAI40gfZ0PDtZAMwVmh2f0V8ExpPIKoAKr7/8sNbAXJBBpZhs2coypIo2jJX4w==
-
-"@oxfmt/binding-linux-x64-musl@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-linux-x64-musl/-/binding-linux-x64-musl-0.41.0.tgz#e0232abd879874823213b71016042d001a740acb"
-  integrity sha512-O2exZLBxoCMIv2vlvcbkdedazJPTdG0VSup+0QUCfYQtx751zCZNboX2ZUOiQ/gDTdhtXvSiot0h6GEGkOyalA==
-
-"@oxfmt/binding-openharmony-arm64@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-openharmony-arm64/-/binding-openharmony-arm64-0.41.0.tgz#3e5893cde8cae02494cbb5493de9c46613e77058"
-  integrity sha512-N+31/VoL+z+NNBt8viy3I4NaIdPbiYeOnB884LKqvXldaE2dRztdPv3q5ipfZYv0RwFp7JfqS4I27K/DSHCakg==
-
-"@oxfmt/binding-win32-arm64-msvc@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-0.41.0.tgz#31d8dfeeddc855dbecc9f45d11cd892635d2e42f"
-  integrity sha512-Z7NAtu/RN8kjCQ1y5oDD0nTAeRswh3GJ93qwcW51srmidP7XPBmZbLlwERu1W5veCevQJtPS9xmkpcDTYsGIwQ==
-
-"@oxfmt/binding-win32-ia32-msvc@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-0.41.0.tgz#873fb408a3e8952fae67763b225e4ea77356e926"
-  integrity sha512-uNxxP3l4bJ6VyzIeRqCmBU2Q0SkCFgIhvx9/9dJ9V8t/v+jP1IBsuaLwCXGR8JPHtkj4tFp+RHtUmU2ZYAUpMA==
-
-"@oxfmt/binding-win32-x64-msvc@0.41.0":
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/@oxfmt/binding-win32-x64-msvc/-/binding-win32-x64-msvc-0.41.0.tgz#0adf46bca6908c6b49c790e598f4972b6f4cd191"
-  integrity sha512-49ZSpbZ1noozyPapE8SUOSm3IN0Ze4b5nkO+4+7fq6oEYQQJFhE0saj5k/Gg4oewVPdjn0L3ZFeWk2Vehjcw7A==
-
-"@oxlint-tsgolint/darwin-arm64@0.20.0":
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/@oxlint-tsgolint/darwin-arm64/-/darwin-arm64-0.20.0.tgz#6d704883904fa6e5fc922a7cef882bad4c734a0b"
-  integrity sha512-KKQcIHZHMxqpHUA1VXIbOG6chNCFkUWbQy6M+AFVtPKkA/3xAeJkJ3njoV66bfzwPHRcWQO+kcj5XqtbkjakoA==
-
-"@oxlint-tsgolint/darwin-x64@0.20.0":
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/@oxlint-tsgolint/darwin-x64/-/darwin-x64-0.20.0.tgz#676d7a1cf82216d91e9bc143f676e7dbe59ce596"
-  integrity sha512-7HeVMuclGfG+NLZi2ybY0T4fMI7/XxO/208rJk+zEIloKkVnlh11Wd241JMGwgNFXn+MLJbOqOfojDb2Dt4L1g==
-
-"@oxlint-tsgolint/linux-arm64@0.20.0":
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/@oxlint-tsgolint/linux-arm64/-/linux-arm64-0.20.0.tgz#5a2e67cf18394b6b868301cf3d84c8b8be7ab6b9"
-  integrity sha512-zxhUwz+WSxE6oWlZLK2z2ps9yC6ebmgoYmjAl0Oa48+GqkZ56NVgo+wb8DURNv6xrggzHStQxqQxe3mK51HZag==
-
-"@oxlint-tsgolint/linux-x64@0.20.0":
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/@oxlint-tsgolint/linux-x64/-/linux-x64-0.20.0.tgz#68468ad9253668748736191b6a7af51ae737c0a4"
-  integrity sha512-/1l6FnahC9im8PK+Ekkx/V3yetO/PzZnJegE2FXcv/iXEhbeVxP/ouiTYcUQu9shT1FWJCSNti1VJHH+21Y1dg==
-
-"@oxlint-tsgolint/win32-arm64@0.20.0":
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/@oxlint-tsgolint/win32-arm64/-/win32-arm64-0.20.0.tgz#32a0eba60f0a88cd6d6d53cc03eb1b2e43ca0c50"
-  integrity sha512-oPZ5Yz8sVdo7P/5q+i3IKeix31eFZ55JAPa1+RGPoe9PoaYVsdMvR6Jvib6YtrqoJnFPlg3fjEjlEPL8VBKYJA==
-
-"@oxlint-tsgolint/win32-x64@0.20.0":
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/@oxlint-tsgolint/win32-x64/-/win32-x64-0.20.0.tgz#90d5582b1df2ae877b2c5d7620e3a55acf9cc45f"
-  integrity sha512-4stx8RHj3SP9vQyRF/yZbz5igtPvYMEUR8CUoha4BVNZihi39DpCR8qkU7lpjB5Ga1DRMo2pHaA4bdTOMaY4mw==
-
-"@oxlint/binding-android-arm-eabi@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-android-arm-eabi/-/binding-android-arm-eabi-1.61.0.tgz#c7a8fb22ac3084d6f4c873cdc9779f4f9e38b805"
-  integrity sha512-6eZBPgiigK5txqoVgRqxbaxiom4lM8AP8CyKPPvpzKnQ3iFRFOIDc+0AapF+qsUSwjOzr5SGk4SxQDpQhkSJMQ==
-
-"@oxlint/binding-android-arm64@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-android-arm64/-/binding-android-arm64-1.61.0.tgz#5fe7c707e12513ede292da015d13e93781771e9f"
-  integrity sha512-CkwLR69MUnyv5wjzebvbbtTSUwqLxM35CXE79bHqDIK+NtKmPEUpStTcLQRZMCo4MP0qRT6TXIQVpK0ZVScnMA==
-
-"@oxlint/binding-darwin-arm64@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-darwin-arm64/-/binding-darwin-arm64-1.61.0.tgz#1f58a4c592b76e293e5b9072cc0e4e7a5bef8191"
-  integrity sha512-8JbefTkbmvqkqWjmQrHke+MdpgT2UghhD/ktM4FOQSpGeCgbMToJEKdl9zwhr/YWTl92i4QI1KiTwVExpcUN8A==
-
-"@oxlint/binding-darwin-x64@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-darwin-x64/-/binding-darwin-x64-1.61.0.tgz#eade7425cc943c3146f3e0f0fb4d08d615ee78a9"
-  integrity sha512-uWpoxDT47hTnDLcdEh5jVbso8rlTTu5o0zuqa9J8E0JAKmIWn7kGFEIB03Pycn2hd2vKxybPGLhjURy/9We5FQ==
-
-"@oxlint/binding-freebsd-x64@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-freebsd-x64/-/binding-freebsd-x64-1.61.0.tgz#8d82382a07ce4895c91694a810dee7f39866951b"
-  integrity sha512-K/o4hEyW7flfMel0iBVznmMBt7VIMHGdjADocHKpK1DUF9erpWnJ+BSSWd2W0c8K3mPtpph+CuHzRU6CI3l9jQ==
-
-"@oxlint/binding-linux-arm-gnueabihf@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.61.0.tgz#df76a5700651cda73ca5578de7308f9479b7cb1b"
-  integrity sha512-P6040ZkcyweJ0Po9yEFqJCdvZnf3VNCGs1SIHgXDf8AAQNC6ID/heXQs9iSgo2FH7gKaKq32VWc59XZwL34C5Q==
-
-"@oxlint/binding-linux-arm-musleabihf@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-arm-musleabihf/-/binding-linux-arm-musleabihf-1.61.0.tgz#b198e5697cfb6cc55eff5ab5b9766732e143492d"
-  integrity sha512-bwxrGCzTZkuB+THv2TQ1aTkVEfv5oz8sl+0XZZCpoYzErJD8OhPQOTA0ENPd1zJz8QsVdSzSrS2umKtPq4/JXg==
-
-"@oxlint/binding-linux-arm64-gnu@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.61.0.tgz#a5cdae7ef9f9b79526ef764fb174bb362c3737ee"
-  integrity sha512-vkhb9/wKguMkLlrm3FoJW/Xmdv31GgYAE+x8lxxQ+7HeOxXUySI0q36a3NTVIuQUdLzxCI1zzMGsk1o37FOe3w==
-
-"@oxlint/binding-linux-arm64-musl@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.61.0.tgz#227f6d94a3c00140a88ea338436783bd9da6f4ae"
-  integrity sha512-bl1dQh8LnVqsj6oOQAcxwbuOmNJkwc4p6o//HTBZhNTzJy21TLDwAviMqUFNUxDHkPGpmdKTSN4tWTjLryP8xg==
-
-"@oxlint/binding-linux-ppc64-gnu@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.61.0.tgz#e504e6cd8691fe460b202599d4c962fc7ad98f94"
-  integrity sha512-QoOX6KB2IiEpyOj/HKqaxi+NQHPnOgNgnr22n9N4ANJCzXkUlj1UmeAbFb4PpqdlHIzvGDM5xZ0OKtcLq9RhiQ==
-
-"@oxlint/binding-linux-riscv64-gnu@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-riscv64-gnu/-/binding-linux-riscv64-gnu-1.61.0.tgz#efe70d9e570756fe19fb60d05a39dd58e9e0f32d"
-  integrity sha512-1TGcTerjY6p152wCof3oKElccq3xHljS/Mucp04gV/4ATpP6nO7YNnp7opEg6SHkv2a57/b4b8Ndm9znJ1/qAw==
-
-"@oxlint/binding-linux-riscv64-musl@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-riscv64-musl/-/binding-linux-riscv64-musl-1.61.0.tgz#f9c42095192f235b03a5d3d1f1fbfb45002d5a93"
-  integrity sha512-65wXEmZIrX2ADwC8i/qFL4EWLSbeuBpAm3suuX1vu4IQkKd+wLT/HU/BOl84kp91u2SxPkPDyQgu4yrqp8vwVA==
-
-"@oxlint/binding-linux-s390x-gnu@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.61.0.tgz#23773cd6f8087f98c54383caccb98808fab6cca0"
-  integrity sha512-TVvhgMvor7Qa6COeXxCJ7ENOM+lcAOGsQ0iUdPSCv2hxb9qSHLQ4XF1h50S6RE1gBOJ0WV3rNukg4JJJP1LWRA==
-
-"@oxlint/binding-linux-x64-gnu@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.61.0.tgz#f46b036cf74b382c03f6a00e18cd1ae53096517f"
-  integrity sha512-SjpS5uYuFoDnDdZPwZE59ndF95AsY47R5MliuneTWR1pDm2CxGJaYXbKULI71t5TVfLQUWmrHEGRL9xvuq6dnA==
-
-"@oxlint/binding-linux-x64-musl@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-linux-x64-musl/-/binding-linux-x64-musl-1.61.0.tgz#cff6c4c24de0863cecbce1c1f43adcafacd9011d"
-  integrity sha512-gGfAeGD4sNJGILZbc/yKcIimO9wQnPMoYp9swAaKeEtwsSQAbU+rsdQze5SBtIP6j0QDzeYd4XSSUCRCF+LIeQ==
-
-"@oxlint/binding-openharmony-arm64@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-openharmony-arm64/-/binding-openharmony-arm64-1.61.0.tgz#9fdd87fc10c2c51c510470f7c4136ab2df9ee7b3"
-  integrity sha512-OlVT0LrG/ct33EVtWRyR+B/othwmDWeRxfi13wUdPeb3lAT5TgTcFDcfLfarZtzB4W1nWF/zICMgYdkggX2WmQ==
-
-"@oxlint/binding-win32-arm64-msvc@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.61.0.tgz#25a87f62859a6703f2520d665f98f6c0f88a70e0"
-  integrity sha512-vI//NZPJk6DToiovPtaiwD4iQ7kO1r5ReWQD0sOOyKRtP3E2f6jxin4uvwi3OvDzHA2EFfd7DcZl5dtkQh7g1w==
-
-"@oxlint/binding-win32-ia32-msvc@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-win32-ia32-msvc/-/binding-win32-ia32-msvc-1.61.0.tgz#06f7df42b074f28ef27540d38be69875e5d5afcb"
-  integrity sha512-0ySj4/4zd2XjePs3XAQq7IigIstN4LPQZgCyigX5/ERMLjdWAJfnxcTsrtxZxuij8guJW8foXuHmhGxW0H4dDA==
-
-"@oxlint/binding-win32-x64-msvc@1.61.0":
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/@oxlint/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.61.0.tgz#7bc84b261bb8b515ade20f1044547cc8bbee44ce"
-  integrity sha512-0xgSiyeqDLDZxXoe9CVJrOx3TUVsfyoOY7cNi03JbItNcC9WCZqrSNdrAbHONxhSPaVh/lzfnDcON1RqSUMhHw==
-
-"@playwright/test@^1.57.0-alpha-2025-10-09":
-  version "1.57.0-alpha-2025-10-11"
-  resolved "https://registry.yarnpkg.com/@playwright/test/-/test-1.57.0-alpha-2025-10-11.tgz#75f6fac2f98fcff6e4bae1c907b48ad0b1a33bea"
-  integrity sha512-xqp2RNcLCPSUAYCrP3+rYZ4LFlESvWqjjpFegjNbun7wLcGvUt9Mh+RHBvgeZAhMxxuVde78XO9Y888UYFH9ew==
-  dependencies:
-    playwright "1.57.0-alpha-2025-10-11"
-
-"@types/node@^20.0.0":
-  version "20.19.20"
-  resolved "https://registry.yarnpkg.com/@types/node/-/node-20.19.20.tgz#116f5432a1e6383415a57cf5e00b5ac9b2a2ad03"
-  integrity sha512-2Q7WS25j4pS1cS8yw3d6buNCVJukOTeQ39bAnwR6sOJbaxvyCGebzTMypDFN82CxBLnl+lSWVdCCWbRY6y9yZQ==
-  dependencies:
-    undici-types "~6.21.0"
-
-dotenv@^16.0.0:
-  version "16.6.1"
-  resolved "https://registry.yarnpkg.com/dotenv/-/dotenv-16.6.1.tgz#773f0e69527a8315c7285d5ee73c4459d20a8020"
-  integrity sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow==
-
-eslint-plugin-playwright@^2.10.2:
-  version "2.10.2"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-playwright/-/eslint-plugin-playwright-2.10.2.tgz#1f0bef35c0b9f996a6987a401e6d4e6a3a015861"
-  integrity sha512-0N+2OWc3NZbOZ0gK8mp2TK6Qu3UWcJTQ9rqU0UM2yRJXgT758pvpY0lsOLIySfbyFrLqn3TcXjixbmcK90VnuQ==
-  dependencies:
-    globals "^17.3.0"
-
-fsevents@2.3.2:
-  version "2.3.2"
-  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
-  integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
-
-globals@^17.3.0:
-  version "17.5.0"
-  resolved "https://registry.yarnpkg.com/globals/-/globals-17.5.0.tgz#a82c641d898f8dfbe0e81f66fdff7d0de43f88c6"
-  integrity sha512-qoV+HK2yFl/366t2/Cb3+xxPUo5BuMynomoDmiaZBIdbs+0pYbjfZU+twLhGKp4uCZ/+NbtpVepH5bGCxRyy2g==
-
-oxfmt@^0.41.0:
-  version "0.41.0"
-  resolved "https://registry.yarnpkg.com/oxfmt/-/oxfmt-0.41.0.tgz#7dbfb63d19704a85412f36678c3ace092ce88673"
-  integrity sha512-sKLdJZdQ3bw6x9qKiT7+eID4MNEXlDHf5ZacfIircrq6Qwjk0L6t2/JQlZZrVHTXJawK3KaMuBoJnEJPcqCEdg==
-  dependencies:
-    tinypool "2.1.0"
-  optionalDependencies:
-    "@oxfmt/binding-android-arm-eabi" "0.41.0"
-    "@oxfmt/binding-android-arm64" "0.41.0"
-    "@oxfmt/binding-darwin-arm64" "0.41.0"
-    "@oxfmt/binding-darwin-x64" "0.41.0"
-    "@oxfmt/binding-freebsd-x64" "0.41.0"
-    "@oxfmt/binding-linux-arm-gnueabihf" "0.41.0"
-    "@oxfmt/binding-linux-arm-musleabihf" "0.41.0"
-    "@oxfmt/binding-linux-arm64-gnu" "0.41.0"
-    "@oxfmt/binding-linux-arm64-musl" "0.41.0"
-    "@oxfmt/binding-linux-ppc64-gnu" "0.41.0"
-    "@oxfmt/binding-linux-riscv64-gnu" "0.41.0"
-    "@oxfmt/binding-linux-riscv64-musl" "0.41.0"
-    "@oxfmt/binding-linux-s390x-gnu" "0.41.0"
-    "@oxfmt/binding-linux-x64-gnu" "0.41.0"
-    "@oxfmt/binding-linux-x64-musl" "0.41.0"
-    "@oxfmt/binding-openharmony-arm64" "0.41.0"
-    "@oxfmt/binding-win32-arm64-msvc" "0.41.0"
-    "@oxfmt/binding-win32-ia32-msvc" "0.41.0"
-    "@oxfmt/binding-win32-x64-msvc" "0.41.0"
-
-oxlint-tsgolint@^0.20.0:
-  version "0.20.0"
-  resolved "https://registry.yarnpkg.com/oxlint-tsgolint/-/oxlint-tsgolint-0.20.0.tgz#e011319219faa572faf340c40d65708404b37e10"
-  integrity sha512-/Uc9TQyN1l8w9QNvXtVHYtz+SzDJHKpb5X0UnHodl0BVzijUPk0LPlDOHAvogd1UI+iy9ZSF6gQxEqfzUxCULQ==
-  optionalDependencies:
-    "@oxlint-tsgolint/darwin-arm64" "0.20.0"
-    "@oxlint-tsgolint/darwin-x64" "0.20.0"
-    "@oxlint-tsgolint/linux-arm64" "0.20.0"
-    "@oxlint-tsgolint/linux-x64" "0.20.0"
-    "@oxlint-tsgolint/win32-arm64" "0.20.0"
-    "@oxlint-tsgolint/win32-x64" "0.20.0"
-
-oxlint@^1.59.0:
-  version "1.61.0"
-  resolved "https://registry.yarnpkg.com/oxlint/-/oxlint-1.61.0.tgz#e714742cfe7b815713feb14600b0ffe963d539a4"
-  integrity sha512-ZC0ALuhDZ6ivOFG+sy0D0pEDN49EvsId98zVlmYdkcXHsEM14m/qTNUEsUpiFiCVbpIxYtVBmmLE87nsbUHohQ==
-  optionalDependencies:
-    "@oxlint/binding-android-arm-eabi" "1.61.0"
-    "@oxlint/binding-android-arm64" "1.61.0"
-    "@oxlint/binding-darwin-arm64" "1.61.0"
-    "@oxlint/binding-darwin-x64" "1.61.0"
-    "@oxlint/binding-freebsd-x64" "1.61.0"
-    "@oxlint/binding-linux-arm-gnueabihf" "1.61.0"
-    "@oxlint/binding-linux-arm-musleabihf" "1.61.0"
-    "@oxlint/binding-linux-arm64-gnu" "1.61.0"
-    "@oxlint/binding-linux-arm64-musl" "1.61.0"
-    "@oxlint/binding-linux-ppc64-gnu" "1.61.0"
-    "@oxlint/binding-linux-riscv64-gnu" "1.61.0"
-    "@oxlint/binding-linux-riscv64-musl" "1.61.0"
-    "@oxlint/binding-linux-s390x-gnu" "1.61.0"
-    "@oxlint/binding-linux-x64-gnu" "1.61.0"
-    "@oxlint/binding-linux-x64-musl" "1.61.0"
-    "@oxlint/binding-openharmony-arm64" "1.61.0"
-    "@oxlint/binding-win32-arm64-msvc" "1.61.0"
-    "@oxlint/binding-win32-ia32-msvc" "1.61.0"
-    "@oxlint/binding-win32-x64-msvc" "1.61.0"
-
-playwright-core@1.57.0-alpha-2025-10-11:
-  version "1.57.0-alpha-2025-10-11"
-  resolved "https://registry.yarnpkg.com/playwright-core/-/playwright-core-1.57.0-alpha-2025-10-11.tgz#b444b75542a43bc354e512d076344d9258997e9c"
-  integrity sha512-X6KAunryZlslAdEdlN5gIIP3sFU6Uot3vzLoGCZ9SNv0JvXd6e2g7ArjnpOQld36yKszq8J+wQJRlIvdXkIvRw==
-
-playwright@1.57.0-alpha-2025-10-11:
-  version "1.57.0-alpha-2025-10-11"
-  resolved "https://registry.yarnpkg.com/playwright/-/playwright-1.57.0-alpha-2025-10-11.tgz#af67a28d64b39fe57eea454b2b312e98bfff02a5"
-  integrity sha512-a80kAd59up/kURcKE7THLzx3lN6a1G9RhsgP9ZfLGL7WtnOhOdRLxbHwmjWUG11ybEDeYNpj1qwT02MT4R+rew==
-  dependencies:
-    playwright-core "1.57.0-alpha-2025-10-11"
-  optionalDependencies:
-    fsevents "2.3.2"
-
-tinypool@2.1.0:
-  version "2.1.0"
-  resolved "https://registry.yarnpkg.com/tinypool/-/tinypool-2.1.0.tgz#303a671d6ef68d03c9512cdc9a47c86b8a85f20c"
-  integrity sha512-Pugqs6M0m7Lv1I7FtxN4aoyToKg1C4tu+/381vH35y8oENM/Ai7f7C4StcoK4/+BSw9ebcS8jRiVrORFKCALLw==
-
-typescript@^5.0.0:
-  version "5.9.3"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-5.9.3.tgz#5b4f59e15310ab17a216f5d6cf53ee476ede670f"
-  integrity sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==
-
-undici-types@~6.21.0:
-  version "6.21.0"
-  resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.21.0.tgz#691d00af3909be93a7faa13be61b3a5b50ef12cb"
-  integrity sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==

tests/fixtures/seed_golden_dataset.py

@@ -0,0 +1,389 @@
+"""Golden dataset fixture — seeds OTel-demo-shaped metrics, traces, and
+logs into ClickHouse via the seeder on every test_setup invocation.
+
+Timestamps are rebased to `now` so panels with default time windows
+always find data. To refresh the dataset shape on disk, run
+`uv run python -m fixtures.seed_golden_dataset regenerate`.
+"""
+
+from __future__ import annotations
+
+import datetime
+import json
+import logging
+import os
+import random
+from collections.abc import Iterator
+from pathlib import Path
+
+import pytest
+import requests
+
+from fixtures import types
+
+logger = logging.getLogger(__name__)
+
+_GOLDEN_DIR = Path(__file__).resolve().parent.parent / "seeder" / "golden"
+METRICS_PATH = _GOLDEN_DIR / "otel-demo-metrics-golden.jsonl"
+TRACES_PATH = _GOLDEN_DIR / "otel-demo-traces-golden.jsonl"
+LOGS_PATH = _GOLDEN_DIR / "otel-demo-logs-golden.jsonl"
+
+
+# ─── Generator ───────────────────────────────────────────────────────────
+
+_SERVICES = [
+    "adservice",
+    "cartservice",
+    "checkoutservice",
+    "currencyservice",
+    "frontend",
+    "paymentservice",
+    "productcatalogservice",
+    "shippingservice",
+]
+_OPERATIONS = {
+    "adservice": ["/ads/get", "/ads/list"],
+    "cartservice": ["/cart/add", "/cart/get", "/cart/empty"],
+    "checkoutservice": ["/checkout"],
+    "currencyservice": ["/currency/convert"],
+    "frontend": ["/", "/product", "/checkout"],
+    "paymentservice": ["/payment/charge"],
+    "productcatalogservice": ["/products/list", "/products/get"],
+    "shippingservice": ["/shipping/quote", "/shipping/ship"],
+}
+_DB_SERVICES = {"cartservice", "productcatalogservice"}
+_ENV = "production"
+_BUCKET_MINUTES = 5
+_WINDOW_HOURS = 6
+
+
+def _generate_metrics() -> list[dict]:
+    rng = random.Random(20260511)
+    samples: list[dict] = []
+    n_buckets = (_WINDOW_HOURS * 60) // _BUCKET_MINUTES
+    base_counter = 1000
+
+    for service in _SERVICES:
+        for operation in _OPERATIONS[service]:
+            for status in ("STATUS_CODE_OK", "STATUS_CODE_ERROR"):
+                weight = 9 if status == "STATUS_CODE_OK" else 1
+                counter = base_counter
+                latency_sum = 0
+                for i in range(n_buckets):
+                    minutes_ago = (_WINDOW_HOURS * 60) - (i + 1) * _BUCKET_MINUTES
+                    bucket_calls = int(
+                        weight
+                        * (50 + 20 * (1 + i % 12 / 12.0) + rng.randint(0, 10))
+                    )
+                    counter += bucket_calls
+                    latency_sum += bucket_calls * rng.randint(100_000, 500_000)
+                    resource_attrs = {
+                        "service.name": service,
+                        "deployment.environment": _ENV,
+                        "k8s.namespace.name": f"signoz-{service}",
+                    }
+                    point_attrs = {
+                        "operation": operation,
+                        "status_code": status,
+                        "span_kind": "SPAN_KIND_SERVER",
+                    }
+                    for name, value in (
+                        ("signoz_calls_total", counter),
+                        ("signoz_latency_count", counter),
+                        ("signoz_latency_sum", latency_sum),
+                    ):
+                        samples.append(
+                            {
+                                "metric_name": name,
+                                "minutes_ago": minutes_ago,
+                                "value": value,
+                                "resource_attributes": resource_attrs,
+                                "attributes": point_attrs,
+                                "is_monotonic": True,
+                            }
+                        )
+        if service in _DB_SERVICES:
+            db_counter = 0
+            for i in range(n_buckets):
+                minutes_ago = (_WINDOW_HOURS * 60) - (i + 1) * _BUCKET_MINUTES
+                db_counter += 20 + rng.randint(0, 15)
+                samples.append(
+                    {
+                        "metric_name": "signoz_db_latency_count",
+                        "minutes_ago": minutes_ago,
+                        "value": db_counter,
+                        "resource_attributes": {
+                            "service.name": service,
+                            "deployment.environment": _ENV,
+                            "k8s.namespace.name": f"signoz-{service}",
+                        },
+                        "attributes": {
+                            "db.system": "postgresql"
+                            if service == "cartservice"
+                            else "mongodb",
+                        },
+                        "is_monotonic": True,
+                    }
+                )
+    return samples
+
+
+def _generate_traces() -> list[dict]:
+    rng = random.Random(20260512)
+    samples: list[dict] = []
+    n_buckets = 12
+    for service in _SERVICES:
+        for operation in _OPERATIONS[service]:
+            for i in range(n_buckets):
+                minutes_ago = int(
+                    (_WINDOW_HOURS * 60) - i * (_WINDOW_HOURS * 60 / n_buckets)
+                )
+                http_status = "500" if rng.random() < 0.05 else "200"
+                samples.append(
+                    {
+                        "name": f"{service} {operation}",
+                        "kind": "SERVER",
+                        "minutes_ago": minutes_ago,
+                        "duration_ms": rng.randint(50, 500),
+                        "status": "ERROR" if http_status == "500" else "OK",
+                        "resource_attributes": {
+                            "service.name": service,
+                            "deployment.environment": _ENV,
+                            "k8s.namespace.name": f"signoz-{service}",
+                        },
+                        "attributes": {
+                            "http.method": "GET"
+                            if "get" in operation.lower() or operation == "/"
+                            else "POST",
+                            "http.route": operation,
+                            "http.status_code": http_status,
+                        },
+                    }
+                )
+    return samples
+
+
+_LOG_SEVERITIES = [("INFO", 0.85), ("WARN", 0.10), ("ERROR", 0.05)]
+_LOG_BODIES = {
+    "INFO": ["Handled request", "Cache hit", "Connection established"],
+    "WARN": ["Slow response detected", "Cache miss", "Retrying upstream call"],
+    "ERROR": ["Upstream call failed", "Database query timed out", "Auth failed"],
+}
+
+
+def _generate_logs() -> list[dict]:
+    rng = random.Random(20260512)
+    samples: list[dict] = []
+    n_buckets = 24
+    for service in _SERVICES:
+        for i in range(n_buckets):
+            minutes_ago = int(
+                (_WINDOW_HOURS * 60) - i * (_WINDOW_HOURS * 60 / n_buckets)
+            )
+            r = rng.random()
+            cumulative = 0.0
+            severity = "INFO"
+            for name, weight in _LOG_SEVERITIES:
+                cumulative += weight
+                if r < cumulative:
+                    severity = name
+                    break
+            samples.append(
+                {
+                    "body": f"[{service}] {rng.choice(_LOG_BODIES[severity])}",
+                    "severity": severity,
+                    "minutes_ago": minutes_ago,
+                    "resource_attributes": {
+                        "service.name": service,
+                        "deployment.environment": _ENV,
+                        "k8s.namespace.name": f"signoz-{service}",
+                    },
+                    "attributes": {"logger.name": f"{service}.app"},
+                }
+            )
+    return samples
+
+
+def _write_jsonl(path: Path, samples: list[dict]) -> None:
+    path.parent.mkdir(parents=True, exist_ok=True)
+    with path.open("w") as f:
+        for s in samples:
+            f.write(json.dumps(s, separators=(",", ":")))
+            f.write("\n")
+
+
+def regenerate() -> dict[str, int]:
+    metrics = _generate_metrics()
+    traces = _generate_traces()
+    logs = _generate_logs()
+    _write_jsonl(METRICS_PATH, metrics)
+    _write_jsonl(TRACES_PATH, traces)
+    _write_jsonl(LOGS_PATH, logs)
+    return {"metrics": len(metrics), "traces": len(traces), "logs": len(logs)}
+
+
+# ─── Loader ──────────────────────────────────────────────────────────────
+
+
+_KIND_TO_INT = {
+    "UNSPECIFIED": 0,
+    "INTERNAL": 1,
+    "SERVER": 2,
+    "CLIENT": 3,
+    "PRODUCER": 4,
+    "CONSUMER": 5,
+}
+_STATUS_TO_INT = {"UNSET": 0, "OK": 1, "ERROR": 2}
+
+
+def _read_jsonl(path: Path) -> Iterator[dict]:
+    with path.open() as f:
+        for line in f:
+            line = line.strip()
+            if line:
+                yield json.loads(line)
+
+
+def _iso_minus_minutes(now: datetime.datetime, minutes: float) -> str:
+    ts = now - datetime.timedelta(minutes=minutes)
+    return (
+        ts.replace(tzinfo=datetime.timezone.utc)
+        .isoformat()
+        .replace("+00:00", "Z")
+    )
+
+
+def _rebased_metric(sample: dict, now: datetime.datetime) -> dict:
+    out = {k: v for k, v in sample.items() if k != "minutes_ago"}
+    out["timestamp"] = _iso_minus_minutes(now, sample["minutes_ago"])
+    return out
+
+
+def _rebased_trace(sample: dict, now: datetime.datetime) -> dict:
+    return {
+        "timestamp": _iso_minus_minutes(now, sample["minutes_ago"]),
+        "duration": f"PT{sample['duration_ms'] / 1000:.3f}S",
+        "trace_id": sample.get("trace_id") or os.urandom(16).hex(),
+        "span_id": sample.get("span_id") or os.urandom(8).hex(),
+        "name": sample["name"],
+        "kind": _KIND_TO_INT.get(str(sample.get("kind", "SERVER")).upper(), 2),
+        "status_code": _STATUS_TO_INT.get(
+            str(sample.get("status", "UNSET")).upper(), 0
+        ),
+        "resources": sample.get("resource_attributes", {}),
+        "attributes": sample.get("attributes", {}),
+    }
+
+
+def _rebased_log(sample: dict, now: datetime.datetime) -> dict:
+    return {
+        "timestamp": _iso_minus_minutes(now, sample["minutes_ago"]),
+        "body": sample["body"],
+        "severity_text": str(sample.get("severity", "INFO")).upper(),
+        "resources": sample.get("resource_attributes", {}),
+        "attributes": sample.get("attributes", {}),
+    }
+
+
+def _post_batches(
+    url: str, rows: Iterator[dict], batch_size: int, timeout: int
+) -> int:
+    batch: list[dict] = []
+    total = 0
+    for row in rows:
+        batch.append(row)
+        if len(batch) >= batch_size:
+            response = requests.post(url, json=batch, timeout=timeout)
+            response.raise_for_status()
+            total += len(batch)
+            batch = []
+    if batch:
+        response = requests.post(url, json=batch, timeout=timeout)
+        response.raise_for_status()
+        total += len(batch)
+    return total
+
+
+def seed(
+    seeder_base_url: str,
+    *,
+    batch_size: int = 500,
+    timeout: int = 60,
+    clear_first: bool = True,
+) -> dict[str, int]:
+    """Wipe each signal table (via DELETE /telemetry/<signal>) and replay
+    the golden dataset with timestamps rebased to `now`. Each call leaves
+    the stack in the exact state the JSONL files describe — chart-data
+    assertions are reproducible across sessions regardless of how many
+    earlier sessions seeded."""
+    for path in (METRICS_PATH, TRACES_PATH, LOGS_PATH):
+        if not path.exists():
+            raise FileNotFoundError(
+                f"golden dataset missing at {path} — run "
+                "`uv run python -m fixtures.seed_golden_dataset regenerate`"
+            )
+
+    now = datetime.datetime.now(datetime.timezone.utc).replace(
+        microsecond=0, tzinfo=None
+    )
+    base = seeder_base_url.rstrip("/")
+    if clear_first:
+        for signal in ("metrics", "traces", "logs"):
+            requests.delete(f"{base}/telemetry/{signal}", timeout=timeout).raise_for_status()
+    counts = {
+        "metrics": _post_batches(
+            base + "/telemetry/metrics",
+            (_rebased_metric(s, now) for s in _read_jsonl(METRICS_PATH)),
+            batch_size,
+            timeout,
+        ),
+        "traces": _post_batches(
+            base + "/telemetry/traces",
+            (_rebased_trace(s, now) for s in _read_jsonl(TRACES_PATH)),
+            batch_size,
+            timeout,
+        ),
+        "logs": _post_batches(
+            base + "/telemetry/logs",
+            (_rebased_log(s, now) for s in _read_jsonl(LOGS_PATH)),
+            batch_size,
+            timeout,
+        ),
+    }
+    logger.info("seeded through %s: %s", base, counts)
+    return counts
+
+
+# ─── Fixture ─────────────────────────────────────────────────────────────
+
+
+@pytest.fixture(name="golden_dataset", scope="package")
+def golden_dataset(seeder: types.TestContainerDocker) -> dict[str, int]:
+    """Seed metrics + traces + logs into the running stack via the
+    seeder. Runs unconditionally on every test_setup invocation so the
+    rebased timestamps always anchor against `now`."""
+    return seed(seeder.host_configs["8080"].base())
+
+
+if __name__ == "__main__":
+    import sys
+
+    logging.basicConfig(level=logging.INFO)
+    if len(sys.argv) < 2:
+        sys.stderr.write(
+            "usage: seed_golden_dataset.py seed <seeder-base-url> | regenerate\n"
+        )
+        sys.exit(2)
+    cmd = sys.argv[1]
+    if cmd == "regenerate":
+        print(f"wrote {regenerate()}")
+    elif cmd == "seed":
+        if len(sys.argv) != 3:
+            sys.stderr.write(
+                "usage: seed_golden_dataset.py seed <seeder-base-url>\n"
+            )
+            sys.exit(2)
+        print(f"seeded {seed(sys.argv[2])}")
+    else:
+        sys.stderr.write(f"unknown command: {cmd}\n")
+        sys.exit(2)

tests/integration/tests/passwordauthn/04_role.py

@@ -129,11 +129,11 @@ def test_get_user_roles(
         assert "type" in role
 
 
-def test_assign_role_is_additive(
+def test_assign_role_replaces_previous(
     signoz: types.SigNoz,
     get_token: Callable[[str, str], str],
 ):
-    """Verify POST /api/v2/users/{id}/roles ADDS a role alongside existing ones and is idempotent."""
+    """Verify POST /api/v2/users/{id}/roles replaces existing role."""
     admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
     response = requests.get(
         signoz.self.host_configs["8080"].get("/api/v2/users/me"),
@@ -144,8 +144,6 @@ def test_assign_role_is_additive(
     me = response.json()["data"]
     user_id = me["id"]
 
-    # User currently has signoz-admin from test_change_role.
-    # Assign signoz-editor — should be additive, admin stays.
     response = requests.post(
         signoz.self.host_configs["8080"].get(f"/api/v2/users/{user_id}/roles"),
         json={"name": "signoz-editor"},
@@ -162,29 +160,8 @@ def test_assign_role_is_additive(
     assert response.status_code == HTTPStatus.OK
     roles = response.json()["data"]
     names = {r["name"] for r in roles}
-    assert len(names) == 2
     assert "signoz-editor" in names
-    assert "signoz-admin" in names
-
-    # Idempotency: assigning the same role again succeeds without duplicates
-    response = requests.post(
-        signoz.self.host_configs["8080"].get(f"/api/v2/users/{user_id}/roles"),
-        json={"name": "signoz-editor"},
-        headers={"Authorization": f"Bearer {admin_token}"},
-        timeout=5,
-    )
-    assert response.status_code == HTTPStatus.OK
-
-    response = requests.get(
-        signoz.self.host_configs["8080"].get(f"/api/v2/users/{user_id}/roles"),
-        headers={"Authorization": f"Bearer {admin_token}"},
-        timeout=5,
-    )
-    assert response.status_code == HTTPStatus.OK
-    roles = response.json()["data"]
-    editor_count = sum(1 for r in roles if r["name"] == "signoz-editor")
-    assert editor_count == 1
-    assert len(roles) == 2
+    assert "signoz-admin" not in names
 
 
 def test_get_users_by_role(
@@ -225,7 +202,7 @@ def test_remove_role(
     signoz: types.SigNoz,
     get_token: Callable[[str, str], str],
 ):
-    """Verify DELETE /api/v2/users/{id}/roles/{roleId} removes only the specified role."""
+    """Verify DELETE /api/v2/users/{id}/roles/{roleId} removes the role."""
     admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
     response = requests.get(
         signoz.self.host_configs["8080"].get("/api/v2/users/me"),
@@ -260,10 +237,7 @@ def test_remove_role(
     )
     assert response.status_code == HTTPStatus.OK
     roles_after = response.json()["data"]
-    names_after = {r["name"] for r in roles_after}
-    assert len(roles_after) == 1
-    assert "signoz-editor" not in names_after
-    assert "signoz-admin" in names_after
+    assert len(roles_after) == 0
 
 
 def test_user_with_roles_reflects_change(
@@ -288,8 +262,7 @@ def test_user_with_roles_reflects_change(
     assert response.status_code == HTTPStatus.OK
     data = response.json()["data"]
     role_names = {ur["role"]["name"] for ur in data["userRoles"]}
-    assert len(role_names) == 1
-    assert "signoz-admin" in role_names
+    assert len(role_names) == 0
 
 
 def test_admin_cannot_assign_role_to_self(

tests/seeder/golden/otel-demo-logs-golden.jsonl

@@ -0,0 +1,192 @@
+{"body":"[adservice] Connection established","severity":"INFO","minutes_ago":360,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Connection established","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Background job completed","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Cache hit","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Background job completed","severity":"INFO","minutes_ago":300,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Cache hit","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Database query timed out","severity":"ERROR","minutes_ago":270,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Cache hit","severity":"INFO","minutes_ago":255,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Slow response detected","severity":"WARN","minutes_ago":240,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Cache hit","severity":"INFO","minutes_ago":225,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Connection established","severity":"INFO","minutes_ago":210,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Handled request","severity":"INFO","minutes_ago":195,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Cache miss","severity":"WARN","minutes_ago":180,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Background job completed","severity":"INFO","minutes_ago":165,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Connection established","severity":"INFO","minutes_ago":150,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Connection established","severity":"INFO","minutes_ago":135,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Upstream call failed","severity":"ERROR","minutes_ago":120,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Connection established","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Background job completed","severity":"INFO","minutes_ago":90,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Background job completed","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Background job completed","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Cache hit","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Retrying upstream call","severity":"WARN","minutes_ago":30,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[adservice] Cache hit","severity":"INFO","minutes_ago":15,"resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"logger.name":"adservice.app"}}
+{"body":"[cartservice] Connection established","severity":"INFO","minutes_ago":360,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Cache hit","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Background job completed","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Cache hit","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Upstream call failed","severity":"ERROR","minutes_ago":300,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Connection established","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Retrying upstream call","severity":"WARN","minutes_ago":270,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Cache hit","severity":"INFO","minutes_ago":255,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Background job completed","severity":"INFO","minutes_ago":240,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Background job completed","severity":"INFO","minutes_ago":225,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Connection established","severity":"INFO","minutes_ago":210,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Connection established","severity":"INFO","minutes_ago":195,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Cache hit","severity":"INFO","minutes_ago":180,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Connection established","severity":"INFO","minutes_ago":165,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Cache hit","severity":"INFO","minutes_ago":150,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Connection established","severity":"INFO","minutes_ago":135,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Retrying upstream call","severity":"WARN","minutes_ago":120,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Cache hit","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Handled request","severity":"INFO","minutes_ago":90,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Background job completed","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Connection established","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Background job completed","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Cache hit","severity":"INFO","minutes_ago":30,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[cartservice] Handled request","severity":"INFO","minutes_ago":15,"resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"logger.name":"cartservice.app"}}
+{"body":"[checkoutservice] Retrying upstream call","severity":"WARN","minutes_ago":360,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Cache hit","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Background job completed","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Connection established","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Connection established","severity":"INFO","minutes_ago":300,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Background job completed","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Background job completed","severity":"INFO","minutes_ago":270,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Background job completed","severity":"INFO","minutes_ago":255,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Connection established","severity":"INFO","minutes_ago":240,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Cache hit","severity":"INFO","minutes_ago":225,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Retrying upstream call","severity":"WARN","minutes_ago":210,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Connection established","severity":"INFO","minutes_ago":195,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Handled request","severity":"INFO","minutes_ago":180,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Connection established","severity":"INFO","minutes_ago":165,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Authorization failed","severity":"ERROR","minutes_ago":150,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Cache hit","severity":"INFO","minutes_ago":135,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Cache miss","severity":"WARN","minutes_ago":120,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Background job completed","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Connection established","severity":"INFO","minutes_ago":90,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Connection established","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Cache hit","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Background job completed","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Cache hit","severity":"INFO","minutes_ago":30,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[checkoutservice] Slow response detected","severity":"WARN","minutes_ago":15,"resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"logger.name":"checkoutservice.app"}}
+{"body":"[currencyservice] Background job completed","severity":"INFO","minutes_ago":360,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Connection established","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Handled request","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Background job completed","severity":"INFO","minutes_ago":300,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Connection established","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Handled request","severity":"INFO","minutes_ago":270,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Connection established","severity":"INFO","minutes_ago":255,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Handled request","severity":"INFO","minutes_ago":240,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Connection established","severity":"INFO","minutes_ago":225,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Background job completed","severity":"INFO","minutes_ago":210,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Background job completed","severity":"INFO","minutes_ago":195,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":180,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":165,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":150,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache miss","severity":"WARN","minutes_ago":135,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Background job completed","severity":"INFO","minutes_ago":120,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Background job completed","severity":"INFO","minutes_ago":90,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Handled request","severity":"INFO","minutes_ago":30,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[currencyservice] Cache hit","severity":"INFO","minutes_ago":15,"resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"logger.name":"currencyservice.app"}}
+{"body":"[frontend] Slow response detected","severity":"WARN","minutes_ago":360,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Cache hit","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Background job completed","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Connection established","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Background job completed","severity":"INFO","minutes_ago":300,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Connection established","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Background job completed","severity":"INFO","minutes_ago":270,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Connection established","severity":"INFO","minutes_ago":255,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Handled request","severity":"INFO","minutes_ago":240,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Slow response detected","severity":"WARN","minutes_ago":225,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Cache hit","severity":"INFO","minutes_ago":210,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Handled request","severity":"INFO","minutes_ago":195,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Background job completed","severity":"INFO","minutes_ago":180,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Cache miss","severity":"WARN","minutes_ago":165,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Authorization failed","severity":"ERROR","minutes_ago":150,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Connection established","severity":"INFO","minutes_ago":135,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Connection established","severity":"INFO","minutes_ago":120,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Handled request","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Cache hit","severity":"INFO","minutes_ago":90,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Background job completed","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Connection established","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Background job completed","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Connection established","severity":"INFO","minutes_ago":30,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[frontend] Background job completed","severity":"INFO","minutes_ago":15,"resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"logger.name":"frontend.app"}}
+{"body":"[paymentservice] Connection established","severity":"INFO","minutes_ago":360,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Cache hit","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Connection established","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Handled request","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Connection established","severity":"INFO","minutes_ago":300,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Connection established","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Slow response detected","severity":"WARN","minutes_ago":270,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Authorization failed","severity":"ERROR","minutes_ago":255,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Handled request","severity":"INFO","minutes_ago":240,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Authorization failed","severity":"ERROR","minutes_ago":225,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Background job completed","severity":"INFO","minutes_ago":210,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Authorization failed","severity":"ERROR","minutes_ago":195,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Cache hit","severity":"INFO","minutes_ago":180,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Cache hit","severity":"INFO","minutes_ago":165,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Retrying upstream call","severity":"WARN","minutes_ago":150,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Handled request","severity":"INFO","minutes_ago":135,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Background job completed","severity":"INFO","minutes_ago":120,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Handled request","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Authorization failed","severity":"ERROR","minutes_ago":90,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Connection established","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Cache hit","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Cache hit","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Handled request","severity":"INFO","minutes_ago":30,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[paymentservice] Upstream call failed","severity":"ERROR","minutes_ago":15,"resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"logger.name":"paymentservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":360,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Connection established","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":300,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Connection established","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache miss","severity":"WARN","minutes_ago":270,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Connection established","severity":"INFO","minutes_ago":255,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":240,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":225,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":210,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":195,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":180,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":165,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":150,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":135,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":120,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Handled request","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":90,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Connection established","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Cache hit","severity":"INFO","minutes_ago":30,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[productcatalogservice] Background job completed","severity":"INFO","minutes_ago":15,"resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"logger.name":"productcatalogservice.app"}}
+{"body":"[shippingservice] Database query timed out","severity":"ERROR","minutes_ago":360,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Connection established","severity":"INFO","minutes_ago":345,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Background job completed","severity":"INFO","minutes_ago":330,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Cache hit","severity":"INFO","minutes_ago":315,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Background job completed","severity":"INFO","minutes_ago":300,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Connection established","severity":"INFO","minutes_ago":285,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Handled request","severity":"INFO","minutes_ago":270,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Cache hit","severity":"INFO","minutes_ago":255,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Handled request","severity":"INFO","minutes_ago":240,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Cache miss","severity":"WARN","minutes_ago":225,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Connection established","severity":"INFO","minutes_ago":210,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Connection established","severity":"INFO","minutes_ago":195,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Connection established","severity":"INFO","minutes_ago":180,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Background job completed","severity":"INFO","minutes_ago":165,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Cache hit","severity":"INFO","minutes_ago":150,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Database query timed out","severity":"ERROR","minutes_ago":135,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Background job completed","severity":"INFO","minutes_ago":120,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Cache hit","severity":"INFO","minutes_ago":105,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Handled request","severity":"INFO","minutes_ago":90,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Handled request","severity":"INFO","minutes_ago":75,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Cache hit","severity":"INFO","minutes_ago":60,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Connection established","severity":"INFO","minutes_ago":45,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Background job completed","severity":"INFO","minutes_ago":30,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}
+{"body":"[shippingservice] Cache miss","severity":"WARN","minutes_ago":15,"resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"logger.name":"shippingservice.app"}}

tests/seeder/golden/otel-demo-traces-golden.jsonl

@@ -0,0 +1,180 @@
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":360,"duration_ms":380,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":330,"duration_ms":141,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":300,"duration_ms":419,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":270,"duration_ms":421,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":240,"duration_ms":245,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":210,"duration_ms":341,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":180,"duration_ms":403,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":150,"duration_ms":334,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":120,"duration_ms":402,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":90,"duration_ms":140,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":60,"duration_ms":350,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/get","kind":"SERVER","minutes_ago":30,"duration_ms":229,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"GET","http.route":"/ads/get","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":360,"duration_ms":421,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":330,"duration_ms":332,"status":"ERROR","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"500"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":300,"duration_ms":70,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":270,"duration_ms":464,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":240,"duration_ms":77,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":210,"duration_ms":187,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":180,"duration_ms":278,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":150,"duration_ms":191,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":120,"duration_ms":433,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":90,"duration_ms":191,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":60,"duration_ms":104,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"adservice /ads/list","kind":"SERVER","minutes_ago":30,"duration_ms":189,"status":"OK","resource_attributes":{"service.name":"adservice","deployment.environment":"production","k8s.namespace.name":"signoz-adservice"},"attributes":{"http.method":"POST","http.route":"/ads/list","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":360,"duration_ms":303,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":330,"duration_ms":492,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":300,"duration_ms":271,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":270,"duration_ms":114,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":240,"duration_ms":245,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":210,"duration_ms":171,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":180,"duration_ms":145,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":150,"duration_ms":190,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":120,"duration_ms":166,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":90,"duration_ms":391,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":60,"duration_ms":361,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/add","kind":"SERVER","minutes_ago":30,"duration_ms":456,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/add","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":360,"duration_ms":173,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":330,"duration_ms":127,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":300,"duration_ms":342,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":270,"duration_ms":124,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":240,"duration_ms":499,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":210,"duration_ms":168,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":180,"duration_ms":292,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":150,"duration_ms":417,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":120,"duration_ms":107,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":90,"duration_ms":439,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":60,"duration_ms":441,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/get","kind":"SERVER","minutes_ago":30,"duration_ms":223,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"GET","http.route":"/cart/get","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":360,"duration_ms":420,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":330,"duration_ms":244,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":300,"duration_ms":485,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":270,"duration_ms":189,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":240,"duration_ms":134,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":210,"duration_ms":420,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":180,"duration_ms":456,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":150,"duration_ms":485,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":120,"duration_ms":80,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":90,"duration_ms":291,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":60,"duration_ms":158,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"cartservice /cart/empty","kind":"SERVER","minutes_ago":30,"duration_ms":56,"status":"OK","resource_attributes":{"service.name":"cartservice","deployment.environment":"production","k8s.namespace.name":"signoz-cartservice"},"attributes":{"http.method":"POST","http.route":"/cart/empty","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":360,"duration_ms":378,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":330,"duration_ms":82,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":300,"duration_ms":102,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":270,"duration_ms":249,"status":"ERROR","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"500"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":240,"duration_ms":215,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":210,"duration_ms":234,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":180,"duration_ms":301,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":150,"duration_ms":284,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":120,"duration_ms":290,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":90,"duration_ms":212,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":60,"duration_ms":400,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"checkoutservice /checkout","kind":"SERVER","minutes_ago":30,"duration_ms":339,"status":"OK","resource_attributes":{"service.name":"checkoutservice","deployment.environment":"production","k8s.namespace.name":"signoz-checkoutservice"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":360,"duration_ms":205,"status":"ERROR","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"500"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":330,"duration_ms":77,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":300,"duration_ms":217,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":270,"duration_ms":348,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":240,"duration_ms":351,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":210,"duration_ms":288,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":180,"duration_ms":83,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":150,"duration_ms":264,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":120,"duration_ms":111,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":90,"duration_ms":349,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":60,"duration_ms":464,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"currencyservice /currency/convert","kind":"SERVER","minutes_ago":30,"duration_ms":201,"status":"OK","resource_attributes":{"service.name":"currencyservice","deployment.environment":"production","k8s.namespace.name":"signoz-currencyservice"},"attributes":{"http.method":"POST","http.route":"/currency/convert","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":360,"duration_ms":333,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":330,"duration_ms":227,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":300,"duration_ms":487,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":270,"duration_ms":478,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":240,"duration_ms":137,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":210,"duration_ms":215,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":180,"duration_ms":445,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":150,"duration_ms":59,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":120,"duration_ms":254,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":90,"duration_ms":197,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":60,"duration_ms":52,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /","kind":"SERVER","minutes_ago":30,"duration_ms":221,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"GET","http.route":"/","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":360,"duration_ms":72,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":330,"duration_ms":335,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":300,"duration_ms":292,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":270,"duration_ms":286,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":240,"duration_ms":444,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":210,"duration_ms":183,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":180,"duration_ms":123,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":150,"duration_ms":337,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":120,"duration_ms":373,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":90,"duration_ms":248,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":60,"duration_ms":459,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /product","kind":"SERVER","minutes_ago":30,"duration_ms":90,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/product","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":360,"duration_ms":304,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":330,"duration_ms":427,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":300,"duration_ms":130,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":270,"duration_ms":152,"status":"ERROR","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"500"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":240,"duration_ms":163,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":210,"duration_ms":73,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":180,"duration_ms":177,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":150,"duration_ms":80,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":120,"duration_ms":440,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":90,"duration_ms":450,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":60,"duration_ms":481,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"frontend /checkout","kind":"SERVER","minutes_ago":30,"duration_ms":219,"status":"OK","resource_attributes":{"service.name":"frontend","deployment.environment":"production","k8s.namespace.name":"signoz-frontend"},"attributes":{"http.method":"POST","http.route":"/checkout","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":360,"duration_ms":381,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":330,"duration_ms":307,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":300,"duration_ms":351,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":270,"duration_ms":384,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":240,"duration_ms":273,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":210,"duration_ms":499,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":180,"duration_ms":80,"status":"ERROR","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"500"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":150,"duration_ms":186,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":120,"duration_ms":423,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":90,"duration_ms":121,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":60,"duration_ms":451,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"paymentservice /payment/charge","kind":"SERVER","minutes_ago":30,"duration_ms":402,"status":"OK","resource_attributes":{"service.name":"paymentservice","deployment.environment":"production","k8s.namespace.name":"signoz-paymentservice"},"attributes":{"http.method":"POST","http.route":"/payment/charge","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":360,"duration_ms":189,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":330,"duration_ms":229,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":300,"duration_ms":59,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":270,"duration_ms":300,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":240,"duration_ms":439,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":210,"duration_ms":478,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":180,"duration_ms":104,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":150,"duration_ms":336,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":120,"duration_ms":335,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":90,"duration_ms":430,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":60,"duration_ms":116,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/list","kind":"SERVER","minutes_ago":30,"duration_ms":75,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"POST","http.route":"/products/list","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":360,"duration_ms":314,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":330,"duration_ms":303,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":300,"duration_ms":174,"status":"ERROR","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"500"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":270,"duration_ms":238,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":240,"duration_ms":494,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":210,"duration_ms":394,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":180,"duration_ms":71,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":150,"duration_ms":222,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":120,"duration_ms":386,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":90,"duration_ms":227,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":60,"duration_ms":54,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"productcatalogservice /products/get","kind":"SERVER","minutes_ago":30,"duration_ms":456,"status":"OK","resource_attributes":{"service.name":"productcatalogservice","deployment.environment":"production","k8s.namespace.name":"signoz-productcatalogservice"},"attributes":{"http.method":"GET","http.route":"/products/get","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":360,"duration_ms":317,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":330,"duration_ms":111,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":300,"duration_ms":478,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":270,"duration_ms":75,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":240,"duration_ms":413,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":210,"duration_ms":217,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":180,"duration_ms":160,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":150,"duration_ms":170,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":120,"duration_ms":415,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":90,"duration_ms":448,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":60,"duration_ms":340,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/quote","kind":"SERVER","minutes_ago":30,"duration_ms":390,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/quote","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":360,"duration_ms":96,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":330,"duration_ms":414,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":300,"duration_ms":182,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":270,"duration_ms":116,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":240,"duration_ms":489,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":210,"duration_ms":130,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":180,"duration_ms":394,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":150,"duration_ms":59,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":120,"duration_ms":159,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":90,"duration_ms":432,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":60,"duration_ms":87,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}
+{"name":"shippingservice /shipping/ship","kind":"SERVER","minutes_ago":30,"duration_ms":59,"status":"OK","resource_attributes":{"service.name":"shippingservice","deployment.environment":"production","k8s.namespace.name":"signoz-shippingservice"},"attributes":{"http.method":"POST","http.route":"/shipping/ship","http.status_code":"200"}}

tests/seeder/server.py

@@ -1,5 +1,12 @@
-"""HTTP seeder — wraps fixtures.{traces,logs,metrics} so Playwright specs
-can POST per-test telemetry (tagged `seeder=true`) and DELETE to clear."""
+"""HTTP seeder — single entrypoint for e2e/integration telemetry.
+
+POST /telemetry/{metrics,logs,traces} insert into ClickHouse via
+fixtures.{metrics,logs,traces}. DELETE truncates the signal tables.
+
+Parallel-safe: every seeded row is tagged `seeder=true`. Tests share
+the seeded baseline; per-test mutations live in their own dashboards.
+Only test_teardown should call DELETE — workers must finish first.
+"""
 
 import os
 from collections.abc import AsyncIterator
@@ -10,11 +17,7 @@ import clickhouse_connect
 from fastapi import FastAPI, HTTPException, Response, status
 
 from fixtures.logger import setup_logger
-from fixtures.logs import (
-    Logs,
-    insert_logs_to_clickhouse,
-    truncate_logs_tables,
-)
+from fixtures.logs import Logs, insert_logs_to_clickhouse, truncate_logs_tables
 from fixtures.metrics import (
     Metrics,
     insert_metrics_to_clickhouse,
@@ -39,7 +42,9 @@ SEEDER_MARKER = {"seeder": "true"}
 
 @asynccontextmanager
 async def lifespan(_: FastAPI) -> AsyncIterator[None]:
-    conn = clickhouse_connect.get_client(host=CH_HOST, port=CH_PORT, username=CH_USER, password=CH_PASSWORD)
+    conn = clickhouse_connect.get_client(
+        host=CH_HOST, port=CH_PORT, username=CH_USER, password=CH_PASSWORD
+    )
     app.state.ch = conn
     try:
         yield
@@ -64,12 +69,19 @@ def _tag(item: dict[str, Any]) -> dict[str, Any]:
     return {**item, "resources": resources}
 
 
-# Metrics payload carries label dicts at the top level, not a `resources`
-# key — tagging goes on the `resource_attrs` wrapper that Metrics.from_dict
-# unpacks. Same effect, different key.
 def _tag_metrics(item: dict[str, Any]) -> dict[str, Any]:
-    resource_attrs = {**(item.get("resource_attrs") or {}), **SEEDER_MARKER}
-    return {**item, "resource_attrs": resource_attrs}
+    # Accept OTLP-style `resource_attributes` / `attributes` or legacy
+    # `resource_attrs` / `labels` interchangeably.
+    resource_attrs = {
+        **(item.get("resource_attrs") or {}),
+        **(item.get("resource_attributes") or {}),
+        **SEEDER_MARKER,
+    }
+    labels = {**(item.get("labels") or {}), **(item.get("attributes") or {})}
+    out = {**item, "resource_attrs": resource_attrs, "labels": labels}
+    out.pop("resource_attributes", None)
+    out.pop("attributes", None)
+    return out
 
 
 @app.post("/telemetry/traces", status_code=status.HTTP_201_CREATED)
@@ -145,3 +157,17 @@ def delete_metrics() -> Response:
     except Exception as e:
         logger.exception("truncate failed")
         raise HTTPException(status_code=500, detail=str(e)) from e
+
+
+@app.post("/seed/golden", status_code=status.HTTP_200_OK)
+def seed_golden() -> dict[str, int]:
+    """Re-seed the golden dataset with timestamps rebased to `now`.
+    Called by Playwright globalSetup before every test session so chart
+    assertions land within default panel time windows."""
+    from fixtures import seed_golden_dataset  # local import: fast cold-start
+
+    try:
+        return seed_golden_dataset.seed("http://localhost:8080")
+    except Exception as e:
+        logger.exception("golden seed failed")
+        raise HTTPException(500, str(e)) from e