fix: py-fmt

Co-authored-by: Tushar Vats <tushar@signoz.io>

frontend/src/components/CeleryTask/useNavigateToExplorer.ts

@@ -79,7 +79,7 @@ export function useNavigateToExplorer(): (
 	);
 
 	const { getUpdatedQuery } = useUpdatedQuery();
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 	const { notifications } = useNotifications();
 
 	return useCallback(
@@ -111,7 +111,7 @@ export function useNavigateToExplorer(): (
 						panelTypes: PANEL_TYPES.TIME_SERIES,
 						timePreferance: 'GLOBAL_TIME',
 					},
-					dashboardData,
+					selectedDashboard,
 				})
 					.then((query) => {
 						preparedQuery = query;
@@ -140,7 +140,7 @@ export function useNavigateToExplorer(): (
 			minTime,
 			maxTime,
 			getUpdatedQuery,
-			dashboardData,
+			selectedDashboard,
 			notifications,
 		],
 	);

frontend/src/components/QueryBuilderV2/QueryV2/__tests__/QuerySearch.test.tsx

@@ -87,8 +87,8 @@ jest.mock('hooks/useDarkMode', () => ({
 }));
 
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
-	useDashboardStore: (): { dashboardData: undefined } => ({
-		dashboardData: undefined,
+	useDashboardStore: (): { selectedDashboard: undefined } => ({
+		selectedDashboard: undefined,
 	}),
 }));
 

frontend/src/container/DashboardContainer/DashboardDescription/__tests__/DashboardDescription.test.tsx

