chore(release): bump to v0.113.0 (#10420)

Co-authored-by: primus-bot[bot] <171087277+primus-bot[bot]@users.noreply.github.com>

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

@@ -190,7 +190,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.112.1
+    image: signoz/signoz:v0.113.0
     ports:
       - "8080:8080" # signoz port
     #   - "6060:6060"     # pprof port
@@ -213,7 +213,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:v0.142.1
+    image: signoz/signoz-otel-collector:v0.144.1
     entrypoint:
       - /bin/sh
     command:
@@ -241,7 +241,7 @@ services:
       replicas: 3
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:v0.144.1
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_CLUSTER=cluster

deploy/docker-swarm/docker-compose.yaml

@@ -117,7 +117,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.112.1
+    image: signoz/signoz:v0.113.0
     ports:
       - "8080:8080" # signoz port
     volumes:
@@ -139,7 +139,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:v0.142.1
+    image: signoz/signoz-otel-collector:v0.144.1
     entrypoint:
       - /bin/sh
     command:
@@ -167,7 +167,7 @@ services:
       replicas: 3
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:v0.144.1
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_CLUSTER=cluster

deploy/docker/docker-compose.ha.yaml

@@ -181,7 +181,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.112.1}
+    image: signoz/signoz:${VERSION:-v0.113.0}
     container_name: signoz
     ports:
       - "8080:8080" # signoz port
@@ -204,7 +204,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.1}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-otel-collector
     entrypoint:
       - /bin/sh
@@ -229,7 +229,7 @@ services:
       - "4318:4318" # OTLP HTTP receiver
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-telemetrystore-migrator
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000

deploy/docker/docker-compose.yaml

@@ -109,7 +109,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.112.1}
+    image: signoz/signoz:${VERSION:-v0.113.0}
     container_name: signoz
     ports:
       - "8080:8080" # signoz port
@@ -132,7 +132,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.1}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-otel-collector
     entrypoint:
       - /bin/sh
@@ -157,7 +157,7 @@ services:
       - "4318:4318" # OTLP HTTP receiver
   signoz-telemetrystore-migrator:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.142.0}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.144.1}
     container_name: signoz-telemetrystore-migrator
     environment:
       - SIGNOZ_OTEL_COLLECTOR_CLICKHOUSE_DSN=tcp://clickhouse:9000

frontend/src/components/LogDetail/index.tsx

