test: add teardown bits

frontend/.cursor/rules/ui-components-and-icons.mdc

@@ -1,19 +0,0 @@
----
-description: Prefer SigNoz UI and icons across frontend code
-globs: **/*.{ts,tsx,js,jsx}
-alwaysApply: true
----
-
-# UI Components and Icons Source of Truth
-
-For all frontend implementation work in this repository:
-
-- Always use UI primitives/components from `@signozhq/ui`.
-- Always use icons from `@signozhq/icons`.
-- Do not introduce new usage of icon libraries directly (for example `lucide-react`) in app code.
-- Do not mix multiple component systems for the same UI surface when an equivalent exists in `@signozhq/ui`.
-
-## Migration guidance
-
-- If touching a file that already uses non-`@signozhq/icons` icons, prefer migrating that file to `@signozhq/icons` as part of the same change when practical.
-- If a required component or icon is missing from SigNoz packages, call this out explicitly in the PR/summary before introducing alternatives.

frontend/.oxlintrc.json

@@ -291,8 +291,6 @@
     // Prevents window.open(path), window.location.origin + path, window.location.href = path
     "signoz/no-antd-components": "error",
     // Prevents the usage of specific antd components in favor of our lib
-    "signoz/no-signozhq-ui-barrel": "error",
-    // Forces subpath imports (@signozhq/ui/<component>) instead of the eagerly-loaded barrel
     "no-restricted-globals": [
       "error",
       {

frontend/jest.setup.ts

@@ -29,18 +29,6 @@ if (!HTMLElement.prototype.scrollIntoView) {
 	HTMLElement.prototype.scrollIntoView = function (): void {};
 }
 
-if (typeof window.IntersectionObserver === 'undefined') {
-	class IntersectionObserverMock {
-		observe(): void {}
-		unobserve(): void {}
-		disconnect(): void {}
-		takeRecords(): IntersectionObserverEntry[] {
-			return [];
-		}
-	}
-	(window as any).IntersectionObserver = IntersectionObserverMock;
-}
-
 // Patch getComputedStyle to handle CSS parsing errors from @signozhq/* packages.
 // These packages inject CSS at import time via style-inject / vite-plugin-css-injected-by-js.
 // jsdom's nwsapi cannot parse some of the injected selectors (e.g. Tailwind's :animate-in),

frontend/plugins/rules/no-signozhq-ui-barrel.mjs

@@ -1,210 +0,0 @@
-/**
- * Rule: no-signozhq-ui-barrel
- *
- * Forbids importing from the `@signozhq/ui` barrel and requires the matching
- * subpath instead.
- *
- * This rule catches:
- *   import { Typography } from '@signozhq/ui'
- *   import { Button, toast } from '@signozhq/ui'
- *   import '@signozhq/ui'
- *
- * And expects:
- *   import { Typography } from '@signozhq/ui/typography'
- *   import { Button } from '@signozhq/ui/button'
- *   import { toast } from '@signozhq/ui/sonner'
- *
- * Why: the barrel eagerly require()s every component (~90 of them) along with
- * their Radix/cmdk/motion/react-day-picker dependencies. Under Jest this caused
- * 5s timeouts and flaky tests after the Antd→@signozhq/ui Typography migration
- * (#11199). Subpath imports (added in @signozhq/ui@0.0.18) load only what's
- * used.
- *
- * The auto-generated `auto-import-registry.d.ts` is a pure declaration file
- * that exists solely to nudge VS Code's auto-import indexer; its bare
- * `import '@signozhq/ui';` is type-only and not emitted, so it is exempt.
- *
- * Autofix:
- *   Rewrites named imports to the matching subpath, splitting one statement
- *   into multiple when specifiers come from different subpaths. The
- *   export-name → subpath map is derived lazily from the installed
- *   `@signozhq/ui` dist `.d.ts` files. Imports we can't classify (namespace,
- *   default, side-effect, or unknown specifier) are reported without a fix.
- */
-
-import { existsSync, readFileSync } from 'node:fs';
-import { dirname, join } from 'node:path';
-import { fileURLToPath } from 'node:url';
-
-const ALLOWED_FILES = new Set(['auto-import-registry.d.ts']);
-
-const PLUGIN_DIR = dirname(fileURLToPath(import.meta.url));
-
-let exportMap = null;
-
-function loadExportMap() {
-	if (exportMap === null) {
-		exportMap = buildExportMap();
-	}
-	return exportMap;
-}
-
-function buildExportMap() {
-	const map = new Map();
-	const root = findSignozUiRoot();
-	if (!root) return map;
-
-	let pkg;
-	try {
-		pkg = JSON.parse(readFileSync(join(root, 'package.json'), 'utf-8'));
-	} catch {
-		return map;
-	}
-
-	const subpathKeys = Object.keys(pkg.exports || {}).filter((k) => k !== '.');
-	for (const key of subpathKeys) {
-		const subpath = key.replace(/^\.\//, '');
-		const entry = join(root, 'dist', subpath, 'index.d.ts');
-		if (!existsSync(entry)) continue;
-
-		const names = new Set();
-		collectExportedNames(entry, names, new Set());
-		// First-wins: package.json subpath order is the canonical home for
-		// names re-exported across multiple subpaths (e.g. `ToggleColor` is
-		// declared in `toggle` and re-exported from `toggle-group`).
-		for (const name of names) {
-			if (!map.has(name)) map.set(name, subpath);
-		}
-	}
-
-	return map;
-}
-
-function findSignozUiRoot() {
-	let dir = PLUGIN_DIR;
-	while (true) {
-		const candidate = join(dir, 'node_modules', '@signozhq', 'ui');
-		if (existsSync(join(candidate, 'package.json'))) return candidate;
-		const parent = dirname(dir);
-		if (parent === dir) return null;
-		dir = parent;
-	}
-}
-
-function collectExportedNames(filepath, out, visited) {
-	if (visited.has(filepath) || !existsSync(filepath)) return;
-	visited.add(filepath);
-
-	let content;
-	try {
-		content = readFileSync(filepath, 'utf-8');
-	} catch {
-		return;
-	}
-
-	// `export * from './x.js'` / `export type * from './x.js'`
-	for (const m of content.matchAll(
-		/export\s+(?:type\s+)?\*\s+from\s+['"]([^'"]+)['"]/g,
-	)) {
-		collectExportedNames(resolveRelativeDts(filepath, m[1]), out, visited);
-	}
-
-	// `export { Foo, type Bar, Foo as Baz } from '...';` and `export { ... };`
-	for (const m of content.matchAll(/export\s+(?:type\s+)?\{([^}]*)\}/g)) {
-		for (const item of m[1].split(',')) {
-			const cleaned = item.trim().replace(/^type\s+/, '');
-			if (!cleaned) continue;
-			const idMatch = cleaned.match(
-				/^([A-Za-z_$][A-Za-z0-9_$]*)(?:\s+as\s+([A-Za-z_$][A-Za-z0-9_$]*))?$/,
-			);
-			if (idMatch) out.add(idMatch[2] || idMatch[1]);
-		}
-	}
-
-	// `export (declare) const|let|var|function|class|enum|type|interface Foo`
-	for (const m of content.matchAll(
-		/export\s+(?:declare\s+)?(?:const|let|var|function|class|enum|type|interface)\s+([A-Za-z_$][A-Za-z0-9_$]*)/g,
-	)) {
-		out.add(m[1]);
-	}
-}
-
-function resolveRelativeDts(fromFile, spec) {
-	const base = dirname(fromFile);
-	const stripped = spec.replace(/\.(js|mjs|cjs)$/, '');
-	const sibling = join(base, `${stripped}.d.ts`);
-	if (existsSync(sibling)) return sibling;
-	const indexed = join(base, stripped, 'index.d.ts');
-	if (existsSync(indexed)) return indexed;
-	return sibling;
-}
-
-function buildReplacement(node, map) {
-	const specifiers = node.specifiers || [];
-	if (specifiers.length === 0) return null;
-
-	for (const spec of specifiers) {
-		if (spec.type !== 'ImportSpecifier') return null;
-		if (spec.imported?.type !== 'Identifier') return null;
-	}
-
-	const quote = node.source.raw?.[0] === '"' ? '"' : "'";
-	const topLevelType = node.importKind === 'type';
-	const keyword = topLevelType ? 'import type' : 'import';
-
-	const groups = new Map();
-	for (const spec of specifiers) {
-		const importedName = spec.imported.name;
-		const subpath = map.get(importedName);
-		if (!subpath) return null;
-
-		const localName = spec.local.name;
-		const inlineType = !topLevelType && spec.importKind === 'type';
-		let text = inlineType ? 'type ' : '';
-		text += importedName;
-		if (localName !== importedName) text += ` as ${localName}`;
-
-		if (!groups.has(subpath)) groups.set(subpath, []);
-		groups.get(subpath).push(text);
-	}
-
-	const lines = [];
-	for (const [subpath, items] of groups) {
-		lines.push(
-			`${keyword} { ${items.join(', ')} } from ${quote}@signozhq/ui/${subpath}${quote};`,
-		);
-	}
-	return lines.join('\n');
-}
-
-export default {
-	meta: {
-		fixable: 'code',
-	},
-	create(context) {
-		const filename = context.filename || '';
-		const basename = filename.split(/[\\/]/).pop();
-		if (ALLOWED_FILES.has(basename)) {
-			return {};
-		}
-
-		return {
-			ImportDeclaration(node) {
-				if (node.source.value !== '@signozhq/ui') {
-					return;
-				}
-
-				const replacement = buildReplacement(node, loadExportMap());
-				const report = {
-					node: node.source,
-					message:
-						"Do not import from the '@signozhq/ui' barrel. Use the matching subpath instead (e.g. '@signozhq/ui/typography', '@signozhq/ui/button', '@signozhq/ui/sonner'). The barrel eagerly loads ~90 components and slows tests substantially.",
-				};
-				if (replacement) {
-					report.fix = (fixer) => fixer.replaceText(node, replacement);
-				}
-				context.report(report);
-			},
-		};
-	},
-};

frontend/plugins/signoz.mjs

@@ -10,7 +10,6 @@ import noNavigatorClipboard from './rules/no-navigator-clipboard.mjs';
 import noUnsupportedAssetPattern from './rules/no-unsupported-asset-pattern.mjs';
 import noRawAbsolutePath from './rules/no-raw-absolute-path.mjs';
 import noAntdComponents from './rules/no-antd-components.mjs';
