[pull] main from SigNoz:main

frontend/public/locales/en-GB/titles.json

@@ -62,7 +62,7 @@
 	"TRACES_FUNNELS_DETAIL": "SigNoz | Funnel",
 	"INTEGRATIONS_DETAIL": "SigNoz | Integration",
 	"PUBLIC_DASHBOARD": "SigNoz | Dashboard",
-	"LLM_OBSERVABILITY_OVERVIEW": "SigNoz | LLM Observability Overview",
-	"LLM_OBSERVABILITY_CONFIGURATION": "SigNoz | LLM Observability Configuration",
-	"LLM_OBSERVABILITY_ATTRIBUTE_MAPPING": "SigNoz | LLM Observability Attribute Mapping"
+	"AI_OBSERVABILITY_OVERVIEW": "SigNoz | AI Observability Overview",
+	"AI_OBSERVABILITY_CONFIGURATION": "SigNoz | AI Observability Configuration",
+	"AI_OBSERVABILITY_ATTRIBUTE_MAPPING": "SigNoz | AI Observability Attribute Mapping"
 }

frontend/public/locales/en/titles.json

@@ -87,7 +87,7 @@
 	"TRACES_FUNNELS_DETAIL": "SigNoz | Funnel",
 	"INTEGRATIONS_DETAIL": "SigNoz | Integration",
 	"PUBLIC_DASHBOARD": "SigNoz | Dashboard",
-	"LLM_OBSERVABILITY_OVERVIEW": "SigNoz | LLM Observability Overview",
-	"LLM_OBSERVABILITY_CONFIGURATION": "SigNoz | LLM Observability Configuration",
-	"LLM_OBSERVABILITY_ATTRIBUTE_MAPPING": "SigNoz | LLM Observability Attribute Mapping"
+	"AI_OBSERVABILITY_OVERVIEW": "SigNoz | AI Observability Overview",
+	"AI_OBSERVABILITY_CONFIGURATION": "SigNoz | AI Observability Configuration",
+	"AI_OBSERVABILITY_ATTRIBUTE_MAPPING": "SigNoz | AI Observability Attribute Mapping"
 }

frontend/src/AppRoutes/Private.tsx

@@ -134,8 +134,8 @@ function PrivateRoute({ children }: PrivateRouteProps): JSX.Element {
 	}
 
 	if (
-		(pathname.startsWith(`${ROUTES.LLM_OBSERVABILITY_BASE}/`) ||
-			pathname === ROUTES.LLM_OBSERVABILITY_BASE) &&
+		(pathname.startsWith(`${ROUTES.AI_OBSERVABILITY_BASE}/`) ||
+			pathname === ROUTES.AI_OBSERVABILITY_BASE) &&
 		!isAIObservabilityEnabled
 	) {
 		return <Redirect to={ROUTES.HOME} />;

frontend/src/AppRoutes/routes.ts

@@ -514,24 +514,24 @@ const routes: AppRoutes[] = [
 		isPrivate: true,
 	},
 	{
-		path: ROUTES.LLM_OBSERVABILITY_ATTRIBUTE_MAPPING,
+		path: ROUTES.AI_OBSERVABILITY_ATTRIBUTE_MAPPING,
 		exact: true,
 		component: LLMObservabilityPage,
-		key: 'LLM_OBSERVABILITY_ATTRIBUTE_MAPPING',
+		key: 'AI_OBSERVABILITY_ATTRIBUTE_MAPPING',
 		isPrivate: true,
 	},
 	{
-		path: ROUTES.LLM_OBSERVABILITY_OVERVIEW,
+		path: ROUTES.AI_OBSERVABILITY_OVERVIEW,
 		exact: true,
 		component: LLMObservabilityPage,
-		key: 'LLM_OBSERVABILITY_OVERVIEW',
+		key: 'AI_OBSERVABILITY_OVERVIEW',
 		isPrivate: true,
 	},
 	{
-		path: ROUTES.LLM_OBSERVABILITY_CONFIGURATION,
+		path: ROUTES.AI_OBSERVABILITY_CONFIGURATION,
 		exact: true,
 		component: LLMObservabilityPage,
-		key: 'LLM_OBSERVABILITY_CONFIGURATION',
+		key: 'AI_OBSERVABILITY_CONFIGURATION',
 		isPrivate: true,
 	},
 ];

frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/QueryAddOns.styles.scss

@@ -247,11 +247,6 @@
 						var(--l2-background)
 					) !important;
 
-					&,
-					.ͼ1a {
-						color: var(--query-builder-v2-color, var(--l2-foreground));
-					}
-
 					::-moz-selection {
 						background: var(
 							--query-builder-v2-selection-background-color,

frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch.styles.scss

@@ -293,11 +293,6 @@ $max-recents-shown: 5;
 				var(--l2-background)
 			) !important;
 
-			&,
-			.ͼ1a {
-				color: var(--query-builder-v2-color, var(--l2-foreground));
-			}
-
 			::-moz-selection {
 				background: var(
 					--query-builder-v2-selection-background-color,

frontend/src/constants/routes.ts

@@ -89,10 +89,10 @@ const ROUTES = {
 	AI_ASSISTANT_BASE: '/ai-assistant',
 	AI_ASSISTANT_ICON_PREVIEW: '/ai-assistant-icon-preview',
 	MCP_SERVER: '/settings/mcp-server',
-	LLM_OBSERVABILITY_ATTRIBUTE_MAPPING: '/llm-observability/attribute-mapping',
-	LLM_OBSERVABILITY_BASE: '/llm-observability',
-	LLM_OBSERVABILITY_OVERVIEW: '/llm-observability/overview',
-	LLM_OBSERVABILITY_CONFIGURATION: '/llm-observability/configuration',
+	AI_OBSERVABILITY_ATTRIBUTE_MAPPING: '/ai-observability/attribute-mapping',
+	AI_OBSERVABILITY_BASE: '/ai-observability',
+	AI_OBSERVABILITY_OVERVIEW: '/ai-observability/overview',
+	AI_OBSERVABILITY_CONFIGURATION: '/ai-observability/configuration',
 } as const;
 
 export default ROUTES;

frontend/src/container/LLMObservability/Overview/Overview.module.scss

@@ -9,6 +9,4 @@
 	:global([class*='dashboardPageHeader']) {
 		display: none;
 	}
-	// remove margin added by the hidden header to avoid extra whitespace at the top of the page
-	margin-top: calc(var(--spacing-8) * -1);
 }

frontend/src/container/LLMObservability/Settings/ModelPricing/ModelCostTabPanel/components/ModelCostDrawer/ModelCostDrawer.module.scss

@@ -18,7 +18,7 @@
 	--dialog-footer-padding: var(--spacing-8) var(--spacing-12);
 
 	display: flex;
-	overflow-y: auto;
+	overflow: hidden;
 
 	// The drawer body — children render inside [data-slot='drawer-description']
 	// (this is the @signozhq drawer, not antd, so .ant-drawer-body was a no-op).
@@ -27,6 +27,8 @@
 		flex-direction: column;
 		gap: var(--spacing-12);
 		padding: var(--spacing-10) var(--spacing-12);
+		min-height: 0;
+		overflow-y: auto;
 	}
 
 	[data-slot='select-content'] {

frontend/src/container/LLMObservability/Settings/ModelPricing/ModelCostTabPanel/components/ModelCostDrawer/components/ExtraPricingBuckets/ExtraPricingBuckets.module.scss

@@ -51,7 +51,6 @@
 	gap: var(--spacing-5);
 	padding: var(--spacing-6);
 	border-radius: 6px;
-	background: var(--l2-background);
 	border: 1px solid var(--l2-border);
 }
 

frontend/src/container/LLMObservability/Settings/ModelPricing/ModelCostTabPanel/components/ModelCostDrawer/components/PatternEditor/PatternEditor.module.scss

@@ -9,7 +9,6 @@
 .patternBox {
 	display: flex;
 	flex-direction: column;
-	gap: var(--spacing-6);
 	padding: var(--spacing-6);
 	border-radius: 6px;
 	border: 1px solid var(--l2-border);
@@ -18,14 +17,14 @@
 .patternChips {
 	display: flex;
 	flex-wrap: wrap;
-	gap: var(--spacing-3);
-	min-height: 28px;
+	gap: var(--spacing-0) var(--spacing-3);
 }
 
 .patternChip {
 	display: inline-flex;
 	align-items: center;
 	gap: var(--spacing-2);
+	margin-bottom: var(--spacing-4);
 }
 
 .patternChipRemove {

frontend/src/container/LLMObservability/Settings/ModelPricing/ModelCostTabPanel/components/ModelCostDrawer/components/SourceSelector/SourceSelector.module.scss

@@ -30,7 +30,6 @@
 		padding: var(--spacing-5) var(--spacing-6);
 		border-radius: var(--radius-2);
 		border: 1px solid transparent;
-		background: var(--l3-background);
 		margin: 0;
 		width: 100%;
 		// Include padding + border in the 100% width so the card fits inside
@@ -67,16 +66,11 @@
 
 		// Radix RadioGroupItem renders <button data-state="checked|unchecked">.
 		// Use :has() to highlight the wrapper card when its inner button is checked.
-		&.sourceRadioAuto:has(button[data-state='checked']) {
+		&:has(button[data-state='checked']) {
 			background: color-mix(in srgb, var(--accent-primary) 10%, transparent);
 			border-color: color-mix(in srgb, var(--accent-primary) 30%, transparent);
 		}
 
-		&.sourceRadioOverride:has(button[data-state='checked']) {
-			background: color-mix(in srgb, var(--accent-amber) 10%, transparent);
-			border-color: color-mix(in srgb, var(--accent-amber) 30%, transparent);
-		}
-
 		&:hover {
 			background: var(--l3-background-hover);
 		}

frontend/src/container/LLMObservability/Settings/ModelPricing/ModelCostTabPanel/components/ModelCostDrawer/components/SourceSelector/SourceSelector.tsx

@@ -60,7 +60,7 @@ function SourceSelector({
 			>
 				<RadioGroupItem
 					value="auto"
-					containerClassName={cx(styles.sourceRadio, styles.sourceRadioAuto)}
+					containerClassName={styles.sourceRadio}
 					testId="drawer-source-auto"
 					disabled={disableAuto}
 				>
@@ -73,7 +73,7 @@ function SourceSelector({
 				</RadioGroupItem>
 				<RadioGroupItem
 					value="override"
-					containerClassName={cx(styles.sourceRadio, styles.sourceRadioOverride)}
+					containerClassName={styles.sourceRadio}
 					testId="drawer-source-override"
 				>
 					<div className={styles.sourceRadioTitle}>User override</div>

frontend/src/container/LLMObservability/Settings/ModelPricing/UnpricedModelsTab/UnpricedModelsTab.module.scss

@@ -13,6 +13,7 @@
 	border: 1px solid color-mix(in srgb, var(--bg-amber-400) 30%, transparent);
 	background: color-mix(in srgb, var(--bg-amber-400) 8%, transparent);
 	color: var(--bg-amber-300, var(--bg-amber-400));
+	margin-top: var(--spacing-4);
 }
 
 .bannerIcon {

frontend/src/container/LLMObservability/__tests__/LLMObservability.test.tsx

@@ -37,7 +37,7 @@ describe('LLMObservability (integration)', () => {
 
 	it('renders the overview panel and the tab bar on the overview route', () => {
 		render(<LLMObservability />, undefined, {
-			initialRoute: ROUTES.LLM_OBSERVABILITY_OVERVIEW,
+			initialRoute: ROUTES.AI_OBSERVABILITY_OVERVIEW,
 		});
 
 		expect(screen.getByTestId('llm-observability-tabs')).toBeInTheDocument();
@@ -55,32 +55,32 @@ describe('LLMObservability (integration)', () => {
 	it('navigates to the configuration route when the Model pricing tab is clicked', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 		render(<LLMObservability />, undefined, {
-			initialRoute: ROUTES.LLM_OBSERVABILITY_OVERVIEW,
+			initialRoute: ROUTES.AI_OBSERVABILITY_OVERVIEW,
 		});
 
 		await user.click(screen.getByRole('tab', { name: 'Model pricing' }));
 
 		expect(safeNavigateMock).toHaveBeenCalledWith(
-			ROUTES.LLM_OBSERVABILITY_CONFIGURATION,
+			ROUTES.AI_OBSERVABILITY_CONFIGURATION,
 		);
 	});
 
 	it('navigates to the attribute mapping route when that tab is clicked', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 		render(<LLMObservability />, undefined, {
-			initialRoute: ROUTES.LLM_OBSERVABILITY_OVERVIEW,
+			initialRoute: ROUTES.AI_OBSERVABILITY_OVERVIEW,
 		});
 
 		await user.click(screen.getByRole('tab', { name: 'Attribute Mapping' }));
 
 		expect(safeNavigateMock).toHaveBeenCalledWith(
-			ROUTES.LLM_OBSERVABILITY_ATTRIBUTE_MAPPING,
+			ROUTES.AI_OBSERVABILITY_ATTRIBUTE_MAPPING,
 		);
 	});
 
 	it('renders the attribute mapping page on the attribute mapping route', () => {
 		render(<LLMObservability />, undefined, {
-			initialRoute: ROUTES.LLM_OBSERVABILITY_ATTRIBUTE_MAPPING,
+			initialRoute: ROUTES.AI_OBSERVABILITY_ATTRIBUTE_MAPPING,
 		});
 
 		expect(
@@ -91,7 +91,7 @@ describe('LLMObservability (integration)', () => {
 	it('renders the model-pricing page on the configuration route', async () => {
 		setupList();
 		render(<LLMObservability />, undefined, {
-			initialRoute: ROUTES.LLM_OBSERVABILITY_CONFIGURATION,
+			initialRoute: ROUTES.AI_OBSERVABILITY_CONFIGURATION,
 		});
 
 		await waitFor(() =>

frontend/src/container/LLMObservability/hooks/useLLMObservabilityTabs.tsx

@@ -8,9 +8,9 @@ import LLMObservabilityAttributeMapping from '../AttributeMapping/LLMObservabili
 import Overview from '../Overview/Overview';
 import LLMObservabilityModelPricing from '../Settings/ModelPricing/LLMObservabilityModelPricing';
 
-const OVERVIEW_KEY = ROUTES.LLM_OBSERVABILITY_OVERVIEW;
-const CONFIGURATION_KEY = ROUTES.LLM_OBSERVABILITY_CONFIGURATION;
-const ATTRIBUTE_MAPPING_KEY = ROUTES.LLM_OBSERVABILITY_ATTRIBUTE_MAPPING;
+const OVERVIEW_KEY = ROUTES.AI_OBSERVABILITY_OVERVIEW;
+const CONFIGURATION_KEY = ROUTES.AI_OBSERVABILITY_CONFIGURATION;
+const ATTRIBUTE_MAPPING_KEY = ROUTES.AI_OBSERVABILITY_ATTRIBUTE_MAPPING;
 
 interface UseLLMObservabilityTabsResult {
 	items: TabItemProps[];

frontend/src/container/LogDetailedView/TableView.styles.scss

@@ -20,6 +20,7 @@
 		.ant-table-cell {
 			border: 1px solid var(--l1-border);
 			background: var(--l2-background);
+			vertical-align: top;
 		}
 
 		.attribute-name {
@@ -33,12 +34,12 @@
 		.attribute-pin {
 			cursor: pointer;
 
-			padding: 0;
-			vertical-align: middle;
+			padding: 14px 8px 8px;
+			vertical-align: top;
 			text-align: center;
 
 			.log-attribute-pin {
-				padding: 8px;
+				padding: 0;
 
 				display: flex;
 				justify-content: center;

frontend/src/container/LogDetailedView/TableView/TableViewActions.styles.scss

@@ -15,11 +15,13 @@
 	.ant-tree-node-content-wrapper {
 		user-select: text !important;
 		cursor: text !important;
+		min-width: 0;
 	}
 
 	.ant-tree-title {
 		user-select: text !important;
 		cursor: text !important;
+		overflow-wrap: anywhere;
 	}
 }
 

frontend/src/container/SideNav/SideNav.tsx

@@ -294,7 +294,7 @@ function SideNav({ isPinned }: { isPinned: boolean }): JSX.Element {
 			if (item.key === ROUTES.INTEGRATIONS) {
 				return shouldShowIntegrationsValue;
 			}
-			if (item.key === ROUTES.LLM_OBSERVABILITY_OVERVIEW) {
+			if (item.key === ROUTES.AI_OBSERVABILITY_OVERVIEW) {
 				return isAIObservabilityEnabled;
 			}
 			return item.isEnabled;

frontend/src/container/SideNav/menuItems.tsx

@@ -290,14 +290,14 @@ export const defaultMoreMenuItems: SidebarItem[] = [
 		itemKey: 'external-apis',
 	},
 	{
-		key: ROUTES.LLM_OBSERVABILITY_OVERVIEW,
-		label: 'LLM Observability',
+		key: ROUTES.AI_OBSERVABILITY_OVERVIEW,
+		label: 'AI Observability',
 		icon: <Brain size={16} />,
 		isNew: true,
 		// Gated behind the `enable_ai_observability` feature flag in
 		// SideNav's `computedSecondaryMenuItems`; disabled by default.
 		isEnabled: false,
-		itemKey: 'llm-observability',
+		itemKey: 'ai-observability',
 	},
 	{
 		key: ROUTES.METER,
@@ -576,7 +576,7 @@ export const NEW_ROUTES_MENU_ITEM_KEY_MAP: Record<string, string> = {
 		ROUTES.INFRASTRUCTURE_MONITORING_HOSTS,
 	[ROUTES.API_MONITORING_BASE]: ROUTES.API_MONITORING,
 	[ROUTES.MESSAGING_QUEUES_BASE]: ROUTES.MESSAGING_QUEUES_OVERVIEW,
-	[ROUTES.LLM_OBSERVABILITY_BASE]: ROUTES.LLM_OBSERVABILITY_OVERVIEW,
+	[ROUTES.AI_OBSERVABILITY_BASE]: ROUTES.AI_OBSERVABILITY_OVERVIEW,
 	// `getActiveMenuKeyFromPath` strips the URL down to its first segment;
 	// `/ai-assistant/<id>` reduces to `/ai-assistant`, which we point back
 	// to the AI Assistant menu item's concrete key.

frontend/src/container/TopNav/DateTimeSelectionV2/constants.ts

@@ -203,9 +203,9 @@ export const routesToSkip = [
 	ROUTES.METER_EXPLORER_VIEWS,
 	ROUTES.METRICS_EXPLORER_VOLUME_CONTROL,
 	ROUTES.SOMETHING_WENT_WRONG,
-	ROUTES.LLM_OBSERVABILITY_OVERVIEW,
-	ROUTES.LLM_OBSERVABILITY_CONFIGURATION,
-	ROUTES.LLM_OBSERVABILITY_ATTRIBUTE_MAPPING,
+	ROUTES.AI_OBSERVABILITY_OVERVIEW,
+	ROUTES.AI_OBSERVABILITY_CONFIGURATION,
+	ROUTES.AI_OBSERVABILITY_ATTRIBUTE_MAPPING,
 ];
 
 export const routesToDisable = [ROUTES.LOGS_EXPLORER, ROUTES.LIVE_LOGS];

frontend/src/utils/permission/index.ts

@@ -136,8 +136,8 @@ export const routePermission: Record<keyof typeof ROUTES, ROLES[]> = {
 	AI_ASSISTANT_ICON_PREVIEW: ['ADMIN', 'EDITOR', 'VIEWER'],
 	MCP_SERVER: ['ADMIN', 'EDITOR', 'VIEWER'],
 	AI_ASSISTANT_BASE: ['ADMIN', 'EDITOR', 'VIEWER'],
-	LLM_OBSERVABILITY_ATTRIBUTE_MAPPING: ['ADMIN', 'EDITOR', 'VIEWER'],
-	LLM_OBSERVABILITY_BASE: ['ADMIN', 'EDITOR', 'VIEWER'],
-	LLM_OBSERVABILITY_OVERVIEW: ['ADMIN', 'EDITOR', 'VIEWER'],
-	LLM_OBSERVABILITY_CONFIGURATION: ['ADMIN', 'EDITOR', 'VIEWER'],
+	AI_OBSERVABILITY_ATTRIBUTE_MAPPING: ['ADMIN', 'EDITOR', 'VIEWER'],
+	AI_OBSERVABILITY_BASE: ['ADMIN', 'EDITOR', 'VIEWER'],
+	AI_OBSERVABILITY_OVERVIEW: ['ADMIN', 'EDITOR', 'VIEWER'],
+	AI_OBSERVABILITY_CONFIGURATION: ['ADMIN', 'EDITOR', 'VIEWER'],
 };