@@ -86,8 +86,13 @@ function LogDetailInner({
 		const handleClickOutside = (e: MouseEvent): void => {
 			const target = e.target as HTMLElement;
 
-			// Don't close if clicking on explicitly ignored regions
-			if (target.closest('[data-log-detail-ignore="true"]')) {
+			// Don't close if clicking on drawer content, overlays, or portal elements
+			if (
+				target.closest('[data-log-detail-ignore="true"]') ||
+				target.closest('.cm-tooltip-autocomplete') ||
+				target.closest('.drawer-popover') ||
+				target.closest('.query-status-popover')
+			) {
 				return;
 			}
 
@@ -400,7 +405,11 @@ function LogDetailInner({
 			<div className="log-detail-drawer__content" data-log-detail-ignore="true">
 				<div className="log-detail-drawer__log">
 					<Divider type="vertical" className={cx('log-type-indicator', logType)} />
-					<Tooltip title={removeEscapeCharacters(log?.body)} placement="left">
+					<Tooltip
+						title={removeEscapeCharacters(log?.body)}
+						placement="left"
+						mouseLeaveDelay={0}
+					>
 						<div className="log-body" dangerouslySetInnerHTML={htmlBody} />
 					</Tooltip>
 
@@ -466,6 +475,7 @@ function LogDetailInner({
 								title="Show Filters"
 								placement="topLeft"
 								aria-label="Show Filters"
+								mouseLeaveDelay={0}
 							>
 								<Button
 									className="action-btn"
@@ -481,6 +491,7 @@ function LogDetailInner({
 							aria-label={
 								selectedView === VIEW_TYPES.JSON ? 'Copy JSON' : 'Copy Log Link'
 							}
+							mouseLeaveDelay={0}
 						>
 							<Button
 								className="action-btn"

frontend/src/components/Logs/AddToQueryHOC.tsx

@@ -27,7 +27,11 @@ function AddToQueryHOC({
 	return (
 		// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
 		<div className={cx('addToQueryContainer', fontSize)} onClick={handleQueryAdd}>
-			<Popover placement="top" content={popOverContent}>
+			<Popover
+				overlayClassName="drawer-popover"
+				placement="top"
+				content={popOverContent}
+			>
 				{children}
 			</Popover>
 		</div>

frontend/src/components/Logs/CopyClipboardHOC.tsx

@@ -32,6 +32,7 @@ function CopyClipboardHOC({
 		<span onClick={onClick} role="presentation" tabIndex={-1}>
 			<Popover
 				placement="top"
+				overlayClassName="drawer-popover"
 				content={<span style={{ fontSize: '0.9rem' }}>{tooltipText}</span>}
 			>
 				{children}

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

@@ -1328,7 +1328,10 @@ function QuerySearch({
 			)}
 
 			<div className="query-where-clause-editor-container">
-				<Tooltip title={getTooltipContent()} placement="left">
+				<Tooltip
+					title={<div data-log-detail-ignore="true">{getTooltipContent()}</div>}
+					placement="left"
+				>
 					<a
 						href="https://signoz.io/docs/userguide/search-syntax/"
 						target="_blank"

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

@@ -1,18 +1,10 @@
 /* eslint-disable sonarjs/no-identical-functions */
 import { MemoryRouter, useLocation } from 'react-router-dom';
-import ROUTES from 'constants/routes';
-import { DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY } from 'hooks/dashboard/useDashboardsListQueryParams';
 import { getNonIntegrationDashboardById } from 'mocks-server/__mockdata__/dashboards';
 import { server } from 'mocks-server/server';
 import { rest } from 'msw';
 import { DashboardProvider } from 'providers/Dashboard/Dashboard';
-import {
-	fireEvent,
-	render,
-	screen,
-	userEvent,
-	waitFor,
-} from 'tests/test-utils';
+import { fireEvent, render, screen, waitFor } from 'tests/test-utils';
 
 import DashboardDescription from '..';
 
@@ -25,7 +17,6 @@ const DASHBOARD_TITLE_TEXT = 'thor';
 const DASHBOARD_PATH = '/dashboard/4';
 
 const mockSafeNavigate = jest.fn();
-const mockNavigate = jest.fn();
 
 jest.mock('react-router-dom', () => ({
 	...jest.requireActual('react-router-dom'),
@@ -37,11 +28,6 @@ jest.mock('react-router-dom', () => ({
 	}),
 }));
 
-jest.mock('react-router-dom-v5-compat', () => ({
-	...jest.requireActual('react-router-dom-v5-compat'),
-	useNavigate: (): jest.Mock => mockNavigate,
-}));
-
 jest.mock(
 	'container/TopNav/DateTimeSelectionV2/index.tsx',
 	() =>
@@ -59,8 +45,6 @@ jest.mock('hooks/useSafeNavigate', () => ({
 describe('Dashboard landing page actions header tests', () => {
 	beforeEach(() => {
 		mockSafeNavigate.mockClear();
-		mockNavigate.mockClear();
-		sessionStorage.clear();
 	});
 
 	it('unlock dashboard should be disabled for integrations created dashboards', async () => {
@@ -140,26 +124,17 @@ describe('Dashboard landing page actions header tests', () => {
 		await waitFor(() => expect(lockUnlockButton).not.toBeDisabled());
 	});
 
-	it('should navigate to the dashboard list with stored query params when clicking the dashboard breadcrumb', async () => {
-		const storedParams = JSON.stringify({
-			columnKey: 'createdAt',
-			order: 'ascend',
-			page: '2',
-			search: 'test',
-		});
-		sessionStorage.setItem(
-			DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY,
-			storedParams,
-		);
-
+	it('should navigate to dashboard list with correct params and exclude variables', async () => {
+		const dashboardUrlWithVariables = `${DASHBOARD_PATH}?variables=%7B%22var1%22%3A%22value1%22%7D&otherParam=test`;
 		const mockLocation = {
 			pathname: DASHBOARD_PATH,
-			search: '',
+			search: '?variables=%7B%22var1%22%3A%22value1%22%7D&otherParam=test',
 		};
+
 		(useLocation as jest.Mock).mockReturnValue(mockLocation);
 
 		const { getByText } = render(
-			<MemoryRouter initialEntries={[DASHBOARD_PATH]}>
+			<MemoryRouter initialEntries={[dashboardUrlWithVariables]}>
 				<DashboardProvider>
 					<DashboardDescription
 						handle={{
@@ -179,49 +154,27 @@ describe('Dashboard landing page actions header tests', () => {
 			),
 		);
 
+		// Click the dashboard breadcrumb to navigate back to list
 		const dashboardButton = getByText('Dashboard /');
-		await userEvent.click(dashboardButton);
+		fireEvent.click(dashboardButton);
 
-		expect(mockSafeNavigate).toHaveBeenCalledWith({
-			pathname: ROUTES.ALL_DASHBOARD,
-			search: `?${storedParams}`,
-		});
-		expect(mockNavigate).not.toHaveBeenCalled();
-	});
-
-	it('should navigate to dashboard list page when there are no stored query params', async () => {
-		const mockLocation = {
-			pathname: DASHBOARD_PATH,
-			search: '',
-		};
-
-		(useLocation as jest.Mock).mockReturnValue(mockLocation);
-
-		const { getByText } = render(
-			<MemoryRouter initialEntries={[DASHBOARD_PATH]}>
-				<DashboardProvider>
-					<DashboardDescription
-						handle={{
-							active: false,
-							enter: (): Promise<void> => Promise.resolve(),
-							exit: (): Promise<void> => Promise.resolve(),
-							node: { current: null },
-						}}
-					/>
-				</DashboardProvider>
-			</MemoryRouter>,
+		// Verify navigation was called with correct URL
+		expect(mockSafeNavigate).toHaveBeenCalledWith(
+			'/dashboard?columnKey=updatedAt&order=descend&page=1&search=',
 		);
 
-		await waitFor(() =>
-			expect(screen.getByTestId(DASHBOARD_TEST_ID)).toHaveTextContent(
-				DASHBOARD_TITLE_TEXT,
-			),
-		);
+		// Ensure the URL contains only essential dashboard list params
+		const calledUrl = mockSafeNavigate.mock.calls[0][0] as string;
+		const urlParams = new URLSearchParams(calledUrl.split('?')[1]);
 
-		const dashboardButton = getByText('Dashboard /');
-		await userEvent.click(dashboardButton);
+		// Should have essential dashboard list params
+		expect(urlParams.get('columnKey')).toBe('updatedAt');
+		expect(urlParams.get('order')).toBe('descend');
+		expect(urlParams.get('page')).toBe('1');
+		expect(urlParams.get('search')).toBe('');
 
-		expect(mockSafeNavigate).toHaveBeenCalledWith(ROUTES.ALL_DASHBOARD);
-		expect(mockNavigate).not.toHaveBeenCalled();
+		// Should NOT have variables or other dashboard-specific params
+		expect(urlParams.has('variables')).toBeFalsy();
+		expect(urlParams.has('relativeTime')).toBeFalsy();
 	});
 });

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

@@ -1,7 +1,6 @@
 import { useCallback } from 'react';
 import { Button } from 'antd';
 import ROUTES from 'constants/routes';
-import { DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY } from 'hooks/dashboard/useDashboardsListQueryParams';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import { LayoutGrid } from 'lucide-react';
 import { useDashboard } from 'providers/Dashboard/Dashboard';
@@ -13,7 +12,7 @@ import './DashboardBreadcrumbs.styles.scss';
 
 function DashboardBreadcrumbs(): JSX.Element {
 	const { safeNavigate } = useSafeNavigate();
-	const { selectedDashboard } = useDashboard();
+	const { selectedDashboard, listSortOrder } = useDashboard();
 
 	const selectedData = selectedDashboard
 		? {
@@ -25,24 +24,15 @@ function DashboardBreadcrumbs(): JSX.Element {
 	const { title = '', image = Base64Icons[0] } = selectedData || {};
 
 	const goToListPage = useCallback(() => {
-		const dashboardsListQueryParamsObject = sessionStorage.getItem(
-			DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY,
-		);
+		const urlParams = new URLSearchParams();
+		urlParams.set('columnKey', listSortOrder.columnKey as string);
+		urlParams.set('order', listSortOrder.order as string);
+		urlParams.set('page', listSortOrder.pagination as string);
+		urlParams.set('search', listSortOrder.search as string);
 
-		if (dashboardsListQueryParamsObject) {
-			const queryParamsString = Object.entries(
-				JSON.parse(dashboardsListQueryParamsObject),
-			)
-				.map(([key, value]) => `${key}=${value}`)
-				.join('&');
-			safeNavigate({
-				pathname: ROUTES.ALL_DASHBOARD,
-				search: `?${queryParamsString}`,
-			});
-		} else {
-			safeNavigate(ROUTES.ALL_DASHBOARD);
-		}
-	}, [safeNavigate]);
+		const generatedUrl = `${ROUTES.ALL_DASHBOARD}?${urlParams.toString()}`;
+		safeNavigate(generatedUrl);
+	}, [listSortOrder, safeNavigate]);
 
 	return (
 		<div className="dashboard-breadcrumbs">

frontend/src/container/DashboardContainer/index.tsx

@@ -1,19 +1,10 @@
-import { useEffect } from 'react';
 import { useFullScreenHandle } from 'react-full-screen';
-import { DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY } from 'hooks/dashboard/useDashboardsListQueryParams';
 
 import Description from './DashboardDescription';
 import GridGraphs from './GridGraphs';
 
 function DashboardContainer(): JSX.Element {
 	const handle = useFullScreenHandle();
-
-	useEffect(() => {
-		return (): void => {
-			sessionStorage.removeItem(DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY);
-		};
-	}, []);
-
 	return (
 		<div>
 			<Description handle={handle} />

frontend/src/container/ListOfDashboard/DashboardsList.tsx

@@ -45,7 +45,6 @@ import {
 } from 'container/DashboardContainer/DashboardDescription/utils';
 import { Base64Icons } from 'container/DashboardContainer/DashboardSettings/General/utils';
 import dayjs from 'dayjs';
-import useDashboardsListQueryParams from 'hooks/dashboard/useDashboardsListQueryParams';
 import { useGetAllDashboard } from 'hooks/dashboard/useGetAllDashboard';
 import useComponentPermission from 'hooks/useComponentPermission';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
@@ -77,6 +76,7 @@ import {
 // see more: https://github.com/lucide-icons/lucide/issues/94
 import { handleContactSupport } from 'pages/Integrations/utils';
 import { useAppContext } from 'providers/App/App';
+import { useDashboard } from 'providers/Dashboard/Dashboard';
 import { useErrorModal } from 'providers/ErrorModalProvider';
 import { useTimezone } from 'providers/Timezone';
 import {
@@ -104,7 +104,7 @@ function DashboardsList(): JSX.Element {
 	const {
 		data: dashboardListResponse,
 		isLoading: isDashboardListLoading,
-		isFetching: isDashboardListFetching,
+		isRefetching: isDashboardListRefetching,
 		error: dashboardFetchError,
 		refetch: refetchDashboardList,
 	} = useGetAllDashboard();
@@ -112,14 +112,14 @@ function DashboardsList(): JSX.Element {
 	const { user } = useAppContext();
 	const { safeNavigate } = useSafeNavigate();
 	const {
-		dashboardsListQueryParams,
-		updateDashboardsListQueryParams,
-	} = useDashboardsListQueryParams();
+		listSortOrder: sortOrder,
+		setListSortOrder: setSortOrder,
+	} = useDashboard();
 
 	const { isCloudUser: isCloudUserVal } = useGetTenantLicense();
 
 	const [searchString, setSearchString] = useState<string>(
-		dashboardsListQueryParams.search || '',
+		sortOrder.search || '',
 	);
 	const [action, createNewDashboard] = useComponentPermission(
 		['action', 'create_new_dashboards'],
@@ -139,6 +139,7 @@ function DashboardsList(): JSX.Element {
 	] = useState<boolean>(false);
 
 	const [uploadedGrafana, setUploadedGrafana] = useState<boolean>(false);
+	const [isFilteringDashboards, setIsFilteringDashboards] = useState(false);
 	const [isConfigureMetadataOpen, setIsConfigureMetadata] = useState<boolean>(
 		false,
 	);
@@ -186,41 +187,76 @@ function DashboardsList(): JSX.Element {
 		}
 	}
 
-	const dashboards = useMemo((): Dashboard[] => {
-		const filtered = filterDashboard(
-			searchString,
-			dashboardListResponse?.data || [],
+	const [dashboards, setDashboards] = useState<Dashboard[]>();
+
+	const sortDashboardsByCreatedAt = (dashboards: Dashboard[]): void => {
+		const sortedDashboards = dashboards.sort(
+			(a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(),
 		);
-		if (dashboardsListQueryParams.columnKey === 'createdAt') {
-			return filtered.sort(
-				(a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(),
-			);
-		}
-		return filtered.sort(
+		setDashboards(sortedDashboards);
+	};
+
+	const sortDashboardsByUpdatedAt = (dashboards: Dashboard[]): void => {
+		const sortedDashboards = dashboards.sort(
 			(a, b) => new Date(b.updatedAt).getTime() - new Date(a.updatedAt).getTime(),
 		);
-	}, [
-		dashboardListResponse?.data,
-		searchString,
-		dashboardsListQueryParams.columnKey,
-	]);
+		setDashboards(sortedDashboards);
+	};
 
 	const sortHandle = (key: string): void => {
-		updateDashboardsListQueryParams({
-			columnKey: key,
-			order: 'descend',
-			page: dashboardsListQueryParams.page || '1',
-			search: dashboardsListQueryParams.search || '',
-		});
+		if (!dashboards) {
+			return;
+		}
+		if (key === 'createdAt') {
+			sortDashboardsByCreatedAt(dashboards);
+			setSortOrder({
+				columnKey: 'createdAt',
+				order: 'descend',
+				pagination: sortOrder.pagination || '1',
+				search: sortOrder.search || '',
+			});
+		} else if (key === 'updatedAt') {
+			sortDashboardsByUpdatedAt(dashboards);
+			setSortOrder({
+				columnKey: 'updatedAt',
+				order: 'descend',
+				pagination: sortOrder.pagination || '1',
+				search: sortOrder.search || '',
+			});
+		}
 	};
 
 	function handlePageSizeUpdate(page: number): void {
-		updateDashboardsListQueryParams({
-			...dashboardsListQueryParams,
-			page: String(page),
-		});
+		setSortOrder({ ...sortOrder, pagination: String(page) });
 	}
 
+	useEffect(() => {
+		const filteredDashboards = filterDashboard(
+			searchString,
+			dashboardListResponse?.data || [],
+		);
+		if (sortOrder.columnKey === 'updatedAt') {
+			sortDashboardsByUpdatedAt(filteredDashboards || []);
+		} else if (sortOrder.columnKey === 'createdAt') {
+			sortDashboardsByCreatedAt(filteredDashboards || []);
+		} else if (sortOrder.columnKey === 'null') {
+			setSortOrder({
+				columnKey: 'updatedAt',
+				order: 'descend',
+				pagination: sortOrder.pagination || '1',
+				search: sortOrder.search || '',
+			});
+			sortDashboardsByUpdatedAt(filteredDashboards || []);
+		}
+	}, [
+		dashboardListResponse,
+		searchString,
+		setSortOrder,
+		sortOrder.columnKey,
+		sortOrder.pagination,
+		sortOrder.search,
+	]);
+
 	const [newDashboardState, setNewDashboardState] = useState({
 		loading: false,
 		error: false,
@@ -229,25 +265,26 @@ function DashboardsList(): JSX.Element {
 
 	const { showErrorModal } = useErrorModal();
 
-	const data: Data[] = dashboards.map((e) => ({
-		createdAt: e.createdAt,
-		description: e.data.description || '',
-		id: e.id,
-		lastUpdatedTime: e.updatedAt,
-		name: e.data.title,
-		tags: e.data.tags || [],
-		key: e.id,
-		createdBy: e.createdBy,
-		isLocked: !!e.locked || false,
-		lastUpdatedBy: e.updatedBy,
-		image: e.data.image || Base64Icons[0],
-		variables: e.data.variables,
-		widgets: e.data.widgets,
-		layout: e.data.layout,
-		panelMap: e.data.panelMap,
-		version: e.data.version,
-		refetchDashboardList,
-	}));
+	const data: Data[] =
+		dashboards?.map((e) => ({
+			createdAt: e.createdAt,
+			description: e.data.description || '',
+			id: e.id,
+			lastUpdatedTime: e.updatedAt,
+			name: e.data.title,
+			tags: e.data.tags || [],
+			key: e.id,
+			createdBy: e.createdBy,
+			isLocked: !!e.locked || false,
+			lastUpdatedBy: e.updatedBy,
+			image: e.data.image || Base64Icons[0],
+			variables: e.data.variables,
+			widgets: e.data.widgets,
+			layout: e.data.layout,
+			panelMap: e.data.panelMap,
+			version: e.data.version,
+			refetchDashboardList,
+		})) || [];
 
 	const onNewDashboardHandler = useCallback(async () => {
 		try {
@@ -287,12 +324,16 @@ function DashboardsList(): JSX.Element {
 	};
 
 	const handleSearch = (event: ChangeEvent<HTMLInputElement>): void => {
+		setIsFilteringDashboards(true);
 		const searchText = (event as React.BaseSyntheticEvent)?.target?.value || '';
+		const filteredDashboards = filterDashboard(
+			searchText,
+			dashboardListResponse?.data || [],
+		);
+		setDashboards(filteredDashboards);
+		setIsFilteringDashboards(false);
 		setSearchString(searchText);
-		updateDashboardsListQueryParams({
-			...dashboardsListQueryParams,
-			search: searchText,
-		});
+		setSortOrder({ ...sortOrder, search: searchText });
 	};
 
 	const [state, setCopy] = useCopyToClipboard();
@@ -630,8 +671,8 @@ function DashboardsList(): JSX.Element {
 		showTotal: showPaginationItem,
 		showSizeChanger: false,
 		onChange: (page: any): void => handlePageSizeUpdate(page),
-		current: Number(dashboardsListQueryParams.page),
-		defaultCurrent: Number(dashboardsListQueryParams.page) || 1,
+		current: Number(sortOrder.pagination),
+		defaultCurrent: Number(sortOrder.pagination) || 1,
 		hideOnSinglePage: true,
 	};
 
@@ -669,7 +710,9 @@ function DashboardsList(): JSX.Element {
 					)}
 				</div>
 
-				{isDashboardListFetching ? (
+				{isDashboardListLoading ||
+				isFilteringDashboards ||
+				isDashboardListRefetching ? (
 					<div className="loading-dashboard-details">
 						<Skeleton.Input active size="large" className="skeleton-1" />
 						<Skeleton.Input active size="large" className="skeleton-1" />
@@ -706,7 +749,7 @@ function DashboardsList(): JSX.Element {
 							<ArrowUpRight size={16} className="learn-more-arrow" />
 						</section>
 					</div>
-				) : dashboards.length === 0 && !searchString ? (
+				) : dashboards?.length === 0 && !searchString ? (
 					<div className="dashboard-empty-state">
 						<img
 							src="/Icons/dashboards.svg"
@@ -788,7 +831,7 @@ function DashboardsList(): JSX.Element {
 							)}
 						</div>
 
-						{dashboards.length === 0 ? (
+						{dashboards?.length === 0 ? (
 							<div className="no-search">
 								<img src="/Icons/emptyState.svg" alt="img" className="img" />
 								<Typography.Text className="text">
@@ -817,9 +860,7 @@ function DashboardsList(): JSX.Element {
 															data-testid="sort-by-last-created"
 														>
 															Last created
-															{dashboardsListQueryParams.columnKey === 'createdAt' && (
-																<Check size={14} />
-															)}
+															{sortOrder.columnKey === 'createdAt' && <Check size={14} />}
 														</Button>
 														<Button
 															type="text"
@@ -828,9 +869,7 @@ function DashboardsList(): JSX.Element {
 															data-testid="sort-by-last-updated"
 														>
 															Last updated
-															{dashboardsListQueryParams.columnKey === 'updatedAt' && (
-																<Check size={14} />
-															)}
+															{sortOrder.columnKey === 'updatedAt' && <Check size={14} />}
 														</Button>
 													</div>
 												}
@@ -872,7 +911,11 @@ function DashboardsList(): JSX.Element {
 									columns={columns}
 									dataSource={data}
 									showSorterTooltip
-									loading={isDashboardListFetching}
+									loading={
+										isDashboardListLoading ||
+										isFilteringDashboards ||
+										isDashboardListRefetching
+									}
 									showHeader={false}
 									pagination={paginationConfig}
 								/>
@@ -921,12 +964,12 @@ function DashboardsList(): JSX.Element {
 						<div className="configure-preview">
 							<section className="header">
 								<img
-									src={dashboards[0]?.data?.image || Base64Icons[0]}
+									src={dashboards?.[0]?.data?.image || Base64Icons[0]}
 									alt="dashboard-image"
 									style={{ height: '14px', width: '14px' }}
 								/>
 								<Typography.Text className="title">
-									{dashboards[0]?.data?.title}
+									{dashboards?.[0]?.data?.title}
 								</Typography.Text>
 							</section>
 							<section className="details">
@@ -934,16 +977,16 @@ function DashboardsList(): JSX.Element {
 									{visibleColumns.createdAt && (
 										<Typography.Text className="formatted-time">
 											<CalendarClock size={14} />
-											{getFormattedTime(dashboards[0] as Dashboard, 'created_at')}
+											{getFormattedTime(dashboards?.[0] as Dashboard, 'created_at')}
 										</Typography.Text>
 									)}
 									{visibleColumns.createdBy && (
 										<div className="user">
 											<Typography.Text className="user-tag">
-												{dashboards[0]?.createdBy?.substring(0, 1).toUpperCase()}
+												{dashboards?.[0]?.createdBy?.substring(0, 1).toUpperCase()}
 											</Typography.Text>
 											<Typography.Text className="dashboard-created-by">
-												{dashboards[0]?.createdBy}
+												{dashboards?.[0]?.createdBy}
 											</Typography.Text>
 										</div>
 									)}
@@ -952,16 +995,16 @@ function DashboardsList(): JSX.Element {
 									{visibleColumns.updatedAt && (
 										<Typography.Text className="formatted-time">
 											<CalendarClock size={14} />
-											{onLastUpdated(dashboards[0]?.updatedAt || '')}
+											{onLastUpdated(dashboards?.[0]?.updatedAt || '')}
 										</Typography.Text>
 									)}
 									{visibleColumns.updatedBy && (
 										<div className="user">
 											<Typography.Text className="user-tag">
-												{dashboards[0]?.updatedBy?.substring(0, 1).toUpperCase()}
+												{dashboards?.[0]?.updatedBy?.substring(0, 1).toUpperCase()}
 											</Typography.Text>
 											<Typography.Text className="dashboard-created-by">
-												{dashboards[0]?.updatedBy}
+												{dashboards?.[0]?.updatedBy}
 											</Typography.Text>
 										</div>
 									)}

frontend/src/container/LogDetailedView/BodyTitleRenderer.tsx

@@ -121,9 +121,23 @@ function BodyTitleRenderer({
 	return (
 		<TitleWrapper onClick={handleNodeClick}>
 			{typeof value !== 'object' && (
-				<Dropdown menu={menu} trigger={['click']}>
-					<SettingOutlined style={{ marginRight: 8 }} className="hover-reveal" />
-				</Dropdown>
+				<span
+					onClick={(e): void => {
+						e.stopPropagation();
+						e.preventDefault();
+					}}
+					onMouseDown={(e): void => e.preventDefault()}
+				>
+					<Dropdown
+						menu={menu}
+						trigger={['click']}
+						dropdownRender={(originNode): React.ReactNode => (
+							<div data-log-detail-ignore="true">{originNode}</div>
+						)}
+					>
+						<SettingOutlined style={{ marginRight: 8 }} className="hover-reveal" />
+					</Dropdown>
+				</span>
 			)}
 			{title.toString()}{' '}
 			{!parentIsArray && typeof value !== 'object' && (

frontend/src/container/LogDetailedView/FieldRenderer.tsx

@@ -13,7 +13,7 @@ function FieldRenderer({ field }: FieldRendererProps): JSX.Element {
 		<span className="field-renderer-container">
 			{dataType && newField && logType ? (
 				<>
-					<Tooltip placement="left" title={newField}>
+					<Tooltip placement="left" title={newField} mouseLeaveDelay={0}>
 						<Typography.Text ellipsis className="label">
 							{newField}{' '}
 						</Typography.Text>

frontend/src/container/LogDetailedView/Overview.tsx

@@ -1,7 +1,6 @@
-import { ReactNode, useCallback, useEffect, useRef, useState } from 'react';
+import { ReactNode, useState } from 'react';
 import MEditor, { EditorProps, Monaco } from '@monaco-editor/react';
 import { Color } from '@signozhq/design-tokens';
-import type { InputRef } from 'antd';
 import {
 	Button,
 	Collapse,
@@ -53,17 +52,6 @@ function Overview({
 	);
 	const [fieldSearchInput, setFieldSearchInput] = useState<string>('');
 
-	const focusTimerRef = useRef<ReturnType<typeof setTimeout>>();
-
-	const searchInputRef = useCallback((node: InputRef | null) => {
-		clearTimeout(focusTimerRef.current);
-		if (node) {
-			focusTimerRef.current = setTimeout(() => node.focus(), 100);
-		}
-	}, []);
-
-	useEffect(() => (): void => clearTimeout(focusTimerRef.current), []);
-
 	const isDarkMode = useIsDarkMode();
 
 	const options: EditorProps['options'] = {
@@ -208,7 +196,7 @@ function Overview({
 							<>
 								{isSearchVisible && (
 									<Input
-										ref={searchInputRef}
+										autoFocus
 										placeholder="Search for a field..."
 										className="search-input"
 										value={fieldSearchInput}

frontend/src/container/LogDetailedView/TableView.tsx

@@ -245,7 +245,7 @@ function TableView({
 							<Typography.Text>{renderedField}</Typography.Text>
 
 							{traceId && (
-								<Tooltip title="Inspect in Trace">
+								<Tooltip title="Inspect in Trace" mouseLeaveDelay={0}>
 									<Button
 										className="periscope-btn"
 										onClick={(

frontend/src/container/LogsExplorerList/InfinityTableView/index.tsx

@@ -139,8 +139,7 @@ const InfinityTable = forwardRef<TableVirtuosoHandle, InfinityTableProps>(
 					{tableColumns
 						.filter((column) => column.key)
 						.map((column) => {
-							const isDragColumn =
-								column.key !== 'expand' && column.key !== 'state-indicator';
+							const isDragColumn = column.key !== 'expand';
 
 							return (
 								<TableHeaderCellStyled

frontend/src/container/PipelinePage/PipelineListsView/AddNewPipeline/FormFields/FilterInput/index.tsx

@@ -1,7 +1,7 @@
 import { useTranslation } from 'react-i18next';
 import { Form } from 'antd';
 import { initialQueryBuilderFormValuesMap } from 'constants/queryBuilder';
-import QueryBuilderSearch from 'container/QueryBuilder/filters/QueryBuilderSearch';
+import QueryBuilderSearchV2 from 'container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2';
 import isEqual from 'lodash-es/isEqual';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
@@ -30,7 +30,7 @@ function TagFilterInput({
 	};
 
 	return (
-		<QueryBuilderSearch
+		<QueryBuilderSearchV2
 			query={query}
 			onChange={onQueryChange}
 			placeholder={placeholder}

frontend/src/container/PipelinePage/tests/PipelineListsView.test.tsx

@@ -86,7 +86,7 @@ jest.mock('providers/preferences/sync/usePreferenceSync', () => ({
 }));
 
 const BASE_URL = ENVIRONMENT.baseURL;
-const attributeKeysURL = `${BASE_URL}/api/v3/autocomplete/attribute_keys`;
+const attributeKeysURL = `${BASE_URL}/api/v3/filter_suggestions`;
 
 describe('PipelinePage container test', () => {
 	beforeAll(() => {
@@ -333,26 +333,34 @@ describe('PipelinePage container test', () => {
 					ctx.json({
 						status: 'success',
 						data: {
-							attributeKeys: [
+							attributes: [
 								{
 									key: 'otelServiceName',
 									dataType: DataTypes.String,
 									type: 'tag',
+									isColumn: false,
+									isJSON: false,
+								},
+								{
+									key: 'service.name',
+									dataType: DataTypes.String,
+									type: 'resource',
+									isColumn: false,
+									isJSON: false,
 								},
 								{
 									key: 'service.instance.id',
 									dataType: DataTypes.String,
 									type: 'resource',
-								},
-								{
-									key: 'service.name',
-									dataType: DataTypes.String,
-									type: 'resource',
+									isColumn: false,
+									isJSON: false,
 								},
 								{
 									key: 'service.name',
 									dataType: DataTypes.String,
 									type: 'tag',
+									isColumn: false,
+									isJSON: false,
 								},
 							],
 						},

frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.tsx

@@ -973,6 +973,7 @@ function QueryBuilderSearchV2(
 	return (
 		<div className="query-builder-search-v2">
 			<Select
+				data-testid={'qb-search-select'}
 				ref={selectRef}
 				// eslint-disable-next-line react/jsx-props-no-spreading
 				{...(hasPopupContainer ? { getPopupContainer: popupContainer } : {})}

frontend/src/hooks/dashboard/__test__/useDashboardsListQueryParams.test.ts

@@ -1,198 +0,0 @@
-import React from 'react';
-import { MemoryRouter } from 'react-router-dom';
-import { act, renderHook } from '@testing-library/react';
-
-import useDashboardsListQueryParams, {
-	DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY,
-	IDashboardsListQueryParams,
-} from '../useDashboardsListQueryParams';
-
-const mockSafeNavigate = jest.fn();
-
-jest.mock('hooks/useSafeNavigate', () => ({
-	useSafeNavigate: (): { safeNavigate: jest.Mock } => ({
-		safeNavigate: mockSafeNavigate,
-	}),
-}));
-
-function makeWrapper(
-	initialUrl: string,
-): ({ children }: { children: React.ReactNode }) => JSX.Element {
-	return function Wrapper({
-		children,
-	}: {
-		children: React.ReactNode;
-	}): JSX.Element {
-		return React.createElement(
-			MemoryRouter,
-			{ initialEntries: [initialUrl] },
-			children,
-		) as JSX.Element;
-	};
-}
-
-describe('useDashboardsListQueryParams', () => {
-	beforeEach(() => {
-		mockSafeNavigate.mockClear();
-		sessionStorage.clear();
-	});
-
-	describe('initialisation from URL params', () => {
-		it('returns default params when no URL query params are present', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			expect(result.current.dashboardsListQueryParams).toEqual({
-				columnKey: 'updatedAt',
-				order: 'descend',
-				page: '1',
-				search: '',
-			});
-		});
-
-		it('reads valid columnKey, order, page and search from the URL', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper(
-					'/dashboard?columnKey=createdAt&order=ascend&page=3&search=foo',
-				),
-			});
-
-			expect(result.current.dashboardsListQueryParams).toEqual({
-				columnKey: 'createdAt',
-				order: 'ascend',
-				page: '3',
-				search: 'foo',
-			});
-		});
-
-		it('falls back to updatedAt for an unsupported columnKey', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard?columnKey=name&order=ascend'),
-			});
-
-			expect(result.current.dashboardsListQueryParams.columnKey).toBe('updatedAt');
-		});
-
-		it('falls back to descend for an unsupported order', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard?columnKey=createdAt&order=invalid'),
-			});
-
-			expect(result.current.dashboardsListQueryParams.order).toBe('descend');
-		});
-
-		it('defaults page to 1 when page param is absent', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			expect(result.current.dashboardsListQueryParams.page).toBe('1');
-		});
-
-		it('defaults search to empty string when search param is absent', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			expect(result.current.dashboardsListQueryParams.search).toBe('');
-		});
-	});
-
-	describe('updateDashboardsListQueryParams', () => {
-		it('updates the state when params change', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			const updated: IDashboardsListQueryParams = {
-				columnKey: 'createdAt',
-				order: 'ascend',
-				page: '2',
-				search: 'signoz',
-			};
-
-			act(() => {
-				result.current.updateDashboardsListQueryParams(updated);
-			});
-
-			expect(result.current.dashboardsListQueryParams).toEqual(updated);
-		});
-
-		it('does not update state when params are identical', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			const initial = result.current.dashboardsListQueryParams;
-
-			act(() => {
-				result.current.updateDashboardsListQueryParams({ ...initial });
-			});
-
-			// Reference equality confirms no re-render-triggering state update.
-			expect(result.current.dashboardsListQueryParams).toBe(initial);
-		});
-
-		it('calls safeNavigate with the updated search string', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			const updated: IDashboardsListQueryParams = {
-				columnKey: 'createdAt',
-				order: 'ascend',
-				page: '2',
-				search: 'test',
-			};
-
-			act(() => {
-				result.current.updateDashboardsListQueryParams(updated);
-			});
-
-			expect(mockSafeNavigate).toHaveBeenCalledTimes(1);
-			const [navigateArg] = mockSafeNavigate.mock.calls[0];
-			const searchParams = new URLSearchParams(navigateArg.search);
-			expect(searchParams.get('columnKey')).toBe('createdAt');
-			expect(searchParams.get('order')).toBe('ascend');
-			expect(searchParams.get('page')).toBe('2');
-			expect(searchParams.get('search')).toBe('test');
-		});
-
-		it('persists params to sessionStorage', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			const updated: IDashboardsListQueryParams = {
-				columnKey: 'updatedAt',
-				order: 'descend',
-				page: '1',
-				search: 'signoz',
-			};
-
-			act(() => {
-				result.current.updateDashboardsListQueryParams(updated);
-			});
-
-			const stored = sessionStorage.getItem(
-				DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY,
-			);
-			expect(JSON.parse(stored || '')).toEqual(updated);
-		});
-
-		it('still calls safeNavigate even when params are unchanged', () => {
-			const { result } = renderHook(() => useDashboardsListQueryParams(), {
-				wrapper: makeWrapper('/dashboard'),
-			});
-
-			const initial = result.current.dashboardsListQueryParams;
-
-			act(() => {
-				result.current.updateDashboardsListQueryParams({ ...initial });
-			});
-
-			expect(mockSafeNavigate).toHaveBeenCalledTimes(1);
-		});
-	});
-});

frontend/src/hooks/dashboard/useDashboardsListQueryParams.ts

@@ -1,72 +0,0 @@
-import { useState } from 'react';
-import { useSafeNavigate } from 'hooks/useSafeNavigate';
-import useUrlQuery from 'hooks/useUrlQuery';
-import isEqual from 'lodash-es/isEqual';
-
-export interface IDashboardsListQueryParams {
-	columnKey: string;
-	order: string;
-	page: string;
-	search: string;
-}
-
-export const DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY =
-	'dashboardsListQueryParams';
-
-const SUPPORTED_COLUMN_KEYS = ['createdAt', 'updatedAt'];
-const SUPPORTED_ORDER_KEYS = ['ascend', 'descend'];
-
-function useDashboardsListQueryParams(): {
-	dashboardsListQueryParams: IDashboardsListQueryParams;
-	updateDashboardsListQueryParams: (
-		dashboardsListQueryParams: IDashboardsListQueryParams,
-	) => void;
-} {
-	const { safeNavigate } = useSafeNavigate();
-	const params = useUrlQuery();
-
-	const orderColumnKeyQueryParam = params.get('columnKey');
-	const orderQueryParam = params.get('order');
-	const pageQueryParam = params.get('page');
-	const searchQueryParam = params.get('search');
-
-	const [
-		dashboardsListQueryParams,
-		setDashboardsListQueryParams,
-	] = useState<IDashboardsListQueryParams>({
-		columnKey:
-			orderColumnKeyQueryParam &&
-			SUPPORTED_COLUMN_KEYS.includes(orderColumnKeyQueryParam)
-				? orderColumnKeyQueryParam
-				: 'updatedAt',
-		order:
-			orderQueryParam && SUPPORTED_ORDER_KEYS.includes(orderQueryParam)
-				? orderQueryParam
-				: 'descend',
-		page: pageQueryParam || '1',
-		search: searchQueryParam || '',
-	});
-
-	function updateDashboardsListQueryParams(
-		updatedQueryParams: IDashboardsListQueryParams,
-	): void {
-		if (!isEqual(updatedQueryParams, dashboardsListQueryParams)) {
-			setDashboardsListQueryParams(updatedQueryParams);
-		}
-
-		params.set('columnKey', updatedQueryParams.columnKey);
-		params.set('order', updatedQueryParams.order);
-		params.set('page', updatedQueryParams.page || '1');
-		params.set('search', updatedQueryParams.search || '');
-
-		safeNavigate({ search: params.toString() });
-		sessionStorage.setItem(
-			DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY,
-			JSON.stringify(updatedQueryParams),
-		);
-	}
-
-	return { dashboardsListQueryParams, updateDashboardsListQueryParams };
-}
-
-export default useDashboardsListQueryParams;

frontend/src/hooks/logs/useActiveLog.ts

@@ -1,15 +1,17 @@
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useQueryClient } from 'react-query';
 import { useDispatch, useSelector } from 'react-redux';
 import { useHistory, useLocation } from 'react-router-dom';
 import { getAggregateKeys } from 'api/queryBuilder/getAttributeKeys';
 import { SOMETHING_WENT_WRONG } from 'constants/api';
+import { QueryParams } from 'constants/query';
 import { OPERATORS, QueryBuilderKeys } from 'constants/queryBuilder';
 import ROUTES from 'constants/routes';
 import { MetricsType } from 'container/MetricsApplication/constant';
 import { getOperatorValue } from 'container/QueryBuilder/filters/QueryBuilderSearch/utils';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useNotifications } from 'hooks/useNotifications';
+import useUrlQuery from 'hooks/useUrlQuery';
 import { getGeneratedFilterQueryString } from 'lib/getGeneratedFilterQueryString';
 import { chooseAutocompleteFromCustomValue } from 'lib/newQueryBuilder/chooseAutocompleteFromCustomValue';
 import { AppState } from 'store/reducers';
@@ -54,6 +56,20 @@ export const useActiveLog = (): UseActiveLog => {
 
 	const [activeLog, setActiveLog] = useState<ILog | null>(null);
 
+	// Close drawer/clear active log when query in URL changes
+	const urlQuery = useUrlQuery();
+	const compositeQuery = urlQuery.get(QueryParams.compositeQuery) ?? '';
+	const prevQueryRef = useRef<string | null>(null);
+	useEffect(() => {
+		if (
+			prevQueryRef.current !== null &&
+			prevQueryRef.current !== compositeQuery
+		) {
+			setActiveLog(null);
+		}
+		prevQueryRef.current = compositeQuery;
+	}, [compositeQuery]);
+
 	const onSetDetailedLogData = useCallback(
 		(logData: ILog) => {
 			dispatch({

frontend/src/providers/Dashboard/Dashboard.tsx

@@ -22,7 +22,9 @@ import ROUTES from 'constants/routes';
 import dayjs, { Dayjs } from 'dayjs';
 import { useDashboardVariablesFromLocalStorage } from 'hooks/dashboard/useDashboardFromLocalStorage';
 import useVariablesFromUrl from 'hooks/dashboard/useVariablesFromUrl';
+import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useTabVisibility from 'hooks/useTabFocus';
+import useUrlQuery from 'hooks/useUrlQuery';
 import { getUpdatedLayout } from 'lib/dashboard/getUpdatedLayout';
 import { getMinMaxForSelectedTime } from 'lib/getMinMax';
 import { defaultTo, isEmpty } from 'lodash-es';
@@ -48,7 +50,11 @@ import {
 	setDashboardVariablesStore,
 	updateDashboardVariablesStore,
 } from './store/dashboardVariables/dashboardVariablesStore';
-import { IDashboardContext, WidgetColumnWidths } from './types';
+import {
+	DashboardSortOrder,
+	IDashboardContext,
+	WidgetColumnWidths,
+} from './types';
 import { sortLayout } from './util';
 
 const DashboardContext = createContext<IDashboardContext>({
@@ -65,7 +71,13 @@ const DashboardContext = createContext<IDashboardContext>({
 	layouts: [],
 	panelMap: {},
 	setPanelMap: () => {},
-
+	listSortOrder: {
+		columnKey: 'createdAt',
+		order: 'descend',
+		pagination: '1',
+		search: '',
+	},
+	setListSortOrder: () => {},
 	setLayouts: () => {},
 	setSelectedDashboard: () => {},
 	updatedTimeRef: {} as React.MutableRefObject<Dayjs | null>,
@@ -89,6 +101,7 @@ interface Props {
 export function DashboardProvider({
 	children,
 }: PropsWithChildren): JSX.Element {
+	const { safeNavigate } = useSafeNavigate();
 	const [isDashboardSliderOpen, setIsDashboardSlider] = useState<boolean>(false);
 
 	const [toScrollWidgetId, setToScrollWidgetId] = useState<string>('');
@@ -109,8 +122,52 @@ export function DashboardProvider({
 		exact: true,
 	});
 
+	const isDashboardListPage = useRouteMatch<Props>({
+		path: ROUTES.ALL_DASHBOARD,
+		exact: true,
+	});
+
 	const { showErrorModal } = useErrorModal();
 
+	// added extra checks here in case wrong values appear use the default values rather than empty dashboards
+	const supportedOrderColumnKeys = ['createdAt', 'updatedAt'];
+
+	const supportedOrderKeys = ['ascend', 'descend'];
+
+	const params = useUrlQuery();
+	// since the dashboard provider is wrapped at the very top of the application hence it initialises these values from other pages as well.
+	// pick the below params from URL only if the user is on the dashboards list page.
+	const orderColumnParam = isDashboardListPage && params.get('columnKey');
+	const orderQueryParam = isDashboardListPage && params.get('order');
+	const paginationParam = isDashboardListPage && params.get('page');
+	const searchParam = isDashboardListPage && params.get('search');
+
+	const [listSortOrder, setListOrder] = useState({
+		columnKey: orderColumnParam
+			? supportedOrderColumnKeys.includes(orderColumnParam)
+				? orderColumnParam
+				: 'updatedAt'
+			: 'updatedAt',
+		order: orderQueryParam
+			? supportedOrderKeys.includes(orderQueryParam)
+				? orderQueryParam
+				: 'descend'
+			: 'descend',
+		pagination: paginationParam || '1',
+		search: searchParam || '',
+	});
+
+	function setListSortOrder(sortOrder: DashboardSortOrder): void {
+		if (!isEqual(sortOrder, listSortOrder)) {
+			setListOrder(sortOrder);
+		}
+		params.set('columnKey', sortOrder.columnKey as string);
+		params.set('order', sortOrder.order as string);
+		params.set('page', sortOrder.pagination || '1');
+		params.set('search', sortOrder.search || '');
+		safeNavigate({ search: params.toString() });
+	}
+
 	const dispatch = useDispatch<Dispatch<AppActions>>();
 
 	const globalTime = useSelector<AppState, GlobalReducer>(
@@ -445,6 +502,8 @@ export function DashboardProvider({
 			selectedDashboard,
 			dashboardId,
 			layouts,
+			listSortOrder,
+			setListSortOrder,
 			panelMap,
 			setLayouts,
 			setPanelMap,
@@ -468,6 +527,8 @@ export function DashboardProvider({
 			selectedDashboard,
 			dashboardId,
 			layouts,
+			listSortOrder,
+			setListSortOrder,
 			panelMap,
 			toScrollWidgetId,
 			updateLocalStorageDashboardVariables,

frontend/src/providers/Dashboard/types.ts

@@ -4,6 +4,13 @@ import dayjs from 'dayjs';
 import { SuccessResponseV2 } from 'types/api';
 import { Dashboard } from 'types/api/dashboard/getAll';
 
+export interface DashboardSortOrder {
+	columnKey: string;
+	order: string;
+	pagination: string;
+	search: string;
+}
+
 export type WidgetColumnWidths = {
 	[widgetId: string]: Record<string, number>;
 };
@@ -19,6 +26,8 @@ export interface IDashboardContext {
 	layouts: Layout[];
 	panelMap: Record<string, { widgets: Layout[]; collapsed: boolean }>;
 	setPanelMap: React.Dispatch<React.SetStateAction<Record<string, any>>>;
+	listSortOrder: DashboardSortOrder;
+	setListSortOrder: (sortOrder: DashboardSortOrder) => void;
 	setLayouts: React.Dispatch<React.SetStateAction<Layout[]>>;
 	setSelectedDashboard: React.Dispatch<
 		React.SetStateAction<Dashboard | undefined>

pkg/modules/promote/implpromote/module.go

@@ -87,7 +87,7 @@ func (m *module) ListPromotedAndIndexedPaths(ctx context.Context) ([]promotetype
 }
 
 func (m *module) listPromotedPaths(ctx context.Context) ([]string, error) {
-	paths, err := m.metadataStore.ListPromotedPaths(ctx)
+	paths, err := m.metadataStore.GetPromotedPaths(ctx)
 	if err != nil {
 		return nil, err
 	}
@@ -142,7 +142,7 @@ func (m *module) PromoteAndIndexPaths(
 		pathsStr = append(pathsStr, path.Path)
 	}
 
-	existingPromotedPaths, err := m.metadataStore.ListPromotedPaths(ctx, pathsStr...)
+	existingPromotedPaths, err := m.metadataStore.GetPromotedPaths(ctx, pathsStr...)
 	if err != nil {
 		return err
 	}

pkg/telemetrymetadata/body_json_metadata.go

@@ -10,7 +10,6 @@ import (
 	"github.com/ClickHouse/clickhouse-go/v2/lib/chcol"
 	schemamigrator "github.com/SigNoz/signoz-otel-collector/cmd/signozschemamigrator/schema_migrator"
 	"github.com/SigNoz/signoz-otel-collector/constants"
-	"github.com/SigNoz/signoz-otel-collector/utils"
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/querybuilder"
 	"github.com/SigNoz/signoz/pkg/telemetrylogs"
@@ -113,7 +112,7 @@ func (t *telemetryMetaStore) buildBodyJSONPaths(ctx context.Context,
 
 	for _, fieldKey := range fieldKeys {
 		promotedKey := strings.Split(fieldKey.Name, telemetrytypes.ArraySep)[0]
-		fieldKey.Materialized = promoted.Contains(promotedKey)
+		fieldKey.Materialized = promoted[promotedKey]
 		fieldKey.Indexes = indexes[fieldKey.Name]
 	}
 
@@ -295,33 +294,6 @@ func (t *telemetryMetaStore) ListLogsJSONIndexes(ctx context.Context, filters ..
 	return indexes, nil
 }
 
-func (t *telemetryMetaStore) ListPromotedPaths(ctx context.Context, paths ...string) (map[string]struct{}, error) {
-	sb := sqlbuilder.Select("path").From(fmt.Sprintf("%s.%s", DBName, PromotedPathsTableName))
-	pathConditions := []string{}
-	for _, path := range paths {
-		pathConditions = append(pathConditions, sb.Equal("path", path))
-	}
-	sb.Where(sb.Or(pathConditions...))
-	query, args := sb.BuildWithFlavor(sqlbuilder.ClickHouse)
-
-	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, args...)
-	if err != nil {
-		return nil, errors.WrapInternalf(err, CodeFailLoadPromotedPaths, "failed to load promoted paths")
-	}
-	defer rows.Close()
-
-	next := make(map[string]struct{})
-	for rows.Next() {
-		var path string
-		if err := rows.Scan(&path); err != nil {
-			return nil, errors.WrapInternalf(err, CodeFailLoadPromotedPaths, "failed to scan promoted path")
-		}
-		next[path] = struct{}{}
-	}
-
-	return next, nil
-}
-
 // TODO(Piyush): Remove this if not used in future
 func (t *telemetryMetaStore) ListJSONValues(ctx context.Context, path string, limit int) (*telemetrytypes.TelemetryFieldValues, bool, error) {
 	path = CleanPathPrefixes(path)
@@ -484,11 +456,12 @@ func derefValue(v any) any {
 	return val.Interface()
 }
 
-// IsPathPromoted checks if a specific path is promoted
+// IsPathPromoted checks if a specific path is promoted (Column Evolution table: field_name for logs body).
 func (t *telemetryMetaStore) IsPathPromoted(ctx context.Context, path string) (bool, error) {
 	split := strings.Split(path, telemetrytypes.ArraySep)
-	query := fmt.Sprintf("SELECT 1 FROM %s.%s WHERE path = ? LIMIT 1", DBName, PromotedPathsTableName)
-	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, split[0])
+	pathSegment := split[0]
+	query := fmt.Sprintf("SELECT 1 FROM %s.%s WHERE signal = ? AND column_name = ? AND field_context = ? AND field_name = ? LIMIT 1", DBName, PromotedPathsTableName)
+	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, telemetrytypes.SignalLogs, telemetrylogs.LogsV2BodyPromotedColumn, telemetrytypes.FieldContextBody, pathSegment)
 	if err != nil {
 		return false, errors.WrapInternalf(err, CodeFailCheckPathPromoted, "failed to check if path %s is promoted", path)
 	}
@@ -497,15 +470,24 @@ func (t *telemetryMetaStore) IsPathPromoted(ctx context.Context, path string) (b
 	return rows.Next(), nil
 }
 
-// GetPromotedPaths checks if a specific path is promoted
-func (t *telemetryMetaStore) GetPromotedPaths(ctx context.Context, paths ...string) (*utils.ConcurrentSet[string], error) {
-	sb := sqlbuilder.Select("path").From(fmt.Sprintf("%s.%s", DBName, PromotedPathsTableName))
-	pathConditions := []string{}
-	for _, path := range paths {
-		split := strings.Split(path, telemetrytypes.ArraySep)
-		pathConditions = append(pathConditions, sb.Equal("path", split[0]))
+// GetPromotedPaths returns promoted paths from the Column Evolution table (field_name for logs body).
+func (t *telemetryMetaStore) GetPromotedPaths(ctx context.Context, paths ...string) (map[string]bool, error) {
+	sb := sqlbuilder.Select("field_name").From(fmt.Sprintf("%s.%s", DBName, PromotedPathsTableName))
+	conditions := []string{
+		sb.Equal("signal", telemetrytypes.SignalLogs),
+		sb.Equal("column_name", telemetrylogs.LogsV2BodyPromotedColumn),
+		sb.Equal("field_context", telemetrytypes.FieldContextBody),
+		sb.NotEqual("field_name", "__all__"),
 	}
-	sb.Where(sb.Or(pathConditions...))
+	if len(paths) > 0 {
+		pathArgs := make([]interface{}, len(paths))
+		for i, path := range paths {
+			split := strings.Split(path, telemetrytypes.ArraySep)
+			pathArgs[i] = split[0]
+		}
+		conditions = append(conditions, sb.In("field_name", pathArgs))
+	}
+	sb.Where(sb.And(conditions...))
 
 	query, args := sb.BuildWithFlavor(sqlbuilder.ClickHouse)
 	rows, err := t.telemetrystore.ClickhouseDB().Query(ctx, query, args...)
@@ -514,13 +496,13 @@ func (t *telemetryMetaStore) GetPromotedPaths(ctx context.Context, paths ...stri
 	}
 	defer rows.Close()
 
-	promotedPaths := utils.NewConcurrentSet[string]()
+	promotedPaths := make(map[string]bool)
 	for rows.Next() {
-		var path string
-		if err := rows.Scan(&path); err != nil {
+		var fieldName string
+		if err := rows.Scan(&fieldName); err != nil {
 			return nil, errors.WrapInternalf(err, CodeFailCheckPathPromoted, "failed to scan promoted path")
 		}
-		promotedPaths.Insert(path)
+		promotedPaths[fieldName] = true
 	}
 
 	return promotedPaths, nil
@@ -534,21 +516,22 @@ func CleanPathPrefixes(path string) string {
 	return path
 }
 
+// PromotePaths inserts promoted paths into the Column Evolution table (same schema as signoz-otel-collector metadata_migrations).
 func (t *telemetryMetaStore) PromotePaths(ctx context.Context, paths ...string) error {
 	batch, err := t.telemetrystore.ClickhouseDB().PrepareBatch(ctx,
-		fmt.Sprintf("INSERT INTO %s.%s (path, created_at) VALUES", DBName,
+		fmt.Sprintf("INSERT INTO %s.%s (signal, column_name, column_type, field_context, field_name, version, release_time) VALUES", DBName,
 			PromotedPathsTableName))
 	if err != nil {
 		return errors.WrapInternalf(err, CodeFailedToPrepareBatch, "failed to prepare batch")
 	}
 
-	nowMs := uint64(time.Now().UnixMilli())
+	releaseTime := time.Now().UnixNano()
 	for _, p := range paths {
 		trimmed := strings.TrimSpace(p)
 		if trimmed == "" {
 			continue
 		}
-		if err := batch.Append(trimmed, nowMs); err != nil {
+		if err := batch.Append(telemetrytypes.SignalLogs, telemetrylogs.LogsV2BodyPromotedColumn, "JSON()", telemetrytypes.FieldContextBody, trimmed, 0, releaseTime); err != nil {
 			_ = batch.Abort()
 			return errors.WrapInternalf(err, CodeFailedToAppendPath, "failed to append path")
 		}

pkg/telemetrymetadata/tables.go

@@ -7,6 +7,7 @@ const (
 	AttributesMetadataTableName      = "distributed_attributes_metadata"
 	AttributesMetadataLocalTableName = "attributes_metadata"
 	PathTypesTableName               = otelcollectorconst.DistributedPathTypesTable
-	PromotedPathsTableName           = otelcollectorconst.DistributedPromotedPathsTable
+	// Column Evolution table stores promoted paths as (signal, column_name, field_context, field_name); see signoz-otel-collector metadata_migrations.
+	PromotedPathsTableName           = "distributed_column_evolution_metadata"
 	SkipIndexTableName               = "system.data_skipping_indices"
 )

pkg/types/telemetrytypes/store.go

@@ -36,7 +36,7 @@ type MetadataStore interface {
 	ListLogsJSONIndexes(ctx context.Context, filters ...string) (map[string][]schemamigrator.Index, error)
 
 	// ListPromotedPaths lists the promoted paths.
-	ListPromotedPaths(ctx context.Context, paths ...string) (map[string]struct{}, error)
+	GetPromotedPaths(ctx context.Context, paths ...string) (map[string]bool, error)
 
 	// PromotePaths promotes the paths.
 	PromotePaths(ctx context.Context, paths ...string) error

pkg/types/telemetrytypes/telemetrytypestest/metadata_store.go

@@ -16,7 +16,7 @@ type MockMetadataStore struct {
 	RelatedValuesMap   map[string][]string
 	AllValuesMap       map[string]*telemetrytypes.TelemetryFieldValues
 	TemporalityMap     map[string]metrictypes.Temporality
-	PromotedPathsMap   map[string]struct{}
+	PromotedPathsMap   map[string]bool
 	LogsJSONIndexesMap map[string][]schemamigrator.Index
 	LookupKeysMap      map[telemetrytypes.MetricMetadataLookupKey]int64
 }
@@ -28,7 +28,7 @@ func NewMockMetadataStore() *MockMetadataStore {
 		RelatedValuesMap:   make(map[string][]string),
 		AllValuesMap:       make(map[string]*telemetrytypes.TelemetryFieldValues),
 		TemporalityMap:     make(map[string]metrictypes.Temporality),
-		PromotedPathsMap:   make(map[string]struct{}),
+		PromotedPathsMap:   make(map[string]bool),
 		LogsJSONIndexesMap: make(map[string][]schemamigrator.Index),
 		LookupKeysMap:      make(map[telemetrytypes.MetricMetadataLookupKey]int64),
 	}
@@ -295,13 +295,13 @@ func (m *MockMetadataStore) SetTemporality(metricName string, temporality metric
 // PromotePaths promotes the paths.
 func (m *MockMetadataStore) PromotePaths(ctx context.Context, paths ...string) error {
 	for _, path := range paths {
-		m.PromotedPathsMap[path] = struct{}{}
+		m.PromotedPathsMap[path] = true
 	}
 	return nil
 }
 
-// ListPromotedPaths lists the promoted paths.
-func (m *MockMetadataStore) ListPromotedPaths(ctx context.Context, paths ...string) (map[string]struct{}, error) {
+// GetPromotedPaths returns the promoted paths.
+func (m *MockMetadataStore) GetPromotedPaths(ctx context.Context, paths ...string) (map[string]bool, error) {
 	return m.PromotedPathsMap, nil
 }