@@ -196,12 +196,12 @@ describe('Dashboard landing page actions header tests', () => {
 		(useLocation as jest.Mock).mockReturnValue(mockLocation);
 
 		useDashboardStore.setState({
-			dashboardData: (getDashboardById.data as unknown) as Dashboard,
+			selectedDashboard: (getDashboardById.data as unknown) as Dashboard,
 			layouts: [],
 			panelMap: {},
 			setPanelMap: jest.fn(),
 			setLayouts: jest.fn(),
-			setDashboardData: jest.fn(),
+			setSelectedDashboard: jest.fn(),
 			columnWidths: {},
 		});
 

frontend/src/container/DashboardContainer/DashboardDescription/index.tsx

@@ -78,12 +78,12 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 		(s) => s.setIsPanelTypeSelectionModalOpen,
 	);
 	const {
-		dashboardData,
+		selectedDashboard,
 		panelMap,
 		setPanelMap,
 		layouts,
 		setLayouts,
-		setDashboardData,
+		setSelectedDashboard,
 	} = useDashboardStore();
 
 	const isDashboardLocked = useDashboardStore(selectIsDashboardLocked);
@@ -98,10 +98,10 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 
 	const isPublicDashboardEnabled = isCloudUser || isEnterpriseSelfHostedUser;
 
-	const selectedData = dashboardData
+	const selectedData = selectedDashboard
 		? {
-				...dashboardData.data,
-				uuid: dashboardData.id,
+				...selectedDashboard.data,
+				uuid: selectedDashboard.id,
 		  }
 		: ({} as DashboardData);
 	const { dashboardVariables } = useDashboardVariables();
@@ -133,8 +133,8 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 
 	let isAuthor = false;
 
-	if (dashboardData && user && user.email) {
-		isAuthor = dashboardData?.createdBy === user?.email;
+	if (selectedDashboard && user && user.email) {
+		isAuthor = selectedDashboard?.createdBy === user?.email;
 	}
 
 	let permissions: ComponentTypes[] = ['add_panel'];
@@ -146,7 +146,7 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 	const { notifications } = useNotifications();
 
 	const userRole: ROLES | null =
-		dashboardData?.createdBy === user?.email
+		selectedDashboard?.createdBy === user?.email
 			? (USER_ROLES.AUTHOR as ROLES)
 			: user.role;
 
@@ -155,9 +155,9 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 	const onEmptyWidgetHandler = useCallback(() => {
 		setIsPanelTypeSelectionModalOpen(true);
 		logEvent('Dashboard Detail: Add new panel clicked', {
-			dashboardId: dashboardData?.id,
-			dashboardName: dashboardData?.data.title,
-			numberOfPanels: dashboardData?.data.widgets?.length,
+			dashboardId: selectedDashboard?.id,
+			dashboardName: selectedDashboard?.data.title,
+			numberOfPanels: selectedDashboard?.data.widgets?.length,
 		});
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [setIsPanelTypeSelectionModalOpen]);
@@ -168,14 +168,14 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 	};
 
 	const onNameChangeHandler = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 		const updatedDashboard: Props = {
-			id: dashboardData.id,
+			id: selectedDashboard.id,
 
 			data: {
-				...dashboardData.data,
+				...selectedDashboard.data,
 				title: updatedTitle,
 			},
 		};
@@ -186,7 +186,7 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 				});
 				setIsRenameDashboardOpen(false);
 				if (updatedDashboard.data) {
-					setDashboardData(updatedDashboard.data);
+					setSelectedDashboard(updatedDashboard.data);
 				}
 			},
 			onError: () => {
@@ -203,10 +203,10 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 	// the context value is sometimes not available during the initial render
 	// due to which the updatedTitle is set to some previous value
 	useEffect(() => {
-		if (dashboardData) {
-			setUpdatedTitle(dashboardData.data.title);
+		if (selectedDashboard) {
+			setUpdatedTitle(selectedDashboard.data.title);
 		}
-	}, [dashboardData]);
+	}, [selectedDashboard]);
 
 	useEffect(() => {
 		if (state.error) {
@@ -227,7 +227,7 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 	}, [state.error, state.value, t, notifications]);
 
 	function handleAddRow(): void {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 		const id = uuid();
@@ -246,10 +246,10 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 		}
 
 		const updatedDashboard: Props = {
-			id: dashboardData.id,
+			id: selectedDashboard.id,
 
 			data: {
-				...dashboardData.data,
+				...selectedDashboard.data,
 				layout: [
 					{
 						i: id,
@@ -265,7 +265,7 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 				],
 				panelMap: { ...panelMap, [id]: newRowWidgetMap },
 				widgets: [
-					...(dashboardData.data.widgets || []),
+					...(selectedDashboard.data.widgets || []),
 					{
 						id,
 						title: sectionName,
@@ -282,7 +282,7 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 					if (updatedDashboard.data.data.layout) {
 						setLayouts(sortLayout(updatedDashboard.data.data.layout));
 					}
-					setDashboardData(updatedDashboard.data);
+					setSelectedDashboard(updatedDashboard.data);
 					setPanelMap(updatedDashboard.data?.data?.panelMap || {});
 				}
 
@@ -299,8 +299,8 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 		error: errorPublicDashboardData,
 		isError: isErrorPublicDashboardData,
 	} = useGetPublicDashboardMeta(
-		dashboardData?.id || '',
-		!!dashboardData?.id && isPublicDashboardEnabled,
+		selectedDashboard?.id || '',
+		!!selectedDashboard?.id && isPublicDashboardEnabled,
 	);
 
 	useEffect(() => {
@@ -378,14 +378,14 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 									{(isAuthor || user.role === USER_ROLES.ADMIN) && (
 										<Tooltip
 											title={
-												dashboardData?.createdBy === 'integration' &&
+												selectedDashboard?.createdBy === 'integration' &&
 												'Dashboards created by integrations cannot be unlocked'
 											}
 										>
 											<Button
 												type="text"
 												icon={<LockKeyhole size={14} />}
-												disabled={dashboardData?.createdBy === 'integration'}
+												disabled={selectedDashboard?.createdBy === 'integration'}
 												onClick={handleLockDashboardToggle}
 												data-testid="lock-unlock-dashboard"
 											>
@@ -457,9 +457,9 @@ function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 								</section>
 								<section className="delete-dashboard">
 									<DeleteButton
-										createdBy={dashboardData?.createdBy || ''}
-										name={dashboardData?.data.title || ''}
-										id={String(dashboardData?.id) || ''}
+										createdBy={selectedDashboard?.createdBy || ''}
+										name={selectedDashboard?.data.title || ''}
+										id={String(selectedDashboard?.id) || ''}
 										isLocked={isDashboardLocked}
 										routeToListPage
 									/>

frontend/src/container/DashboardContainer/DashboardSettings/DashboardVariableSettings/VariableItem/VariableItem.tsx

@@ -239,7 +239,7 @@ function VariableItem({
 
 	const [selectedWidgets, setSelectedWidgets] = useState<string[]>([]);
 
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 	const widgetsByDynamicVariableId = useWidgetsByDynamicVariableId();
 
 	useEffect(() => {
@@ -248,7 +248,7 @@ function VariableItem({
 		} else if (dynamicVariablesSelectedValue?.name) {
 			const widgets = getWidgetsHavingDynamicVariableAttribute(
 				dynamicVariablesSelectedValue?.name,
-				(dashboardData?.data?.widgets?.filter(
+				(selectedDashboard?.data?.widgets?.filter(
 					(widget) => widget.panelTypes !== PANEL_GROUP_TYPES.ROW,
 				) || []) as Widgets[],
 				variableData.name,
@@ -257,7 +257,7 @@ function VariableItem({
 		}
 	}, [
 		dynamicVariablesSelectedValue?.name,
-		dashboardData,
+		selectedDashboard,
 		variableData.id,
 		variableData.name,
 		widgetsByDynamicVariableId,

frontend/src/container/DashboardContainer/DashboardSettings/DashboardVariableSettings/VariableItem/WidgetSelector.tsx

@@ -12,17 +12,17 @@ export function WidgetSelector({
 	selectedWidgets: string[];
 	setSelectedWidgets: (widgets: string[]) => void;
 }): JSX.Element {
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 
 	// Get layout IDs for cross-referencing
 	const layoutIds = new Set(
-		(dashboardData?.data?.layout || []).map((item) => item.i),
+		(selectedDashboard?.data?.layout || []).map((item) => item.i),
 	);
 
 	// Filter and deduplicate widgets by ID, keeping only those with layout entries
 	// and excluding row widgets since they are not panels that can have variables
 	const widgets = Object.values(
-		(dashboardData?.data?.widgets || []).reduce(
+		(selectedDashboard?.data?.widgets || []).reduce(
 			(acc: Record<string, WidgetRow | Widgets>, widget: WidgetRow | Widgets) => {
 				if (
 					widget.id &&

frontend/src/container/DashboardContainer/DashboardSettings/DashboardVariableSettings/index.tsx

@@ -87,7 +87,7 @@ function VariablesSettings({
 
 	const { t } = useTranslation(['dashboard']);
 
-	const { dashboardData, setDashboardData } = useDashboardStore();
+	const { selectedDashboard, setSelectedDashboard } = useDashboardStore();
 	const { dashboardVariables } = useDashboardVariables();
 
 	const { notifications } = useNotifications();
@@ -173,7 +173,7 @@ function VariablesSettings({
 		widgetIds?: string[],
 		applyToAll?: boolean,
 	): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
@@ -181,16 +181,16 @@ function VariablesSettings({
 			(currentRequestedId &&
 				updatedVariablesData[currentRequestedId || '']?.type === 'DYNAMIC' &&
 				addDynamicVariableToPanels(
-					dashboardData,
+					selectedDashboard,
 					updatedVariablesData[currentRequestedId || ''],
 					widgetIds,
 					applyToAll,
 				)) ||
-			dashboardData;
+			selectedDashboard;
 
 		updateMutation.mutateAsync(
 			{
-				id: dashboardData.id,
+				id: selectedDashboard.id,
 
 				data: {
 					...newDashboard.data,
@@ -200,7 +200,7 @@ function VariablesSettings({
 			{
 				onSuccess: (updatedDashboard) => {
 					if (updatedDashboard.data) {
-						setDashboardData(updatedDashboard.data);
+						setSelectedDashboard(updatedDashboard.data);
 						notifications.success({
 							message: t('variable_updated_successfully'),
 						});

frontend/src/container/DashboardContainer/DashboardSettings/General/index.tsx

@@ -15,11 +15,11 @@ import './GeneralSettings.styles.scss';
 const { Option } = Select;
 
 function GeneralDashboardSettings(): JSX.Element {
-	const { dashboardData, setDashboardData } = useDashboardStore();
+	const { selectedDashboard, setSelectedDashboard } = useDashboardStore();
 
 	const updateDashboardMutation = useUpdateDashboard();
 
-	const selectedData = dashboardData?.data;
+	const selectedData = selectedDashboard?.data;
 
 	const { title = '', tags = [], description = '', image = Base64Icons[0] } =
 		selectedData || {};
@@ -37,15 +37,15 @@ function GeneralDashboardSettings(): JSX.Element {
 	const { t } = useTranslation('common');
 
 	const onSaveHandler = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
 		updateDashboardMutation.mutate(
 			{
-				id: dashboardData.id,
+				id: selectedDashboard.id,
 				data: {
-					...dashboardData.data,
+					...selectedDashboard.data,
 					description: updatedDescription,
 					tags: updatedTags,
 					title: updatedTitle,
@@ -55,7 +55,7 @@ function GeneralDashboardSettings(): JSX.Element {
 			{
 				onSuccess: (updatedDashboard) => {
 					if (updatedDashboard.data) {
-						setDashboardData(updatedDashboard.data);
+						setSelectedDashboard(updatedDashboard.data);
 					}
 				},
 				onError: () => {},

frontend/src/container/DashboardContainer/DashboardSettings/PublicDashboard/__tests__/PublicDashboard.test.tsx

@@ -41,7 +41,7 @@ const DASHBOARD_VARIABLES_WARNING =
 // Use wildcard pattern to match both relative and absolute URLs in MSW
 const publicDashboardURL = `*/api/v1/dashboards/${MOCK_DASHBOARD_ID}/public`;
 
-const mockDashboardData = {
+const mockSelectedDashboard = {
 	id: MOCK_DASHBOARD_ID,
 	data: {
 		title: 'Test Dashboard',
@@ -70,7 +70,7 @@ beforeEach(() => {
 
 	// Mock useDashboardStore
 	mockUseDashboard.mockReturnValue(({
-		dashboardData: mockDashboardData,
+		selectedDashboard: mockSelectedDashboard,
 	} as unknown) as ReturnType<typeof useDashboardStore>);
 
 	// Mock useCopyToClipboard

frontend/src/container/DashboardContainer/DashboardSettings/PublicDashboard/index.tsx

@@ -60,7 +60,7 @@ function PublicDashboardSetting(): JSX.Element {
 	const [defaultTimeRange, setDefaultTimeRange] = useState(DEFAULT_TIME_RANGE);
 	const [, setCopyPublicDashboardURL] = useCopyToClipboard();
 
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 
 	const { isCloudUser, isEnterpriseSelfHostedUser } = useGetTenantLicense();
 
@@ -85,8 +85,8 @@ function PublicDashboardSetting(): JSX.Element {
 		refetch: refetchPublicDashboard,
 		error: errorPublicDashboard,
 	} = useGetPublicDashboardMeta(
-		dashboardData?.id || '',
-		!!dashboardData?.id && isPublicDashboardEnabled,
+		selectedDashboard?.id || '',
+		!!selectedDashboard?.id && isPublicDashboardEnabled,
 	);
 
 	const isPublicDashboard = !!publicDashboardData?.publicPath;
@@ -155,36 +155,36 @@ function PublicDashboardSetting(): JSX.Element {
 	});
 
 	const handleCreatePublicDashboard = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
 		createPublicDashboard({
-			dashboardId: dashboardData.id,
+			dashboardId: selectedDashboard.id,
 			timeRangeEnabled,
 			defaultTimeRange,
 		});
 	};
 
 	const handleUpdatePublicDashboard = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
 		updatePublicDashboard({
-			dashboardId: dashboardData.id,
+			dashboardId: selectedDashboard.id,
 			timeRangeEnabled,
 			defaultTimeRange,
 		});
 	};
 
 	const handleRevokePublicDashboardAccess = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
 		revokePublicDashboardAccess({
-			id: dashboardData.id,
+			id: selectedDashboard.id,
 		});
 	};
 

frontend/src/container/DashboardContainer/DashboardVariablesSelection/DashboardVariableSelection.tsx

@@ -26,10 +26,10 @@ import VariableItem from './VariableItem';
 import './DashboardVariableSelection.styles.scss';
 
 function DashboardVariableSelection(): JSX.Element | null {
-	const { dashboardId, setDashboardData } = useDashboardStore(
+	const { dashboardId, setSelectedDashboard } = useDashboardStore(
 		useShallow((s) => ({
-			dashboardId: s.dashboardData?.id ?? '',
-			setDashboardData: s.setDashboardData,
+			dashboardId: s.selectedDashboard?.id ?? '',
+			setSelectedDashboard: s.setSelectedDashboard,
 		})),
 	);
 
@@ -99,7 +99,7 @@ function DashboardVariableSelection(): JSX.Element | null {
 
 			// Synchronously update the external store with the new variable value so that
 			// child variables see the updated parent value when they refetch, rather than
-			// waiting for setDashboardData → useEffect → updateDashboardVariablesStore.
+			// waiting for setSelectedDashboard → useEffect → updateDashboardVariablesStore.
 			const updatedVariables = { ...dashboardVariables };
 			if (updatedVariables[id]) {
 				updatedVariables[id] = {
@@ -119,7 +119,7 @@ function DashboardVariableSelection(): JSX.Element | null {
 			}
 			updateDashboardVariablesStore({ dashboardId, variables: updatedVariables });
 
-			setDashboardData((prev) => {
+			setSelectedDashboard((prev) => {
 				if (prev) {
 					const oldVariables = { ...prev?.data.variables };
 					// this is added to handle case where we have two different
@@ -157,7 +157,7 @@ function DashboardVariableSelection(): JSX.Element | null {
 			// Safe to call synchronously now that the store already has the updated value.
 			enqueueDescendantsOfVariable(name);
 		},
-		[dashboardId, dashboardVariables, updateUrlVariable, setDashboardData],
+		[dashboardId, dashboardVariables, updateUrlVariable, setSelectedDashboard],
 	);
 
 	return (

frontend/src/container/DashboardContainer/DashboardVariablesSelection/__test__/DashboardVariableSelection.test.tsx

@@ -30,11 +30,11 @@ const mockVariableItemCallbacks: {
 } = {};
 
 // Mock providers/Dashboard/Dashboard
-const mockSetDashboardData = jest.fn();
+const mockSetSelectedDashboard = jest.fn();
 const mockUpdateLocalStorageDashboardVariables = jest.fn();
 interface MockDashboardStoreState {
-	dashboardData?: { id: string };
-	setDashboardData: typeof mockSetDashboardData;
+	selectedDashboard?: { id: string };
+	setSelectedDashboard: typeof mockSetSelectedDashboard;
 	updateLocalStorageDashboardVariables: typeof mockUpdateLocalStorageDashboardVariables;
 }
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
@@ -42,8 +42,8 @@ jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
 		selector?: (s: Record<string, unknown>) => MockDashboardStoreState,
 	): MockDashboardStoreState => {
 		const state = {
-			dashboardData: { id: 'dash-1' },
-			setDashboardData: mockSetDashboardData,
+			selectedDashboard: { id: 'dash-1' },
+			setSelectedDashboard: mockSetSelectedDashboard,
 			updateLocalStorageDashboardVariables: mockUpdateLocalStorageDashboardVariables,
 		};
 		return selector ? selector(state) : state;

frontend/src/container/DashboardContainer/DashboardVariablesSelection/useDashboardVariableUpdate.ts

@@ -38,11 +38,15 @@ interface UseDashboardVariableUpdateReturn {
 }
 
 export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn => {
-	const { dashboardId, dashboardData, setDashboardData } = useDashboardStore(
+	const {
+		dashboardId,
+		selectedDashboard,
+		setSelectedDashboard,
+	} = useDashboardStore(
 		useShallow((s) => ({
-			dashboardId: s.dashboardData?.id ?? '',
-			dashboardData: s.dashboardData,
-			setDashboardData: s.setDashboardData,
+			dashboardId: s.selectedDashboard?.id ?? '',
+			selectedDashboard: s.selectedDashboard,
+			setSelectedDashboard: s.setSelectedDashboard,
 		})),
 	);
 	const addDynamicVariableToPanels = useAddDynamicVariableToPanels();
@@ -70,8 +74,8 @@ export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn =
 					isDynamic,
 				);
 
-				if (dashboardData) {
-					setDashboardData((prev) => {
+				if (selectedDashboard) {
+					setSelectedDashboard((prev) => {
 						if (prev) {
 							const oldVariables = prev?.data.variables;
 							// this is added to handle case where we have two different
@@ -106,7 +110,7 @@ export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn =
 				}
 			}
 		},
-		[dashboardId, dashboardData, setDashboardData],
+		[dashboardId, selectedDashboard, setSelectedDashboard],
 	);
 
 	const updateVariables = useCallback(
@@ -116,23 +120,23 @@ export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn =
 			widgetIds?: string[],
 			applyToAll?: boolean,
 		): void => {
-			if (!dashboardData) {
+			if (!selectedDashboard) {
 				return;
 			}
 
 			const newDashboard =
 				(currentRequestedId &&
 					addDynamicVariableToPanels(
-						dashboardData,
+						selectedDashboard,
 						updatedVariablesData[currentRequestedId || ''],
 						widgetIds,
 						applyToAll,
 					)) ||
-				dashboardData;
+				selectedDashboard;
 
 			updateMutation.mutateAsync(
 				{
-					id: dashboardData.id,
+					id: selectedDashboard.id,
 
 					data: {
 						...newDashboard.data,
@@ -142,7 +146,7 @@ export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn =
 				{
 					onSuccess: (updatedDashboard) => {
 						if (updatedDashboard.data) {
-							setDashboardData(updatedDashboard.data);
+							setSelectedDashboard(updatedDashboard.data);
 							// notifications.success({
 							// 	message: t('variable_updated_successfully'),
 							// });
@@ -151,7 +155,12 @@ export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn =
 				},
 			);
 		},
-		[dashboardData, addDynamicVariableToPanels, updateMutation, setDashboardData],
+		[
+			selectedDashboard,
+			addDynamicVariableToPanels,
+			updateMutation,
+			setSelectedDashboard,
+		],
 	);
 
 	const createVariable = useCallback(
@@ -163,13 +172,13 @@ export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn =
 			source: 'logs' | 'traces' | 'metrics' | 'all sources' = 'all sources',
 			// widgetId?: string,
 		): void => {
-			if (!dashboardData) {
+			if (!selectedDashboard) {
 				console.warn('No dashboard selected for variable creation');
 				return;
 			}
 
 			// Get current dashboard variables
-			const currentVariables = dashboardData.data.variables || {};
+			const currentVariables = selectedDashboard.data.variables || {};
 
 			// Create tableRowData like Dashboard Settings does
 			const tableRowData = [];
@@ -225,7 +234,7 @@ export const useDashboardVariableUpdate = (): UseDashboardVariableUpdateReturn =
 			const updatedVariables = convertVariablesToDbFormat(tableRowData);
 			updateVariables(updatedVariables, newVariable.id, [], false);
 		},
-		[dashboardData, updateVariables],
+		[selectedDashboard, updateVariables],
 	);
 
 	return {

frontend/src/container/DashboardContainer/__test__/IntegrationTests.test.tsx

@@ -47,12 +47,12 @@ const mockDashboard = {
 };
 
 // Mock the dashboard provider with stable functions to prevent infinite loops
-const mockSetDashboardData = jest.fn();
+const mockSetSelectedDashboard = jest.fn();
 const mockUpdateLocalStorageDashboardVariables = jest.fn();
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
 	useDashboardStore: (): any => ({
-		dashboardData: mockDashboard,
-		setDashboardData: mockSetDashboardData,
+		selectedDashboard: mockDashboard,
+		setSelectedDashboard: mockSetSelectedDashboard,
 		updateLocalStorageDashboardVariables: mockUpdateLocalStorageDashboardVariables,
 	}),
 }));

frontend/src/container/DashboardContainer/__test__/PanelManagement.test.tsx

@@ -58,7 +58,7 @@ const mockDashboard = {
 // Mock dependencies
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
 	useDashboardStore: (): any => ({
-		dashboardData: mockDashboard,
+		selectedDashboard: mockDashboard,
 	}),
 }));
 
@@ -154,7 +154,7 @@ describe('Panel Management Tests', () => {
 			// Temporarily mock the dashboard
 			jest.doMock('providers/Dashboard/store/useDashboardStore', () => ({
 				useDashboardStore: (): any => ({
-					dashboardData: modifiedDashboard,
+					selectedDashboard: modifiedDashboard,
 				}),
 			}));
 

frontend/src/container/DashboardContainer/components/DashboardHeader/DashboardBreadcrumbs.tsx

@@ -13,13 +13,13 @@ import './DashboardBreadcrumbs.styles.scss';
 
 function DashboardBreadcrumbs(): JSX.Element {
 	const { safeNavigate } = useSafeNavigate();
-	const { dashboardData } = useDashboardStore();
-	const updatedAtRef = useRef(dashboardData?.updatedAt);
+	const { selectedDashboard } = useDashboardStore();
+	const updatedAtRef = useRef(selectedDashboard?.updatedAt);
 
-	const selectedData = dashboardData
+	const selectedData = selectedDashboard
 		? {
-				...dashboardData.data,
-				uuid: dashboardData.id,
+				...selectedDashboard.data,
+				uuid: selectedDashboard.id,
 		  }
 		: ({} as DashboardData);
 
@@ -31,7 +31,7 @@ function DashboardBreadcrumbs(): JSX.Element {
 		);
 
 		const hasDashboardBeenUpdated =
-			dashboardData?.updatedAt !== updatedAtRef.current;
+			selectedDashboard?.updatedAt !== updatedAtRef.current;
 		if (!hasDashboardBeenUpdated && dashboardsListQueryParamsString) {
 			safeNavigate({
 				pathname: ROUTES.ALL_DASHBOARD,
@@ -40,7 +40,7 @@ function DashboardBreadcrumbs(): JSX.Element {
 		} else {
 			safeNavigate(ROUTES.ALL_DASHBOARD);
 		}
-	}, [safeNavigate, dashboardData?.updatedAt]);
+	}, [safeNavigate, selectedDashboard?.updatedAt]);
 
 	return (
 		<div className="dashboard-breadcrumbs">

frontend/src/container/DashboardContainer/visualization/charts/ChartWrapper/ChartWrapper.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useRef } from 'react';
+import { useCallback, useRef } from 'react';
 import ChartLayout from 'container/DashboardContainer/visualization/layout/ChartLayout/ChartLayout';
 import Legend from 'lib/uPlotV2/components/Legend/Legend';
 import {
@@ -30,7 +30,6 @@ export default function ChartWrapper({
 	onDestroy = noop,
 	children,
 	layoutChildren,
-	yAxisUnit,
 	customTooltip,
 	pinnedTooltipElement,
 	'data-testid': testId,
@@ -63,13 +62,6 @@ export default function ChartWrapper({
 		[customTooltip],
 	);
 
-	const syncMetadata = useMemo(
-		() => ({
-			yAxisUnit,
-		}),
-		[yAxisUnit],
-	);
-
 	return (
 		<PlotContextProvider>
 			<ChartLayout
@@ -107,7 +99,6 @@ export default function ChartWrapper({
 									averageLegendWidth + TOOLTIP_WIDTH_PADDING,
 								)}
 								syncKey={syncKey}
-								syncMetadata={syncMetadata}
 								render={renderTooltipCallback}
 								pinnedTooltipElement={pinnedTooltipElement}
 							/>

frontend/src/container/DashboardContainer/visualization/charts/Histogram/Histogram.tsx

@@ -24,12 +24,13 @@ export default function Histogram(props: HistogramChartProps): JSX.Element {
 			}
 			const tooltipProps: HistogramTooltipProps = {
 				...props,
+				timezone: rest.timezone,
 				yAxisUnit: rest.yAxisUnit,
 				decimalPrecision: rest.decimalPrecision,
 			};
 			return <HistogramTooltip {...tooltipProps} />;
 		},
-		[customTooltip, rest.yAxisUnit, rest.decimalPrecision],
+		[customTooltip, rest.timezone, rest.yAxisUnit, rest.decimalPrecision],
 	);
 
 	return (

frontend/src/container/DashboardContainer/visualization/charts/types.ts

@@ -12,7 +12,10 @@ interface BaseChartProps {
 	height: number;
 	showTooltip?: boolean;
 	showLegend?: boolean;
+	timezone?: Timezone;
 	canPinTooltip?: boolean;
+	yAxisUnit?: string;
+	decimalPrecision?: PrecisionOption;
 	pinnedTooltipElement?: (clickData: TooltipClickData) => React.ReactNode;
 	customTooltip?: (props: TooltipRenderArgs) => React.ReactNode;
 	'data-testid'?: string;
@@ -29,31 +32,18 @@ interface UPlotBasedChartProps {
 	layoutChildren?: React.ReactNode;
 }
 
-interface UPlotChartDataProps {
-	yAxisUnit?: string;
-	decimalPrecision?: PrecisionOption;
-}
-
 export interface TimeSeriesChartProps
 	extends BaseChartProps,
-		UPlotBasedChartProps,
-		UPlotChartDataProps {
-	timezone?: Timezone;
-}
+		UPlotBasedChartProps {}
 
 export interface HistogramChartProps
 	extends BaseChartProps,
-		UPlotBasedChartProps,
-		UPlotChartDataProps {
+		UPlotBasedChartProps {
 	isQueriesMerged?: boolean;
 }
 
-export interface BarChartProps
-	extends BaseChartProps,
-		UPlotBasedChartProps,
-		UPlotChartDataProps {
+export interface BarChartProps extends BaseChartProps, UPlotBasedChartProps {
 	isStackedBarChart?: boolean;
-	timezone?: Timezone;
 }
 
 export type ChartProps =

frontend/src/container/DashboardContainer/visualization/components/ChartManager/__tests__/ChartManager.test.tsx

@@ -35,15 +35,15 @@ jest.mock('lib/uPlotV2/hooks/useLegendsSync', () => ({
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
 	useDashboardStore: (
 		selector?: (s: {
-			dashboardData: { locked: boolean } | undefined;
-		}) => { dashboardData: { locked: boolean } },
-	): { dashboardData: { locked: boolean } } => {
-		const mockState = { dashboardData: { locked: false } };
+			selectedDashboard: { locked: boolean } | undefined;
+		}) => { selectedDashboard: { locked: boolean } },
+	): { selectedDashboard: { locked: boolean } } => {
+		const mockState = { selectedDashboard: { locked: false } };
 		return selector ? selector(mockState) : mockState;
 	},
 	selectIsDashboardLocked: (s: {
-		dashboardData: { locked: boolean } | undefined;
-	}): boolean => s.dashboardData?.locked ?? false,
+		selectedDashboard: { locked: boolean } | undefined;
+	}): boolean => s.selectedDashboard?.locked ?? false,
 }));
 
 jest.mock('hooks/useNotifications', () => ({

frontend/src/container/DashboardContainer/visualization/panels/BarPanel/BarPanel.tsx

@@ -123,13 +123,13 @@ function BarPanel(props: PanelWrapperProps): JSX.Element {
 					}}
 					plotRef={onPlotRef}
 					onDestroy={onPlotDestroy}
+					yAxisUnit={widget.yAxisUnit}
+					decimalPrecision={widget.decimalPrecision}
 					data={chartData as uPlot.AlignedData}
 					width={containerDimensions.width}
 					height={containerDimensions.height}
 					layoutChildren={layoutChildren}
 					isStackedBarChart={widget.stackedBarChart ?? false}
-					yAxisUnit={widget.yAxisUnit}
-					decimalPrecision={widget.decimalPrecision}
 					timezone={timezone}
 				>
 					<ContextMenu

frontend/src/container/DashboardContainer/visualization/panels/HistogramPanel/HistogramPanel.tsx

@@ -3,6 +3,8 @@ import { PanelWrapperProps } from 'container/PanelWrapper/panelWrapper.types';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useResizeObserver } from 'hooks/useDimensions';
 import { LegendPosition } from 'lib/uPlotV2/components/types';
+import { DashboardCursorSync } from 'lib/uPlotV2/plugins/TooltipPlugin/types';
+import { useTimezone } from 'providers/Timezone';
 import uPlot from 'uplot';
 
 import Histogram from '../../charts/Histogram/Histogram';
@@ -27,6 +29,7 @@ function HistogramPanel(props: PanelWrapperProps): JSX.Element {
 	const containerDimensions = useResizeObserver(graphRef);
 
 	const isDarkMode = useIsDarkMode();
+	const { timezone } = useTimezone();
 
 	const config = useMemo(() => {
 		return prepareHistogramPanelConfig({
@@ -89,9 +92,11 @@ function HistogramPanel(props: PanelWrapperProps): JSX.Element {
 					onDestroy={(): void => {
 						uPlotRef.current = null;
 					}}
+					isQueriesMerged={widget.mergeAllActiveQueries}
 					yAxisUnit={widget.yAxisUnit}
 					decimalPrecision={widget.decimalPrecision}
-					isQueriesMerged={widget.mergeAllActiveQueries}
+					syncMode={DashboardCursorSync.Crosshair}
+					timezone={timezone}
 					data={chartData as uPlot.AlignedData}
 					width={containerDimensions.width}
 					height={containerDimensions.height}

frontend/src/container/DashboardContainer/visualization/panels/HistogramPanel/__tests__/HistogramPanel.test.tsx

@@ -48,8 +48,8 @@ jest.mock(
 					{JSON.stringify({
 						legendPosition: props.legendConfig?.position,
 						isQueriesMerged: props.isQueriesMerged,
-						yAxisUnit: props?.yAxisUnit,
-						decimalPrecision: props?.decimalPrecision,
+						yAxisUnit: props.yAxisUnit,
+						decimalPrecision: props.decimalPrecision,
 					})}
 				</div>
 				{props.layoutChildren}

frontend/src/container/DashboardContainer/visualization/panels/TimeSeriesPanel/TimeSeriesPanel.tsx

@@ -112,9 +112,9 @@ function TimeSeriesPanel(props: PanelWrapperProps): JSX.Element {
 					legendConfig={{
 						position: widget?.legendPosition ?? LegendPosition.BOTTOM,
 					}}
-					timezone={timezone}
 					yAxisUnit={widget.yAxisUnit}
 					decimalPrecision={widget.decimalPrecision}
+					timezone={timezone}
 					data={chartData as uPlot.AlignedData}
 					width={containerDimensions.width}
 					height={containerDimensions.height}

frontend/src/container/ExportPanel/ExportPanelContainer.tsx

@@ -24,7 +24,9 @@ function ExportPanelContainer({
 }: ExportPanelProps): JSX.Element {
 	const { t } = useTranslation(['dashboard']);
 
-	const [dashboardId, setDashboardId] = useState<string | null>(null);
+	const [selectedDashboardId, setSelectedDashboardId] = useState<string | null>(
+		null,
+	);
 
 	const {
 		data,
@@ -53,17 +55,17 @@ function ExportPanelContainer({
 
 	const handleExportClick = useCallback((): void => {
 		const currentSelectedDashboard = data?.data?.find(
-			({ id }) => id === dashboardId,
+			({ id }) => id === selectedDashboardId,
 		);
 
 		onExport(currentSelectedDashboard || null, false);
-	}, [data, dashboardId, onExport]);
+	}, [data, selectedDashboardId, onExport]);
 
 	const handleSelect = useCallback(
-		(selectedDashboardId: string): void => {
-			setDashboardId(selectedDashboardId);
+		(selectedDashboardValue: string): void => {
+			setSelectedDashboardId(selectedDashboardValue);
 		},
-		[setDashboardId],
+		[setSelectedDashboardId],
 	);
 
 	const handleNewDashboard = useCallback(async () => {
@@ -83,7 +85,10 @@ function ExportPanelContainer({
 	const isDashboardLoading = isAllDashboardsLoading || createDashboardLoading;
 
 	const isDisabled =
-		isAllDashboardsLoading || !options?.length || !dashboardId || isLoading;
+		isAllDashboardsLoading ||
+		!options?.length ||
+		!selectedDashboardId ||
+		isLoading;
 
 	return (
 		<Wrapper direction="vertical">
@@ -96,7 +101,7 @@ function ExportPanelContainer({
 					showSearch
 					loading={isDashboardLoading}
 					disabled={isDashboardLoading}
-					value={dashboardId}
+					value={selectedDashboardId}
 					onSelect={handleSelect}
 					filterOption={filterOptions}
 				/>

frontend/src/container/GridCardLayout/DashboardEmptyState/DashboardEmptyState.tsx

@@ -27,7 +27,7 @@ export default function DashboardEmptyState(): JSX.Element {
 		(s) => s.setIsPanelTypeSelectionModalOpen,
 	);
 
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 	const isDashboardLocked = useDashboardStore(selectIsDashboardLocked);
 
 	const variablesSettingsTabHandle = useRef<VariablesSettingsTab>(null);
@@ -43,7 +43,7 @@ export default function DashboardEmptyState(): JSX.Element {
 	}
 
 	const userRole: ROLES | null =
-		dashboardData?.createdBy === user?.email
+		selectedDashboard?.createdBy === user?.email
 			? (USER_ROLES.AUTHOR as ROLES)
 			: user.role;
 
@@ -52,9 +52,9 @@ export default function DashboardEmptyState(): JSX.Element {
 	const onEmptyWidgetHandler = useCallback(() => {
 		setIsPanelTypeSelectionModalOpen(true);
 		logEvent('Dashboard Detail: Add new panel clicked', {
-			dashboardId: dashboardData?.id,
-			dashboardName: dashboardData?.data.title,
-			numberOfPanels: dashboardData?.data.widgets?.length,
+			dashboardId: selectedDashboard?.id,
+			dashboardName: selectedDashboard?.data.title,
+			numberOfPanels: selectedDashboard?.data.widgets?.length,
 		});
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [setIsPanelTypeSelectionModalOpen]);

frontend/src/container/GridCardLayout/GridCard/FullView/index.tsx

@@ -91,7 +91,7 @@ function FullView({
 		setCurrentGraphRef(fullViewRef);
 	}, [setCurrentGraphRef]);
 
-	const { dashboardData, setColumnWidths } = useDashboardStore();
+	const { selectedDashboard, setColumnWidths } = useDashboardStore();
 	const isDashboardLocked = useDashboardStore(selectIsDashboardLocked);
 
 	const onColumnWidthsChange = useCallback(
@@ -166,7 +166,7 @@ function FullView({
 		enableDrillDown,
 		widget,
 		setRequestData,
-		dashboardData,
+		selectedDashboard,
 		selectedPanelType,
 	});
 
@@ -344,7 +344,7 @@ function FullView({
 							<>
 								<QueryBuilderV2
 									panelType={selectedPanelType}
-									version={dashboardData?.data?.version || 'v3'}
+									version={selectedDashboard?.data?.version || 'v3'}
 									isListViewPanel={selectedPanelType === PANEL_TYPES.LIST}
 									signalSourceChangeEnabled
 									// filterConfigs={filterConfigs}

frontend/src/container/GridCardLayout/GridCard/FullView/useDrilldown.tsx

@@ -19,7 +19,7 @@ export interface DrilldownQueryProps {
 	widget: Widgets;
 	setRequestData: Dispatch<SetStateAction<GetQueryResultsProps>>;
 	enableDrillDown: boolean;
-	dashboardData: Dashboard | undefined;
+	selectedDashboard: Dashboard | undefined;
 	selectedPanelType: PANEL_TYPES;
 }
 
@@ -34,7 +34,7 @@ const useDrilldown = ({
 	enableDrillDown,
 	widget,
 	setRequestData,
-	dashboardData,
+	selectedDashboard,
 	selectedPanelType,
 }: DrilldownQueryProps): UseDrilldownReturn => {
 	const isMounted = useRef(false);
@@ -60,11 +60,11 @@ const useDrilldown = ({
 		isMounted.current = true;
 	}, [widget, enableDrillDown, compositeQuery, redirectWithQueryBuilderData]);
 
-	const dashboardEditView = dashboardData?.id
+	const dashboardEditView = selectedDashboard?.id
 		? generateExportToDashboardLink({
 				query: currentQuery,
 				panelType: selectedPanelType,
-				dashboardId: dashboardData?.id || '',
+				dashboardId: selectedDashboard?.id || '',
 				widgetId: widget.id,
 		  })
 		: '';

frontend/src/container/GridCardLayout/GridCard/WidgetGraphComponent.test.tsx

@@ -163,13 +163,13 @@ const mockProps: WidgetGraphComponentProps = {
 // Mock useDashabord hook
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
 	useDashboardStore: (): any => ({
-		dashboardData: {
+		selectedDashboard: {
 			data: {
 				variables: [],
 			},
 		},
 		setLayouts: jest.fn(),
-		setDashboardData: jest.fn(),
+		setSelectedDashboard: jest.fn(),
 		setColumnWidths: jest.fn(),
 	}),
 }));

frontend/src/container/GridCardLayout/GridCard/WidgetGraphComponent.tsx

@@ -103,8 +103,8 @@ function WidgetGraphComponent({
 
 	const {
 		setLayouts,
-		dashboardData,
-		setDashboardData,
+		selectedDashboard,
+		setSelectedDashboard,
 		setColumnWidths,
 	} = useDashboardStore();
 
@@ -125,33 +125,33 @@ function WidgetGraphComponent({
 	const updateDashboardMutation = useUpdateDashboard();
 
 	const onDeleteHandler = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
-		const updatedWidgets = dashboardData?.data?.widgets?.filter(
+		const updatedWidgets = selectedDashboard?.data?.widgets?.filter(
 			(e) => e.id !== widget.id,
 		);
 
 		const updatedLayout =
-			dashboardData.data.layout?.filter((e) => e.i !== widget.id) || [];
+			selectedDashboard.data.layout?.filter((e) => e.i !== widget.id) || [];
 
-		const updatedDashboardData: Props = {
+		const updatedSelectedDashboard: Props = {
 			data: {
-				...dashboardData.data,
+				...selectedDashboard.data,
 				widgets: updatedWidgets,
 				layout: updatedLayout,
 			},
-			id: dashboardData.id,
+			id: selectedDashboard.id,
 		};
 
-		updateDashboardMutation.mutateAsync(updatedDashboardData, {
+		updateDashboardMutation.mutateAsync(updatedSelectedDashboard, {
 			onSuccess: (updatedDashboard) => {
 				if (setLayouts) {
 					setLayouts(updatedDashboard.data?.data?.layout || []);
 				}
-				if (setDashboardData && updatedDashboard.data) {
-					setDashboardData(updatedDashboard.data);
+				if (setSelectedDashboard && updatedDashboard.data) {
+					setSelectedDashboard(updatedDashboard.data);
 				}
 				setDeleteModal(false);
 			},
@@ -159,35 +159,35 @@ function WidgetGraphComponent({
 	};
 
 	const onCloneHandler = async (): Promise<void> => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
 		const uuid = v4();
 
 		// this is added to make sure the cloned panel is of the same dimensions as the original one
-		const originalPanelLayout = dashboardData.data.layout?.find(
+		const originalPanelLayout = selectedDashboard.data.layout?.find(
 			(l) => l.i === widget.id,
 		);
 
 		const newLayoutItem = placeWidgetAtBottom(
 			uuid,
-			dashboardData?.data.layout || [],
+			selectedDashboard?.data.layout || [],
 			originalPanelLayout?.w || 6,
 			originalPanelLayout?.h || 6,
 		);
 
-		const layout = [...(dashboardData.data.layout || []), newLayoutItem];
+		const layout = [...(selectedDashboard.data.layout || []), newLayoutItem];
 
 		updateDashboardMutation.mutateAsync(
 			{
-				id: dashboardData.id,
+				id: selectedDashboard.id,
 
 				data: {
-					...dashboardData.data,
+					...selectedDashboard.data,
 					layout,
 					widgets: [
-						...(dashboardData.data.widgets || []),
+						...(selectedDashboard.data.widgets || []),
 						{
 							...{
 								...widget,
@@ -202,8 +202,8 @@ function WidgetGraphComponent({
 					if (setLayouts) {
 						setLayouts(updatedDashboard.data?.data?.layout || []);
 					}
-					if (setDashboardData && updatedDashboard.data) {
-						setDashboardData(updatedDashboard.data);
+					if (setSelectedDashboard && updatedDashboard.data) {
+						setSelectedDashboard(updatedDashboard.data);
 					}
 					notifications.success({
 						message: 'Panel cloned successfully, redirecting to new copy.',

frontend/src/container/GridCardLayout/GridCardLayout.tsx

@@ -70,16 +70,16 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 		useIsFetching([REACT_QUERY_KEY.DASHBOARD_BY_ID]) > 0;
 
 	const {
-		dashboardData,
+		selectedDashboard,
 		layouts,
 		setLayouts,
 		panelMap,
 		setPanelMap,
-		setDashboardData,
+		setSelectedDashboard,
 		columnWidths,
 	} = useDashboardStore();
 	const isDashboardLocked = useDashboardStore(selectIsDashboardLocked);
-	const { data } = dashboardData || {};
+	const { data } = selectedDashboard || {};
 	const { pathname } = useLocation();
 	const dispatch = useDispatch();
 
@@ -124,7 +124,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 	}
 
 	const userRole: ROLES | null =
-		dashboardData?.createdBy === user?.email
+		selectedDashboard?.createdBy === user?.email
 			? (USER_ROLES.AUTHOR as ROLES)
 			: user.role;
 
@@ -146,27 +146,27 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 	useEffect(() => {
 		if (!logEventCalledRef.current && !isUndefined(data)) {
 			logEvent('Dashboard Detail: Opened', {
-				dashboardId: dashboardData?.id,
+				dashboardId: selectedDashboard?.id,
 				dashboardName: data.title,
 				numberOfPanels: data.widgets?.length,
 				numberOfVariables: Object.keys(dashboardVariables).length || 0,
 			});
 			logEventCalledRef.current = true;
 		}
-	}, [dashboardVariables, data, dashboardData?.id]);
+	}, [dashboardVariables, data, selectedDashboard?.id]);
 
 	const onSaveHandler = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
 		const updatedDashboard: Props = {
-			id: dashboardData.id,
+			id: selectedDashboard.id,
 			data: {
-				...dashboardData.data,
+				...selectedDashboard.data,
 				panelMap: { ...currentPanelMap },
 				layout: dashboardLayout.filter((e) => e.i !== PANEL_TYPES.EMPTY_WIDGET),
-				widgets: dashboardData?.data?.widgets?.map((widget) => {
+				widgets: selectedDashboard?.data?.widgets?.map((widget) => {
 					if (columnWidths?.[widget.id]) {
 						return {
 							...widget,
@@ -184,7 +184,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 					if (updatedDashboard.data.data.layout) {
 						setLayouts(sortLayout(updatedDashboard.data.data.layout));
 					}
-					setDashboardData(updatedDashboard.data);
+					setSelectedDashboard(updatedDashboard.data);
 					setPanelMap(updatedDashboard.data?.data?.panelMap || {});
 				}
 			},
@@ -243,7 +243,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 			dashboardLayout &&
 			Array.isArray(dashboardLayout) &&
 			dashboardLayout.length > 0 &&
-			hasColumnWidthsChanged(columnWidths, dashboardData);
+			hasColumnWidthsChanged(columnWidths, selectedDashboard);
 
 		if (shouldSaveLayout || shouldSaveColumnWidths) {
 			onSaveHandler();
@@ -253,7 +253,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 
 	const onSettingsModalSubmit = (): void => {
 		const newTitle = form.getFieldValue('title');
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
@@ -261,7 +261,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 			return;
 		}
 
-		const currentWidget = dashboardData?.data?.widgets?.find(
+		const currentWidget = selectedDashboard?.data?.widgets?.find(
 			(e) => e.id === currentSelectRowId,
 		);
 
@@ -269,25 +269,25 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 			return;
 		}
 
-		const updatedWidgets = dashboardData?.data?.widgets?.map((e) =>
+		const updatedWidgets = selectedDashboard?.data?.widgets?.map((e) =>
 			e.id === currentSelectRowId ? { ...e, title: newTitle } : e,
 		);
 
-		const updatedDashboardData: Props = {
-			id: dashboardData.id,
+		const updatedSelectedDashboard: Props = {
+			id: selectedDashboard.id,
 			data: {
-				...dashboardData.data,
+				...selectedDashboard.data,
 				widgets: updatedWidgets,
 			},
 		};
 
-		updateDashboardMutation.mutateAsync(updatedDashboardData, {
+		updateDashboardMutation.mutateAsync(updatedSelectedDashboard, {
 			onSuccess: (updatedDashboard) => {
 				if (setLayouts) {
 					setLayouts(updatedDashboard.data?.data?.layout || []);
 				}
-				if (setDashboardData && updatedDashboard.data) {
-					setDashboardData(updatedDashboard.data);
+				if (setSelectedDashboard && updatedDashboard.data) {
+					setSelectedDashboard(updatedDashboard.data);
 				}
 				if (setPanelMap) {
 					setPanelMap(updatedDashboard.data?.data?.panelMap || {});
@@ -311,7 +311,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 	}, [currentSelectRowId, form, widgets]);
 
 	const handleRowCollapse = (id: string): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 		const { updatedLayout, updatedPanelMap } = applyRowCollapse(
@@ -343,7 +343,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 	};
 
 	const handleRowDelete = (): void => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
@@ -351,33 +351,34 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 			return;
 		}
 
-		const updatedWidgets = dashboardData?.data?.widgets?.filter(
+		const updatedWidgets = selectedDashboard?.data?.widgets?.filter(
 			(e) => e.id !== currentSelectRowId,
 		);
 
 		const updatedLayout =
-			dashboardData.data.layout?.filter((e) => e.i !== currentSelectRowId) || [];
+			selectedDashboard.data.layout?.filter((e) => e.i !== currentSelectRowId) ||
+			[];
 
 		const updatedPanelMap = { ...currentPanelMap };
 		delete updatedPanelMap[currentSelectRowId];
 
-		const updatedDashboardData: Props = {
-			id: dashboardData.id,
+		const updatedSelectedDashboard: Props = {
+			id: selectedDashboard.id,
 			data: {
-				...dashboardData.data,
+				...selectedDashboard.data,
 				widgets: updatedWidgets,
 				layout: updatedLayout,
 				panelMap: updatedPanelMap,
 			},
 		};
 
-		updateDashboardMutation.mutateAsync(updatedDashboardData, {
+		updateDashboardMutation.mutateAsync(updatedSelectedDashboard, {
 			onSuccess: (updatedDashboard) => {
 				if (setLayouts) {
 					setLayouts(updatedDashboard.data?.data?.layout || []);
 				}
-				if (setDashboardData && updatedDashboard.data) {
-					setDashboardData(updatedDashboard.data);
+				if (setSelectedDashboard && updatedDashboard.data) {
+					setSelectedDashboard(updatedDashboard.data);
 				}
 				if (setPanelMap) {
 					setPanelMap(updatedDashboard.data?.data?.panelMap || {});
@@ -389,8 +390,10 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 	};
 	const isDashboardEmpty = useMemo(
 		() =>
-			dashboardData?.data.layout ? dashboardData?.data.layout?.length === 0 : true,
-		[dashboardData],
+			selectedDashboard?.data.layout
+				? selectedDashboard?.data.layout?.length === 0
+				: true,
+		[selectedDashboard],
 	);
 
 	let isDataAvailableInAnyWidget = false;
@@ -509,7 +512,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 									widget={(currentWidget as Widgets) || ({ id, query: {} } as Widgets)}
 									headerMenuList={widgetActions}
 									variables={dashboardVariables}
-									// version={dashboardData?.data?.version}
+									// version={selectedDashboard?.data?.version}
 									version={ENTITY_VERSION_V5}
 									onDragSelect={onDragSelect}
 									dataAvailable={checkIfDataExists}

frontend/src/container/GridCardLayout/WidgetRow.tsx

@@ -42,14 +42,14 @@ export function WidgetRowHeader(props: WidgetRowHeaderProps): JSX.Element {
 		(s) => s.setIsPanelTypeSelectionModalOpen,
 	);
 
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 	const isDashboardLocked = useDashboardStore(selectIsDashboardLocked);
 
 	const permissions: ComponentTypes[] = ['add_panel'];
 	const { user } = useAppContext();
 
 	const userRole: ROLES | null =
-		dashboardData?.createdBy === user?.email
+		selectedDashboard?.createdBy === user?.email
 			? (USER_ROLES.AUTHOR as ROLES)
 			: user.role;
 	const [addPanelPermission] = useComponentPermission(permissions, userRole);
@@ -87,11 +87,11 @@ export function WidgetRowHeader(props: WidgetRowHeaderProps): JSX.Element {
 							icon={<Plus size={14} />}
 							onClick={(): void => {
 								// TODO: @AshwinBhatkal Simplify this check in cleanup of https://github.com/SigNoz/engineering-pod/issues/3953
-								if (!dashboardData?.id) {
+								if (!selectedDashboard?.id) {
 									return;
 								}
 
-								setSelectedRowWidgetId(dashboardData.id, id);
+								setSelectedRowWidgetId(selectedDashboard.id, id);
 								setIsPanelTypeSelectionModalOpen(true);
 							}}
 						>

frontend/src/container/GridCardLayout/useNavigateToExplorerPages.ts

@@ -121,7 +121,7 @@ function useNavigateToExplorerPages(): (
 ) => Promise<{
 	[queryName: string]: { filters: TagFilterItem[]; dataSource?: string };
 }> {
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 	const { notifications } = useNotifications();
 
 	return useCallback(
@@ -143,7 +143,7 @@ function useNavigateToExplorerPages(): (
 			}
 		},
 		// eslint-disable-next-line react-hooks/exhaustive-deps
-		[dashboardData, notifications],
+		[selectedDashboard, notifications],
 	);
 }
 

frontend/src/container/GridCardLayout/useResolveQuery.ts

@@ -20,7 +20,7 @@ interface UseUpdatedQueryOptions {
 		panelTypes: PANEL_TYPES;
 		timePreferance: timePreferenceType;
 	};
-	dashboardData?: any;
+	selectedDashboard?: any;
 }
 
 interface UseUpdatedQueryResult {
@@ -44,7 +44,7 @@ function useUpdatedQuery(): UseUpdatedQueryResult {
 	const getUpdatedQuery = useCallback(
 		async ({
 			widgetConfig,
-			dashboardData,
+			selectedDashboard,
 		}: UseUpdatedQueryOptions): Promise<Query> => {
 			// Prepare query payload with resolved variables
 			const { queryPayload } = prepareQueryRangePayloadV5({
@@ -52,7 +52,7 @@ function useUpdatedQuery(): UseUpdatedQueryResult {
 				graphType: getGraphType(widgetConfig.panelTypes),
 				selectedTime: widgetConfig.timePreferance,
 				globalSelectedInterval,
-				variables: getDashboardVariables(dashboardData?.data?.variables),
+				variables: getDashboardVariables(selectedDashboard?.data?.variables),
 				originalGraphType: widgetConfig.panelTypes,
 				dynamicVariables: dashboardDynamicVariables,
 			});

frontend/src/container/GridCardLayout/utils.ts

@@ -149,16 +149,16 @@ export function extractQueryNamesFromExpression(expression: string): string[] {
 
 export const hasColumnWidthsChanged = (
 	columnWidths: Record<string, Record<string, number>>,
-	dashboardData?: Dashboard,
+	selectedDashboard?: Dashboard,
 ): boolean => {
 	// If no column widths stored, no changes
-	if (isEmpty(columnWidths) || !dashboardData) {
+	if (isEmpty(columnWidths) || !selectedDashboard) {
 		return false;
 	}
 
 	// Check each widget's column widths
 	return Object.keys(columnWidths).some((widgetId) => {
-		const dashboardWidget = dashboardData?.data?.widgets?.find(
+		const dashboardWidget = selectedDashboard?.data?.widgets?.find(
 			(widget) => widget.id === widgetId,
 		) as Widgets;
 

frontend/src/container/InfraMonitoringK8s/Base/__tests__/K8sBaseList.test.tsx

@@ -37,10 +37,6 @@ jest.mock('utils/navigation', () => ({
 
 const openInNewTabMock = openInNewTab as jest.Mock;
 
-// Mock Date.now to prevent flaky tests due to time-dependent values
-const MOCK_NOW = 1700000000000; // Fixed timestamp
-jest.spyOn(Date, 'now').mockReturnValue(MOCK_NOW);
-
 // Mock DrawerWrapper to avoid CSS issues with jsdom
 // SyntaxError: 'div#radix-:rbv,,._dialog__content_qf8bf_22 :focus' is not a valid selector
 jest.mock('@signozhq/ui', () => ({
@@ -192,7 +188,6 @@ describe('K8sBaseList', () => {
 			await waitFor(() => {
 				const selectedItem = onUrlUpdateMock.mock.calls
 					.map((call) => call[0].searchParams.get('selectedItem'))
-					.filter(Boolean)
 					.pop();
 				expect(selectedItem).toBe(`PodId:${itemId}`);
 			});

frontend/src/container/LogExplorerQuerySection/LogExplorerQuerySection.test.tsx

@@ -93,8 +93,8 @@ jest.mock('hooks/useDarkMode', () => ({
 }));
 
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
-	useDashboardStore: (): { dashboardData: undefined } => ({
-		dashboardData: undefined,
+	useDashboardStore: (): { selectedDashboard: undefined } => ({
+		selectedDashboard: undefined,
 	}),
 }));
 

frontend/src/container/LogsPanelTable/__tests__/LogsPanelComponent.test.tsx

@@ -106,7 +106,7 @@ describe('LogsPanelComponent', () => {
 				<PreferenceContextProvider>
 					<NewWidget
 						dashboardId=""
-						dashboardData={undefined}
+						selectedDashboard={undefined}
 						selectedGraph={PANEL_TYPES.LIST}
 					/>
 				</PreferenceContextProvider>

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

@@ -30,7 +30,7 @@ function LeftContainer({
 	setRequestData,
 	setQueryResponse,
 	enableDrillDown = false,
-	dashboardData,
+	selectedDashboard,
 	isNewPanel = false,
 }: WidgetGraphProps): JSX.Element {
 	const { stagedQuery } = useQueryBuilder();
@@ -79,8 +79,8 @@ function LeftContainer({
 					isLoadingQueries={queryResponse.isFetching}
 					selectedWidget={selectedWidget}
 					dashboardVersion={ENTITY_VERSION_V5}
-					dashboardId={dashboardData?.id}
-					dashboardName={dashboardData?.data.title}
+					dashboardId={selectedDashboard?.id}
+					dashboardName={selectedDashboard?.data.title}
 					isNewPanel={isNewPanel}
 				/>
 				{selectedGraph === PANEL_TYPES.LIST && (

frontend/src/container/NewWidget/__test__/NewWidget.test.tsx

@@ -326,7 +326,7 @@ describe('Stacking bar in new panel', () => {
 					<PreferenceContextProvider>
 						<NewWidget
 							dashboardId=""
-							dashboardData={undefined}
+							selectedDashboard={undefined}
 							selectedGraph={PANEL_TYPES.BAR}
 						/>
 					</PreferenceContextProvider>
@@ -378,7 +378,7 @@ describe('when switching to BAR panel type', () => {
 			<DashboardBootstrapWrapper dashboardId="">
 				<NewWidget
 					dashboardId=""
-					dashboardData={undefined}
+					selectedDashboard={undefined}
 					selectedGraph={PANEL_TYPES.BAR}
 				/>
 			</DashboardBootstrapWrapper>,

frontend/src/container/NewWidget/index.tsx

@@ -86,7 +86,7 @@ import {
 import './NewWidget.styles.scss';
 
 function NewWidget({
-	dashboardData,
+	selectedDashboard,
 	dashboardId,
 	selectedGraph,
 	enableDrillDown = false,
@@ -135,7 +135,7 @@ function NewWidget({
 		[selectedGraph, globalSelectedInterval, isLogsQuery],
 	);
 
-	const { widgets = [] } = dashboardData?.data || {};
+	const { widgets = [] } = selectedDashboard?.data || {};
 
 	const query = useUrlQuery();
 
@@ -154,9 +154,9 @@ function NewWidget({
 		if (!logEventCalledRef.current) {
 			logEvent('Panel Edit: Page visited', {
 				panelType: selectedWidget?.panelTypes,
-				dashboardId: dashboardData?.id,
+				dashboardId: selectedDashboard?.id,
 				widgetId: selectedWidget?.id,
-				dashboardName: dashboardData?.data.title,
+				dashboardName: selectedDashboard?.data.title,
 				isNewPanel: !!isWidgetNotPresent,
 				dataSource: currentQuery?.builder?.queryData?.[0]?.dataSource,
 			});
@@ -362,7 +362,7 @@ function NewWidget({
 	const updateDashboardMutation = useUpdateDashboard();
 
 	const { afterWidgets, preWidgets } = useMemo(() => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return {
 				selectedWidget: {} as Widgets,
 				preWidgets: [],
@@ -372,18 +372,21 @@ function NewWidget({
 
 		const widgetId = query.get('widgetId');
 
-		const selectedWidgetIndex = getSelectedWidgetIndex(dashboardData, widgetId);
+		const selectedWidgetIndex = getSelectedWidgetIndex(
+			selectedDashboard,
+			widgetId,
+		);
 
-		const preWidgets = getPreviousWidgets(dashboardData, selectedWidgetIndex);
+		const preWidgets = getPreviousWidgets(selectedDashboard, selectedWidgetIndex);
 
-		const afterWidgets = getNextWidgets(dashboardData, selectedWidgetIndex);
+		const afterWidgets = getNextWidgets(selectedDashboard, selectedWidgetIndex);
 
-		const selectedWidget = (dashboardData.data.widgets || [])[
+		const selectedWidget = (selectedDashboard.data.widgets || [])[
 			selectedWidgetIndex || 0
 		];
 
 		return { selectedWidget, preWidgets, afterWidgets };
-	}, [dashboardData, query]);
+	}, [selectedDashboard, query]);
 
 	// this loading state is to take care of mismatch in the responses for table and other panels
 	// hence while changing the query contains the older value and the processing logic fails
@@ -480,12 +483,12 @@ function NewWidget({
 	}, [dashboardId, query, safeNavigate]);
 
 	const onClickSaveHandler = useCallback(() => {
-		if (!dashboardData) {
+		if (!selectedDashboard) {
 			return;
 		}
 
 		const widgetId = query.get('widgetId') || '';
-		let updatedLayout = dashboardData.data.layout || [];
+		let updatedLayout = selectedDashboard.data.layout || [];
 
 		const selectedRowWidgetId = getSelectedRowWidgetId(dashboardId);
 
@@ -519,10 +522,10 @@ function NewWidget({
 		const adjustedQueryForV5 = adjustQueryForV5(currentQuery);
 
 		const dashboard: Props = {
-			id: dashboardData.id,
+			id: selectedDashboard.id,
 
 			data: {
-				...dashboardData.data,
+				...selectedDashboard.data,
 				widgets: isNewDashboard
 					? [
 							...afterWidgets,
@@ -600,7 +603,7 @@ function NewWidget({
 			},
 		});
 	}, [
-		dashboardData,
+		selectedDashboard,
 		query,
 		isNewDashboard,
 		afterWidgets,
@@ -669,9 +672,9 @@ function NewWidget({
 	const onSaveDashboard = useCallback((): void => {
 		logEvent('Panel Edit: Save changes', {
 			panelType: selectedWidget.panelTypes,
-			dashboardId: dashboardData?.id,
+			dashboardId: selectedDashboard?.id,
 			widgetId: selectedWidget.id,
-			dashboardName: dashboardData?.data.title,
+			dashboardName: selectedDashboard?.data.title,
 			queryType: currentQuery.queryType,
 			isNewPanel,
 			dataSource: currentQuery?.builder?.queryData?.[0]?.dataSource,
@@ -867,7 +870,7 @@ function NewWidget({
 						<OverlayScrollbar>
 							{selectedWidget && (
 								<LeftContainer
-									dashboardData={dashboardData}
+									selectedDashboard={selectedDashboard}
 									selectedGraph={graphType}
 									selectedLogFields={selectedLogFields}
 									setSelectedLogFields={setSelectedLogFields}

frontend/src/container/NewWidget/types.ts

@@ -10,7 +10,7 @@ import { timePreferance } from './RightContainer/timeItems';
 
 export interface NewWidgetProps {
 	dashboardId: string;
-	dashboardData: Dashboard | undefined;
+	selectedDashboard: Dashboard | undefined;
 	selectedGraph: PANEL_TYPES;
 	enableDrillDown?: boolean;
 }
@@ -34,7 +34,7 @@ export interface WidgetGraphProps {
 		>
 	>;
 	enableDrillDown?: boolean;
-	dashboardData: Dashboard | undefined;
+	selectedDashboard: Dashboard | undefined;
 	isNewPanel?: boolean;
 }
 

frontend/src/container/QueryTable/Drilldown/useBaseAggregateOptions.tsx

@@ -66,7 +66,7 @@ const useBaseAggregateOptions = ({
 		getUpdatedQuery,
 		isLoading: isResolveQueryLoading,
 	} = useUpdatedQuery();
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 
 	useEffect(() => {
 		if (!aggregateData) {
@@ -79,7 +79,7 @@ const useBaseAggregateOptions = ({
 					panelTypes: panelType || PANEL_TYPES.TIME_SERIES,
 					timePreferance: 'GLOBAL_TIME',
 				},
-				dashboardData,
+				selectedDashboard,
 			});
 			setResolvedQuery(updatedQuery);
 		};

frontend/src/container/QueryTable/__test__/QueryTable.test.tsx

@@ -14,7 +14,7 @@ jest.mock('react-router-dom', () => ({
 // Mock useDashabord hook
 jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
 	useDashboardStore: (): any => ({
-		dashboardData: {
+		selectedDashboard: {
 			data: {
 				variables: [],
 			},

frontend/src/hooks/dashboard/useDashboardBootstrap.ts

@@ -48,7 +48,7 @@ export function useDashboardBootstrap(
 	);
 
 	const {
-		setDashboardData,
+		setSelectedDashboard,
 		setLayouts,
 		setPanelMap,
 		resetDashboardStore,
@@ -65,7 +65,7 @@ export function useDashboardBootstrap(
 		transformDashboardVariables,
 	} = useTransformDashboardVariables(dashboardId);
 
-	// Keep the external variables store in sync with dashboardData
+	// Keep the external variables store in sync with selectedDashboard
 	useDashboardVariablesSync(dashboardId);
 
 	const dashboardQuery = useDashboardQuery(dashboardId);
@@ -88,7 +88,7 @@ export function useDashboardBootstrap(
 			if (variables) {
 				initializeDefaultVariables(variables, getUrlVariables, updateUrlVariable);
 			}
-			setDashboardData(updatedDashboardData);
+			setSelectedDashboard(updatedDashboardData);
 			dashboardRef.current = updatedDashboardData;
 			setLayouts(sortLayout(getUpdatedLayout(updatedDashboardData?.data.layout)));
 			setPanelMap(defaultTo(updatedDashboardData?.data?.panelMap, {}));
@@ -107,7 +107,7 @@ export function useDashboardBootstrap(
 				title: t('dashboard_has_been_updated'),
 				content: t('do_you_want_to_refresh_the_dashboard'),
 				onOk() {
-					setDashboardData(updatedDashboardData);
+					setSelectedDashboard(updatedDashboardData);
 
 					const { maxTime, minTime } = getMinMaxForSelectedTime(
 						globalTime.selectedTime,

frontend/src/hooks/dashboard/useDashboardVariablesSync.ts

@@ -13,21 +13,21 @@ import { useDashboardVariablesSelector } from './useDashboardVariables';
 
 /**
  * Keeps the external variables store in sync with the zustand dashboard store.
- * When dashboardData changes, propagates variable updates to the variables store.
+ * When selectedDashboard changes, propagates variable updates to the variables store.
  */
 export function useDashboardVariablesSync(dashboardId: string): void {
 	const dashboardVariables = useDashboardVariablesSelector((s) => s.variables);
 	const savedDashboardId = useDashboardVariablesSelector((s) => s.dashboardId);
-	const dashboardData = useDashboardStore(
-		(s: DashboardStore) => s.dashboardData,
+	const selectedDashboard = useDashboardStore(
+		(s: DashboardStore) => s.selectedDashboard,
 	);
 
 	useEffect(() => {
-		const updatedVariables = dashboardData?.data.variables || {};
+		const updatedVariables = selectedDashboard?.data.variables || {};
 		if (savedDashboardId !== dashboardId) {
 			setDashboardVariablesStore({ dashboardId, variables: updatedVariables });
 		} else if (!isEqual(dashboardVariables, updatedVariables)) {
 			updateDashboardVariablesStore({ dashboardId, variables: updatedVariables });
 		}
-	}, [dashboardData]); // eslint-disable-line react-hooks/exhaustive-deps
+	}, [selectedDashboard]); // eslint-disable-line react-hooks/exhaustive-deps
 }

frontend/src/hooks/dashboard/useLockDashboard.ts

@@ -1,7 +1,7 @@
 import { useMutation } from 'react-query';
 import locked from 'api/v1/dashboards/id/lock';
 import {
-	getDashboardData,
+	getSelectedDashboard,
 	useDashboardStore,
 } from 'providers/Dashboard/store/useDashboardStore';
 import { useErrorModal } from 'providers/ErrorModalProvider';
@@ -13,11 +13,13 @@ import APIError from 'types/api/error';
  */
 export function useLockDashboard(): (value: boolean) => Promise<void> {
 	const { showErrorModal } = useErrorModal();
-	const { setDashboardData } = useDashboardStore();
+	const { setSelectedDashboard } = useDashboardStore();
 
 	const { mutate: lockDashboard } = useMutation(locked, {
 		onSuccess: (_, props) => {
-			setDashboardData((prev) => (prev ? { ...prev, locked: props.lock } : prev));
+			setSelectedDashboard((prev) =>
+				prev ? { ...prev, locked: props.lock } : prev,
+			);
 		},
 		onError: (error) => {
 			showErrorModal(error as APIError);
@@ -25,11 +27,11 @@ export function useLockDashboard(): (value: boolean) => Promise<void> {
 	});
 
 	return async (value: boolean): Promise<void> => {
-		const dashboardData = getDashboardData();
-		if (dashboardData) {
+		const selectedDashboard = getSelectedDashboard();
+		if (selectedDashboard) {
 			try {
 				await lockDashboard({
-					id: dashboardData.id,
+					id: selectedDashboard.id,
 					lock: value,
 				});
 			} catch (error) {

frontend/src/hooks/dashboard/useWidgetsByDynamicVariableId.ts

@@ -12,11 +12,11 @@ import { useDashboardVariablesByType } from './useDashboardVariablesByType';
  */
 export function useWidgetsByDynamicVariableId(): Record<string, string[]> {
 	const dynamicVariables = useDashboardVariablesByType('DYNAMIC', 'values');
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 
 	return useMemo(() => {
 		const widgets =
-			dashboardData?.data?.widgets?.filter(
+			selectedDashboard?.data?.widgets?.filter(
 				(widget) => widget.panelTypes !== PANEL_GROUP_TYPES.ROW,
 			) || [];
 
@@ -24,5 +24,5 @@ export function useWidgetsByDynamicVariableId(): Record<string, string[]> {
 			dynamicVariables,
 			widgets as Widgets[],
 		);
-	}, [dashboardData, dynamicVariables]);
+	}, [selectedDashboard, dynamicVariables]);
 }

frontend/src/hooks/queryBuilder/__tests__/useCreateAlerts.test.tsx

@@ -1,197 +0,0 @@
-import { useMutation } from 'react-query';
-// eslint-disable-next-line no-restricted-imports
-import { useSelector } from 'react-redux';
-import { act, renderHook } from '@testing-library/react';
-import { QueryParams } from 'constants/query';
-import { mapQueryDataFromApi } from 'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi';
-import { Widgets } from 'types/api/dashboard/getAll';
-import { EQueryType } from 'types/common/dashboard';
-
-import useCreateAlerts from '../useCreateAlerts';
-
-jest.mock('react-query', () => ({
-	useMutation: jest.fn(),
-}));
-
-jest.mock('react-redux', () => ({
-	useSelector: jest.fn(),
-}));
-
-jest.mock('api/common/logEvent', () => ({
-	__esModule: true,
-	default: jest.fn(),
-}));
-
-jest.mock('api/dashboard/substitute_vars', () => ({
-	getSubstituteVars: jest.fn(),
-}));
-
-jest.mock('api/v5/v5', () => ({
-	prepareQueryRangePayloadV5: jest.fn().mockReturnValue({ queryPayload: {} }),
-}));
-
-jest.mock(
-	'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi',
-	() => ({
-		mapQueryDataFromApi: jest.fn(),
-	}),
-);
-
-jest.mock('hooks/dashboard/useDashboardVariables', () => ({
-	useDashboardVariables: (): unknown => ({ dashboardVariables: {} }),
-}));
-
-jest.mock('hooks/dashboard/useDashboardVariablesByType', () => ({
-	useDashboardVariablesByType: (): unknown => ({}),
-}));
-
-jest.mock('hooks/useNotifications', () => ({
-	useNotifications: (): unknown => ({
-		notifications: { error: jest.fn() },
-	}),
-}));
-
-jest.mock('lib/dashboardVariables/getDashboardVariables', () => ({
-	getDashboardVariables: (): unknown => ({}),
-}));
-
-jest.mock('providers/Dashboard/store/useDashboardStore', () => ({
-	useDashboardStore: (): unknown => ({ dashboardData: undefined }),
-}));
-
-jest.mock('utils/getGraphType', () => ({
-	getGraphType: jest.fn().mockReturnValue('time_series'),
-}));
-
-const mockMapQueryDataFromApi = mapQueryDataFromApi as jest.MockedFunction<
-	typeof mapQueryDataFromApi
->;
-const mockUseMutation = useMutation as jest.MockedFunction<typeof useMutation>;
-const mockUseSelector = useSelector as jest.MockedFunction<typeof useSelector>;
-
-const buildWidget = (queryType: EQueryType | undefined): Widgets =>
-	(({
-		id: 'widget-1',
-		panelTypes: 'graph',
-		timePreferance: 'GLOBAL_TIME',
-		yAxisUnit: '',
-		query: {
-			queryType,
-			builder: { queryData: [], queryFormulas: [] },
-			clickhouse_sql: [],
-			promql: [],
-			id: 'q-1',
-		},
-	} as unknown) as Widgets);
-
-const getCompositeQueryFromLastOpen = (): Record<string, unknown> => {
-	const [url] = (window.open as jest.Mock).mock.calls[0];
-	const query = new URLSearchParams((url as string).split('?')[1]);
-	const raw = query.get(QueryParams.compositeQuery);
-	if (!raw) {
-		throw new Error('compositeQuery not found in URL');
-	}
-	return JSON.parse(decodeURIComponent(raw));
-};
-
-describe('useCreateAlerts', () => {
-	let capturedOnSuccess:
-		| ((data: { data: { compositeQuery: unknown } }) => void)
-		| null = null;
-
-	beforeEach(() => {
-		jest.clearAllMocks();
-		capturedOnSuccess = null;
-
-		mockUseSelector.mockReturnValue({ selectedTime: '1h' });
-
-		mockUseMutation.mockReturnValue(({
-			mutate: jest.fn((_payload, opts) => {
-				capturedOnSuccess = opts?.onSuccess ?? null;
-			}),
-		} as unknown) as ReturnType<typeof useMutation>);
-
-		// eslint-disable-next-line @typescript-eslint/no-explicit-any
-		(window as any).open = jest.fn();
-	});
-
-	it('preserves widget queryType when the API response maps to a different queryType', () => {
-		mockMapQueryDataFromApi.mockReturnValue({
-			queryType: EQueryType.QUERY_BUILDER,
-			builder: { queryData: [], queryFormulas: [] },
-			// eslint-disable-next-line @typescript-eslint/no-explicit-any
-		} as any);
-
-		const widget = buildWidget(EQueryType.CLICKHOUSE);
-		const { result } = renderHook(() => useCreateAlerts(widget));
-
-		act(() => {
-			result.current();
-		});
-
-		expect(capturedOnSuccess).not.toBeNull();
-
-		act(() => {
-			capturedOnSuccess?.({ data: { compositeQuery: {} } });
-		});
-
-		const composite = getCompositeQueryFromLastOpen();
-		expect(composite.queryType).toBe(EQueryType.CLICKHOUSE);
-	});
-
-	it('preserves promql queryType through the alert navigation URL', () => {
-		mockMapQueryDataFromApi.mockReturnValue({
-			queryType: EQueryType.QUERY_BUILDER,
-			builder: { queryData: [], queryFormulas: [] },
-			// eslint-disable-next-line @typescript-eslint/no-explicit-any
-		} as any);
-
-		const widget = buildWidget(EQueryType.PROM);
-		const { result } = renderHook(() => useCreateAlerts(widget));
-
-		act(() => {
-			result.current();
-		});
-		act(() => {
-			capturedOnSuccess?.({ data: { compositeQuery: {} } });
-		});
-
-		const composite = getCompositeQueryFromLastOpen();
-		expect(composite.queryType).toBe(EQueryType.PROM);
-	});
-
-	it('falls back to the mapped queryType when widget has no queryType', () => {
-		mockMapQueryDataFromApi.mockReturnValue({
-			queryType: EQueryType.QUERY_BUILDER,
-			builder: { queryData: [], queryFormulas: [] },
-			// eslint-disable-next-line @typescript-eslint/no-explicit-any
-		} as any);
-
-		const widget = buildWidget(undefined);
-		const { result } = renderHook(() => useCreateAlerts(widget));
-
-		act(() => {
-			result.current();
-		});
-		act(() => {
-			capturedOnSuccess?.({ data: { compositeQuery: {} } });
-		});
-
-		const composite = getCompositeQueryFromLastOpen();
-		// No override, so the mapped value wins.
-		expect(composite.queryType).toBe(EQueryType.QUERY_BUILDER);
-	});
-
-	it('does nothing when widget is undefined', () => {
-		const { result } = renderHook(() => useCreateAlerts(undefined));
-
-		act(() => {
-			result.current();
-		});
-
-		const mutateCalls = (mockUseMutation.mock.results[0].value as ReturnType<
-			typeof useMutation
-		>).mutate as jest.Mock;
-		expect(mutateCalls).not.toHaveBeenCalled();
-	});
-});

frontend/src/hooks/queryBuilder/useCreateAlerts.tsx

@@ -33,7 +33,7 @@ const useCreateAlerts = (widget?: Widgets, caller?: string): VoidFunction => {
 
 	const { notifications } = useNotifications();
 
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 
 	const { dashboardVariables } = useDashboardVariables();
 	const dashboardDynamicVariables = useDashboardVariablesByType(
@@ -49,8 +49,8 @@ const useCreateAlerts = (widget?: Widgets, caller?: string): VoidFunction => {
 		if (caller === 'panelView') {
 			logEvent('Panel Edit: Create alert', {
 				panelType: widget.panelTypes,
-				dashboardName: dashboardData?.data?.title,
-				dashboardId: dashboardData?.id,
+				dashboardName: selectedDashboard?.data?.title,
+				dashboardId: selectedDashboard?.id,
 				widgetId: widget.id,
 				queryType: widget.query.queryType,
 			});
@@ -58,8 +58,8 @@ const useCreateAlerts = (widget?: Widgets, caller?: string): VoidFunction => {
 			logEvent('Dashboard Detail: Panel action', {
 				action: MenuItemKeys.CreateAlerts,
 				panelType: widget.panelTypes,
-				dashboardName: dashboardData?.data?.title,
-				dashboardId: dashboardData?.id,
+				dashboardName: selectedDashboard?.data?.title,
+				dashboardId: selectedDashboard?.id,
 				widgetId: widget.id,
 				queryType: widget.query.queryType,
 			});
@@ -76,9 +76,6 @@ const useCreateAlerts = (widget?: Widgets, caller?: string): VoidFunction => {
 		queryRangeMutation.mutate(queryPayload, {
 			onSuccess: (data) => {
 				const updatedQuery = mapQueryDataFromApi(data.data.compositeQuery);
-				if (widget.query.queryType) {
-					updatedQuery.queryType = widget.query.queryType;
-				}
 				// If widget has a y-axis unit, set it to the updated query if it is not already set
 				if (widget.yAxisUnit && !isEmpty(widget.yAxisUnit)) {
 					updatedQuery.unit = widget.yAxisUnit;

frontend/src/lib/uPlotV2/components/types.ts

@@ -62,10 +62,10 @@ export interface TooltipRenderArgs {
 
 export interface BaseTooltipProps {
 	showTooltipHeader?: boolean;
+	timezone?: Timezone;
 	yAxisUnit?: string;
 	decimalPrecision?: PrecisionOption;
 	content?: TooltipContentItem[];
-	timezone?: Timezone;
 }
 
 export interface TimeSeriesTooltipProps

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/TooltipPlugin.tsx

@@ -4,7 +4,6 @@ import cx from 'classnames';
 import { getFocusedSeriesAtPosition } from 'lib/uPlotLib/plugins/onClickPlugin';
 import uPlot from 'uplot';
 
-import { syncCursorRegistry } from './syncCursorRegistry';
 import {
 	createInitialControllerState,
 	createSetCursorHandler,
@@ -41,7 +40,6 @@ export default function TooltipPlugin({
 	maxHeight = 600,
 	syncMode = DashboardCursorSync.None,
 	syncKey = '_tooltip_sync_global_',
-	syncMetadata,
 	pinnedTooltipElement,
 	canPinTooltip = false,
 }: TooltipPluginProps): JSX.Element | null {
@@ -102,29 +100,7 @@ export default function TooltipPlugin({
 		// crosshair / tooltip can follow the dashboard-wide cursor.
 		if (syncMode !== DashboardCursorSync.None && config.scales[0]?.props.time) {
 			config.setCursor({
-				sync: { key: syncKey, scales: ['x', 'y'] },
-			});
-
-			// Show the horizontal crosshair only when the receiving panel shares
-			// the same y-axis unit as the source panel. When this panel is the
-			// source (cursor.event != null) the line is always shown and this
-			// panel's metadata is written to the registry so receivers can read it.
-			config.addHook('setCursor', (u: uPlot): void => {
-				const yCursorEl = u.root.querySelector<HTMLElement>('.u-cursor-y');
-				if (!yCursorEl) {
-					return;
-				}
-
-				if (u.cursor.event != null) {
-					// This panel is the source — publish metadata and always show line.
-					syncCursorRegistry.setMetadata(syncKey, syncMetadata);
-					yCursorEl.style.display = '';
-				} else {
-					// This panel is receiving sync — show only if units match.
-					const sourceMeta = syncCursorRegistry.getMetadata(syncKey);
-					yCursorEl.style.display =
-						sourceMeta?.yAxisUnit === syncMetadata?.yAxisUnit ? '' : 'none';
-				}
+				sync: { key: syncKey, scales: ['x', null] },
 			});
 		}
 

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/syncCursorRegistry.ts

@@ -1,24 +0,0 @@
-import type { TooltipSyncMetadata } from './types';
-
-/**
- * Module-level registry that tracks the metadata of the panel currently
- * acting as the cursor source (the one being hovered) per sync group.
- *
- * uPlot fires the source panel's setCursor hook before broadcasting to
- * receivers, so the registry is always populated before receivers read it.
- *
- * Receivers use this to make decisions such as:
- * - Whether to show the horizontal crosshair line (matching yAxisUnit)
- * - Future: what to render inside the tooltip (matching groupBy, etc.)
- */
-const metadataBySyncKey = new Map<string, TooltipSyncMetadata | undefined>();
-
-export const syncCursorRegistry = {
-	setMetadata(syncKey: string, metadata: TooltipSyncMetadata | undefined): void {
-		metadataBySyncKey.set(syncKey, metadata);
-	},
-
-	getMetadata(syncKey: string): TooltipSyncMetadata | undefined {
-		return metadataBySyncKey.get(syncKey);
-	},
-};

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/types.ts

@@ -34,16 +34,11 @@ export interface TooltipLayoutInfo {
 	height: number;
 }
 
-export interface TooltipSyncMetadata {
-	yAxisUnit?: string;
-}
-
 export interface TooltipPluginProps {
 	config: UPlotConfigBuilder;
 	canPinTooltip?: boolean;
 	syncMode?: DashboardCursorSync;
 	syncKey?: string;
-	syncMetadata?: TooltipSyncMetadata;
 	render: (args: TooltipRenderArgs) => ReactNode;
 	pinnedTooltipElement?: (clickData: TooltipClickData) => ReactNode;
 	maxWidth?: number;

frontend/src/lib/uPlotV2/plugins/__tests__/TooltipPlugin.test.ts

@@ -516,7 +516,7 @@ describe('TooltipPlugin', () => {
 			);
 
 			expect(setCursorSpy).toHaveBeenCalledWith({
-				sync: { key: 'dashboard-sync', scales: ['x', 'y'] },
+				sync: { key: 'dashboard-sync', scales: ['x', null] },
 			});
 		});
 

frontend/src/pages/DashboardPage/index.tsx

@@ -21,7 +21,9 @@ function DashboardPage(): JSX.Element {
 		error,
 	} = useDashboardBootstrap(dashboardId, { confirm: onModal.confirm });
 
-	const dashboardTitle = useDashboardStore((s) => s.dashboardData?.data.title);
+	const dashboardTitle = useDashboardStore(
+		(s) => s.selectedDashboard?.data.title,
+	);
 
 	useEffect(() => {
 		document.title = dashboardTitle || document.title;

frontend/src/pages/DashboardWidget/index.tsx

@@ -62,9 +62,9 @@ function DashboardWidgetInternal({
 	widgetId: string;
 	graphType: PANEL_TYPES;
 }): JSX.Element | null {
-	const [dashboardData, setDashboardData] = useState<Dashboard | undefined>(
-		undefined,
-	);
+	const [selectedDashboard, setSelectedDashboard] = useState<
+		Dashboard | undefined
+	>(undefined);
 
 	const { transformDashboardVariables } = useTransformDashboardVariables(
 		dashboardId,
@@ -83,7 +83,7 @@ function DashboardWidgetInternal({
 		cacheTime: DASHBOARD_CACHE_TIME,
 		onSuccess: (response) => {
 			const updatedDashboardData = transformDashboardVariables(response.data);
-			setDashboardData(updatedDashboardData);
+			setSelectedDashboard(updatedDashboardData);
 			setDashboardVariablesStore({
 				dashboardId,
 				variables: updatedDashboardData.data.variables,
@@ -108,7 +108,7 @@ function DashboardWidgetInternal({
 			dashboardId={dashboardId}
 			selectedGraph={graphType}
 			enableDrillDown={isDrilldownEnabled()}
-			dashboardData={dashboardData}
+			selectedDashboard={selectedDashboard}
 		/>
 	);
 }

frontend/src/pages/TracesFunnels/components/CreateFunnel/CreateFunnel.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 import { useQueryClient } from 'react-query';
 import { generatePath, matchPath, useLocation } from 'react-router-dom';
-import { Input } from '@signozhq/ui';
+import { Input } from 'antd';
 import logEvent from 'api/common/logEvent';
 import axios from 'axios';
 import SignozModal from 'components/SignozModal/SignozModal';
@@ -132,6 +132,7 @@ function CreateFunnel({
 					onChange={handleInputChange}
 					placeholder="Eg. checkout dropoff funnel"
 					autoFocus
+					status={inputError && 'error'}
 				/>
 				{inputError && (
 					<span className="funnel-modal-content__error">{inputError}</span>

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

@@ -69,17 +69,17 @@ jest.mock('react-redux', () => ({
 jest.mock('uuid', () => ({ v4: jest.fn(() => 'mock-uuid') }));
 
 function TestComponent(): JSX.Element {
-	const { dashboardData } = useDashboardStore();
+	const { selectedDashboard } = useDashboardStore();
 	const { dashboardVariables } = useDashboardVariables();
 
 	return (
 		<div>
-			<div data-testid="dashboard-id">{dashboardData?.id}</div>
+			<div data-testid="dashboard-id">{selectedDashboard?.id}</div>
 			<div data-testid="dashboard-variables">
 				{dashboardVariables ? JSON.stringify(dashboardVariables) : 'null'}
 			</div>
 			<div data-testid="dashboard-data">
-				{dashboardData?.data?.title || 'No Title'}
+				{selectedDashboard?.data?.title || 'No Title'}
 			</div>
 		</div>
 	);

frontend/src/providers/Dashboard/store/slices/dashboardUISlice.ts

@@ -9,8 +9,8 @@ export type WidgetColumnWidths = {
 
 export interface DashboardUISlice {
 	//
-	dashboardData: Dashboard | undefined;
-	setDashboardData: (
+	selectedDashboard: Dashboard | undefined;
+	setSelectedDashboard: (
 		updater:
 			| Dashboard
 			| undefined
@@ -26,7 +26,7 @@ export interface DashboardUISlice {
 }
 
 export const initialDashboardUIState = {
-	dashboardData: undefined as Dashboard | undefined,
+	selectedDashboard: undefined as Dashboard | undefined,
 	columnWidths: {} as WidgetColumnWidths,
 };
 
@@ -38,10 +38,10 @@ export const createDashboardUISlice: StateCreator<
 > = (set) => ({
 	...initialDashboardUIState,
 
-	setDashboardData: (updater): void =>
+	setSelectedDashboard: (updater): void =>
 		set((state: DashboardUISlice): void => {
-			state.dashboardData =
-				typeof updater === 'function' ? updater(state.dashboardData) : updater;
+			state.selectedDashboard =
+				typeof updater === 'function' ? updater(state.selectedDashboard) : updater;
 		}),
 
 	setColumnWidths: (updater): void =>

frontend/src/providers/Dashboard/store/useDashboardStore.ts

@@ -25,7 +25,7 @@ export type DashboardStore = DashboardUISlice &
  * In this case, we are selecting the locked state of the selected dashboard.
  * */
 export const selectIsDashboardLocked = (s: DashboardStore): boolean =>
-	s.dashboardData?.locked ?? false;
+	s.selectedDashboard?.locked ?? false;
 
 export const useDashboardStore = create<DashboardStore>()(
 	immer((set, get, api) => ({
@@ -40,8 +40,8 @@ export const useDashboardStore = create<DashboardStore>()(
 );
 
 // Standalone imperative accessors — use these instead of calling useDashboardStore.getState() at call sites.
-export const getDashboardData = (): Dashboard | undefined =>
-	useDashboardStore.getState().dashboardData;
+export const getSelectedDashboard = (): Dashboard | undefined =>
+	useDashboardStore.getState().selectedDashboard;
 
 export const getDashboardLayouts = (): Layout[] =>
 	useDashboardStore.getState().layouts;

frontend/src/providers/Dashboard/util.ts

@@ -2,28 +2,28 @@ import { Layout } from 'react-grid-layout';
 import { Dashboard, Widgets } from 'types/api/dashboard/getAll';
 
 export const getPreviousWidgets = (
-	dashboardData: Dashboard,
+	selectedDashboard: Dashboard,
 	selectedWidgetIndex: number,
 ): Widgets[] =>
-	(dashboardData.data.widgets?.slice(
+	(selectedDashboard.data.widgets?.slice(
 		0,
 		selectedWidgetIndex || 0,
 	) as Widgets[]) || [];
 
 export const getNextWidgets = (
-	dashboardData: Dashboard,
+	selectedDashboard: Dashboard,
 	selectedWidgetIndex: number,
 ): Widgets[] =>
-	(dashboardData.data.widgets?.slice(
+	(selectedDashboard.data.widgets?.slice(
 		(selectedWidgetIndex || 0) + 1, // this is never undefined
-		dashboardData.data.widgets?.length,
+		selectedDashboard.data.widgets?.length,
 	) as Widgets[]) || [];
 
 export const getSelectedWidgetIndex = (
-	dashboardData: Dashboard,
+	selectedDashboard: Dashboard,
 	widgetId: string | null,
 ): number =>
-	dashboardData.data.widgets?.findIndex((e) => e.id === widgetId) || 0;
+	selectedDashboard.data.widgets?.findIndex((e) => e.id === widgetId) || 0;
 
 export const sortLayout = (layout: Layout[]): Layout[] =>
 	[...layout].sort((a, b) => {

pkg/querier/consume.go

@@ -419,6 +419,7 @@ func readAsRaw(rows driver.Rows, queryName string) (*qbtypes.RawData, error) {
 
 			rr.Data[name] = val
 		}
+		mergeSpanAttributeColumns(rr.Data)
 		outRows = append(outRows, &rr)
 	}
 	if err := rows.Err(); err != nil {
@@ -431,6 +432,48 @@ func readAsRaw(rows driver.Rows, queryName string) (*qbtypes.RawData, error) {
 	}, nil
 }
 
+// mergeSpanAttributeColumns merges the typed ClickHouse span attribute columns
+// (attributes_string, attributes_number, attributes_bool, resources_string) into
+// unified "attributes" and "resource_attributes" keys, removing the raw columns.
+// It is a no-op if none of the raw columns are present.
+func mergeSpanAttributeColumns(data map[string]any) {
+	attrStr, hasStr := data["attributes_string"]
+	attrNum, hasNum := data["attributes_number"]
+	attrBool, hasBool := data["attributes_bool"]
+	// todo(nitya): move to resource json
+	resStr, hasRes := data["resources_string"]
+
+	if !hasStr && !hasNum && !hasBool && !hasRes {
+		return
+	}
+
+	attributes := make(map[string]any)
+	if m, ok := attrStr.(map[string]string); ok {
+		for k, v := range m {
+			attributes[k] = v
+		}
+	}
+	if m, ok := attrNum.(map[string]float64); ok {
+		for k, v := range m {
+			attributes[k] = v
+		}
+	}
+	if m, ok := attrBool.(map[string]bool); ok {
+		for k, v := range m {
+			attributes[k] = v
+		}
+	}
+	delete(data, "attributes_string")
+	delete(data, "attributes_number")
+	delete(data, "attributes_bool")
+	data["attributes"] = attributes
+
+	if m, ok := resStr.(map[string]string); ok {
+		data["resource"] = m
+	}
+	delete(data, "resources_string")
+}
+
 // numericAsFloat converts numeric types to float64 efficiently.
 func numericAsFloat(v any) float64 {
 	switch x := v.(type) {

pkg/telemetrytraces/const.go

@@ -1,6 +1,50 @@
 package telemetrytraces
 
-import "github.com/SigNoz/signoz/pkg/types/telemetrytypes"
+import (
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
+)
+
+const (
+
+	// Internal Columns.
+	SpanTimestampBucketStartColumn = "ts_bucket_start"
+	SpanResourceFingerPrintColumn  = "resource_fingerprint"
+
+	// Intrinsic Columns.
+	SpanTimestampColumn        = "timestamp"
+	SpanTraceIDColumn          = "trace_id"
+	SpanSpanIDColumn           = "span_id"
+	SpanTraceStateColumn       = "trace_state"
+	SpanParentSpanIDColumn     = "parent_span_id"
+	SpanFlagsColumn            = "flags"
+	SpanNameColumn             = "name"
+	SpanKindColumn             = "kind"
+	SpanKindStringColumn       = "kind_string"
+	SpanDurationNanoColumn     = "duration_nano"
+	SpanStatusCodeColumn       = "status_code"
+	SpanStatusMessageColumn    = "status_message"
+	SpanStatusCodeStringColumn = "status_code_string"
+	SpanEventsColumn           = "events"
+	SpanLinksColumn            = "links"
+
+	// Calculated Columns.
+	SpanResponseStatusCodeColumn = "response_status_code"
+	SpanExternalHTTPURLColumn    = "external_http_url"
+	SpanHTTPURLColumn            = "http_url"
+	SpanExternalHTTPMethodColumn = "external_http_method"
+	SpanHTTPMethodColumn         = "http_method"
+	SpanHTTPHostColumn           = "http_host"
+	SpanDBNameColumn             = "db_name"
+	SpanDBOperationColumn        = "db_operation"
+	SpanHasErrorColumn           = "has_error"
+	SpanIsRemoteColumn           = "is_remote"
+
+	// Contextual Columns.
+	SpanAttributesStringColumn = "attributes_string"
+	SpanAttributesNumberColumn = "attributes_number"
+	SpanAttributesBoolColumn   = "attributes_bool"
+	SpanResourcesStringColumn  = "resources_string"
+)
 
 var (
 	IntrinsicFields = map[string]telemetrytypes.TelemetryFieldKey{

pkg/telemetrytraces/field_mapper_test.go

@@ -78,6 +78,16 @@ func TestGetFieldKeyName(t *testing.T) {
 			expectedResult: "multiIf(resource.`deployment.environment` IS NOT NULL, resource.`deployment.environment`::String, `resource_string_deployment$$environment_exists`==true, `resource_string_deployment$$environment`, NULL)",
 			expectedError:  nil,
 		},
+		{
+			name: "Contextual map column - attributes_string without span context does not short-circuit",
+			key: telemetrytypes.TelemetryFieldKey{
+				Name:          SpanAttributesStringColumn,
+				FieldContext:  telemetrytypes.FieldContextAttribute,
+				FieldDataType: telemetrytypes.FieldDataTypeString,
+			},
+			expectedResult: "attributes_string['attributes_string']",
+			expectedError:  nil,
+		},
 		{
 			name: "Non-existent column",
 			key: telemetrytypes.TelemetryFieldKey{

pkg/telemetrytraces/statement_builder.go

@@ -4,7 +4,6 @@ import (
 	"context"
 	"fmt"
 	"log/slog"
-	"slices"
 	"strings"
 
 	"github.com/SigNoz/signoz/pkg/errors"
@@ -15,7 +14,6 @@ import (
 	qbtypes "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
 	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
 	"github.com/huandu/go-sqlbuilder"
-	"golang.org/x/exp/maps"
 )
 
 var (
@@ -86,40 +84,12 @@ func (b *traceQueryStatementBuilder) Build(
 		return nil, err
 	}
 
-	/*
-		Adding a tech debt note here:
-		This piece of code is a hot fix and should be removed once we close issue: engineering-pod/issues/3622
-	*/
-	/*
-		-------------------------------- Start of tech debt ----------------------------
-	*/
+	isSelectFieldsEmpty := false
 	if requestType == qbtypes.RequestTypeRaw {
-
-		selectedFields := query.SelectFields
-
-		if len(selectedFields) == 0 {
-			sortedKeys := maps.Keys(DefaultFields)
-			slices.Sort(sortedKeys)
-			for _, key := range sortedKeys {
-				selectedFields = append(selectedFields, DefaultFields[key])
-			}
-			query.SelectFields = selectedFields
-		}
-
-		selectFieldKeys := []string{}
-		for _, field := range selectedFields {
-			selectFieldKeys = append(selectFieldKeys, field.Name)
-		}
-
-		for _, x := range []string{"timestamp", "span_id", "trace_id"} {
-			if !slices.Contains(selectFieldKeys, x) {
-				query.SelectFields = append(query.SelectFields, DefaultFields[x])
-			}
-		}
+		// we are expanding here to ensure that all the conflicts are taken care in adjustKeys
+		// i.e if there is a conflict we strip away context of the key in adjustKeys
+		query, isSelectFieldsEmpty = b.expandRawSelectFields(query)
 	}
-	/*
-		-------------------------------- End of tech debt ----------------------------
-	*/
 
 	query = b.adjustKeys(ctx, keys, query, requestType)
 
@@ -128,7 +98,7 @@ func (b *traceQueryStatementBuilder) Build(
 
 	switch requestType {
 	case qbtypes.RequestTypeRaw:
-		return b.buildListQuery(ctx, q, query, start, end, keys, variables)
+		return b.buildListQuery(ctx, q, query, start, end, keys, variables, isSelectFieldsEmpty)
 	case qbtypes.RequestTypeTimeSeries:
 		return b.buildTimeSeriesQuery(ctx, q, query, start, end, keys, variables)
 	case qbtypes.RequestTypeScalar:
@@ -292,6 +262,7 @@ func (b *traceQueryStatementBuilder) buildListQuery(
 	start, end uint64,
 	keys map[string][]*telemetrytypes.TelemetryFieldKey,
 	variables map[string]qbtypes.VariableItem,
+	isSelectFieldsEmpty bool,
 ) (*qbtypes.Statement, error) {
 
 	var (
@@ -306,7 +277,6 @@ func (b *traceQueryStatementBuilder) buildListQuery(
 		cteArgs = append(cteArgs, args)
 	}
 
-	// TODO: should we deprecate `SelectFields` and return everything from a span like we do for logs?
 	for _, field := range query.SelectFields {
 		colExpr, err := b.fm.ColumnExpressionFor(ctx, start, end, &field, keys)
 		if err != nil {
@@ -315,6 +285,13 @@ func (b *traceQueryStatementBuilder) buildListQuery(
 		sb.SelectMore(colExpr)
 	}
 
+	if isSelectFieldsEmpty {
+		sb.SelectMore(SpanAttributesStringColumn)
+		sb.SelectMore(SpanAttributesNumberColumn)
+		sb.SelectMore(SpanAttributesBoolColumn)
+		sb.SelectMore(SpanResourcesStringColumn)
+	}
+
 	// From table
 	sb.From(fmt.Sprintf("%s.%s", DBName, SpanIndexV3TableName))
 
@@ -841,3 +818,52 @@ func (b *traceQueryStatementBuilder) buildResourceFilterCTE(
 		variables,
 	)
 }
+
+// expandRawSelectFields populates SelectFields for raw (list view) queries.
+// It must be called before adjustKeys so that normalization runs over the full set.
+// Returns the updated query and whether the original SelectFields was empty (i.e. full expansion was performed).
+func (b *traceQueryStatementBuilder) expandRawSelectFields(query qbtypes.QueryBuilderQuery[qbtypes.TraceAggregation]) (qbtypes.QueryBuilderQuery[qbtypes.TraceAggregation], bool) {
+	wasEmpty := len(query.SelectFields) == 0
+	selectFields := []telemetrytypes.TelemetryFieldKey{
+		{Name: SpanTimestampColumn, FieldContext: telemetrytypes.FieldContextSpan},
+		{Name: SpanTraceIDColumn, FieldContext: telemetrytypes.FieldContextSpan},
+		{Name: SpanSpanIDColumn, FieldContext: telemetrytypes.FieldContextSpan},
+	}
+	if wasEmpty {
+		// Select all intrinsic columns
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanTraceStateColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanParentSpanIDColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanFlagsColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanNameColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanKindColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanKindStringColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanDurationNanoColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanStatusCodeColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanStatusMessageColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanStatusCodeStringColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanEventsColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanLinksColumn, FieldContext: telemetrytypes.FieldContextSpan})
+
+		// select all calculated columns
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanResponseStatusCodeColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanExternalHTTPURLColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanHTTPURLColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanExternalHTTPMethodColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanHTTPMethodColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanHTTPHostColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanDBNameColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanDBOperationColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanHasErrorColumn, FieldContext: telemetrytypes.FieldContextSpan})
+		selectFields = append(selectFields, telemetrytypes.TelemetryFieldKey{Name: SpanIsRemoteColumn, FieldContext: telemetrytypes.FieldContextSpan})
+	} else {
+		for _, field := range query.SelectFields {
+			// TODO(tvats): If a user specifies attribute.timestamp in the select fields, this loop will basically ignore it, as we already added a field by default. This can be fixed once we close https://github.com/SigNoz/engineering-pod/issues/3693
+			if field.Name == SpanTimestampColumn || field.Name == SpanTraceIDColumn || field.Name == SpanSpanIDColumn {
+				continue
+			}
+			selectFields = append(selectFields, field)
+		}
+	}
+	query.SelectFields = selectFields
+	return query, wasEmpty
+}

pkg/telemetrytraces/stmt_builder_test.go

@@ -436,7 +436,7 @@ func TestStatementBuilderListQuery(t *testing.T) {
 				},
 			},
 			expected: qbtypes.Statement{
-				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT name AS `name`, multiIf(resource.`service.name` IS NOT NULL, resource.`service.name`::String, mapContains(resources_string, 'service.name'), resources_string['service.name'], NULL) AS `service.name`, duration_nano AS `duration_nano`, `attribute_number_cart$$items_count` AS `cart.items_count`, timestamp AS `timestamp`, span_id AS `span_id`, trace_id AS `trace_id` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
+				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT timestamp AS `timestamp`, trace_id AS `trace_id`, span_id AS `span_id`, name AS `name`, multiIf(resource.`service.name` IS NOT NULL, resource.`service.name`::String, mapContains(resources_string, 'service.name'), resources_string['service.name'], NULL) AS `service.name`, duration_nano AS `duration_nano`, `attribute_number_cart$$items_count` AS `cart.items_count` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
 				Args:  []any{"redis-manual", "%service.name%", "%service.name\":\"redis-manual%", uint64(1747945619), uint64(1747983448), "1747947419000000000", "1747983448000000000", uint64(1747945619), uint64(1747983448), 10},
 			},
 			expectedErr: nil,
@@ -465,7 +465,7 @@ func TestStatementBuilderListQuery(t *testing.T) {
 				Limit: 10,
 			},
 			expected: qbtypes.Statement{
-				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT duration_nano AS `duration_nano`, name AS `name`, response_status_code AS `response_status_code`, multiIf(resource.`service.name` IS NOT NULL, resource.`service.name`::String, mapContains(resources_string, 'service.name'), resources_string['service.name'], NULL) AS `service.name`, span_id AS `span_id`, timestamp AS `timestamp`, trace_id AS `trace_id` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? ORDER BY attributes_string['user.id'] AS `user.id` desc LIMIT ?",
+				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT timestamp AS `timestamp`, trace_id AS `trace_id`, span_id AS `span_id`, trace_state AS `trace_state`, parent_span_id AS `parent_span_id`, flags AS `flags`, name AS `name`, kind AS `kind`, kind_string AS `kind_string`, duration_nano AS `duration_nano`, status_code AS `status_code`, status_message AS `status_message`, status_code_string AS `status_code_string`, events AS `events`, links AS `links`, response_status_code AS `response_status_code`, external_http_url AS `external_http_url`, http_url AS `http_url`, external_http_method AS `external_http_method`, http_method AS `http_method`, http_host AS `http_host`, db_name AS `db_name`, db_operation AS `db_operation`, has_error AS `has_error`, is_remote AS `is_remote`, attributes_string, attributes_number, attributes_bool, resources_string FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? ORDER BY attributes_string['user.id'] AS `user.id` desc LIMIT ?",
 				Args:  []any{"redis-manual", "%service.name%", "%service.name\":\"redis-manual%", uint64(1747945619), uint64(1747983448), "1747947419000000000", "1747983448000000000", uint64(1747945619), uint64(1747983448), 10},
 			},
 			expectedErr: nil,
@@ -509,7 +509,7 @@ func TestStatementBuilderListQuery(t *testing.T) {
 				Limit: 10,
 			},
 			expected: qbtypes.Statement{
-				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT name AS `name`, resource_string_service$$name AS `serviceName`, duration_nano AS `durationNano`, http_method AS `httpMethod`, response_status_code AS `responseStatusCode`, timestamp AS `timestamp`, span_id AS `span_id`, trace_id AS `trace_id` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
+				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT timestamp AS `timestamp`, trace_id AS `trace_id`, span_id AS `span_id`, name AS `name`, resource_string_service$$name AS `serviceName`, duration_nano AS `durationNano`, http_method AS `httpMethod`, response_status_code AS `responseStatusCode` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
 				Args:  []any{"redis-manual", "%service.name%", "%service.name\":\"redis-manual%", uint64(1747945619), uint64(1747983448), "1747947419000000000", "1747983448000000000", uint64(1747945619), uint64(1747983448), 10},
 			},
 			expectedErr: nil,
@@ -553,7 +553,7 @@ func TestStatementBuilderListQuery(t *testing.T) {
 				Limit: 10,
 			},
 			expected: qbtypes.Statement{
-				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT name AS `name`, resource_string_service$$name AS `serviceName`, duration_nano AS `durationNano`, http_method AS `httpMethod`, multiIf(toString(`attribute_string_mixed$$materialization$$key`) != '', toString(`attribute_string_mixed$$materialization$$key`), toString(multiIf(resource.`mixed.materialization.key` IS NOT NULL, resource.`mixed.materialization.key`::String, mapContains(resources_string, 'mixed.materialization.key'), resources_string['mixed.materialization.key'], NULL)) != '', toString(multiIf(resource.`mixed.materialization.key` IS NOT NULL, resource.`mixed.materialization.key`::String, mapContains(resources_string, 'mixed.materialization.key'), resources_string['mixed.materialization.key'], NULL)), NULL) AS `mixed.materialization.key`, timestamp AS `timestamp`, span_id AS `span_id`, trace_id AS `trace_id` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
+				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT timestamp AS `timestamp`, trace_id AS `trace_id`, span_id AS `span_id`, name AS `name`, resource_string_service$$name AS `serviceName`, duration_nano AS `durationNano`, http_method AS `httpMethod`, multiIf(toString(`attribute_string_mixed$$materialization$$key`) != '', toString(`attribute_string_mixed$$materialization$$key`), toString(multiIf(resource.`mixed.materialization.key` IS NOT NULL, resource.`mixed.materialization.key`::String, mapContains(resources_string, 'mixed.materialization.key'), resources_string['mixed.materialization.key'], NULL)) != '', toString(multiIf(resource.`mixed.materialization.key` IS NOT NULL, resource.`mixed.materialization.key`::String, mapContains(resources_string, 'mixed.materialization.key'), resources_string['mixed.materialization.key'], NULL)), NULL) AS `mixed.materialization.key` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
 				Args:  []any{"redis-manual", "%service.name%", "%service.name\":\"redis-manual%", uint64(1747945619), uint64(1747983448), "1747947419000000000", "1747983448000000000", uint64(1747945619), uint64(1747983448), 10},
 			},
 			expectedErr: nil,
@@ -598,7 +598,7 @@ func TestStatementBuilderListQuery(t *testing.T) {
 				Limit: 10,
 			},
 			expected: qbtypes.Statement{
-				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT name AS `name`, resource_string_service$$name AS `serviceName`, duration_nano AS `durationNano`, http_method AS `httpMethod`, `attribute_string_mixed$$materialization$$key` AS `mixed.materialization.key`, timestamp AS `timestamp`, span_id AS `span_id`, trace_id AS `trace_id` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
+				Query: "WITH __resource_filter AS (SELECT fingerprint FROM signoz_traces.distributed_traces_v3_resource WHERE (simpleJSONExtractString(labels, 'service.name') = ? AND labels LIKE ? AND labels LIKE ?) AND seen_at_ts_bucket_start >= ? AND seen_at_ts_bucket_start <= ?) SELECT timestamp AS `timestamp`, trace_id AS `trace_id`, span_id AS `span_id`, name AS `name`, resource_string_service$$name AS `serviceName`, duration_nano AS `durationNano`, http_method AS `httpMethod`, `attribute_string_mixed$$materialization$$key` AS `mixed.materialization.key` FROM signoz_traces.distributed_signoz_index_v3 WHERE resource_fingerprint GLOBAL IN (SELECT fingerprint FROM __resource_filter) AND timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
 				Args:  []any{"redis-manual", "%service.name%", "%service.name\":\"redis-manual%", uint64(1747945619), uint64(1747983448), "1747947419000000000", "1747983448000000000", uint64(1747945619), uint64(1747983448), 10},
 			},
 			expectedErr: nil,
@@ -706,7 +706,7 @@ func TestStatementBuilderListQueryWithCorruptData(t *testing.T) {
 				Limit:        10,
 			},
 			expected: qbtypes.Statement{
-				Query: "SELECT duration_nano AS `duration_nano`, name AS `name`, response_status_code AS `response_status_code`, multiIf(resource.`service.name` IS NOT NULL, resource.`service.name`::String, mapContains(resources_string, 'service.name'), resources_string['service.name'], NULL) AS `service.name`, span_id AS `span_id`, timestamp AS `timestamp`, trace_id AS `trace_id` FROM signoz_traces.distributed_signoz_index_v3 WHERE timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
+				Query: "SELECT timestamp AS `timestamp`, trace_id AS `trace_id`, span_id AS `span_id`, trace_state AS `trace_state`, parent_span_id AS `parent_span_id`, flags AS `flags`, name AS `name`, kind AS `kind`, kind_string AS `kind_string`, duration_nano AS `duration_nano`, status_code AS `status_code`, status_message AS `status_message`, status_code_string AS `status_code_string`, events AS `events`, links AS `links`, response_status_code AS `response_status_code`, external_http_url AS `external_http_url`, http_url AS `http_url`, external_http_method AS `external_http_method`, http_method AS `http_method`, http_host AS `http_host`, db_name AS `db_name`, db_operation AS `db_operation`, has_error AS `has_error`, is_remote AS `is_remote`, attributes_string, attributes_number, attributes_bool, resources_string FROM signoz_traces.distributed_signoz_index_v3 WHERE timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? LIMIT ?",
 				Args:  []any{"1747947419000000000", "1747983448000000000", uint64(1747945619), uint64(1747983448), 10},
 			},
 			expectedErr: nil,
@@ -739,7 +739,7 @@ func TestStatementBuilderListQueryWithCorruptData(t *testing.T) {
 				}},
 			},
 			expected: qbtypes.Statement{
-				Query: "SELECT duration_nano AS `duration_nano`, name AS `name`, response_status_code AS `response_status_code`, multiIf(resource.`service.name` IS NOT NULL, resource.`service.name`::String, mapContains(resources_string, 'service.name'), resources_string['service.name'], NULL) AS `service.name`, span_id AS `span_id`, timestamp AS `timestamp`, trace_id AS `trace_id` FROM signoz_traces.distributed_signoz_index_v3 WHERE timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? ORDER BY timestamp AS `timestamp` asc LIMIT ?",
+				Query: "SELECT timestamp AS `timestamp`, trace_id AS `trace_id`, span_id AS `span_id`, trace_state AS `trace_state`, parent_span_id AS `parent_span_id`, flags AS `flags`, name AS `name`, kind AS `kind`, kind_string AS `kind_string`, duration_nano AS `duration_nano`, status_code AS `status_code`, status_message AS `status_message`, status_code_string AS `status_code_string`, events AS `events`, links AS `links`, response_status_code AS `response_status_code`, external_http_url AS `external_http_url`, http_url AS `http_url`, external_http_method AS `external_http_method`, http_method AS `http_method`, http_host AS `http_host`, db_name AS `db_name`, db_operation AS `db_operation`, has_error AS `has_error`, is_remote AS `is_remote`, attributes_string, attributes_number, attributes_bool, resources_string FROM signoz_traces.distributed_signoz_index_v3 WHERE timestamp >= ? AND timestamp < ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? ORDER BY timestamp AS `timestamp` asc LIMIT ?",
 				Args:  []any{"1747947419000000000", "1747983448000000000", uint64(1747945619), uint64(1747983448), 10},
 			},
 			expectedErr: nil,

tests/integration/src/querier/04_traces.py

@@ -490,25 +490,24 @@ def test_traces_list(
                     "name": "A",
                     "signal": "traces",
                     "disabled": False,
+                    "selectFields": [
+                        {"name": "span_id"},
+                        {"name": "span.timestamp"},
+                        {"name": "trace_id"},
+                    ],
                     "order": [{"key": {"name": "timestamp"}, "direction": "desc"}],
                     "limit": 1,
                 },
             },
             HTTPStatus.OK,
             lambda x: [
-                x[3].duration_nano,
-                x[3].name,
-                x[3].response_status_code,
-                x[3].service_name,
                 x[3].span_id,
                 format_timestamp(x[3].timestamp),
                 x[3].trace_id,
             ],  # type: Callable[[List[Traces]], List[Any]]
         ),
         # Case 2: order by attribute timestamp field which is there in attributes as well
-        # This should break but it doesn't because attribute.timestamp gets adjusted to timestamp
-        # because of default trace.timestamp gets added by default and bug in field mapper picks
-        # instrinsic field
+        # attribute.timestamp gets adjusted to span.timestamp
         pytest.param(
             {
                 "type": "builder_query",
@@ -516,6 +515,11 @@ def test_traces_list(
                     "name": "A",
                     "signal": "traces",
                     "disabled": False,
+                    "selectFields": [
+                        {"name": "span_id"},
+                        {"name": "span.timestamp"},
+                        {"name": "trace_id"},
+                    ],
                     "order": [
                         {"key": {"name": "attribute.timestamp"}, "direction": "desc"}
                     ],
@@ -524,10 +528,6 @@ def test_traces_list(
             },
             HTTPStatus.OK,
             lambda x: [
-                x[3].duration_nano,
-                x[3].name,
-                x[3].response_status_code,
-                x[3].service_name,
                 x[3].span_id,
                 format_timestamp(x[3].timestamp),
                 x[3].trace_id,
@@ -553,7 +553,7 @@ def test_traces_list(
             ],  # type: Callable[[List[Traces]], List[Any]]
         ),
         # Case 4: select attribute.timestamp with empty order by
-        # This doesn't return any data because of where_clause using aliased timestamp
+        # This returns the one span which has attribute.timestamp
         pytest.param(
             {
                 "type": "builder_query",
@@ -567,7 +567,11 @@ def test_traces_list(
                 },
             },
             HTTPStatus.OK,
-            lambda x: [],  # type: Callable[[List[Traces]], List[Any]]
+            lambda x: [
+                x[0].span_id,
+                format_timestamp(x[0].timestamp),
+                x[0].trace_id,
+            ],  # type: Callable[[List[Traces]], List[Any]]
         ),
         # Case 5: select timestamp with timestamp order by
         pytest.param(
@@ -706,6 +710,112 @@ def test_traces_list_with_corrupt_data(
                 assert data[key] == value
 
 
+@pytest.mark.parametrize(
+    "select_fields,status_code,expected_keys",
+    [
+        pytest.param(
+            [],
+            HTTPStatus.OK,
+            [
+                # all intrinsic column
+                "timestamp",
+                "trace_id",
+                "span_id",
+                "trace_state",
+                "parent_span_id",
+                "flags",
+                "name",
+                "kind",
+                "kind_string",
+                "duration_nano",
+                "status_code",
+                "status_message",
+                "status_code_string",
+                "events",
+                "links",
+                # all calculated columns
+                "response_status_code",
+                "external_http_url",
+                "http_url",
+                "external_http_method",
+                "http_method",
+                "http_host",
+                "db_name",
+                "db_operation",
+                "has_error",
+                "is_remote",
+                # all contextual columns (merged in response layer)
+                "attributes",
+                "resource",
+            ],
+        ),
+        pytest.param(
+            [
+                {"name": "service.name"},
+            ],
+            HTTPStatus.OK,
+            ["timestamp", "trace_id", "span_id", "service.name"],
+        ),
+    ],
+)
+def test_traces_list_with_select_fields(
+    signoz: types.SigNoz,
+    create_user_admin: None,  # pylint: disable=unused-argument
+    get_token: Callable[[str, str], str],
+    insert_traces: Callable[[List[Traces]], None],
+    select_fields: List[dict],
+    status_code: HTTPStatus,
+    expected_keys: List[str],
+) -> None:
+    """
+    Setup:
+    Insert 4 traces with different attributes.
+
+    Tests:
+    1. Empty select fields should return all the fields.
+    2. Non empty select field should return the select field along with timestamp, trace_id and span_id.
+    """
+    traces = (
+        generate_traces_with_corrupt_metadata()
+    )  # using this as the data doesn't matter
+
+    insert_traces(traces)
+
+    token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
+
+    payload = {
+        "type": "builder_query",
+        "spec": {
+            "name": "A",
+            "signal": "traces",
+            "selectFields": select_fields,
+            "order": [{"key": {"name": "timestamp"}, "direction": "desc"}],
+            "limit": 1,
+        },
+    }
+
+    response = make_query_request(
+        signoz,
+        token,
+        start_ms=int(
+            (datetime.now(tz=timezone.utc) - timedelta(minutes=5)).timestamp() * 1000
+        ),
+        end_ms=int(datetime.now(tz=timezone.utc).timestamp() * 1000),
+        request_type="raw",
+        queries=[payload],
+    )
+    assert response.status_code == status_code
+
+    if response.status_code == HTTPStatus.OK:
+        data = response.json()
+        assert len(data["data"]["data"]["results"][0]["rows"][0]["data"].keys()) == len(
+            expected_keys
+        )
+        assert set(data["data"]["data"]["results"][0]["rows"][0]["data"].keys()) == set(
+            expected_keys
+        )
+
+
 @pytest.mark.parametrize(
     "order_by,aggregation_alias,expected_status",
     [