-import noSignozhqUiBarrel from './rules/no-signozhq-ui-barrel.mjs';
 
 export default {
 	meta: {
@@ -22,6 +21,5 @@ export default {
 		'no-unsupported-asset-pattern': noUnsupportedAssetPattern,
 		'no-raw-absolute-path': noRawAbsolutePath,
 		'no-antd-components': noAntdComponents,
-		'no-signozhq-ui-barrel': noSignozhqUiBarrel,
 	},
 };

frontend/src/api/trace/getTraceV3.tsx

@@ -40,7 +40,6 @@ const getTraceV3 = async (
 	const spans: SpanV3[] = (rawPayload.spans || []).map((span: any) => ({
 		...span,
 		'service.name': span.resource?.['service.name'] || '',
-		timestamp: span.time_unix,
 	}));
 
 	// V3 API returns startTimestampMillis/endTimestampMillis as relative durations (ms from epoch offset),

frontend/src/components/HttpStatusBadge/HttpStatusBadge.tsx

@@ -44,11 +44,7 @@ function HttpStatusBadge({
 
 	const color = getStatusCodeColor(numericStatusCode);
 
-	return (
-		<Badge color={color} variant="outline">
-			{statusCode}
-		</Badge>
-	);
+	return <Badge color={color}>{statusCode}</Badge>;
 }
 
 export default HttpStatusBadge;

frontend/src/constants/localStorage.ts

@@ -38,7 +38,6 @@ export enum LOCALSTORAGE {
 	DISSMISSED_COST_METER_INFO = 'DISMISSED_COST_METER_INFO',
 	DISMISSED_API_KEYS_DEPRECATION_BANNER = 'DISMISSED_API_KEYS_DEPRECATION_BANNER',
 	TRACE_DETAILS_SPAN_DETAILS_POSITION = 'TRACE_DETAILS_SPAN_DETAILS_POSITION',
-	TRACE_DETAILS_PREFER_OLD_VIEW = 'TRACE_DETAILS_PREFER_OLD_VIEW',
 	LICENSE_KEY_CALLOUT_DISMISSED = 'LICENSE_KEY_CALLOUT_DISMISSED',
 	DASHBOARD_PREFERENCES = 'DASHBOARD_PREFERENCES',
 }

frontend/src/constants/userPreferences.ts

@@ -3,7 +3,5 @@ export const USER_PREFERENCES = {
 	NAV_SHORTCUTS: 'nav_shortcuts',
 	LAST_SEEN_CHANGELOG_VERSION: 'last_seen_changelog_version',
 	SPAN_DETAILS_PINNED_ATTRIBUTES: 'span_details_pinned_attributes',
-	SPAN_DETAILS_PREVIEW_ATTRIBUTES: 'span_details_preview_attributes',
-	SPAN_DETAILS_COLOR_BY_ATTRIBUTE: 'span_details_color_by_attribute',
 	SPAN_PERCENTILE_RESOURCE_ATTRIBUTES: 'span_percentile_resource_attributes',
 };

frontend/src/container/InfraMonitoringK8s/components/ExpandButtonWrapper.tsx

@@ -1,4 +1,4 @@
-import { Button } from '@signozhq/ui/button';
+import { Button } from '@signozhq/ui';
 import { ChevronDown, ChevronRight } from '@signozhq/icons';
 import styles from './ExpandedButtonWrapper.module.scss';
 import { useEffect, useState } from 'react';

frontend/src/container/SpanDetailsDrawer/SpanLogs/SpanLogs.tsx

@@ -218,7 +218,7 @@ function SpanLogs({
 					<Virtuoso
 						className="span-logs-virtuoso"
 						key="span-logs-virtuoso"
-						style={{ height: '100%' }}
+						style={logs.length <= 35 ? { height: `calc(${logs.length} * 22px)` } : {}}
 						data={logs}
 						totalCount={logs.length}
 						itemContent={getItemContent}

frontend/src/container/SpanDetailsDrawer/SpanLogs/spanLogs.styles.scss

@@ -1,15 +1,12 @@
 .span-logs {
 	margin-inline: 16px;
-	height: 100%;
-	display: flex;
-	flex-direction: column;
+	height: calc(100% - 64px - 55px - 56px);
 
 	&-virtuoso {
 		background: color-mix(in srgb, var(--bg-robin-200) 4%, transparent);
 	}
 	&-list-container {
-		flex: 1;
-		min-height: 0;
+		height: 100%;
 
 		.logs-loading-skeleton {
 			height: 100%;

frontend/src/container/TraceMetadata/TraceMetadata.styles.scss

@@ -68,10 +68,6 @@
 				border-left: unset;
 				border-radius: 0px 4px 4px 0px;
 			}
-
-			.new-view-btn {
-				margin-left: 8px;
-			}
 		}
 
 		.second-row {

frontend/src/container/TraceMetadata/TraceMetadata.tsx

@@ -1,12 +1,8 @@
 import { useMemo } from 'react';
-import { useLocation, useRouteMatch } from 'react-router-dom';
-import { Skeleton, Tooltip } from 'antd';
-import { Button } from '@signozhq/ui/button';
+import { Button, Skeleton, Tooltip } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
-import removeLocalStorageKey from 'api/browser/localstorage/remove';
 import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
-import { LOCALSTORAGE } from 'constants/localStorage';
 import ROUTES from 'constants/routes';
 import dayjs from 'dayjs';
 import history from 'lib/history';
@@ -64,51 +60,18 @@ function TraceMetadata(props: ITraceMetadataProps): JSX.Element {
 		}
 	};
 
-	const isOnOldRoute = !!useRouteMatch({
-		path: ROUTES.TRACE_DETAIL_OLD,
-		exact: true,
-	});
-
-	const location = useLocation();
-
-	const handleSwitchToNewView = (): void => {
-		removeLocalStorageKey(LOCALSTORAGE.TRACE_DETAILS_PREFER_OLD_VIEW);
-		history.replace({
-			pathname: `/trace/${traceID}`,
-			search: location.search,
-			hash: location.hash,
-			state: location.state,
-		});
-	};
-
 	return (
 		<div className="trace-metadata">
 			<section className="metadata-info">
 				<div className="first-row">
-					<Button
-						variant="solid"
-						color="secondary"
-						size="icon"
-						className="previous-btn"
-						prefix={<ArrowLeft size={14} />}
-						onClick={handlePreviousBtnClick}
-					/>
+					<Button className="previous-btn" onClick={handlePreviousBtnClick}>
+						<ArrowLeft size={14} />
+					</Button>
 					<div className="trace-name">
 						<DraftingCompass size={14} className="drafting" />
 						<Typography.Text className="trace-id">Trace ID</Typography.Text>
 					</div>
 					<Typography.Text className="trace-id-value">{traceID}</Typography.Text>
-					{isOnOldRoute && (
-						<Button
-							variant="solid"
-							color="primary"
-							size="md"
-							className="new-view-btn"
-							onClick={handleSwitchToNewView}
-						>
-							New view
-						</Button>
-					)}
 				</div>
 
 				{isDataLoading && (

frontend/src/hooks/spanDetails/usePinnedAttributes.ts

@@ -1,5 +1,14 @@
-import { useCallback, useMemo } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useMutation } from 'react-query';
+import setLocalStorageApi from 'api/browser/localstorage/set';
+import updateUserPreference from 'api/v1/user/preferences/name/update';
+import { AxiosError } from 'axios';
 import { LOCALSTORAGE } from 'constants/localStorage';
+import { USER_PREFERENCES } from 'constants/userPreferences';
+import { useNotifications } from 'hooks/useNotifications';
+import { useAppContext } from 'providers/App/App';
+import { UserPreference } from 'types/api/preferences/preference';
+import { showErrorNotification } from 'utils/error';
 
 import { useLocalStorage } from '../useLocalStorage';
 
@@ -10,25 +19,59 @@ interface UsePinnedAttributesReturn {
 }
 
 /**
- * V2 trace-details pinned-attributes hook. localStorage-only.
+ * Hook for managing pinned span attributes with backend persistence.
+ * Falls back to localStorage during initial load and handles migration.
  *
- * NOTE: V2 used to also persist to the user-pref API
- * (`span_details_pinned_attributes`) but V3 now owns that key with a different
- * (nested-path) format. V2 is isolated to localStorage so it doesn't fight V3
- * over the same backend value. See `useMigratePinnedAttributes` in V3.
+ * @param availableAttributes - Object keys of the current span's flattened attributes
+ * @returns Object with pinned state, toggle function, and check function
  */
 export function usePinnedAttributes(
 	availableAttributes: string[],
 ): UsePinnedAttributesReturn {
-	const [pinnedKeys, setPinnedKeys] = useLocalStorage<string[]>(
+	const { userPreferences, updateUserPreferenceInContext } = useAppContext();
+	const { notifications } = useNotifications();
+	// API mutation for updating preferences
+	const { mutate: updateUserPreferenceMutation } = useMutation(
+		updateUserPreference,
+		{
+			onError: (error) => {
+				showErrorNotification(notifications, error as AxiosError);
+			},
+		},
+	);
+
+	// Local state for optimistic updates
+	const [pinnedKeys, setPinnedKeys] = useState<string[]>([]);
+
+	// Get localStorage fallback for initial load
+	const [localStoragePinnedKeys] = useLocalStorage<string[]>(
 		LOCALSTORAGE.SPAN_DETAILS_PINNED_ATTRIBUTES,
 		[],
 	);
 
+	// Initialize from user preferences when loaded
+	useEffect(() => {
+		if (userPreferences !== null) {
+			const preference = userPreferences.find(
+				(pref) => pref.name === USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
+			);
+
+			if (preference?.value) {
+				// use backend data
+				setPinnedKeys(preference.value as string[]);
+			} else if (localStoragePinnedKeys.length > 0) {
+				// use local storage data
+				setPinnedKeys(localStoragePinnedKeys);
+			}
+		}
+	}, [userPreferences, localStoragePinnedKeys]);
+
+	// Create pinned attributes state from stored keys, filtering by available attributes
 	const pinnedAttributes = useMemo(
 		(): Record<string, boolean> =>
 			pinnedKeys.reduce(
 				(acc, key) => {
+					// Only include if the attribute exists in the current span
 					if (availableAttributes.includes(key)) {
 						acc[key] = true;
 					}
@@ -39,17 +82,38 @@ export function usePinnedAttributes(
 		[pinnedKeys, availableAttributes],
 	);
 
+	// Toggle pin state for an attribute
 	const togglePin = useCallback(
 		(attributeKey: string): void => {
-			setPinnedKeys((prev) =>
-				prev.includes(attributeKey)
-					? prev.filter((k) => k !== attributeKey)
-					: [...prev, attributeKey],
+			const currentlyPinned = pinnedKeys.includes(attributeKey);
+			const newPinnedKeys = currentlyPinned
+				? pinnedKeys.filter((key) => key !== attributeKey)
+				: [...pinnedKeys, attributeKey];
+
+			// Optimistically update local state for instant UI feedback
+			setPinnedKeys(newPinnedKeys);
+
+			updateUserPreferenceInContext({
+				name: USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
+				value: newPinnedKeys,
+			} as UserPreference);
+
+			// Save to localStorage immediately for offline resilience
+			setLocalStorageApi(
+				LOCALSTORAGE.SPAN_DETAILS_PINNED_ATTRIBUTES,
+				JSON.stringify(newPinnedKeys),
 			);
+
+			// Make the API call in the background
+			updateUserPreferenceMutation({
+				name: USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
+				value: newPinnedKeys,
+			});
 		},
-		[setPinnedKeys],
+		[pinnedKeys, updateUserPreferenceInContext, updateUserPreferenceMutation],
 	);
 
+	// Check if an attribute is pinned
 	const isPinned = useCallback(
 		(attributeKey: string): boolean => pinnedAttributes[attributeKey] === true,
 		[pinnedAttributes],

frontend/src/hooks/trace/useGetTraceFlamegraph.tsx

@@ -12,11 +12,8 @@ const useGetTraceFlamegraph = (
 ): UseLicense =>
 	useQuery({
 		queryFn: () => getTraceFlamegraph(props),
-		queryKey: [
-			REACT_QUERY_KEY.GET_TRACE_V2_FLAMEGRAPH,
-			props.traceId,
-			props.selectFields,
-		],
+		// if any of the props changes then we need to trigger an API call as the older data will be obsolete
+		queryKey: [REACT_QUERY_KEY.GET_TRACE_V2_FLAMEGRAPH, props.traceId],
 		enabled: !!props.traceId,
 		keepPreviousData: true,
 		refetchOnWindowFocus: false,

frontend/src/hooks/trace/useGetTraceV3.tsx

@@ -15,7 +15,6 @@ const useGetTraceV3 = (props: GetTraceV3PayloadProps): UseTraceV3 =>
 			props.traceId,
 			props.selectedSpanId,
 			props.isSelectedSpanIDUnCollapsed,
-			props.aggregations,
 		],
 		enabled: !!props.traceId,
 		keepPreviousData: true,

frontend/src/pages/TraceDetailV3Page/index.tsx

@@ -1,25 +1,5 @@
-import { Redirect, useParams } from 'react-router-dom';
-import getLocalStorageKey from 'api/browser/localstorage/get';
-import { LOCALSTORAGE } from 'constants/localStorage';
-import { TraceDetailV2URLProps } from 'types/api/trace/getTraceV2';
-
 import TraceDetailsV3 from '../TraceDetailsV3';
 
 export default function TraceDetailV3Page(): JSX.Element {
-	const { id } = useParams<TraceDetailV2URLProps>();
-	const preferOld =
-		getLocalStorageKey(LOCALSTORAGE.TRACE_DETAILS_PREFER_OLD_VIEW) === 'true';
-
-	if (preferOld) {
-		return (
-			<Redirect
-				to={{
-					pathname: `/trace-old/${id}`,
-					search: window.location.search,
-				}}
-			/>
-		);
-	}
-
 	return <TraceDetailsV3 />;
 }

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

@@ -10,14 +10,16 @@ import { themeColors } from 'constants/theme';
 import { generateColor } from 'lib/uPlotLib/utils/generateColor';
 import { FloatingPanel } from 'periscope/components/FloatingPanel';
 
-import { useTraceContext } from '../../contexts/TraceContext';
-import { AGGREGATIONS } from '../../utils/aggregations';
-
 import './AnalyticsPanel.styles.scss';
 
 interface AnalyticsPanelProps {
 	isOpen: boolean;
 	onClose: () => void;
+	serviceExecTime?: Record<string, number>;
+	traceStartTime?: number;
+	traceEndTime?: number;
+	// TODO: Re-enable when backend provides per-service span counts
+	// spans?: Span[];
 }
 
 const PANEL_WIDTH = 350;
@@ -28,46 +30,41 @@ const PANEL_MARGIN_BOTTOM = 50;
 function AnalyticsPanel({
 	isOpen,
 	onClose,
+	serviceExecTime = {},
+	traceStartTime = 0,
+	traceEndTime = 0,
 }: AnalyticsPanelProps): JSX.Element | null {
-	const { getAggregationMap } = useTraceContext();
-
-	const execTimePct = useMemo(
-		() => getAggregationMap(AGGREGATIONS.EXEC_TIME_PCT),
-		[getAggregationMap],
-	);
-
-	const spanCounts = useMemo(
-		() => getAggregationMap(AGGREGATIONS.SPAN_COUNT),
-		[getAggregationMap],
-	);
+	const spread = traceEndTime - traceStartTime;
 
 	const execTimeRows = useMemo(() => {
-		if (!execTimePct) {
+		if (spread <= 0) {
 			return [];
 		}
-		return Object.entries(execTimePct)
-			.map(([group, percentage]) => ({
-				group,
-				percentage,
-				color: generateColor(group, themeColors.traceDetailColorsV3),
+		return Object.entries(serviceExecTime)
+			.map(([service, duration]) => ({
+				service,
+				percentage: (duration * 100) / spread,
+				color: generateColor(service, themeColors.traceDetailColorsV3),
 			}))
 			.sort((a, b) => b.percentage - a.percentage);
-	}, [execTimePct]);
+	}, [serviceExecTime, spread]);
 
-	const spanCountRows = useMemo(() => {
-		if (!spanCounts) {
-			return [];
-		}
-		const max = Math.max(...Object.values(spanCounts), 1);
-		return Object.entries(spanCounts)
-			.map(([group, count]) => ({
-				group,
-				count,
-				max,
-				color: generateColor(group, themeColors.traceDetailColorsV3),
-			}))
-			.sort((a, b) => b.count - a.count);
-	}, [spanCounts]);
+	// const spanCountRows = useMemo(() => {
+	// 	const counts: Record<string, number> = {};
+	// 	for (const span of spans) {
+	// 		const name = span.serviceName || 'unknown';
+	// 		counts[name] = (counts[name] || 0) + 1;
+	// 	}
+	// 	return Object.entries(counts)
+	// 		.map(([service, count]) => ({
+	// 			service,
+	// 			count,
+	// 			color: generateColor(service, themeColors.traceDetailColorsV3),
+	// 		}))
+	// 		.sort((a, b) => b.count - a.count);
+	// }, [spans]);
+
+	// const maxSpanCount = spanCountRows[0]?.count || 1;
 
 	if (!isOpen) {
 		return null;
@@ -106,9 +103,11 @@ function AnalyticsPanel({
 						<TabsTrigger value="exec-time" variant="secondary">
 							% exec time
 						</TabsTrigger>
+						{/* TODO: Enable when backend provides per-service span counts
 						<TabsTrigger value="spans" variant="secondary">
 							Spans
 						</TabsTrigger>
+						*/}
 					</TabsList>
 
 					<div className="analytics-panel__tabs-scroll">
@@ -117,17 +116,17 @@ function AnalyticsPanel({
 								{execTimeRows.map((row) => (
 									<>
 										<div
-											key={`${row.group}-dot`}
+											key={`${row.service}-dot`}
 											className="analytics-panel__dot"
 											style={{ backgroundColor: row.color }}
 										/>
 										<span
-											key={`${row.group}-name`}
+											key={`${row.service}-name`}
 											className="analytics-panel__service-name"
 										>
-											{row.group}
+											{row.service}
 										</span>
-										<div key={`${row.group}-bar`} className="analytics-panel__bar-cell">
+										<div key={`${row.service}-bar`} className="analytics-panel__bar-cell">
 											<div className="analytics-panel__bar">
 												<div
 													className="analytics-panel__bar-fill"
@@ -146,27 +145,28 @@ function AnalyticsPanel({
 							</div>
 						</TabsContent>
 
+						{/* TODO: Enable when backend provides per-service span counts
 						<TabsContent value="spans">
 							<div className="analytics-panel__list">
 								{spanCountRows.map((row) => (
 									<>
 										<div
-											key={`${row.group}-dot`}
+											key={`${row.service}-dot`}
 											className="analytics-panel__dot"
 											style={{ backgroundColor: row.color }}
 										/>
 										<span
-											key={`${row.group}-name`}
+											key={`${row.service}-name`}
 											className="analytics-panel__service-name"
 										>
-											{row.group}
+											{row.service}
 										</span>
-										<div key={`${row.group}-bar`} className="analytics-panel__bar-cell">
+										<div key={`${row.service}-bar`} className="analytics-panel__bar-cell">
 											<div className="analytics-panel__bar">
 												<div
 													className="analytics-panel__bar-fill"
 													style={{
-														width: `${(row.count / row.max) * 100}%`,
+														width: `${(row.count / maxSpanCount) * 100}%`,
 														backgroundColor: row.color,
 													}}
 												/>
@@ -179,6 +179,7 @@ function AnalyticsPanel({
 								))}
 							</div>
 						</TabsContent>
+						*/}
 					</div>
 				</TabsRoot>
 			</div>

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

@@ -64,13 +64,9 @@
 		min-height: 0;
 		overflow-y: auto;
 		scrollbar-width: none;
-		display: flex;
-		flex-direction: column;
 
 		[role='tabpanel'] {
 			padding: 0;
-			flex: 1;
-			min-height: 0;
 		}
 	}
 
@@ -116,8 +112,7 @@
 		width: 6px;
 		height: 6px;
 		border-radius: 50%;
-		background: var(--accent-forest);
-		flex-shrink: 0;
+		background: var(--success-500);
 	}
 
 	&__trace-id {
@@ -128,17 +123,6 @@
 		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;

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

@@ -41,12 +41,7 @@ import Events from 'container/SpanDetailsDrawer/Events/Events';
 import SpanLogs from 'container/SpanDetailsDrawer/SpanLogs/SpanLogs';
 import { useSpanContextLogs } from 'container/SpanDetailsDrawer/SpanLogs/useSpanContextLogs';
 import dayjs from 'dayjs';
-import { useMigratePinnedAttributes } from 'pages/TraceDetailsV3/hooks/useMigratePinnedAttributes';
-import {
-	getSpanAttribute,
-	getSpanDisplayData,
-	hasInfraMetadata,
-} from 'pages/TraceDetailsV3/utils';
+import { getSpanAttribute, hasInfraMetadata } from 'pages/TraceDetailsV3/utils';
 import { DataViewer } from 'periscope/components/DataViewer';
 import { FloatingPanel } from 'periscope/components/FloatingPanel';
 import KeyValueLabel from 'periscope/components/KeyValueLabel';
@@ -64,7 +59,6 @@ import {
 	VISIBLE_ACTIONS,
 } from './constants';
 import { useSpanAttributeActions } from './hooks/useSpanAttributeActions';
-import { useTracePinnedFields } from './hooks/useTracePinnedFields';
 import {
 	LinkedSpansPanel,
 	LinkedSpansToggle,
@@ -83,6 +77,7 @@ interface SpanDetailsPanelProps {
 	onVariantChange?: (variant: SpanDetailVariant) => void;
 	traceStartTime?: number;
 	traceEndTime?: number;
+	serviceExecTime?: Record<string, number>;
 }
 
 function SpanDetailsContent({
@@ -99,17 +94,6 @@ function SpanDetailsContent({
 	const percentile = useSpanPercentile(selectedSpan);
 	const linkedSpans = useLinkedSpans((selectedSpan as any).references);
 
-	// One-time conversion of any V2-format value still living in the
-	// `span_details_pinned_attributes` user pref into V3 nested-path format.
-	useMigratePinnedAttributes(selectedSpan);
-	const { value: pinnedFieldsValue, onChange: onPinnedFieldsChange } =
-		useTracePinnedFields();
-
-	const spanDisplayData = useMemo(
-		() => getSpanDisplayData(selectedSpan),
-		[selectedSpan],
-	);
-
 	// Map span attribute actions to PrettyView actions format.
 	// Use the last key in fieldKeyPath (the actual attribute key), not the full display path.
 	const prettyViewCustomActions = useMemo(
@@ -407,14 +391,12 @@ function SpanDetailsContent({
 					<div className="span-details-panel__tabs-scroll">
 						<TabsContent value="overview">
 							<DataViewer
-								data={spanDisplayData}
+								data={selectedSpan}
 								drawerKey="trace-details"
 								prettyViewProps={{
 									showPinned: true,
 									actions: prettyViewCustomActions,
 									visibleActions: VISIBLE_ACTIONS,
-									pinnedFieldsValue,
-									onPinnedFieldsChange,
 								}}
 							/>
 						</TabsContent>
@@ -469,6 +451,7 @@ function SpanDetailsPanel({
 	onVariantChange,
 	traceStartTime,
 	traceEndTime,
+	serviceExecTime,
 }: SpanDetailsPanelProps): JSX.Element {
 	const [isAnalyticsOpen, setIsAnalyticsOpen] = useState(false);
 
@@ -575,6 +558,9 @@ function SpanDetailsPanel({
 		<AnalyticsPanel
 			isOpen={isAnalyticsOpen}
 			onClose={(): void => setIsAnalyticsOpen(false)}
+			serviceExecTime={serviceExecTime}
+			traceStartTime={traceStartTime}
+			traceEndTime={traceEndTime}
 		/>
 	);
 
@@ -608,7 +594,6 @@ function SpanDetailsPanel({
 				isOpen={panelState.isOpen}
 				className="span-details-panel"
 				width={PANEL_WIDTH}
-				minWidth={480}
 				height={window.innerHeight - PANEL_MARGIN_TOP - PANEL_MARGIN_BOTTOM}
 				defaultPosition={{
 					x: window.innerWidth - PANEL_WIDTH - PANEL_MARGIN_RIGHT,

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

@@ -1,59 +0,0 @@
-import { Link, useRouteMatch } from 'react-router-dom';
-import { useCopyToClipboard } from 'react-use';
-import { Button } from '@signozhq/ui/button';
-import { toast } from '@signozhq/ui/sonner';
-import ROUTES from 'constants/routes';
-import { SpanV3 } from 'types/api/trace/getTraceV3';
-
-interface TraceIdFieldProps {
-	span: SpanV3;
-}
-
-/**
- * Renders a span's trace id. When the user is already on the trace detail
- * page for this trace, clicking the id copies it to the clipboard (the
- * "navigate" affordance would be a no-op). Otherwise, falls back to the
- * existing link to the trace detail page.
- */
-export function TraceIdField({ span }: TraceIdFieldProps): JSX.Element {
-	const match = useRouteMatch<{ id: string }>({
-		path: ROUTES.TRACE_DETAIL,
-		exact: true,
-	});
-	const [, setCopy] = useCopyToClipboard();
-
-	const isCurrentTrace = match?.params.id === span.trace_id;
-
-	if (isCurrentTrace) {
-		const handleCopy = (): void => {
-			setCopy(span.trace_id);
-			toast.success('Trace ID copied to clipboard', {
-				position: 'top-right',
-			});
-		};
-
-		return (
-			<Button
-				variant="link"
-				color="secondary"
-				className="span-details-panel__trace-id-copy"
-				onClick={handleCopy}
-				title="Click to copy trace ID"
-			>
-				{span.trace_id}
-			</Button>
-		);
-	}
-
-	return (
-		<Link
-			to={{
-				pathname: `/trace/${span.trace_id}`,
-				search: window.location.search,
-			}}
-			className="span-details-panel__trace-id"
-		>
-			{span.trace_id}
-		</Link>
-	);
-}

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

@@ -1,9 +1,8 @@
 import { ReactNode } from 'react';
+import { Link } from 'react-router-dom';
 import { Badge } from '@signozhq/ui/badge';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 
-import { TraceIdField } from './TraceIdField';
-
 interface HighlightedOption {
 	key: string;
 	label: string;
@@ -34,7 +33,17 @@ export const HIGHLIGHTED_OPTIONS: HighlightedOption[] = [
 		key: 'traceId',
 		label: 'TRACE ID',
 		render: (span): ReactNode | null =>
-			span.trace_id ? <TraceIdField span={span} /> : null,
+			span.trace_id ? (
+				<Link
+					to={{
+						pathname: `/trace/${span.trace_id}`,
+						search: window.location.search,
+					}}
+					className="span-details-panel__trace-id"
+				>
+					{span.trace_id}
+				</Link>
+			) : null,
 	},
 	{
 		key: 'spanKind',
@@ -42,12 +51,4 @@ export const HIGHLIGHTED_OPTIONS: HighlightedOption[] = [
 		render: (span): ReactNode | null =>
 			span.kind_string ? <Badge color="vanilla">{span.kind_string}</Badge> : null,
 	},
-	{
-		key: 'statusMessage',
-		label: 'STATUS MESSAGE',
-		render: (span): ReactNode | null =>
-			span.status_message ? (
-				<Badge color="vanilla">{span.status_message}</Badge>
-			) : null,
-	},
 ];

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/hooks/useTracePinnedFields.ts

@@ -1,51 +0,0 @@
-import { useCallback, useMemo } from 'react';
-import { useMutation } from 'react-query';
-import updateUserPreferenceAPI from 'api/v1/user/preferences/name/update';
-import { USER_PREFERENCES } from 'constants/userPreferences';
-import { isV3PinnedAttribute } from 'pages/TraceDetailsV3/utils';
-import { useAppContext } from 'providers/App/App';
-
-interface UseTracePinnedFieldsReturn {
-	value: string[];
-	onChange: (next: string[]) => void;
-}
-
-/**
- * Reads/writes V3 trace-details pinned attributes from the user-preference
- * `span_details_pinned_attributes` (cross-device sync). Drops legacy V2-format
- * entries from the rendered set so PrettyView never tries to render an
- * un-parseable path while the migration is in flight.
- *
- * Migration of V2 → V3 format is handled separately by
- * `useMigratePinnedAttributes`.
- */
-export function useTracePinnedFields(): UseTracePinnedFieldsReturn {
-	const { userPreferences, updateUserPreferenceInContext } = useAppContext();
-	const { mutate } = useMutation(updateUserPreferenceAPI);
-
-	const value = useMemo<string[]>(() => {
-		const pref = userPreferences?.find(
-			(p) => p.name === USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
-		);
-		const arr = (pref?.value as string[] | undefined) ?? [];
-		return arr.filter(isV3PinnedAttribute);
-	}, [userPreferences]);
-
-	const onChange = useCallback(
-		(next: string[]) => {
-			const existing = userPreferences?.find(
-				(p) => p.name === USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
-			);
-			if (existing) {
-				updateUserPreferenceInContext({ ...existing, value: next });
-			}
-			mutate({
-				name: USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
-				value: next,
-			});
-		},
-		[userPreferences, updateUserPreferenceInContext, mutate],
-	);
-
-	return { value, onChange };
-}

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

@@ -29,7 +29,7 @@ export function EventTooltipContent({
 				{eventName}
 			</div>
 			<div className="event-tooltip-content__time">
-				{toFixed(time, 2)} {timeUnitName} since span start
+				{toFixed(time, 2)} {timeUnitName} from start
 			</div>
 			{Object.keys(attributeMap).length > 0 && (
 				<>

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

@@ -1,23 +1,26 @@
-// Invisible 1 px anchor mounted inside the scrollable waterfall body. Its
-// `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.
-.span-hover-card-anchor {
-	position: absolute;
-	width: 1px;
-	pointer-events: none;
+.span-hover-card-wrapper {
+	display: flex;
+	width: 100%;
+	height: 100%;
+	min-width: 0;
 }
 
 .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.
+	// Event-dot tooltip is rendered while the SpanDetailsPanel may be docked as
+	// a FloatingPanel (z-index 999); bump above the default tooltip z-index 50.
 	--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);
+
+	.ant-popover-inner {
+		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);
+	}
+
+	.ant-popover-inner-content {
+		padding: 0;
+	}
 }
 
 // Flamegraph tooltip — rendered as a portal, uses same semantic tokens.

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

@@ -1,33 +1,16 @@
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from '@signozhq/ui/tooltip';
+import { memo, ReactNode, useCallback, useRef, useState } from 'react';
+import { Popover } from 'antd';
+import { themeColors } from 'constants/theme';
 import { convertTimeToRelevantUnit } from 'container/TraceDetail/utils';
-import { useTraceContext } from 'pages/TraceDetailsV3/contexts/TraceContext';
-import { getSpanAttribute } from 'pages/TraceDetailsV3/utils';
-import { useMemo } from 'react';
+import { generateColor } from 'lib/uPlotLib/utils/generateColor';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 import { toFixed } from 'utils/toFixed';
 
 import './SpanHoverCard.styles.scss';
 
-/**
- * Span-level fields that the tooltip always shows (as the colored title or
- * one of the status/start/duration rows). Preview rows for these keys are
- * filtered out to avoid duplication.
- */
-export const RESERVED_PREVIEW_KEYS: ReadonlySet<string> = new Set([
-	'name',
-	'has_error',
-	'timestamp',
-	'duration_nano',
-]);
-
-export interface SpanPreviewRow {
-	key: string;
-	value: string;
+interface ITraceMetadata {
+	startTime: number;
+	endTime: number;
 }
 
 export interface SpanTooltipContentProps {
@@ -36,7 +19,6 @@ export interface SpanTooltipContentProps {
 	hasError: boolean;
 	relativeStartMs: number;
 	durationMs: number;
-	previewRows?: SpanPreviewRow[];
 }
 
 export function SpanTooltipContent({
@@ -45,7 +27,6 @@ export function SpanTooltipContent({
 	hasError,
 	relativeStartMs,
 	durationMs,
-	previewRows,
 }: SpanTooltipContentProps): JSX.Element {
 	const { time: formattedDuration, timeUnitName } =
 		convertTimeToRelevantUnit(durationMs);
@@ -56,118 +37,104 @@ export function SpanTooltipContent({
 				{spanName}
 			</div>
 			<div className="span-hover-card-content__row">
-				status: {hasError ? 'error' : 'ok'}
+				Status: {hasError ? 'error' : 'ok'}
 			</div>
 			<div className="span-hover-card-content__row">
-				start: {toFixed(relativeStartMs, 2)} ms
+				Start: {toFixed(relativeStartMs, 2)} ms
 			</div>
 			<div className="span-hover-card-content__row">
-				duration: {toFixed(formattedDuration, 2)} {timeUnitName}
+				Duration: {toFixed(formattedDuration, 2)} {timeUnitName}
 			</div>
-			{previewRows && previewRows.length > 0 && (
-				<div className="span-hover-card-content__preview">
-					{previewRows.map((row) => (
-						<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>
-			)}
 		</div>
 	);
 }
 
-/**
- * Single hover card anchored at a fixed X (sidebar/timeline boundary). The
- * Y of the anchor is derived from the hovered span's index in the list,
- * so the card slides vertically in place rather than jumping with the cursor.
- *
- * Mount this inside the scrollable waterfall body so `anchorTop` is in
- * content coordinates — Radix portals the content layer out automatically.
- */
-export interface SpanHoverCardProps {
-	hoveredSpanId: string | null;
-	onOpenChange: (open: boolean) => void;
-	anchorLeft: number;
-	rowHeight: number;
-	spans: SpanV3[];
-	traceStartTime: number;
+interface SpanHoverCardProps {
+	span: SpanV3;
+	traceMetadata: ITraceMetadata;
+	children: ReactNode;
 }
 
-export function SpanHoverCard({
-	hoveredSpanId,
-	onOpenChange,
-	anchorLeft,
-	rowHeight,
-	spans,
-	traceStartTime,
+/**
+ * Lazy hover card — only mounts the expensive antd Popover when the user
+ * actually hovers over the element (after a short delay). During fast scrolling,
+ * rows mount and unmount without ever creating a Popover instance, avoiding
+ * expensive DOM/effect overhead from antd Tooltip/Trigger internals.
+ */
+const SpanHoverCard = memo(function SpanHoverCard({
+	span,
+	traceMetadata,
+	children,
 }: SpanHoverCardProps): JSX.Element {
-	const { previewFields, resolveSpanColor } = useTraceContext();
+	const [showPopover, setShowPopover] = useState(false);
+	const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
-	const hoverCardData = useMemo(() => {
-		if (!hoveredSpanId) {
-			return null;
-		}
-		const idx = spans.findIndex((s) => s.span_id === hoveredSpanId);
-		if (idx === -1) {
-			return null;
-		}
-		const span = spans[idx];
-		const previewRows: SpanPreviewRow[] = previewFields
-			.filter((f) => !RESERVED_PREVIEW_KEYS.has(f.key))
-			.map((f) => {
-				const value = getSpanAttribute(span, f.key);
-				return value !== undefined && value !== ''
-					? { key: f.key, value: String(value) }
-					: null;
-			})
-			.filter((r): r is SpanPreviewRow => r !== null);
+	const handleMouseEnter = useCallback((): void => {
+		timerRef.current = setTimeout(() => {
+			setShowPopover(true);
+		}, 200);
+	}, []);
 
-		return {
-			anchorTop: idx * rowHeight,
-			tooltip: {
-				spanName: span.name,
-				color: resolveSpanColor(span),
-				hasError: span.has_error,
-				relativeStartMs: span.timestamp - traceStartTime,
-				durationMs: span.duration_nano / 1e6,
-				previewRows,
-			},
-		};
-	}, [
-		hoveredSpanId,
-		spans,
-		previewFields,
-		resolveSpanColor,
-		rowHeight,
-		traceStartTime,
-	]);
+	const handleMouseLeave = useCallback((): void => {
+		if (timerRef.current) {
+			clearTimeout(timerRef.current);
+			timerRef.current = null;
+		}
+		setShowPopover(false);
+	}, []);
+
+	if (!showPopover) {
+		return (
+			// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
+			<span
+				className="span-hover-card-wrapper"
+				onMouseEnter={handleMouseEnter}
+				onMouseLeave={handleMouseLeave}
+			>
+				{children}
+			</span>
+		);
+	}
+
+	const durationMs = span.duration_nano / 1e6;
+	const relativeStartMs = span.timestamp - traceMetadata.startTime;
+
+	let color = generateColor(
+		span['service.name'],
+		themeColors.traceDetailColorsV3,
+	);
+	if (span.has_error) {
+		color = 'var(--bg-cherry-500)';
+	}
 
 	return (
-		<TooltipProvider>
-			<Tooltip open={hoverCardData !== null} onOpenChange={onOpenChange}>
-				<TooltipTrigger asChild>
-					<div
-						className="span-hover-card-anchor"
-						style={{
-							top: hoverCardData?.anchorTop ?? 0,
-							left: anchorLeft,
-							height: rowHeight,
-						}}
-					/>
-				</TooltipTrigger>
-				<TooltipContent
-					side="right"
-					align="start"
-					sideOffset={8}
-					className="span-hover-card-popover"
-				>
-					{hoverCardData && <SpanTooltipContent {...hoverCardData.tooltip} />}
-				</TooltipContent>
-			</Tooltip>
-		</TooltipProvider>
+		<Popover
+			open
+			content={
+				<SpanTooltipContent
+					spanName={span.name}
+					color={color}
+					hasError={span.has_error}
+					relativeStartMs={relativeStartMs}
+					durationMs={durationMs}
+				/>
+			}
+			trigger="hover"
+			rootClassName="span-hover-card-popover"
+			autoAdjustOverflow
+			arrow={false}
+			onOpenChange={(open): void => {
+				if (!open) {
+					setShowPopover(false);
+				}
+			}}
+		>
+			{/* eslint-disable-next-line jsx-a11y/mouse-events-have-key-events */}
+			<span className="span-hover-card-wrapper" onMouseLeave={handleMouseLeave}>
+				{children}
+			</span>
+		</Popover>
 	);
-}
+});
+
+export default SpanHoverCard;

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

@@ -1,8 +1,3 @@
-.trace-details-header-wrapper {
-	flex-shrink: 0;
-	position: relative;
-}
-
 .trace-details-header {
 	display: flex;
 	align-items: center;
@@ -21,53 +16,13 @@
 		&.trace-v3-filter-row {
 			padding: 0;
 		}
+		max-width: 850px;
+		flex: 1;
 		min-width: 0;
-
-		&:not(&--expanded) {
-			margin-left: auto;
-		}
-
-		&--expanded {
-			max-width: none;
-			flex: 1;
-		}
 	}
 
 	&__old-view-btn {
+		margin-left: auto;
 		flex-shrink: 0;
 	}
-
-	&__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

@@ -1,27 +1,15 @@
-import { useCallback, useState } from 'react';
+import { useCallback } from 'react';
 import { useParams } from 'react-router-dom';
 import { Button } from '@signozhq/ui/button';
-import { Skeleton } from 'antd';
-import setLocalStorageKey from 'api/browser/localstorage/set';
-import HttpStatusBadge from 'components/HttpStatusBadge/HttpStatusBadge';
-import { LOCALSTORAGE } from 'constants/localStorage';
 import ROUTES from 'constants/routes';
-import { convertTimeToRelevantUnit } from 'container/TraceDetail/utils';
-import dayjs from 'dayjs';
 import history from 'lib/history';
-import { ArrowLeft, CalendarClock, Server, Timer } from '@signozhq/icons';
-import { FloatingPanel } from 'periscope/components/FloatingPanel';
+import { ArrowLeft } from '@signozhq/icons';
 import KeyValueLabel from 'periscope/components/KeyValueLabel';
 import { TraceDetailV2URLProps } from 'types/api/trace/getTraceV2';
-import { DataSource } from 'types/common/queryBuilder';
 
-import FieldsSettings from '../components/FieldsSettings/FieldsSettings';
-import { useTraceContext } from '../contexts/TraceContext';
 import Filters from '../TraceWaterfall/TraceWaterfallStates/Success/Filters/Filters';
-import TraceOptionsMenu from './TraceOptionsMenu';
 
 import './TraceDetailsHeader.styles.scss';
-import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 
 interface FilterMetadata {
 	startTime: number;
@@ -29,53 +17,20 @@ interface FilterMetadata {
 	traceId: string;
 }
 
-export interface TraceMetadataForHeader {
-	startTimestampMillis: number;
-	endTimestampMillis: number;
-	rootServiceName: string;
-	rootServiceEntryPoint: string;
-	rootSpanStatusCode: string;
-}
-
 interface TraceDetailsHeaderProps {
 	filterMetadata: FilterMetadata;
 	onFilteredSpansChange: (spanIds: string[], isFilterActive: boolean) => void;
-	isDataLoaded?: boolean;
-	traceMetadata?: TraceMetadataForHeader;
-}
-
-const SKELETON_COUNT = 3;
-
-function DetailsLoader(): JSX.Element {
-	return (
-		<>
-			{Array.from({ length: SKELETON_COUNT }).map((_, i) => (
-				<Skeleton.Input
-					// eslint-disable-next-line react/no-array-index-key
-					key={i}
-					active
-					size="small"
-					className="trace-details-header__skeleton"
-				/>
-			))}
-		</>
-	);
+	noData?: boolean;
 }
 
 function TraceDetailsHeader({
 	filterMetadata,
 	onFilteredSpansChange,
-	isDataLoaded,
-	traceMetadata,
+	noData,
 }: TraceDetailsHeaderProps): JSX.Element {
 	const { id: traceID } = useParams<TraceDetailV2URLProps>();
-	const [showTraceDetails, setShowTraceDetails] = useState(true);
-	const [isFilterExpanded, setIsFilterExpanded] = useState(false);
-	const [isPreviewFieldsOpen, setIsPreviewFieldsOpen] = useState(false);
-	const { previewFields, setPreviewFields } = useTraceContext();
 
 	const handleSwitchToOldView = useCallback((): void => {
-		setLocalStorageKey(LOCALSTORAGE.TRACE_DETAILS_PREFER_OLD_VIEW, 'true');
 		const oldUrl = `/trace-old/${traceID}${window.location.search}`;
 		history.replace(oldUrl);
 	}, [traceID]);
@@ -94,127 +49,42 @@ function TraceDetailsHeader({
 		}
 	}, []);
 
-	const handleToggleTraceDetails = useCallback((): void => {
-		setShowTraceDetails((prev) => !prev);
-	}, []);
-
-	const durationMs = traceMetadata
-		? traceMetadata.endTimestampMillis - traceMetadata.startTimestampMillis
-		: 0;
-	const { time: formattedDuration, timeUnitName } =
-		convertTimeToRelevantUnit(durationMs);
-
 	return (
-		<div className="trace-details-header-wrapper">
-			<div className="trace-details-header">
-				{!isFilterExpanded && (
-					<>
-						<Button
-							variant="solid"
-							color="secondary"
-							size="md"
-							className="trace-details-header__back-btn"
-							onClick={handlePreviousBtnClick}
-						>
-							<ArrowLeft size={14} />
-						</Button>
-						<KeyValueLabel
-							badgeKey="Trace ID"
-							badgeValue={traceID || ''}
-							maxCharacters={100}
+		<div className="trace-details-header">
+			<Button
+				variant="solid"
+				color="secondary"
+				size="sm"
+				className="trace-details-header__back-btn"
+				onClick={handlePreviousBtnClick}
+			>
+				<ArrowLeft size={14} />
+			</Button>
+			<KeyValueLabel
+				badgeKey="Trace ID"
+				badgeValue={traceID || ''}
+				maxCharacters={100}
+			/>
+			{!noData && (
+				<>
+					<div className="trace-details-header__filter">
+						<Filters
+							startTime={filterMetadata.startTime}
+							endTime={filterMetadata.endTime}
+							traceID={filterMetadata.traceId}
+							onFilteredSpansChange={onFilteredSpansChange}
 						/>
-					</>
-				)}
-				{isDataLoaded && (
-					<>
-						<div
-							className={`trace-details-header__filter${
-								isFilterExpanded ? ' trace-details-header__filter--expanded' : ''
-							}`}
-						>
-							<Filters
-								startTime={filterMetadata.startTime}
-								endTime={filterMetadata.endTime}
-								traceID={filterMetadata.traceId}
-								onFilteredSpansChange={onFilteredSpansChange}
-								isExpanded={isFilterExpanded}
-								onExpand={(): void => setIsFilterExpanded(true)}
-								onCollapse={(): void => setIsFilterExpanded(false)}
-							/>
-						</div>
-						{!isFilterExpanded && (
-							<>
-								<Button
-									variant="solid"
-									color="secondary"
-									size="sm"
-									className="trace-details-header__old-view-btn"
-									onClick={handleSwitchToOldView}
-								>
-									Old View
-								</Button>
-								<TraceOptionsMenu
-									showTraceDetails={showTraceDetails}
-									onToggleTraceDetails={handleToggleTraceDetails}
-									onOpenPreviewFields={(): void => setIsPreviewFieldsOpen(true)}
-								/>
-							</>
-						)}
-					</>
-				)}
-			</div>
-
-			{showTraceDetails && (
-				<div className="trace-details-header__sub-header">
-					{traceMetadata ? (
-						<>
-							<span className="trace-details-header__sub-item">
-								<Server size={13} />
-								{traceMetadata.rootServiceName}
-								<span className="trace-details-header__separator">—</span>
-								<span className="trace-details-header__entry-point-badge">
-									{traceMetadata.rootServiceEntryPoint}
-								</span>
-							</span>
-							<span className="trace-details-header__sub-item">
-								<Timer size={13} />
-								{parseFloat(formattedDuration.toFixed(2))} {timeUnitName}
-							</span>
-							<span className="trace-details-header__sub-item">
-								<CalendarClock size={13} />
-								{dayjs(traceMetadata.startTimestampMillis).format(
-									DATE_TIME_FORMATS.DD_MMM_YYYY_HH_MM_SS,
-								)}
-							</span>
-							{traceMetadata.rootSpanStatusCode && (
-								<HttpStatusBadge statusCode={traceMetadata.rootSpanStatusCode} />
-							)}
-						</>
-					) : (
-						<DetailsLoader />
-					)}
-				</div>
-			)}
-
-			{isPreviewFieldsOpen && (
-				<FloatingPanel
-					isOpen
-					width={350}
-					height={window.innerHeight - 100}
-					defaultPosition={{
-						x: window.innerWidth - 350 - 100,
-						y: 50,
-					}}
-					enableResizing={false}
-				>
-					<FieldsSettings
-						title="Preview fields"
-						fields={previewFields}
-						onFieldsChange={setPreviewFields}
-						onClose={(): void => setIsPreviewFieldsOpen(false)}
-						dataSource={DataSource.TRACES}
-					/>
-				</FloatingPanel>
+					</div>
+					<Button
+						variant="solid"
+						color="secondary"
+						size="sm"
+						className="trace-details-header__old-view-btn"
+						onClick={handleSwitchToOldView}
+					>
+						Old View
+					</Button>
+				</>
 			)}
 		</div>
 	);

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

@@ -1,93 +0,0 @@
-import { useMemo } from 'react';
-import type { MenuItem } from '@signozhq/ui/dropdown-menu';
-import { Button } from '@signozhq/ui/button';
-import { DropdownMenuSimple as Dropdown } from '@signozhq/ui/dropdown-menu';
-import { Ellipsis } from '@signozhq/icons';
-
-import { useTraceContext } from '../contexts/TraceContext';
-
-interface TraceOptionsMenuProps {
-	showTraceDetails: boolean;
-	onToggleTraceDetails: () => void;
-	onOpenPreviewFields: () => void;
-}
-
-function TraceOptionsMenu({
-	showTraceDetails,
-	onToggleTraceDetails,
-	onOpenPreviewFields,
-}: TraceOptionsMenuProps): JSX.Element {
-	const { colorByField, setColorByField, availableColorByOptions } =
-		useTraceContext();
-
-	const menuItems: MenuItem[] = useMemo(() => {
-		const items: MenuItem[] = [
-			{
-				key: 'toggle-trace-details',
-				label: showTraceDetails ? 'Hide trace details' : 'Show trace details',
-				onClick: onToggleTraceDetails,
-			},
-			{
-				key: 'preview-fields',
-				label: 'Preview fields',
-				onClick: onOpenPreviewFields,
-			},
-		];
-
-		// Only show the "Colour by" submenu if there's an actual choice to make.
-		if (availableColorByOptions.length > 1) {
-			items.push({
-				key: 'colour-by',
-				label: 'Colour by',
-				children: [
-					{
-						type: 'group',
-						label: 'COLOUR BY',
-						children: [
-							{
-								type: 'radio-group',
-								value: colorByField.name,
-								onChange: (name: string): void => {
-									const next = availableColorByOptions.find(
-										(o) => o.field.name === name,
-									);
-									if (next) {
-										setColorByField(next.field);
-									}
-								},
-								children: availableColorByOptions.map((opt) => ({
-									type: 'radio',
-									key: opt.field.name,
-									label: opt.label,
-									value: opt.field.name,
-								})),
-							},
-						],
-					},
-				],
-			});
-		}
-
-		return items;
-	}, [
-		showTraceDetails,
-		onToggleTraceDetails,
-		onOpenPreviewFields,
-		colorByField.name,
-		setColorByField,
-		availableColorByOptions,
-	]);
-
-	return (
-		<Dropdown menu={{ items: menuItems }}>
-			<Button
-				variant="solid"
-				color="secondary"
-				size="sm"
-				prefix={<Ellipsis size={14} />}
-			/>
-		</Dropdown>
-	);
-}
-
-export default TraceOptionsMenu;

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

@@ -48,10 +48,6 @@
 		color: var(--l2-foreground);
 	}
 
-	&__collapse-count-errors {
-		color: var(--destructive);
-	}
-
 	&__flame-collapse {
 		flex-shrink: 0;
 

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

@@ -214,7 +214,6 @@ function FlamegraphCanvas(props: FlamegraphCanvasProps): JSX.Element {
 							hasError={tooltipContent.status === 'error'}
 							relativeStartMs={tooltipContent.startMs}
 							durationMs={tooltipContent.durationMs}
-							previewRows={tooltipContent.previewRows}
 						/>
 					)}
 				</div>,

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

@@ -5,13 +5,7 @@ import useGetTraceFlamegraph from 'hooks/trace/useGetTraceFlamegraph';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { TraceDetailFlamegraphURLProps } from 'types/api/trace/getTraceFlamegraph';
 
-import { COLOR_BY_FIELDS } from '../constants';
-import { useTraceContext } from '../contexts/TraceContext';
 import Error from '../TraceWaterfall/TraceWaterfallStates/Error/Error';
-import {
-	mergeTelemetryFieldKeys,
-	toTelemetryFieldKey,
-} from '../utils/previewFields';
 import { FLAMEGRAPH_SPAN_LIMIT } from './constants';
 import FlamegraphCanvas from './FlamegraphCanvas';
 import { useVisualLayoutWorker } from './hooks/useVisualLayoutWorker';
@@ -50,19 +44,6 @@ function TraceFlamegraph({
 		[history, search],
 	);
 
-	const { previewFields } = useTraceContext();
-
-	// Color-by fields baseline + user-picked preview fields. De-duped by `name`,
-	// color-by entries first so their canonical metadata wins on collision.
-	const flamegraphSelectFields = useMemo(
-		() =>
-			mergeTelemetryFieldKeys(
-				COLOR_BY_FIELDS,
-				previewFields.map(toTelemetryFieldKey),
-			),
-		[previewFields],
-	);
-
 	const {
 		data,
 		isFetching,
@@ -71,7 +52,6 @@ function TraceFlamegraph({
 		traceId,
 		// selectedSpanId: firstSpanAtFetchLevel,
 		limit: FLAMEGRAPH_SPAN_LIMIT,
-		selectFields: flamegraphSelectFields,
 	});
 
 	const spans = useMemo(

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/__tests__/useFlamegraphHover.test.ts

@@ -1,25 +1,15 @@
-import React from 'react';
+import type React from 'react';
 import { act, renderHook } from '@testing-library/react';
-import { AllTheProviders } from 'tests/test-utils';
 
-import { TraceProvider } from '../../contexts/TraceContext';
 import { useFlamegraphHover } from '../hooks/useFlamegraphHover';
 import type { SpanRect } from '../types';
 import { MOCK_SPAN, MOCK_TRACE_METADATA } from './testUtils';
 
-function wrapper({ children }: { children: React.ReactNode }): JSX.Element {
-	return (
-		<AllTheProviders>
-			<TraceProvider aggregations={undefined}>{children}</TraceProvider>
-		</AllTheProviders>
-	);
-}
-
 function createMockCanvas(): HTMLCanvasElement {
 	const canvas = document.createElement('canvas');
 	canvas.width = 800;
 	canvas.height = 400;
-	jest.spyOn(canvas, 'getBoundingClientRect').mockImplementation(
+	canvas.getBoundingClientRect = jest.fn(
 		(): DOMRect =>
 			({
 				left: 0,
@@ -69,9 +59,7 @@ describe('useFlamegraphHover', () => {
 	});
 
 	it('sets hoveredSpanId and tooltipContent when hovering on span', () => {
-		const { result } = renderHook(() => useFlamegraphHover(defaultArgs), {
-			wrapper,
-		});
+		const { result } = renderHook(() => useFlamegraphHover(defaultArgs));
 
 		act(() => {
 			result.current.handleHoverMouseMove({
@@ -88,9 +76,7 @@ describe('useFlamegraphHover', () => {
 	});
 
 	it('clears hover when moving to empty area', () => {
-		const { result } = renderHook(() => useFlamegraphHover(defaultArgs), {
-			wrapper,
-		});
+		const { result } = renderHook(() => useFlamegraphHover(defaultArgs));
 
 		act(() => {
 			result.current.handleHoverMouseMove({
@@ -113,9 +99,7 @@ describe('useFlamegraphHover', () => {
 	});
 
 	it('clears hover on mouse leave', () => {
-		const { result } = renderHook(() => useFlamegraphHover(defaultArgs), {
-			wrapper,
-		});
+		const { result } = renderHook(() => useFlamegraphHover(defaultArgs));
 
 		act(() => {
 			result.current.handleHoverMouseMove({
@@ -133,9 +117,7 @@ describe('useFlamegraphHover', () => {
 	});
 
 	it('suppresses click when drag distance exceeds threshold', () => {
-		const { result } = renderHook(() => useFlamegraphHover(defaultArgs), {
-			wrapper,
-		});
+		const { result } = renderHook(() => useFlamegraphHover(defaultArgs));
 
 		act(() => {
 			result.current.handleMouseDownForClick({
@@ -155,9 +137,7 @@ describe('useFlamegraphHover', () => {
 	});
 
 	it('calls onSpanClick when clicking on span', () => {
-		const { result } = renderHook(() => useFlamegraphHover(defaultArgs), {
-			wrapper,
-		});
+		const { result } = renderHook(() => useFlamegraphHover(defaultArgs));
 
 		act(() => {
 			result.current.handleClick({
@@ -170,9 +150,7 @@ describe('useFlamegraphHover', () => {
 	});
 
 	it('uses clientX/clientY for tooltip positioning', () => {
-		const { result } = renderHook(() => useFlamegraphHover(defaultArgs), {
-			wrapper,
-		});
+		const { result } = renderHook(() => useFlamegraphHover(defaultArgs));
 
 		act(() => {
 			result.current.handleHoverMouseMove({
@@ -186,9 +164,7 @@ describe('useFlamegraphHover', () => {
 	});
 
 	it('does not update hover during drag', () => {
-		const { result } = renderHook(() => useFlamegraphHover(defaultArgs), {
-			wrapper,
-		});
+		const { result } = renderHook(() => useFlamegraphHover(defaultArgs));
 		defaultArgs.isDraggingRef.current = true;
 
 		act(() => {

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/__tests__/utils.presentation.test.ts

@@ -1,6 +1,4 @@
-import { TelemetryFieldKey } from 'types/api/v5/queryRange';
-
-import { getFlamegraphSpanGroupValue, getSpanColor } from '../utils';
+import { getSpanColor } from '../utils';
 import { MOCK_SPAN } from './testUtils';
 
 const mockGenerateColor = jest.fn();
@@ -10,17 +8,6 @@ jest.mock('lib/uPlotLib/utils/generateColor', () => ({
 		mockGenerateColor(key, colorMap),
 }));
 
-const SERVICE_FIELD: TelemetryFieldKey = {
-	name: 'service.name',
-	fieldContext: 'resource',
-	fieldDataType: 'string',
-};
-const HOST_FIELD: TelemetryFieldKey = {
-	name: 'host.name',
-	fieldContext: 'resource',
-	fieldDataType: 'string',
-};
-
 describe('Presentation / Styling Utils', () => {
 	beforeEach(() => {
 		jest.clearAllMocks();
@@ -28,17 +15,16 @@ describe('Presentation / Styling Utils', () => {
 	});
 
 	describe('getSpanColor', () => {
-		it('uses generated colour from groupValue for normal span', () => {
+		it('uses generated service color for normal span', () => {
 			mockGenerateColor.mockReturnValue('#1890ff');
 
 			const color = getSpanColor({
 				span: { ...MOCK_SPAN, hasError: false },
 				isDarkMode: false,
-				groupValue: 'my-bucket',
 			});
 
 			expect(mockGenerateColor).toHaveBeenCalledWith(
-				'my-bucket',
+				MOCK_SPAN.serviceName,
 				expect.any(Object),
 			);
 			expect(color).toBe('#1890ff');
@@ -50,7 +36,6 @@ describe('Presentation / Styling Utils', () => {
 			const color = getSpanColor({
 				span: { ...MOCK_SPAN, hasError: true },
 				isDarkMode: false,
-				groupValue: 'my-bucket',
 			});
 
 			expect(color).toBe('rgb(220, 38, 38)');
@@ -62,50 +47,21 @@ describe('Presentation / Styling Utils', () => {
 			const color = getSpanColor({
 				span: { ...MOCK_SPAN, hasError: true },
 				isDarkMode: true,
-				groupValue: 'my-bucket',
 			});
 
 			expect(color).toBe('rgb(239, 68, 68)');
 		});
-	});
 
-	describe('getFlamegraphSpanGroupValue', () => {
-		it('returns resource[field.name] when present', () => {
-			const value = getFlamegraphSpanGroupValue(
-				{
-					serviceName: 'legacy',
-					resource: { 'service.name': 'svc-from-resource' },
-				},
-				SERVICE_FIELD,
-			);
-			expect(value).toBe('svc-from-resource');
-		});
+		it('passes serviceName to generateColor', () => {
+			getSpanColor({
+				span: { ...MOCK_SPAN, serviceName: 'my-service' },
+				isDarkMode: false,
+			});
 
-		it('falls back to top-level serviceName for service.name when resource is empty', () => {
-			const value = getFlamegraphSpanGroupValue(
-				{ serviceName: 'svc-legacy', resource: {} },
-				SERVICE_FIELD,
+			expect(mockGenerateColor).toHaveBeenCalledWith(
+				'my-service',
+				expect.any(Object),
 			);
-			expect(value).toBe('svc-legacy');
-		});
-
-		it('returns "unknown" for non-service fields when resource is missing', () => {
-			const value = getFlamegraphSpanGroupValue(
-				{ serviceName: 'svc', resource: {} },
-				HOST_FIELD,
-			);
-			expect(value).toBe('unknown');
-		});
-
-		it('reads host.name from resource when present', () => {
-			const value = getFlamegraphSpanGroupValue(
-				{
-					serviceName: 'svc',
-					resource: { 'host.name': 'host-1' },
-				},
-				HOST_FIELD,
-			);
-			expect(value).toBe('host-1');
 		});
 	});
 });

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/computeVisualLayout.ts

@@ -6,9 +6,6 @@ export interface ConnectorLine {
 	childRow: number;
 	timestampMs: number;
 	serviceName: string;
-	// Snapshot of the child span's resource so draw-time can resolve the
-	// `colorByField` group value without crossing the worker boundary.
-	resource?: Record<string, string>;
 }
 
 export interface VisualLayout {
@@ -360,7 +357,6 @@ export function computeVisualLayout(spans: FlamegraphSpan[][]): VisualLayout {
 				childRow,
 				timestampMs: child.timestamp,
 				serviceName: child.serviceName,
-				resource: child.resource,
 			});
 		}
 	}

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/hooks/useFlamegraphDraw.ts

@@ -1,9 +1,7 @@
 import React, { RefObject, useCallback, useMemo, useRef } from 'react';
 import { themeColors } from 'constants/theme';
 import { generateColor } from 'lib/uPlotLib/utils/generateColor';
-import { useTraceContext } from 'pages/TraceDetailsV3/contexts/TraceContext';
 import { FlamegraphSpan } from 'types/api/trace/getTraceFlamegraph';
-import { TelemetryFieldKey } from 'types/api/v5/queryRange';
 
 import { ConnectorLine } from '../computeVisualLayout';
 import { EventRect, SpanRect } from '../types';
@@ -12,7 +10,6 @@ import {
 	drawSpanBar,
 	FlamegraphRowMetrics,
 	getFlamegraphRowMetrics,
-	getFlamegraphSpanGroupValue,
 	getSpanColor,
 } from '../utils';
 
@@ -54,7 +51,6 @@ interface DrawLevelArgs {
 	selectedSpanId: string | undefined;
 	hoveredSpanId: string;
 	isDarkMode: boolean;
-	colorByField: TelemetryFieldKey;
 	spanRectsArray: SpanRect[];
 	eventRectsArray: EventRect[];
 	metrics: FlamegraphRowMetrics;
@@ -75,7 +71,6 @@ function drawLevel(args: DrawLevelArgs): void {
 		selectedSpanId,
 		hoveredSpanId,
 		isDarkMode,
-		colorByField,
 		spanRectsArray,
 		eventRectsArray,
 		metrics,
@@ -117,8 +112,7 @@ function drawLevel(args: DrawLevelArgs): void {
 		// Minimum 1px width so tiny spans remain visible
 		width = clamp(width, 1, Infinity);
 
-		const groupValue = getFlamegraphSpanGroupValue(span, colorByField);
-		const color = getSpanColor({ span, isDarkMode, groupValue });
+		const color = getSpanColor({ span, isDarkMode });
 
 		const isDimmedByFilter =
 			!!isFilterActiveInLevel &&
@@ -154,7 +148,6 @@ interface DrawConnectorLinesArgs {
 	cssWidth: number;
 	viewportHeight: number;
 	metrics: FlamegraphRowMetrics;
-	colorByField: TelemetryFieldKey;
 }
 
 function drawConnectorLines(args: DrawConnectorLinesArgs): void {
@@ -167,7 +160,6 @@ function drawConnectorLines(args: DrawConnectorLinesArgs): void {
 		cssWidth,
 		viewportHeight,
 		metrics,
-		colorByField,
 	} = args;
 
 	ctx.save();
@@ -193,11 +185,10 @@ function drawConnectorLines(args: DrawConnectorLinesArgs): void {
 			continue;
 		}
 
-		const groupValue = getFlamegraphSpanGroupValue(
-			{ serviceName: conn.serviceName, resource: conn.resource },
-			colorByField,
+		const color = generateColor(
+			conn.serviceName,
+			themeColors.traceDetailColorsV3,
 		);
-		const color = generateColor(groupValue, themeColors.traceDetailColorsV3);
 		ctx.strokeStyle = color;
 
 		const x = clamp(xFrac * cssWidth, 0, cssWidth);
@@ -237,10 +228,11 @@ export function useFlamegraphDraw(
 	const eventRectsRefInternal = useRef<EventRect[]>([]);
 	const eventRectsRef = eventRectsRefProp ?? eventRectsRefInternal;
 
-	const { colorByField } = useTraceContext();
-
 	const filteredSpanIdsSet = useMemo(
-		() => (isFilterActive && filteredSpanIds ? new Set(filteredSpanIds) : null),
+		() =>
+			isFilterActive && filteredSpanIds && filteredSpanIds.length > 0
+				? new Set(filteredSpanIds)
+				: null,
 		[filteredSpanIds, isFilterActive],
 	);
 
@@ -293,7 +285,6 @@ export function useFlamegraphDraw(
 			cssWidth,
 			viewportHeight,
 			metrics,
-			colorByField,
 		});
 
 		const spanRectsArray: SpanRect[] = [];
@@ -318,7 +309,6 @@ export function useFlamegraphDraw(
 				selectedSpanId,
 				hoveredSpanId,
 				isDarkMode,
-				colorByField,
 				spanRectsArray,
 				eventRectsArray,
 				metrics,
@@ -345,7 +335,6 @@ export function useFlamegraphDraw(
 		hoveredSpanId,
 		hoveredEventKey,
 		isDarkMode,
-		colorByField,
 		filteredSpanIdsSet,
 		isFilterActive,
 	]);

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/hooks/useFlamegraphHover.ts

@@ -8,18 +8,11 @@ import {
 	useRef,
 	useState,
 } from 'react';
-import { useTraceContext } from 'pages/TraceDetailsV3/contexts/TraceContext';
-import { RESERVED_PREVIEW_KEYS } from 'pages/TraceDetailsV3/SpanHoverCard/SpanHoverCard';
-import { getSpanAttribute } from 'pages/TraceDetailsV3/utils';
 import { FlamegraphSpan } from 'types/api/trace/getTraceFlamegraph';
 
 import { EventRect, SpanRect } from '../types';
 import { ITraceMetadata } from '../types';
-import {
-	getFlamegraphServiceName,
-	getFlamegraphSpanGroupValue,
-	getSpanColor,
-} from '../utils';
+import { getSpanColor } from '../utils';
 
 function getCanvasPointer(
 	canvas: HTMLCanvasElement,
@@ -76,11 +69,6 @@ export interface EventTooltipData {
 	attributeMap: Record<string, string>;
 }
 
-export interface SpanPreviewRowData {
-	key: string;
-	value: string;
-}
-
 export interface TooltipContent {
 	serviceName: string;
 	spanName: string;
@@ -90,7 +78,6 @@ export interface TooltipContent {
 	clientX: number;
 	clientY: number;
 	spanColor: string;
-	previewRows?: SpanPreviewRowData[];
 	event?: EventTooltipData;
 }
 
@@ -138,25 +125,6 @@ export function useFlamegraphHover(
 		null,
 	);
 
-	const { colorByField, previewFields } = useTraceContext();
-
-	const buildPreviewRows = useCallback(
-		(span: FlamegraphSpan): SpanPreviewRowData[] =>
-			previewFields
-				.filter((field) => !RESERVED_PREVIEW_KEYS.has(field.key))
-				.map((field) => {
-					const value = getSpanAttribute(
-						{ resource: span.resource, attributes: span.attributes },
-						field.key,
-					);
-					return value !== undefined && value !== ''
-						? { key: field.key, value: String(value) }
-						: null;
-				})
-				.filter((r): r is SpanPreviewRowData => r !== null),
-		[previewFields],
-	);
-
 	const isZoomed =
 		viewStartTs !== traceMetadata.startTime ||
 		viewEndTs !== traceMetadata.endTime;
@@ -203,18 +171,14 @@ export function useFlamegraphHover(
 				setHoveredEventKey(`${span.spanId}-${event.name}-${event.timeUnixNano}`);
 				setHoveredSpanId(span.spanId);
 				setTooltipContent({
-					serviceName: getFlamegraphServiceName(span),
+					serviceName: span.serviceName || '',
 					spanName: span.name || 'unknown',
 					status: span.hasError ? 'error' : 'ok',
 					startMs: span.timestamp - traceMetadata.startTime,
 					durationMs: span.durationNano / 1e6,
 					clientX: e.clientX,
 					clientY: e.clientY,
-					spanColor: getSpanColor({
-						span,
-						isDarkMode,
-						groupValue: getFlamegraphSpanGroupValue(span, colorByField),
-					}),
+					spanColor: getSpanColor({ span, isDarkMode }),
 					event: {
 						name: event.name,
 						timeOffsetMs: eventTimeMs - span.timestamp,
@@ -236,19 +200,14 @@ export function useFlamegraphHover(
 				setHoveredEventKey(null);
 				setHoveredSpanId(span.spanId);
 				setTooltipContent({
-					serviceName: getFlamegraphServiceName(span),
+					serviceName: span.serviceName || '',
 					spanName: span.name || 'unknown',
 					status: span.hasError ? 'error' : 'ok',
 					startMs: span.timestamp - traceMetadata.startTime,
 					durationMs: span.durationNano / 1e6,
 					clientX: e.clientX,
 					clientY: e.clientY,
-					spanColor: getSpanColor({
-						span,
-						isDarkMode,
-						groupValue: getFlamegraphSpanGroupValue(span, colorByField),
-					}),
-					previewRows: buildPreviewRows(span),
+					spanColor: getSpanColor({ span, isDarkMode }),
 				});
 				updateCursor(canvas, span);
 			} else {
@@ -266,8 +225,6 @@ export function useFlamegraphHover(
 			isDraggingRef,
 			updateCursor,
 			isDarkMode,
-			colorByField,
-			buildPreviewRows,
 		],
 	);
 

frontend/src/pages/TraceDetailsV3/TraceFlamegraph/utils.ts

@@ -2,9 +2,7 @@
 import { themeColors } from 'constants/theme';
 import { convertTimeToRelevantUnit } from 'container/TraceDetail/utils';
 import { generateColor } from 'lib/uPlotLib/utils/generateColor';
-import { getSpanAttribute } from 'pages/TraceDetailsV3/utils';
 import { FlamegraphSpan } from 'types/api/trace/getTraceFlamegraph';
-import { TelemetryFieldKey } from 'types/api/v5/queryRange';
 
 import {
 	DASHED_BORDER_LINE_DASH,
@@ -68,47 +66,14 @@ export function getFlamegraphRowMetrics(
 	};
 }
 
-/**
- * Resolve the displayed service.name for a flamegraph span. Used by tooltips
- * (service identity, independent of the active colour-by field). Prefers
- * `resource['service.name']` with legacy top-level `serviceName` fallback.
- */
-export function getFlamegraphServiceName(
-	span: Pick<FlamegraphSpan, 'serviceName' | 'resource' | 'attributes'>,
-): string {
-	return getSpanAttribute(span, 'service.name') || span.serviceName || '';
-}
-
-/**
- * Resolve the value used to bucket a flamegraph span by colour for the given
- * field. Prefers `resource[field.name]` (new contract from `selectFields`).
- * For `service.name`, falls back to the legacy top-level `serviceName` when
- * resource is empty (backward-compat with backends that haven't shipped
- * `selectFields` yet). For other fields, falls back to `'unknown'`.
- */
-export function getFlamegraphSpanGroupValue(
-	span: Pick<FlamegraphSpan, 'serviceName' | 'resource' | 'attributes'>,
-	field: TelemetryFieldKey,
-): string {
-	const fromAttribute = getSpanAttribute(span, field.name);
-	if (fromAttribute) {
-		return fromAttribute;
-	}
-	if (field.name === 'service.name') {
-		return span.serviceName || 'unknown';
-	}
-	return 'unknown';
-}
-
 interface GetSpanColorArgs {
 	span: FlamegraphSpan;
 	isDarkMode: boolean;
-	groupValue: string;
 }
 
 export function getSpanColor(args: GetSpanColorArgs): string {
-	const { span, isDarkMode, groupValue } = args;
-	let color = generateColor(groupValue, themeColors.traceDetailColorsV3);
+	const { span, isDarkMode } = args;
+	let color = generateColor(span.serviceName, themeColors.traceDetailColorsV3);
 
 	if (span.hasError) {
 		color = isDarkMode ? 'rgb(239, 68, 68)' : 'rgb(220, 38, 38)';
@@ -246,7 +211,7 @@ export function drawSpanBar(args: DrawSpanBarArgs): void {
 	// Alpha is applied to bar + events only; label is drawn after restoring alpha to 1
 	// so text stays readable against the faded bar.
 	if (shouldDim) {
-		ctx.globalAlpha = 0.15;
+		ctx.globalAlpha = 0.4;
 	}
 
 	ctx.beginPath();

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

@@ -11,10 +11,14 @@ import NoData from './TraceWaterfallStates/NoData/NoData';
 import Success from './TraceWaterfallStates/Success/Success';
 import { getVisibleSpans } from './utils';
 
-import { IInterestedSpan } from './types';
-
 import './TraceWaterfall.styles.scss';
 
+export interface IInterestedSpan {
+	spanId: string;
+	isUncollapsed: boolean;
+	scrollToSpan?: boolean;
+}
+
 interface ITraceWaterfallProps {
 	traceId: string;
 	uncollapsedNodes: string[];

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

@@ -3,114 +3,18 @@
 	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 {
+		.ant-typography {
 			display: flex;
 			align-items: center;
-			margin: auto;
 			color: var(--l2-foreground);
 			font-family: 'Geist Mono';
 			font-size: 12px;
@@ -126,20 +30,14 @@
 		}
 	}
 
-	.filter-status {
+	.no-results {
 		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

@@ -1,46 +1,19 @@
-import { useCallback, useRef, useState } from 'react';
+import { useCallback, useState } from 'react';
 import { useHistory, useLocation } from 'react-router-dom';
-import { useCopyToClipboard } from 'react-use';
-import {
-	ChevronDown,
-	ChevronUp,
-	Copy,
-	Info,
-	Loader,
-	Search,
-	X,
-} from '@signozhq/icons';
-import { Switch } from '@signozhq/ui/switch';
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/ui/toggle-group';
-import { toast } from '@signozhq/ui/sonner';
-import { Button } from '@signozhq/ui/button';
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from '@signozhq/ui/tooltip';
+import { Button, Spin, Tooltip } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
 import { AxiosError } from 'axios';
-import QuerySearch from 'components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch';
-import { convertExpressionToFilters } from 'components/QueryBuilderV2/utils';
 import { DEFAULT_ENTITY_VERSION } from 'constants/app';
 import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
+import QueryBuilderSearchV2 from 'container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2';
 import { useGetQueryRange } from 'hooks/queryBuilder/useGetQueryRange';
 import { uniqBy } from 'lodash-es';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { Query, TagFilter } from 'types/api/queryBuilder/queryBuilderData';
-import {
-	DataSource,
-	TracesAggregatorOperator,
-} from 'types/common/queryBuilder';
+import { TracesAggregatorOperator } from 'types/common/queryBuilder';
+import { LoaderCircle, Info, ChevronDown, ChevronUp } from '@signozhq/icons';
 
 import { BASE_FILTER_QUERY } from './constants';
-import { useHighlightErrors } from './hooks/useHighlightErrors';
-import {
-	SpanCategory,
-	useSpanCategoryFilter,
-} from './hooks/useSpanCategoryFilter';
 
 import './Filters.styles.scss';
 
@@ -71,7 +44,6 @@ function prepareQuery(filters: TagFilter, traceID: string): Query {
 							},
 						],
 					},
-					selectColumns: [],
 				},
 			],
 		},
@@ -83,87 +55,31 @@ function Filters({
 	endTime,
 	traceID,
 	onFilteredSpansChange = (): void => {},
-	isExpanded,
-	onExpand,
-	onCollapse,
 }: {
 	startTime: number;
 	endTime: number;
 	traceID: string;
 	onFilteredSpansChange?: (spanIds: string[], isFilterActive: boolean) => void;
-	isExpanded: boolean;
-	onExpand: () => void;
-	onCollapse: () => void;
 }): JSX.Element {
-	const [, setCopy] = useCopyToClipboard();
 	const [filters, setFilters] = useState<TagFilter>(
 		BASE_FILTER_QUERY.filters || { items: [], op: 'AND' },
 	);
-	const [expression, setExpression] = useState<string>('');
 	const [noData, setNoData] = useState<boolean>(false);
 	const [filteredSpanIds, setFilteredSpanIds] = useState<string[]>([]);
 	const [currentSearchedIndex, setCurrentSearchedIndex] = useState<number>(0);
-	const expressionRef = useRef<string>('');
-	const containerRef = useRef<HTMLDivElement>(null);
 
-	const runQuery = useCallback(
-		(value: string): void => {
-			const items = convertExpressionToFilters(value);
-			setFilters({ items, op: 'AND' });
-			// Clear results when expression produces no filters
-			if (items.length === 0) {
+	const handleFilterChange = useCallback(
+		(value: TagFilter): void => {
+			if (value.items.length === 0) {
 				setFilteredSpanIds([]);
 				onFilteredSpansChange?.([], false);
 				setCurrentSearchedIndex(0);
 				setNoData(false);
 			}
+			setFilters(value);
 		},
 		[onFilteredSpansChange],
 	);
-
-	// onChange fires on every keystroke — only store the expression, don't trigger API
-	const handleExpressionChange = useCallback(
-		(value: string): void => {
-			setExpression(value);
-			expressionRef.current = value;
-			// Clear results when expression is emptied
-			if (!value.trim()) {
-				setFilters({ items: [], op: 'AND' });
-				setFilteredSpanIds([]);
-				onFilteredSpansChange?.([], false);
-				setCurrentSearchedIndex(0);
-				setNoData(false);
-			}
-		},
-		[onFilteredSpansChange],
-	);
-
-	// onRun fires on Ctrl+Enter
-	const handleRunQuery = useCallback(
-		(value: string): void => {
-			runQuery(value);
-		},
-		[runQuery],
-	);
-
-	// Run query on blur (click outside the filter input)
-	const handleBlur = useCallback((): void => {
-		runQuery(expressionRef.current);
-	}, [runQuery]);
-
-	// Expression-based filter hooks
-	const filterProps = {
-		expression,
-		filters,
-		setExpression,
-		expressionRef,
-		runQuery,
-	};
-	const { isHighlightErrors, handleToggle: handleToggleHighlightErrors } =
-		useHighlightErrors(filterProps);
-	const { selectedCategory, categories, handleCategoryChange } =
-		useSpanCategoryFilter(filterProps);
-
 	const { search } = useLocation();
 	const history = useHistory();
 
@@ -194,14 +110,14 @@ function Filters({
 			tableParams: {
 				pagination: {
 					offset: 0,
-					limit: 10000,
+					limit: 200,
 				},
 				selectColumns: [
 					{
-						key: 'spanID',
+						key: 'name',
 						dataType: 'string',
 						type: 'tag',
-						id: 'spanId--string--tag--true',
+						id: 'name--string--tag--true',
 						isIndexed: false,
 					},
 				],
@@ -231,187 +147,58 @@ function Filters({
 					setCurrentSearchedIndex(0);
 				}
 			},
-			onError: () => {
-				const isFilterActive = filters.items.length > 0;
-				setNoData(false);
-				setFilteredSpanIds([]);
-				onFilteredSpansChange?.([], isFilterActive);
-				setCurrentSearchedIndex(0);
-			},
 		},
 	);
 
-	const highlightErrorsToggle = (
-		<div className="highlight-errors-toggle">
-			<Typography.Text>Highlight errors</Typography.Text>
-			<Switch
-				color="cherry"
-				value={isHighlightErrors}
-				onChange={handleToggleHighlightErrors}
-			/>
-		</div>
-	);
-
-	const statusIndicators = (
-		<>
-			{isFetching && <Loader className="animate-spin" />}
-			{error && (
-				<Tooltip>
-					<TooltipTrigger asChild>
-						<span className="filter-status filter-status--error">
-							<Info />
-							API error
-						</span>
-					</TooltipTrigger>
-					<TooltipContent>
-						{(error as AxiosError)?.message || 'Something went wrong'}
-					</TooltipContent>
-				</Tooltip>
-			)}
-			{!error && noData && (
-				<Typography.Text className="filter-status">
-					No results found
-				</Typography.Text>
-			)}
-		</>
-	);
-
-	// --- COLLAPSED VIEW ---
-	if (!isExpanded) {
-		const pill = (
-			/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */
-			<div className="filter-pill" onClick={onExpand}>
-				<Search size={12} />
-				<span className="filter-pill__text">{expression || 'Search...'}</span>
-				{expression && <span className="filter-pill__indicator" />}
-			</div>
-		);
-
-		return (
-			<TooltipProvider>
-				<div className="trace-v3-filter-row collapsed">
-					{expression ? (
-						<Tooltip>
-							<TooltipTrigger asChild>{pill}</TooltipTrigger>
-							<TooltipContent side="bottom" align="start">
-								<div className="filter-pill-popover">
-									<div className="filter-pill-popover__header">
-										<Typography.Text>Search query</Typography.Text>
-										<Button
-											variant="ghost"
-											size="icon"
-											color="secondary"
-											onClick={(): void => {
-												setCopy(expression);
-												toast.success('Copied to clipboard', {
-													richColors: false,
-													position: 'top-right',
-												});
-											}}
-										>
-											<Copy size={12} />
-										</Button>
-									</div>
-									<div className="filter-pill-popover__expression">{expression}</div>
-								</div>
-							</TooltipContent>
-						</Tooltip>
-					) : (
-						pill
-					)}
-					{highlightErrorsToggle}
-					{statusIndicators}
-				</div>
-			</TooltipProvider>
-		);
-	}
-
-	// --- EXPANDED VIEW ---
 	return (
-		<TooltipProvider>
-			<div className="trace-v3-filter-row expanded">
-				<ToggleGroup
-					type="single"
-					value={selectedCategory}
-					onChange={(value): void => {
-						if (value) {
-							handleCategoryChange(value as SpanCategory);
-						}
-					}}
-					size="sm"
-				>
-					{categories.map((category) => (
-						<ToggleGroupItem key={category} value={category}>
-							{category}
-						</ToggleGroupItem>
-					))}
-				</ToggleGroup>
-				{/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}
-				<div
-					className="filter-search-container"
-					ref={containerRef}
-					onBlur={(e): void => {
-						if (!containerRef.current?.contains(e.relatedTarget as Node)) {
-							handleBlur();
-						}
-					}}
-				>
-					<QuerySearch
-						queryData={{
-							...BASE_FILTER_QUERY,
-							filters,
-							filter: { expression },
+		<div className="trace-v3-filter-row">
+			<QueryBuilderSearchV2
+				query={{
+					...BASE_FILTER_QUERY,
+					filters,
+				}}
+				onChange={handleFilterChange}
+				hideSpanScopeSelector={false}
+				skipQueryBuilderRedirect
+				selectProps={{ listHeight: 125 }}
+			/>
+			{filteredSpanIds.length > 0 && (
+				<div className="pre-next-toggle">
+					<Typography.Text>
+						{currentSearchedIndex + 1} / {filteredSpanIds.length}
+					</Typography.Text>
+					<Button
+						icon={<ChevronUp size={14} />}
+						disabled={currentSearchedIndex === 0}
+						type="text"
+						onClick={(): void => {
+							handlePrevNext(currentSearchedIndex - 1);
+							setCurrentSearchedIndex((prev) => prev - 1);
+						}}
+					/>
+					<Button
+						icon={<ChevronDown size={14} />}
+						type="text"
+						disabled={currentSearchedIndex === filteredSpanIds.length - 1}
+						onClick={(): void => {
+							handlePrevNext(currentSearchedIndex + 1);
+							setCurrentSearchedIndex((prev) => prev + 1);
 						}}
-						onChange={handleExpressionChange}
-						onRun={handleRunQuery}
-						dataSource={DataSource.TRACES}
-						placeholder="Enter your filter query (e.g., http.status_code >= 500 AND service.name = 'frontend')"
 					/>
 				</div>
-				{filteredSpanIds.length > 0 && (
-					<div className="pre-next-toggle">
-						<Typography.Text className="pre-next-toggle__count">
-							{currentSearchedIndex + 1} / {filteredSpanIds.length}
-						</Typography.Text>
-						<Button
-							variant="ghost"
-							size="icon"
-							color="secondary"
-							disabled={currentSearchedIndex === 0}
-							onClick={(): void => {
-								handlePrevNext(currentSearchedIndex - 1);
-								setCurrentSearchedIndex((prev) => prev - 1);
-							}}
-						>
-							<ChevronUp size={14} />
-						</Button>
-						<Button
-							variant="ghost"
-							size="icon"
-							color="secondary"
-							disabled={currentSearchedIndex === filteredSpanIds.length - 1}
-							onClick={(): void => {
-								handlePrevNext(currentSearchedIndex + 1);
-								setCurrentSearchedIndex((prev) => prev + 1);
-							}}
-						>
-							<ChevronDown size={14} />
-						</Button>
-					</div>
-				)}
-				<Button
-					variant="ghost"
-					size="icon"
-					color="secondary"
-					className="filter-collapse-btn"
-					onClick={onCollapse}
-				>
-					<X size={14} />
-				</Button>
-				{highlightErrorsToggle}
-				{statusIndicators}
-			</div>
-		</TooltipProvider>
+			)}
+			{isFetching && (
+				<Spin indicator={<LoaderCircle className="animate-spin" />} size="small" />
+			)}
+			{error && (
+				<Tooltip title={(error as AxiosError)?.message || 'Something went wrong'}>
+					<Info size={14} />
+				</Tooltip>
+			)}
+			{noData && (
+				<Typography.Text className="no-results">No results found</Typography.Text>
+			)}
+		</div>
 	);
 }
 

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Filters/hooks/types.ts

@@ -1,30 +0,0 @@
-import { MutableRefObject } from 'react';
-import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
-
-/**
- * Shared props for expression-based filter hooks.
- * Each hook reads the current expression + derived filters,
- * and manipulates the expression via remove/add pattern.
- */
-export interface ExpressionFilterProps {
-	expression: string;
-	filters: TagFilter;
-	setExpression: (expr: string) => void;
-	expressionRef: MutableRefObject<string>;
-	runQuery: (expr: string) => void;
-}
-
-/**
- * Helper: update expression state, ref, and trigger query.
- */
-export function applyExpression(
-	newExpression: string,
-	props: Pick<
-		ExpressionFilterProps,
-		'setExpression' | 'expressionRef' | 'runQuery'
-	>,
-): void {
-	props.setExpression(newExpression);
-	props.expressionRef.current = newExpression;
-	props.runQuery(newExpression);
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Filters/hooks/useHighlightErrors.ts

@@ -1,45 +0,0 @@
-import { useCallback, useMemo } from 'react';
-import { removeKeysFromExpression } from 'components/QueryBuilderV2/utils';
-
-import { applyExpression, ExpressionFilterProps } from './types';
-
-interface UseHighlightErrorsReturn {
-	isHighlightErrors: boolean;
-	handleToggle: (checked: boolean) => void;
-}
-
-const ERROR_KEY = 'has_error';
-
-export function useHighlightErrors(
-	props: ExpressionFilterProps,
-): UseHighlightErrorsReturn {
-	const { expression, filters, setExpression, expressionRef, runQuery } = props;
-
-	// Derive from filters (only updates after runQuery, not on every keystroke)
-	const isHighlightErrors = useMemo(
-		() =>
-			filters.items.some(
-				(item) =>
-					item.key?.key === ERROR_KEY &&
-					(item.value === true || item.value === 'true'),
-			),
-		[filters],
-	);
-
-	const handleToggle = useCallback(
-		(checked: boolean): void => {
-			// Always remove existing has_error first (whatever its value)
-			let newExpr = removeKeysFromExpression(expression, [ERROR_KEY]);
-			// Add back if turning ON
-			if (checked) {
-				newExpr = newExpr.trim()
-					? `${newExpr.trim()} AND has_error = true`
-					: `has_error = true`;
-			}
-			applyExpression(newExpr, { setExpression, expressionRef, runQuery });
-		},
-		[expression, setExpression, expressionRef, runQuery],
-	);
-
-	return { isHighlightErrors, handleToggle };
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Filters/hooks/useSpanCategoryFilter.ts

@@ -1,84 +0,0 @@
-import { useCallback, useMemo } from 'react';
-import { removeKeysFromExpression } from 'components/QueryBuilderV2/utils';
-
-import { applyExpression, ExpressionFilterProps } from './types';
-
-export type SpanCategory =
-	| 'All'
-	| 'Database'
-	| 'Functions'
-	| 'HTTP'
-	| 'Jobs'
-	| 'LLM';
-
-export const SPAN_CATEGORIES: readonly SpanCategory[] = [
-	'All',
-	'Database',
-	'Functions',
-	'HTTP',
-	'Jobs',
-	'LLM',
-];
-
-// Map each category to the attribute key it filters on
-const CATEGORY_KEYS: Record<Exclude<SpanCategory, 'All'>, string> = {
-	Database: 'db.system',
-	HTTP: 'http.method',
-	Functions: 'kind_string',
-	Jobs: 'messaging.system',
-	LLM: 'gen_ai.request.model',
-};
-
-// All category keys — used for bulk removal when switching categories
-const ALL_CATEGORY_KEYS = Object.values(CATEGORY_KEYS);
-
-// The expression clause to add for each category
-const CATEGORY_EXPRESSIONS: Record<Exclude<SpanCategory, 'All'>, string> = {
-	Database: 'db.system exists',
-	HTTP: 'http.method exists',
-	Functions: "kind_string = 'Internal'",
-	Jobs: 'messaging.system exists',
-	LLM: 'gen_ai.request.model exists',
-};
-
-interface UseSpanCategoryFilterReturn {
-	selectedCategory: SpanCategory;
-	categories: readonly SpanCategory[];
-	handleCategoryChange: (category: SpanCategory) => void;
-}
-
-export function useSpanCategoryFilter(
-	props: ExpressionFilterProps,
-): UseSpanCategoryFilterReturn {
-	const { expression, filters, setExpression, expressionRef, runQuery } = props;
-
-	// Derive active category from filters (only updates after runQuery)
-	const selectedCategory = useMemo((): SpanCategory => {
-		for (const [category, key] of Object.entries(CATEGORY_KEYS)) {
-			if (filters.items.some((item) => item.key?.key === key)) {
-				return category as SpanCategory;
-			}
-		}
-		return 'All';
-	}, [filters]);
-
-	const handleCategoryChange = useCallback(
-		(category: SpanCategory): void => {
-			// Remove ALL category keys first
-			let newExpr = removeKeysFromExpression(expression, ALL_CATEGORY_KEYS);
-			// Add the selected category clause (unless "All")
-			if (category !== 'All') {
-				const clause = CATEGORY_EXPRESSIONS[category];
-				newExpr = newExpr.trim() ? `${newExpr.trim()} AND ${clause}` : clause;
-			}
-			applyExpression(newExpr, { setExpression, expressionRef, runQuery });
-		},
-		[expression, setExpression, expressionRef, runQuery],
-	);
-
-	return {
-		selectedCategory,
-		categories: SPAN_CATEGORIES,
-		handleCategoryChange,
-	};
-}

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

@@ -131,24 +131,6 @@
 		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;
@@ -261,7 +243,7 @@
 			}
 
 			&.dimmed-span {
-				opacity: 0.15;
+				opacity: 0.4;
 			}
 		}
 	}
@@ -333,7 +315,7 @@
 
 		.tree-connector {
 			position: absolute;
-			width: 14px;
+			width: 11px;
 			height: 50%;
 			border-left: 1px solid var(--l2-border);
 			border-bottom: 1px solid var(--l2-border);
@@ -341,16 +323,6 @@
 			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;
@@ -367,18 +339,6 @@
 			}
 		}
 
-		// 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: 20px;
-			flex-shrink: 0;
-			display: inline-flex;
-			align-items: center;
-			justify-content: flex-end;
-			padding-right: 4px;
-		}
-
 		.subtree-count {
 			display: inline-flex;
 			align-items: center;
@@ -579,7 +539,7 @@
 	}
 
 	.dimmed-span {
-		opacity: 0.15;
+		opacity: 0.4;
 	}
 	.highlighted-span {
 		opacity: 1;

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

@@ -27,11 +27,12 @@ import { useVirtualizer, Virtualizer } from '@tanstack/react-virtual';
 import cx from 'classnames';
 import HttpStatusBadge from 'components/HttpStatusBadge/HttpStatusBadge';
 import TimelineV3 from 'components/TimelineV3/TimelineV3';
+import { themeColors } from 'constants/theme';
 import { convertTimeToRelevantUnit } from 'container/TraceDetail/utils';
 import { useCopySpanLink } from 'hooks/trace/useCopySpanLink';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
-import { colorToRgb } from 'lib/uPlotLib/utils/generateColor';
+import { colorToRgb, generateColor } from 'lib/uPlotLib/utils/generateColor';
 import {
 	ArrowUpRight,
 	ChevronDown,
@@ -40,17 +41,15 @@ import {
 	Link,
 	ListPlus,
 } from '@signozhq/icons';
-import { useTraceContext } from 'pages/TraceDetailsV3/contexts/TraceContext';
-import { useBoundaryPagination } from 'pages/TraceDetailsV3/TraceWaterfall/hooks/useBoundaryPagination';
 import { useCrosshair } from 'pages/TraceDetailsV3/hooks/useCrosshair';
 import { ResizableBox } from 'periscope/components/ResizableBox';
 import { EventV3, SpanV3 } from 'types/api/trace/getTraceV3';
 import { toFixed } from 'utils/toFixed';
 
 import { EventTooltipContent } from '../../../SpanHoverCard/EventTooltipContent';
-import { SpanHoverCard } from '../../../SpanHoverCard/SpanHoverCard';
+import SpanHoverCard from '../../../SpanHoverCard/SpanHoverCard';
 import AddSpanToFunnelModal from '../../AddSpanToFunnelModal/AddSpanToFunnelModal';
-import { IInterestedSpan } from '../../types';
+import { IInterestedSpan } from '../../TraceWaterfall';
 
 import './Success.styles.scss';
 
@@ -77,7 +76,7 @@ const LazyEventDotPopover = memo(function LazyEventDotPopover({
 	const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
 	const handleMouseEnter = useCallback((): void => {
-		timerRef.current = setTimeout(() => setShowPopover(true), 200);
+		timerRef.current = setTimeout(() => setShowPopover(true), 150);
 	}, []);
 
 	const handleMouseLeave = useCallback((): void => {
@@ -134,7 +133,7 @@ const LazyEventDotPopover = memo(function LazyEventDotPopover({
 });
 
 // css config
-const CONNECTOR_WIDTH = 30;
+const CONNECTOR_WIDTH = 20;
 const VERTICAL_CONNECTOR_WIDTH = 1;
 
 interface SpanStateClasses {
@@ -195,9 +194,8 @@ const SpanOverview = memo(function SpanOverview({
 	selectedSpan,
 	filteredSpanIds,
 	isFilterActive,
+	traceMetadata,
 	onAddSpanToFunnel,
-	onHoverEnter,
-	onHoverLeave,
 }: {
 	span: SpanV3;
 	isSpanCollapsed: boolean;
@@ -206,15 +204,19 @@ const SpanOverview = memo(function SpanOverview({
 	handleSpanClick: (span: SpanV3) => void;
 	filteredSpanIds: string[];
 	isFilterActive: boolean;
+	traceMetadata: ITraceMetadata;
 	onAddSpanToFunnel: (span: SpanV3) => void;
-	onHoverEnter: (spanId: string) => void;
-	onHoverLeave: () => void;
 }): JSX.Element {
 	const isRootSpan = span.level === 0;
 	const { onSpanCopy } = useCopySpanLink(span);
-	const { resolveSpanColor } = useTraceContext();
 
-	const color = resolveSpanColor(span);
+	let color = generateColor(
+		span['service.name'],
+		themeColors.traceDetailColorsV3,
+	);
+	if (span.has_error) {
+		color = `var(--bg-cherry-500)`;
+	}
 
 	// Smart highlighting logic
 	const {
@@ -230,9 +232,6 @@ const SpanOverview = memo(function SpanOverview({
 		isFilterActive,
 	);
 
-	// All siblings at the same level share the same indent so the "same X =
-	// same level" visual rule holds. Parent/child distinction is conveyed by
-	// the chevron and the L-connector, not by an icon-X offset.
 	const indentWidth = isRootSpan ? 0 : span.level * CONNECTOR_WIDTH;
 
 	const handleFunnelClick = (e: React.MouseEvent<HTMLButtonElement>): void => {
@@ -241,128 +240,126 @@ const SpanOverview = memo(function SpanOverview({
 	};
 
 	return (
-		<div
-			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)}
-			onMouseLeave={(): void => onHoverLeave()}
-		>
-			{/* Tree connector lines — always draw vertical lines at all ancestor levels + L-connector */}
-			{!isRootSpan &&
-				Array.from({ length: span.level }, (_, i) => {
-					const lvl = i + 1;
-					const xPos = (lvl - 1) * CONNECTOR_WIDTH + 9;
-					if (lvl < span.level) {
-						// Stop the line at 50% for the last child's parent level
-						const isLastChildParentLine = !span.has_sibling && lvl === span.level - 1;
-						return (
-							<div
-								key={lvl}
-								className="tree-line"
-								style={{
-									left: xPos,
-									top: 0,
-									width: 1,
-									height: isLastChildParentLine ? '50%' : '100%',
-								}}
-							/>
-						);
-					}
-					return (
-						<div key={lvl}>
-							<div
-								className="tree-line"
-								style={{ left: xPos, top: 0, width: 1, height: '50%' }}
-							/>
-							<div className="tree-connector" style={{ left: xPos, top: 0 }} />
-						</div>
-					);
+		<SpanHoverCard span={span} traceMetadata={traceMetadata}>
+			<div
+				className={cx('span-overview', {
+					'interested-span': isSelected && (!isFilterActive || isMatching),
+					'highlighted-span': isHighlighted,
+					'selected-non-matching-span': isSelectedNonMatching,
+					'dimmed-span': isDimmed,
 				})}
+				onClick={(): void => handleSpanClick(span)}
+			>
+				{/* Tree connector lines — always draw vertical lines at all ancestor levels + L-connector */}
+				{!isRootSpan &&
+					Array.from({ length: span.level }, (_, i) => {
+						const lvl = i + 1;
+						const xPos = (lvl - 1) * CONNECTOR_WIDTH + 9;
+						if (lvl < span.level) {
+							// Stop the line at 50% for the last child's parent level
+							const isLastChildParentLine =
+								!span.has_sibling && lvl === span.level - 1;
+							return (
+								<div
+									key={lvl}
+									className="tree-line"
+									style={{
+										left: xPos,
+										top: 0,
+										width: 1,
+										height: isLastChildParentLine ? '50%' : '100%',
+									}}
+								/>
+							);
+						}
+						return (
+							<div key={lvl}>
+								<div
+									className="tree-line"
+									style={{ left: xPos, top: 0, width: 1, height: '50%' }}
+								/>
+								<div className="tree-connector" style={{ left: xPos, top: 0 }} />
+							</div>
+						);
+					})}
 
-			{/* Indent spacer */}
-			<span className="tree-indent" style={{ width: `${indentWidth}px` }} />
+				{/* Indent spacer */}
+				<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="tree-arrow-slot">
+				{/* Expand/collapse arrow + child count (only for spans with children) */}
 				{span.has_children && (
-					<span
-						className={cx('tree-arrow', { expanded: !isSpanCollapsed })}
-						onClick={(event): void => {
-							event.stopPropagation();
-							event.preventDefault();
-							handleCollapseUncollapse(span.span_id, !isSpanCollapsed);
-						}}
-					>
-						{isSpanCollapsed ? <ChevronRight size={14} /> : <ChevronDown size={14} />}
-					</span>
+					<>
+						<span
+							className={cx('tree-arrow', { expanded: !isSpanCollapsed })}
+							onClick={(event): void => {
+								event.stopPropagation();
+								event.preventDefault();
+								handleCollapseUncollapse(span.span_id, !isSpanCollapsed);
+							}}
+						>
+							{isSpanCollapsed ? (
+								<ChevronRight size={14} />
+							) : (
+								<ChevronDown size={14} />
+							)}
+						</span>
+						<span className="subtree-count">
+							<Badge color="vanilla">{span.sub_tree_node_count}</Badge>
+						</span>
+					</>
 				)}
-			</span>
-			<span className="subtree-count-slot">
-				{span.has_children && (
-					<span className="subtree-count">
-						<Badge color="vanilla">{span.sub_tree_node_count}</Badge>
-					</span>
-				)}
-			</span>
 
-			{/* Colored service dot */}
-			<span
-				className={cx('tree-icon', { 'is-error': span.has_error })}
-				style={{ backgroundColor: color }}
-			/>
+				{/* Colored service dot */}
+				<span
+					className={cx('tree-icon', { 'is-error': span.has_error })}
+					style={{ backgroundColor: color }}
+				/>
 
-			{/* Span name + service name */}
-			<span className="tree-label">
-				{span.name}
-				<span className="tree-service-name">{span['service.name']}</span>
-			</span>
+				{/* Span name + service name */}
+				<span className="tree-label">
+					{span.name}
+					<span className="tree-service-name">{span['service.name']}</span>
+				</span>
 
-			{/* Action buttons — shown on hover via CSS, right-aligned */}
-			<span className="span-row-actions">
-				<TooltipProvider delayDuration={200}>
-					<Tooltip>
-						<TooltipTrigger asChild>
-							<Button
-								variant="ghost"
-								size="icon"
-								color="secondary"
-								className="span-action-btn"
-								onClick={onSpanCopy}
-							>
-								<Link size={12} />
-							</Button>
-						</TooltipTrigger>
-						<TooltipContent className="span-action-tooltip">
-							Copy Span Link
-						</TooltipContent>
-					</Tooltip>
-					<Tooltip>
-						<TooltipTrigger asChild>
-							<Button
-								variant="ghost"
-								size="icon"
-								color="secondary"
-								className="span-action-btn"
-								onClick={handleFunnelClick}
-							>
-								<ListPlus size={12} />
-							</Button>
-						</TooltipTrigger>
-						<TooltipContent className="span-action-tooltip">
-							Add to Trace Funnel
-						</TooltipContent>
-					</Tooltip>
-				</TooltipProvider>
-			</span>
-		</div>
+				{/* Action buttons — shown on hover via CSS, right-aligned */}
+				<span className="span-row-actions">
+					<TooltipProvider delayDuration={200}>
+						<Tooltip>
+							<TooltipTrigger asChild>
+								<Button
+									variant="ghost"
+									size="icon"
+									color="secondary"
+									className="span-action-btn"
+									onClick={onSpanCopy}
+								>
+									<Link size={12} />
+								</Button>
+							</TooltipTrigger>
+							<TooltipContent className="span-action-tooltip">
+								Copy Span Link
+							</TooltipContent>
+						</Tooltip>
+						<Tooltip>
+							<TooltipTrigger asChild>
+								<Button
+									variant="ghost"
+									size="icon"
+									color="secondary"
+									className="span-action-btn"
+									onClick={handleFunnelClick}
+								>
+									<ListPlus size={12} />
+								</Button>
+							</TooltipTrigger>
+							<TooltipContent className="span-action-tooltip">
+								Add to Trace Funnel
+							</TooltipContent>
+						</Tooltip>
+					</TooltipProvider>
+				</span>
+			</div>
+		</SpanHoverCard>
 	);
 });
 
@@ -389,10 +386,16 @@ export const SpanDuration = memo(function SpanDuration({
 	const leftOffset = ((span.timestamp - traceMetadata.startTime) * 1e2) / spread;
 	const width = (span.duration_nano * 1e2) / (spread * 1e6);
 
-	const { resolveSpanColor } = useTraceContext();
-	const color = resolveSpanColor(span);
-	// `resolveSpanColor` returns a CSS variable for errors; `colorToRgb` can't parse it.
-	const rgbColor = span.has_error ? '239, 68, 68' : colorToRgb(color);
+	let color = generateColor(
+		span['service.name'],
+		themeColors.traceDetailColorsV3,
+	);
+	let rgbColor = colorToRgb(color);
+
+	if (span.has_error) {
+		color = `var(--bg-cherry-500)`;
+		rgbColor = '239, 68, 68';
+	}
 
 	const {
 		isSelected,
@@ -417,25 +420,27 @@ export const SpanDuration = memo(function SpanDuration({
 			})}
 			onClick={(): void => handleSpanClick(span)}
 		>
-			<div
-				className="span-bar"
-				style={
-					{
-						left: `${leftOffset}%`,
-						width: `${width}%`,
-						'--span-color': color,
-						'--span-color-rgb': rgbColor,
-					} as React.CSSProperties
-				}
-			>
-				<span className="span-info">
-					<span className="span-name">{span.name}</span>
-					<span className="span-duration-text">{`${toFixed(
-						time,
-						2,
-					)} ${timeUnitName}`}</span>
-				</span>
-			</div>
+			<SpanHoverCard span={span} traceMetadata={traceMetadata}>
+				<div
+					className="span-bar"
+					style={
+						{
+							left: `${leftOffset}%`,
+							width: `${width}%`,
+							'--span-color': color,
+							'--span-color-rgb': rgbColor,
+						} as React.CSSProperties
+					}
+				>
+					<span className="span-info">
+						<span className="span-name">{span.name}</span>
+						<span className="span-duration-text">{`${toFixed(
+							time,
+							2,
+						)} ${timeUnitName}`}</span>
+					</span>
+				</div>
+			</SpanHoverCard>
 			{span.events?.map((event) => {
 				const eventTimeMs = event.timeUnixNano / 1e6;
 				const spanDurationMs = span.duration_nano / 1e6;
@@ -501,17 +506,6 @@ function Success(props: ISuccessProps): JSX.Element {
 	const prevHoveredSpanIdRef = useRef<string | null>(null);
 	const autoScrollTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
-	const {
-		topSentinelRef: loadMoreTopSentinelRef,
-		bottomSentinelRef: loadMoreBottomSentinelRef,
-	} = useBoundaryPagination({
-		scrollContainerRef,
-		spans,
-		isFetching,
-		isFullDataLoaded,
-		setInterestedSpanId,
-	});
-
 	const {
 		cursorXPercent,
 		cursorX,
@@ -537,32 +531,15 @@ function Success(props: ISuccessProps): JSX.Element {
 		prevHoveredSpanIdRef.current = spanId;
 	}, []);
 
-	// Hover-card state — single popover anchored at the sidebar/timeline
-	// boundary, Y tracks the hovered row. Set after a 500 ms debounce so fast
-	// scrolls/cursor sweeps don't fire the card.
-	const [hoveredSpanId, setHoveredSpanId] = useState<string | null>(null);
-	const hoverDelayTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-
 	const handleRowMouseEnter = useCallback(
 		(spanId: string): void => {
 			applyHoverClass(spanId);
-			if (hoverDelayTimerRef.current) {
-				clearTimeout(hoverDelayTimerRef.current);
-			}
-			hoverDelayTimerRef.current = setTimeout(() => {
-				setHoveredSpanId(spanId);
-			}, 500);
 		},
 		[applyHoverClass],
 	);
 
 	const handleRowMouseLeave = useCallback((): void => {
 		applyHoverClass(null);
-		if (hoverDelayTimerRef.current) {
-			clearTimeout(hoverDelayTimerRef.current);
-			hoverDelayTimerRef.current = null;
-		}
-		setHoveredSpanId(null);
 	}, [applyHoverClass]);
 
 	const handleCollapseUncollapse = useCallback(
@@ -578,15 +555,14 @@ function Success(props: ISuccessProps): JSX.Element {
 					}
 					return next;
 				});
+			} else {
+				// Backend mode: trigger API call (current behavior)
+				setInterestedSpanId({
+					spanId,
+					isUncollapsed: !collapse,
+					scrollToSpan: false,
+				});
 			}
-			// Backend mode: trigger API call (current behavior)
-			// keeping this for both mode to support scroll to view to function well.
-			// interestedspan would not make api call in frontend mode so it is safe to use for both mode.
-			setInterestedSpanId({
-				spanId,
-				isUncollapsed: !collapse,
-				scrollToSpan: false,
-			});
 		},
 		[isFullDataLoaded, setLocalUncollapsedNodes, setInterestedSpanId],
 	);
@@ -639,8 +615,32 @@ function Success(props: ISuccessProps): JSX.Element {
 					}
 				}, 20);
 			}
+
+			// In frontend mode all data is already loaded, no need to fetch more.
+			// In backend mode, skip auto-fetch when under 500 spans (nothing more to paginate).
+			if (isFullDataLoaded || spans.length < 500) {
+				return;
+			}
+
+			if (range?.startIndex === 0 && instance.isScrolling) {
+				// do not trigger for trace root as nothing to fetch above
+				if (spans[0].level !== 0) {
+					setInterestedSpanId({
+						spanId: spans[0].span_id,
+						isUncollapsed: false,
+					});
+				}
+				return;
+			}
+
+			if (range?.endIndex === spans.length - 1 && instance.isScrolling) {
+				setInterestedSpanId({
+					spanId: spans[spans.length - 1].span_id,
+					isUncollapsed: false,
+				});
+			}
 		},
-		[spans],
+		[spans, setInterestedSpanId],
 	);
 
 	const [isAddSpanToFunnelModalOpen, setIsAddSpanToFunnelModalOpen] =
@@ -685,11 +685,10 @@ function Success(props: ISuccessProps): JSX.Element {
 						}
 						selectedSpan={selectedSpan}
 						handleSpanClick={handleSpanClick}
+						traceMetadata={traceMetadata}
 						filteredSpanIds={filteredSpanIds}
 						isFilterActive={isFilterActive}
 						onAddSpanToFunnel={handleAddSpanToFunnel}
-						onHoverEnter={handleRowMouseEnter}
-						onHoverLeave={handleRowMouseLeave}
 					/>
 				),
 			}),
@@ -699,13 +698,12 @@ function Success(props: ISuccessProps): JSX.Element {
 			uncollapsedNodes,
 			isFullDataLoaded,
 			localUncollapsedNodes,
+			traceMetadata,
 			selectedSpan,
 			handleSpanClick,
 			filteredSpanIds,
 			isFilterActive,
 			handleAddSpanToFunnel,
-			handleRowMouseEnter,
-			handleRowMouseLeave,
 		],
 	);
 
@@ -782,12 +780,6 @@ function Success(props: ISuccessProps): JSX.Element {
 	const virtualItems = virtualizer.getVirtualItems();
 	const leftRows = leftTable.getRowModel().rows;
 
-	const handleHoverCardOpenChange = useCallback((open: boolean): void => {
-		if (!open) {
-			setHoveredSpanId(null);
-		}
-	}, []);
-
 	return (
 		<div className="success-content">
 			{traceMetadata.hasMissingSpans && (
@@ -841,24 +833,6 @@ function Success(props: ISuccessProps): JSX.Element {
 						height: '100%',
 					}}
 				>
-					{/* Top / bottom sentinels: each transition into the viewport
-					    fires a load-more via useBoundaryPagination. */}
-					<div
-						ref={loadMoreTopSentinelRef}
-						className="waterfall-load-more-sentinel waterfall-load-more-sentinel--top"
-					/>
-					<div
-						ref={loadMoreBottomSentinelRef}
-						className="waterfall-load-more-sentinel waterfall-load-more-sentinel--bottom"
-					/>
-					<SpanHoverCard
-						hoveredSpanId={hoveredSpanId}
-						onOpenChange={handleHoverCardOpenChange}
-						anchorLeft={sidebarWidth}
-						rowHeight={ROW_HEIGHT}
-						spans={spans}
-						traceStartTime={traceMetadata.startTime}
-					/>
 					{/* Left panel - table with horizontal scroll */}
 					<ResizableBox
 						direction="horizontal"
@@ -968,8 +942,8 @@ function Success(props: ISuccessProps): JSX.Element {
 										height: ROW_HEIGHT,
 										transform: `translateY(${virtualRow.start}px)`,
 									}}
-									onMouseEnter={(): void => applyHoverClass(span.span_id)}
-									onMouseLeave={(): void => applyHoverClass(null)}
+									onMouseEnter={(): void => handleRowMouseEnter(span.span_id)}
+									onMouseLeave={handleRowMouseLeave}
 								>
 									<SpanDuration
 										span={span}

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

@@ -2,12 +2,8 @@ import useUrlQuery from 'hooks/useUrlQuery';
 import { fireEvent, render, screen } from 'tests/test-utils';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 
-import { TraceProvider } from '../../../../contexts/TraceContext';
 import { SpanDuration } from '../Success';
 
-const renderWithTraceProvider: typeof render = (ui, options) =>
-	render(<TraceProvider aggregations={undefined}>{ui}</TraceProvider>, options);
-
 // Constants to avoid string duplication
 const SPAN_DURATION_TEXT = '1.16 ms';
 const SPAN_DURATION_CLASS = '.span-duration';
@@ -23,9 +19,6 @@ jest.mock('components/TimelineV3/TimelineV3', () => ({
 
 // Mock the hooks
 jest.mock('hooks/useUrlQuery');
-jest.mock('@signozhq/ui', () => ({
-	Badge: jest.fn(),
-}));
 
 const mockSpan: SpanV3 = {
 	span_id: 'test-span-id',
@@ -95,7 +88,7 @@ describe('SpanDuration', () => {
 	it('calls handleSpanClick when clicked', () => {
 		const mockHandleSpanClick = jest.fn();
 
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -115,7 +108,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('shows action buttons on hover', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -136,7 +129,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('applies interested-span class when span is selected', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -154,7 +147,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('applies highlighted-span class when span matches filter', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -173,7 +166,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('applies dimmed-span class when span does not match filter', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -192,7 +185,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('prioritizes interested-span over highlighted-span when span is selected and matches filter', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -212,7 +205,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('applies selected-non-matching-span class when span is selected but does not match filter', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -233,7 +226,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('applies interested-span class when span is selected and no filter is active', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}
@@ -254,7 +247,7 @@ describe('SpanDuration', () => {
 	});
 
 	it('dims span when filter is active but no matches found', () => {
-		renderWithTraceProvider(
+		render(
 			<SpanDuration
 				span={mockSpan}
 				traceMetadata={mockTraceMetadata}

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

@@ -2,16 +2,8 @@ import React from 'react';
 import { render, screen, userEvent, waitFor } from 'tests/test-utils';
 import { SpanV3 } from 'types/api/trace/getTraceV3';
 
-import { TraceProvider } from '../../../../contexts/TraceContext';
 import Success from '../Success';
 
-const renderWithTraceProvider: typeof render = (ui, options, customOptions) =>
-	render(
-		<TraceProvider aggregations={undefined}>{ui}</TraceProvider>,
-		options,
-		customOptions,
-	);
-
 // Mock the required hooks with proper typing
 const mockSafeNavigate = jest.fn() as jest.MockedFunction<
 	(params: { search: string }) => void
@@ -230,7 +222,7 @@ describe('Span Click User Flows', () => {
 	it('clicking span updates URL with spanId parameter', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		renderWithTraceProvider(
+		render(
 			<Success
 				spans={mockSpans}
 				traceMetadata={mockTraceMetadata}
@@ -269,7 +261,7 @@ describe('Span Click User Flows', () => {
 	it('clicking span duration visually selects the span', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		renderWithTraceProvider(<TestComponent />, undefined, {
+		render(<TestComponent />, undefined, {
 			initialRoute: '/trace',
 		});
 
@@ -308,7 +300,7 @@ describe('Span Click User Flows', () => {
 	it('both click areas produce the same visual result', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		renderWithTraceProvider(<TestComponent />, undefined, {
+		render(<TestComponent />, undefined, {
 			initialRoute: '/trace',
 		});
 
@@ -368,7 +360,7 @@ describe('Span Click User Flows', () => {
 	it('clicking different spans updates selection correctly', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		renderWithTraceProvider(<TestComponent />, undefined, {
+		render(<TestComponent />, undefined, {
 			initialRoute: '/trace',
 		});
 
@@ -412,7 +404,7 @@ describe('Span Click User Flows', () => {
 		mockUrlQuery.set('existingParam', 'existingValue');
 		mockUrlQuery.set('anotherParam', 'anotherValue');
 
-		renderWithTraceProvider(
+		render(
 			<Success
 				spans={mockSpans}
 				traceMetadata={mockTraceMetadata}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/hooks/useBoundaryPagination.ts

@@ -1,111 +0,0 @@
-import { RefObject, useEffect, useRef } from 'react';
-import { SpanV3 } from 'types/api/trace/getTraceV3';
-
-import { IInterestedSpan } from '../types';
-
-const MIN_SPANS_FOR_PAGINATION = 500;
-
-interface UseBoundaryPaginationProps {
-	scrollContainerRef: RefObject<HTMLDivElement>;
-	spans: SpanV3[];
-	isFetching: boolean | undefined;
-	isFullDataLoaded: boolean;
-	setInterestedSpanId: (next: IInterestedSpan) => void;
-}
-
-interface UseBoundaryPaginationResult {
-	topSentinelRef: RefObject<HTMLDivElement>;
-	bottomSentinelRef: RefObject<HTMLDivElement>;
-}
-
-/**
- * Drives load-more on a virtualized list via two `IntersectionObserver`
- * sentinels (top + bottom of the inner content). The observer is created
- * once and reads live state through refs — recreating it would re-fire
- * IO's mandatory initial-intersection callback for sentinels still in view
- * and produce a fetch spiral on every data update.
- *
- * Returns the two refs the caller must attach to its sentinel `<div>`s.
- */
-export function useBoundaryPagination({
-	scrollContainerRef,
-	spans,
-	isFetching,
-	isFullDataLoaded,
-	setInterestedSpanId,
-}: UseBoundaryPaginationProps): UseBoundaryPaginationResult {
-	const topSentinelRef = useRef<HTMLDivElement | null>(null);
-	const bottomSentinelRef = useRef<HTMLDivElement | null>(null);
-
-	const spansRef = useRef<SpanV3[]>(spans);
-	const isFetchingRef = useRef<boolean | undefined>(isFetching);
-	const isFullDataLoadedRef = useRef<boolean>(isFullDataLoaded);
-
-	useEffect(() => {
-		spansRef.current = spans;
-	}, [spans]);
-	useEffect(() => {
-		isFetchingRef.current = isFetching;
-	}, [isFetching]);
-	useEffect(() => {
-		isFullDataLoadedRef.current = isFullDataLoaded;
-	}, [isFullDataLoaded]);
-
-	useEffect(() => {
-		const root = scrollContainerRef.current;
-		if (!root) {
-			return undefined;
-		}
-
-		const seenInitial = new WeakSet<Element>();
-
-		const observer = new IntersectionObserver(
-			(entries) => {
-				entries.forEach((entry) => {
-					if (!seenInitial.has(entry.target)) {
-						seenInitial.add(entry.target);
-						return;
-					}
-					if (
-						!entry.isIntersecting ||
-						isFetchingRef.current ||
-						isFullDataLoadedRef.current ||
-						spansRef.current.length < MIN_SPANS_FOR_PAGINATION
-					) {
-						return;
-					}
-
-					if (entry.target === bottomSentinelRef.current) {
-						const lastSpan = spansRef.current[spansRef.current.length - 1];
-						if (lastSpan) {
-							setInterestedSpanId({
-								spanId: lastSpan.span_id,
-								isUncollapsed: false,
-							});
-						}
-					} else if (entry.target === topSentinelRef.current) {
-						const firstSpan = spansRef.current[0];
-						if (firstSpan && firstSpan.level !== 0) {
-							setInterestedSpanId({
-								spanId: firstSpan.span_id,
-								isUncollapsed: false,
-							});
-						}
-					}
-				});
-			},
-			{ root, threshold: 0 },
-		);
-
-		if (bottomSentinelRef.current) {
-			observer.observe(bottomSentinelRef.current);
-		}
-		if (topSentinelRef.current) {
-			observer.observe(topSentinelRef.current);
-		}
-
-		return (): void => observer.disconnect();
-	}, [scrollContainerRef, setInterestedSpanId]);
-
-	return { topSentinelRef, bottomSentinelRef };
-}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/types.ts

@@ -1,5 +0,0 @@
-export interface IInterestedSpan {
-	spanId: string;
-	isUncollapsed: boolean;
-	scrollToSpan?: boolean;
-}

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

@@ -1,131 +0,0 @@
-import { useMemo } from 'react';
-import {
-	closestCenter,
-	DndContext,
-	DragEndEvent,
-	PointerSensor,
-	useSensor,
-	useSensors,
-} from '@dnd-kit/core';
-import {
-	arrayMove,
-	SortableContext,
-	useSortable,
-	verticalListSortingStrategy,
-} from '@dnd-kit/sortable';
-import { CSS } from '@dnd-kit/utilities';
-import { Button } from '@signozhq/ui/button';
-import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
-import { GripVertical } from '@signozhq/icons';
-import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
-
-function SortableField({
-	field,
-	onRemove,
-	allowDrag,
-}: {
-	field: BaseAutocompleteData;
-	onRemove: (field: BaseAutocompleteData) => void;
-	allowDrag: boolean;
-}): JSX.Element {
-	const { attributes, listeners, setNodeRef, transform, transition } =
-		useSortable({ id: field.key });
-
-	const style = {
-		transform: CSS.Transform.toString(transform),
-		transition,
-	};
-
-	return (
-		<div
-			ref={setNodeRef}
-			style={style}
-			className={`fs-field-item ${allowDrag ? 'drag-enabled' : 'drag-disabled'}`}
-		>
-			<div {...attributes} {...listeners} className="drag-handle">
-				{allowDrag && <GripVertical size={14} />}
-				<span className="fs-field-key">{field.key}</span>
-			</div>
-			<Button
-				className="remove-field-btn periscope-btn"
-				variant="outlined"
-				color="destructive"
-				size="sm"
-				onClick={(): void => onRemove(field)}
-			>
-				Remove
-			</Button>
-		</div>
-	);
-}
-
-interface AddedFieldsProps {
-	inputValue: string;
-	fields: BaseAutocompleteData[];
-	onFieldsChange: (fields: BaseAutocompleteData[]) => void;
-}
-
-function AddedFields({
-	inputValue,
-	fields,
-	onFieldsChange,
-}: AddedFieldsProps): JSX.Element {
-	const sensors = useSensors(useSensor(PointerSensor));
-
-	const handleDragEnd = (event: DragEndEvent): void => {
-		const { active, over } = event;
-		if (over && active.id !== over.id) {
-			const oldIndex = fields.findIndex((f) => f.key === active.id);
-			const newIndex = fields.findIndex((f) => f.key === over.id);
-			onFieldsChange(arrayMove(fields, oldIndex, newIndex));
-		}
-	};
-
-	const filteredFields = useMemo(
-		() =>
-			fields.filter((f) => f.key.toLowerCase().includes(inputValue.toLowerCase())),
-		[fields, inputValue],
-	);
-
-	const handleRemove = (field: BaseAutocompleteData): void => {
-		onFieldsChange(fields.filter((f) => f.key !== field.key));
-	};
-
-	const allowDrag = inputValue.length === 0;
-
-	return (
-		<div className="fs-section fs-added">
-			<div className="fs-section-header">ADDED FIELDS</div>
-			<div className="fs-added-list">
-				<OverlayScrollbar>
-					<DndContext
-						sensors={sensors}
-						collisionDetection={closestCenter}
-						onDragEnd={handleDragEnd}
-					>
-						{filteredFields.length === 0 ? (
-							<div className="fs-no-values">No values found</div>
-						) : (
-							<SortableContext
-								items={fields.map((f) => f.key)}
-								strategy={verticalListSortingStrategy}
-								disabled={!allowDrag}
-							>
-								{filteredFields.map((field) => (
-									<SortableField
-										key={field.key}
-										field={field}
-										onRemove={handleRemove}
-										allowDrag={allowDrag}
-									/>
-								))}
-							</SortableContext>
-						)}
-					</DndContext>
-				</OverlayScrollbar>
-			</div>
-		</div>
-	);
-}
-
-export default AddedFields;

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

@@ -1,161 +0,0 @@
-.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

@@ -1,149 +0,0 @@
-import { useCallback, useMemo, useState } from 'react';
-import { toast } from '@signozhq/ui/sonner';
-import { Button } from '@signozhq/ui/button';
-import { Input } from '@signozhq/ui/input';
-import useDebouncedFn from 'hooks/useDebouncedFunction';
-import { Check, TableColumnsSplit, X } from '@signozhq/icons';
-import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
-import { DataSource } from 'types/common/queryBuilder';
-
-import AddedFields from './AddedFields';
-import OtherFields from './OtherFields';
-
-import './FieldsSettings.styles.scss';
-
-const MAX_FIELDS_DEFAULT = 10;
-
-interface FieldsSettingsProps {
-	title: string;
-	// Picker's native shape (`BaseAutocompleteData`) is preserved end-to-end so
-	// downstream consumers (flamegraph `selectFields`, hover popovers) get full
-	// field metadata without a lossy conversion at add-time.
-	fields: BaseAutocompleteData[];
-	onFieldsChange: (fields: BaseAutocompleteData[]) => void;
-	onClose: () => void;
-	dataSource: DataSource;
-	maxFields?: number;
-}
-
-function FieldsSettings({
-	title,
-	fields,
-	onFieldsChange,
-	onClose,
-	dataSource,
-	maxFields = MAX_FIELDS_DEFAULT,
-}: FieldsSettingsProps): JSX.Element {
-	// Local draft state — changes here don't persist until Save
-	const [draftFields, setDraftFields] = useState<BaseAutocompleteData[]>(fields);
-	const [inputValue, setInputValue] = useState('');
-	const [debouncedInputValue, setDebouncedInputValue] = useState('');
-
-	const debouncedUpdate = useDebouncedFn((value) => {
-		setDebouncedInputValue(value as string);
-	}, 400);
-
-	const handleInputChange = useCallback(
-		(e: React.ChangeEvent<HTMLInputElement>): void => {
-			const value = e.target.value.trim().toLowerCase();
-			setInputValue(value);
-			debouncedUpdate(value);
-		},
-		[debouncedUpdate],
-	);
-
-	const handleAdd = useCallback(
-		(field: BaseAutocompleteData): void => {
-			if (draftFields.length >= maxFields) {
-				return;
-			}
-			if (draftFields.some((f) => f.key === field.key)) {
-				return;
-			}
-			setDraftFields((prev) => [...prev, field]);
-		},
-		[draftFields, maxFields],
-	);
-
-	const handleSave = useCallback((): void => {
-		onFieldsChange(draftFields);
-		toast.success('Saved successfully', {
-			position: 'top-right',
-		});
-		onClose();
-	}, [draftFields, onFieldsChange, onClose]);
-
-	const handleDiscard = useCallback((): void => {
-		setDraftFields(fields);
-	}, [fields]);
-
-	const hasUnsavedChanges = useMemo(
-		() =>
-			!(
-				draftFields.length === fields.length &&
-				draftFields.every((f, i) => f.key === fields[i]?.key)
-			),
-		[draftFields, fields],
-	);
-
-	const isAtLimit = draftFields.length >= maxFields;
-
-	return (
-		<div className="fields-settings">
-			<div className="fs-header">
-				<div className="fs-title">
-					<TableColumnsSplit size={16} />
-					{title}
-				</div>
-				<X className="fs-close-icon" size={16} onClick={onClose} />
-			</div>
-
-			<section className="fs-search">
-				<Input
-					className="fs-search-input"
-					type="text"
-					value={inputValue}
-					placeholder="Search for a field..."
-					onChange={handleInputChange}
-				/>
-			</section>
-
-			<AddedFields
-				inputValue={inputValue}
-				fields={draftFields}
-				onFieldsChange={setDraftFields}
-			/>
-
-			<OtherFields
-				dataSource={dataSource}
-				debouncedInputValue={debouncedInputValue}
-				addedFields={draftFields}
-				onAdd={handleAdd}
-				isAtLimit={isAtLimit}
-			/>
-
-			{hasUnsavedChanges && (
-				<div className="fs-footer">
-					<Button
-						variant="outlined"
-						color="secondary"
-						onClick={handleDiscard}
-						prefix={<X width={14} height={14} />}
-					>
-						Discard
-					</Button>
-					<Button
-						variant="solid"
-						color="primary"
-						onClick={handleSave}
-						prefix={<Check width={14} height={14} />}
-					>
-						Save changes
-					</Button>
-				</div>
-			)}
-		</div>
-	);
-}
-
-export default FieldsSettings;

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

@@ -1,99 +0,0 @@
-import { useMemo } from 'react';
-import { Button } from '@signozhq/ui/button';
-import { Skeleton } from 'antd';
-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';
-
-interface OtherFieldsProps {
-	dataSource: DataSource;
-	debouncedInputValue: string;
-	addedFields: BaseAutocompleteData[];
-	onAdd: (field: BaseAutocompleteData) => void;
-	isAtLimit: boolean;
-}
-
-function OtherFields({
-	dataSource,
-	debouncedInputValue,
-	addedFields,
-	onAdd,
-	isAtLimit,
-}: OtherFieldsProps): JSX.Element {
-	// API call to get available attribute keys
-	const { data, isFetching } = useGetAggregateKeys(
-		{
-			searchText: debouncedInputValue,
-			dataSource,
-			aggregateOperator: 'noop',
-			aggregateAttribute: '',
-			tagType: '',
-		},
-		{
-			queryKey: [
-				REACT_QUERY_KEY.GET_OTHER_FILTERS,
-				'preview-fields',
-				debouncedInputValue,
-			],
-			enabled: true,
-		},
-	);
-
-	// Filter out already-added fields, match on .key from API response objects
-	const otherFields = useMemo(() => {
-		const attributes = data?.payload?.attributeKeys || [];
-		const addedKeys = new Set(addedFields.map((f) => f.key));
-		return attributes.filter((attr) => !addedKeys.has(attr.key));
-	}, [data, addedFields]);
-
-	if (isFetching) {
-		return (
-			<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} />
-					))}
-				</div>
-			</div>
-		);
-	}
-
-	return (
-		<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="fs-no-values">No values found</div>
-						) : (
-							otherFields.map((attr) => (
-								<div key={attr.key} className="fs-field-item other-field-item">
-									<span className="fs-field-key">{attr.key}</span>
-									{!isAtLimit && (
-										<Button
-											className="add-field-btn periscope-btn"
-											variant="outlined"
-											color="secondary"
-											size="sm"
-											onClick={(): void => onAdd(attr)}
-										>
-											Add
-										</Button>
-									)}
-								</div>
-							))
-						)}
-						{isAtLimit && <div className="fs-limit-hint">Maximum 10 fields</div>}
-					</>
-				</OverlayScrollbar>
-			</div>
-		</div>
-	);
-}
-
-export default OtherFields;

frontend/src/pages/TraceDetailsV3/constants.ts

@@ -1,55 +0,0 @@
-import { TelemetryFieldKey } from 'types/api/v5/queryRange';
-
-export interface ColorByOption {
-	field: TelemetryFieldKey;
-	label: string;
-}
-
-export const COLOR_BY_OPTIONS: ColorByOption[] = [
-	{
-		field: {
-			name: 'service.name',
-			fieldContext: 'resource',
-			fieldDataType: 'string',
-		},
-		label: 'Service',
-	},
-	{
-		field: {
-			name: 'service.namespace',
-			fieldContext: 'resource',
-			fieldDataType: 'string',
-		},
-		label: 'Namespace',
-	},
-	{
-		field: {
-			name: 'host.name',
-			fieldContext: 'resource',
-			fieldDataType: 'string',
-		},
-		label: 'Host',
-	},
-	{
-		field: {
-			name: 'k8s.node.name',
-			fieldContext: 'resource',
-			fieldDataType: 'string',
-		},
-		label: 'Node',
-	},
-	{
-		field: {
-			name: 'k8s.container.name',
-			fieldContext: 'resource',
-			fieldDataType: 'string',
-		},
-		label: 'Container',
-	},
-];
-
-export const COLOR_BY_FIELDS: TelemetryFieldKey[] = COLOR_BY_OPTIONS.map(
-	(o) => o.field,
-);
-
-export const DEFAULT_COLOR_BY_FIELD = COLOR_BY_FIELDS[0];

frontend/src/pages/TraceDetailsV3/contexts/TraceContext.tsx

@@ -1,220 +0,0 @@
-import {
-	// oxlint-disable-next-line no-restricted-imports
-	createContext,
-	ReactNode,
-	useCallback,
-	// oxlint-disable-next-line no-restricted-imports
-	useContext,
-	useMemo,
-} from 'react';
-import { useMutation } from 'react-query';
-import updateUserPreferenceAPI from 'api/v1/user/preferences/name/update';
-import { themeColors } from 'constants/theme';
-import { USER_PREFERENCES } from 'constants/userPreferences';
-import { generateColor } from 'lib/uPlotLib/utils/generateColor';
-import { useAppContext } from 'providers/App/App';
-import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
-import { TelemetryFieldKey } from 'types/api/v5/queryRange';
-import {
-	SpanV3,
-	WaterfallAggregationResponse,
-	WaterfallAggregationType,
-} from 'types/api/trace/getTraceV3';
-
-import {
-	ColorByOption,
-	COLOR_BY_FIELDS,
-	COLOR_BY_OPTIONS,
-	DEFAULT_COLOR_BY_FIELD,
-} from '../constants';
-import { getSpanAttribute } from '../utils';
-import {
-	AGGREGATIONS,
-	getAggregationMap as findAggregationMap,
-} from '../utils/aggregations';
-
-interface TraceContextValue {
-	colorByField: TelemetryFieldKey;
-	setColorByField: (field: TelemetryFieldKey) => void;
-	aggregations: WaterfallAggregationResponse[] | undefined;
-	getAggregationMap: (
-		type: WaterfallAggregationType,
-	) => Record<string, number> | undefined;
-	getSpanGroupValue: (span: SpanV3) => string;
-	resolveSpanColor: (span: SpanV3) => string;
-	/**
-	 * Subset of COLOR_BY_OPTIONS whose data is populated on the current trace.
-	 * `service.name` is always included; host/container only when their
-	 * aggregation `value` map has entries.
-	 */
-	availableColorByOptions: ColorByOption[];
-	/**
-	 * Per-user preview fields (selected via the floating "Preview fields"
-	 * panel). Stored in `span_details_preview_attributes` user pref. Will be
-	 * consumed by the flamegraph `selectFields` request and the waterfall +
-	 * flamegraph hover popovers in follow-up phases.
-	 */
-	previewFields: BaseAutocompleteData[];
-	setPreviewFields: (next: BaseAutocompleteData[]) => void;
-}
-
-const TraceContext = createContext<TraceContextValue | null>(null);
-
-export function TraceProvider({
-	aggregations,
-	children,
-}: {
-	aggregations: WaterfallAggregationResponse[] | undefined;
-	children: ReactNode;
-}): JSX.Element | null {
-	const { userPreferences, updateUserPreferenceInContext } = useAppContext();
-	const { mutate: updateUserPreferenceMutation } = useMutation(
-		updateUserPreferenceAPI,
-	);
-
-	// Source of truth: user-preferences API (loaded once on app init via
-	// AppProvider). Render nothing until it resolves so we never paint the
-	// default colour first and then swap to the user's persisted choice.
-	// AppProvider fires the prefs query as soon as the user is logged in, so
-	// this is usually already settled by the time TraceDetailsV3 mounts.
-	const persistedColorByField = useMemo<TelemetryFieldKey>(() => {
-		const pref = userPreferences?.find(
-			(p) => p.name === USER_PREFERENCES.SPAN_DETAILS_COLOR_BY_ATTRIBUTE,
-		);
-		const name = (pref?.value as string) || '';
-		return COLOR_BY_FIELDS.find((f) => f.name === name) ?? DEFAULT_COLOR_BY_FIELD;
-	}, [userPreferences]);
-
-	const setColorByField = useCallback(
-		(field: TelemetryFieldKey): void => {
-			// Optimistically reflect the choice in the in-memory cache so the UI
-			// reacts immediately (the GET /user/preferences response on app init
-			// always includes the registered key, so `existing` will be defined).
-			const existing = userPreferences?.find(
-				(p) => p.name === USER_PREFERENCES.SPAN_DETAILS_COLOR_BY_ATTRIBUTE,
-			);
-			if (existing) {
-				updateUserPreferenceInContext({ ...existing, value: field.name });
-			}
-			updateUserPreferenceMutation({
-				name: USER_PREFERENCES.SPAN_DETAILS_COLOR_BY_ATTRIBUTE,
-				value: field.name,
-			});
-		},
-		[
-			userPreferences,
-			updateUserPreferenceInContext,
-			updateUserPreferenceMutation,
-		],
-	);
-
-	const previewFields = useMemo<BaseAutocompleteData[]>(() => {
-		const pref = userPreferences?.find(
-			(p) => p.name === USER_PREFERENCES.SPAN_DETAILS_PREVIEW_ATTRIBUTES,
-		);
-		const raw = (pref?.value as BaseAutocompleteData[] | undefined) ?? [];
-		// Defensive: keep only entries that have a string `key`.
-		return raw.filter(
-			(f): f is BaseAutocompleteData =>
-				typeof f === 'object' &&
-				f !== null &&
-				typeof (f as { key?: unknown }).key === 'string',
-		);
-	}, [userPreferences]);
-
-	const setPreviewFields = useCallback(
-		(next: BaseAutocompleteData[]): void => {
-			const existing = userPreferences?.find(
-				(p) => p.name === USER_PREFERENCES.SPAN_DETAILS_PREVIEW_ATTRIBUTES,
-			);
-			if (existing) {
-				updateUserPreferenceInContext({ ...existing, value: next });
-			}
-			updateUserPreferenceMutation({
-				name: USER_PREFERENCES.SPAN_DETAILS_PREVIEW_ATTRIBUTES,
-				value: next,
-			});
-		},
-		[
-			userPreferences,
-			updateUserPreferenceInContext,
-			updateUserPreferenceMutation,
-		],
-	);
-
-	const value = useMemo<TraceContextValue>(() => {
-		const isFieldAvailable = (fieldName: string): boolean => {
-			if (fieldName === DEFAULT_COLOR_BY_FIELD.name) {
-				return true;
-			}
-			// Pick any aggregation type — if execution_time_percentage is empty,
-			// span_count for the same field will be too (both are derived from
-			// the same set of spans).
-			const map = findAggregationMap(
-				aggregations,
-				AGGREGATIONS.EXEC_TIME_PCT,
-				fieldName,
-			);
-			return !!map && Object.keys(map).length > 0;
-		};
-
-		const availableColorByOptions = COLOR_BY_OPTIONS.filter((opt) =>
-			isFieldAvailable(opt.field.name),
-		);
-
-		const colorByField =
-			aggregations === undefined || isFieldAvailable(persistedColorByField.name)
-				? persistedColorByField
-				: DEFAULT_COLOR_BY_FIELD;
-
-		const getAggregationMap = (
-			type: WaterfallAggregationType,
-		): Record<string, number> | undefined =>
-			findAggregationMap(aggregations, type, colorByField.name);
-
-		const getSpanGroupValue = (span: SpanV3): string =>
-			getSpanAttribute(span, colorByField.name) || 'unknown';
-
-		const resolveSpanColor = (span: SpanV3): string => {
-			if (span.has_error) {
-				return 'var(--bg-cherry-500)';
-			}
-			return generateColor(
-				getSpanGroupValue(span),
-				themeColors.traceDetailColorsV3,
-			);
-		};
-
-		return {
-			colorByField,
-			setColorByField,
-			aggregations,
-			getAggregationMap,
-			getSpanGroupValue,
-			resolveSpanColor,
-			availableColorByOptions,
-			previewFields,
-			setPreviewFields,
-		};
-	}, [
-		persistedColorByField,
-		aggregations,
-		setColorByField,
-		previewFields,
-		setPreviewFields,
-	]);
-
-	if (!userPreferences) {
-		return null;
-	}
-
-	return <TraceContext.Provider value={value}>{children}</TraceContext.Provider>;
-}
-
-export function useTraceContext(): TraceContextValue {
-	const ctx = useContext(TraceContext);
-	if (!ctx) {
-		throw new Error('useTraceContext must be used inside TraceProvider');
-	}
-	return ctx;
-}

frontend/src/pages/TraceDetailsV3/hooks/useMigratePinnedAttributes.ts

@@ -1,106 +0,0 @@
-import { useEffect, useRef } from 'react';
-import { useMutation } from 'react-query';
-import updateUserPreferenceAPI from 'api/v1/user/preferences/name/update';
-import { USER_PREFERENCES } from 'constants/userPreferences';
-import { isV3PinnedAttribute } from 'pages/TraceDetailsV3/utils';
-import { serializeKeyPath } from 'periscope/components/PrettyView/utils';
-import { useAppContext } from 'providers/App/App';
-import { SpanV3 } from 'types/api/trace/getTraceV3';
-
-/**
- * V2 stored pinned attributes as flat strings (`["http.method"]`).
- * V3 stores nested key paths (`['["attributes","http.method"]']`).
- *
- * On first load with both `userPreferences` and `selectedSpan` available,
- * detect a V2-format value in the backend pref and convert it to V3 paths
- * using the loaded span's shape. Idempotent: once written in V3 format the
- * format check on subsequent loads short-circuits.
- *
- * Unmappable keys (not present on the loaded span) are dropped — we can't
- * determine whether they belong under `attributes`, `resource`, or top-level.
- */
-export function useMigratePinnedAttributes(
-	selectedSpan: SpanV3 | undefined,
-): void {
-	const { userPreferences, updateUserPreferenceInContext } = useAppContext();
-	const { mutate } = useMutation(updateUserPreferenceAPI);
-	const ranRef = useRef(false);
-
-	useEffect(() => {
-		if (ranRef.current) {
-			return;
-		}
-		if (!userPreferences || !selectedSpan) {
-			return;
-		}
-
-		const pref = userPreferences.find(
-			(p) => p.name === USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
-		);
-		const value = (pref?.value as string[] | undefined) ?? [];
-		if (value.length === 0) {
-			ranRef.current = true;
-			return;
-		}
-
-		// Walk every entry — the array may be mixed (e.g. some legacy V2 flat
-		// keys saved alongside V3 paths). V3 entries pass through unchanged;
-		// V2 entries get converted via the loaded span; unmappable V2 entries
-		// are dropped. We only persist when at least one V2 entry was found
-		// (otherwise the input is already V3-clean).
-		const next: string[] = [];
-		let hadV2Entry = false;
-
-		for (const entry of value) {
-			if (isV3PinnedAttribute(entry)) {
-				next.push(entry);
-				continue;
-			}
-			hadV2Entry = true;
-			const path = v2KeyToPath(entry, selectedSpan);
-			if (path) {
-				next.push(serializeKeyPath(path));
-			}
-			// else: unmappable on the loaded span — drop
-		}
-
-		if (!hadV2Entry) {
-			ranRef.current = true;
-			return;
-		}
-
-		if (pref) {
-			updateUserPreferenceInContext({ ...pref, value: next });
-		}
-		mutate(
-			{
-				name: USER_PREFERENCES.SPAN_DETAILS_PINNED_ATTRIBUTES,
-				value: next,
-			},
-			{
-				onSuccess: () => {
-					ranRef.current = true;
-				},
-				onError: () => {
-					// Roll back the optimistic context update
-					if (pref) {
-						updateUserPreferenceInContext({ ...pref, value });
-					}
-				},
-			},
-		);
-	}, [userPreferences, selectedSpan, updateUserPreferenceInContext, mutate]);
-}
-
-function v2KeyToPath(key: string, span: SpanV3): (string | number)[] | null {
-	if (span.attributes && key in span.attributes) {
-		return ['attributes', key];
-	}
-	if (span.resource && key in span.resource) {
-		return ['resource', key];
-	}
-	if (key in (span as unknown as Record<string, unknown>)) {
-		return [key];
-	}
-	return null;
-}

frontend/src/pages/TraceDetailsV3/index.tsx

@@ -12,23 +12,16 @@ import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
 import NoData from 'pages/TraceDetailV2/NoData/NoData';
 import { ResizableBox } from 'periscope/components/ResizableBox';
-import {
-	SpanV3,
-	TraceDetailV3URLProps,
-	WaterfallAggregationRequest,
-} from 'types/api/trace/getTraceV3';
+import { SpanV3, TraceDetailV3URLProps } from 'types/api/trace/getTraceV3';
 
-import { COLOR_BY_FIELDS } from './constants';
-import { TraceProvider } from './contexts/TraceContext';
-import { AGGREGATIONS } from './utils/aggregations';
 import { SpanDetailVariant } from './SpanDetailsPanel/constants';
 import SpanDetailsPanel from './SpanDetailsPanel/SpanDetailsPanel';
-import type { TraceMetadataForHeader } from './TraceDetailsHeader/TraceDetailsHeader';
 import TraceDetailsHeader from './TraceDetailsHeader/TraceDetailsHeader';
 import { FLAMEGRAPH_SPAN_LIMIT } from './TraceFlamegraph/constants';
 import TraceFlamegraph from './TraceFlamegraph/TraceFlamegraph';
-import TraceWaterfall from './TraceWaterfall/TraceWaterfall';
-import { IInterestedSpan } from './TraceWaterfall/types';
+import TraceWaterfall, {
+	IInterestedSpan,
+} from './TraceWaterfall/TraceWaterfall';
 import { getAncestorSpanIds } from './TraceWaterfall/utils';
 
 import './TraceDetailsV3.styles.scss';
@@ -86,17 +79,6 @@ function TraceDetailsV3(): JSX.Element {
 		});
 	}, [urlQuery]);
 
-	// Hardcoded for now — fetch aggregations for all 3 candidate color-by fields
-	// upfront so a future color-by-field switch doesn't need to refetch.
-	const waterfallAggregationsRequest = useMemo<WaterfallAggregationRequest[]>(
-		() =>
-			COLOR_BY_FIELDS.flatMap((field) => [
-				{ field, aggregation: AGGREGATIONS.EXEC_TIME_PCT },
-				{ field, aggregation: AGGREGATIONS.SPAN_COUNT },
-			]),
-		[],
-	);
-
 	// Once all spans are loaded (frontend mode), freeze query params so
 	// subsequent interestedSpanId changes don't trigger unnecessary refetches.
 	const fullDataLoadedRef = useRef(false);
@@ -104,7 +86,6 @@ function TraceDetailsV3(): JSX.Element {
 		selectedSpanId: interestedSpanId.spanId,
 		isSelectedSpanIDUnCollapsed: interestedSpanId.isUncollapsed,
 		uncollapsedSpans: uncollapsedNodes,
-		aggregations: waterfallAggregationsRequest,
 	});
 
 	const queryParams = fullDataLoadedRef.current
@@ -113,7 +94,6 @@ function TraceDetailsV3(): JSX.Element {
 				selectedSpanId: interestedSpanId.spanId,
 				isSelectedSpanIDUnCollapsed: interestedSpanId.isUncollapsed,
 				uncollapsedSpans: uncollapsedNodes,
-				aggregations: waterfallAggregationsRequest,
 			};
 
 	const {
@@ -125,7 +105,6 @@ function TraceDetailsV3(): JSX.Element {
 		uncollapsedSpans: queryParams.uncollapsedSpans,
 		selectedSpanId: queryParams.selectedSpanId,
 		isSelectedSpanIDUnCollapsed: queryParams.isSelectedSpanIDUnCollapsed,
-		aggregations: queryParams.aggregations,
 	});
 
 	const allSpans = traceData?.payload?.spans || [];
@@ -140,7 +119,6 @@ function TraceDetailsV3(): JSX.Element {
 			selectedSpanId: interestedSpanId.spanId,
 			isSelectedSpanIDUnCollapsed: interestedSpanId.isUncollapsed,
 			uncollapsedSpans: uncollapsedNodes,
-			aggregations: waterfallAggregationsRequest,
 		};
 	}
 
@@ -235,23 +213,6 @@ function TraceDetailsV3(): JSX.Element {
 		],
 	);
 
-	const traceMetadataForHeader = useMemo(():
-		| TraceMetadataForHeader
-		| undefined => {
-		const payload = traceData?.payload;
-		if (!payload) {
-			return undefined;
-		}
-		const rootSpan = payload.spans?.find((s) => s.level === 0);
-		return {
-			startTimestampMillis: payload.startTimestampMillis,
-			endTimestampMillis: payload.endTimestampMillis,
-			rootServiceName: payload.rootServiceName,
-			rootServiceEntryPoint: payload.rootServiceEntryPoint,
-			rootSpanStatusCode: rootSpan?.response_status_code || '',
-		};
-	}, [traceData?.payload]);
-
 	const showNoData =
 		!isFetchingTraceData &&
 		(!!errorFetchingTraceData || !traceData?.payload?.spans?.length);
@@ -285,116 +246,104 @@ function TraceDetailsV3(): JSX.Element {
 	);
 
 	return (
-		<TraceProvider aggregations={traceData?.payload?.aggregations}>
-			<div className="trace-details-v3">
-				<TraceDetailsHeader
-					filterMetadata={filterMetadata}
-					onFilteredSpansChange={handleFilteredSpansChange}
-					isDataLoaded={!!traceData?.payload?.spans?.length && !showNoData}
-					traceMetadata={traceMetadataForHeader}
-				/>
+		<div className="trace-details-v3">
+			<TraceDetailsHeader
+				filterMetadata={filterMetadata}
+				onFilteredSpansChange={handleFilteredSpansChange}
+				noData={showNoData}
+			/>
 
-				{showNoData ? (
-					<NoData />
-				) : (
-					<>
-						<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="trace-details-v3__flame-collapse"
-								items={[
-									{
-										key: 'flame',
-										label: (
-											<div className="trace-details-v3__collapse-label">
-												<span>Flame Graph</span>
-												{traceData?.payload?.totalSpansCount ? (
-													<span className="trace-details-v3__collapse-count">
-														<span>Spans: {traceData.payload.totalSpansCount}</span>
-														<span
-															className={
-																traceData.payload.totalErrorSpansCount > 0
-																	? 'trace-details-v3__collapse-count-errors'
-																	: undefined
-															}
-														>
-															Errors: {traceData.payload.totalErrorSpansCount ?? 0}
-														</span>
-														{traceData.payload.totalSpansCount > FLAMEGRAPH_SPAN_LIMIT && (
-															<WarningPopover
-																message="The total span count exceeds the visualization limit. Displaying a sampled subset of spans in flamegraph."
-																placement="bottomRight"
-																autoAdjustOverflow={false}
-															/>
-														)}
-													</span>
-												) : null}
-											</div>
-										),
-										children: (
-											<ResizableBox defaultHeight={300} minHeight={100} maxHeight={400}>
-												<TraceFlamegraph
-													filteredSpanIds={filteredSpanIds}
-													isFilterActive={isFilterActive}
-												/>
-											</ResizableBox>
-										),
-									},
-								]}
-							/>
+			{showNoData ? (
+				<NoData />
+			) : (
+				<>
+					<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="trace-details-v3__flame-collapse"
+							items={[
+								{
+									key: 'flame',
+									label: (
+										<div className="trace-details-v3__collapse-label">
+											<span>Flame Graph</span>
+											{traceData?.payload?.totalSpansCount ? (
+												<span className="trace-details-v3__collapse-count">
+													{traceData.payload.totalSpansCount} spans
+													{traceData.payload.totalSpansCount > FLAMEGRAPH_SPAN_LIMIT && (
+														<WarningPopover
+															message="The total span count exceeds the visualization limit. Displaying a sampled subset of spans."
+															placement="bottomRight"
+															autoAdjustOverflow={false}
+														/>
+													)}
+												</span>
+											) : null}
+										</div>
+									),
+									children: (
+										<ResizableBox defaultHeight={300} minHeight={100} maxHeight={400}>
+											<TraceFlamegraph
+												filteredSpanIds={filteredSpanIds}
+												isFilterActive={isFilterActive}
+											/>
+										</ResizableBox>
+									),
+								},
+							]}
+						/>
 
-							<Collapse
-								// @ts-expect-error motion is passed through to rc-collapse to disable animation
-								motion={false}
-								activeKey={activeKeys.filter((k) => k === 'waterfall')}
-								onChange={(): void => handleCollapseChange('waterfall')}
-								size="small"
-								className={`trace-details-v3__waterfall-collapse${
-									isWaterfallDocked
-										? ' trace-details-v3__waterfall-collapse--docked'
-										: ''
-								}`}
-								items={[
-									{
-										key: 'waterfall',
-										label: 'Waterfall',
-										children: activeKeys.includes('waterfall') ? waterfallChildren : null,
-									},
-								]}
-							/>
+						<Collapse
+							// @ts-expect-error motion is passed through to rc-collapse to disable animation
+							motion={false}
+							activeKey={activeKeys.filter((k) => k === 'waterfall')}
+							onChange={(): void => handleCollapseChange('waterfall')}
+							size="small"
+							className={`trace-details-v3__waterfall-collapse${
+								isWaterfallDocked ? ' trace-details-v3__waterfall-collapse--docked' : ''
+							}`}
+							items={[
+								{
+									key: 'waterfall',
+									label: 'Waterfall',
+									children: activeKeys.includes('waterfall') ? waterfallChildren : null,
+								},
+							]}
+						/>
 
-							{panelState.isOpen && isDocked && (
-								<div className="trace-details-v3__docked-span-details">
-									<SpanDetailsPanel
-										panelState={panelState}
-										selectedSpan={selectedSpan}
-										variant={SpanDetailVariant.DOCKED}
-										onVariantChange={handleVariantChange}
-										traceStartTime={traceData?.payload?.startTimestampMillis}
-										traceEndTime={traceData?.payload?.endTimestampMillis}
-									/>
-								</div>
-							)}
-						</div>
-
-						{panelState.isOpen && !isDocked && (
-							<SpanDetailsPanel
-								panelState={panelState}
-								selectedSpan={selectedSpan}
-								variant={SpanDetailVariant.DIALOG}
-								onVariantChange={handleVariantChange}
-								traceStartTime={traceData?.payload?.startTimestampMillis}
-								traceEndTime={traceData?.payload?.endTimestampMillis}
-							/>
+						{panelState.isOpen && isDocked && (
+							<div className="trace-details-v3__docked-span-details">
+								<SpanDetailsPanel
+									panelState={panelState}
+									selectedSpan={selectedSpan}
+									variant={SpanDetailVariant.DOCKED}
+									onVariantChange={handleVariantChange}
+									traceStartTime={traceData?.payload?.startTimestampMillis}
+									traceEndTime={traceData?.payload?.endTimestampMillis}
+									serviceExecTime={traceData?.payload?.serviceNameToTotalDurationMap}
+								/>
+							</div>
 						)}
-					</>
-				)}
-			</div>
-		</TraceProvider>
+					</div>
+
+					{panelState.isOpen && !isDocked && (
+						<SpanDetailsPanel
+							panelState={panelState}
+							selectedSpan={selectedSpan}
+							variant={SpanDetailVariant.DIALOG}
+							onVariantChange={handleVariantChange}
+							traceStartTime={traceData?.payload?.startTimestampMillis}
+							traceEndTime={traceData?.payload?.endTimestampMillis}
+							serviceExecTime={traceData?.payload?.serviceNameToTotalDurationMap}
+						/>
+					)}
+				</>
+			)}
+		</div>
 	);
 }
 

frontend/src/pages/TraceDetailsV3/utils.ts

@@ -3,17 +3,10 @@ import { SpanV3 } from 'types/api/trace/getTraceV3';
 /**
  * Look up an attribute from both `resource` and `attributes` on a span.
  * Resources are checked first (service.name, k8s.* etc. live there).
- *
- * Accepts both `SpanV3` (waterfall) and `FlamegraphSpan` (flamegraph) by typing
- * structurally — the only fields touched are `resource` and `attributes`.
- *
  * TODO: Remove tagMap fallback when phasing out V2
  */
 export function getSpanAttribute(
-	span: {
-		resource?: Record<string, string>;
-		attributes?: Record<string, any>;
-	},
+	span: SpanV3,
 	key: string,
 ): string | undefined {
 	return (
@@ -38,40 +31,3 @@ export function hasInfraMetadata(span: SpanV3 | undefined): boolean {
 	}
 	return INFRA_METADATA_KEYS.some((key) => getSpanAttribute(span, key));
 }
-
-// Top-level fields that exist on the API response only to support waterfall
-// rendering. They have no value in the Span Details DataViewer. Drop the whole
-// constant + helper once the backend stops emitting them.
-const HIDDEN_SPAN_FIELDS_IN_DETAILS_VIEW: ReadonlySet<string> = new Set([
-	'sub_tree_node_count',
-	'has_children',
-	'level',
-	'service.name',
-]);
-
-/**
- * Shallow-copies the span with waterfall-only fields stripped, for display in
- * the Span Details DataViewer.
- */
-export function getSpanDisplayData(span: SpanV3): Record<string, unknown> {
-	const result: Record<string, unknown> = {};
-	for (const [key, value] of Object.entries(span)) {
-		if (!HIDDEN_SPAN_FIELDS_IN_DETAILS_VIEW.has(key)) {
-			result[key] = value;
-		}
-	}
-	return result;
-}
-
-/**
- * V3 pinned-attribute entries are JSON-stringified arrays (e.g.
- * `'["attributes","http.method"]'`). Legacy V2 entries are flat strings.
- * Used to distinguish V3 from V2 entries when reading the persisted value.
- */
-export function isV3PinnedAttribute(entry: string): boolean {
-	try {
-		return Array.isArray(JSON.parse(entry));
-	} catch {
-		return false;
-	}
-}

frontend/src/pages/TraceDetailsV3/utils/aggregations.ts

@@ -1,20 +0,0 @@
-import {
-	WaterfallAggregationResponse,
-	WaterfallAggregationType,
-} from 'types/api/trace/getTraceV3';
-
-export const AGGREGATIONS = {
-	EXEC_TIME_PCT: 'execution_time_percentage',
-	SPAN_COUNT: 'span_count',
-	DURATION: 'duration',
-} as const satisfies Record<string, WaterfallAggregationType>;
-
-export function getAggregationMap(
-	aggregations: WaterfallAggregationResponse[] | undefined,
-	type: WaterfallAggregationType,
-	fieldName: string,
-): Record<string, number> | undefined {
-	return aggregations?.find(
-		(a) => a.aggregation === type && a.field.name === fieldName,
-	)?.value;
-}

frontend/src/pages/TraceDetailsV3/utils/previewFields.ts

@@ -1,77 +0,0 @@
-import {
-	BaseAutocompleteData,
-	DataTypes,
-} from 'types/api/queryBuilder/queryAutocompleteResponse';
-import {
-	FieldContext,
-	FieldDataType,
-	TelemetryFieldKey,
-} from 'types/api/v5/queryRange';
-
-/**
- * Map the picker's `BaseAutocompleteData.type` (`'tag' | 'resource' | '' | null`)
- * to the API's `FieldContext`. Unknown values fall back to `'attribute'`.
- */
-function mapFieldContext(type: BaseAutocompleteData['type']): FieldContext {
-	if (type === 'resource') {
-		return 'resource';
-	}
-	return 'attribute';
-}
-
-const DATA_TYPE_MAP: Record<DataTypes, FieldDataType> = {
-	[DataTypes.String]: 'string',
-	[DataTypes.bool]: 'bool',
-	[DataTypes.Int64]: 'int64',
-	[DataTypes.Float64]: 'float64',
-	[DataTypes.ArrayString]: '[]string',
-	[DataTypes.ArrayBool]: '[]bool',
-	[DataTypes.ArrayInt64]: '[]int64',
-	[DataTypes.ArrayFloat64]: '[]float64',
-	[DataTypes.EMPTY]: 'string',
-};
-
-function mapFieldDataType(
-	dataType: BaseAutocompleteData['dataType'],
-): FieldDataType {
-	if (!dataType) {
-		return 'string';
-	}
-	return DATA_TYPE_MAP[dataType] ?? 'string';
-}
-
-/**
- * Convert a picker-shaped field to the API's `TelemetryFieldKey` shape used
- * for `selectFields` on the flamegraph request.
- */
-export function toTelemetryFieldKey(
-	field: BaseAutocompleteData,
-): TelemetryFieldKey {
-	return {
-		name: field.key,
-		fieldContext: mapFieldContext(field.type),
-		fieldDataType: mapFieldDataType(field.dataType),
-	};
-}
-
-/**
- * Merge two `TelemetryFieldKey` lists, de-duping by `name`. Earlier entries win
- * (so callers can pass user-controlled fields after a baseline list and have
- * the baseline's metadata be preserved).
- */
-export function mergeTelemetryFieldKeys(
-	...lists: TelemetryFieldKey[][]
-): TelemetryFieldKey[] {
-	const seen = new Set<string>();
-	const out: TelemetryFieldKey[] = [];
-	for (const list of lists) {
-		for (const f of list) {
-			if (seen.has(f.name)) {
-				continue;
-			}
-			seen.add(f.name);
-			out.push(f);
-		}
-	}
-	return out;
-}

frontend/src/periscope/components/JsonView/JsonView.tsx

@@ -23,14 +23,7 @@ const editorOptions: EditorProps['options'] = {
 	lineHeight: 18,
 	colorDecorators: true,
 	scrollBeyondLastLine: false,
-	scrollbar: {
-		vertical: 'hidden',
-		horizontal: 'hidden',
-		// Once the editor can't scroll any further, release the wheel event so
-		// the parent container picks it up. Without this Monaco swallows the
-		// event at the boundary and outer scroll feels stuck.
-		alwaysConsumeMouseWheel: false,
-	},
+	scrollbar: { vertical: 'hidden', horizontal: 'hidden' },
 	folding: false,
 };
 

frontend/src/periscope/components/PrettyView/PrettyView.tsx

@@ -56,13 +56,6 @@ export interface PrettyViewProps {
 	searchable?: boolean;
 	showPinned?: boolean;
 	drawerKey?: string;
-	/**
-	 * Controlled list of pinned key paths (each entry is `JSON.stringify(path)`).
-	 * When provided, PrettyView delegates persistence to the caller via
-	 * `onPinnedFieldsChange` and skips its own localStorage I/O.
-	 */
-	pinnedFieldsValue?: string[];
-	onPinnedFieldsChange?: (next: string[]) => void;
 }
 
 function PrettyView({
@@ -72,8 +65,6 @@ function PrettyView({
 	searchable = true,
 	showPinned = false,
 	drawerKey = 'default',
-	pinnedFieldsValue,
-	onPinnedFieldsChange,
 }: PrettyViewProps): JSX.Element {
 	const isDarkMode = useIsDarkMode();
 	const [, setCopy] = useCopyToClipboard();
@@ -84,10 +75,7 @@ function PrettyView({
 		pinnedEntries,
 		pinnedData,
 		displayKeyToForwardPath,
-	} = usePinnedFields(data, drawerKey, {
-		value: pinnedFieldsValue,
-		onChange: onPinnedFieldsChange,
-	});
+	} = usePinnedFields(data, drawerKey);
 
 	const filteredPinnedData = useMemo(() => {
 		const trimmed = searchQuery.trim();

frontend/src/periscope/components/PrettyView/hooks/usePinnedFields.ts

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import getLocalStorageKey from 'api/browser/localstorage/get';
 import setLocalStorageKey from 'api/browser/localstorage/set';
 
@@ -42,58 +42,17 @@ export interface UsePinnedFieldsReturn {
 	displayKeyToForwardPath: Record<string, (string | number)[]>;
 }
 
-export interface UsePinnedFieldsOptions {
-	/**
-	 * Initial / controlled list of serialized key paths.
-	 * When provided, overrides the default localStorage read.
-	 */
-	value?: string[];
-	/**
-	 * Called whenever the pin set changes. When provided, the caller is
-	 * responsible for persistence (e.g. backend user preference).
-	 */
-	onChange?: (next: string[]) => void;
-}
-
-/**
- * Persistence behavior:
- * - Controlled (`options.value`/`options.onChange` provided) → caller drives
- *   state and persistence. localStorage is not touched, regardless of
- *   `drawerKey`.
- * - Uncontrolled with `drawerKey` → reads/writes `pinnedFields:${drawerKey}`
- *   in localStorage.
- * - Uncontrolled without `drawerKey` → in-memory only (no persistence).
- */
 function usePinnedFields(
 	data: AnyRecord,
-	drawerKey?: string,
-	options?: UsePinnedFieldsOptions,
+	drawerKey: string,
 ): UsePinnedFieldsReturn {
-	const controlledValue = options?.value;
-	const onChange = options?.onChange;
-	const isControlled = controlledValue !== undefined || onChange !== undefined;
-	const storageKey =
-		!isControlled && drawerKey ? `${STORAGE_PREFIX}:${drawerKey}` : null;
+	const storageKey = `${STORAGE_PREFIX}:${drawerKey}`;
 
+	// Stored as serialized keyPath arrays (JSON strings)
 	const [pinnedSerializedKeys, setPinnedSerializedKeys] = useState<Set<string>>(
-		() => {
-			if (controlledValue) {
-				return new Set(controlledValue);
-			}
-			if (storageKey) {
-				return new Set(loadFromStorage(storageKey));
-			}
-			return new Set();
-		},
+		() => new Set(loadFromStorage(storageKey)),
 	);
 
-	// Sync state with the controlled value when it changes externally.
-	useEffect(() => {
-		if (controlledValue) {
-			setPinnedSerializedKeys(new Set(controlledValue));
-		}
-	}, [controlledValue]);
-
 	const togglePin = useCallback(
 		(forwardPath: (string | number)[]): void => {
 			const serialized = serializeKeyPath(forwardPath);
@@ -104,17 +63,11 @@ function usePinnedFields(
 				} else {
 					next.add(serialized);
 				}
-				const arr = Array.from(next);
-				if (storageKey) {
-					saveToStorage(storageKey, arr);
-				}
-				if (onChange) {
-					onChange(arr);
-				}
+				saveToStorage(storageKey, Array.from(next));
 				return next;
 			});
 		},
-		[storageKey, onChange],
+		[storageKey],
 	);
 
 	const isPinned = useCallback(

frontend/src/types/api/trace/getTraceFlamegraph.ts

@@ -1,5 +1,3 @@
-import { TelemetryFieldKey } from 'types/api/v5/queryRange';
-
 export interface TraceDetailFlamegraphURLProps {
 	id: string;
 }
@@ -8,7 +6,6 @@ export interface GetTraceFlamegraphPayloadProps {
 	traceId: string;
 	selectedSpanId?: string;
 	limit?: number;
-	selectFields?: TelemetryFieldKey[];
 }
 
 export interface Event {
@@ -29,8 +26,6 @@ export interface FlamegraphSpan {
 	name: string;
 	level: number;
 	event: Event[];
-	resource?: Record<string, string>;
-	attributes?: Record<string, any>;
 }
 
 export interface GetTraceFlamegraphSuccessResponse {

frontend/src/types/api/trace/getTraceV3.ts

@@ -1,26 +1,9 @@
-import { TelemetryFieldKey } from 'types/api/v5/queryRange';
-
-export type WaterfallAggregationType =
-	| 'span_count'
-	| 'execution_time_percentage'
-	| 'duration';
-
-export interface WaterfallAggregationRequest {
-	field: TelemetryFieldKey;
-	aggregation: WaterfallAggregationType;
-}
-
-export interface WaterfallAggregationResponse extends WaterfallAggregationRequest {
-	value: Record<string, number>;
-}
-
 export interface GetTraceV3PayloadProps {
 	traceId: string;
 	selectedSpanId: string;
 	uncollapsedSpans: string[];
 	isSelectedSpanIDUnCollapsed: boolean;
 	limit?: number; // Optional limit for number of spans to fetch, default can be set in API
-	aggregations?: WaterfallAggregationRequest[];
 }
 
 export interface TraceDetailV3URLProps {
@@ -98,5 +81,5 @@ export interface GetTraceV3SuccessResponse {
 	totalErrorSpansCount: number;
 	rootServiceName: string;
 	rootServiceEntryPoint: string;
-	aggregations?: WaterfallAggregationResponse[];
+	serviceNameToTotalDurationMap: Record<string, number>;
 }

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

@@ -34,7 +34,7 @@ describe('extractQueryPairs', () => {
 					valueEnd: undefined,
 					valueStart: undefined,
 				},
-				isComplete: true,
+				isComplete: false,
 			},
 			{
 				key: 'name',
@@ -204,7 +204,7 @@ describe('extractQueryPairs', () => {
 				key: 'active',
 				operator: 'EXISTS',
 				value: undefined,
-				isComplete: true,
+				isComplete: false,
 			}),
 		]);
 	});
@@ -388,7 +388,7 @@ describe('extractQueryPairs', () => {
 		expect(result[0].operator).toBe('exists');
 		expect(result[0].value).toBeUndefined();
 		expect(result[0].valuesPosition).toStrictEqual([]);
-		expect(result[0].isComplete).toBe(true);
+		expect(result[0].isComplete).toBe(false);
 		expect(result[1].key).toBe('service.name');
 		expect(result[1].operator).toBe('contains');
 		expect(result[1].value).toBe('"test"');

frontend/src/utils/queryContextUtils.ts

@@ -1208,7 +1208,7 @@ export function extractQueryPairs(query: string): IQueryPair[] {
 						isComplete: !!(
 							currentPair.key &&
 							currentPair.operator &&
-							(currentPair.value || isNonValueOperator(currentPair.operator))
+							currentPair.value
 						),
 					} as IQueryPair);
 				}
@@ -1369,7 +1369,7 @@ export function extractQueryPairs(query: string): IQueryPair[] {
 					isComplete: !!(
 						currentPair.key &&
 						currentPair.operator &&
-						(currentPair.value || isNonValueOperator(currentPair.operator))
+						currentPair.value
 					),
 				} as IQueryPair);
 
@@ -1414,7 +1414,7 @@ export function extractQueryPairs(query: string): IQueryPair[] {
 				isComplete: !!(
 					currentPair.key &&
 					currentPair.operator &&
-					(currentPair.value || isNonValueOperator(currentPair.operator))
+					currentPair.value
 				),
 			} as IQueryPair);
 		}

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,14 @@
+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/fixtures/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/fixtures/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/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 / "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/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