From d150cfa46ca07244afcc1733cc30bd4b98312bba Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Mon, 6 Jun 2022 10:48:12 +0530
Subject: [PATCH 01/42] fix: using legacy_createStore instead of createStore as
 it seem it is depecreated

---
 frontend/src/store/index.ts | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/store/index.ts b/frontend/src/store/index.ts
index 39f43fdf85..3ff983b82e 100644
--- a/frontend/src/store/index.ts
+++ b/frontend/src/store/index.ts
@@ -1,4 +1,8 @@
-import { applyMiddleware, compose, createStore } from 'redux';
+import {
+	applyMiddleware,
+	compose,
+	legacy_createStore as createStore,
+} from 'redux';
 import thunk, { ThunkMiddleware } from 'redux-thunk';
 import AppActions from 'types/actions';
 

From 0c06c5ee0ed759aa939faa97edc651db9ae5f31e Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Mon, 6 Jun 2022 17:06:16 +0530
Subject: [PATCH 02/42] fix: trace detail is updated

---
 .../TraceDetail/SelectedSpanDetails/index.tsx | 20 ++++++++++++-------
 .../TraceDetail/SelectedSpanDetails/styles.ts | 17 +++++++++++++---
 2 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx b/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
index 87a953fd6e..dc16a2b7e9 100644
--- a/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
+++ b/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
@@ -1,12 +1,13 @@
-import { Space, Tabs, Typography } from 'antd';
+import { Space, Tabs, Tooltip, Typography } from 'antd';
 import { StyledSpace } from 'components/Styled';
 import useThemeMode from 'hooks/useThemeMode';
-import React from 'react';
+import React, { useMemo } from 'react';
 import { ITraceTree } from 'types/api/trace/getTraceItem';
 
 import ErrorTag from './ErrorTag';
 import {
 	CardContainer,
+	// CustomSpace,
 	CustomSubText,
 	CustomSubTitle,
 	CustomText,
@@ -19,11 +20,14 @@ const { TabPane } = Tabs;
 function SelectedSpanDetails(props: SelectedSpanDetailsProps): JSX.Element {
 	const { tree } = props;
 	const { isDarkMode } = useThemeMode();
+
+	const OverLayComponent = useMemo(() => tree?.name, [tree?.name]);
+
 	if (!tree) {
 		return <div />;
 	}
 
-	const { name, tags, serviceName } = tree;
+	const { tags, serviceName } = tree;
 
 	return (
 		<CardContainer>
@@ -37,10 +41,12 @@ function SelectedSpanDetails(props: SelectedSpanDetailsProps): JSX.Element {
 					<CustomTitle>Service</CustomTitle>
 					<CustomText>{serviceName}</CustomText>
 				</Space>
-				<Space direction="vertical" size={2}>
-					<CustomTitle>Operation</CustomTitle>
-					<CustomText>{name}</CustomText>
-				</Space>
+				{/* <CustomSpace direction="vertical" size={2}> */}
+				<CustomTitle>Operation</CustomTitle>
+				<Tooltip overlay={OverLayComponent}>
+					<CustomText ellipsis>{tree.name}</CustomText>
+				</Tooltip>
+				{/* </CustomSpace> */}
 			</StyledSpace>
 			<Tabs defaultActiveKey="1">
 				<TabPane tab="Tags" key="1">
diff --git a/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts b/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts
index dc5bdc03e9..211b07b190 100644
--- a/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts
+++ b/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts
@@ -1,7 +1,7 @@
-import { Typography } from 'antd';
+import { Space, Typography } from 'antd';
 import styled, { css } from 'styled-components';
 
-const { Text, Title, Paragraph } = Typography;
+const { Title, Paragraph } = Typography;
 
 export const CustomTitle = styled(Title)`
 	&&& {
@@ -9,7 +9,7 @@ export const CustomTitle = styled(Title)`
 	}
 `;
 
-export const CustomText = styled(Text)`
+export const CustomText = styled(Paragraph)`
 	&&& {
 		color: #2d9cdb;
 	}
@@ -44,6 +44,17 @@ export const CardContainer = styled.div`
 	width: 100%;
 	flex: 1;
 	overflow-y: auto;
+	overflow-x: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+`;
+
+export const CustomSpace = styled(Space)`
+	&&& {
+		.ant-space-item {
+			width: 100%;
+		}
+	}
 `;
 
 const removeMargin = css`

From 8a0bcf6cd98a2e9a711978c019a42dc1d18c69c4 Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Tue, 7 Jun 2022 15:56:16 +0530
Subject: [PATCH 03/42] feat: operation name is now ellipsed

---
 .../TraceDetail/SelectedSpanDetails/index.tsx       |  3 +--
 .../TraceDetail/SelectedSpanDetails/styles.ts       | 13 ++++++++++++-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx b/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
index dc16a2b7e9..7d1a374b42 100644
--- a/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
+++ b/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
@@ -7,7 +7,6 @@ import { ITraceTree } from 'types/api/trace/getTraceItem';
 import ErrorTag from './ErrorTag';
 import {
 	CardContainer,
-	// CustomSpace,
 	CustomSubText,
 	CustomSubTitle,
 	CustomText,
@@ -32,7 +31,7 @@ function SelectedSpanDetails(props: SelectedSpanDetailsProps): JSX.Element {
 	return (
 		<CardContainer>
 			<StyledSpace
-				styledclass={[styles.selectedSpanDetailsContainer]}
+				styledclass={[styles.selectedSpanDetailsContainer, styles.overflow]}
 				direction="vertical"
 				style={{ marginLeft: '0.5rem' }}
 			>
diff --git a/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts b/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts
index 211b07b190..d8bae86ba7 100644
--- a/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts
+++ b/frontend/src/container/TraceDetail/SelectedSpanDetails/styles.ts
@@ -17,7 +17,6 @@ export const CustomText = styled(Paragraph)`
 
 export const CustomSubTitle = styled(Title)`
 	&&& {
-		/* color: #bdbdbd; */
 		font-size: 14px;
 		margin-bottom: 8px;
 	}
@@ -71,9 +70,21 @@ const selectedSpanDetailsContainer = css`
 const spanEventsTabsContainer = css`
 	margin-top: 1rem;
 `;
+
+const overflow = css`
+	width: 95%;
+
+	> div.ant-space-item:nth-child(4) {
+		overflow-x: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+`;
+
 export const styles = {
 	removeMargin,
 	removePadding,
 	selectedSpanDetailsContainer,
 	spanEventsTabsContainer,
+	overflow,
 };

From d8775c91d7c026aff7e86c1274444fd44046969d Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Mon, 13 Jun 2022 18:38:06 +0530
Subject: [PATCH 04/42] feat: metrics is renamed to services in sidebar

---
 frontend/src/container/SideNav/menuItems.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/container/SideNav/menuItems.ts b/frontend/src/container/SideNav/menuItems.ts
index 921cef71d5..66a2a1fe77 100644
--- a/frontend/src/container/SideNav/menuItems.ts
+++ b/frontend/src/container/SideNav/menuItems.ts
@@ -15,7 +15,7 @@ const menus: SidebarMenu[] = [
 	{
 		Icon: BarChartOutlined,
 		to: ROUTES.APPLICATION,
-		name: 'Metrics',
+		name: 'Services',
 	},
 	{
 		Icon: AlignLeftOutlined,

From c16ae790d4ee438ed91782fb5e9b905da1401065 Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Mon, 13 Jun 2022 19:05:17 +0530
Subject: [PATCH 05/42] feat: rule id is passed as params

---
 frontend/src/constants/routes.ts              |  2 +-
 .../container/ListAlertRules/ListAlert.tsx    |  7 +---
 frontend/src/pages/EditRules/index.tsx        | 32 +++++++++++++------
 3 files changed, 25 insertions(+), 16 deletions(-)

diff --git a/frontend/src/constants/routes.ts b/frontend/src/constants/routes.ts
index 636a3b0758..506474af97 100644
--- a/frontend/src/constants/routes.ts
+++ b/frontend/src/constants/routes.ts
@@ -12,7 +12,7 @@ const ROUTES = {
 	ALL_DASHBOARD: '/dashboard',
 	DASHBOARD: '/dashboard/:dashboardId',
 	DASHBOARD_WIDGET: '/dashboard/:dashboardId/:widgetId',
-	EDIT_ALERTS: '/alerts/edit/:ruleId',
+	EDIT_ALERTS: '/alerts/edit',
 	LIST_ALL_ALERT: '/alerts',
 	ALERTS_NEW: '/alerts/new',
 	ALL_CHANNELS: '/settings/channels',
diff --git a/frontend/src/container/ListAlertRules/ListAlert.tsx b/frontend/src/container/ListAlertRules/ListAlert.tsx
index 8ec1fa9987..b851b0829a 100644
--- a/frontend/src/container/ListAlertRules/ListAlert.tsx
+++ b/frontend/src/container/ListAlertRules/ListAlert.tsx
@@ -11,7 +11,6 @@ import React, { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { UseQueryResult } from 'react-query';
 import { useSelector } from 'react-redux';
-import { generatePath } from 'react-router-dom';
 import { AppState } from 'store/reducers';
 import { ErrorResponse, SuccessResponse } from 'types/api';
 import { Alerts } from 'types/api/alerts/getAll';
@@ -51,11 +50,7 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
 	const [notifications, Element] = notification.useNotification();
 
 	const onEditHandler = (id: string): void => {
-		history.push(
-			generatePath(ROUTES.EDIT_ALERTS, {
-				ruleId: id,
-			}),
-		);
+		history.push(`${ROUTES.EDIT_ALERTS}?ruleId=${id}`);
 	};
 
 	const columns: ColumnsType<Alerts> = [
diff --git a/frontend/src/pages/EditRules/index.tsx b/frontend/src/pages/EditRules/index.tsx
index 9b80ff7024..1a65e668af 100644
--- a/frontend/src/pages/EditRules/index.tsx
+++ b/frontend/src/pages/EditRules/index.tsx
@@ -1,23 +1,41 @@
+import { notification } from 'antd';
 import get from 'api/alerts/get';
 import Spinner from 'components/Spinner';
+import ROUTES from 'constants/routes';
 import EditRulesContainer from 'container/EditRules';
-import React from 'react';
+import history from 'lib/history';
+import React, { useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useQuery } from 'react-query';
-import { useParams } from 'react-router-dom';
+import { useLocation } from 'react-router-dom';
 
 function EditRules(): JSX.Element {
-	const { ruleId } = useParams<EditRulesParam>();
+	const { search } = useLocation();
+	const params = new URLSearchParams(search);
+	const ruleId = params.get('ruleId');
+
 	const { t } = useTranslation('common');
 
+	const isValidRuleId = ruleId !== null && String(ruleId).length !== 0;
+
 	const { isLoading, data, isError } = useQuery(['ruleId', ruleId], {
 		queryFn: () =>
 			get({
-				id: parseInt(ruleId, 10),
+				id: parseInt(ruleId || '', 10),
 			}),
+		enabled: isValidRuleId,
 	});
 
-	if (isError) {
+	useEffect(() => {
+		if (!isValidRuleId) {
+			notification.error({
+				message: 'Rule Id is required',
+			});
+			history.replace(ROUTES.LIST_ALL_ALERT);
+		}
+	}, [isValidRuleId, ruleId]);
+
+	if ((isError && !isValidRuleId) || ruleId == null) {
 		return <div>{data?.error || t('something_went_wrong')}</div>;
 	}
 
@@ -28,8 +46,4 @@ function EditRules(): JSX.Element {
 	return <EditRulesContainer ruleId={ruleId} initialData={data.payload.data} />;
 }
 
-interface EditRulesParam {
-	ruleId: string;
-}
-
 export default EditRules;

From 24e84bac2a52f4e6a8c8c6768bf0473d92dfc109 Mon Sep 17 00:00:00 2001
From: Ankit Nayan <ankit@signoz.io>
Date: Tue, 14 Jun 2022 20:50:13 +0530
Subject: [PATCH 06/42] Create codeball.yml

---
 .github/workflows/codeball.yml | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)
 create mode 100644 .github/workflows/codeball.yml

diff --git a/.github/workflows/codeball.yml b/.github/workflows/codeball.yml
new file mode 100644
index 0000000000..ed69d5c10e
--- /dev/null
+++ b/.github/workflows/codeball.yml
@@ -0,0 +1,17 @@
+name: Codeball
+on: [pull_request]
+
+jobs:
+  codeball_job:
+    runs-on: ubuntu-latest
+    name: Codeball
+    steps:
+      # Run Codeball on all new Pull Requests 🚀
+      # For customizations and more documentation, see https://github.com/sturdy-dev/codeball-action
+      - name: Codeball
+        uses: sturdy-dev/codeball-action@v2
+        with:
+          approvePullRequests: "true"
+          labelPullRequestsWhenApproved: "true"
+          labelPullRequestsWhenReviewNeeded: "false"
+          failJobsWhenReviewNeeded: "false"

From 0a5eff2255279eaf2d567ffb883e8b8529691461 Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Wed, 15 Jun 2022 01:34:56 +0530
Subject: [PATCH 07/42] feat: alerts breadcrumb is added

---
 frontend/src/container/TopNav/Breadcrumbs/index.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/src/container/TopNav/Breadcrumbs/index.tsx b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
index 25ff730711..33d42ac5b0 100644
--- a/frontend/src/container/TopNav/Breadcrumbs/index.tsx
+++ b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
@@ -16,6 +16,7 @@ const breadcrumbNameMap = {
 	[ROUTES.ORG_SETTINGS]: 'Organization Settings',
 	[ROUTES.MY_SETTINGS]: 'My Settings',
 	[ROUTES.ERROR_DETAIL]: 'Errors',
+	[ROUTES.LIST_ALL_ALERT]: 'Alerts',
 };
 
 function ShowBreadcrumbs(props: RouteComponentProps): JSX.Element {

From ba5e3dcfd3f8c499e4fc81478c6eb422eb370957 Mon Sep 17 00:00:00 2001
From: zedongh <248348907@qq.com>
Date: Tue, 14 Jun 2022 20:15:13 +0800
Subject: [PATCH 08/42] fix: getMinMax with 'GLOBAL_TIME' and 'custom' need
 pass globalTimefeat (#1269)

---
 .../src/container/GridGraphLayout/Graph/FullView/index.tsx   | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx b/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx
index e4b4bc8183..3111e33e87 100644
--- a/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx
+++ b/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx
@@ -57,7 +57,10 @@ function FullView({
 		time: timePreferenceType,
 	): { min: string | number; max: string | number } => {
 		if (time === 'GLOBAL_TIME') {
-			const minMax = GetMinMax(globalSelectedTime);
+			const minMax = GetMinMax(globalSelectedTime, [
+				minTime / 1000000,
+				maxTime / 1000000,
+			]);
 			return {
 				min: convertToNanoSecondsToSecond(minMax.minTime / 1000),
 				max: convertToNanoSecondsToSecond(minMax.maxTime / 1000),

From 988557284222d3b6d12e525a8ca62235e35bd199 Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Fri, 17 Jun 2022 08:07:33 +0530
Subject: [PATCH 09/42] feat: nginx uri issue is handled by increasing buffers

---
 deploy/docker/common/nginx-config.conf | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/deploy/docker/common/nginx-config.conf b/deploy/docker/common/nginx-config.conf
index 705656bb6e..02fc9a8e69 100644
--- a/deploy/docker/common/nginx-config.conf
+++ b/deploy/docker/common/nginx-config.conf
@@ -11,6 +11,16 @@ server {
     gzip_buffers 16 8k;
     gzip_http_version 1.1;
 
+    # to handle uri issue 414 from nginx
+    fastcgi_buffers 8 16k;
+    fastcgi_buffer_size 32k;
+
+    client_max_body_size 24M;
+    client_body_buffer_size 128k;
+
+    client_header_buffer_size 5120k;
+    large_client_header_buffers 16 5120k;
+
     location / {
         if ( $uri = '/index.html' ) {
             add_header Cache-Control no-store always;

From 43e4f637d1c7eac64e52531c50fdc4a711bacb20 Mon Sep 17 00:00:00 2001
From: Palash gupta <palash@signoz.io>
Date: Fri, 17 Jun 2022 12:31:48 +0530
Subject: [PATCH 10/42] fix: remove fastcgi

---
 deploy/docker/common/nginx-config.conf | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/deploy/docker/common/nginx-config.conf b/deploy/docker/common/nginx-config.conf
index 02fc9a8e69..a26c6662ca 100644
--- a/deploy/docker/common/nginx-config.conf
+++ b/deploy/docker/common/nginx-config.conf
@@ -12,9 +12,6 @@ server {
     gzip_http_version 1.1;
 
     # to handle uri issue 414 from nginx
-    fastcgi_buffers 8 16k;
-    fastcgi_buffer_size 32k;
-
     client_max_body_size 24M;
     client_body_buffer_size 128k;
 

From 8871d53ae05bab6f8fc45ac72f516a59fc68ffa1 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Tue, 21 Jun 2022 15:12:03 +0530
Subject: [PATCH 11/42] nginx config is updated

---
 deploy/docker/common/nginx-config.conf | 1 -
 1 file changed, 1 deletion(-)

diff --git a/deploy/docker/common/nginx-config.conf b/deploy/docker/common/nginx-config.conf
index a26c6662ca..e61719198b 100644
--- a/deploy/docker/common/nginx-config.conf
+++ b/deploy/docker/common/nginx-config.conf
@@ -13,7 +13,6 @@ server {
 
     # to handle uri issue 414 from nginx
     client_max_body_size 24M;
-    client_body_buffer_size 128k;
 
     client_header_buffer_size 5120k;
     large_client_header_buffers 16 5120k;

From 7f64dfd023365785db5b5c31ab54554f7de73dd6 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Tue, 21 Jun 2022 16:05:18 +0530
Subject: [PATCH 12/42] chore: nginx config is updated

---
 deploy/docker/common/nginx-config.conf | 1 -
 1 file changed, 1 deletion(-)

diff --git a/deploy/docker/common/nginx-config.conf b/deploy/docker/common/nginx-config.conf
index e61719198b..da7f1b63f1 100644
--- a/deploy/docker/common/nginx-config.conf
+++ b/deploy/docker/common/nginx-config.conf
@@ -14,7 +14,6 @@ server {
     # to handle uri issue 414 from nginx
     client_max_body_size 24M;
 
-    client_header_buffer_size 5120k;
     large_client_header_buffers 16 5120k;
 
     location / {

From fdca72b9b24ea316301f0f07758b2f97382b449f Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Tue, 21 Jun 2022 16:09:17 +0530
Subject: [PATCH 13/42] chore: nginx config is updated

---
 deploy/docker/common/nginx-config.conf | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/deploy/docker/common/nginx-config.conf b/deploy/docker/common/nginx-config.conf
index da7f1b63f1..99615f1f60 100644
--- a/deploy/docker/common/nginx-config.conf
+++ b/deploy/docker/common/nginx-config.conf
@@ -14,7 +14,7 @@ server {
     # to handle uri issue 414 from nginx
     client_max_body_size 24M;
 
-    large_client_header_buffers 16 5120k;
+    large_client_header_buffers 8 16k;
 
     location / {
         if ( $uri = '/index.html' ) {

From bcb5256de0577cd9225e6ea05f134f866154b0fe Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Tue, 21 Jun 2022 17:25:59 +0530
Subject: [PATCH 14/42] Update CODEOWNERS (#1265)

---
 .github/CODEOWNERS | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index afd70250c4..b717ca9eee 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -2,5 +2,5 @@
 # Owners are automatically requested for review for PRs that changes code
 # that they own.
 * @ankitnayan
-/frontend/ @palash-signoz @pranshuchittora
+/frontend/ @palashgdev @pranshuchittora
 /deploy/ @prashant-shahi

From 3603e497a6570fb114ef1c9a1afd4befe856903d Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Wed, 22 Jun 2022 22:49:01 +0530
Subject: [PATCH 15/42] chore: error state is updated

---
 frontend/src/pages/EditRules/index.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/EditRules/index.tsx b/frontend/src/pages/EditRules/index.tsx
index 1a65e668af..09cda600ab 100644
--- a/frontend/src/pages/EditRules/index.tsx
+++ b/frontend/src/pages/EditRules/index.tsx
@@ -35,7 +35,11 @@ function EditRules(): JSX.Element {
 		}
 	}, [isValidRuleId, ruleId]);
 
-	if ((isError && !isValidRuleId) || ruleId == null) {
+	if (
+		(isError && !isValidRuleId) ||
+		ruleId == null ||
+		(data?.payload?.data === undefined && !isLoading)
+	) {
 		return <div>{data?.error || t('something_went_wrong')}</div>;
 	}
 

From 241121ebecb74c02855f5b9747a7c6d0acee1c85 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Wed, 22 Jun 2022 23:46:30 +0530
Subject: [PATCH 16/42] chore: serivce name now ellipsed

---
 .../TraceDetail/SelectedSpanDetails/index.tsx | 24 +++++++++++--------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx b/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
index 7d1a374b42..50f2aa9537 100644
--- a/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
+++ b/frontend/src/container/TraceDetail/SelectedSpanDetails/index.tsx
@@ -1,4 +1,4 @@
-import { Space, Tabs, Tooltip, Typography } from 'antd';
+import { Tabs, Tooltip, Typography } from 'antd';
 import { StyledSpace } from 'components/Styled';
 import useThemeMode from 'hooks/useThemeMode';
 import React, { useMemo } from 'react';
@@ -20,13 +20,16 @@ function SelectedSpanDetails(props: SelectedSpanDetailsProps): JSX.Element {
 	const { tree } = props;
 	const { isDarkMode } = useThemeMode();
 
-	const OverLayComponent = useMemo(() => tree?.name, [tree?.name]);
+	const OverLayComponentName = useMemo(() => tree?.name, [tree?.name]);
+	const OverLayComponentServiceName = useMemo(() => tree?.serviceName, [
+		tree?.serviceName,
+	]);
 
 	if (!tree) {
 		return <div />;
 	}
 
-	const { tags, serviceName } = tree;
+	const { tags } = tree;
 
 	return (
 		<CardContainer>
@@ -36,17 +39,18 @@ function SelectedSpanDetails(props: SelectedSpanDetailsProps): JSX.Element {
 				style={{ marginLeft: '0.5rem' }}
 			>
 				<strong> Details for selected Span </strong>
-				<Space direction="vertical" size={2}>
-					<CustomTitle>Service</CustomTitle>
-					<CustomText>{serviceName}</CustomText>
-				</Space>
-				{/* <CustomSpace direction="vertical" size={2}> */}
+
+				<CustomTitle>Service</CustomTitle>
+				<Tooltip overlay={OverLayComponentServiceName}>
+					<CustomText ellipsis>{tree.serviceName}</CustomText>
+				</Tooltip>
+
 				<CustomTitle>Operation</CustomTitle>
-				<Tooltip overlay={OverLayComponent}>
+				<Tooltip overlay={OverLayComponentName}>
 					<CustomText ellipsis>{tree.name}</CustomText>
 				</Tooltip>
-				{/* </CustomSpace> */}
 			</StyledSpace>
+
 			<Tabs defaultActiveKey="1">
 				<TabPane tab="Tags" key="1">
 					{tags.length !== 0 ? (

From 224ec8d0d9d3ce0b9422c6c35dd378d3d5cd6449 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 01:04:38 +0530
Subject: [PATCH 17/42] feat: search filter is added in the trace filter

---
 .../Panel/PanelBody/CommonCheckBox/index.tsx  | 51 +++++++++++++++++--
 frontend/src/store/reducers/trace.ts          | 21 ++++++++
 frontend/src/types/actions/trace.ts           | 10 +++-
 frontend/src/types/reducer/trace.ts           |  1 +
 4 files changed, 79 insertions(+), 4 deletions(-)

diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
index 0681e7e5d5..72d7439ade 100644
--- a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
@@ -1,12 +1,19 @@
-import React from 'react';
-import { useSelector } from 'react-redux';
+import { Button, Input } from 'antd';
+import React, { useState } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { Dispatch } from 'redux';
 import { AppState } from 'store/reducers';
+import { INITIAL_FILTER_VALUE } from 'store/reducers/trace';
+import AppActions from 'types/actions';
+import { UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE } from 'types/actions/trace';
 import { TraceFilterEnum, TraceReducer } from 'types/reducer/trace';
 
 import CheckBoxComponent from '../Common/Checkbox';
 
+const { Search } = Input;
+
 function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
-	const { filter } = useSelector<AppState, TraceReducer>(
+	const { filter, filterDisplayValue } = useSelector<AppState, TraceReducer>(
 		(state) => state.traces,
 	);
 
@@ -15,9 +22,34 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 	const status = filter.get(name) || {};
 
 	const statusObj = Object.keys(status);
+	const numberOfFilters = filterDisplayValue.get(name) || 0;
+	const dispatch = useDispatch<Dispatch<AppActions>>();
+	const [searchFilter, setSearchFilter] = useState<string>('');
+
+	const onClickMoreHandler = (): void => {
+		const newFilterDisplayValue = new Map(filterDisplayValue);
+		const preValue =
+			(newFilterDisplayValue.get(name) || 0) + INITIAL_FILTER_VALUE;
+
+		newFilterDisplayValue.set(name, preValue);
+
+		dispatch({
+			type: UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE,
+			payload: newFilterDisplayValue,
+		});
+	};
 
 	return (
 		<>
+			<Search
+				value={searchFilter}
+				onChange={(e): void => setSearchFilter(e.target.value)}
+				style={{
+					padding: '0 3%',
+				}}
+				placeholder="Filter Values"
+			/>
+
 			{statusObj
 				.sort((a, b) => {
 					const countA = +status[a];
@@ -28,6 +60,13 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 					}
 					return countA - countB;
 				})
+				.filter((_, index) => index < numberOfFilters)
+				.filter((filter) => {
+					if (searchFilter.length === 0) {
+						return true;
+					}
+					return filter.includes(searchFilter);
+				})
 				.map((e) => (
 					<CheckBoxComponent
 						key={e}
@@ -38,6 +77,12 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 						}}
 					/>
 				))}
+
+			{numberOfFilters && statusObj.length > numberOfFilters && (
+				<Button onClick={onClickMoreHandler} type="link">
+					More
+				</Button>
+			)}
 		</>
 	);
 }
diff --git a/frontend/src/store/reducers/trace.ts b/frontend/src/store/reducers/trace.ts
index b99ee7dd3a..4023d375ca 100644
--- a/frontend/src/store/reducers/trace.ts
+++ b/frontend/src/store/reducers/trace.ts
@@ -11,6 +11,7 @@ import {
 	UPDATE_SELECTED_TAGS,
 	UPDATE_SPAN_ORDER,
 	UPDATE_SPAN_ORDER_PARAMS,
+	UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE,
 	UPDATE_SPANS_AGGREGATE,
 	UPDATE_SPANS_AGGREGATE_PAGE_NUMBER,
 	UPDATE_SPANS_AGGREGATE_PAGE_SIZE,
@@ -23,6 +24,8 @@ import {
 } from 'types/actions/trace';
 import { TraceFilterEnum, TraceReducer } from 'types/reducer/trace';
 
+export const INITIAL_FILTER_VALUE = 4;
+
 const initialValue: TraceReducer = {
 	filter: new Map(),
 	filterToFetchData: ['duration', 'status', 'serviceName'],
@@ -53,6 +56,17 @@ const initialValue: TraceReducer = {
 		loading: true,
 		payload: { items: {} },
 	},
+	filterDisplayValue: new Map<TraceFilterEnum, number>([
+		['component', INITIAL_FILTER_VALUE],
+		['duration', INITIAL_FILTER_VALUE],
+		['httpCode', INITIAL_FILTER_VALUE],
+		['httpHost', INITIAL_FILTER_VALUE],
+		['httpMethod', INITIAL_FILTER_VALUE],
+		['httpUrl', INITIAL_FILTER_VALUE],
+		['operation', INITIAL_FILTER_VALUE],
+		['serviceName', INITIAL_FILTER_VALUE],
+		['status', INITIAL_FILTER_VALUE],
+	]),
 };
 
 const traceReducer = (
@@ -251,6 +265,13 @@ const traceReducer = (
 			};
 		}
 
+		case UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE: {
+			return {
+				...state,
+				filterDisplayValue: action.payload,
+			};
+		}
+
 		default:
 			return state;
 	}
diff --git a/frontend/src/types/actions/trace.ts b/frontend/src/types/actions/trace.ts
index da97d05129..f043926142 100644
--- a/frontend/src/types/actions/trace.ts
+++ b/frontend/src/types/actions/trace.ts
@@ -31,6 +31,8 @@ export const UPDATE_SPANS_AGGREGATE_PAGE_NUMBER =
 export const UPDATE_SPANS_AGGREGATE_PAGE_SIZE =
 	'UPDATE_SPANS_AGGREGATE_PAGE_SIZE';
 export const UPDATE_SPAN_ORDER_PARAMS = 'UPDATE_SPAN_ORDER_PARAMS';
+export const UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE =
+	'UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE';
 
 export interface UpdateFilter {
 	type: typeof UPDATE_TRACE_FILTER;
@@ -187,6 +189,11 @@ export interface UpdateSpanParams {
 	};
 }
 
+export interface UpdateTraceFilterDisplayValue {
+	type: typeof UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE;
+	payload: TraceReducer['filterDisplayValue'];
+}
+
 export type TraceActions =
 	| UpdateFilter
 	| GetTraceFilter
@@ -208,4 +215,5 @@ export type TraceActions =
 	| UpdateSpanOrder
 	| UpdateSpansAggregatePageNumber
 	| UpdateSpanSize
-	| UpdateSpanParams;
+	| UpdateSpanParams
+	| UpdateTraceFilterDisplayValue;
diff --git a/frontend/src/types/reducer/trace.ts b/frontend/src/types/reducer/trace.ts
index babeb344c6..fc1c08f4fc 100644
--- a/frontend/src/types/reducer/trace.ts
+++ b/frontend/src/types/reducer/trace.ts
@@ -32,6 +32,7 @@ export interface TraceReducer {
 		payload: PayloadProps;
 	};
 	yAxisUnit: string | undefined;
+	filterDisplayValue: Map<TraceFilterEnum, number>;
 }
 
 interface SpansAggregateData {

From 729c7fce7b84d67f8433d984ae87152306e3ef43 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 01:08:51 +0530
Subject: [PATCH 18/42] chore: initial value is made 8

---
 frontend/src/store/reducers/trace.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/store/reducers/trace.ts b/frontend/src/store/reducers/trace.ts
index 4023d375ca..3f7672cdd5 100644
--- a/frontend/src/store/reducers/trace.ts
+++ b/frontend/src/store/reducers/trace.ts
@@ -24,7 +24,7 @@ import {
 } from 'types/actions/trace';
 import { TraceFilterEnum, TraceReducer } from 'types/reducer/trace';
 
-export const INITIAL_FILTER_VALUE = 4;
+export const INITIAL_FILTER_VALUE = 8;
 
 const initialValue: TraceReducer = {
 	filter: new Map(),

From d7d0d70aa5e281834f87087f996e5a95e37aede4 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 01:12:12 +0530
Subject: [PATCH 19/42] chore: search filter is made conditional as filters
 need to be present

---
 .../Panel/PanelBody/CommonCheckBox/index.tsx   | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
index 72d7439ade..29255ae549 100644
--- a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
@@ -41,14 +41,16 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 
 	return (
 		<>
-			<Search
-				value={searchFilter}
-				onChange={(e): void => setSearchFilter(e.target.value)}
-				style={{
-					padding: '0 3%',
-				}}
-				placeholder="Filter Values"
-			/>
+			{statusObj.length > 0 && (
+				<Search
+					value={searchFilter}
+					onChange={(e): void => setSearchFilter(e.target.value)}
+					style={{
+						padding: '0 3%',
+					}}
+					placeholder="Filter Values"
+				/>
+			)}
 
 			{statusObj
 				.sort((a, b) => {

From 84b876170df0facb447e2b5409969068191ec716 Mon Sep 17 00:00:00 2001
From: Prashant Shahi <prashant@signoz.io>
Date: Thu, 23 Jun 2022 10:15:21 +0530
Subject: [PATCH 20/42] chore: clickhouse version bump (#1280)

* chore: clickhouse version bump
---
 .../clickhouse-setup/clickhouse-config.xml    | 1474 +++++++++++++----
 .../clickhouse-setup/clickhouse-storage.xml   |   28 +
 .../clickhouse-setup/clickhouse-users.xml     |  123 ++
 .../clickhouse-setup/docker-compose.yaml      |    4 +-
 .../clickhouse-setup/clickhouse-config.xml    | 1474 +++++++++++++----
 .../clickhouse-setup/clickhouse-storage.xml   |   28 +
 .../clickhouse-setup/clickhouse-users.xml     |  123 ++
 deploy/docker/clickhouse-setup/config.xml     | 1304 +++++++++++++++
 .../clickhouse-setup/docker-compose.arm.yaml  |  133 --
 .../clickhouse-setup/docker-compose.yaml      |    4 +-
 deploy/docker/clickhouse-setup/users.xml      |  123 ++
 .../tests/test-deploy/clickhouse-config.xml   | 1473 ++++++++++++----
 .../tests/test-deploy/clickhouse-storage.xml  |   28 +
 .../tests/test-deploy/clickhouse-users.xml    |  123 ++
 .../tests/test-deploy/docker-compose.arm.yaml |   99 --
 .../tests/test-deploy/docker-compose.yaml     |    8 +-
 16 files changed, 5245 insertions(+), 1304 deletions(-)
 create mode 100644 deploy/docker-swarm/clickhouse-setup/clickhouse-storage.xml
 create mode 100644 deploy/docker-swarm/clickhouse-setup/clickhouse-users.xml
 create mode 100644 deploy/docker/clickhouse-setup/clickhouse-storage.xml
 create mode 100644 deploy/docker/clickhouse-setup/clickhouse-users.xml
 create mode 100644 deploy/docker/clickhouse-setup/config.xml
 delete mode 100644 deploy/docker/clickhouse-setup/docker-compose.arm.yaml
 create mode 100644 deploy/docker/clickhouse-setup/users.xml
 create mode 100644 pkg/query-service/tests/test-deploy/clickhouse-storage.xml
 create mode 100644 pkg/query-service/tests/test-deploy/clickhouse-users.xml
 delete mode 100644 pkg/query-service/tests/test-deploy/docker-compose.arm.yaml

diff --git a/deploy/docker-swarm/clickhouse-setup/clickhouse-config.xml b/deploy/docker-swarm/clickhouse-setup/clickhouse-config.xml
index 7a5f40d299..3bb26a3a36 100644
--- a/deploy/docker-swarm/clickhouse-setup/clickhouse-config.xml
+++ b/deploy/docker-swarm/clickhouse-setup/clickhouse-config.xml
@@ -1,137 +1,567 @@
 <?xml version="1.0"?>
-<yandex>
+<!--
+  NOTE: User and query level settings are set up in "users.xml" file.
+  If you have accidentally specified user-level settings here, server won't start.
+  You can either move the settings to the right place inside "users.xml" file
+   or add <skip_check_for_incorrect_settings>1</skip_check_for_incorrect_settings> here.
+-->
+<clickhouse>
     <logger>
-        <level>information</level>
-        <console>1</console>
+        <!-- Possible levels [1]:
+
+          - none (turns off logging)
+          - fatal
+          - critical
+          - error
+          - warning
+          - notice
+          - information
+          - debug
+          - trace
+          - test (not for production usage)
+
+            [1]: https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/Logger.h#L105-L114
+        -->
+        <level>trace</level>
+        <log>/var/log/clickhouse-server/clickhouse-server.log</log>
+        <errorlog>/var/log/clickhouse-server/clickhouse-server.err.log</errorlog>
+        <!-- Rotation policy
+             See https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/FileChannel.h#L54-L85
+          -->
+        <size>1000M</size>
+        <count>10</count>
+        <!-- <console>1</console> --> <!-- Default behavior is autodetection (log to console if not daemon mode and is tty) -->
+
+        <!-- Per level overrides (legacy):
+
+        For example to suppress logging of the ConfigReloader you can use:
+        NOTE: levels.logger is reserved, see below.
+        -->
+        <!--
+        <levels>
+          <ConfigReloader>none</ConfigReloader>
+        </levels>
+        -->
+
+        <!-- Per level overrides:
+
+        For example to suppress logging of the RBAC for default user you can use:
+        (But please note that the logger name maybe changed from version to version, even after minor upgrade)
+        -->
+        <!--
+        <levels>
+          <logger>
+            <name>ContextAccess (default)</name>
+            <level>none</level>
+          </logger>
+          <logger>
+            <name>DatabaseOrdinary (test)</name>
+            <level>none</level>
+          </logger>
+        </levels>
+        -->
     </logger>
 
+    <!-- Add headers to response in options request. OPTIONS method is used in CORS preflight requests. -->
+    <!-- It is off by default. Next headers are obligate for CORS.-->
+    <!-- http_options_response>
+        <header>
+            <name>Access-Control-Allow-Origin</name>
+            <value>*</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Headers</name>
+            <value>origin, x-requested-with</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Methods</name>
+            <value>POST, GET, OPTIONS</value>
+        </header>
+        <header>
+            <name>Access-Control-Max-Age</name>
+            <value>86400</value>
+        </header>
+    </http_options_response -->
+
+    <!-- It is the name that will be shown in the clickhouse-client.
+         By default, anything with "production" will be highlighted in red in query prompt.
+    -->
+    <!--display_name>production</display_name-->
+
+    <!-- Port for HTTP API. See also 'https_port' for secure connections.
+         This interface is also used by ODBC and JDBC drivers (DataGrip, Dbeaver, ...)
+         and by most of web interfaces (embedded UI, Grafana, Redash, ...).
+      -->
     <http_port>8123</http_port>
+
+    <!-- Port for interaction by native protocol with:
+         - clickhouse-client and other native ClickHouse tools (clickhouse-benchmark, clickhouse-copier);
+         - clickhouse-server with other clickhouse-servers for distributed query processing;
+         - ClickHouse drivers and applications supporting native protocol
+         (this protocol is also informally called as "the TCP protocol");
+         See also 'tcp_port_secure' for secure connections.
+    -->
     <tcp_port>9000</tcp_port>
 
-    <!-- For HTTPS and SSL over native protocol. -->
-    <!--
-    <https_port>8443</https_port>
-    <tcp_ssl_port>9440</tcp_ssl_port>
--->
+    <!-- Compatibility with MySQL protocol.
+         ClickHouse will pretend to be MySQL for applications connecting to this port.
+    -->
+    <mysql_port>9004</mysql_port>
 
-<!-- Used with https_port and tcp_ssl_port. Full ssl options list: https://github.com/yandex/ClickHouse/blob/master/contrib/libpoco/NetSSL_OpenSSL/include/Poco/Net/SSLManager.h#L71 -->
-<openSSL>
-    <server> <!-- Used for https server AND secure tcp port -->
-        <!-- openssl req -subj "/CN=localhost" -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout /etc/clickhouse-server/server.key -out /etc/clickhouse-server/server.crt -->
-        <certificateFile>/etc/clickhouse-server/server.crt</certificateFile>
-        <privateKeyFile>/etc/clickhouse-server/server.key</privateKeyFile>
-        <!-- openssl dhparam -out /etc/clickhouse-server/dhparam.pem 4096 -->
-        <dhParamsFile>/etc/clickhouse-server/dhparam.pem</dhParamsFile>
-        <verificationMode>none</verificationMode>
-        <loadDefaultCAFile>true</loadDefaultCAFile>
-        <cacheSessions>true</cacheSessions>
-        <disableProtocols>sslv2,sslv3</disableProtocols>
-        <preferServerCiphers>true</preferServerCiphers>
-    </server>
+    <!-- Compatibility with PostgreSQL protocol.
+         ClickHouse will pretend to be PostgreSQL for applications connecting to this port.
+    -->
+    <postgresql_port>9005</postgresql_port>
 
-    <client> <!-- Used for connecting to https dictionary source -->
-        <loadDefaultCAFile>true</loadDefaultCAFile>
-        <cacheSessions>true</cacheSessions>
-        <disableProtocols>sslv2,sslv3</disableProtocols>
-        <preferServerCiphers>true</preferServerCiphers>
-        <!-- Use for self-signed: <verificationMode>none</verificationMode> -->
-        <invalidCertificateHandler>
-            <!-- Use for self-signed: <name>AcceptCertificateHandler</name> -->
-            <name>RejectCertificateHandler</name>
-        </invalidCertificateHandler>
-    </client>
-</openSSL>
+    <!-- HTTP API with TLS (HTTPS).
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <https_port>8443</https_port> -->
 
-<!-- Example config for tiered storage -->
-<!-- <storage_configuration>
-    <disks>
-        <default>
-            <keep_free_space_bytes>10485760</keep_free_space_bytes>
-        </default>
-        <s3>
-            <type>s3</type>
-            <endpoint>https://BUCKET-NAME.s3.amazonaws.com/data/</endpoint>
-            <access_key_id>ACCESS-KEY-ID</access_key_id>
-            <secret_access_key>SECRET-ACCESS-KEY</secret_access_key>
-        </s3>
-   </disks>
-   <policies>
-       <tiered>
-           <volumes>
-                <default>
-                    <disk>default</disk>
-                </default>
-                <s3>
-                    <disk>s3</disk>
-                </s3>
-            </volumes>
-        </tiered>
-    </policies>
-</storage_configuration> -->
+    <!-- Native interface with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <tcp_port_secure>9440</tcp_port_secure> -->
 
+    <!-- Native interface wrapped with PROXYv1 protocol
+         PROXYv1 header sent for every connection.
+         ClickHouse will extract information about proxy-forwarded client address from the header.
+    -->
+    <!-- <tcp_with_proxy_port>9011</tcp_with_proxy_port> -->
 
-<!-- Default root page on http[s] server. For example load UI from https://tabix.io/ when opening http://localhost:8123 -->
-    <!--
-    <http_server_default_response><![CDATA[<html ng-app="SMI2"><head><base href="http://ui.tabix.io/"></head><body><div ui-view="" class="content-ui"></div><script src="http://loader.tabix.io/master.js"></script></body></html>]]></http_server_default_response>
--->
+    <!-- Port for communication between replicas. Used for data exchange.
+         It provides low-level data access between servers.
+         This port should not be accessible from untrusted networks.
+         See also 'interserver_http_credentials'.
+         Data transferred over connections to this port should not go through untrusted networks.
+         See also 'interserver_https_port'.
+      -->
+    <interserver_http_port>9009</interserver_http_port>
 
-<!-- Port for communication between replicas. Used for data exchange. -->
-<interserver_http_port>9009</interserver_http_port>
+    <!-- Port for communication between replicas with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+         See also 'interserver_http_credentials'.
+      -->
+    <!-- <interserver_https_port>9010</interserver_https_port> -->
 
     <!-- Hostname that is used by other replicas to request this server.
-         If not specified, than it is determined analoguous to 'hostname -f' command.
-         This setting could be used to switch replication to another network interface.
-     -->
+         If not specified, then it is determined analogous to 'hostname -f' command.
+         This setting could be used to switch replication to another network interface
+         (the server may be connected to multiple networks via multiple addresses)
+      -->
+
     <!--
-    <interserver_http_host>example.yandex.ru</interserver_http_host>
--->
+    <interserver_http_host>example.clickhouse.com</interserver_http_host>
+    -->
 
-<!-- Listen specified host. use :: (wildcard IPv6 address), if you want to accept connections both with IPv4 and IPv6 from everywhere. -->
-<listen_host>::</listen_host>
-<!-- Same for hosts with disabled ipv6: -->
-<!-- <listen_host>0.0.0.0</listen_host> -->
+    <!-- You can specify credentials for authenthication between replicas.
+         This is required when interserver_https_port is accessible from untrusted networks,
+         and also recommended to avoid SSRF attacks from possibly compromised services in your network.
+      -->
+    <!--<interserver_http_credentials>
+        <user>interserver</user>
+        <password></password>
+    </interserver_http_credentials>-->
 
-<!-- Default values - try listen localhost on ipv4 and ipv6: -->
-<!-- <listen_host>0.0.0.0</listen_host> -->
+    <!-- Listen specified address.
+         Use :: (wildcard IPv6 address), if you want to accept connections both with IPv4 and IPv6 from everywhere.
+         Notes:
+         If you open connections from wildcard address, make sure that at least one of the following measures applied:
+         - server is protected by firewall and not accessible from untrusted networks;
+         - all users are restricted to subset of network addresses (see users.xml);
+         - all users have strong passwords, only secure (TLS) interfaces are accessible, or connections are only made via TLS interfaces.
+         - users without password have readonly access.
+         See also: https://www.shodan.io/search?query=clickhouse
+      -->
+    <!-- <listen_host>::</listen_host> -->
 
-<max_connections>4096</max_connections>
-<keep_alive_timeout>3</keep_alive_timeout>
 
-<!-- Maximum number of concurrent queries. -->
-<max_concurrent_queries>100</max_concurrent_queries>
+    <!-- Same for hosts without support for IPv6: -->
+    <!-- <listen_host>0.0.0.0</listen_host> -->
+
+    <!-- Default values - try listen localhost on IPv4 and IPv6. -->
+    <!--
+    <listen_host>::1</listen_host>
+    <listen_host>127.0.0.1</listen_host>
+    -->
+
+    <!-- Don't exit if IPv6 or IPv4 networks are unavailable while trying to listen. -->
+    <!-- <listen_try>0</listen_try> -->
+
+    <!-- Allow multiple servers to listen on the same address:port. This is not recommended.
+      -->
+    <!-- <listen_reuse_port>0</listen_reuse_port> -->
+
+    <!-- <listen_backlog>4096</listen_backlog> -->
+
+    <max_connections>4096</max_connections>
+
+    <!-- For 'Connection: keep-alive' in HTTP 1.1 -->
+    <keep_alive_timeout>3</keep_alive_timeout>
+
+    <!-- gRPC protocol (see src/Server/grpc_protos/clickhouse_grpc.proto for the API) -->
+    <!-- <grpc_port>9100</grpc_port> -->
+    <grpc>
+        <enable_ssl>false</enable_ssl>
+
+        <!-- The following two files are used only if enable_ssl=1 -->
+        <ssl_cert_file>/path/to/ssl_cert_file</ssl_cert_file>
+        <ssl_key_file>/path/to/ssl_key_file</ssl_key_file>
+
+        <!-- Whether server will request client for a certificate -->
+        <ssl_require_client_auth>false</ssl_require_client_auth>
+
+        <!-- The following file is used only if ssl_require_client_auth=1 -->
+        <ssl_ca_cert_file>/path/to/ssl_ca_cert_file</ssl_ca_cert_file>
+
+        <!-- Default transport compression type (can be overridden by client, see the transport_compression_type field in QueryInfo).
+             Supported algorithms: none, deflate, gzip, stream_gzip -->
+        <transport_compression_type>none</transport_compression_type>
+
+        <!-- Default transport compression level. Supported levels: 0..3 -->
+        <transport_compression_level>0</transport_compression_level>
+
+        <!-- Send/receive message size limits in bytes. -1 means unlimited -->
+        <max_send_message_size>-1</max_send_message_size>
+        <max_receive_message_size>-1</max_receive_message_size>
+
+        <!-- Enable if you want very detailed logs -->
+        <verbose_logs>false</verbose_logs>
+    </grpc>
+
+    <!-- Used with https_port and tcp_port_secure. Full ssl options list: https://github.com/ClickHouse-Extras/poco/blob/master/NetSSL_OpenSSL/include/Poco/Net/SSLManager.h#L71 -->
+    <openSSL>
+        <server> <!-- Used for https server AND secure tcp port -->
+            <!-- openssl req -subj "/CN=localhost" -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout /etc/clickhouse-server/server.key -out /etc/clickhouse-server/server.crt -->
+            <certificateFile>/etc/clickhouse-server/server.crt</certificateFile>
+            <privateKeyFile>/etc/clickhouse-server/server.key</privateKeyFile>
+            <!-- dhparams are optional. You can delete the <dhParamsFile> element.
+                 To generate dhparams, use the following command:
+                  openssl dhparam -out /etc/clickhouse-server/dhparam.pem 4096
+                 Only file format with BEGIN DH PARAMETERS is supported.
+              -->
+            <!-- <dhParamsFile>/etc/clickhouse-server/dhparam.pem</dhParamsFile>-->
+            <verificationMode>none</verificationMode>
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+        </server>
+
+        <client> <!-- Used for connecting to https dictionary source and secured Zookeeper communication -->
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+            <!-- Use for self-signed: <verificationMode>none</verificationMode> -->
+            <invalidCertificateHandler>
+                <!-- Use for self-signed: <name>AcceptCertificateHandler</name> -->
+                <name>RejectCertificateHandler</name>
+            </invalidCertificateHandler>
+        </client>
+    </openSSL>
+
+    <!-- Default root page on http[s] server. For example load UI from https://tabix.io/ when opening http://localhost:8123 -->
+    <!--
+    <http_server_default_response><![CDATA[<html ng-app="SMI2"><head><base href="http://ui.tabix.io/"></head><body><div ui-view="" class="content-ui"></div><script src="http://loader.tabix.io/master.js"></script></body></html>]]></http_server_default_response>
+    -->
+
+    <!-- Maximum number of concurrent queries. -->
+    <max_concurrent_queries>100</max_concurrent_queries>
+
+    <!-- Maximum memory usage (resident set size) for server process.
+         Zero value or unset means default. Default is "max_server_memory_usage_to_ram_ratio" of available physical RAM.
+         If the value is larger than "max_server_memory_usage_to_ram_ratio" of available physical RAM, it will be cut down.
+
+         The constraint is checked on query execution time.
+         If a query tries to allocate memory and the current memory usage plus allocation is greater
+          than specified threshold, exception will be thrown.
+
+         It is not practical to set this constraint to small values like just a few gigabytes,
+          because memory allocator will keep this amount of memory in caches and the server will deny service of queries.
+      -->
+    <max_server_memory_usage>0</max_server_memory_usage>
+
+    <!-- Maximum number of threads in the Global thread pool.
+    This will default to a maximum of 10000 threads if not specified.
+    This setting will be useful in scenarios where there are a large number
+    of distributed queries that are running concurrently but are idling most
+    of the time, in which case a higher number of threads might be required.
+    -->
+
+    <max_thread_pool_size>10000</max_thread_pool_size>
+
+    <!-- Number of workers to recycle connections in background (see also drain_timeout).
+         If the pool is full, connection will be drained synchronously. -->
+    <!-- <max_threads_for_connection_collector>10</max_threads_for_connection_collector> -->
+
+    <!-- On memory constrained environments you may have to set this to value larger than 1.
+      -->
+    <max_server_memory_usage_to_ram_ratio>0.9</max_server_memory_usage_to_ram_ratio>
+
+    <!-- Simple server-wide memory profiler. Collect a stack trace at every peak allocation step (in bytes).
+         Data will be stored in system.trace_log table with query_id = empty string.
+         Zero means disabled.
+      -->
+    <total_memory_profiler_step>4194304</total_memory_profiler_step>
+
+    <!-- Collect random allocations and deallocations and write them into system.trace_log with 'MemorySample' trace_type.
+         The probability is for every alloc/free regardless to the size of the allocation.
+         Note that sampling happens only when the amount of untracked memory exceeds the untracked memory limit,
+          which is 4 MiB by default but can be lowered if 'total_memory_profiler_step' is lowered.
+         You may want to set 'total_memory_profiler_step' to 1 for extra fine grained sampling.
+      -->
+    <total_memory_tracker_sample_probability>0</total_memory_tracker_sample_probability>
 
     <!-- Set limit on number of open files (default: maximum). This setting makes sense on Mac OS X because getrlimit() fails to retrieve
-    correct maximum value. -->
+         correct maximum value. -->
     <!-- <max_open_files>262144</max_open_files> -->
 
     <!-- Size of cache of uncompressed blocks of data, used in tables of MergeTree family.
          In bytes. Cache is single for server. Memory is allocated only on demand.
          Cache is used when 'use_uncompressed_cache' user setting turned on (off by default).
          Uncompressed cache is advantageous only for very short queries and in rare cases.
-     -->
-     <uncompressed_cache_size>8589934592</uncompressed_cache_size>
+
+         Note: uncompressed cache can be pointless for lz4, because memory bandwidth
+         is slower than multi-core decompression on some server configurations.
+         Enabling it can sometimes paradoxically make queries slower.
+      -->
+    <uncompressed_cache_size>8589934592</uncompressed_cache_size>
 
     <!-- Approximate size of mark cache, used in tables of MergeTree family.
          In bytes. Cache is single for server. Memory is allocated only on demand.
          You should not lower this value.
-     -->
-     <mark_cache_size>5368709120</mark_cache_size>
+      -->
+    <mark_cache_size>5368709120</mark_cache_size>
 
 
-     <!-- Path to data directory, with trailing slash. -->
-     <path>/var/lib/clickhouse/</path>
+    <!-- If you enable the `min_bytes_to_use_mmap_io` setting,
+         the data in MergeTree tables can be read with mmap to avoid copying from kernel to userspace.
+         It makes sense only for large files and helps only if data reside in page cache.
+         To avoid frequent open/mmap/munmap/close calls (which are very expensive due to consequent page faults)
+         and to reuse mappings from several threads and queries,
+         the cache of mapped files is maintained. Its size is the number of mapped regions (usually equal to the number of mapped files).
+         The amount of data in mapped files can be monitored
+         in system.metrics, system.metric_log by the MMappedFiles, MMappedFileBytes metrics
+         and in system.asynchronous_metrics, system.asynchronous_metrics_log by the MMapCacheCells metric,
+         and also in system.events, system.processes, system.query_log, system.query_thread_log, system.query_views_log by the
+         CreatedReadBufferMMap, CreatedReadBufferMMapFailed, MMappedFileCacheHits, MMappedFileCacheMisses events.
+         Note that the amount of data in mapped files does not consume memory directly and is not accounted
+         in query or server memory usage - because this memory can be discarded similar to OS page cache.
+         The cache is dropped (the files are closed) automatically on removal of old parts in MergeTree,
+         also it can be dropped manually by the SYSTEM DROP MMAP CACHE query.
+      -->
+    <mmap_cache_size>1000</mmap_cache_size>
 
-     <!-- Path to temporary data for processing hard queries. -->
-     <tmp_path>/var/lib/clickhouse/tmp/</tmp_path>
+    <!-- Cache size in bytes for compiled expressions.-->
+    <compiled_expression_cache_size>134217728</compiled_expression_cache_size>
 
-     <!-- Path to configuration file with users, access rights, profiles of settings, quotas. -->
-     <users_config>users.xml</users_config>
+    <!-- Cache size in elements for compiled expressions.-->
+    <compiled_expression_cache_elements_size>10000</compiled_expression_cache_elements_size>
 
-     <!-- Default profile of settings.. -->
-     <default_profile>default</default_profile>
+    <!-- Path to data directory, with trailing slash. -->
+    <path>/var/lib/clickhouse/</path>
 
-     <!-- Default database. -->
-     <default_database>default</default_database>
+    <!-- Path to temporary data for processing hard queries. -->
+    <tmp_path>/var/lib/clickhouse/tmp/</tmp_path>
+    
+    <!-- Disable AuthType plaintext_password and no_password for ACL. -->
+    <!-- <allow_plaintext_password>0</allow_plaintext_password> -->
+    <!-- <allow_no_password>0</allow_no_password> -->`
+
+    <!-- Policy from the <storage_configuration> for the temporary files.
+         If not set <tmp_path> is used, otherwise <tmp_path> is ignored.
+
+         Notes:
+         - move_factor              is ignored
+         - keep_free_space_bytes    is ignored
+         - max_data_part_size_bytes is ignored
+         - you must have exactly one volume in that policy
+    -->
+    <!-- <tmp_policy>tmp</tmp_policy> -->
+
+    <!-- Directory with user provided files that are accessible by 'file' table function. -->
+    <user_files_path>/var/lib/clickhouse/user_files/</user_files_path>
+
+    <!-- LDAP server definitions. -->
+    <ldap_servers>
+        <!-- List LDAP servers with their connection parameters here to later 1) use them as authenticators for dedicated local users,
+              who have 'ldap' authentication mechanism specified instead of 'password', or to 2) use them as remote user directories.
+             Parameters:
+                host - LDAP server hostname or IP, this parameter is mandatory and cannot be empty.
+                port - LDAP server port, default is 636 if enable_tls is set to true, 389 otherwise.
+                bind_dn - template used to construct the DN to bind to.
+                        The resulting DN will be constructed by replacing all '{user_name}' substrings of the template with the actual
+                         user name during each authentication attempt.
+                user_dn_detection - section with LDAP search parameters for detecting the actual user DN of the bound user.
+                        This is mainly used in search filters for further role mapping when the server is Active Directory. The
+                         resulting user DN will be used when replacing '{user_dn}' substrings wherever they are allowed. By default,
+                         user DN is set equal to bind DN, but once search is performed, it will be updated with to the actual detected
+                         user DN value.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}' and '{bind_dn}' substrings
+                             of the template with the actual user name and bind DN during the LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', and '{base_dn}'
+                             substrings of the template with the actual user name, bind DN, and base DN during the LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                verification_cooldown - a period of time, in seconds, after a successful bind attempt, during which a user will be assumed
+                         to be successfully authenticated for all consecutive requests without contacting the LDAP server.
+                        Specify 0 (the default) to disable caching and force contacting the LDAP server for each authentication request.
+                enable_tls - flag to trigger use of secure connection to the LDAP server.
+                        Specify 'no' for plain text (ldap://) protocol (not recommended).
+                        Specify 'yes' for LDAP over SSL/TLS (ldaps://) protocol (recommended, the default).
+                        Specify 'starttls' for legacy StartTLS protocol (plain text (ldap://) protocol, upgraded to TLS).
+                tls_minimum_protocol_version - the minimum protocol version of SSL/TLS.
+                        Accepted values are: 'ssl2', 'ssl3', 'tls1.0', 'tls1.1', 'tls1.2' (the default).
+                tls_require_cert - SSL/TLS peer certificate verification behavior.
+                        Accepted values are: 'never', 'allow', 'try', 'demand' (the default).
+                tls_cert_file - path to certificate file.
+                tls_key_file - path to certificate key file.
+                tls_ca_cert_file - path to CA certificate file.
+                tls_ca_cert_dir - path to the directory containing CA certificates.
+                tls_cipher_suite - allowed cipher suite (in OpenSSL notation).
+             Example:
+                <my_ldap_server>
+                    <host>localhost</host>
+                    <port>636</port>
+                    <bind_dn>uid={user_name},ou=users,dc=example,dc=com</bind_dn>
+                    <verification_cooldown>300</verification_cooldown>
+                    <enable_tls>yes</enable_tls>
+                    <tls_minimum_protocol_version>tls1.2</tls_minimum_protocol_version>
+                    <tls_require_cert>demand</tls_require_cert>
+                    <tls_cert_file>/path/to/tls_cert_file</tls_cert_file>
+                    <tls_key_file>/path/to/tls_key_file</tls_key_file>
+                    <tls_ca_cert_file>/path/to/tls_ca_cert_file</tls_ca_cert_file>
+                    <tls_ca_cert_dir>/path/to/tls_ca_cert_dir</tls_ca_cert_dir>
+                    <tls_cipher_suite>ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:AES256-GCM-SHA384</tls_cipher_suite>
+                </my_ldap_server>
+             Example (typical Active Directory with configured user DN detection for further role mapping):
+                <my_ad_server>
+                    <host>localhost</host>
+                    <port>389</port>
+                    <bind_dn>EXAMPLE\{user_name}</bind_dn>
+                    <user_dn_detection>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <search_filter>(&amp;(objectClass=user)(sAMAccountName={user_name}))</search_filter>
+                    </user_dn_detection>
+                    <enable_tls>no</enable_tls>
+                </my_ad_server>
+        -->
+    </ldap_servers>
+
+    <!-- To enable Kerberos authentication support for HTTP requests (GSS-SPNEGO), for those users who are explicitly configured
+          to authenticate via Kerberos, define a single 'kerberos' section here.
+         Parameters:
+            principal - canonical service principal name, that will be acquired and used when accepting security contexts.
+                    This parameter is optional, if omitted, the default principal will be used.
+                    This parameter cannot be specified together with 'realm' parameter.
+            realm - a realm, that will be used to restrict authentication to only those requests whose initiator's realm matches it.
+                    This parameter is optional, if omitted, no additional filtering by realm will be applied.
+                    This parameter cannot be specified together with 'principal' parameter.
+         Example:
+            <kerberos />
+         Example:
+            <kerberos>
+                <principal>HTTP/clickhouse.example.com@EXAMPLE.COM</principal>
+            </kerberos>
+         Example:
+            <kerberos>
+                <realm>EXAMPLE.COM</realm>
+            </kerberos>
+    -->
+
+    <!-- Sources to read users, roles, access rights, profiles of settings, quotas. -->
+    <user_directories>
+        <users_xml>
+            <!-- Path to configuration file with predefined users. -->
+            <path>users.xml</path>
+        </users_xml>
+        <local_directory>
+            <!-- Path to folder where users created by SQL commands are stored. -->
+            <path>/var/lib/clickhouse/access/</path>
+        </local_directory>
+
+        <!-- To add an LDAP server as a remote user directory of users that are not defined locally, define a single 'ldap' section
+              with the following parameters:
+                server - one of LDAP server names defined in 'ldap_servers' config section above.
+                        This parameter is mandatory and cannot be empty.
+                roles - section with a list of locally defined roles that will be assigned to each user retrieved from the LDAP server.
+                        If no roles are specified here or assigned during role mapping (below), user will not be able to perform any
+                         actions after authentication.
+                role_mapping - section with LDAP search parameters and mapping rules.
+                        When a user authenticates, while still bound to LDAP, an LDAP search is performed using search_filter and the
+                         name of the logged in user. For each entry found during that search, the value of the specified attribute is
+                         extracted. For each attribute value that has the specified prefix, the prefix is removed, and the rest of the
+                         value becomes the name of a local role defined in ClickHouse, which is expected to be created beforehand by
+                         CREATE ROLE command.
+                        There can be multiple 'role_mapping' sections defined inside the same 'ldap' section. All of them will be
+                         applied.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}', '{bind_dn}', and '{user_dn}'
+                             substrings of the template with the actual user name, bind DN, and user DN during each LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', '{user_dn}', and
+                             '{base_dn}' substrings of the template with the actual user name, bind DN, user DN, and base DN during
+                             each LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                    attribute - attribute name whose values will be returned by the LDAP search. 'cn', by default.
+                    prefix - prefix, that will be expected to be in front of each string in the original list of strings returned by
+                             the LDAP search. Prefix will be removed from the original strings and resulting strings will be treated
+                             as local role names. Empty, by default.
+             Example:
+                <ldap>
+                    <server>my_ldap_server</server>
+                    <roles>
+                        <my_local_role1 />
+                        <my_local_role2 />
+                    </roles>
+                    <role_mapping>
+                        <base_dn>ou=groups,dc=example,dc=com</base_dn>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=groupOfNames)(member={bind_dn}))</search_filter>
+                        <attribute>cn</attribute>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+             Example (typical Active Directory with role mapping that relies on the detected user DN):
+                <ldap>
+                    <server>my_ad_server</server>
+                    <role_mapping>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <attribute>CN</attribute>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=group)(member={user_dn}))</search_filter>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+        -->
+    </user_directories>
+
+    <!-- Default profile of settings. -->
+    <default_profile>default</default_profile>
+
+    <!-- Comma-separated list of prefixes for user-defined settings. -->
+    <custom_settings_prefixes></custom_settings_prefixes>
+
+    <!-- System profile of settings. This settings are used by internal processes (Distributed DDL worker and so on). -->
+    <!-- <system_profile>default</system_profile> -->
+
+    <!-- Buffer profile of settings.
+         This settings are used by Buffer storage to flush data to the underlying table.
+         Default: used from system_profile directive.
+    -->
+    <!-- <buffer_profile>default</buffer_profile> -->
+
+    <!-- Default database. -->
+    <default_database>default</default_database>
 
     <!-- Server time zone could be set here.
 
@@ -143,62 +573,266 @@
          If not specified, system time zone at server startup is used.
 
          Please note, that server could display time zone alias instead of specified name.
-         Example: W-SU is an alias for Europe/Moscow and Zulu is an alias for UTC.
-     -->
-     <!-- <timezone>Europe/Moscow</timezone> -->
+         Example: Zulu is an alias for UTC.
+    -->
+    <!-- <timezone>UTC</timezone> -->
 
     <!-- You can specify umask here (see "man umask"). Server will apply it on startup.
          Number is always parsed as octal. Default umask is 027 (other users cannot read logs, data files, etc; group can only read).
-     -->
-     <!-- <umask>022</umask> -->
+    -->
+    <!-- <umask>022</umask> -->
+
+    <!-- Perform mlockall after startup to lower first queries latency
+          and to prevent clickhouse executable from being paged out under high IO load.
+         Enabling this option is recommended but will lead to increased startup time for up to a few seconds.
+    -->
+    <mlock_executable>true</mlock_executable>
+
+    <!-- Reallocate memory for machine code ("text") using huge pages. Highly experimental. -->
+    <remap_executable>false</remap_executable>
+
+    <![CDATA[
+         Uncomment below in order to use JDBC table engine and function.
+
+         To install and run JDBC bridge in background:
+         * [Debian/Ubuntu]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           apt install --no-install-recommends -f ./clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           clickhouse-jdbc-bridge &
+
+         * [CentOS/RHEL]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           yum localinstall -y clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           clickhouse-jdbc-bridge &
+
+         Please refer to https://github.com/ClickHouse/clickhouse-jdbc-bridge#usage for more information.
+    ]]>
+    <!--
+    <jdbc_bridge>
+        <host>127.0.0.1</host>
+        <port>9019</port>
+    </jdbc_bridge>
+    -->
 
     <!-- Configuration of clusters that could be used in Distributed tables.
-         https://clickhouse.yandex/reference_en.html#Distributed
-     -->
-     <remote_servers incl="clickhouse_remote_servers" >
+         https://clickhouse.com/docs/en/operations/table_engines/distributed/
+      -->
+    <remote_servers>
         <!-- Test only shard config for testing distributed storage -->
         <test_shard_localhost>
+            <!-- Inter-server per-cluster secret for Distributed queries
+                 default: no secret (no authentication will be performed)
+
+                 If set, then Distributed queries will be validated on shards, so at least:
+                 - such cluster should exist on the shard,
+                 - such cluster should have the same secret.
+
+                 And also (and which is more important), the initial_user will
+                 be used as current user for the query.
+
+                 Right now the protocol is pretty simple and it only takes into account:
+                 - cluster name
+                 - query
+
+                 Also it will be nice if the following will be implemented:
+                 - source hostname (see interserver_http_host), but then it will depends from DNS,
+                   it can use IP address instead, but then the you need to get correct on the initiator node.
+                 - target hostname / ip address (same notes as for source hostname)
+                 - time-based security tokens
+            -->
+            <!-- <secret></secret> -->
+
+            <shard>
+                <!-- Optional. Whether to write data to just one of the replicas. Default: false (write data to all replicas). -->
+                <!-- <internal_replication>false</internal_replication> -->
+                <!-- Optional. Shard weight when writing data. Default: 1. -->
+                <!-- <weight>1</weight> -->
+                <replica>
+                    <host>localhost</host>
+                    <port>9000</port>
+                    <!-- Optional. Priority of the replica for load_balancing. Default: 1 (less value has more priority). -->
+                    <!-- <priority>1</priority> -->
+                </replica>
+            </shard>
+        </test_shard_localhost>
+        <test_cluster_one_shard_three_replicas_localhost>
+            <shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <!--shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard-->
+        </test_cluster_one_shard_three_replicas_localhost>
+        <test_cluster_two_shards_localhost>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+        </test_cluster_two_shards_localhost>
+        <test_cluster_two_shards>
+            <shard>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards>
+        <test_cluster_two_shards_internal_replication>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards_internal_replication>
+        <test_shard_localhost_secure>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>9440</port>
+                    <secure>1</secure>
+                </replica>
+            </shard>
+        </test_shard_localhost_secure>
+        <test_unavailable_shard>
             <shard>
                 <replica>
                     <host>localhost</host>
                     <port>9000</port>
                 </replica>
             </shard>
-        </test_shard_localhost>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>1</port>
+                </replica>
+            </shard>
+        </test_unavailable_shard>
     </remote_servers>
 
+    <!-- The list of hosts allowed to use in URL-related storage engines and table functions.
+        If this section is not present in configuration, all hosts are allowed.
+    -->
+    <!--<remote_url_allow_hosts>-->
+        <!-- Host should be specified exactly as in URL. The name is checked before DNS resolution.
+            Example: "clickhouse.com", "clickhouse.com." and "www.clickhouse.com" are different hosts.
+                    If port is explicitly specified in URL, the host:port is checked as a whole.
+                    If host specified here without port, any port with this host allowed.
+                    "clickhouse.com" -> "clickhouse.com:443", "clickhouse.com:80" etc. is allowed, but "clickhouse.com:80" -> only "clickhouse.com:80" is allowed.
+            If the host is specified as IP address, it is checked as specified in URL. Example: "[2a02:6b8:a::a]".
+            If there are redirects and support for redirects is enabled, every redirect (the Location field) is checked.
+            Host should be specified using the host xml tag:
+                    <host>clickhouse.com</host>
+        -->
+
+        <!-- Regular expression can be specified. RE2 engine is used for regexps.
+            Regexps are not aligned: don't forget to add ^ and $. Also don't forget to escape dot (.) metacharacter
+            (forgetting to do so is a common source of error).
+        -->
+    <!--</remote_url_allow_hosts>-->
 
     <!-- If element has 'incl' attribute, then for it's value will be used corresponding substitution from another file.
          By default, path to file with substitutions is /etc/metrika.xml. It could be changed in config in 'include_from' element.
-         Values for substitutions are specified in /yandex/name_of_substitution elements in that file.
-     -->
+         Values for substitutions are specified in /clickhouse/name_of_substitution elements in that file.
+      -->
 
     <!-- ZooKeeper is used to store metadata about replicas, when using Replicated tables.
          Optional. If you don't use replicated tables, you could omit that.
 
-         See https://clickhouse.yandex/reference_en.html#Data%20replication
-     -->
-     <zookeeper incl="zookeeper-servers" optional="true" />
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/
+      -->
+
+    <!--
+    <zookeeper>
+        <node>
+            <host>example1</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example2</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example3</host>
+            <port>2181</port>
+        </node>
+    </zookeeper>
+    -->
 
     <!-- Substitutions for parameters of replicated tables.
           Optional. If you don't use replicated tables, you could omit that.
 
-         See https://clickhouse.yandex/reference_en.html#Creating%20replicated%20tables
-     -->
-     <macros incl="macros" optional="true" />
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/#creating-replicated-tables
+      -->
+    <!--
+    <macros>
+        <shard>01</shard>
+        <replica>example01-01-1</replica>
+    </macros>
+    -->
 
 
-     <!-- Reloading interval for embedded dictionaries, in seconds. Default: 3600. -->
-     <builtin_dictionaries_reload_interval>3600</builtin_dictionaries_reload_interval>
+    <!-- Reloading interval for embedded dictionaries, in seconds. Default: 3600. -->
+    <builtin_dictionaries_reload_interval>3600</builtin_dictionaries_reload_interval>
 
 
-     <!-- Maximum session timeout, in seconds. Default: 3600. -->
-     <max_session_timeout>3600</max_session_timeout>
+    <!-- Maximum session timeout, in seconds. Default: 3600. -->
+    <max_session_timeout>3600</max_session_timeout>
 
-     <!-- Default session timeout, in seconds. Default: 60. -->
-     <default_session_timeout>60</default_session_timeout>
+    <!-- Default session timeout, in seconds. Default: 60. -->
+    <default_session_timeout>60</default_session_timeout>
 
-     <!-- Sending data to Graphite for monitoring. Several sections can be defined. -->
+    <!-- Sending data to Graphite for monitoring. Several sections can be defined. -->
     <!--
         interval - send every X second
         root_path - prefix for keys
@@ -214,10 +848,11 @@
         <timeout>0.1</timeout>
         <interval>60</interval>
         <root_path>one_min</root_path>
-        <hostname_in_path>true<hostname_in_path>
+        <hostname_in_path>true</hostname_in_path>
 
         <metrics>true</metrics>
         <events>true</events>
+        <events_cumulative>false</events_cumulative>
         <asynchronous_metrics>true</asynchronous_metrics>
     </graphite>
     <graphite>
@@ -229,56 +864,219 @@
 
         <metrics>true</metrics>
         <events>true</events>
+        <events_cumulative>false</events_cumulative>
         <asynchronous_metrics>false</asynchronous_metrics>
     </graphite>
--->
+    -->
 
+    <!-- Serve endpoint for Prometheus monitoring. -->
+    <!--
+        endpoint - mertics path (relative to root, statring with "/")
+        port - port to setup server. If not defined or 0 than http_port used
+        metrics - send data from table system.metrics
+        events - send data from table system.events
+        asynchronous_metrics - send data from table system.asynchronous_metrics
+        status_info - send data from different component from CH, ex: Dictionaries status
+    -->
+    <!--
+    <prometheus>
+        <endpoint>/metrics</endpoint>
+        <port>9363</port>
 
-<!-- Query log. Used only for queries with setting log_queries = 1. -->
-<query_log>
+        <metrics>true</metrics>
+        <events>true</events>
+        <asynchronous_metrics>true</asynchronous_metrics>
+        <status_info>true</status_info>
+    </prometheus>
+    -->
+
+    <!-- Query log. Used only for queries with setting log_queries = 1. -->
+    <query_log>
         <!-- What table to insert data. If table is not exist, it will be created.
              When query log structure is changed after system update,
               then old table will be renamed and new table will be created automatically.
+        -->
+        <database>system</database>
+        <table>query_log</table>
+        <!--
+            PARTITION BY expr: https://clickhouse.com/docs/en/table_engines/mergetree-family/custom_partitioning_key/
+            Example:
+                event_date
+                toMonday(event_date)
+                toYYYYMM(event_date)
+                toStartOfHour(event_time)
+        -->
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <!--
+            Table TTL specification: https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/mergetree/#mergetree-table-ttl
+            Example:
+                event_date + INTERVAL 1 WEEK
+                event_date + INTERVAL 7 DAY DELETE
+                event_date + INTERVAL 2 WEEK TO DISK 'bbb'
+
+        <ttl>event_date + INTERVAL 30 DAY DELETE</ttl>
+        -->
+
+        <!-- Instead of partition_by, you can provide full engine expression (starting with ENGINE = ) with parameters,
+             Example: <engine>ENGINE = MergeTree PARTITION BY toYYYYMM(event_date) ORDER BY (event_date, event_time) SETTINGS index_granularity = 1024</engine>
           -->
-          <database>system</database>
-          <table>query_log</table>
 
-          <!-- Interval of flushing data. -->
-          <flush_interval_milliseconds>7500</flush_interval_milliseconds>
-      </query_log>
+        <!-- Interval of flushing data. -->
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_log>
 
+    <!-- Trace log. Stores stack traces collected by query profilers.
+         See query_profiler_real_time_period_ns and query_profiler_cpu_time_period_ns settings. -->
+    <trace_log>
+        <database>system</database>
+        <table>trace_log</table>
 
-    <!-- Uncomment if use part_log
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </trace_log>
+
+    <!-- Query thread log. Has information about all threads participated in query execution.
+         Used only for queries with setting log_query_threads = 1. -->
+    <query_thread_log>
+        <database>system</database>
+        <table>query_thread_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_thread_log>
+
+    <!-- Query views log. Has information about all dependent views associated with a query.
+         Used only for queries with setting log_query_views = 1. -->
+    <query_views_log>
+        <database>system</database>
+        <table>query_views_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_views_log>
+
+    <!-- Uncomment if use part log.
+         Part log contains information about all actions with parts in MergeTree tables (creation, deletion, merges, downloads).-->
     <part_log>
         <database>system</database>
         <table>part_log</table>
-
+        <partition_by>toYYYYMM(event_date)</partition_by>
         <flush_interval_milliseconds>7500</flush_interval_milliseconds>
     </part_log>
--->
+
+    <!-- Uncomment to write text log into table.
+         Text log contains all information from usual server log but stores it in structured and efficient way.
+         The level of the messages that goes to the table can be limited (<level>), if not specified all messages will go to the table.
+    <text_log>
+        <database>system</database>
+        <table>text_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <level></level>
+    </text_log>
+    -->
+
+    <!-- Metric log contains rows with current values of ProfileEvents, CurrentMetrics collected with "collect_interval_milliseconds" interval. -->
+    <metric_log>
+        <database>system</database>
+        <table>metric_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <collect_interval_milliseconds>1000</collect_interval_milliseconds>
+    </metric_log>
+
+    <!--
+        Asynchronous metric log contains values of metrics from
+        system.asynchronous_metrics.
+    -->
+    <asynchronous_metric_log>
+        <database>system</database>
+        <table>asynchronous_metric_log</table>
+        <!--
+            Asynchronous metrics are updated once a minute, so there is
+            no need to flush more often.
+        -->
+        <flush_interval_milliseconds>7000</flush_interval_milliseconds>
+    </asynchronous_metric_log>
+
+    <!--
+        OpenTelemetry log contains OpenTelemetry trace spans.
+    -->
+    <opentelemetry_span_log>
+        <!--
+            The default table creation code is insufficient, this <engine> spec
+            is a workaround. There is no 'event_time' for this log, but two times,
+            start and finish. It is sorted by finish time, to avoid inserting
+            data too far away in the past (probably we can sometimes insert a span
+            that is seconds earlier than the last span in the table, due to a race
+            between several spans inserted in parallel). This gives the spans a
+            global order that we can use to e.g. retry insertion into some external
+            system.
+        -->
+        <engine>
+            engine MergeTree
+            partition by toYYYYMM(finish_date)
+            order by (finish_date, finish_time_us, trace_id)
+        </engine>
+        <database>system</database>
+        <table>opentelemetry_span_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </opentelemetry_span_log>
 
 
-    <!-- Parameters for embedded dictionaries, used in Yandex.Metrica.
-         See https://clickhouse.yandex/reference_en.html#Internal%20dictionaries
-     -->
+    <!-- Crash log. Stores stack traces for fatal errors.
+         This table is normally empty. -->
+    <crash_log>
+        <database>system</database>
+        <table>crash_log</table>
 
-     <!-- Path to file with region hierarchy. -->
-     <!-- <path_to_regions_hierarchy_file>/opt/geo/regions_hierarchy.txt</path_to_regions_hierarchy_file> -->
+        <partition_by />
+        <flush_interval_milliseconds>1000</flush_interval_milliseconds>
+    </crash_log>
 
-     <!-- Path to directory with files containing names of regions -->
-     <!-- <path_to_regions_names_files>/opt/geo/</path_to_regions_names_files> -->
+    <!-- Session log. Stores user log in (successful or not) and log out events.
 
+        Note: session log has known security issues and should not be used in production.
+    -->
+    <!-- <session_log>
+        <database>system</database>
+        <table>session_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </session_log> -->
+
+    <!-- Profiling on Processors level. -->
+    <processors_profile_log>
+        <database>system</database>
+        <table>processors_profile_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </processors_profile_log>
+
+    <!-- <top_level_domains_path>/var/lib/clickhouse/top_level_domains/</top_level_domains_path> -->
+    <!-- Custom TLD lists.
+         Format: <name>/path/to/file</name>
+
+         Changes will not be applied w/o server restart.
+         Path to the list is under top_level_domains_path (see above).
+    -->
+    <top_level_domains_lists>
+        <!--
+        <public_suffix_list>/path/to/public_suffix_list.dat</public_suffix_list>
+        -->
+    </top_level_domains_lists>
 
     <!-- Configuration of external dictionaries. See:
-         https://clickhouse.yandex/reference_en.html#External%20Dictionaries
-     -->
-     <dictionaries_config>*_dictionary.xml</dictionaries_config>
+         https://clickhouse.com/docs/en/sql-reference/dictionaries/external-dictionaries/external-dicts
+    -->
+    <dictionaries_config>*_dictionary.xml</dictionaries_config>
+
+    <!-- Configuration of user defined executable functions -->
+    <user_defined_executable_functions_config>*_function.xml</user_defined_executable_functions_config>
 
     <!-- Uncomment if you want data to be compressed 30-100% better.
          Don't do that if you just started using ClickHouse.
-     -->
-     <compression incl="clickhouse_compression">
+      -->
     <!--
+    <compression>
         <!- - Set of variants. Checked in order. Last matching case wins. If nothing matches, lz4 will be used. - ->
         <case>
 
@@ -289,14 +1087,61 @@
             <!- - What compression method to use. - ->
             <method>zstd</method>
         </case>
+    </compression>
     -->
-</compression>
+
+    <!-- Configuration of encryption. The server executes a command to
+         obtain an encryption key at startup if such a command is
+         defined, or encryption codecs will be disabled otherwise. The
+         command is executed through /bin/sh and is expected to write
+         a Base64-encoded key to the stdout. -->
+    <encryption_codecs>
+        <!-- aes_128_gcm_siv -->
+            <!-- Example of getting hex key from env -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!--key_hex from_env="..."></key_hex -->
+
+            <!-- Example of multiple hex keys. They can be imported from env or be written down in config-->
+            <!-- the code should use these keys and throw an exception if their length is not 16 bytes -->
+            <!-- key_hex id="0">...</key_hex -->
+            <!-- key_hex id="1" from_env=".."></key_hex -->
+            <!-- key_hex id="2">...</key_hex -->
+            <!-- current_key_id>2</current_key_id -->
+
+            <!-- Example of getting hex key from config -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!-- key>...</key -->
+
+            <!-- example of adding nonce -->
+            <!-- nonce>...</nonce -->
+
+        <!-- /aes_128_gcm_siv -->
+    </encryption_codecs>
 
     <!-- Allow to execute distributed DDL queries (CREATE, DROP, ALTER, RENAME) on cluster.
-    Works only if ZooKeeper is enabled. Comment it if such functionality isn't required. -->
+         Works only if ZooKeeper is enabled. Comment it if such functionality isn't required. -->
     <distributed_ddl>
         <!-- Path in ZooKeeper to queue with DDL queries -->
         <path>/clickhouse/task_queue/ddl</path>
+
+        <!-- Settings from this profile will be used to execute DDL queries -->
+        <!-- <profile>default</profile> -->
+
+        <!-- Controls how much ON CLUSTER queries can be run simultaneously. -->
+        <!-- <pool_size>1</pool_size> -->
+
+        <!--
+             Cleanup settings (active tasks will not be removed)
+        -->
+
+        <!-- Controls task TTL (default 1 week) -->
+        <!-- <task_max_lifetime>604800</task_max_lifetime> -->
+
+        <!-- Controls how often cleanup should be performed (in seconds) -->
+        <!-- <cleanup_delay_period>60</cleanup_delay_period> -->
+
+        <!-- Controls how many tasks could be in the queue -->
+        <!-- <max_tasks_in_queue>1000</max_tasks_in_queue> -->
     </distributed_ddl>
 
     <!-- Settings to fine tune MergeTree tables. See documentation in source code, in MergeTreeSettings.h -->
@@ -304,239 +1149,156 @@
     <merge_tree>
         <max_suspicious_broken_parts>5</max_suspicious_broken_parts>
     </merge_tree>
--->
+    -->
 
     <!-- Protection from accidental DROP.
          If size of a MergeTree table is greater than max_table_size_to_drop (in bytes) than table could not be dropped with any DROP query.
-         If you want do delete one table and don't want to restart clickhouse-server, you could create special file <clickhouse-path>/flags/force_drop_table and make DROP once.
-         By default max_table_size_to_drop is 50GB, max_table_size_to_drop=0 allows to DROP any tables.
+         If you want do delete one table and don't want to change clickhouse-server config, you could create special file <clickhouse-path>/flags/force_drop_table and make DROP once.
+         By default max_table_size_to_drop is 50GB; max_table_size_to_drop=0 allows to DROP any tables.
+         The same for max_partition_size_to_drop.
          Uncomment to disable protection.
-     -->
-     <!-- <max_table_size_to_drop>0</max_table_size_to_drop> -->
+    -->
+    <!-- <max_table_size_to_drop>0</max_table_size_to_drop> -->
+    <!-- <max_partition_size_to_drop>0</max_partition_size_to_drop> -->
 
-     <!-- Example of parameters for GraphiteMergeTree table engine -->
-     <graphite_rollup>
-        <!-- carbon -->
+    <!-- Example of parameters for GraphiteMergeTree table engine -->
+    <graphite_rollup_example>
         <pattern>
-            <regexp>^carbon\.</regexp>
+            <regexp>click_cost</regexp>
             <function>any</function>
             <retention>
                 <age>0</age>
+                <precision>3600</precision>
+            </retention>
+            <retention>
+                <age>86400</age>
                 <precision>60</precision>
             </retention>
-            <retention>
-                <age>7776000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
         </pattern>
-        <!-- collectd -->
-        <pattern>
-            <regexp>^collectd\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>10</precision>
-            </retention>
-            <retention>
-                <age>43200</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- high -->
-        <pattern>
-            <regexp>^high\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>10</precision>
-            </retention>
-            <retention>
-                <age>172800</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- medium -->
-        <pattern>
-            <regexp>^medium\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- low -->
-        <pattern>
-            <regexp>^low\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>600</precision>
-            </retention>
-            <retention>
-                <age>15552000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>31536000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>126144000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>252288000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>315360000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- default -->
         <default>
-            <function>any</function>
+            <function>max</function>
             <retention>
                 <age>0</age>
                 <precision>60</precision>
             </retention>
             <retention>
-                <age>864000</age>
-                <precision>900</precision>
+                <age>3600</age>
+                <precision>300</precision>
             </retention>
             <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
+                <age>86400</age>
                 <precision>3600</precision>
             </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
         </default>
-    </graphite_rollup>
+    </graphite_rollup_example>
 
     <!-- Directory in <clickhouse-path> containing schema files for various input formats.
          The directory will be created if it doesn't exist.
-     -->
-     <format_schema_path>/var/lib/clickhouse/format_schemas/</format_schema_path>
- </yandex>
+      -->
+    <format_schema_path>/var/lib/clickhouse/format_schemas/</format_schema_path>
+
+    <!-- Default query masking rules, matching lines would be replaced with something else in the logs
+        (both text logs and system.query_log).
+        name - name for the rule (optional)
+        regexp - RE2 compatible regular expression (mandatory)
+        replace - substitution string for sensitive data (optional, by default - six asterisks)
+    -->
+    <query_masking_rules>
+        <rule>
+            <name>hide encrypt/decrypt arguments</name>
+            <regexp>((?:aes_)?(?:encrypt|decrypt)(?:_mysql)?)\s*\(\s*(?:'(?:\\'|.)+'|.*?)\s*\)</regexp>
+            <!-- or more secure, but also more invasive:
+                (aes_\w+)\s*\(.*\)
+            -->
+            <replace>\1(???)</replace>
+        </rule>
+    </query_masking_rules>
+
+    <!-- Uncomment to use custom http handlers.
+        rules are checked from top to bottom, first match runs the handler
+            url - to match request URL, you can use 'regex:' prefix to use regex match(optional)
+            methods - to match request method, you can use commas to separate multiple method matches(optional)
+            headers - to match request headers, match each child element(child element name is header name), you can use 'regex:' prefix to use regex match(optional)
+        handler is request handler
+            type - supported types: static, dynamic_query_handler, predefined_query_handler
+            query - use with predefined_query_handler type, executes query when the handler is called
+            query_param_name - use with dynamic_query_handler type, extracts and executes the value corresponding to the <query_param_name> value in HTTP request params
+            status - use with static type, response status code
+            content_type - use with static type, response content-type
+            response_content - use with static type, Response content sent to client, when using the prefix 'file://' or 'config://', find the content from the file or configuration send to client.
+
+    <http_handlers>
+        <rule>
+            <url>/</url>
+            <methods>POST,GET</methods>
+            <headers><pragma>no-cache</pragma></headers>
+            <handler>
+                <type>dynamic_query_handler</type>
+                <query_param_name>query</query_param_name>
+            </handler>
+        </rule>
+
+        <rule>
+            <url>/predefined_query</url>
+            <methods>POST,GET</methods>
+            <handler>
+                <type>predefined_query_handler</type>
+                <query>SELECT * FROM system.settings</query>
+            </handler>
+        </rule>
+
+        <rule>
+            <handler>
+                <type>static</type>
+                <status>200</status>
+                <content_type>text/plain; charset=UTF-8</content_type>
+                <response_content>config://http_server_default_response</response_content>
+            </handler>
+        </rule>
+    </http_handlers>
+    -->
+
+    <send_crash_reports>
+        <!-- Changing <enabled> to true allows sending crash reports to -->
+        <!-- the ClickHouse core developers team via Sentry https://sentry.io -->
+        <!-- Doing so at least in pre-production environments is highly appreciated -->
+        <enabled>false</enabled>
+        <!-- Change <anonymize> to true if you don't feel comfortable attaching the server hostname to the crash report -->
+        <anonymize>false</anonymize>
+        <!-- Default endpoint should be changed to different Sentry DSN only if you have -->
+        <!-- some in-house engineers or hired consultants who're going to debug ClickHouse issues for you -->
+        <endpoint>https://6f33034cfe684dd7a3ab9875e57b1c8d@o388870.ingest.sentry.io/5226277</endpoint>
+    </send_crash_reports>
+
+    <!-- Uncomment to disable ClickHouse internal DNS caching. -->
+    <!-- <disable_internal_dns_cache>1</disable_internal_dns_cache> -->
+
+    <!-- You can also configure rocksdb like this: -->
+    <!--
+    <rocksdb>
+        <options>
+            <max_background_jobs>8</max_background_jobs>
+        </options>
+        <column_family_options>
+            <num_levels>2</num_levels>
+        </column_family_options>
+        <tables>
+            <table>
+                <name>TABLE</name>
+                <options>
+                    <max_background_jobs>8</max_background_jobs>
+                </options>
+                <column_family_options>
+                    <num_levels>2</num_levels>
+                </column_family_options>
+            </table>
+        </tables>
+    </rocksdb>
+    -->
+
+    <!-- Uncomment if enable merge tree metadata cache -->
+    <merge_tree_metadata_cache>
+        <lru_cache_size>268435456</lru_cache_size>
+        <continue_if_corrupted>true</continue_if_corrupted>
+    </merge_tree_metadata_cache>
+</clickhouse>
diff --git a/deploy/docker-swarm/clickhouse-setup/clickhouse-storage.xml b/deploy/docker-swarm/clickhouse-setup/clickhouse-storage.xml
new file mode 100644
index 0000000000..aab0c15da7
--- /dev/null
+++ b/deploy/docker-swarm/clickhouse-setup/clickhouse-storage.xml
@@ -0,0 +1,28 @@
+<?xml version="1.0"?>
+<clickhouse>
+<storage_configuration>
+    <disks>
+        <default>
+            <keep_free_space_bytes>10485760</keep_free_space_bytes>
+        </default>
+        <s3>
+            <type>s3</type>
+            <endpoint>https://BUCKET-NAME.s3.amazonaws.com/data/</endpoint>
+            <access_key_id>ACCESS-KEY-ID</access_key_id>
+            <secret_access_key>SECRET-ACCESS-KEY</secret_access_key>
+        </s3>
+   </disks>
+   <policies>
+       <tiered>
+           <volumes>
+                <default>
+                    <disk>default</disk>
+                </default>
+                <s3>
+                    <disk>s3</disk>
+                </s3>
+            </volumes>
+        </tiered>
+    </policies>
+</storage_configuration>
+</clickhouse>
diff --git a/deploy/docker-swarm/clickhouse-setup/clickhouse-users.xml b/deploy/docker-swarm/clickhouse-setup/clickhouse-users.xml
new file mode 100644
index 0000000000..f18562071d
--- /dev/null
+++ b/deploy/docker-swarm/clickhouse-setup/clickhouse-users.xml
@@ -0,0 +1,123 @@
+<?xml version="1.0"?>
+<clickhouse>
+    <!-- See also the files in users.d directory where the settings can be overridden. -->
+
+    <!-- Profiles of settings. -->
+    <profiles>
+        <!-- Default settings. -->
+        <default>
+            <!-- Maximum memory usage for processing single query, in bytes. -->
+            <max_memory_usage>10000000000</max_memory_usage>
+
+            <!-- How to choose between replicas during distributed query processing.
+                 random - choose random replica from set of replicas with minimum number of errors
+                 nearest_hostname - from set of replicas with minimum number of errors, choose replica
+                  with minimum number of different symbols between replica's hostname and local hostname
+                  (Hamming distance).
+                 in_order - first live replica is chosen in specified order.
+                 first_or_random - if first replica one has higher number of errors, pick a random one from replicas with minimum number of errors.
+            -->
+            <load_balancing>random</load_balancing>
+        </default>
+
+        <!-- Profile that allows only read queries. -->
+        <readonly>
+            <readonly>1</readonly>
+        </readonly>
+    </profiles>
+
+    <!-- Users and ACL. -->
+    <users>
+        <!-- If user name was not specified, 'default' user is used. -->
+        <default>
+            <!-- See also the files in users.d directory where the password can be overridden.
+
+                 Password could be specified in plaintext or in SHA256 (in hex format).
+
+                 If you want to specify password in plaintext (not recommended), place it in 'password' element.
+                 Example: <password>qwerty</password>.
+                 Password could be empty.
+
+                 If you want to specify SHA256, place it in 'password_sha256_hex' element.
+                 Example: <password_sha256_hex>65e84be33532fb784c48129675f9eff3a682b27168c0ea744b2cf58ee02337c5</password_sha256_hex>
+                 Restrictions of SHA256: impossibility to connect to ClickHouse using MySQL JS client (as of July 2019).
+
+                 If you want to specify double SHA1, place it in 'password_double_sha1_hex' element.
+                 Example: <password_double_sha1_hex>e395796d6546b1b65db9d665cd43f0e858dd4303</password_double_sha1_hex>
+
+                 If you want to specify a previously defined LDAP server (see 'ldap_servers' in the main config) for authentication,
+                  place its name in 'server' element inside 'ldap' element.
+                 Example: <ldap><server>my_ldap_server</server></ldap>
+
+                 If you want to authenticate the user via Kerberos (assuming Kerberos is enabled, see 'kerberos' in the main config),
+                  place 'kerberos' element instead of 'password' (and similar) elements.
+                 The name part of the canonical principal name of the initiator must match the user name for authentication to succeed.
+                 You can also place 'realm' element inside 'kerberos' element to further restrict authentication to only those requests
+                  whose initiator's realm matches it.
+                 Example: <kerberos />
+                 Example: <kerberos><realm>EXAMPLE.COM</realm></kerberos>
+
+                 How to generate decent password:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha256sum | tr -d '-'
+                 In first line will be password and in second - corresponding SHA256.
+
+                 How to generate double SHA1:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha1sum | tr -d '-' | xxd -r -p | sha1sum | tr -d '-'
+                 In first line will be password and in second - corresponding double SHA1.
+            -->
+            <password></password>
+
+            <!-- List of networks with open access.
+
+                 To open access from everywhere, specify:
+                    <ip>::/0</ip>
+
+                 To open access only from localhost, specify:
+                    <ip>::1</ip>
+                    <ip>127.0.0.1</ip>
+
+                 Each element of list has one of the following forms:
+                 <ip> IP-address or network mask. Examples: 213.180.204.3 or 10.0.0.1/8 or 10.0.0.1/255.255.255.0
+                     2a02:6b8::3 or 2a02:6b8::3/64 or 2a02:6b8::3/ffff:ffff:ffff:ffff::.
+                 <host> Hostname. Example: server01.clickhouse.com.
+                     To check access, DNS query is performed, and all received addresses compared to peer address.
+                 <host_regexp> Regular expression for host names. Example, ^server\d\d-\d\d-\d\.clickhouse\.com$
+                     To check access, DNS PTR query is performed for peer address and then regexp is applied.
+                     Then, for result of PTR query, another DNS query is performed and all received addresses compared to peer address.
+                     Strongly recommended that regexp is ends with $
+                 All results of DNS requests are cached till server restart.
+            -->
+            <networks>
+                <ip>::/0</ip>
+            </networks>
+
+            <!-- Settings profile for user. -->
+            <profile>default</profile>
+
+            <!-- Quota for user. -->
+            <quota>default</quota>
+
+            <!-- User can create other users and grant rights to them. -->
+            <!-- <access_management>1</access_management> -->
+        </default>
+    </users>
+
+    <!-- Quotas. -->
+    <quotas>
+        <!-- Name of quota. -->
+        <default>
+            <!-- Limits for time interval. You could specify many intervals with different limits. -->
+            <interval>
+                <!-- Length of interval. -->
+                <duration>3600</duration>
+
+                <!-- No limits. Just calculate resource usage for time interval. -->
+                <queries>0</queries>
+                <errors>0</errors>
+                <result_rows>0</result_rows>
+                <read_rows>0</read_rows>
+                <execution_time>0</execution_time>
+            </interval>
+        </default>
+    </quotas>
+</clickhouse>
diff --git a/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml b/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml
index bc58e956b5..45b4137d11 100644
--- a/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml
+++ b/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml
@@ -2,12 +2,14 @@ version: "3.9"
 
 services:
   clickhouse:
-    image: yandex/clickhouse-server:21.12.3.32
+    image: clickhouse/clickhouse-server:22.4.5-alpine
     # ports:
     #   - "9000:9000"
     #   - "8123:8123"
     volumes:
       - ./clickhouse-config.xml:/etc/clickhouse-server/config.xml
+      - ./clickhouse-users.xml:/etc/clickhouse-server/users.xml
+      # - ./clickhouse-storage.xml:/etc/clickhouse-server/config.d/storage.xml
       - ./data/clickhouse/:/var/lib/clickhouse/
     deploy:
       restart_policy:
diff --git a/deploy/docker/clickhouse-setup/clickhouse-config.xml b/deploy/docker/clickhouse-setup/clickhouse-config.xml
index 7a5f40d299..3bb26a3a36 100644
--- a/deploy/docker/clickhouse-setup/clickhouse-config.xml
+++ b/deploy/docker/clickhouse-setup/clickhouse-config.xml
@@ -1,137 +1,567 @@
 <?xml version="1.0"?>
-<yandex>
+<!--
+  NOTE: User and query level settings are set up in "users.xml" file.
+  If you have accidentally specified user-level settings here, server won't start.
+  You can either move the settings to the right place inside "users.xml" file
+   or add <skip_check_for_incorrect_settings>1</skip_check_for_incorrect_settings> here.
+-->
+<clickhouse>
     <logger>
-        <level>information</level>
-        <console>1</console>
+        <!-- Possible levels [1]:
+
+          - none (turns off logging)
+          - fatal
+          - critical
+          - error
+          - warning
+          - notice
+          - information
+          - debug
+          - trace
+          - test (not for production usage)
+
+            [1]: https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/Logger.h#L105-L114
+        -->
+        <level>trace</level>
+        <log>/var/log/clickhouse-server/clickhouse-server.log</log>
+        <errorlog>/var/log/clickhouse-server/clickhouse-server.err.log</errorlog>
+        <!-- Rotation policy
+             See https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/FileChannel.h#L54-L85
+          -->
+        <size>1000M</size>
+        <count>10</count>
+        <!-- <console>1</console> --> <!-- Default behavior is autodetection (log to console if not daemon mode and is tty) -->
+
+        <!-- Per level overrides (legacy):
+
+        For example to suppress logging of the ConfigReloader you can use:
+        NOTE: levels.logger is reserved, see below.
+        -->
+        <!--
+        <levels>
+          <ConfigReloader>none</ConfigReloader>
+        </levels>
+        -->
+
+        <!-- Per level overrides:
+
+        For example to suppress logging of the RBAC for default user you can use:
+        (But please note that the logger name maybe changed from version to version, even after minor upgrade)
+        -->
+        <!--
+        <levels>
+          <logger>
+            <name>ContextAccess (default)</name>
+            <level>none</level>
+          </logger>
+          <logger>
+            <name>DatabaseOrdinary (test)</name>
+            <level>none</level>
+          </logger>
+        </levels>
+        -->
     </logger>
 
+    <!-- Add headers to response in options request. OPTIONS method is used in CORS preflight requests. -->
+    <!-- It is off by default. Next headers are obligate for CORS.-->
+    <!-- http_options_response>
+        <header>
+            <name>Access-Control-Allow-Origin</name>
+            <value>*</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Headers</name>
+            <value>origin, x-requested-with</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Methods</name>
+            <value>POST, GET, OPTIONS</value>
+        </header>
+        <header>
+            <name>Access-Control-Max-Age</name>
+            <value>86400</value>
+        </header>
+    </http_options_response -->
+
+    <!-- It is the name that will be shown in the clickhouse-client.
+         By default, anything with "production" will be highlighted in red in query prompt.
+    -->
+    <!--display_name>production</display_name-->
+
+    <!-- Port for HTTP API. See also 'https_port' for secure connections.
+         This interface is also used by ODBC and JDBC drivers (DataGrip, Dbeaver, ...)
+         and by most of web interfaces (embedded UI, Grafana, Redash, ...).
+      -->
     <http_port>8123</http_port>
+
+    <!-- Port for interaction by native protocol with:
+         - clickhouse-client and other native ClickHouse tools (clickhouse-benchmark, clickhouse-copier);
+         - clickhouse-server with other clickhouse-servers for distributed query processing;
+         - ClickHouse drivers and applications supporting native protocol
+         (this protocol is also informally called as "the TCP protocol");
+         See also 'tcp_port_secure' for secure connections.
+    -->
     <tcp_port>9000</tcp_port>
 
-    <!-- For HTTPS and SSL over native protocol. -->
-    <!--
-    <https_port>8443</https_port>
-    <tcp_ssl_port>9440</tcp_ssl_port>
--->
+    <!-- Compatibility with MySQL protocol.
+         ClickHouse will pretend to be MySQL for applications connecting to this port.
+    -->
+    <mysql_port>9004</mysql_port>
 
-<!-- Used with https_port and tcp_ssl_port. Full ssl options list: https://github.com/yandex/ClickHouse/blob/master/contrib/libpoco/NetSSL_OpenSSL/include/Poco/Net/SSLManager.h#L71 -->
-<openSSL>
-    <server> <!-- Used for https server AND secure tcp port -->
-        <!-- openssl req -subj "/CN=localhost" -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout /etc/clickhouse-server/server.key -out /etc/clickhouse-server/server.crt -->
-        <certificateFile>/etc/clickhouse-server/server.crt</certificateFile>
-        <privateKeyFile>/etc/clickhouse-server/server.key</privateKeyFile>
-        <!-- openssl dhparam -out /etc/clickhouse-server/dhparam.pem 4096 -->
-        <dhParamsFile>/etc/clickhouse-server/dhparam.pem</dhParamsFile>
-        <verificationMode>none</verificationMode>
-        <loadDefaultCAFile>true</loadDefaultCAFile>
-        <cacheSessions>true</cacheSessions>
-        <disableProtocols>sslv2,sslv3</disableProtocols>
-        <preferServerCiphers>true</preferServerCiphers>
-    </server>
+    <!-- Compatibility with PostgreSQL protocol.
+         ClickHouse will pretend to be PostgreSQL for applications connecting to this port.
+    -->
+    <postgresql_port>9005</postgresql_port>
 
-    <client> <!-- Used for connecting to https dictionary source -->
-        <loadDefaultCAFile>true</loadDefaultCAFile>
-        <cacheSessions>true</cacheSessions>
-        <disableProtocols>sslv2,sslv3</disableProtocols>
-        <preferServerCiphers>true</preferServerCiphers>
-        <!-- Use for self-signed: <verificationMode>none</verificationMode> -->
-        <invalidCertificateHandler>
-            <!-- Use for self-signed: <name>AcceptCertificateHandler</name> -->
-            <name>RejectCertificateHandler</name>
-        </invalidCertificateHandler>
-    </client>
-</openSSL>
+    <!-- HTTP API with TLS (HTTPS).
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <https_port>8443</https_port> -->
 
-<!-- Example config for tiered storage -->
-<!-- <storage_configuration>
-    <disks>
-        <default>
-            <keep_free_space_bytes>10485760</keep_free_space_bytes>
-        </default>
-        <s3>
-            <type>s3</type>
-            <endpoint>https://BUCKET-NAME.s3.amazonaws.com/data/</endpoint>
-            <access_key_id>ACCESS-KEY-ID</access_key_id>
-            <secret_access_key>SECRET-ACCESS-KEY</secret_access_key>
-        </s3>
-   </disks>
-   <policies>
-       <tiered>
-           <volumes>
-                <default>
-                    <disk>default</disk>
-                </default>
-                <s3>
-                    <disk>s3</disk>
-                </s3>
-            </volumes>
-        </tiered>
-    </policies>
-</storage_configuration> -->
+    <!-- Native interface with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <tcp_port_secure>9440</tcp_port_secure> -->
 
+    <!-- Native interface wrapped with PROXYv1 protocol
+         PROXYv1 header sent for every connection.
+         ClickHouse will extract information about proxy-forwarded client address from the header.
+    -->
+    <!-- <tcp_with_proxy_port>9011</tcp_with_proxy_port> -->
 
-<!-- Default root page on http[s] server. For example load UI from https://tabix.io/ when opening http://localhost:8123 -->
-    <!--
-    <http_server_default_response><![CDATA[<html ng-app="SMI2"><head><base href="http://ui.tabix.io/"></head><body><div ui-view="" class="content-ui"></div><script src="http://loader.tabix.io/master.js"></script></body></html>]]></http_server_default_response>
--->
+    <!-- Port for communication between replicas. Used for data exchange.
+         It provides low-level data access between servers.
+         This port should not be accessible from untrusted networks.
+         See also 'interserver_http_credentials'.
+         Data transferred over connections to this port should not go through untrusted networks.
+         See also 'interserver_https_port'.
+      -->
+    <interserver_http_port>9009</interserver_http_port>
 
-<!-- Port for communication between replicas. Used for data exchange. -->
-<interserver_http_port>9009</interserver_http_port>
+    <!-- Port for communication between replicas with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+         See also 'interserver_http_credentials'.
+      -->
+    <!-- <interserver_https_port>9010</interserver_https_port> -->
 
     <!-- Hostname that is used by other replicas to request this server.
-         If not specified, than it is determined analoguous to 'hostname -f' command.
-         This setting could be used to switch replication to another network interface.
-     -->
+         If not specified, then it is determined analogous to 'hostname -f' command.
+         This setting could be used to switch replication to another network interface
+         (the server may be connected to multiple networks via multiple addresses)
+      -->
+
     <!--
-    <interserver_http_host>example.yandex.ru</interserver_http_host>
--->
+    <interserver_http_host>example.clickhouse.com</interserver_http_host>
+    -->
 
-<!-- Listen specified host. use :: (wildcard IPv6 address), if you want to accept connections both with IPv4 and IPv6 from everywhere. -->
-<listen_host>::</listen_host>
-<!-- Same for hosts with disabled ipv6: -->
-<!-- <listen_host>0.0.0.0</listen_host> -->
+    <!-- You can specify credentials for authenthication between replicas.
+         This is required when interserver_https_port is accessible from untrusted networks,
+         and also recommended to avoid SSRF attacks from possibly compromised services in your network.
+      -->
+    <!--<interserver_http_credentials>
+        <user>interserver</user>
+        <password></password>
+    </interserver_http_credentials>-->
 
-<!-- Default values - try listen localhost on ipv4 and ipv6: -->
-<!-- <listen_host>0.0.0.0</listen_host> -->
+    <!-- Listen specified address.
+         Use :: (wildcard IPv6 address), if you want to accept connections both with IPv4 and IPv6 from everywhere.
+         Notes:
+         If you open connections from wildcard address, make sure that at least one of the following measures applied:
+         - server is protected by firewall and not accessible from untrusted networks;
+         - all users are restricted to subset of network addresses (see users.xml);
+         - all users have strong passwords, only secure (TLS) interfaces are accessible, or connections are only made via TLS interfaces.
+         - users without password have readonly access.
+         See also: https://www.shodan.io/search?query=clickhouse
+      -->
+    <!-- <listen_host>::</listen_host> -->
 
-<max_connections>4096</max_connections>
-<keep_alive_timeout>3</keep_alive_timeout>
 
-<!-- Maximum number of concurrent queries. -->
-<max_concurrent_queries>100</max_concurrent_queries>
+    <!-- Same for hosts without support for IPv6: -->
+    <!-- <listen_host>0.0.0.0</listen_host> -->
+
+    <!-- Default values - try listen localhost on IPv4 and IPv6. -->
+    <!--
+    <listen_host>::1</listen_host>
+    <listen_host>127.0.0.1</listen_host>
+    -->
+
+    <!-- Don't exit if IPv6 or IPv4 networks are unavailable while trying to listen. -->
+    <!-- <listen_try>0</listen_try> -->
+
+    <!-- Allow multiple servers to listen on the same address:port. This is not recommended.
+      -->
+    <!-- <listen_reuse_port>0</listen_reuse_port> -->
+
+    <!-- <listen_backlog>4096</listen_backlog> -->
+
+    <max_connections>4096</max_connections>
+
+    <!-- For 'Connection: keep-alive' in HTTP 1.1 -->
+    <keep_alive_timeout>3</keep_alive_timeout>
+
+    <!-- gRPC protocol (see src/Server/grpc_protos/clickhouse_grpc.proto for the API) -->
+    <!-- <grpc_port>9100</grpc_port> -->
+    <grpc>
+        <enable_ssl>false</enable_ssl>
+
+        <!-- The following two files are used only if enable_ssl=1 -->
+        <ssl_cert_file>/path/to/ssl_cert_file</ssl_cert_file>
+        <ssl_key_file>/path/to/ssl_key_file</ssl_key_file>
+
+        <!-- Whether server will request client for a certificate -->
+        <ssl_require_client_auth>false</ssl_require_client_auth>
+
+        <!-- The following file is used only if ssl_require_client_auth=1 -->
+        <ssl_ca_cert_file>/path/to/ssl_ca_cert_file</ssl_ca_cert_file>
+
+        <!-- Default transport compression type (can be overridden by client, see the transport_compression_type field in QueryInfo).
+             Supported algorithms: none, deflate, gzip, stream_gzip -->
+        <transport_compression_type>none</transport_compression_type>
+
+        <!-- Default transport compression level. Supported levels: 0..3 -->
+        <transport_compression_level>0</transport_compression_level>
+
+        <!-- Send/receive message size limits in bytes. -1 means unlimited -->
+        <max_send_message_size>-1</max_send_message_size>
+        <max_receive_message_size>-1</max_receive_message_size>
+
+        <!-- Enable if you want very detailed logs -->
+        <verbose_logs>false</verbose_logs>
+    </grpc>
+
+    <!-- Used with https_port and tcp_port_secure. Full ssl options list: https://github.com/ClickHouse-Extras/poco/blob/master/NetSSL_OpenSSL/include/Poco/Net/SSLManager.h#L71 -->
+    <openSSL>
+        <server> <!-- Used for https server AND secure tcp port -->
+            <!-- openssl req -subj "/CN=localhost" -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout /etc/clickhouse-server/server.key -out /etc/clickhouse-server/server.crt -->
+            <certificateFile>/etc/clickhouse-server/server.crt</certificateFile>
+            <privateKeyFile>/etc/clickhouse-server/server.key</privateKeyFile>
+            <!-- dhparams are optional. You can delete the <dhParamsFile> element.
+                 To generate dhparams, use the following command:
+                  openssl dhparam -out /etc/clickhouse-server/dhparam.pem 4096
+                 Only file format with BEGIN DH PARAMETERS is supported.
+              -->
+            <!-- <dhParamsFile>/etc/clickhouse-server/dhparam.pem</dhParamsFile>-->
+            <verificationMode>none</verificationMode>
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+        </server>
+
+        <client> <!-- Used for connecting to https dictionary source and secured Zookeeper communication -->
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+            <!-- Use for self-signed: <verificationMode>none</verificationMode> -->
+            <invalidCertificateHandler>
+                <!-- Use for self-signed: <name>AcceptCertificateHandler</name> -->
+                <name>RejectCertificateHandler</name>
+            </invalidCertificateHandler>
+        </client>
+    </openSSL>
+
+    <!-- Default root page on http[s] server. For example load UI from https://tabix.io/ when opening http://localhost:8123 -->
+    <!--
+    <http_server_default_response><![CDATA[<html ng-app="SMI2"><head><base href="http://ui.tabix.io/"></head><body><div ui-view="" class="content-ui"></div><script src="http://loader.tabix.io/master.js"></script></body></html>]]></http_server_default_response>
+    -->
+
+    <!-- Maximum number of concurrent queries. -->
+    <max_concurrent_queries>100</max_concurrent_queries>
+
+    <!-- Maximum memory usage (resident set size) for server process.
+         Zero value or unset means default. Default is "max_server_memory_usage_to_ram_ratio" of available physical RAM.
+         If the value is larger than "max_server_memory_usage_to_ram_ratio" of available physical RAM, it will be cut down.
+
+         The constraint is checked on query execution time.
+         If a query tries to allocate memory and the current memory usage plus allocation is greater
+          than specified threshold, exception will be thrown.
+
+         It is not practical to set this constraint to small values like just a few gigabytes,
+          because memory allocator will keep this amount of memory in caches and the server will deny service of queries.
+      -->
+    <max_server_memory_usage>0</max_server_memory_usage>
+
+    <!-- Maximum number of threads in the Global thread pool.
+    This will default to a maximum of 10000 threads if not specified.
+    This setting will be useful in scenarios where there are a large number
+    of distributed queries that are running concurrently but are idling most
+    of the time, in which case a higher number of threads might be required.
+    -->
+
+    <max_thread_pool_size>10000</max_thread_pool_size>
+
+    <!-- Number of workers to recycle connections in background (see also drain_timeout).
+         If the pool is full, connection will be drained synchronously. -->
+    <!-- <max_threads_for_connection_collector>10</max_threads_for_connection_collector> -->
+
+    <!-- On memory constrained environments you may have to set this to value larger than 1.
+      -->
+    <max_server_memory_usage_to_ram_ratio>0.9</max_server_memory_usage_to_ram_ratio>
+
+    <!-- Simple server-wide memory profiler. Collect a stack trace at every peak allocation step (in bytes).
+         Data will be stored in system.trace_log table with query_id = empty string.
+         Zero means disabled.
+      -->
+    <total_memory_profiler_step>4194304</total_memory_profiler_step>
+
+    <!-- Collect random allocations and deallocations and write them into system.trace_log with 'MemorySample' trace_type.
+         The probability is for every alloc/free regardless to the size of the allocation.
+         Note that sampling happens only when the amount of untracked memory exceeds the untracked memory limit,
+          which is 4 MiB by default but can be lowered if 'total_memory_profiler_step' is lowered.
+         You may want to set 'total_memory_profiler_step' to 1 for extra fine grained sampling.
+      -->
+    <total_memory_tracker_sample_probability>0</total_memory_tracker_sample_probability>
 
     <!-- Set limit on number of open files (default: maximum). This setting makes sense on Mac OS X because getrlimit() fails to retrieve
-    correct maximum value. -->
+         correct maximum value. -->
     <!-- <max_open_files>262144</max_open_files> -->
 
     <!-- Size of cache of uncompressed blocks of data, used in tables of MergeTree family.
          In bytes. Cache is single for server. Memory is allocated only on demand.
          Cache is used when 'use_uncompressed_cache' user setting turned on (off by default).
          Uncompressed cache is advantageous only for very short queries and in rare cases.
-     -->
-     <uncompressed_cache_size>8589934592</uncompressed_cache_size>
+
+         Note: uncompressed cache can be pointless for lz4, because memory bandwidth
+         is slower than multi-core decompression on some server configurations.
+         Enabling it can sometimes paradoxically make queries slower.
+      -->
+    <uncompressed_cache_size>8589934592</uncompressed_cache_size>
 
     <!-- Approximate size of mark cache, used in tables of MergeTree family.
          In bytes. Cache is single for server. Memory is allocated only on demand.
          You should not lower this value.
-     -->
-     <mark_cache_size>5368709120</mark_cache_size>
+      -->
+    <mark_cache_size>5368709120</mark_cache_size>
 
 
-     <!-- Path to data directory, with trailing slash. -->
-     <path>/var/lib/clickhouse/</path>
+    <!-- If you enable the `min_bytes_to_use_mmap_io` setting,
+         the data in MergeTree tables can be read with mmap to avoid copying from kernel to userspace.
+         It makes sense only for large files and helps only if data reside in page cache.
+         To avoid frequent open/mmap/munmap/close calls (which are very expensive due to consequent page faults)
+         and to reuse mappings from several threads and queries,
+         the cache of mapped files is maintained. Its size is the number of mapped regions (usually equal to the number of mapped files).
+         The amount of data in mapped files can be monitored
+         in system.metrics, system.metric_log by the MMappedFiles, MMappedFileBytes metrics
+         and in system.asynchronous_metrics, system.asynchronous_metrics_log by the MMapCacheCells metric,
+         and also in system.events, system.processes, system.query_log, system.query_thread_log, system.query_views_log by the
+         CreatedReadBufferMMap, CreatedReadBufferMMapFailed, MMappedFileCacheHits, MMappedFileCacheMisses events.
+         Note that the amount of data in mapped files does not consume memory directly and is not accounted
+         in query or server memory usage - because this memory can be discarded similar to OS page cache.
+         The cache is dropped (the files are closed) automatically on removal of old parts in MergeTree,
+         also it can be dropped manually by the SYSTEM DROP MMAP CACHE query.
+      -->
+    <mmap_cache_size>1000</mmap_cache_size>
 
-     <!-- Path to temporary data for processing hard queries. -->
-     <tmp_path>/var/lib/clickhouse/tmp/</tmp_path>
+    <!-- Cache size in bytes for compiled expressions.-->
+    <compiled_expression_cache_size>134217728</compiled_expression_cache_size>
 
-     <!-- Path to configuration file with users, access rights, profiles of settings, quotas. -->
-     <users_config>users.xml</users_config>
+    <!-- Cache size in elements for compiled expressions.-->
+    <compiled_expression_cache_elements_size>10000</compiled_expression_cache_elements_size>
 
-     <!-- Default profile of settings.. -->
-     <default_profile>default</default_profile>
+    <!-- Path to data directory, with trailing slash. -->
+    <path>/var/lib/clickhouse/</path>
 
-     <!-- Default database. -->
-     <default_database>default</default_database>
+    <!-- Path to temporary data for processing hard queries. -->
+    <tmp_path>/var/lib/clickhouse/tmp/</tmp_path>
+    
+    <!-- Disable AuthType plaintext_password and no_password for ACL. -->
+    <!-- <allow_plaintext_password>0</allow_plaintext_password> -->
+    <!-- <allow_no_password>0</allow_no_password> -->`
+
+    <!-- Policy from the <storage_configuration> for the temporary files.
+         If not set <tmp_path> is used, otherwise <tmp_path> is ignored.
+
+         Notes:
+         - move_factor              is ignored
+         - keep_free_space_bytes    is ignored
+         - max_data_part_size_bytes is ignored
+         - you must have exactly one volume in that policy
+    -->
+    <!-- <tmp_policy>tmp</tmp_policy> -->
+
+    <!-- Directory with user provided files that are accessible by 'file' table function. -->
+    <user_files_path>/var/lib/clickhouse/user_files/</user_files_path>
+
+    <!-- LDAP server definitions. -->
+    <ldap_servers>
+        <!-- List LDAP servers with their connection parameters here to later 1) use them as authenticators for dedicated local users,
+              who have 'ldap' authentication mechanism specified instead of 'password', or to 2) use them as remote user directories.
+             Parameters:
+                host - LDAP server hostname or IP, this parameter is mandatory and cannot be empty.
+                port - LDAP server port, default is 636 if enable_tls is set to true, 389 otherwise.
+                bind_dn - template used to construct the DN to bind to.
+                        The resulting DN will be constructed by replacing all '{user_name}' substrings of the template with the actual
+                         user name during each authentication attempt.
+                user_dn_detection - section with LDAP search parameters for detecting the actual user DN of the bound user.
+                        This is mainly used in search filters for further role mapping when the server is Active Directory. The
+                         resulting user DN will be used when replacing '{user_dn}' substrings wherever they are allowed. By default,
+                         user DN is set equal to bind DN, but once search is performed, it will be updated with to the actual detected
+                         user DN value.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}' and '{bind_dn}' substrings
+                             of the template with the actual user name and bind DN during the LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', and '{base_dn}'
+                             substrings of the template with the actual user name, bind DN, and base DN during the LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                verification_cooldown - a period of time, in seconds, after a successful bind attempt, during which a user will be assumed
+                         to be successfully authenticated for all consecutive requests without contacting the LDAP server.
+                        Specify 0 (the default) to disable caching and force contacting the LDAP server for each authentication request.
+                enable_tls - flag to trigger use of secure connection to the LDAP server.
+                        Specify 'no' for plain text (ldap://) protocol (not recommended).
+                        Specify 'yes' for LDAP over SSL/TLS (ldaps://) protocol (recommended, the default).
+                        Specify 'starttls' for legacy StartTLS protocol (plain text (ldap://) protocol, upgraded to TLS).
+                tls_minimum_protocol_version - the minimum protocol version of SSL/TLS.
+                        Accepted values are: 'ssl2', 'ssl3', 'tls1.0', 'tls1.1', 'tls1.2' (the default).
+                tls_require_cert - SSL/TLS peer certificate verification behavior.
+                        Accepted values are: 'never', 'allow', 'try', 'demand' (the default).
+                tls_cert_file - path to certificate file.
+                tls_key_file - path to certificate key file.
+                tls_ca_cert_file - path to CA certificate file.
+                tls_ca_cert_dir - path to the directory containing CA certificates.
+                tls_cipher_suite - allowed cipher suite (in OpenSSL notation).
+             Example:
+                <my_ldap_server>
+                    <host>localhost</host>
+                    <port>636</port>
+                    <bind_dn>uid={user_name},ou=users,dc=example,dc=com</bind_dn>
+                    <verification_cooldown>300</verification_cooldown>
+                    <enable_tls>yes</enable_tls>
+                    <tls_minimum_protocol_version>tls1.2</tls_minimum_protocol_version>
+                    <tls_require_cert>demand</tls_require_cert>
+                    <tls_cert_file>/path/to/tls_cert_file</tls_cert_file>
+                    <tls_key_file>/path/to/tls_key_file</tls_key_file>
+                    <tls_ca_cert_file>/path/to/tls_ca_cert_file</tls_ca_cert_file>
+                    <tls_ca_cert_dir>/path/to/tls_ca_cert_dir</tls_ca_cert_dir>
+                    <tls_cipher_suite>ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:AES256-GCM-SHA384</tls_cipher_suite>
+                </my_ldap_server>
+             Example (typical Active Directory with configured user DN detection for further role mapping):
+                <my_ad_server>
+                    <host>localhost</host>
+                    <port>389</port>
+                    <bind_dn>EXAMPLE\{user_name}</bind_dn>
+                    <user_dn_detection>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <search_filter>(&amp;(objectClass=user)(sAMAccountName={user_name}))</search_filter>
+                    </user_dn_detection>
+                    <enable_tls>no</enable_tls>
+                </my_ad_server>
+        -->
+    </ldap_servers>
+
+    <!-- To enable Kerberos authentication support for HTTP requests (GSS-SPNEGO), for those users who are explicitly configured
+          to authenticate via Kerberos, define a single 'kerberos' section here.
+         Parameters:
+            principal - canonical service principal name, that will be acquired and used when accepting security contexts.
+                    This parameter is optional, if omitted, the default principal will be used.
+                    This parameter cannot be specified together with 'realm' parameter.
+            realm - a realm, that will be used to restrict authentication to only those requests whose initiator's realm matches it.
+                    This parameter is optional, if omitted, no additional filtering by realm will be applied.
+                    This parameter cannot be specified together with 'principal' parameter.
+         Example:
+            <kerberos />
+         Example:
+            <kerberos>
+                <principal>HTTP/clickhouse.example.com@EXAMPLE.COM</principal>
+            </kerberos>
+         Example:
+            <kerberos>
+                <realm>EXAMPLE.COM</realm>
+            </kerberos>
+    -->
+
+    <!-- Sources to read users, roles, access rights, profiles of settings, quotas. -->
+    <user_directories>
+        <users_xml>
+            <!-- Path to configuration file with predefined users. -->
+            <path>users.xml</path>
+        </users_xml>
+        <local_directory>
+            <!-- Path to folder where users created by SQL commands are stored. -->
+            <path>/var/lib/clickhouse/access/</path>
+        </local_directory>
+
+        <!-- To add an LDAP server as a remote user directory of users that are not defined locally, define a single 'ldap' section
+              with the following parameters:
+                server - one of LDAP server names defined in 'ldap_servers' config section above.
+                        This parameter is mandatory and cannot be empty.
+                roles - section with a list of locally defined roles that will be assigned to each user retrieved from the LDAP server.
+                        If no roles are specified here or assigned during role mapping (below), user will not be able to perform any
+                         actions after authentication.
+                role_mapping - section with LDAP search parameters and mapping rules.
+                        When a user authenticates, while still bound to LDAP, an LDAP search is performed using search_filter and the
+                         name of the logged in user. For each entry found during that search, the value of the specified attribute is
+                         extracted. For each attribute value that has the specified prefix, the prefix is removed, and the rest of the
+                         value becomes the name of a local role defined in ClickHouse, which is expected to be created beforehand by
+                         CREATE ROLE command.
+                        There can be multiple 'role_mapping' sections defined inside the same 'ldap' section. All of them will be
+                         applied.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}', '{bind_dn}', and '{user_dn}'
+                             substrings of the template with the actual user name, bind DN, and user DN during each LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', '{user_dn}', and
+                             '{base_dn}' substrings of the template with the actual user name, bind DN, user DN, and base DN during
+                             each LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                    attribute - attribute name whose values will be returned by the LDAP search. 'cn', by default.
+                    prefix - prefix, that will be expected to be in front of each string in the original list of strings returned by
+                             the LDAP search. Prefix will be removed from the original strings and resulting strings will be treated
+                             as local role names. Empty, by default.
+             Example:
+                <ldap>
+                    <server>my_ldap_server</server>
+                    <roles>
+                        <my_local_role1 />
+                        <my_local_role2 />
+                    </roles>
+                    <role_mapping>
+                        <base_dn>ou=groups,dc=example,dc=com</base_dn>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=groupOfNames)(member={bind_dn}))</search_filter>
+                        <attribute>cn</attribute>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+             Example (typical Active Directory with role mapping that relies on the detected user DN):
+                <ldap>
+                    <server>my_ad_server</server>
+                    <role_mapping>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <attribute>CN</attribute>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=group)(member={user_dn}))</search_filter>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+        -->
+    </user_directories>
+
+    <!-- Default profile of settings. -->
+    <default_profile>default</default_profile>
+
+    <!-- Comma-separated list of prefixes for user-defined settings. -->
+    <custom_settings_prefixes></custom_settings_prefixes>
+
+    <!-- System profile of settings. This settings are used by internal processes (Distributed DDL worker and so on). -->
+    <!-- <system_profile>default</system_profile> -->
+
+    <!-- Buffer profile of settings.
+         This settings are used by Buffer storage to flush data to the underlying table.
+         Default: used from system_profile directive.
+    -->
+    <!-- <buffer_profile>default</buffer_profile> -->
+
+    <!-- Default database. -->
+    <default_database>default</default_database>
 
     <!-- Server time zone could be set here.
 
@@ -143,62 +573,266 @@
          If not specified, system time zone at server startup is used.
 
          Please note, that server could display time zone alias instead of specified name.
-         Example: W-SU is an alias for Europe/Moscow and Zulu is an alias for UTC.
-     -->
-     <!-- <timezone>Europe/Moscow</timezone> -->
+         Example: Zulu is an alias for UTC.
+    -->
+    <!-- <timezone>UTC</timezone> -->
 
     <!-- You can specify umask here (see "man umask"). Server will apply it on startup.
          Number is always parsed as octal. Default umask is 027 (other users cannot read logs, data files, etc; group can only read).
-     -->
-     <!-- <umask>022</umask> -->
+    -->
+    <!-- <umask>022</umask> -->
+
+    <!-- Perform mlockall after startup to lower first queries latency
+          and to prevent clickhouse executable from being paged out under high IO load.
+         Enabling this option is recommended but will lead to increased startup time for up to a few seconds.
+    -->
+    <mlock_executable>true</mlock_executable>
+
+    <!-- Reallocate memory for machine code ("text") using huge pages. Highly experimental. -->
+    <remap_executable>false</remap_executable>
+
+    <![CDATA[
+         Uncomment below in order to use JDBC table engine and function.
+
+         To install and run JDBC bridge in background:
+         * [Debian/Ubuntu]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           apt install --no-install-recommends -f ./clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           clickhouse-jdbc-bridge &
+
+         * [CentOS/RHEL]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           yum localinstall -y clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           clickhouse-jdbc-bridge &
+
+         Please refer to https://github.com/ClickHouse/clickhouse-jdbc-bridge#usage for more information.
+    ]]>
+    <!--
+    <jdbc_bridge>
+        <host>127.0.0.1</host>
+        <port>9019</port>
+    </jdbc_bridge>
+    -->
 
     <!-- Configuration of clusters that could be used in Distributed tables.
-         https://clickhouse.yandex/reference_en.html#Distributed
-     -->
-     <remote_servers incl="clickhouse_remote_servers" >
+         https://clickhouse.com/docs/en/operations/table_engines/distributed/
+      -->
+    <remote_servers>
         <!-- Test only shard config for testing distributed storage -->
         <test_shard_localhost>
+            <!-- Inter-server per-cluster secret for Distributed queries
+                 default: no secret (no authentication will be performed)
+
+                 If set, then Distributed queries will be validated on shards, so at least:
+                 - such cluster should exist on the shard,
+                 - such cluster should have the same secret.
+
+                 And also (and which is more important), the initial_user will
+                 be used as current user for the query.
+
+                 Right now the protocol is pretty simple and it only takes into account:
+                 - cluster name
+                 - query
+
+                 Also it will be nice if the following will be implemented:
+                 - source hostname (see interserver_http_host), but then it will depends from DNS,
+                   it can use IP address instead, but then the you need to get correct on the initiator node.
+                 - target hostname / ip address (same notes as for source hostname)
+                 - time-based security tokens
+            -->
+            <!-- <secret></secret> -->
+
+            <shard>
+                <!-- Optional. Whether to write data to just one of the replicas. Default: false (write data to all replicas). -->
+                <!-- <internal_replication>false</internal_replication> -->
+                <!-- Optional. Shard weight when writing data. Default: 1. -->
+                <!-- <weight>1</weight> -->
+                <replica>
+                    <host>localhost</host>
+                    <port>9000</port>
+                    <!-- Optional. Priority of the replica for load_balancing. Default: 1 (less value has more priority). -->
+                    <!-- <priority>1</priority> -->
+                </replica>
+            </shard>
+        </test_shard_localhost>
+        <test_cluster_one_shard_three_replicas_localhost>
+            <shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <!--shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard-->
+        </test_cluster_one_shard_three_replicas_localhost>
+        <test_cluster_two_shards_localhost>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+        </test_cluster_two_shards_localhost>
+        <test_cluster_two_shards>
+            <shard>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards>
+        <test_cluster_two_shards_internal_replication>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards_internal_replication>
+        <test_shard_localhost_secure>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>9440</port>
+                    <secure>1</secure>
+                </replica>
+            </shard>
+        </test_shard_localhost_secure>
+        <test_unavailable_shard>
             <shard>
                 <replica>
                     <host>localhost</host>
                     <port>9000</port>
                 </replica>
             </shard>
-        </test_shard_localhost>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>1</port>
+                </replica>
+            </shard>
+        </test_unavailable_shard>
     </remote_servers>
 
+    <!-- The list of hosts allowed to use in URL-related storage engines and table functions.
+        If this section is not present in configuration, all hosts are allowed.
+    -->
+    <!--<remote_url_allow_hosts>-->
+        <!-- Host should be specified exactly as in URL. The name is checked before DNS resolution.
+            Example: "clickhouse.com", "clickhouse.com." and "www.clickhouse.com" are different hosts.
+                    If port is explicitly specified in URL, the host:port is checked as a whole.
+                    If host specified here without port, any port with this host allowed.
+                    "clickhouse.com" -> "clickhouse.com:443", "clickhouse.com:80" etc. is allowed, but "clickhouse.com:80" -> only "clickhouse.com:80" is allowed.
+            If the host is specified as IP address, it is checked as specified in URL. Example: "[2a02:6b8:a::a]".
+            If there are redirects and support for redirects is enabled, every redirect (the Location field) is checked.
+            Host should be specified using the host xml tag:
+                    <host>clickhouse.com</host>
+        -->
+
+        <!-- Regular expression can be specified. RE2 engine is used for regexps.
+            Regexps are not aligned: don't forget to add ^ and $. Also don't forget to escape dot (.) metacharacter
+            (forgetting to do so is a common source of error).
+        -->
+    <!--</remote_url_allow_hosts>-->
 
     <!-- If element has 'incl' attribute, then for it's value will be used corresponding substitution from another file.
          By default, path to file with substitutions is /etc/metrika.xml. It could be changed in config in 'include_from' element.
-         Values for substitutions are specified in /yandex/name_of_substitution elements in that file.
-     -->
+         Values for substitutions are specified in /clickhouse/name_of_substitution elements in that file.
+      -->
 
     <!-- ZooKeeper is used to store metadata about replicas, when using Replicated tables.
          Optional. If you don't use replicated tables, you could omit that.
 
-         See https://clickhouse.yandex/reference_en.html#Data%20replication
-     -->
-     <zookeeper incl="zookeeper-servers" optional="true" />
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/
+      -->
+
+    <!--
+    <zookeeper>
+        <node>
+            <host>example1</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example2</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example3</host>
+            <port>2181</port>
+        </node>
+    </zookeeper>
+    -->
 
     <!-- Substitutions for parameters of replicated tables.
           Optional. If you don't use replicated tables, you could omit that.
 
-         See https://clickhouse.yandex/reference_en.html#Creating%20replicated%20tables
-     -->
-     <macros incl="macros" optional="true" />
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/#creating-replicated-tables
+      -->
+    <!--
+    <macros>
+        <shard>01</shard>
+        <replica>example01-01-1</replica>
+    </macros>
+    -->
 
 
-     <!-- Reloading interval for embedded dictionaries, in seconds. Default: 3600. -->
-     <builtin_dictionaries_reload_interval>3600</builtin_dictionaries_reload_interval>
+    <!-- Reloading interval for embedded dictionaries, in seconds. Default: 3600. -->
+    <builtin_dictionaries_reload_interval>3600</builtin_dictionaries_reload_interval>
 
 
-     <!-- Maximum session timeout, in seconds. Default: 3600. -->
-     <max_session_timeout>3600</max_session_timeout>
+    <!-- Maximum session timeout, in seconds. Default: 3600. -->
+    <max_session_timeout>3600</max_session_timeout>
 
-     <!-- Default session timeout, in seconds. Default: 60. -->
-     <default_session_timeout>60</default_session_timeout>
+    <!-- Default session timeout, in seconds. Default: 60. -->
+    <default_session_timeout>60</default_session_timeout>
 
-     <!-- Sending data to Graphite for monitoring. Several sections can be defined. -->
+    <!-- Sending data to Graphite for monitoring. Several sections can be defined. -->
     <!--
         interval - send every X second
         root_path - prefix for keys
@@ -214,10 +848,11 @@
         <timeout>0.1</timeout>
         <interval>60</interval>
         <root_path>one_min</root_path>
-        <hostname_in_path>true<hostname_in_path>
+        <hostname_in_path>true</hostname_in_path>
 
         <metrics>true</metrics>
         <events>true</events>
+        <events_cumulative>false</events_cumulative>
         <asynchronous_metrics>true</asynchronous_metrics>
     </graphite>
     <graphite>
@@ -229,56 +864,219 @@
 
         <metrics>true</metrics>
         <events>true</events>
+        <events_cumulative>false</events_cumulative>
         <asynchronous_metrics>false</asynchronous_metrics>
     </graphite>
--->
+    -->
 
+    <!-- Serve endpoint for Prometheus monitoring. -->
+    <!--
+        endpoint - mertics path (relative to root, statring with "/")
+        port - port to setup server. If not defined or 0 than http_port used
+        metrics - send data from table system.metrics
+        events - send data from table system.events
+        asynchronous_metrics - send data from table system.asynchronous_metrics
+        status_info - send data from different component from CH, ex: Dictionaries status
+    -->
+    <!--
+    <prometheus>
+        <endpoint>/metrics</endpoint>
+        <port>9363</port>
 
-<!-- Query log. Used only for queries with setting log_queries = 1. -->
-<query_log>
+        <metrics>true</metrics>
+        <events>true</events>
+        <asynchronous_metrics>true</asynchronous_metrics>
+        <status_info>true</status_info>
+    </prometheus>
+    -->
+
+    <!-- Query log. Used only for queries with setting log_queries = 1. -->
+    <query_log>
         <!-- What table to insert data. If table is not exist, it will be created.
              When query log structure is changed after system update,
               then old table will be renamed and new table will be created automatically.
+        -->
+        <database>system</database>
+        <table>query_log</table>
+        <!--
+            PARTITION BY expr: https://clickhouse.com/docs/en/table_engines/mergetree-family/custom_partitioning_key/
+            Example:
+                event_date
+                toMonday(event_date)
+                toYYYYMM(event_date)
+                toStartOfHour(event_time)
+        -->
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <!--
+            Table TTL specification: https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/mergetree/#mergetree-table-ttl
+            Example:
+                event_date + INTERVAL 1 WEEK
+                event_date + INTERVAL 7 DAY DELETE
+                event_date + INTERVAL 2 WEEK TO DISK 'bbb'
+
+        <ttl>event_date + INTERVAL 30 DAY DELETE</ttl>
+        -->
+
+        <!-- Instead of partition_by, you can provide full engine expression (starting with ENGINE = ) with parameters,
+             Example: <engine>ENGINE = MergeTree PARTITION BY toYYYYMM(event_date) ORDER BY (event_date, event_time) SETTINGS index_granularity = 1024</engine>
           -->
-          <database>system</database>
-          <table>query_log</table>
 
-          <!-- Interval of flushing data. -->
-          <flush_interval_milliseconds>7500</flush_interval_milliseconds>
-      </query_log>
+        <!-- Interval of flushing data. -->
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_log>
 
+    <!-- Trace log. Stores stack traces collected by query profilers.
+         See query_profiler_real_time_period_ns and query_profiler_cpu_time_period_ns settings. -->
+    <trace_log>
+        <database>system</database>
+        <table>trace_log</table>
 
-    <!-- Uncomment if use part_log
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </trace_log>
+
+    <!-- Query thread log. Has information about all threads participated in query execution.
+         Used only for queries with setting log_query_threads = 1. -->
+    <query_thread_log>
+        <database>system</database>
+        <table>query_thread_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_thread_log>
+
+    <!-- Query views log. Has information about all dependent views associated with a query.
+         Used only for queries with setting log_query_views = 1. -->
+    <query_views_log>
+        <database>system</database>
+        <table>query_views_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_views_log>
+
+    <!-- Uncomment if use part log.
+         Part log contains information about all actions with parts in MergeTree tables (creation, deletion, merges, downloads).-->
     <part_log>
         <database>system</database>
         <table>part_log</table>
-
+        <partition_by>toYYYYMM(event_date)</partition_by>
         <flush_interval_milliseconds>7500</flush_interval_milliseconds>
     </part_log>
--->
+
+    <!-- Uncomment to write text log into table.
+         Text log contains all information from usual server log but stores it in structured and efficient way.
+         The level of the messages that goes to the table can be limited (<level>), if not specified all messages will go to the table.
+    <text_log>
+        <database>system</database>
+        <table>text_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <level></level>
+    </text_log>
+    -->
+
+    <!-- Metric log contains rows with current values of ProfileEvents, CurrentMetrics collected with "collect_interval_milliseconds" interval. -->
+    <metric_log>
+        <database>system</database>
+        <table>metric_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <collect_interval_milliseconds>1000</collect_interval_milliseconds>
+    </metric_log>
+
+    <!--
+        Asynchronous metric log contains values of metrics from
+        system.asynchronous_metrics.
+    -->
+    <asynchronous_metric_log>
+        <database>system</database>
+        <table>asynchronous_metric_log</table>
+        <!--
+            Asynchronous metrics are updated once a minute, so there is
+            no need to flush more often.
+        -->
+        <flush_interval_milliseconds>7000</flush_interval_milliseconds>
+    </asynchronous_metric_log>
+
+    <!--
+        OpenTelemetry log contains OpenTelemetry trace spans.
+    -->
+    <opentelemetry_span_log>
+        <!--
+            The default table creation code is insufficient, this <engine> spec
+            is a workaround. There is no 'event_time' for this log, but two times,
+            start and finish. It is sorted by finish time, to avoid inserting
+            data too far away in the past (probably we can sometimes insert a span
+            that is seconds earlier than the last span in the table, due to a race
+            between several spans inserted in parallel). This gives the spans a
+            global order that we can use to e.g. retry insertion into some external
+            system.
+        -->
+        <engine>
+            engine MergeTree
+            partition by toYYYYMM(finish_date)
+            order by (finish_date, finish_time_us, trace_id)
+        </engine>
+        <database>system</database>
+        <table>opentelemetry_span_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </opentelemetry_span_log>
 
 
-    <!-- Parameters for embedded dictionaries, used in Yandex.Metrica.
-         See https://clickhouse.yandex/reference_en.html#Internal%20dictionaries
-     -->
+    <!-- Crash log. Stores stack traces for fatal errors.
+         This table is normally empty. -->
+    <crash_log>
+        <database>system</database>
+        <table>crash_log</table>
 
-     <!-- Path to file with region hierarchy. -->
-     <!-- <path_to_regions_hierarchy_file>/opt/geo/regions_hierarchy.txt</path_to_regions_hierarchy_file> -->
+        <partition_by />
+        <flush_interval_milliseconds>1000</flush_interval_milliseconds>
+    </crash_log>
 
-     <!-- Path to directory with files containing names of regions -->
-     <!-- <path_to_regions_names_files>/opt/geo/</path_to_regions_names_files> -->
+    <!-- Session log. Stores user log in (successful or not) and log out events.
 
+        Note: session log has known security issues and should not be used in production.
+    -->
+    <!-- <session_log>
+        <database>system</database>
+        <table>session_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </session_log> -->
+
+    <!-- Profiling on Processors level. -->
+    <processors_profile_log>
+        <database>system</database>
+        <table>processors_profile_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </processors_profile_log>
+
+    <!-- <top_level_domains_path>/var/lib/clickhouse/top_level_domains/</top_level_domains_path> -->
+    <!-- Custom TLD lists.
+         Format: <name>/path/to/file</name>
+
+         Changes will not be applied w/o server restart.
+         Path to the list is under top_level_domains_path (see above).
+    -->
+    <top_level_domains_lists>
+        <!--
+        <public_suffix_list>/path/to/public_suffix_list.dat</public_suffix_list>
+        -->
+    </top_level_domains_lists>
 
     <!-- Configuration of external dictionaries. See:
-         https://clickhouse.yandex/reference_en.html#External%20Dictionaries
-     -->
-     <dictionaries_config>*_dictionary.xml</dictionaries_config>
+         https://clickhouse.com/docs/en/sql-reference/dictionaries/external-dictionaries/external-dicts
+    -->
+    <dictionaries_config>*_dictionary.xml</dictionaries_config>
+
+    <!-- Configuration of user defined executable functions -->
+    <user_defined_executable_functions_config>*_function.xml</user_defined_executable_functions_config>
 
     <!-- Uncomment if you want data to be compressed 30-100% better.
          Don't do that if you just started using ClickHouse.
-     -->
-     <compression incl="clickhouse_compression">
+      -->
     <!--
+    <compression>
         <!- - Set of variants. Checked in order. Last matching case wins. If nothing matches, lz4 will be used. - ->
         <case>
 
@@ -289,14 +1087,61 @@
             <!- - What compression method to use. - ->
             <method>zstd</method>
         </case>
+    </compression>
     -->
-</compression>
+
+    <!-- Configuration of encryption. The server executes a command to
+         obtain an encryption key at startup if such a command is
+         defined, or encryption codecs will be disabled otherwise. The
+         command is executed through /bin/sh and is expected to write
+         a Base64-encoded key to the stdout. -->
+    <encryption_codecs>
+        <!-- aes_128_gcm_siv -->
+            <!-- Example of getting hex key from env -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!--key_hex from_env="..."></key_hex -->
+
+            <!-- Example of multiple hex keys. They can be imported from env or be written down in config-->
+            <!-- the code should use these keys and throw an exception if their length is not 16 bytes -->
+            <!-- key_hex id="0">...</key_hex -->
+            <!-- key_hex id="1" from_env=".."></key_hex -->
+            <!-- key_hex id="2">...</key_hex -->
+            <!-- current_key_id>2</current_key_id -->
+
+            <!-- Example of getting hex key from config -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!-- key>...</key -->
+
+            <!-- example of adding nonce -->
+            <!-- nonce>...</nonce -->
+
+        <!-- /aes_128_gcm_siv -->
+    </encryption_codecs>
 
     <!-- Allow to execute distributed DDL queries (CREATE, DROP, ALTER, RENAME) on cluster.
-    Works only if ZooKeeper is enabled. Comment it if such functionality isn't required. -->
+         Works only if ZooKeeper is enabled. Comment it if such functionality isn't required. -->
     <distributed_ddl>
         <!-- Path in ZooKeeper to queue with DDL queries -->
         <path>/clickhouse/task_queue/ddl</path>
+
+        <!-- Settings from this profile will be used to execute DDL queries -->
+        <!-- <profile>default</profile> -->
+
+        <!-- Controls how much ON CLUSTER queries can be run simultaneously. -->
+        <!-- <pool_size>1</pool_size> -->
+
+        <!--
+             Cleanup settings (active tasks will not be removed)
+        -->
+
+        <!-- Controls task TTL (default 1 week) -->
+        <!-- <task_max_lifetime>604800</task_max_lifetime> -->
+
+        <!-- Controls how often cleanup should be performed (in seconds) -->
+        <!-- <cleanup_delay_period>60</cleanup_delay_period> -->
+
+        <!-- Controls how many tasks could be in the queue -->
+        <!-- <max_tasks_in_queue>1000</max_tasks_in_queue> -->
     </distributed_ddl>
 
     <!-- Settings to fine tune MergeTree tables. See documentation in source code, in MergeTreeSettings.h -->
@@ -304,239 +1149,156 @@
     <merge_tree>
         <max_suspicious_broken_parts>5</max_suspicious_broken_parts>
     </merge_tree>
--->
+    -->
 
     <!-- Protection from accidental DROP.
          If size of a MergeTree table is greater than max_table_size_to_drop (in bytes) than table could not be dropped with any DROP query.
-         If you want do delete one table and don't want to restart clickhouse-server, you could create special file <clickhouse-path>/flags/force_drop_table and make DROP once.
-         By default max_table_size_to_drop is 50GB, max_table_size_to_drop=0 allows to DROP any tables.
+         If you want do delete one table and don't want to change clickhouse-server config, you could create special file <clickhouse-path>/flags/force_drop_table and make DROP once.
+         By default max_table_size_to_drop is 50GB; max_table_size_to_drop=0 allows to DROP any tables.
+         The same for max_partition_size_to_drop.
          Uncomment to disable protection.
-     -->
-     <!-- <max_table_size_to_drop>0</max_table_size_to_drop> -->
+    -->
+    <!-- <max_table_size_to_drop>0</max_table_size_to_drop> -->
+    <!-- <max_partition_size_to_drop>0</max_partition_size_to_drop> -->
 
-     <!-- Example of parameters for GraphiteMergeTree table engine -->
-     <graphite_rollup>
-        <!-- carbon -->
+    <!-- Example of parameters for GraphiteMergeTree table engine -->
+    <graphite_rollup_example>
         <pattern>
-            <regexp>^carbon\.</regexp>
+            <regexp>click_cost</regexp>
             <function>any</function>
             <retention>
                 <age>0</age>
+                <precision>3600</precision>
+            </retention>
+            <retention>
+                <age>86400</age>
                 <precision>60</precision>
             </retention>
-            <retention>
-                <age>7776000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
         </pattern>
-        <!-- collectd -->
-        <pattern>
-            <regexp>^collectd\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>10</precision>
-            </retention>
-            <retention>
-                <age>43200</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- high -->
-        <pattern>
-            <regexp>^high\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>10</precision>
-            </retention>
-            <retention>
-                <age>172800</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- medium -->
-        <pattern>
-            <regexp>^medium\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- low -->
-        <pattern>
-            <regexp>^low\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>600</precision>
-            </retention>
-            <retention>
-                <age>15552000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>31536000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>126144000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>252288000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>315360000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- default -->
         <default>
-            <function>any</function>
+            <function>max</function>
             <retention>
                 <age>0</age>
                 <precision>60</precision>
             </retention>
             <retention>
-                <age>864000</age>
-                <precision>900</precision>
+                <age>3600</age>
+                <precision>300</precision>
             </retention>
             <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
+                <age>86400</age>
                 <precision>3600</precision>
             </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
         </default>
-    </graphite_rollup>
+    </graphite_rollup_example>
 
     <!-- Directory in <clickhouse-path> containing schema files for various input formats.
          The directory will be created if it doesn't exist.
-     -->
-     <format_schema_path>/var/lib/clickhouse/format_schemas/</format_schema_path>
- </yandex>
+      -->
+    <format_schema_path>/var/lib/clickhouse/format_schemas/</format_schema_path>
+
+    <!-- Default query masking rules, matching lines would be replaced with something else in the logs
+        (both text logs and system.query_log).
+        name - name for the rule (optional)
+        regexp - RE2 compatible regular expression (mandatory)
+        replace - substitution string for sensitive data (optional, by default - six asterisks)
+    -->
+    <query_masking_rules>
+        <rule>
+            <name>hide encrypt/decrypt arguments</name>
+            <regexp>((?:aes_)?(?:encrypt|decrypt)(?:_mysql)?)\s*\(\s*(?:'(?:\\'|.)+'|.*?)\s*\)</regexp>
+            <!-- or more secure, but also more invasive:
+                (aes_\w+)\s*\(.*\)
+            -->
+            <replace>\1(???)</replace>
+        </rule>
+    </query_masking_rules>
+
+    <!-- Uncomment to use custom http handlers.
+        rules are checked from top to bottom, first match runs the handler
+            url - to match request URL, you can use 'regex:' prefix to use regex match(optional)
+            methods - to match request method, you can use commas to separate multiple method matches(optional)
+            headers - to match request headers, match each child element(child element name is header name), you can use 'regex:' prefix to use regex match(optional)
+        handler is request handler
+            type - supported types: static, dynamic_query_handler, predefined_query_handler
+            query - use with predefined_query_handler type, executes query when the handler is called
+            query_param_name - use with dynamic_query_handler type, extracts and executes the value corresponding to the <query_param_name> value in HTTP request params
+            status - use with static type, response status code
+            content_type - use with static type, response content-type
+            response_content - use with static type, Response content sent to client, when using the prefix 'file://' or 'config://', find the content from the file or configuration send to client.
+
+    <http_handlers>
+        <rule>
+            <url>/</url>
+            <methods>POST,GET</methods>
+            <headers><pragma>no-cache</pragma></headers>
+            <handler>
+                <type>dynamic_query_handler</type>
+                <query_param_name>query</query_param_name>
+            </handler>
+        </rule>
+
+        <rule>
+            <url>/predefined_query</url>
+            <methods>POST,GET</methods>
+            <handler>
+                <type>predefined_query_handler</type>
+                <query>SELECT * FROM system.settings</query>
+            </handler>
+        </rule>
+
+        <rule>
+            <handler>
+                <type>static</type>
+                <status>200</status>
+                <content_type>text/plain; charset=UTF-8</content_type>
+                <response_content>config://http_server_default_response</response_content>
+            </handler>
+        </rule>
+    </http_handlers>
+    -->
+
+    <send_crash_reports>
+        <!-- Changing <enabled> to true allows sending crash reports to -->
+        <!-- the ClickHouse core developers team via Sentry https://sentry.io -->
+        <!-- Doing so at least in pre-production environments is highly appreciated -->
+        <enabled>false</enabled>
+        <!-- Change <anonymize> to true if you don't feel comfortable attaching the server hostname to the crash report -->
+        <anonymize>false</anonymize>
+        <!-- Default endpoint should be changed to different Sentry DSN only if you have -->
+        <!-- some in-house engineers or hired consultants who're going to debug ClickHouse issues for you -->
+        <endpoint>https://6f33034cfe684dd7a3ab9875e57b1c8d@o388870.ingest.sentry.io/5226277</endpoint>
+    </send_crash_reports>
+
+    <!-- Uncomment to disable ClickHouse internal DNS caching. -->
+    <!-- <disable_internal_dns_cache>1</disable_internal_dns_cache> -->
+
+    <!-- You can also configure rocksdb like this: -->
+    <!--
+    <rocksdb>
+        <options>
+            <max_background_jobs>8</max_background_jobs>
+        </options>
+        <column_family_options>
+            <num_levels>2</num_levels>
+        </column_family_options>
+        <tables>
+            <table>
+                <name>TABLE</name>
+                <options>
+                    <max_background_jobs>8</max_background_jobs>
+                </options>
+                <column_family_options>
+                    <num_levels>2</num_levels>
+                </column_family_options>
+            </table>
+        </tables>
+    </rocksdb>
+    -->
+
+    <!-- Uncomment if enable merge tree metadata cache -->
+    <merge_tree_metadata_cache>
+        <lru_cache_size>268435456</lru_cache_size>
+        <continue_if_corrupted>true</continue_if_corrupted>
+    </merge_tree_metadata_cache>
+</clickhouse>
diff --git a/deploy/docker/clickhouse-setup/clickhouse-storage.xml b/deploy/docker/clickhouse-setup/clickhouse-storage.xml
new file mode 100644
index 0000000000..aab0c15da7
--- /dev/null
+++ b/deploy/docker/clickhouse-setup/clickhouse-storage.xml
@@ -0,0 +1,28 @@
+<?xml version="1.0"?>
+<clickhouse>
+<storage_configuration>
+    <disks>
+        <default>
+            <keep_free_space_bytes>10485760</keep_free_space_bytes>
+        </default>
+        <s3>
+            <type>s3</type>
+            <endpoint>https://BUCKET-NAME.s3.amazonaws.com/data/</endpoint>
+            <access_key_id>ACCESS-KEY-ID</access_key_id>
+            <secret_access_key>SECRET-ACCESS-KEY</secret_access_key>
+        </s3>
+   </disks>
+   <policies>
+       <tiered>
+           <volumes>
+                <default>
+                    <disk>default</disk>
+                </default>
+                <s3>
+                    <disk>s3</disk>
+                </s3>
+            </volumes>
+        </tiered>
+    </policies>
+</storage_configuration>
+</clickhouse>
diff --git a/deploy/docker/clickhouse-setup/clickhouse-users.xml b/deploy/docker/clickhouse-setup/clickhouse-users.xml
new file mode 100644
index 0000000000..f18562071d
--- /dev/null
+++ b/deploy/docker/clickhouse-setup/clickhouse-users.xml
@@ -0,0 +1,123 @@
+<?xml version="1.0"?>
+<clickhouse>
+    <!-- See also the files in users.d directory where the settings can be overridden. -->
+
+    <!-- Profiles of settings. -->
+    <profiles>
+        <!-- Default settings. -->
+        <default>
+            <!-- Maximum memory usage for processing single query, in bytes. -->
+            <max_memory_usage>10000000000</max_memory_usage>
+
+            <!-- How to choose between replicas during distributed query processing.
+                 random - choose random replica from set of replicas with minimum number of errors
+                 nearest_hostname - from set of replicas with minimum number of errors, choose replica
+                  with minimum number of different symbols between replica's hostname and local hostname
+                  (Hamming distance).
+                 in_order - first live replica is chosen in specified order.
+                 first_or_random - if first replica one has higher number of errors, pick a random one from replicas with minimum number of errors.
+            -->
+            <load_balancing>random</load_balancing>
+        </default>
+
+        <!-- Profile that allows only read queries. -->
+        <readonly>
+            <readonly>1</readonly>
+        </readonly>
+    </profiles>
+
+    <!-- Users and ACL. -->
+    <users>
+        <!-- If user name was not specified, 'default' user is used. -->
+        <default>
+            <!-- See also the files in users.d directory where the password can be overridden.
+
+                 Password could be specified in plaintext or in SHA256 (in hex format).
+
+                 If you want to specify password in plaintext (not recommended), place it in 'password' element.
+                 Example: <password>qwerty</password>.
+                 Password could be empty.
+
+                 If you want to specify SHA256, place it in 'password_sha256_hex' element.
+                 Example: <password_sha256_hex>65e84be33532fb784c48129675f9eff3a682b27168c0ea744b2cf58ee02337c5</password_sha256_hex>
+                 Restrictions of SHA256: impossibility to connect to ClickHouse using MySQL JS client (as of July 2019).
+
+                 If you want to specify double SHA1, place it in 'password_double_sha1_hex' element.
+                 Example: <password_double_sha1_hex>e395796d6546b1b65db9d665cd43f0e858dd4303</password_double_sha1_hex>
+
+                 If you want to specify a previously defined LDAP server (see 'ldap_servers' in the main config) for authentication,
+                  place its name in 'server' element inside 'ldap' element.
+                 Example: <ldap><server>my_ldap_server</server></ldap>
+
+                 If you want to authenticate the user via Kerberos (assuming Kerberos is enabled, see 'kerberos' in the main config),
+                  place 'kerberos' element instead of 'password' (and similar) elements.
+                 The name part of the canonical principal name of the initiator must match the user name for authentication to succeed.
+                 You can also place 'realm' element inside 'kerberos' element to further restrict authentication to only those requests
+                  whose initiator's realm matches it.
+                 Example: <kerberos />
+                 Example: <kerberos><realm>EXAMPLE.COM</realm></kerberos>
+
+                 How to generate decent password:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha256sum | tr -d '-'
+                 In first line will be password and in second - corresponding SHA256.
+
+                 How to generate double SHA1:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha1sum | tr -d '-' | xxd -r -p | sha1sum | tr -d '-'
+                 In first line will be password and in second - corresponding double SHA1.
+            -->
+            <password></password>
+
+            <!-- List of networks with open access.
+
+                 To open access from everywhere, specify:
+                    <ip>::/0</ip>
+
+                 To open access only from localhost, specify:
+                    <ip>::1</ip>
+                    <ip>127.0.0.1</ip>
+
+                 Each element of list has one of the following forms:
+                 <ip> IP-address or network mask. Examples: 213.180.204.3 or 10.0.0.1/8 or 10.0.0.1/255.255.255.0
+                     2a02:6b8::3 or 2a02:6b8::3/64 or 2a02:6b8::3/ffff:ffff:ffff:ffff::.
+                 <host> Hostname. Example: server01.clickhouse.com.
+                     To check access, DNS query is performed, and all received addresses compared to peer address.
+                 <host_regexp> Regular expression for host names. Example, ^server\d\d-\d\d-\d\.clickhouse\.com$
+                     To check access, DNS PTR query is performed for peer address and then regexp is applied.
+                     Then, for result of PTR query, another DNS query is performed and all received addresses compared to peer address.
+                     Strongly recommended that regexp is ends with $
+                 All results of DNS requests are cached till server restart.
+            -->
+            <networks>
+                <ip>::/0</ip>
+            </networks>
+
+            <!-- Settings profile for user. -->
+            <profile>default</profile>
+
+            <!-- Quota for user. -->
+            <quota>default</quota>
+
+            <!-- User can create other users and grant rights to them. -->
+            <!-- <access_management>1</access_management> -->
+        </default>
+    </users>
+
+    <!-- Quotas. -->
+    <quotas>
+        <!-- Name of quota. -->
+        <default>
+            <!-- Limits for time interval. You could specify many intervals with different limits. -->
+            <interval>
+                <!-- Length of interval. -->
+                <duration>3600</duration>
+
+                <!-- No limits. Just calculate resource usage for time interval. -->
+                <queries>0</queries>
+                <errors>0</errors>
+                <result_rows>0</result_rows>
+                <read_rows>0</read_rows>
+                <execution_time>0</execution_time>
+            </interval>
+        </default>
+    </quotas>
+</clickhouse>
diff --git a/deploy/docker/clickhouse-setup/config.xml b/deploy/docker/clickhouse-setup/config.xml
new file mode 100644
index 0000000000..3bb26a3a36
--- /dev/null
+++ b/deploy/docker/clickhouse-setup/config.xml
@@ -0,0 +1,1304 @@
+<?xml version="1.0"?>
+<!--
+  NOTE: User and query level settings are set up in "users.xml" file.
+  If you have accidentally specified user-level settings here, server won't start.
+  You can either move the settings to the right place inside "users.xml" file
+   or add <skip_check_for_incorrect_settings>1</skip_check_for_incorrect_settings> here.
+-->
+<clickhouse>
+    <logger>
+        <!-- Possible levels [1]:
+
+          - none (turns off logging)
+          - fatal
+          - critical
+          - error
+          - warning
+          - notice
+          - information
+          - debug
+          - trace
+          - test (not for production usage)
+
+            [1]: https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/Logger.h#L105-L114
+        -->
+        <level>trace</level>
+        <log>/var/log/clickhouse-server/clickhouse-server.log</log>
+        <errorlog>/var/log/clickhouse-server/clickhouse-server.err.log</errorlog>
+        <!-- Rotation policy
+             See https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/FileChannel.h#L54-L85
+          -->
+        <size>1000M</size>
+        <count>10</count>
+        <!-- <console>1</console> --> <!-- Default behavior is autodetection (log to console if not daemon mode and is tty) -->
+
+        <!-- Per level overrides (legacy):
+
+        For example to suppress logging of the ConfigReloader you can use:
+        NOTE: levels.logger is reserved, see below.
+        -->
+        <!--
+        <levels>
+          <ConfigReloader>none</ConfigReloader>
+        </levels>
+        -->
+
+        <!-- Per level overrides:
+
+        For example to suppress logging of the RBAC for default user you can use:
+        (But please note that the logger name maybe changed from version to version, even after minor upgrade)
+        -->
+        <!--
+        <levels>
+          <logger>
+            <name>ContextAccess (default)</name>
+            <level>none</level>
+          </logger>
+          <logger>
+            <name>DatabaseOrdinary (test)</name>
+            <level>none</level>
+          </logger>
+        </levels>
+        -->
+    </logger>
+
+    <!-- Add headers to response in options request. OPTIONS method is used in CORS preflight requests. -->
+    <!-- It is off by default. Next headers are obligate for CORS.-->
+    <!-- http_options_response>
+        <header>
+            <name>Access-Control-Allow-Origin</name>
+            <value>*</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Headers</name>
+            <value>origin, x-requested-with</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Methods</name>
+            <value>POST, GET, OPTIONS</value>
+        </header>
+        <header>
+            <name>Access-Control-Max-Age</name>
+            <value>86400</value>
+        </header>
+    </http_options_response -->
+
+    <!-- It is the name that will be shown in the clickhouse-client.
+         By default, anything with "production" will be highlighted in red in query prompt.
+    -->
+    <!--display_name>production</display_name-->
+
+    <!-- Port for HTTP API. See also 'https_port' for secure connections.
+         This interface is also used by ODBC and JDBC drivers (DataGrip, Dbeaver, ...)
+         and by most of web interfaces (embedded UI, Grafana, Redash, ...).
+      -->
+    <http_port>8123</http_port>
+
+    <!-- Port for interaction by native protocol with:
+         - clickhouse-client and other native ClickHouse tools (clickhouse-benchmark, clickhouse-copier);
+         - clickhouse-server with other clickhouse-servers for distributed query processing;
+         - ClickHouse drivers and applications supporting native protocol
+         (this protocol is also informally called as "the TCP protocol");
+         See also 'tcp_port_secure' for secure connections.
+    -->
+    <tcp_port>9000</tcp_port>
+
+    <!-- Compatibility with MySQL protocol.
+         ClickHouse will pretend to be MySQL for applications connecting to this port.
+    -->
+    <mysql_port>9004</mysql_port>
+
+    <!-- Compatibility with PostgreSQL protocol.
+         ClickHouse will pretend to be PostgreSQL for applications connecting to this port.
+    -->
+    <postgresql_port>9005</postgresql_port>
+
+    <!-- HTTP API with TLS (HTTPS).
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <https_port>8443</https_port> -->
+
+    <!-- Native interface with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <tcp_port_secure>9440</tcp_port_secure> -->
+
+    <!-- Native interface wrapped with PROXYv1 protocol
+         PROXYv1 header sent for every connection.
+         ClickHouse will extract information about proxy-forwarded client address from the header.
+    -->
+    <!-- <tcp_with_proxy_port>9011</tcp_with_proxy_port> -->
+
+    <!-- Port for communication between replicas. Used for data exchange.
+         It provides low-level data access between servers.
+         This port should not be accessible from untrusted networks.
+         See also 'interserver_http_credentials'.
+         Data transferred over connections to this port should not go through untrusted networks.
+         See also 'interserver_https_port'.
+      -->
+    <interserver_http_port>9009</interserver_http_port>
+
+    <!-- Port for communication between replicas with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+         See also 'interserver_http_credentials'.
+      -->
+    <!-- <interserver_https_port>9010</interserver_https_port> -->
+
+    <!-- Hostname that is used by other replicas to request this server.
+         If not specified, then it is determined analogous to 'hostname -f' command.
+         This setting could be used to switch replication to another network interface
+         (the server may be connected to multiple networks via multiple addresses)
+      -->
+
+    <!--
+    <interserver_http_host>example.clickhouse.com</interserver_http_host>
+    -->
+
+    <!-- You can specify credentials for authenthication between replicas.
+         This is required when interserver_https_port is accessible from untrusted networks,
+         and also recommended to avoid SSRF attacks from possibly compromised services in your network.
+      -->
+    <!--<interserver_http_credentials>
+        <user>interserver</user>
+        <password></password>
+    </interserver_http_credentials>-->
+
+    <!-- Listen specified address.
+         Use :: (wildcard IPv6 address), if you want to accept connections both with IPv4 and IPv6 from everywhere.
+         Notes:
+         If you open connections from wildcard address, make sure that at least one of the following measures applied:
+         - server is protected by firewall and not accessible from untrusted networks;
+         - all users are restricted to subset of network addresses (see users.xml);
+         - all users have strong passwords, only secure (TLS) interfaces are accessible, or connections are only made via TLS interfaces.
+         - users without password have readonly access.
+         See also: https://www.shodan.io/search?query=clickhouse
+      -->
+    <!-- <listen_host>::</listen_host> -->
+
+
+    <!-- Same for hosts without support for IPv6: -->
+    <!-- <listen_host>0.0.0.0</listen_host> -->
+
+    <!-- Default values - try listen localhost on IPv4 and IPv6. -->
+    <!--
+    <listen_host>::1</listen_host>
+    <listen_host>127.0.0.1</listen_host>
+    -->
+
+    <!-- Don't exit if IPv6 or IPv4 networks are unavailable while trying to listen. -->
+    <!-- <listen_try>0</listen_try> -->
+
+    <!-- Allow multiple servers to listen on the same address:port. This is not recommended.
+      -->
+    <!-- <listen_reuse_port>0</listen_reuse_port> -->
+
+    <!-- <listen_backlog>4096</listen_backlog> -->
+
+    <max_connections>4096</max_connections>
+
+    <!-- For 'Connection: keep-alive' in HTTP 1.1 -->
+    <keep_alive_timeout>3</keep_alive_timeout>
+
+    <!-- gRPC protocol (see src/Server/grpc_protos/clickhouse_grpc.proto for the API) -->
+    <!-- <grpc_port>9100</grpc_port> -->
+    <grpc>
+        <enable_ssl>false</enable_ssl>
+
+        <!-- The following two files are used only if enable_ssl=1 -->
+        <ssl_cert_file>/path/to/ssl_cert_file</ssl_cert_file>
+        <ssl_key_file>/path/to/ssl_key_file</ssl_key_file>
+
+        <!-- Whether server will request client for a certificate -->
+        <ssl_require_client_auth>false</ssl_require_client_auth>
+
+        <!-- The following file is used only if ssl_require_client_auth=1 -->
+        <ssl_ca_cert_file>/path/to/ssl_ca_cert_file</ssl_ca_cert_file>
+
+        <!-- Default transport compression type (can be overridden by client, see the transport_compression_type field in QueryInfo).
+             Supported algorithms: none, deflate, gzip, stream_gzip -->
+        <transport_compression_type>none</transport_compression_type>
+
+        <!-- Default transport compression level. Supported levels: 0..3 -->
+        <transport_compression_level>0</transport_compression_level>
+
+        <!-- Send/receive message size limits in bytes. -1 means unlimited -->
+        <max_send_message_size>-1</max_send_message_size>
+        <max_receive_message_size>-1</max_receive_message_size>
+
+        <!-- Enable if you want very detailed logs -->
+        <verbose_logs>false</verbose_logs>
+    </grpc>
+
+    <!-- Used with https_port and tcp_port_secure. Full ssl options list: https://github.com/ClickHouse-Extras/poco/blob/master/NetSSL_OpenSSL/include/Poco/Net/SSLManager.h#L71 -->
+    <openSSL>
+        <server> <!-- Used for https server AND secure tcp port -->
+            <!-- openssl req -subj "/CN=localhost" -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout /etc/clickhouse-server/server.key -out /etc/clickhouse-server/server.crt -->
+            <certificateFile>/etc/clickhouse-server/server.crt</certificateFile>
+            <privateKeyFile>/etc/clickhouse-server/server.key</privateKeyFile>
+            <!-- dhparams are optional. You can delete the <dhParamsFile> element.
+                 To generate dhparams, use the following command:
+                  openssl dhparam -out /etc/clickhouse-server/dhparam.pem 4096
+                 Only file format with BEGIN DH PARAMETERS is supported.
+              -->
+            <!-- <dhParamsFile>/etc/clickhouse-server/dhparam.pem</dhParamsFile>-->
+            <verificationMode>none</verificationMode>
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+        </server>
+
+        <client> <!-- Used for connecting to https dictionary source and secured Zookeeper communication -->
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+            <!-- Use for self-signed: <verificationMode>none</verificationMode> -->
+            <invalidCertificateHandler>
+                <!-- Use for self-signed: <name>AcceptCertificateHandler</name> -->
+                <name>RejectCertificateHandler</name>
+            </invalidCertificateHandler>
+        </client>
+    </openSSL>
+
+    <!-- Default root page on http[s] server. For example load UI from https://tabix.io/ when opening http://localhost:8123 -->
+    <!--
+    <http_server_default_response><![CDATA[<html ng-app="SMI2"><head><base href="http://ui.tabix.io/"></head><body><div ui-view="" class="content-ui"></div><script src="http://loader.tabix.io/master.js"></script></body></html>]]></http_server_default_response>
+    -->
+
+    <!-- Maximum number of concurrent queries. -->
+    <max_concurrent_queries>100</max_concurrent_queries>
+
+    <!-- Maximum memory usage (resident set size) for server process.
+         Zero value or unset means default. Default is "max_server_memory_usage_to_ram_ratio" of available physical RAM.
+         If the value is larger than "max_server_memory_usage_to_ram_ratio" of available physical RAM, it will be cut down.
+
+         The constraint is checked on query execution time.
+         If a query tries to allocate memory and the current memory usage plus allocation is greater
+          than specified threshold, exception will be thrown.
+
+         It is not practical to set this constraint to small values like just a few gigabytes,
+          because memory allocator will keep this amount of memory in caches and the server will deny service of queries.
+      -->
+    <max_server_memory_usage>0</max_server_memory_usage>
+
+    <!-- Maximum number of threads in the Global thread pool.
+    This will default to a maximum of 10000 threads if not specified.
+    This setting will be useful in scenarios where there are a large number
+    of distributed queries that are running concurrently but are idling most
+    of the time, in which case a higher number of threads might be required.
+    -->
+
+    <max_thread_pool_size>10000</max_thread_pool_size>
+
+    <!-- Number of workers to recycle connections in background (see also drain_timeout).
+         If the pool is full, connection will be drained synchronously. -->
+    <!-- <max_threads_for_connection_collector>10</max_threads_for_connection_collector> -->
+
+    <!-- On memory constrained environments you may have to set this to value larger than 1.
+      -->
+    <max_server_memory_usage_to_ram_ratio>0.9</max_server_memory_usage_to_ram_ratio>
+
+    <!-- Simple server-wide memory profiler. Collect a stack trace at every peak allocation step (in bytes).
+         Data will be stored in system.trace_log table with query_id = empty string.
+         Zero means disabled.
+      -->
+    <total_memory_profiler_step>4194304</total_memory_profiler_step>
+
+    <!-- Collect random allocations and deallocations and write them into system.trace_log with 'MemorySample' trace_type.
+         The probability is for every alloc/free regardless to the size of the allocation.
+         Note that sampling happens only when the amount of untracked memory exceeds the untracked memory limit,
+          which is 4 MiB by default but can be lowered if 'total_memory_profiler_step' is lowered.
+         You may want to set 'total_memory_profiler_step' to 1 for extra fine grained sampling.
+      -->
+    <total_memory_tracker_sample_probability>0</total_memory_tracker_sample_probability>
+
+    <!-- Set limit on number of open files (default: maximum). This setting makes sense on Mac OS X because getrlimit() fails to retrieve
+         correct maximum value. -->
+    <!-- <max_open_files>262144</max_open_files> -->
+
+    <!-- Size of cache of uncompressed blocks of data, used in tables of MergeTree family.
+         In bytes. Cache is single for server. Memory is allocated only on demand.
+         Cache is used when 'use_uncompressed_cache' user setting turned on (off by default).
+         Uncompressed cache is advantageous only for very short queries and in rare cases.
+
+         Note: uncompressed cache can be pointless for lz4, because memory bandwidth
+         is slower than multi-core decompression on some server configurations.
+         Enabling it can sometimes paradoxically make queries slower.
+      -->
+    <uncompressed_cache_size>8589934592</uncompressed_cache_size>
+
+    <!-- Approximate size of mark cache, used in tables of MergeTree family.
+         In bytes. Cache is single for server. Memory is allocated only on demand.
+         You should not lower this value.
+      -->
+    <mark_cache_size>5368709120</mark_cache_size>
+
+
+    <!-- If you enable the `min_bytes_to_use_mmap_io` setting,
+         the data in MergeTree tables can be read with mmap to avoid copying from kernel to userspace.
+         It makes sense only for large files and helps only if data reside in page cache.
+         To avoid frequent open/mmap/munmap/close calls (which are very expensive due to consequent page faults)
+         and to reuse mappings from several threads and queries,
+         the cache of mapped files is maintained. Its size is the number of mapped regions (usually equal to the number of mapped files).
+         The amount of data in mapped files can be monitored
+         in system.metrics, system.metric_log by the MMappedFiles, MMappedFileBytes metrics
+         and in system.asynchronous_metrics, system.asynchronous_metrics_log by the MMapCacheCells metric,
+         and also in system.events, system.processes, system.query_log, system.query_thread_log, system.query_views_log by the
+         CreatedReadBufferMMap, CreatedReadBufferMMapFailed, MMappedFileCacheHits, MMappedFileCacheMisses events.
+         Note that the amount of data in mapped files does not consume memory directly and is not accounted
+         in query or server memory usage - because this memory can be discarded similar to OS page cache.
+         The cache is dropped (the files are closed) automatically on removal of old parts in MergeTree,
+         also it can be dropped manually by the SYSTEM DROP MMAP CACHE query.
+      -->
+    <mmap_cache_size>1000</mmap_cache_size>
+
+    <!-- Cache size in bytes for compiled expressions.-->
+    <compiled_expression_cache_size>134217728</compiled_expression_cache_size>
+
+    <!-- Cache size in elements for compiled expressions.-->
+    <compiled_expression_cache_elements_size>10000</compiled_expression_cache_elements_size>
+
+    <!-- Path to data directory, with trailing slash. -->
+    <path>/var/lib/clickhouse/</path>
+
+    <!-- Path to temporary data for processing hard queries. -->
+    <tmp_path>/var/lib/clickhouse/tmp/</tmp_path>
+    
+    <!-- Disable AuthType plaintext_password and no_password for ACL. -->
+    <!-- <allow_plaintext_password>0</allow_plaintext_password> -->
+    <!-- <allow_no_password>0</allow_no_password> -->`
+
+    <!-- Policy from the <storage_configuration> for the temporary files.
+         If not set <tmp_path> is used, otherwise <tmp_path> is ignored.
+
+         Notes:
+         - move_factor              is ignored
+         - keep_free_space_bytes    is ignored
+         - max_data_part_size_bytes is ignored
+         - you must have exactly one volume in that policy
+    -->
+    <!-- <tmp_policy>tmp</tmp_policy> -->
+
+    <!-- Directory with user provided files that are accessible by 'file' table function. -->
+    <user_files_path>/var/lib/clickhouse/user_files/</user_files_path>
+
+    <!-- LDAP server definitions. -->
+    <ldap_servers>
+        <!-- List LDAP servers with their connection parameters here to later 1) use them as authenticators for dedicated local users,
+              who have 'ldap' authentication mechanism specified instead of 'password', or to 2) use them as remote user directories.
+             Parameters:
+                host - LDAP server hostname or IP, this parameter is mandatory and cannot be empty.
+                port - LDAP server port, default is 636 if enable_tls is set to true, 389 otherwise.
+                bind_dn - template used to construct the DN to bind to.
+                        The resulting DN will be constructed by replacing all '{user_name}' substrings of the template with the actual
+                         user name during each authentication attempt.
+                user_dn_detection - section with LDAP search parameters for detecting the actual user DN of the bound user.
+                        This is mainly used in search filters for further role mapping when the server is Active Directory. The
+                         resulting user DN will be used when replacing '{user_dn}' substrings wherever they are allowed. By default,
+                         user DN is set equal to bind DN, but once search is performed, it will be updated with to the actual detected
+                         user DN value.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}' and '{bind_dn}' substrings
+                             of the template with the actual user name and bind DN during the LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', and '{base_dn}'
+                             substrings of the template with the actual user name, bind DN, and base DN during the LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                verification_cooldown - a period of time, in seconds, after a successful bind attempt, during which a user will be assumed
+                         to be successfully authenticated for all consecutive requests without contacting the LDAP server.
+                        Specify 0 (the default) to disable caching and force contacting the LDAP server for each authentication request.
+                enable_tls - flag to trigger use of secure connection to the LDAP server.
+                        Specify 'no' for plain text (ldap://) protocol (not recommended).
+                        Specify 'yes' for LDAP over SSL/TLS (ldaps://) protocol (recommended, the default).
+                        Specify 'starttls' for legacy StartTLS protocol (plain text (ldap://) protocol, upgraded to TLS).
+                tls_minimum_protocol_version - the minimum protocol version of SSL/TLS.
+                        Accepted values are: 'ssl2', 'ssl3', 'tls1.0', 'tls1.1', 'tls1.2' (the default).
+                tls_require_cert - SSL/TLS peer certificate verification behavior.
+                        Accepted values are: 'never', 'allow', 'try', 'demand' (the default).
+                tls_cert_file - path to certificate file.
+                tls_key_file - path to certificate key file.
+                tls_ca_cert_file - path to CA certificate file.
+                tls_ca_cert_dir - path to the directory containing CA certificates.
+                tls_cipher_suite - allowed cipher suite (in OpenSSL notation).
+             Example:
+                <my_ldap_server>
+                    <host>localhost</host>
+                    <port>636</port>
+                    <bind_dn>uid={user_name},ou=users,dc=example,dc=com</bind_dn>
+                    <verification_cooldown>300</verification_cooldown>
+                    <enable_tls>yes</enable_tls>
+                    <tls_minimum_protocol_version>tls1.2</tls_minimum_protocol_version>
+                    <tls_require_cert>demand</tls_require_cert>
+                    <tls_cert_file>/path/to/tls_cert_file</tls_cert_file>
+                    <tls_key_file>/path/to/tls_key_file</tls_key_file>
+                    <tls_ca_cert_file>/path/to/tls_ca_cert_file</tls_ca_cert_file>
+                    <tls_ca_cert_dir>/path/to/tls_ca_cert_dir</tls_ca_cert_dir>
+                    <tls_cipher_suite>ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:AES256-GCM-SHA384</tls_cipher_suite>
+                </my_ldap_server>
+             Example (typical Active Directory with configured user DN detection for further role mapping):
+                <my_ad_server>
+                    <host>localhost</host>
+                    <port>389</port>
+                    <bind_dn>EXAMPLE\{user_name}</bind_dn>
+                    <user_dn_detection>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <search_filter>(&amp;(objectClass=user)(sAMAccountName={user_name}))</search_filter>
+                    </user_dn_detection>
+                    <enable_tls>no</enable_tls>
+                </my_ad_server>
+        -->
+    </ldap_servers>
+
+    <!-- To enable Kerberos authentication support for HTTP requests (GSS-SPNEGO), for those users who are explicitly configured
+          to authenticate via Kerberos, define a single 'kerberos' section here.
+         Parameters:
+            principal - canonical service principal name, that will be acquired and used when accepting security contexts.
+                    This parameter is optional, if omitted, the default principal will be used.
+                    This parameter cannot be specified together with 'realm' parameter.
+            realm - a realm, that will be used to restrict authentication to only those requests whose initiator's realm matches it.
+                    This parameter is optional, if omitted, no additional filtering by realm will be applied.
+                    This parameter cannot be specified together with 'principal' parameter.
+         Example:
+            <kerberos />
+         Example:
+            <kerberos>
+                <principal>HTTP/clickhouse.example.com@EXAMPLE.COM</principal>
+            </kerberos>
+         Example:
+            <kerberos>
+                <realm>EXAMPLE.COM</realm>
+            </kerberos>
+    -->
+
+    <!-- Sources to read users, roles, access rights, profiles of settings, quotas. -->
+    <user_directories>
+        <users_xml>
+            <!-- Path to configuration file with predefined users. -->
+            <path>users.xml</path>
+        </users_xml>
+        <local_directory>
+            <!-- Path to folder where users created by SQL commands are stored. -->
+            <path>/var/lib/clickhouse/access/</path>
+        </local_directory>
+
+        <!-- To add an LDAP server as a remote user directory of users that are not defined locally, define a single 'ldap' section
+              with the following parameters:
+                server - one of LDAP server names defined in 'ldap_servers' config section above.
+                        This parameter is mandatory and cannot be empty.
+                roles - section with a list of locally defined roles that will be assigned to each user retrieved from the LDAP server.
+                        If no roles are specified here or assigned during role mapping (below), user will not be able to perform any
+                         actions after authentication.
+                role_mapping - section with LDAP search parameters and mapping rules.
+                        When a user authenticates, while still bound to LDAP, an LDAP search is performed using search_filter and the
+                         name of the logged in user. For each entry found during that search, the value of the specified attribute is
+                         extracted. For each attribute value that has the specified prefix, the prefix is removed, and the rest of the
+                         value becomes the name of a local role defined in ClickHouse, which is expected to be created beforehand by
+                         CREATE ROLE command.
+                        There can be multiple 'role_mapping' sections defined inside the same 'ldap' section. All of them will be
+                         applied.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}', '{bind_dn}', and '{user_dn}'
+                             substrings of the template with the actual user name, bind DN, and user DN during each LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', '{user_dn}', and
+                             '{base_dn}' substrings of the template with the actual user name, bind DN, user DN, and base DN during
+                             each LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                    attribute - attribute name whose values will be returned by the LDAP search. 'cn', by default.
+                    prefix - prefix, that will be expected to be in front of each string in the original list of strings returned by
+                             the LDAP search. Prefix will be removed from the original strings and resulting strings will be treated
+                             as local role names. Empty, by default.
+             Example:
+                <ldap>
+                    <server>my_ldap_server</server>
+                    <roles>
+                        <my_local_role1 />
+                        <my_local_role2 />
+                    </roles>
+                    <role_mapping>
+                        <base_dn>ou=groups,dc=example,dc=com</base_dn>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=groupOfNames)(member={bind_dn}))</search_filter>
+                        <attribute>cn</attribute>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+             Example (typical Active Directory with role mapping that relies on the detected user DN):
+                <ldap>
+                    <server>my_ad_server</server>
+                    <role_mapping>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <attribute>CN</attribute>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=group)(member={user_dn}))</search_filter>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+        -->
+    </user_directories>
+
+    <!-- Default profile of settings. -->
+    <default_profile>default</default_profile>
+
+    <!-- Comma-separated list of prefixes for user-defined settings. -->
+    <custom_settings_prefixes></custom_settings_prefixes>
+
+    <!-- System profile of settings. This settings are used by internal processes (Distributed DDL worker and so on). -->
+    <!-- <system_profile>default</system_profile> -->
+
+    <!-- Buffer profile of settings.
+         This settings are used by Buffer storage to flush data to the underlying table.
+         Default: used from system_profile directive.
+    -->
+    <!-- <buffer_profile>default</buffer_profile> -->
+
+    <!-- Default database. -->
+    <default_database>default</default_database>
+
+    <!-- Server time zone could be set here.
+
+         Time zone is used when converting between String and DateTime types,
+          when printing DateTime in text formats and parsing DateTime from text,
+          it is used in date and time related functions, if specific time zone was not passed as an argument.
+
+         Time zone is specified as identifier from IANA time zone database, like UTC or Africa/Abidjan.
+         If not specified, system time zone at server startup is used.
+
+         Please note, that server could display time zone alias instead of specified name.
+         Example: Zulu is an alias for UTC.
+    -->
+    <!-- <timezone>UTC</timezone> -->
+
+    <!-- You can specify umask here (see "man umask"). Server will apply it on startup.
+         Number is always parsed as octal. Default umask is 027 (other users cannot read logs, data files, etc; group can only read).
+    -->
+    <!-- <umask>022</umask> -->
+
+    <!-- Perform mlockall after startup to lower first queries latency
+          and to prevent clickhouse executable from being paged out under high IO load.
+         Enabling this option is recommended but will lead to increased startup time for up to a few seconds.
+    -->
+    <mlock_executable>true</mlock_executable>
+
+    <!-- Reallocate memory for machine code ("text") using huge pages. Highly experimental. -->
+    <remap_executable>false</remap_executable>
+
+    <![CDATA[
+         Uncomment below in order to use JDBC table engine and function.
+
+         To install and run JDBC bridge in background:
+         * [Debian/Ubuntu]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           apt install --no-install-recommends -f ./clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           clickhouse-jdbc-bridge &
+
+         * [CentOS/RHEL]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           yum localinstall -y clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           clickhouse-jdbc-bridge &
+
+         Please refer to https://github.com/ClickHouse/clickhouse-jdbc-bridge#usage for more information.
+    ]]>
+    <!--
+    <jdbc_bridge>
+        <host>127.0.0.1</host>
+        <port>9019</port>
+    </jdbc_bridge>
+    -->
+
+    <!-- Configuration of clusters that could be used in Distributed tables.
+         https://clickhouse.com/docs/en/operations/table_engines/distributed/
+      -->
+    <remote_servers>
+        <!-- Test only shard config for testing distributed storage -->
+        <test_shard_localhost>
+            <!-- Inter-server per-cluster secret for Distributed queries
+                 default: no secret (no authentication will be performed)
+
+                 If set, then Distributed queries will be validated on shards, so at least:
+                 - such cluster should exist on the shard,
+                 - such cluster should have the same secret.
+
+                 And also (and which is more important), the initial_user will
+                 be used as current user for the query.
+
+                 Right now the protocol is pretty simple and it only takes into account:
+                 - cluster name
+                 - query
+
+                 Also it will be nice if the following will be implemented:
+                 - source hostname (see interserver_http_host), but then it will depends from DNS,
+                   it can use IP address instead, but then the you need to get correct on the initiator node.
+                 - target hostname / ip address (same notes as for source hostname)
+                 - time-based security tokens
+            -->
+            <!-- <secret></secret> -->
+
+            <shard>
+                <!-- Optional. Whether to write data to just one of the replicas. Default: false (write data to all replicas). -->
+                <!-- <internal_replication>false</internal_replication> -->
+                <!-- Optional. Shard weight when writing data. Default: 1. -->
+                <!-- <weight>1</weight> -->
+                <replica>
+                    <host>localhost</host>
+                    <port>9000</port>
+                    <!-- Optional. Priority of the replica for load_balancing. Default: 1 (less value has more priority). -->
+                    <!-- <priority>1</priority> -->
+                </replica>
+            </shard>
+        </test_shard_localhost>
+        <test_cluster_one_shard_three_replicas_localhost>
+            <shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <!--shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard-->
+        </test_cluster_one_shard_three_replicas_localhost>
+        <test_cluster_two_shards_localhost>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+        </test_cluster_two_shards_localhost>
+        <test_cluster_two_shards>
+            <shard>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards>
+        <test_cluster_two_shards_internal_replication>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards_internal_replication>
+        <test_shard_localhost_secure>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>9440</port>
+                    <secure>1</secure>
+                </replica>
+            </shard>
+        </test_shard_localhost_secure>
+        <test_unavailable_shard>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>1</port>
+                </replica>
+            </shard>
+        </test_unavailable_shard>
+    </remote_servers>
+
+    <!-- The list of hosts allowed to use in URL-related storage engines and table functions.
+        If this section is not present in configuration, all hosts are allowed.
+    -->
+    <!--<remote_url_allow_hosts>-->
+        <!-- Host should be specified exactly as in URL. The name is checked before DNS resolution.
+            Example: "clickhouse.com", "clickhouse.com." and "www.clickhouse.com" are different hosts.
+                    If port is explicitly specified in URL, the host:port is checked as a whole.
+                    If host specified here without port, any port with this host allowed.
+                    "clickhouse.com" -> "clickhouse.com:443", "clickhouse.com:80" etc. is allowed, but "clickhouse.com:80" -> only "clickhouse.com:80" is allowed.
+            If the host is specified as IP address, it is checked as specified in URL. Example: "[2a02:6b8:a::a]".
+            If there are redirects and support for redirects is enabled, every redirect (the Location field) is checked.
+            Host should be specified using the host xml tag:
+                    <host>clickhouse.com</host>
+        -->
+
+        <!-- Regular expression can be specified. RE2 engine is used for regexps.
+            Regexps are not aligned: don't forget to add ^ and $. Also don't forget to escape dot (.) metacharacter
+            (forgetting to do so is a common source of error).
+        -->
+    <!--</remote_url_allow_hosts>-->
+
+    <!-- If element has 'incl' attribute, then for it's value will be used corresponding substitution from another file.
+         By default, path to file with substitutions is /etc/metrika.xml. It could be changed in config in 'include_from' element.
+         Values for substitutions are specified in /clickhouse/name_of_substitution elements in that file.
+      -->
+
+    <!-- ZooKeeper is used to store metadata about replicas, when using Replicated tables.
+         Optional. If you don't use replicated tables, you could omit that.
+
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/
+      -->
+
+    <!--
+    <zookeeper>
+        <node>
+            <host>example1</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example2</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example3</host>
+            <port>2181</port>
+        </node>
+    </zookeeper>
+    -->
+
+    <!-- Substitutions for parameters of replicated tables.
+          Optional. If you don't use replicated tables, you could omit that.
+
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/#creating-replicated-tables
+      -->
+    <!--
+    <macros>
+        <shard>01</shard>
+        <replica>example01-01-1</replica>
+    </macros>
+    -->
+
+
+    <!-- Reloading interval for embedded dictionaries, in seconds. Default: 3600. -->
+    <builtin_dictionaries_reload_interval>3600</builtin_dictionaries_reload_interval>
+
+
+    <!-- Maximum session timeout, in seconds. Default: 3600. -->
+    <max_session_timeout>3600</max_session_timeout>
+
+    <!-- Default session timeout, in seconds. Default: 60. -->
+    <default_session_timeout>60</default_session_timeout>
+
+    <!-- Sending data to Graphite for monitoring. Several sections can be defined. -->
+    <!--
+        interval - send every X second
+        root_path - prefix for keys
+        hostname_in_path - append hostname to root_path (default = true)
+        metrics - send data from table system.metrics
+        events - send data from table system.events
+        asynchronous_metrics - send data from table system.asynchronous_metrics
+    -->
+    <!--
+    <graphite>
+        <host>localhost</host>
+        <port>42000</port>
+        <timeout>0.1</timeout>
+        <interval>60</interval>
+        <root_path>one_min</root_path>
+        <hostname_in_path>true</hostname_in_path>
+
+        <metrics>true</metrics>
+        <events>true</events>
+        <events_cumulative>false</events_cumulative>
+        <asynchronous_metrics>true</asynchronous_metrics>
+    </graphite>
+    <graphite>
+        <host>localhost</host>
+        <port>42000</port>
+        <timeout>0.1</timeout>
+        <interval>1</interval>
+        <root_path>one_sec</root_path>
+
+        <metrics>true</metrics>
+        <events>true</events>
+        <events_cumulative>false</events_cumulative>
+        <asynchronous_metrics>false</asynchronous_metrics>
+    </graphite>
+    -->
+
+    <!-- Serve endpoint for Prometheus monitoring. -->
+    <!--
+        endpoint - mertics path (relative to root, statring with "/")
+        port - port to setup server. If not defined or 0 than http_port used
+        metrics - send data from table system.metrics
+        events - send data from table system.events
+        asynchronous_metrics - send data from table system.asynchronous_metrics
+        status_info - send data from different component from CH, ex: Dictionaries status
+    -->
+    <!--
+    <prometheus>
+        <endpoint>/metrics</endpoint>
+        <port>9363</port>
+
+        <metrics>true</metrics>
+        <events>true</events>
+        <asynchronous_metrics>true</asynchronous_metrics>
+        <status_info>true</status_info>
+    </prometheus>
+    -->
+
+    <!-- Query log. Used only for queries with setting log_queries = 1. -->
+    <query_log>
+        <!-- What table to insert data. If table is not exist, it will be created.
+             When query log structure is changed after system update,
+              then old table will be renamed and new table will be created automatically.
+        -->
+        <database>system</database>
+        <table>query_log</table>
+        <!--
+            PARTITION BY expr: https://clickhouse.com/docs/en/table_engines/mergetree-family/custom_partitioning_key/
+            Example:
+                event_date
+                toMonday(event_date)
+                toYYYYMM(event_date)
+                toStartOfHour(event_time)
+        -->
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <!--
+            Table TTL specification: https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/mergetree/#mergetree-table-ttl
+            Example:
+                event_date + INTERVAL 1 WEEK
+                event_date + INTERVAL 7 DAY DELETE
+                event_date + INTERVAL 2 WEEK TO DISK 'bbb'
+
+        <ttl>event_date + INTERVAL 30 DAY DELETE</ttl>
+        -->
+
+        <!-- Instead of partition_by, you can provide full engine expression (starting with ENGINE = ) with parameters,
+             Example: <engine>ENGINE = MergeTree PARTITION BY toYYYYMM(event_date) ORDER BY (event_date, event_time) SETTINGS index_granularity = 1024</engine>
+          -->
+
+        <!-- Interval of flushing data. -->
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_log>
+
+    <!-- Trace log. Stores stack traces collected by query profilers.
+         See query_profiler_real_time_period_ns and query_profiler_cpu_time_period_ns settings. -->
+    <trace_log>
+        <database>system</database>
+        <table>trace_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </trace_log>
+
+    <!-- Query thread log. Has information about all threads participated in query execution.
+         Used only for queries with setting log_query_threads = 1. -->
+    <query_thread_log>
+        <database>system</database>
+        <table>query_thread_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_thread_log>
+
+    <!-- Query views log. Has information about all dependent views associated with a query.
+         Used only for queries with setting log_query_views = 1. -->
+    <query_views_log>
+        <database>system</database>
+        <table>query_views_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_views_log>
+
+    <!-- Uncomment if use part log.
+         Part log contains information about all actions with parts in MergeTree tables (creation, deletion, merges, downloads).-->
+    <part_log>
+        <database>system</database>
+        <table>part_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </part_log>
+
+    <!-- Uncomment to write text log into table.
+         Text log contains all information from usual server log but stores it in structured and efficient way.
+         The level of the messages that goes to the table can be limited (<level>), if not specified all messages will go to the table.
+    <text_log>
+        <database>system</database>
+        <table>text_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <level></level>
+    </text_log>
+    -->
+
+    <!-- Metric log contains rows with current values of ProfileEvents, CurrentMetrics collected with "collect_interval_milliseconds" interval. -->
+    <metric_log>
+        <database>system</database>
+        <table>metric_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <collect_interval_milliseconds>1000</collect_interval_milliseconds>
+    </metric_log>
+
+    <!--
+        Asynchronous metric log contains values of metrics from
+        system.asynchronous_metrics.
+    -->
+    <asynchronous_metric_log>
+        <database>system</database>
+        <table>asynchronous_metric_log</table>
+        <!--
+            Asynchronous metrics are updated once a minute, so there is
+            no need to flush more often.
+        -->
+        <flush_interval_milliseconds>7000</flush_interval_milliseconds>
+    </asynchronous_metric_log>
+
+    <!--
+        OpenTelemetry log contains OpenTelemetry trace spans.
+    -->
+    <opentelemetry_span_log>
+        <!--
+            The default table creation code is insufficient, this <engine> spec
+            is a workaround. There is no 'event_time' for this log, but two times,
+            start and finish. It is sorted by finish time, to avoid inserting
+            data too far away in the past (probably we can sometimes insert a span
+            that is seconds earlier than the last span in the table, due to a race
+            between several spans inserted in parallel). This gives the spans a
+            global order that we can use to e.g. retry insertion into some external
+            system.
+        -->
+        <engine>
+            engine MergeTree
+            partition by toYYYYMM(finish_date)
+            order by (finish_date, finish_time_us, trace_id)
+        </engine>
+        <database>system</database>
+        <table>opentelemetry_span_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </opentelemetry_span_log>
+
+
+    <!-- Crash log. Stores stack traces for fatal errors.
+         This table is normally empty. -->
+    <crash_log>
+        <database>system</database>
+        <table>crash_log</table>
+
+        <partition_by />
+        <flush_interval_milliseconds>1000</flush_interval_milliseconds>
+    </crash_log>
+
+    <!-- Session log. Stores user log in (successful or not) and log out events.
+
+        Note: session log has known security issues and should not be used in production.
+    -->
+    <!-- <session_log>
+        <database>system</database>
+        <table>session_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </session_log> -->
+
+    <!-- Profiling on Processors level. -->
+    <processors_profile_log>
+        <database>system</database>
+        <table>processors_profile_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </processors_profile_log>
+
+    <!-- <top_level_domains_path>/var/lib/clickhouse/top_level_domains/</top_level_domains_path> -->
+    <!-- Custom TLD lists.
+         Format: <name>/path/to/file</name>
+
+         Changes will not be applied w/o server restart.
+         Path to the list is under top_level_domains_path (see above).
+    -->
+    <top_level_domains_lists>
+        <!--
+        <public_suffix_list>/path/to/public_suffix_list.dat</public_suffix_list>
+        -->
+    </top_level_domains_lists>
+
+    <!-- Configuration of external dictionaries. See:
+         https://clickhouse.com/docs/en/sql-reference/dictionaries/external-dictionaries/external-dicts
+    -->
+    <dictionaries_config>*_dictionary.xml</dictionaries_config>
+
+    <!-- Configuration of user defined executable functions -->
+    <user_defined_executable_functions_config>*_function.xml</user_defined_executable_functions_config>
+
+    <!-- Uncomment if you want data to be compressed 30-100% better.
+         Don't do that if you just started using ClickHouse.
+      -->
+    <!--
+    <compression>
+        <!- - Set of variants. Checked in order. Last matching case wins. If nothing matches, lz4 will be used. - ->
+        <case>
+
+            <!- - Conditions. All must be satisfied. Some conditions may be omitted. - ->
+            <min_part_size>10000000000</min_part_size>        <!- - Min part size in bytes. - ->
+            <min_part_size_ratio>0.01</min_part_size_ratio>   <!- - Min size of part relative to whole table size. - ->
+
+            <!- - What compression method to use. - ->
+            <method>zstd</method>
+        </case>
+    </compression>
+    -->
+
+    <!-- Configuration of encryption. The server executes a command to
+         obtain an encryption key at startup if such a command is
+         defined, or encryption codecs will be disabled otherwise. The
+         command is executed through /bin/sh and is expected to write
+         a Base64-encoded key to the stdout. -->
+    <encryption_codecs>
+        <!-- aes_128_gcm_siv -->
+            <!-- Example of getting hex key from env -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!--key_hex from_env="..."></key_hex -->
+
+            <!-- Example of multiple hex keys. They can be imported from env or be written down in config-->
+            <!-- the code should use these keys and throw an exception if their length is not 16 bytes -->
+            <!-- key_hex id="0">...</key_hex -->
+            <!-- key_hex id="1" from_env=".."></key_hex -->
+            <!-- key_hex id="2">...</key_hex -->
+            <!-- current_key_id>2</current_key_id -->
+
+            <!-- Example of getting hex key from config -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!-- key>...</key -->
+
+            <!-- example of adding nonce -->
+            <!-- nonce>...</nonce -->
+
+        <!-- /aes_128_gcm_siv -->
+    </encryption_codecs>
+
+    <!-- Allow to execute distributed DDL queries (CREATE, DROP, ALTER, RENAME) on cluster.
+         Works only if ZooKeeper is enabled. Comment it if such functionality isn't required. -->
+    <distributed_ddl>
+        <!-- Path in ZooKeeper to queue with DDL queries -->
+        <path>/clickhouse/task_queue/ddl</path>
+
+        <!-- Settings from this profile will be used to execute DDL queries -->
+        <!-- <profile>default</profile> -->
+
+        <!-- Controls how much ON CLUSTER queries can be run simultaneously. -->
+        <!-- <pool_size>1</pool_size> -->
+
+        <!--
+             Cleanup settings (active tasks will not be removed)
+        -->
+
+        <!-- Controls task TTL (default 1 week) -->
+        <!-- <task_max_lifetime>604800</task_max_lifetime> -->
+
+        <!-- Controls how often cleanup should be performed (in seconds) -->
+        <!-- <cleanup_delay_period>60</cleanup_delay_period> -->
+
+        <!-- Controls how many tasks could be in the queue -->
+        <!-- <max_tasks_in_queue>1000</max_tasks_in_queue> -->
+    </distributed_ddl>
+
+    <!-- Settings to fine tune MergeTree tables. See documentation in source code, in MergeTreeSettings.h -->
+    <!--
+    <merge_tree>
+        <max_suspicious_broken_parts>5</max_suspicious_broken_parts>
+    </merge_tree>
+    -->
+
+    <!-- Protection from accidental DROP.
+         If size of a MergeTree table is greater than max_table_size_to_drop (in bytes) than table could not be dropped with any DROP query.
+         If you want do delete one table and don't want to change clickhouse-server config, you could create special file <clickhouse-path>/flags/force_drop_table and make DROP once.
+         By default max_table_size_to_drop is 50GB; max_table_size_to_drop=0 allows to DROP any tables.
+         The same for max_partition_size_to_drop.
+         Uncomment to disable protection.
+    -->
+    <!-- <max_table_size_to_drop>0</max_table_size_to_drop> -->
+    <!-- <max_partition_size_to_drop>0</max_partition_size_to_drop> -->
+
+    <!-- Example of parameters for GraphiteMergeTree table engine -->
+    <graphite_rollup_example>
+        <pattern>
+            <regexp>click_cost</regexp>
+            <function>any</function>
+            <retention>
+                <age>0</age>
+                <precision>3600</precision>
+            </retention>
+            <retention>
+                <age>86400</age>
+                <precision>60</precision>
+            </retention>
+        </pattern>
+        <default>
+            <function>max</function>
+            <retention>
+                <age>0</age>
+                <precision>60</precision>
+            </retention>
+            <retention>
+                <age>3600</age>
+                <precision>300</precision>
+            </retention>
+            <retention>
+                <age>86400</age>
+                <precision>3600</precision>
+            </retention>
+        </default>
+    </graphite_rollup_example>
+
+    <!-- Directory in <clickhouse-path> containing schema files for various input formats.
+         The directory will be created if it doesn't exist.
+      -->
+    <format_schema_path>/var/lib/clickhouse/format_schemas/</format_schema_path>
+
+    <!-- Default query masking rules, matching lines would be replaced with something else in the logs
+        (both text logs and system.query_log).
+        name - name for the rule (optional)
+        regexp - RE2 compatible regular expression (mandatory)
+        replace - substitution string for sensitive data (optional, by default - six asterisks)
+    -->
+    <query_masking_rules>
+        <rule>
+            <name>hide encrypt/decrypt arguments</name>
+            <regexp>((?:aes_)?(?:encrypt|decrypt)(?:_mysql)?)\s*\(\s*(?:'(?:\\'|.)+'|.*?)\s*\)</regexp>
+            <!-- or more secure, but also more invasive:
+                (aes_\w+)\s*\(.*\)
+            -->
+            <replace>\1(???)</replace>
+        </rule>
+    </query_masking_rules>
+
+    <!-- Uncomment to use custom http handlers.
+        rules are checked from top to bottom, first match runs the handler
+            url - to match request URL, you can use 'regex:' prefix to use regex match(optional)
+            methods - to match request method, you can use commas to separate multiple method matches(optional)
+            headers - to match request headers, match each child element(child element name is header name), you can use 'regex:' prefix to use regex match(optional)
+        handler is request handler
+            type - supported types: static, dynamic_query_handler, predefined_query_handler
+            query - use with predefined_query_handler type, executes query when the handler is called
+            query_param_name - use with dynamic_query_handler type, extracts and executes the value corresponding to the <query_param_name> value in HTTP request params
+            status - use with static type, response status code
+            content_type - use with static type, response content-type
+            response_content - use with static type, Response content sent to client, when using the prefix 'file://' or 'config://', find the content from the file or configuration send to client.
+
+    <http_handlers>
+        <rule>
+            <url>/</url>
+            <methods>POST,GET</methods>
+            <headers><pragma>no-cache</pragma></headers>
+            <handler>
+                <type>dynamic_query_handler</type>
+                <query_param_name>query</query_param_name>
+            </handler>
+        </rule>
+
+        <rule>
+            <url>/predefined_query</url>
+            <methods>POST,GET</methods>
+            <handler>
+                <type>predefined_query_handler</type>
+                <query>SELECT * FROM system.settings</query>
+            </handler>
+        </rule>
+
+        <rule>
+            <handler>
+                <type>static</type>
+                <status>200</status>
+                <content_type>text/plain; charset=UTF-8</content_type>
+                <response_content>config://http_server_default_response</response_content>
+            </handler>
+        </rule>
+    </http_handlers>
+    -->
+
+    <send_crash_reports>
+        <!-- Changing <enabled> to true allows sending crash reports to -->
+        <!-- the ClickHouse core developers team via Sentry https://sentry.io -->
+        <!-- Doing so at least in pre-production environments is highly appreciated -->
+        <enabled>false</enabled>
+        <!-- Change <anonymize> to true if you don't feel comfortable attaching the server hostname to the crash report -->
+        <anonymize>false</anonymize>
+        <!-- Default endpoint should be changed to different Sentry DSN only if you have -->
+        <!-- some in-house engineers or hired consultants who're going to debug ClickHouse issues for you -->
+        <endpoint>https://6f33034cfe684dd7a3ab9875e57b1c8d@o388870.ingest.sentry.io/5226277</endpoint>
+    </send_crash_reports>
+
+    <!-- Uncomment to disable ClickHouse internal DNS caching. -->
+    <!-- <disable_internal_dns_cache>1</disable_internal_dns_cache> -->
+
+    <!-- You can also configure rocksdb like this: -->
+    <!--
+    <rocksdb>
+        <options>
+            <max_background_jobs>8</max_background_jobs>
+        </options>
+        <column_family_options>
+            <num_levels>2</num_levels>
+        </column_family_options>
+        <tables>
+            <table>
+                <name>TABLE</name>
+                <options>
+                    <max_background_jobs>8</max_background_jobs>
+                </options>
+                <column_family_options>
+                    <num_levels>2</num_levels>
+                </column_family_options>
+            </table>
+        </tables>
+    </rocksdb>
+    -->
+
+    <!-- Uncomment if enable merge tree metadata cache -->
+    <merge_tree_metadata_cache>
+        <lru_cache_size>268435456</lru_cache_size>
+        <continue_if_corrupted>true</continue_if_corrupted>
+    </merge_tree_metadata_cache>
+</clickhouse>
diff --git a/deploy/docker/clickhouse-setup/docker-compose.arm.yaml b/deploy/docker/clickhouse-setup/docker-compose.arm.yaml
deleted file mode 100644
index c30bf82064..0000000000
--- a/deploy/docker/clickhouse-setup/docker-compose.arm.yaml
+++ /dev/null
@@ -1,133 +0,0 @@
-version: "2.4"
-
-services:
-  clickhouse:
-    image: altinity/clickhouse-server:21.12.3.32.altinitydev.arm
-    # ports:
-    #   - "9000:9000"
-    #   - "8123:8123"
-    volumes:
-      - ./clickhouse-config.xml:/etc/clickhouse-server/config.xml
-      - ./data/clickhouse/:/var/lib/clickhouse/
-    restart: on-failure
-    logging:
-      options:
-        max-size: 50m
-        max-file: "3"
-    healthcheck:
-      # "clickhouse", "client", "-u ${CLICKHOUSE_USER}", "--password ${CLICKHOUSE_PASSWORD}", "-q 'SELECT 1'"
-      test: ["CMD", "wget", "--spider", "-q", "localhost:8123/ping"]
-      interval: 30s
-      timeout: 5s
-      retries: 3
-
-  alertmanager:
-    image: signoz/alertmanager:0.23.0-0.1
-    volumes:
-      - ./data/alertmanager:/data
-    depends_on:
-      query-service:
-        condition: service_healthy
-    restart: on-failure
-    command:
-      - --queryService.url=http://query-service:8085
-      - --storage.path=/data
-
-# Notes for Maintainers/Contributors who will change Line Numbers of Frontend & Query-Section. Please Update Line Numbers in `./scripts/commentLinesForSetup.sh` & `./CONTRIBUTING.md`
-
-
-  query-service:
-    image: signoz/query-service:0.8.2
-    container_name: query-service
-    command: ["-config=/root/config/prometheus.yml"]
-    # ports:
-    #   - "6060:6060"     # pprof port
-    #   - "8080:8080"     # query-service port
-    volumes:
-      - ./prometheus.yml:/root/config/prometheus.yml
-      - ../dashboards:/root/config/dashboards
-      - ./data/signoz/:/var/lib/signoz/
-    environment:
-      - ClickHouseUrl=tcp://clickhouse:9000/?database=signoz_traces
-      - STORAGE=clickhouse
-      - GODEBUG=netdns=go
-      - TELEMETRY_ENABLED=true
-      - DEPLOYMENT_TYPE=docker-standalone-arm
-    restart: on-failure
-    healthcheck:
-      test: ["CMD", "wget", "--spider", "-q", "localhost:8080/api/v1/version"]
-      interval: 30s
-      timeout: 5s
-      retries: 3
-    depends_on:
-      clickhouse:
-        condition: service_healthy
-
-  frontend:
-    image: signoz/frontend:0.8.2
-    container_name: frontend
-    restart: on-failure
-    depends_on:
-      - alertmanager
-      - query-service
-    ports:
-      - "3301:3301"
-    volumes:
-      - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
-
-  otel-collector:
-    image: signoz/otelcontribcol:0.45.1-0.3
-    command: ["--config=/etc/otel-collector-config.yaml"]
-    volumes:
-      - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
-    ports:
-      - "4317:4317"     # OTLP gRPC receiver
-      - "4318:4318"     # OTLP HTTP receiver
-      # - "8889:8889"     # Prometheus metrics exposed by the agent
-      # - "13133:13133"   # health_check
-      # - "14268:14268"   # Jaeger receiver
-      # - "55678:55678"   # OpenCensus receiver
-      # - "55679:55679"   # zpages extension
-      # - "55680:55680"   # OTLP gRPC legacy receiver
-      # - "55681:55681"   # OTLP HTTP legacy receiver
-    mem_limit: 2000m
-    restart: on-failure
-    depends_on:
-      clickhouse:
-        condition: service_healthy
-
-  otel-collector-metrics:
-    image: signoz/otelcontribcol:0.45.1-0.3
-    command: ["--config=/etc/otel-collector-metrics-config.yaml"]
-    volumes:
-      - ./otel-collector-metrics-config.yaml:/etc/otel-collector-metrics-config.yaml
-    restart: on-failure
-    depends_on:
-      clickhouse:
-        condition: service_healthy
-
-  hotrod:
-    image: jaegertracing/example-hotrod:1.30
-    container_name: hotrod
-    logging:
-      options:
-        max-size: 50m
-        max-file: "3"
-    command: ["all"]
-    environment:
-      - JAEGER_ENDPOINT=http://otel-collector:14268/api/traces
-
-  load-hotrod:
-    image: "grubykarol/locust:1.2.3-python3.9-alpine3.12"
-    container_name: load-hotrod
-    hostname: load-hotrod
-    environment:
-      ATTACKED_HOST: http://hotrod:8080
-      LOCUST_MODE: standalone
-      NO_PROXY: standalone
-      TASK_DELAY_FROM: 5
-      TASK_DELAY_TO: 30
-      QUIET_MODE: "${QUIET_MODE:-false}"
-      LOCUST_OPTS: "--headless -u 10 -r 1"
-    volumes:
-      - ../common/locust-scripts:/locust
diff --git a/deploy/docker/clickhouse-setup/docker-compose.yaml b/deploy/docker/clickhouse-setup/docker-compose.yaml
index 44a0e25554..166a2096e3 100644
--- a/deploy/docker/clickhouse-setup/docker-compose.yaml
+++ b/deploy/docker/clickhouse-setup/docker-compose.yaml
@@ -2,12 +2,14 @@ version: "2.4"
 
 services:
   clickhouse:
-    image: yandex/clickhouse-server:21.12.3.32
+    image: clickhouse/clickhouse-server:22.4.5-alpine
     # ports:
     # - "9000:9000"
     # - "8123:8123"
     volumes:
       - ./clickhouse-config.xml:/etc/clickhouse-server/config.xml
+      - ./clickhouse-users.xml:/etc/clickhouse-server/users.xml
+      # - ./clickhouse-storage.xml:/etc/clickhouse-server/config.d/storage.xml
       - ./data/clickhouse/:/var/lib/clickhouse/
     restart: on-failure
     logging:
diff --git a/deploy/docker/clickhouse-setup/users.xml b/deploy/docker/clickhouse-setup/users.xml
new file mode 100644
index 0000000000..f18562071d
--- /dev/null
+++ b/deploy/docker/clickhouse-setup/users.xml
@@ -0,0 +1,123 @@
+<?xml version="1.0"?>
+<clickhouse>
+    <!-- See also the files in users.d directory where the settings can be overridden. -->
+
+    <!-- Profiles of settings. -->
+    <profiles>
+        <!-- Default settings. -->
+        <default>
+            <!-- Maximum memory usage for processing single query, in bytes. -->
+            <max_memory_usage>10000000000</max_memory_usage>
+
+            <!-- How to choose between replicas during distributed query processing.
+                 random - choose random replica from set of replicas with minimum number of errors
+                 nearest_hostname - from set of replicas with minimum number of errors, choose replica
+                  with minimum number of different symbols between replica's hostname and local hostname
+                  (Hamming distance).
+                 in_order - first live replica is chosen in specified order.
+                 first_or_random - if first replica one has higher number of errors, pick a random one from replicas with minimum number of errors.
+            -->
+            <load_balancing>random</load_balancing>
+        </default>
+
+        <!-- Profile that allows only read queries. -->
+        <readonly>
+            <readonly>1</readonly>
+        </readonly>
+    </profiles>
+
+    <!-- Users and ACL. -->
+    <users>
+        <!-- If user name was not specified, 'default' user is used. -->
+        <default>
+            <!-- See also the files in users.d directory where the password can be overridden.
+
+                 Password could be specified in plaintext or in SHA256 (in hex format).
+
+                 If you want to specify password in plaintext (not recommended), place it in 'password' element.
+                 Example: <password>qwerty</password>.
+                 Password could be empty.
+
+                 If you want to specify SHA256, place it in 'password_sha256_hex' element.
+                 Example: <password_sha256_hex>65e84be33532fb784c48129675f9eff3a682b27168c0ea744b2cf58ee02337c5</password_sha256_hex>
+                 Restrictions of SHA256: impossibility to connect to ClickHouse using MySQL JS client (as of July 2019).
+
+                 If you want to specify double SHA1, place it in 'password_double_sha1_hex' element.
+                 Example: <password_double_sha1_hex>e395796d6546b1b65db9d665cd43f0e858dd4303</password_double_sha1_hex>
+
+                 If you want to specify a previously defined LDAP server (see 'ldap_servers' in the main config) for authentication,
+                  place its name in 'server' element inside 'ldap' element.
+                 Example: <ldap><server>my_ldap_server</server></ldap>
+
+                 If you want to authenticate the user via Kerberos (assuming Kerberos is enabled, see 'kerberos' in the main config),
+                  place 'kerberos' element instead of 'password' (and similar) elements.
+                 The name part of the canonical principal name of the initiator must match the user name for authentication to succeed.
+                 You can also place 'realm' element inside 'kerberos' element to further restrict authentication to only those requests
+                  whose initiator's realm matches it.
+                 Example: <kerberos />
+                 Example: <kerberos><realm>EXAMPLE.COM</realm></kerberos>
+
+                 How to generate decent password:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha256sum | tr -d '-'
+                 In first line will be password and in second - corresponding SHA256.
+
+                 How to generate double SHA1:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha1sum | tr -d '-' | xxd -r -p | sha1sum | tr -d '-'
+                 In first line will be password and in second - corresponding double SHA1.
+            -->
+            <password></password>
+
+            <!-- List of networks with open access.
+
+                 To open access from everywhere, specify:
+                    <ip>::/0</ip>
+
+                 To open access only from localhost, specify:
+                    <ip>::1</ip>
+                    <ip>127.0.0.1</ip>
+
+                 Each element of list has one of the following forms:
+                 <ip> IP-address or network mask. Examples: 213.180.204.3 or 10.0.0.1/8 or 10.0.0.1/255.255.255.0
+                     2a02:6b8::3 or 2a02:6b8::3/64 or 2a02:6b8::3/ffff:ffff:ffff:ffff::.
+                 <host> Hostname. Example: server01.clickhouse.com.
+                     To check access, DNS query is performed, and all received addresses compared to peer address.
+                 <host_regexp> Regular expression for host names. Example, ^server\d\d-\d\d-\d\.clickhouse\.com$
+                     To check access, DNS PTR query is performed for peer address and then regexp is applied.
+                     Then, for result of PTR query, another DNS query is performed and all received addresses compared to peer address.
+                     Strongly recommended that regexp is ends with $
+                 All results of DNS requests are cached till server restart.
+            -->
+            <networks>
+                <ip>::/0</ip>
+            </networks>
+
+            <!-- Settings profile for user. -->
+            <profile>default</profile>
+
+            <!-- Quota for user. -->
+            <quota>default</quota>
+
+            <!-- User can create other users and grant rights to them. -->
+            <!-- <access_management>1</access_management> -->
+        </default>
+    </users>
+
+    <!-- Quotas. -->
+    <quotas>
+        <!-- Name of quota. -->
+        <default>
+            <!-- Limits for time interval. You could specify many intervals with different limits. -->
+            <interval>
+                <!-- Length of interval. -->
+                <duration>3600</duration>
+
+                <!-- No limits. Just calculate resource usage for time interval. -->
+                <queries>0</queries>
+                <errors>0</errors>
+                <result_rows>0</result_rows>
+                <read_rows>0</read_rows>
+                <execution_time>0</execution_time>
+            </interval>
+        </default>
+    </quotas>
+</clickhouse>
diff --git a/pkg/query-service/tests/test-deploy/clickhouse-config.xml b/pkg/query-service/tests/test-deploy/clickhouse-config.xml
index 06ddb2b723..3bb26a3a36 100644
--- a/pkg/query-service/tests/test-deploy/clickhouse-config.xml
+++ b/pkg/query-service/tests/test-deploy/clickhouse-config.xml
@@ -1,136 +1,567 @@
 <?xml version="1.0"?>
-<yandex>
+<!--
+  NOTE: User and query level settings are set up in "users.xml" file.
+  If you have accidentally specified user-level settings here, server won't start.
+  You can either move the settings to the right place inside "users.xml" file
+   or add <skip_check_for_incorrect_settings>1</skip_check_for_incorrect_settings> here.
+-->
+<clickhouse>
     <logger>
-        <level>information</level>
-        <console>1</console>
+        <!-- Possible levels [1]:
+
+          - none (turns off logging)
+          - fatal
+          - critical
+          - error
+          - warning
+          - notice
+          - information
+          - debug
+          - trace
+          - test (not for production usage)
+
+            [1]: https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/Logger.h#L105-L114
+        -->
+        <level>trace</level>
+        <log>/var/log/clickhouse-server/clickhouse-server.log</log>
+        <errorlog>/var/log/clickhouse-server/clickhouse-server.err.log</errorlog>
+        <!-- Rotation policy
+             See https://github.com/pocoproject/poco/blob/poco-1.9.4-release/Foundation/include/Poco/FileChannel.h#L54-L85
+          -->
+        <size>1000M</size>
+        <count>10</count>
+        <!-- <console>1</console> --> <!-- Default behavior is autodetection (log to console if not daemon mode and is tty) -->
+
+        <!-- Per level overrides (legacy):
+
+        For example to suppress logging of the ConfigReloader you can use:
+        NOTE: levels.logger is reserved, see below.
+        -->
+        <!--
+        <levels>
+          <ConfigReloader>none</ConfigReloader>
+        </levels>
+        -->
+
+        <!-- Per level overrides:
+
+        For example to suppress logging of the RBAC for default user you can use:
+        (But please note that the logger name maybe changed from version to version, even after minor upgrade)
+        -->
+        <!--
+        <levels>
+          <logger>
+            <name>ContextAccess (default)</name>
+            <level>none</level>
+          </logger>
+          <logger>
+            <name>DatabaseOrdinary (test)</name>
+            <level>none</level>
+          </logger>
+        </levels>
+        -->
     </logger>
 
+    <!-- Add headers to response in options request. OPTIONS method is used in CORS preflight requests. -->
+    <!-- It is off by default. Next headers are obligate for CORS.-->
+    <!-- http_options_response>
+        <header>
+            <name>Access-Control-Allow-Origin</name>
+            <value>*</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Headers</name>
+            <value>origin, x-requested-with</value>
+        </header>
+        <header>
+            <name>Access-Control-Allow-Methods</name>
+            <value>POST, GET, OPTIONS</value>
+        </header>
+        <header>
+            <name>Access-Control-Max-Age</name>
+            <value>86400</value>
+        </header>
+    </http_options_response -->
+
+    <!-- It is the name that will be shown in the clickhouse-client.
+         By default, anything with "production" will be highlighted in red in query prompt.
+    -->
+    <!--display_name>production</display_name-->
+
+    <!-- Port for HTTP API. See also 'https_port' for secure connections.
+         This interface is also used by ODBC and JDBC drivers (DataGrip, Dbeaver, ...)
+         and by most of web interfaces (embedded UI, Grafana, Redash, ...).
+      -->
     <http_port>8123</http_port>
+
+    <!-- Port for interaction by native protocol with:
+         - clickhouse-client and other native ClickHouse tools (clickhouse-benchmark, clickhouse-copier);
+         - clickhouse-server with other clickhouse-servers for distributed query processing;
+         - ClickHouse drivers and applications supporting native protocol
+         (this protocol is also informally called as "the TCP protocol");
+         See also 'tcp_port_secure' for secure connections.
+    -->
     <tcp_port>9000</tcp_port>
 
-    <!-- For HTTPS and SSL over native protocol. -->
-    <!--
-    <https_port>8443</https_port>
-    <tcp_ssl_port>9440</tcp_ssl_port>
--->
+    <!-- Compatibility with MySQL protocol.
+         ClickHouse will pretend to be MySQL for applications connecting to this port.
+    -->
+    <mysql_port>9004</mysql_port>
 
-<!-- Used with https_port and tcp_ssl_port. Full ssl options list: https://github.com/yandex/ClickHouse/blob/master/contrib/libpoco/NetSSL_OpenSSL/include/Poco/Net/SSLManager.h#L71 -->
-<openSSL>
-    <server> <!-- Used for https server AND secure tcp port -->
-        <!-- openssl req -subj "/CN=localhost" -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout /etc/clickhouse-server/server.key -out /etc/clickhouse-server/server.crt -->
-        <certificateFile>/etc/clickhouse-server/server.crt</certificateFile>
-        <privateKeyFile>/etc/clickhouse-server/server.key</privateKeyFile>
-        <!-- openssl dhparam -out /etc/clickhouse-server/dhparam.pem 4096 -->
-        <dhParamsFile>/etc/clickhouse-server/dhparam.pem</dhParamsFile>
-        <verificationMode>none</verificationMode>
-        <loadDefaultCAFile>true</loadDefaultCAFile>
-        <cacheSessions>true</cacheSessions>
-        <disableProtocols>sslv2,sslv3</disableProtocols>
-        <preferServerCiphers>true</preferServerCiphers>
-    </server>
+    <!-- Compatibility with PostgreSQL protocol.
+         ClickHouse will pretend to be PostgreSQL for applications connecting to this port.
+    -->
+    <postgresql_port>9005</postgresql_port>
 
-    <client> <!-- Used for connecting to https dictionary source -->
-        <loadDefaultCAFile>true</loadDefaultCAFile>
-        <cacheSessions>true</cacheSessions>
-        <disableProtocols>sslv2,sslv3</disableProtocols>
-        <preferServerCiphers>true</preferServerCiphers>
-        <!-- Use for self-signed: <verificationMode>none</verificationMode> -->
-        <invalidCertificateHandler>
-            <!-- Use for self-signed: <name>AcceptCertificateHandler</name> -->
-            <name>RejectCertificateHandler</name>
-        </invalidCertificateHandler>
-    </client>
-</openSSL>
+    <!-- HTTP API with TLS (HTTPS).
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <https_port>8443</https_port> -->
 
-<!-- Example config for tiered storage -->
-<storage_configuration>
-	<disks>
-		<default>
-		</default>
- 	    <s3>
- 	      <type>s3</type>
-		  <endpoint>http://172.17.0.1:9100/test//</endpoint>
- 	      <access_key_id>ash</access_key_id>
- 	      <secret_access_key>password</secret_access_key>
- 	    </s3>
-	</disks>
-	<policies>
-		<tiered>
-    	<volumes>
-    	  <default>
-    	    <disk>default</disk>
-    	  </default>
-    	  <s3>
-    	    <disk>s3</disk>
-    	  </s3>
-    	</volumes>
-        </tiered>
-	</policies>
-</storage_configuration>
+    <!-- Native interface with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+    -->
+    <!-- <tcp_port_secure>9440</tcp_port_secure> -->
 
+    <!-- Native interface wrapped with PROXYv1 protocol
+         PROXYv1 header sent for every connection.
+         ClickHouse will extract information about proxy-forwarded client address from the header.
+    -->
+    <!-- <tcp_with_proxy_port>9011</tcp_with_proxy_port> -->
 
-<!-- Default root page on http[s] server. For example load UI from https://tabix.io/ when opening http://localhost:8123 -->
-    <!--
-    <http_server_default_response><![CDATA[<html ng-app="SMI2"><head><base href="http://ui.tabix.io/"></head><body><div ui-view="" class="content-ui"></div><script src="http://loader.tabix.io/master.js"></script></body></html>]]></http_server_default_response>
--->
+    <!-- Port for communication between replicas. Used for data exchange.
+         It provides low-level data access between servers.
+         This port should not be accessible from untrusted networks.
+         See also 'interserver_http_credentials'.
+         Data transferred over connections to this port should not go through untrusted networks.
+         See also 'interserver_https_port'.
+      -->
+    <interserver_http_port>9009</interserver_http_port>
 
-<!-- Port for communication between replicas. Used for data exchange. -->
-<interserver_http_port>9009</interserver_http_port>
+    <!-- Port for communication between replicas with TLS.
+         You have to configure certificate to enable this interface.
+         See the openSSL section below.
+         See also 'interserver_http_credentials'.
+      -->
+    <!-- <interserver_https_port>9010</interserver_https_port> -->
 
     <!-- Hostname that is used by other replicas to request this server.
-         If not specified, than it is determined analoguous to 'hostname -f' command.
-         This setting could be used to switch replication to another network interface.
-     -->
+         If not specified, then it is determined analogous to 'hostname -f' command.
+         This setting could be used to switch replication to another network interface
+         (the server may be connected to multiple networks via multiple addresses)
+      -->
+
     <!--
-    <interserver_http_host>example.yandex.ru</interserver_http_host>
--->
+    <interserver_http_host>example.clickhouse.com</interserver_http_host>
+    -->
 
-<!-- Listen specified host. use :: (wildcard IPv6 address), if you want to accept connections both with IPv4 and IPv6 from everywhere. -->
-<listen_host>::</listen_host>
-<!-- Same for hosts with disabled ipv6: -->
-<!-- <listen_host>0.0.0.0</listen_host> -->
+    <!-- You can specify credentials for authenthication between replicas.
+         This is required when interserver_https_port is accessible from untrusted networks,
+         and also recommended to avoid SSRF attacks from possibly compromised services in your network.
+      -->
+    <!--<interserver_http_credentials>
+        <user>interserver</user>
+        <password></password>
+    </interserver_http_credentials>-->
 
-<!-- Default values - try listen localhost on ipv4 and ipv6: -->
-<!-- <listen_host>0.0.0.0</listen_host> -->
+    <!-- Listen specified address.
+         Use :: (wildcard IPv6 address), if you want to accept connections both with IPv4 and IPv6 from everywhere.
+         Notes:
+         If you open connections from wildcard address, make sure that at least one of the following measures applied:
+         - server is protected by firewall and not accessible from untrusted networks;
+         - all users are restricted to subset of network addresses (see users.xml);
+         - all users have strong passwords, only secure (TLS) interfaces are accessible, or connections are only made via TLS interfaces.
+         - users without password have readonly access.
+         See also: https://www.shodan.io/search?query=clickhouse
+      -->
+    <!-- <listen_host>::</listen_host> -->
 
-<max_connections>4096</max_connections>
-<keep_alive_timeout>3</keep_alive_timeout>
 
-<!-- Maximum number of concurrent queries. -->
-<max_concurrent_queries>100</max_concurrent_queries>
+    <!-- Same for hosts without support for IPv6: -->
+    <!-- <listen_host>0.0.0.0</listen_host> -->
+
+    <!-- Default values - try listen localhost on IPv4 and IPv6. -->
+    <!--
+    <listen_host>::1</listen_host>
+    <listen_host>127.0.0.1</listen_host>
+    -->
+
+    <!-- Don't exit if IPv6 or IPv4 networks are unavailable while trying to listen. -->
+    <!-- <listen_try>0</listen_try> -->
+
+    <!-- Allow multiple servers to listen on the same address:port. This is not recommended.
+      -->
+    <!-- <listen_reuse_port>0</listen_reuse_port> -->
+
+    <!-- <listen_backlog>4096</listen_backlog> -->
+
+    <max_connections>4096</max_connections>
+
+    <!-- For 'Connection: keep-alive' in HTTP 1.1 -->
+    <keep_alive_timeout>3</keep_alive_timeout>
+
+    <!-- gRPC protocol (see src/Server/grpc_protos/clickhouse_grpc.proto for the API) -->
+    <!-- <grpc_port>9100</grpc_port> -->
+    <grpc>
+        <enable_ssl>false</enable_ssl>
+
+        <!-- The following two files are used only if enable_ssl=1 -->
+        <ssl_cert_file>/path/to/ssl_cert_file</ssl_cert_file>
+        <ssl_key_file>/path/to/ssl_key_file</ssl_key_file>
+
+        <!-- Whether server will request client for a certificate -->
+        <ssl_require_client_auth>false</ssl_require_client_auth>
+
+        <!-- The following file is used only if ssl_require_client_auth=1 -->
+        <ssl_ca_cert_file>/path/to/ssl_ca_cert_file</ssl_ca_cert_file>
+
+        <!-- Default transport compression type (can be overridden by client, see the transport_compression_type field in QueryInfo).
+             Supported algorithms: none, deflate, gzip, stream_gzip -->
+        <transport_compression_type>none</transport_compression_type>
+
+        <!-- Default transport compression level. Supported levels: 0..3 -->
+        <transport_compression_level>0</transport_compression_level>
+
+        <!-- Send/receive message size limits in bytes. -1 means unlimited -->
+        <max_send_message_size>-1</max_send_message_size>
+        <max_receive_message_size>-1</max_receive_message_size>
+
+        <!-- Enable if you want very detailed logs -->
+        <verbose_logs>false</verbose_logs>
+    </grpc>
+
+    <!-- Used with https_port and tcp_port_secure. Full ssl options list: https://github.com/ClickHouse-Extras/poco/blob/master/NetSSL_OpenSSL/include/Poco/Net/SSLManager.h#L71 -->
+    <openSSL>
+        <server> <!-- Used for https server AND secure tcp port -->
+            <!-- openssl req -subj "/CN=localhost" -new -newkey rsa:2048 -days 365 -nodes -x509 -keyout /etc/clickhouse-server/server.key -out /etc/clickhouse-server/server.crt -->
+            <certificateFile>/etc/clickhouse-server/server.crt</certificateFile>
+            <privateKeyFile>/etc/clickhouse-server/server.key</privateKeyFile>
+            <!-- dhparams are optional. You can delete the <dhParamsFile> element.
+                 To generate dhparams, use the following command:
+                  openssl dhparam -out /etc/clickhouse-server/dhparam.pem 4096
+                 Only file format with BEGIN DH PARAMETERS is supported.
+              -->
+            <!-- <dhParamsFile>/etc/clickhouse-server/dhparam.pem</dhParamsFile>-->
+            <verificationMode>none</verificationMode>
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+        </server>
+
+        <client> <!-- Used for connecting to https dictionary source and secured Zookeeper communication -->
+            <loadDefaultCAFile>true</loadDefaultCAFile>
+            <cacheSessions>true</cacheSessions>
+            <disableProtocols>sslv2,sslv3</disableProtocols>
+            <preferServerCiphers>true</preferServerCiphers>
+            <!-- Use for self-signed: <verificationMode>none</verificationMode> -->
+            <invalidCertificateHandler>
+                <!-- Use for self-signed: <name>AcceptCertificateHandler</name> -->
+                <name>RejectCertificateHandler</name>
+            </invalidCertificateHandler>
+        </client>
+    </openSSL>
+
+    <!-- Default root page on http[s] server. For example load UI from https://tabix.io/ when opening http://localhost:8123 -->
+    <!--
+    <http_server_default_response><![CDATA[<html ng-app="SMI2"><head><base href="http://ui.tabix.io/"></head><body><div ui-view="" class="content-ui"></div><script src="http://loader.tabix.io/master.js"></script></body></html>]]></http_server_default_response>
+    -->
+
+    <!-- Maximum number of concurrent queries. -->
+    <max_concurrent_queries>100</max_concurrent_queries>
+
+    <!-- Maximum memory usage (resident set size) for server process.
+         Zero value or unset means default. Default is "max_server_memory_usage_to_ram_ratio" of available physical RAM.
+         If the value is larger than "max_server_memory_usage_to_ram_ratio" of available physical RAM, it will be cut down.
+
+         The constraint is checked on query execution time.
+         If a query tries to allocate memory and the current memory usage plus allocation is greater
+          than specified threshold, exception will be thrown.
+
+         It is not practical to set this constraint to small values like just a few gigabytes,
+          because memory allocator will keep this amount of memory in caches and the server will deny service of queries.
+      -->
+    <max_server_memory_usage>0</max_server_memory_usage>
+
+    <!-- Maximum number of threads in the Global thread pool.
+    This will default to a maximum of 10000 threads if not specified.
+    This setting will be useful in scenarios where there are a large number
+    of distributed queries that are running concurrently but are idling most
+    of the time, in which case a higher number of threads might be required.
+    -->
+
+    <max_thread_pool_size>10000</max_thread_pool_size>
+
+    <!-- Number of workers to recycle connections in background (see also drain_timeout).
+         If the pool is full, connection will be drained synchronously. -->
+    <!-- <max_threads_for_connection_collector>10</max_threads_for_connection_collector> -->
+
+    <!-- On memory constrained environments you may have to set this to value larger than 1.
+      -->
+    <max_server_memory_usage_to_ram_ratio>0.9</max_server_memory_usage_to_ram_ratio>
+
+    <!-- Simple server-wide memory profiler. Collect a stack trace at every peak allocation step (in bytes).
+         Data will be stored in system.trace_log table with query_id = empty string.
+         Zero means disabled.
+      -->
+    <total_memory_profiler_step>4194304</total_memory_profiler_step>
+
+    <!-- Collect random allocations and deallocations and write them into system.trace_log with 'MemorySample' trace_type.
+         The probability is for every alloc/free regardless to the size of the allocation.
+         Note that sampling happens only when the amount of untracked memory exceeds the untracked memory limit,
+          which is 4 MiB by default but can be lowered if 'total_memory_profiler_step' is lowered.
+         You may want to set 'total_memory_profiler_step' to 1 for extra fine grained sampling.
+      -->
+    <total_memory_tracker_sample_probability>0</total_memory_tracker_sample_probability>
 
     <!-- Set limit on number of open files (default: maximum). This setting makes sense on Mac OS X because getrlimit() fails to retrieve
-    correct maximum value. -->
+         correct maximum value. -->
     <!-- <max_open_files>262144</max_open_files> -->
 
     <!-- Size of cache of uncompressed blocks of data, used in tables of MergeTree family.
          In bytes. Cache is single for server. Memory is allocated only on demand.
          Cache is used when 'use_uncompressed_cache' user setting turned on (off by default).
          Uncompressed cache is advantageous only for very short queries and in rare cases.
-     -->
-     <uncompressed_cache_size>8589934592</uncompressed_cache_size>
+
+         Note: uncompressed cache can be pointless for lz4, because memory bandwidth
+         is slower than multi-core decompression on some server configurations.
+         Enabling it can sometimes paradoxically make queries slower.
+      -->
+    <uncompressed_cache_size>8589934592</uncompressed_cache_size>
 
     <!-- Approximate size of mark cache, used in tables of MergeTree family.
          In bytes. Cache is single for server. Memory is allocated only on demand.
          You should not lower this value.
-     -->
-     <mark_cache_size>5368709120</mark_cache_size>
+      -->
+    <mark_cache_size>5368709120</mark_cache_size>
 
 
-     <!-- Path to data directory, with trailing slash. -->
-     <path>/var/lib/clickhouse/</path>
+    <!-- If you enable the `min_bytes_to_use_mmap_io` setting,
+         the data in MergeTree tables can be read with mmap to avoid copying from kernel to userspace.
+         It makes sense only for large files and helps only if data reside in page cache.
+         To avoid frequent open/mmap/munmap/close calls (which are very expensive due to consequent page faults)
+         and to reuse mappings from several threads and queries,
+         the cache of mapped files is maintained. Its size is the number of mapped regions (usually equal to the number of mapped files).
+         The amount of data in mapped files can be monitored
+         in system.metrics, system.metric_log by the MMappedFiles, MMappedFileBytes metrics
+         and in system.asynchronous_metrics, system.asynchronous_metrics_log by the MMapCacheCells metric,
+         and also in system.events, system.processes, system.query_log, system.query_thread_log, system.query_views_log by the
+         CreatedReadBufferMMap, CreatedReadBufferMMapFailed, MMappedFileCacheHits, MMappedFileCacheMisses events.
+         Note that the amount of data in mapped files does not consume memory directly and is not accounted
+         in query or server memory usage - because this memory can be discarded similar to OS page cache.
+         The cache is dropped (the files are closed) automatically on removal of old parts in MergeTree,
+         also it can be dropped manually by the SYSTEM DROP MMAP CACHE query.
+      -->
+    <mmap_cache_size>1000</mmap_cache_size>
 
-     <!-- Path to temporary data for processing hard queries. -->
-     <tmp_path>/var/lib/clickhouse/tmp/</tmp_path>
+    <!-- Cache size in bytes for compiled expressions.-->
+    <compiled_expression_cache_size>134217728</compiled_expression_cache_size>
 
-     <!-- Path to configuration file with users, access rights, profiles of settings, quotas. -->
-     <users_config>users.xml</users_config>
+    <!-- Cache size in elements for compiled expressions.-->
+    <compiled_expression_cache_elements_size>10000</compiled_expression_cache_elements_size>
 
-     <!-- Default profile of settings.. -->
-     <default_profile>default</default_profile>
+    <!-- Path to data directory, with trailing slash. -->
+    <path>/var/lib/clickhouse/</path>
 
-     <!-- Default database. -->
-     <default_database>default</default_database>
+    <!-- Path to temporary data for processing hard queries. -->
+    <tmp_path>/var/lib/clickhouse/tmp/</tmp_path>
+    
+    <!-- Disable AuthType plaintext_password and no_password for ACL. -->
+    <!-- <allow_plaintext_password>0</allow_plaintext_password> -->
+    <!-- <allow_no_password>0</allow_no_password> -->`
+
+    <!-- Policy from the <storage_configuration> for the temporary files.
+         If not set <tmp_path> is used, otherwise <tmp_path> is ignored.
+
+         Notes:
+         - move_factor              is ignored
+         - keep_free_space_bytes    is ignored
+         - max_data_part_size_bytes is ignored
+         - you must have exactly one volume in that policy
+    -->
+    <!-- <tmp_policy>tmp</tmp_policy> -->
+
+    <!-- Directory with user provided files that are accessible by 'file' table function. -->
+    <user_files_path>/var/lib/clickhouse/user_files/</user_files_path>
+
+    <!-- LDAP server definitions. -->
+    <ldap_servers>
+        <!-- List LDAP servers with their connection parameters here to later 1) use them as authenticators for dedicated local users,
+              who have 'ldap' authentication mechanism specified instead of 'password', or to 2) use them as remote user directories.
+             Parameters:
+                host - LDAP server hostname or IP, this parameter is mandatory and cannot be empty.
+                port - LDAP server port, default is 636 if enable_tls is set to true, 389 otherwise.
+                bind_dn - template used to construct the DN to bind to.
+                        The resulting DN will be constructed by replacing all '{user_name}' substrings of the template with the actual
+                         user name during each authentication attempt.
+                user_dn_detection - section with LDAP search parameters for detecting the actual user DN of the bound user.
+                        This is mainly used in search filters for further role mapping when the server is Active Directory. The
+                         resulting user DN will be used when replacing '{user_dn}' substrings wherever they are allowed. By default,
+                         user DN is set equal to bind DN, but once search is performed, it will be updated with to the actual detected
+                         user DN value.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}' and '{bind_dn}' substrings
+                             of the template with the actual user name and bind DN during the LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', and '{base_dn}'
+                             substrings of the template with the actual user name, bind DN, and base DN during the LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                verification_cooldown - a period of time, in seconds, after a successful bind attempt, during which a user will be assumed
+                         to be successfully authenticated for all consecutive requests without contacting the LDAP server.
+                        Specify 0 (the default) to disable caching and force contacting the LDAP server for each authentication request.
+                enable_tls - flag to trigger use of secure connection to the LDAP server.
+                        Specify 'no' for plain text (ldap://) protocol (not recommended).
+                        Specify 'yes' for LDAP over SSL/TLS (ldaps://) protocol (recommended, the default).
+                        Specify 'starttls' for legacy StartTLS protocol (plain text (ldap://) protocol, upgraded to TLS).
+                tls_minimum_protocol_version - the minimum protocol version of SSL/TLS.
+                        Accepted values are: 'ssl2', 'ssl3', 'tls1.0', 'tls1.1', 'tls1.2' (the default).
+                tls_require_cert - SSL/TLS peer certificate verification behavior.
+                        Accepted values are: 'never', 'allow', 'try', 'demand' (the default).
+                tls_cert_file - path to certificate file.
+                tls_key_file - path to certificate key file.
+                tls_ca_cert_file - path to CA certificate file.
+                tls_ca_cert_dir - path to the directory containing CA certificates.
+                tls_cipher_suite - allowed cipher suite (in OpenSSL notation).
+             Example:
+                <my_ldap_server>
+                    <host>localhost</host>
+                    <port>636</port>
+                    <bind_dn>uid={user_name},ou=users,dc=example,dc=com</bind_dn>
+                    <verification_cooldown>300</verification_cooldown>
+                    <enable_tls>yes</enable_tls>
+                    <tls_minimum_protocol_version>tls1.2</tls_minimum_protocol_version>
+                    <tls_require_cert>demand</tls_require_cert>
+                    <tls_cert_file>/path/to/tls_cert_file</tls_cert_file>
+                    <tls_key_file>/path/to/tls_key_file</tls_key_file>
+                    <tls_ca_cert_file>/path/to/tls_ca_cert_file</tls_ca_cert_file>
+                    <tls_ca_cert_dir>/path/to/tls_ca_cert_dir</tls_ca_cert_dir>
+                    <tls_cipher_suite>ECDHE-ECDSA-AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:AES256-GCM-SHA384</tls_cipher_suite>
+                </my_ldap_server>
+             Example (typical Active Directory with configured user DN detection for further role mapping):
+                <my_ad_server>
+                    <host>localhost</host>
+                    <port>389</port>
+                    <bind_dn>EXAMPLE\{user_name}</bind_dn>
+                    <user_dn_detection>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <search_filter>(&amp;(objectClass=user)(sAMAccountName={user_name}))</search_filter>
+                    </user_dn_detection>
+                    <enable_tls>no</enable_tls>
+                </my_ad_server>
+        -->
+    </ldap_servers>
+
+    <!-- To enable Kerberos authentication support for HTTP requests (GSS-SPNEGO), for those users who are explicitly configured
+          to authenticate via Kerberos, define a single 'kerberos' section here.
+         Parameters:
+            principal - canonical service principal name, that will be acquired and used when accepting security contexts.
+                    This parameter is optional, if omitted, the default principal will be used.
+                    This parameter cannot be specified together with 'realm' parameter.
+            realm - a realm, that will be used to restrict authentication to only those requests whose initiator's realm matches it.
+                    This parameter is optional, if omitted, no additional filtering by realm will be applied.
+                    This parameter cannot be specified together with 'principal' parameter.
+         Example:
+            <kerberos />
+         Example:
+            <kerberos>
+                <principal>HTTP/clickhouse.example.com@EXAMPLE.COM</principal>
+            </kerberos>
+         Example:
+            <kerberos>
+                <realm>EXAMPLE.COM</realm>
+            </kerberos>
+    -->
+
+    <!-- Sources to read users, roles, access rights, profiles of settings, quotas. -->
+    <user_directories>
+        <users_xml>
+            <!-- Path to configuration file with predefined users. -->
+            <path>users.xml</path>
+        </users_xml>
+        <local_directory>
+            <!-- Path to folder where users created by SQL commands are stored. -->
+            <path>/var/lib/clickhouse/access/</path>
+        </local_directory>
+
+        <!-- To add an LDAP server as a remote user directory of users that are not defined locally, define a single 'ldap' section
+              with the following parameters:
+                server - one of LDAP server names defined in 'ldap_servers' config section above.
+                        This parameter is mandatory and cannot be empty.
+                roles - section with a list of locally defined roles that will be assigned to each user retrieved from the LDAP server.
+                        If no roles are specified here or assigned during role mapping (below), user will not be able to perform any
+                         actions after authentication.
+                role_mapping - section with LDAP search parameters and mapping rules.
+                        When a user authenticates, while still bound to LDAP, an LDAP search is performed using search_filter and the
+                         name of the logged in user. For each entry found during that search, the value of the specified attribute is
+                         extracted. For each attribute value that has the specified prefix, the prefix is removed, and the rest of the
+                         value becomes the name of a local role defined in ClickHouse, which is expected to be created beforehand by
+                         CREATE ROLE command.
+                        There can be multiple 'role_mapping' sections defined inside the same 'ldap' section. All of them will be
+                         applied.
+                    base_dn - template used to construct the base DN for the LDAP search.
+                            The resulting DN will be constructed by replacing all '{user_name}', '{bind_dn}', and '{user_dn}'
+                             substrings of the template with the actual user name, bind DN, and user DN during each LDAP search.
+                    scope - scope of the LDAP search.
+                            Accepted values are: 'base', 'one_level', 'children', 'subtree' (the default).
+                    search_filter - template used to construct the search filter for the LDAP search.
+                            The resulting filter will be constructed by replacing all '{user_name}', '{bind_dn}', '{user_dn}', and
+                             '{base_dn}' substrings of the template with the actual user name, bind DN, user DN, and base DN during
+                             each LDAP search.
+                            Note, that the special characters must be escaped properly in XML.
+                    attribute - attribute name whose values will be returned by the LDAP search. 'cn', by default.
+                    prefix - prefix, that will be expected to be in front of each string in the original list of strings returned by
+                             the LDAP search. Prefix will be removed from the original strings and resulting strings will be treated
+                             as local role names. Empty, by default.
+             Example:
+                <ldap>
+                    <server>my_ldap_server</server>
+                    <roles>
+                        <my_local_role1 />
+                        <my_local_role2 />
+                    </roles>
+                    <role_mapping>
+                        <base_dn>ou=groups,dc=example,dc=com</base_dn>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=groupOfNames)(member={bind_dn}))</search_filter>
+                        <attribute>cn</attribute>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+             Example (typical Active Directory with role mapping that relies on the detected user DN):
+                <ldap>
+                    <server>my_ad_server</server>
+                    <role_mapping>
+                        <base_dn>CN=Users,DC=example,DC=com</base_dn>
+                        <attribute>CN</attribute>
+                        <scope>subtree</scope>
+                        <search_filter>(&amp;(objectClass=group)(member={user_dn}))</search_filter>
+                        <prefix>clickhouse_</prefix>
+                    </role_mapping>
+                </ldap>
+        -->
+    </user_directories>
+
+    <!-- Default profile of settings. -->
+    <default_profile>default</default_profile>
+
+    <!-- Comma-separated list of prefixes for user-defined settings. -->
+    <custom_settings_prefixes></custom_settings_prefixes>
+
+    <!-- System profile of settings. This settings are used by internal processes (Distributed DDL worker and so on). -->
+    <!-- <system_profile>default</system_profile> -->
+
+    <!-- Buffer profile of settings.
+         This settings are used by Buffer storage to flush data to the underlying table.
+         Default: used from system_profile directive.
+    -->
+    <!-- <buffer_profile>default</buffer_profile> -->
+
+    <!-- Default database. -->
+    <default_database>default</default_database>
 
     <!-- Server time zone could be set here.
 
@@ -142,62 +573,266 @@
          If not specified, system time zone at server startup is used.
 
          Please note, that server could display time zone alias instead of specified name.
-         Example: W-SU is an alias for Europe/Moscow and Zulu is an alias for UTC.
-     -->
-     <!-- <timezone>Europe/Moscow</timezone> -->
+         Example: Zulu is an alias for UTC.
+    -->
+    <!-- <timezone>UTC</timezone> -->
 
     <!-- You can specify umask here (see "man umask"). Server will apply it on startup.
          Number is always parsed as octal. Default umask is 027 (other users cannot read logs, data files, etc; group can only read).
-     -->
-     <!-- <umask>022</umask> -->
+    -->
+    <!-- <umask>022</umask> -->
+
+    <!-- Perform mlockall after startup to lower first queries latency
+          and to prevent clickhouse executable from being paged out under high IO load.
+         Enabling this option is recommended but will lead to increased startup time for up to a few seconds.
+    -->
+    <mlock_executable>true</mlock_executable>
+
+    <!-- Reallocate memory for machine code ("text") using huge pages. Highly experimental. -->
+    <remap_executable>false</remap_executable>
+
+    <![CDATA[
+         Uncomment below in order to use JDBC table engine and function.
+
+         To install and run JDBC bridge in background:
+         * [Debian/Ubuntu]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           apt install --no-install-recommends -f ./clickhouse-jdbc-bridge_$PKG_VER-1_all.deb
+           clickhouse-jdbc-bridge &
+
+         * [CentOS/RHEL]
+           export MVN_URL=https://repo1.maven.org/maven2/ru/yandex/clickhouse/clickhouse-jdbc-bridge
+           export PKG_VER=$(curl -sL $MVN_URL/maven-metadata.xml | grep '<release>' | sed -e 's|.*>\(.*\)<.*|\1|')
+           wget https://github.com/ClickHouse/clickhouse-jdbc-bridge/releases/download/v$PKG_VER/clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           yum localinstall -y clickhouse-jdbc-bridge-$PKG_VER-1.noarch.rpm
+           clickhouse-jdbc-bridge &
+
+         Please refer to https://github.com/ClickHouse/clickhouse-jdbc-bridge#usage for more information.
+    ]]>
+    <!--
+    <jdbc_bridge>
+        <host>127.0.0.1</host>
+        <port>9019</port>
+    </jdbc_bridge>
+    -->
 
     <!-- Configuration of clusters that could be used in Distributed tables.
-         https://clickhouse.yandex/reference_en.html#Distributed
-     -->
-     <remote_servers incl="clickhouse_remote_servers" >
+         https://clickhouse.com/docs/en/operations/table_engines/distributed/
+      -->
+    <remote_servers>
         <!-- Test only shard config for testing distributed storage -->
         <test_shard_localhost>
+            <!-- Inter-server per-cluster secret for Distributed queries
+                 default: no secret (no authentication will be performed)
+
+                 If set, then Distributed queries will be validated on shards, so at least:
+                 - such cluster should exist on the shard,
+                 - such cluster should have the same secret.
+
+                 And also (and which is more important), the initial_user will
+                 be used as current user for the query.
+
+                 Right now the protocol is pretty simple and it only takes into account:
+                 - cluster name
+                 - query
+
+                 Also it will be nice if the following will be implemented:
+                 - source hostname (see interserver_http_host), but then it will depends from DNS,
+                   it can use IP address instead, but then the you need to get correct on the initiator node.
+                 - target hostname / ip address (same notes as for source hostname)
+                 - time-based security tokens
+            -->
+            <!-- <secret></secret> -->
+
+            <shard>
+                <!-- Optional. Whether to write data to just one of the replicas. Default: false (write data to all replicas). -->
+                <!-- <internal_replication>false</internal_replication> -->
+                <!-- Optional. Shard weight when writing data. Default: 1. -->
+                <!-- <weight>1</weight> -->
+                <replica>
+                    <host>localhost</host>
+                    <port>9000</port>
+                    <!-- Optional. Priority of the replica for load_balancing. Default: 1 (less value has more priority). -->
+                    <!-- <priority>1</priority> -->
+                </replica>
+            </shard>
+        </test_shard_localhost>
+        <test_cluster_one_shard_three_replicas_localhost>
+            <shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <!--shard>
+                <internal_replication>false</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+                <replica>
+                    <host>127.0.0.3</host>
+                    <port>9000</port>
+                </replica>
+            </shard-->
+        </test_cluster_one_shard_three_replicas_localhost>
+        <test_cluster_two_shards_localhost>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+             <shard>
+                 <replica>
+                     <host>localhost</host>
+                     <port>9000</port>
+                 </replica>
+             </shard>
+        </test_cluster_two_shards_localhost>
+        <test_cluster_two_shards>
+            <shard>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards>
+        <test_cluster_two_shards_internal_replication>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.1</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+            <shard>
+                <internal_replication>true</internal_replication>
+                <replica>
+                    <host>127.0.0.2</host>
+                    <port>9000</port>
+                </replica>
+            </shard>
+        </test_cluster_two_shards_internal_replication>
+        <test_shard_localhost_secure>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>9440</port>
+                    <secure>1</secure>
+                </replica>
+            </shard>
+        </test_shard_localhost_secure>
+        <test_unavailable_shard>
             <shard>
                 <replica>
                     <host>localhost</host>
                     <port>9000</port>
                 </replica>
             </shard>
-        </test_shard_localhost>
+            <shard>
+                <replica>
+                    <host>localhost</host>
+                    <port>1</port>
+                </replica>
+            </shard>
+        </test_unavailable_shard>
     </remote_servers>
 
+    <!-- The list of hosts allowed to use in URL-related storage engines and table functions.
+        If this section is not present in configuration, all hosts are allowed.
+    -->
+    <!--<remote_url_allow_hosts>-->
+        <!-- Host should be specified exactly as in URL. The name is checked before DNS resolution.
+            Example: "clickhouse.com", "clickhouse.com." and "www.clickhouse.com" are different hosts.
+                    If port is explicitly specified in URL, the host:port is checked as a whole.
+                    If host specified here without port, any port with this host allowed.
+                    "clickhouse.com" -> "clickhouse.com:443", "clickhouse.com:80" etc. is allowed, but "clickhouse.com:80" -> only "clickhouse.com:80" is allowed.
+            If the host is specified as IP address, it is checked as specified in URL. Example: "[2a02:6b8:a::a]".
+            If there are redirects and support for redirects is enabled, every redirect (the Location field) is checked.
+            Host should be specified using the host xml tag:
+                    <host>clickhouse.com</host>
+        -->
+
+        <!-- Regular expression can be specified. RE2 engine is used for regexps.
+            Regexps are not aligned: don't forget to add ^ and $. Also don't forget to escape dot (.) metacharacter
+            (forgetting to do so is a common source of error).
+        -->
+    <!--</remote_url_allow_hosts>-->
 
     <!-- If element has 'incl' attribute, then for it's value will be used corresponding substitution from another file.
          By default, path to file with substitutions is /etc/metrika.xml. It could be changed in config in 'include_from' element.
-         Values for substitutions are specified in /yandex/name_of_substitution elements in that file.
-     -->
+         Values for substitutions are specified in /clickhouse/name_of_substitution elements in that file.
+      -->
 
     <!-- ZooKeeper is used to store metadata about replicas, when using Replicated tables.
          Optional. If you don't use replicated tables, you could omit that.
 
-         See https://clickhouse.yandex/reference_en.html#Data%20replication
-     -->
-     <zookeeper incl="zookeeper-servers" optional="true" />
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/
+      -->
+
+    <!--
+    <zookeeper>
+        <node>
+            <host>example1</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example2</host>
+            <port>2181</port>
+        </node>
+        <node>
+            <host>example3</host>
+            <port>2181</port>
+        </node>
+    </zookeeper>
+    -->
 
     <!-- Substitutions for parameters of replicated tables.
           Optional. If you don't use replicated tables, you could omit that.
 
-         See https://clickhouse.yandex/reference_en.html#Creating%20replicated%20tables
-     -->
-     <macros incl="macros" optional="true" />
+         See https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/replication/#creating-replicated-tables
+      -->
+    <!--
+    <macros>
+        <shard>01</shard>
+        <replica>example01-01-1</replica>
+    </macros>
+    -->
 
 
-     <!-- Reloading interval for embedded dictionaries, in seconds. Default: 3600. -->
-     <builtin_dictionaries_reload_interval>3600</builtin_dictionaries_reload_interval>
+    <!-- Reloading interval for embedded dictionaries, in seconds. Default: 3600. -->
+    <builtin_dictionaries_reload_interval>3600</builtin_dictionaries_reload_interval>
 
 
-     <!-- Maximum session timeout, in seconds. Default: 3600. -->
-     <max_session_timeout>3600</max_session_timeout>
+    <!-- Maximum session timeout, in seconds. Default: 3600. -->
+    <max_session_timeout>3600</max_session_timeout>
 
-     <!-- Default session timeout, in seconds. Default: 60. -->
-     <default_session_timeout>60</default_session_timeout>
+    <!-- Default session timeout, in seconds. Default: 60. -->
+    <default_session_timeout>60</default_session_timeout>
 
-     <!-- Sending data to Graphite for monitoring. Several sections can be defined. -->
+    <!-- Sending data to Graphite for monitoring. Several sections can be defined. -->
     <!--
         interval - send every X second
         root_path - prefix for keys
@@ -213,10 +848,11 @@
         <timeout>0.1</timeout>
         <interval>60</interval>
         <root_path>one_min</root_path>
-        <hostname_in_path>true<hostname_in_path>
+        <hostname_in_path>true</hostname_in_path>
 
         <metrics>true</metrics>
         <events>true</events>
+        <events_cumulative>false</events_cumulative>
         <asynchronous_metrics>true</asynchronous_metrics>
     </graphite>
     <graphite>
@@ -228,56 +864,219 @@
 
         <metrics>true</metrics>
         <events>true</events>
+        <events_cumulative>false</events_cumulative>
         <asynchronous_metrics>false</asynchronous_metrics>
     </graphite>
--->
+    -->
 
+    <!-- Serve endpoint for Prometheus monitoring. -->
+    <!--
+        endpoint - mertics path (relative to root, statring with "/")
+        port - port to setup server. If not defined or 0 than http_port used
+        metrics - send data from table system.metrics
+        events - send data from table system.events
+        asynchronous_metrics - send data from table system.asynchronous_metrics
+        status_info - send data from different component from CH, ex: Dictionaries status
+    -->
+    <!--
+    <prometheus>
+        <endpoint>/metrics</endpoint>
+        <port>9363</port>
 
-<!-- Query log. Used only for queries with setting log_queries = 1. -->
-<query_log>
+        <metrics>true</metrics>
+        <events>true</events>
+        <asynchronous_metrics>true</asynchronous_metrics>
+        <status_info>true</status_info>
+    </prometheus>
+    -->
+
+    <!-- Query log. Used only for queries with setting log_queries = 1. -->
+    <query_log>
         <!-- What table to insert data. If table is not exist, it will be created.
              When query log structure is changed after system update,
               then old table will be renamed and new table will be created automatically.
+        -->
+        <database>system</database>
+        <table>query_log</table>
+        <!--
+            PARTITION BY expr: https://clickhouse.com/docs/en/table_engines/mergetree-family/custom_partitioning_key/
+            Example:
+                event_date
+                toMonday(event_date)
+                toYYYYMM(event_date)
+                toStartOfHour(event_time)
+        -->
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <!--
+            Table TTL specification: https://clickhouse.com/docs/en/engines/table-engines/mergetree-family/mergetree/#mergetree-table-ttl
+            Example:
+                event_date + INTERVAL 1 WEEK
+                event_date + INTERVAL 7 DAY DELETE
+                event_date + INTERVAL 2 WEEK TO DISK 'bbb'
+
+        <ttl>event_date + INTERVAL 30 DAY DELETE</ttl>
+        -->
+
+        <!-- Instead of partition_by, you can provide full engine expression (starting with ENGINE = ) with parameters,
+             Example: <engine>ENGINE = MergeTree PARTITION BY toYYYYMM(event_date) ORDER BY (event_date, event_time) SETTINGS index_granularity = 1024</engine>
           -->
-          <database>system</database>
-          <table>query_log</table>
 
-          <!-- Interval of flushing data. -->
-          <flush_interval_milliseconds>7500</flush_interval_milliseconds>
-      </query_log>
+        <!-- Interval of flushing data. -->
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_log>
 
+    <!-- Trace log. Stores stack traces collected by query profilers.
+         See query_profiler_real_time_period_ns and query_profiler_cpu_time_period_ns settings. -->
+    <trace_log>
+        <database>system</database>
+        <table>trace_log</table>
 
-    <!-- Uncomment if use part_log
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </trace_log>
+
+    <!-- Query thread log. Has information about all threads participated in query execution.
+         Used only for queries with setting log_query_threads = 1. -->
+    <query_thread_log>
+        <database>system</database>
+        <table>query_thread_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_thread_log>
+
+    <!-- Query views log. Has information about all dependent views associated with a query.
+         Used only for queries with setting log_query_views = 1. -->
+    <query_views_log>
+        <database>system</database>
+        <table>query_views_log</table>
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </query_views_log>
+
+    <!-- Uncomment if use part log.
+         Part log contains information about all actions with parts in MergeTree tables (creation, deletion, merges, downloads).-->
     <part_log>
         <database>system</database>
         <table>part_log</table>
-
+        <partition_by>toYYYYMM(event_date)</partition_by>
         <flush_interval_milliseconds>7500</flush_interval_milliseconds>
     </part_log>
--->
+
+    <!-- Uncomment to write text log into table.
+         Text log contains all information from usual server log but stores it in structured and efficient way.
+         The level of the messages that goes to the table can be limited (<level>), if not specified all messages will go to the table.
+    <text_log>
+        <database>system</database>
+        <table>text_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <level></level>
+    </text_log>
+    -->
+
+    <!-- Metric log contains rows with current values of ProfileEvents, CurrentMetrics collected with "collect_interval_milliseconds" interval. -->
+    <metric_log>
+        <database>system</database>
+        <table>metric_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+        <collect_interval_milliseconds>1000</collect_interval_milliseconds>
+    </metric_log>
+
+    <!--
+        Asynchronous metric log contains values of metrics from
+        system.asynchronous_metrics.
+    -->
+    <asynchronous_metric_log>
+        <database>system</database>
+        <table>asynchronous_metric_log</table>
+        <!--
+            Asynchronous metrics are updated once a minute, so there is
+            no need to flush more often.
+        -->
+        <flush_interval_milliseconds>7000</flush_interval_milliseconds>
+    </asynchronous_metric_log>
+
+    <!--
+        OpenTelemetry log contains OpenTelemetry trace spans.
+    -->
+    <opentelemetry_span_log>
+        <!--
+            The default table creation code is insufficient, this <engine> spec
+            is a workaround. There is no 'event_time' for this log, but two times,
+            start and finish. It is sorted by finish time, to avoid inserting
+            data too far away in the past (probably we can sometimes insert a span
+            that is seconds earlier than the last span in the table, due to a race
+            between several spans inserted in parallel). This gives the spans a
+            global order that we can use to e.g. retry insertion into some external
+            system.
+        -->
+        <engine>
+            engine MergeTree
+            partition by toYYYYMM(finish_date)
+            order by (finish_date, finish_time_us, trace_id)
+        </engine>
+        <database>system</database>
+        <table>opentelemetry_span_log</table>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </opentelemetry_span_log>
 
 
-    <!-- Parameters for embedded dictionaries, used in Yandex.Metrica.
-         See https://clickhouse.yandex/reference_en.html#Internal%20dictionaries
-     -->
+    <!-- Crash log. Stores stack traces for fatal errors.
+         This table is normally empty. -->
+    <crash_log>
+        <database>system</database>
+        <table>crash_log</table>
 
-     <!-- Path to file with region hierarchy. -->
-     <!-- <path_to_regions_hierarchy_file>/opt/geo/regions_hierarchy.txt</path_to_regions_hierarchy_file> -->
+        <partition_by />
+        <flush_interval_milliseconds>1000</flush_interval_milliseconds>
+    </crash_log>
 
-     <!-- Path to directory with files containing names of regions -->
-     <!-- <path_to_regions_names_files>/opt/geo/</path_to_regions_names_files> -->
+    <!-- Session log. Stores user log in (successful or not) and log out events.
 
+        Note: session log has known security issues and should not be used in production.
+    -->
+    <!-- <session_log>
+        <database>system</database>
+        <table>session_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </session_log> -->
+
+    <!-- Profiling on Processors level. -->
+    <processors_profile_log>
+        <database>system</database>
+        <table>processors_profile_log</table>
+
+        <partition_by>toYYYYMM(event_date)</partition_by>
+        <flush_interval_milliseconds>7500</flush_interval_milliseconds>
+    </processors_profile_log>
+
+    <!-- <top_level_domains_path>/var/lib/clickhouse/top_level_domains/</top_level_domains_path> -->
+    <!-- Custom TLD lists.
+         Format: <name>/path/to/file</name>
+
+         Changes will not be applied w/o server restart.
+         Path to the list is under top_level_domains_path (see above).
+    -->
+    <top_level_domains_lists>
+        <!--
+        <public_suffix_list>/path/to/public_suffix_list.dat</public_suffix_list>
+        -->
+    </top_level_domains_lists>
 
     <!-- Configuration of external dictionaries. See:
-         https://clickhouse.yandex/reference_en.html#External%20Dictionaries
-     -->
-     <dictionaries_config>*_dictionary.xml</dictionaries_config>
+         https://clickhouse.com/docs/en/sql-reference/dictionaries/external-dictionaries/external-dicts
+    -->
+    <dictionaries_config>*_dictionary.xml</dictionaries_config>
+
+    <!-- Configuration of user defined executable functions -->
+    <user_defined_executable_functions_config>*_function.xml</user_defined_executable_functions_config>
 
     <!-- Uncomment if you want data to be compressed 30-100% better.
          Don't do that if you just started using ClickHouse.
-     -->
-     <compression incl="clickhouse_compression">
+      -->
     <!--
+    <compression>
         <!- - Set of variants. Checked in order. Last matching case wins. If nothing matches, lz4 will be used. - ->
         <case>
 
@@ -288,14 +1087,61 @@
             <!- - What compression method to use. - ->
             <method>zstd</method>
         </case>
+    </compression>
     -->
-</compression>
+
+    <!-- Configuration of encryption. The server executes a command to
+         obtain an encryption key at startup if such a command is
+         defined, or encryption codecs will be disabled otherwise. The
+         command is executed through /bin/sh and is expected to write
+         a Base64-encoded key to the stdout. -->
+    <encryption_codecs>
+        <!-- aes_128_gcm_siv -->
+            <!-- Example of getting hex key from env -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!--key_hex from_env="..."></key_hex -->
+
+            <!-- Example of multiple hex keys. They can be imported from env or be written down in config-->
+            <!-- the code should use these keys and throw an exception if their length is not 16 bytes -->
+            <!-- key_hex id="0">...</key_hex -->
+            <!-- key_hex id="1" from_env=".."></key_hex -->
+            <!-- key_hex id="2">...</key_hex -->
+            <!-- current_key_id>2</current_key_id -->
+
+            <!-- Example of getting hex key from config -->
+            <!-- the code should use this key and throw an exception if its length is not 16 bytes -->
+            <!-- key>...</key -->
+
+            <!-- example of adding nonce -->
+            <!-- nonce>...</nonce -->
+
+        <!-- /aes_128_gcm_siv -->
+    </encryption_codecs>
 
     <!-- Allow to execute distributed DDL queries (CREATE, DROP, ALTER, RENAME) on cluster.
-    Works only if ZooKeeper is enabled. Comment it if such functionality isn't required. -->
+         Works only if ZooKeeper is enabled. Comment it if such functionality isn't required. -->
     <distributed_ddl>
         <!-- Path in ZooKeeper to queue with DDL queries -->
         <path>/clickhouse/task_queue/ddl</path>
+
+        <!-- Settings from this profile will be used to execute DDL queries -->
+        <!-- <profile>default</profile> -->
+
+        <!-- Controls how much ON CLUSTER queries can be run simultaneously. -->
+        <!-- <pool_size>1</pool_size> -->
+
+        <!--
+             Cleanup settings (active tasks will not be removed)
+        -->
+
+        <!-- Controls task TTL (default 1 week) -->
+        <!-- <task_max_lifetime>604800</task_max_lifetime> -->
+
+        <!-- Controls how often cleanup should be performed (in seconds) -->
+        <!-- <cleanup_delay_period>60</cleanup_delay_period> -->
+
+        <!-- Controls how many tasks could be in the queue -->
+        <!-- <max_tasks_in_queue>1000</max_tasks_in_queue> -->
     </distributed_ddl>
 
     <!-- Settings to fine tune MergeTree tables. See documentation in source code, in MergeTreeSettings.h -->
@@ -303,239 +1149,156 @@
     <merge_tree>
         <max_suspicious_broken_parts>5</max_suspicious_broken_parts>
     </merge_tree>
--->
+    -->
 
     <!-- Protection from accidental DROP.
          If size of a MergeTree table is greater than max_table_size_to_drop (in bytes) than table could not be dropped with any DROP query.
-         If you want do delete one table and don't want to restart clickhouse-server, you could create special file <clickhouse-path>/flags/force_drop_table and make DROP once.
-         By default max_table_size_to_drop is 50GB, max_table_size_to_drop=0 allows to DROP any tables.
+         If you want do delete one table and don't want to change clickhouse-server config, you could create special file <clickhouse-path>/flags/force_drop_table and make DROP once.
+         By default max_table_size_to_drop is 50GB; max_table_size_to_drop=0 allows to DROP any tables.
+         The same for max_partition_size_to_drop.
          Uncomment to disable protection.
-     -->
-     <!-- <max_table_size_to_drop>0</max_table_size_to_drop> -->
+    -->
+    <!-- <max_table_size_to_drop>0</max_table_size_to_drop> -->
+    <!-- <max_partition_size_to_drop>0</max_partition_size_to_drop> -->
 
-     <!-- Example of parameters for GraphiteMergeTree table engine -->
-     <graphite_rollup>
-        <!-- carbon -->
+    <!-- Example of parameters for GraphiteMergeTree table engine -->
+    <graphite_rollup_example>
         <pattern>
-            <regexp>^carbon\.</regexp>
+            <regexp>click_cost</regexp>
             <function>any</function>
             <retention>
                 <age>0</age>
+                <precision>3600</precision>
+            </retention>
+            <retention>
+                <age>86400</age>
                 <precision>60</precision>
             </retention>
-            <retention>
-                <age>7776000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
         </pattern>
-        <!-- collectd -->
-        <pattern>
-            <regexp>^collectd\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>10</precision>
-            </retention>
-            <retention>
-                <age>43200</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- high -->
-        <pattern>
-            <regexp>^high\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>10</precision>
-            </retention>
-            <retention>
-                <age>172800</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- medium -->
-        <pattern>
-            <regexp>^medium\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>60</precision>
-            </retention>
-            <retention>
-                <age>864000</age>
-                <precision>900</precision>
-            </retention>
-            <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- low -->
-        <pattern>
-            <regexp>^low\.</regexp>
-            <function>any</function>
-            <retention>
-                <age>0</age>
-                <precision>600</precision>
-            </retention>
-            <retention>
-                <age>15552000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>31536000</age>
-                <precision>3600</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>126144000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>252288000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>315360000</age>
-                <precision>604800</precision>
-            </retention>
-        </pattern>
-        <!-- default -->
         <default>
-            <function>any</function>
+            <function>max</function>
             <retention>
                 <age>0</age>
                 <precision>60</precision>
             </retention>
             <retention>
-                <age>864000</age>
-                <precision>900</precision>
+                <age>3600</age>
+                <precision>300</precision>
             </retention>
             <retention>
-                <age>1728000</age>
-                <precision>1800</precision>
-            </retention>
-            <retention>
-                <age>3456000</age>
+                <age>86400</age>
                 <precision>3600</precision>
             </retention>
-            <retention>
-                <age>10368000</age>
-                <precision>21600</precision>
-            </retention>
-            <retention>
-                <age>34560000</age>
-                <precision>43200</precision>
-            </retention>
-            <retention>
-                <age>63072000</age>
-                <precision>86400</precision>
-            </retention>
-            <retention>
-                <age>94608000</age>
-                <precision>604800</precision>
-            </retention>
         </default>
-    </graphite_rollup>
+    </graphite_rollup_example>
 
     <!-- Directory in <clickhouse-path> containing schema files for various input formats.
          The directory will be created if it doesn't exist.
-     -->
-     <format_schema_path>/var/lib/clickhouse/format_schemas/</format_schema_path>
- </yandex>
+      -->
+    <format_schema_path>/var/lib/clickhouse/format_schemas/</format_schema_path>
+
+    <!-- Default query masking rules, matching lines would be replaced with something else in the logs
+        (both text logs and system.query_log).
+        name - name for the rule (optional)
+        regexp - RE2 compatible regular expression (mandatory)
+        replace - substitution string for sensitive data (optional, by default - six asterisks)
+    -->
+    <query_masking_rules>
+        <rule>
+            <name>hide encrypt/decrypt arguments</name>
+            <regexp>((?:aes_)?(?:encrypt|decrypt)(?:_mysql)?)\s*\(\s*(?:'(?:\\'|.)+'|.*?)\s*\)</regexp>
+            <!-- or more secure, but also more invasive:
+                (aes_\w+)\s*\(.*\)
+            -->
+            <replace>\1(???)</replace>
+        </rule>
+    </query_masking_rules>
+
+    <!-- Uncomment to use custom http handlers.
+        rules are checked from top to bottom, first match runs the handler
+            url - to match request URL, you can use 'regex:' prefix to use regex match(optional)
+            methods - to match request method, you can use commas to separate multiple method matches(optional)
+            headers - to match request headers, match each child element(child element name is header name), you can use 'regex:' prefix to use regex match(optional)
+        handler is request handler
+            type - supported types: static, dynamic_query_handler, predefined_query_handler
+            query - use with predefined_query_handler type, executes query when the handler is called
+            query_param_name - use with dynamic_query_handler type, extracts and executes the value corresponding to the <query_param_name> value in HTTP request params
+            status - use with static type, response status code
+            content_type - use with static type, response content-type
+            response_content - use with static type, Response content sent to client, when using the prefix 'file://' or 'config://', find the content from the file or configuration send to client.
+
+    <http_handlers>
+        <rule>
+            <url>/</url>
+            <methods>POST,GET</methods>
+            <headers><pragma>no-cache</pragma></headers>
+            <handler>
+                <type>dynamic_query_handler</type>
+                <query_param_name>query</query_param_name>
+            </handler>
+        </rule>
+
+        <rule>
+            <url>/predefined_query</url>
+            <methods>POST,GET</methods>
+            <handler>
+                <type>predefined_query_handler</type>
+                <query>SELECT * FROM system.settings</query>
+            </handler>
+        </rule>
+
+        <rule>
+            <handler>
+                <type>static</type>
+                <status>200</status>
+                <content_type>text/plain; charset=UTF-8</content_type>
+                <response_content>config://http_server_default_response</response_content>
+            </handler>
+        </rule>
+    </http_handlers>
+    -->
+
+    <send_crash_reports>
+        <!-- Changing <enabled> to true allows sending crash reports to -->
+        <!-- the ClickHouse core developers team via Sentry https://sentry.io -->
+        <!-- Doing so at least in pre-production environments is highly appreciated -->
+        <enabled>false</enabled>
+        <!-- Change <anonymize> to true if you don't feel comfortable attaching the server hostname to the crash report -->
+        <anonymize>false</anonymize>
+        <!-- Default endpoint should be changed to different Sentry DSN only if you have -->
+        <!-- some in-house engineers or hired consultants who're going to debug ClickHouse issues for you -->
+        <endpoint>https://6f33034cfe684dd7a3ab9875e57b1c8d@o388870.ingest.sentry.io/5226277</endpoint>
+    </send_crash_reports>
+
+    <!-- Uncomment to disable ClickHouse internal DNS caching. -->
+    <!-- <disable_internal_dns_cache>1</disable_internal_dns_cache> -->
+
+    <!-- You can also configure rocksdb like this: -->
+    <!--
+    <rocksdb>
+        <options>
+            <max_background_jobs>8</max_background_jobs>
+        </options>
+        <column_family_options>
+            <num_levels>2</num_levels>
+        </column_family_options>
+        <tables>
+            <table>
+                <name>TABLE</name>
+                <options>
+                    <max_background_jobs>8</max_background_jobs>
+                </options>
+                <column_family_options>
+                    <num_levels>2</num_levels>
+                </column_family_options>
+            </table>
+        </tables>
+    </rocksdb>
+    -->
+
+    <!-- Uncomment if enable merge tree metadata cache -->
+    <merge_tree_metadata_cache>
+        <lru_cache_size>268435456</lru_cache_size>
+        <continue_if_corrupted>true</continue_if_corrupted>
+    </merge_tree_metadata_cache>
+</clickhouse>
diff --git a/pkg/query-service/tests/test-deploy/clickhouse-storage.xml b/pkg/query-service/tests/test-deploy/clickhouse-storage.xml
new file mode 100644
index 0000000000..eaf1e7e99d
--- /dev/null
+++ b/pkg/query-service/tests/test-deploy/clickhouse-storage.xml
@@ -0,0 +1,28 @@
+<?xml version="1.0"?>
+<clickhouse>
+<storage_configuration>
+    <disks>
+        <default>
+            <keep_free_space_bytes>10485760</keep_free_space_bytes>
+        </default>
+        <s3>
+            <type>s3</type>
+            <endpoint>http://172.17.0.1:9100/test//</endpoint>
+            <access_key_id>ash</access_key_id>
+            <secret_access_key>password</secret_access_key>
+        </s3>
+   </disks>
+   <policies>
+       <tiered>
+           <volumes>
+                <default>
+                    <disk>default</disk>
+                </default>
+                <s3>
+                    <disk>s3</disk>
+                </s3>
+            </volumes>
+        </tiered>
+    </policies>
+</storage_configuration>
+</clickhouse>
diff --git a/pkg/query-service/tests/test-deploy/clickhouse-users.xml b/pkg/query-service/tests/test-deploy/clickhouse-users.xml
new file mode 100644
index 0000000000..f18562071d
--- /dev/null
+++ b/pkg/query-service/tests/test-deploy/clickhouse-users.xml
@@ -0,0 +1,123 @@
+<?xml version="1.0"?>
+<clickhouse>
+    <!-- See also the files in users.d directory where the settings can be overridden. -->
+
+    <!-- Profiles of settings. -->
+    <profiles>
+        <!-- Default settings. -->
+        <default>
+            <!-- Maximum memory usage for processing single query, in bytes. -->
+            <max_memory_usage>10000000000</max_memory_usage>
+
+            <!-- How to choose between replicas during distributed query processing.
+                 random - choose random replica from set of replicas with minimum number of errors
+                 nearest_hostname - from set of replicas with minimum number of errors, choose replica
+                  with minimum number of different symbols between replica's hostname and local hostname
+                  (Hamming distance).
+                 in_order - first live replica is chosen in specified order.
+                 first_or_random - if first replica one has higher number of errors, pick a random one from replicas with minimum number of errors.
+            -->
+            <load_balancing>random</load_balancing>
+        </default>
+
+        <!-- Profile that allows only read queries. -->
+        <readonly>
+            <readonly>1</readonly>
+        </readonly>
+    </profiles>
+
+    <!-- Users and ACL. -->
+    <users>
+        <!-- If user name was not specified, 'default' user is used. -->
+        <default>
+            <!-- See also the files in users.d directory where the password can be overridden.
+
+                 Password could be specified in plaintext or in SHA256 (in hex format).
+
+                 If you want to specify password in plaintext (not recommended), place it in 'password' element.
+                 Example: <password>qwerty</password>.
+                 Password could be empty.
+
+                 If you want to specify SHA256, place it in 'password_sha256_hex' element.
+                 Example: <password_sha256_hex>65e84be33532fb784c48129675f9eff3a682b27168c0ea744b2cf58ee02337c5</password_sha256_hex>
+                 Restrictions of SHA256: impossibility to connect to ClickHouse using MySQL JS client (as of July 2019).
+
+                 If you want to specify double SHA1, place it in 'password_double_sha1_hex' element.
+                 Example: <password_double_sha1_hex>e395796d6546b1b65db9d665cd43f0e858dd4303</password_double_sha1_hex>
+
+                 If you want to specify a previously defined LDAP server (see 'ldap_servers' in the main config) for authentication,
+                  place its name in 'server' element inside 'ldap' element.
+                 Example: <ldap><server>my_ldap_server</server></ldap>
+
+                 If you want to authenticate the user via Kerberos (assuming Kerberos is enabled, see 'kerberos' in the main config),
+                  place 'kerberos' element instead of 'password' (and similar) elements.
+                 The name part of the canonical principal name of the initiator must match the user name for authentication to succeed.
+                 You can also place 'realm' element inside 'kerberos' element to further restrict authentication to only those requests
+                  whose initiator's realm matches it.
+                 Example: <kerberos />
+                 Example: <kerberos><realm>EXAMPLE.COM</realm></kerberos>
+
+                 How to generate decent password:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha256sum | tr -d '-'
+                 In first line will be password and in second - corresponding SHA256.
+
+                 How to generate double SHA1:
+                 Execute: PASSWORD=$(base64 < /dev/urandom | head -c8); echo "$PASSWORD"; echo -n "$PASSWORD" | sha1sum | tr -d '-' | xxd -r -p | sha1sum | tr -d '-'
+                 In first line will be password and in second - corresponding double SHA1.
+            -->
+            <password></password>
+
+            <!-- List of networks with open access.
+
+                 To open access from everywhere, specify:
+                    <ip>::/0</ip>
+
+                 To open access only from localhost, specify:
+                    <ip>::1</ip>
+                    <ip>127.0.0.1</ip>
+
+                 Each element of list has one of the following forms:
+                 <ip> IP-address or network mask. Examples: 213.180.204.3 or 10.0.0.1/8 or 10.0.0.1/255.255.255.0
+                     2a02:6b8::3 or 2a02:6b8::3/64 or 2a02:6b8::3/ffff:ffff:ffff:ffff::.
+                 <host> Hostname. Example: server01.clickhouse.com.
+                     To check access, DNS query is performed, and all received addresses compared to peer address.
+                 <host_regexp> Regular expression for host names. Example, ^server\d\d-\d\d-\d\.clickhouse\.com$
+                     To check access, DNS PTR query is performed for peer address and then regexp is applied.
+                     Then, for result of PTR query, another DNS query is performed and all received addresses compared to peer address.
+                     Strongly recommended that regexp is ends with $
+                 All results of DNS requests are cached till server restart.
+            -->
+            <networks>
+                <ip>::/0</ip>
+            </networks>
+
+            <!-- Settings profile for user. -->
+            <profile>default</profile>
+
+            <!-- Quota for user. -->
+            <quota>default</quota>
+
+            <!-- User can create other users and grant rights to them. -->
+            <!-- <access_management>1</access_management> -->
+        </default>
+    </users>
+
+    <!-- Quotas. -->
+    <quotas>
+        <!-- Name of quota. -->
+        <default>
+            <!-- Limits for time interval. You could specify many intervals with different limits. -->
+            <interval>
+                <!-- Length of interval. -->
+                <duration>3600</duration>
+
+                <!-- No limits. Just calculate resource usage for time interval. -->
+                <queries>0</queries>
+                <errors>0</errors>
+                <result_rows>0</result_rows>
+                <read_rows>0</read_rows>
+                <execution_time>0</execution_time>
+            </interval>
+        </default>
+    </quotas>
+</clickhouse>
diff --git a/pkg/query-service/tests/test-deploy/docker-compose.arm.yaml b/pkg/query-service/tests/test-deploy/docker-compose.arm.yaml
deleted file mode 100644
index 48a1449fe4..0000000000
--- a/pkg/query-service/tests/test-deploy/docker-compose.arm.yaml
+++ /dev/null
@@ -1,99 +0,0 @@
-version: "2.4"
-
-services:
-  clickhouse:
-    image: altinity/clickhouse-server:21.12.3.32.altinitydev.arm
-    volumes:
-      - ./clickhouse-config.xml:/etc/clickhouse-server/config.xml
-    restart: on-failure
-    logging:
-      options:
-        max-size: 50m
-        max-file: "3"
-    healthcheck:
-      # "clickhouse", "client", "-u ${CLICKHOUSE_USER}", "--password ${CLICKHOUSE_PASSWORD}", "-q 'SELECT 1'"
-      test: ["CMD", "wget", "--spider", "-q", "localhost:8123/ping"]
-      interval: 30s
-      timeout: 5s
-      retries: 3
-
-  alertmanager:
-    image: signoz/alertmanager:0.23.0-0.1
-    depends_on:
-      - query-service
-    restart: on-failure
-    command:
-      - --queryService.url=http://query-service:8085
-      - --storage.path=/data
-
-  query-service:
-    image: signoz/query-service:latest
-    container_name: query-service
-    command: ["-config=/root/config/prometheus.yml"]
-    volumes:
-      - ./prometheus.yml:/root/config/prometheus.yml
-      - ../dashboards:/root/config/dashboards
-      - ./data:/var/lib/signoz
-    ports:
-      - "8180:8080"
-    environment:
-      - ClickHouseUrl=tcp://clickhouse:9000/?database=signoz_traces
-      - STORAGE=clickhouse
-      - GODEBUG=netdns=go
-      - TELEMETRY_ENABLED=true
-    healthcheck:
-      test: ["CMD", "wget", "--spider", "-q", "localhost:8080/api/v1/version"]
-      interval: 30s
-      timeout: 5s
-      retries: 3
-    depends_on:
-      clickhouse:
-        condition: service_healthy
-
-  otel-collector:
-    image: signoz/otelcontribcol:0.45.1-0.3
-    command: ["--config=/etc/otel-collector-config.yaml"]
-    volumes:
-      - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
-    ports:
-      - "4317:4317"       # OTLP GRPC receiver
-    mem_limit: 2000m
-    restart: always
-    depends_on:
-      clickhouse:
-        condition: service_healthy
-
-  otel-collector-metrics:
-    image: signoz/otelcontribcol:0.45.1-0.3
-    command: ["--config=/etc/otel-collector-metrics-config.yaml"]
-    volumes:
-      - ./otel-collector-metrics-config.yaml:/etc/otel-collector-metrics-config.yaml
-    depends_on:
-      clickhouse:
-        condition: service_healthy
-
-  hotrod:
-    image: jaegertracing/example-hotrod:1.30
-    container_name: hotrod
-    logging:
-      options:
-        max-size: 50m
-        max-file: "3"
-    command: ["all"]
-    environment:
-      - JAEGER_ENDPOINT=http://otel-collector:14268/api/traces
-
-  load-hotrod:
-    image: "grubykarol/locust:1.2.3-python3.9-alpine3.12"
-    container_name: load-hotrod
-    hostname: load-hotrod
-    environment:
-      ATTACKED_HOST: http://hotrod:8080
-      LOCUST_MODE: standalone
-      NO_PROXY: standalone
-      TASK_DELAY_FROM: 5
-      TASK_DELAY_TO: 30
-      QUIET_MODE: "${QUIET_MODE:-false}"
-      LOCUST_OPTS: "--headless -u 10 -r 1"
-    volumes:
-      - ../../../../deploy/docker/common/locust-scripts:/locust
diff --git a/pkg/query-service/tests/test-deploy/docker-compose.yaml b/pkg/query-service/tests/test-deploy/docker-compose.yaml
index 4a3ad41870..b1c6a39d7e 100644
--- a/pkg/query-service/tests/test-deploy/docker-compose.yaml
+++ b/pkg/query-service/tests/test-deploy/docker-compose.yaml
@@ -2,9 +2,11 @@ version: "2.4"
 
 services:
   clickhouse:
-    image: yandex/clickhouse-server:21.12.3.32
+    image: clickhouse/clickhouse-server:22.4.5-alpine
     volumes:
       - ./clickhouse-config.xml:/etc/clickhouse-server/config.xml
+      - ./clickhouse-users.xml:/etc/clickhouse-server/users.xml
+      - ./clickhouse-storage.xml:/etc/clickhouse-server/config.d/storage.xml
     restart: on-failure
     logging:
       options:
@@ -17,8 +19,8 @@ services:
       timeout: 5s
       retries: 3
     ports:
-        - "9000:9000"
-        - "8123:8123"
+      - "9000:9000"
+      - "8123:8123"
 
   alertmanager:
     image: signoz/alertmanager:0.23.0-0.1

From d21ab7b82d1cb46ce819834659898de64f266133 Mon Sep 17 00:00:00 2001
From: rw4nn <86979911+rw4nn@users.noreply.github.com>
Date: Thu, 23 Jun 2022 06:55:55 +0200
Subject: [PATCH 21/42] fix(FE): escape regular expression to filter dashboards
 with special characters (#1279)

* fix(FE): escape reg exp to filter dashboards
* test(FE): add type and use uuid v4
---
 .../SearchFilter/__tests__/utils.test.ts      | 58 +++++++++++++++++++
 .../ListOfDashboard/SearchFilter/utils.ts     |  4 +-
 2 files changed, 61 insertions(+), 1 deletion(-)
 create mode 100644 frontend/src/container/ListOfDashboard/SearchFilter/__tests__/utils.test.ts

diff --git a/frontend/src/container/ListOfDashboard/SearchFilter/__tests__/utils.test.ts b/frontend/src/container/ListOfDashboard/SearchFilter/__tests__/utils.test.ts
new file mode 100644
index 0000000000..db9825b677
--- /dev/null
+++ b/frontend/src/container/ListOfDashboard/SearchFilter/__tests__/utils.test.ts
@@ -0,0 +1,58 @@
+import { Dashboard } from 'types/api/dashboard/getAll';
+import { v4 as uuid } from 'uuid';
+
+import { TOperator } from '../types';
+import { executeSearchQueries } from '../utils';
+
+describe('executeSearchQueries', () => {
+	const firstDashboard: Dashboard = {
+		id: 11111,
+		uuid: uuid(),
+		created_at: '',
+		updated_at: '',
+		data: {
+			title: 'first dashboard',
+		},
+	};
+	const secondDashboard: Dashboard = {
+		id: 22222,
+		uuid: uuid(),
+		created_at: '',
+		updated_at: '',
+		data: {
+			title: 'second dashboard',
+		},
+	};
+	const thirdDashboard: Dashboard = {
+		id: 333333,
+		uuid: uuid(),
+		created_at: '',
+		updated_at: '',
+		data: {
+			title: 'third dashboard (with special characters +?\\)',
+		},
+	};
+	const dashboards = [firstDashboard, secondDashboard, thirdDashboard];
+
+	it('should filter dashboards based on title', () => {
+		const query = {
+			category: 'title',
+			id: 'someid',
+			operator: '=' as TOperator,
+			value: 'first dashboard',
+		};
+
+		expect(executeSearchQueries([query], dashboards)).toEqual([firstDashboard]);
+	});
+
+	it('should filter dashboards with special characters', () => {
+		const query = {
+			category: 'title',
+			id: 'someid',
+			operator: '=' as TOperator,
+			value: 'third dashboard (with special characters +?\\)',
+		};
+
+		expect(executeSearchQueries([query], dashboards)).toEqual([thirdDashboard]);
+	});
+});
diff --git a/frontend/src/container/ListOfDashboard/SearchFilter/utils.ts b/frontend/src/container/ListOfDashboard/SearchFilter/utils.ts
index 5f9b37cc3e..6487ccd789 100644
--- a/frontend/src/container/ListOfDashboard/SearchFilter/utils.ts
+++ b/frontend/src/container/ListOfDashboard/SearchFilter/utils.ts
@@ -42,6 +42,8 @@ export const executeSearchQueries = (
 	if (!searchData.length || !queries.length) {
 		return searchData;
 	}
+	const escapeRegExp = (regExp: string): string =>
+		regExp.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
 
 	queries.forEach((query: IQueryStructure) => {
 		const { operator } = query;
@@ -61,7 +63,7 @@ export const executeSearchQueries = (
 				for (const searchSpaceItem of searchSpace) {
 					if (searchSpaceItem)
 						for (const queryValue of value) {
-							if (searchSpaceItem.match(queryValue)) {
+							if (searchSpaceItem.match(escapeRegExp(queryValue))) {
 								return resolveOperator(true, operator);
 							}
 						}

From 63e663a92d88859f0ec5f5438ef9aba8641666ad Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 10:54:15 +0530
Subject: [PATCH 22/42] feat: removed auto save layout from dashboard

---
 frontend/src/container/GridGraphLayout/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/container/GridGraphLayout/index.tsx b/frontend/src/container/GridGraphLayout/index.tsx
index 88250f3b7c..8f7ea56c15 100644
--- a/frontend/src/container/GridGraphLayout/index.tsx
+++ b/frontend/src/container/GridGraphLayout/index.tsx
@@ -218,7 +218,7 @@ function GridGraph(props: Props): JSX.Element {
 	const onLayoutChangeHandler = async (layout: Layout[]): Promise<void> => {
 		setLayoutFunction(layout);
 
-		await onLayoutSaveHandler(layout);
+		// await onLayoutSaveHandler(layout);
 	};
 
 	const onAddPanelHandler = useCallback(() => {

From 1e980c3886701dc12c3b59e3ff29ceb44944da60 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 12:37:42 +0530
Subject: [PATCH 23/42] feat: condition is updated

---
 .../Filters/Panel/PanelBody/CommonCheckBox/index.tsx | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
index 29255ae549..440c9652a7 100644
--- a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
@@ -39,6 +39,10 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 		});
 	};
 
+	const isMoreButtonAvilable = Boolean(
+		numberOfFilters && statusObj.length > numberOfFilters,
+	);
+
 	return (
 		<>
 			{statusObj.length > 0 && (
@@ -62,13 +66,15 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 					}
 					return countA - countB;
 				})
-				.filter((_, index) => index < numberOfFilters)
 				.filter((filter) => {
 					if (searchFilter.length === 0) {
 						return true;
 					}
-					return filter.includes(searchFilter);
+					return filter
+						.toLocaleLowerCase()
+						.includes(searchFilter.toLocaleLowerCase());
 				})
+				.filter((_, index) => index < numberOfFilters)
 				.map((e) => (
 					<CheckBoxComponent
 						key={e}
@@ -80,7 +86,7 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 					/>
 				))}
 
-			{numberOfFilters && statusObj.length > numberOfFilters && (
+			{isMoreButtonAvilable && (
 				<Button onClick={onClickMoreHandler} type="link">
 					More
 				</Button>

From b8c3fd1cbf61c76da5a041222121ddb0c94278fd Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 15:26:44 +0530
Subject: [PATCH 24/42] test: test pipeline for unit test is configured (#1277)

* test: test pipeline is configured
Co-authored-by: Palash gupta <palash@signoz.io>
---
 .github/workflows/build.yaml                  |   2 +
 frontend/jest.setup.ts                        |   1 +
 frontend/package.json                         |   1 +
 .../__snapshots__/NotFound.test.tsx.snap      | 106 +++++++++++++++++-
 .../TraceFlameGraph.test.tsx.snap             |  24 +++-
 frontend/tsconfig.json                        |   3 +-
 frontend/yarn.lock                            |   7 ++
 7 files changed, 134 insertions(+), 10 deletions(-)

diff --git a/.github/workflows/build.yaml b/.github/workflows/build.yaml
index f9096698cc..8f346bf882 100644
--- a/.github/workflows/build.yaml
+++ b/.github/workflows/build.yaml
@@ -17,6 +17,8 @@ jobs:
         run: cd frontend && yarn install
       - name: Run ESLint
         run: cd frontend && npm run lint
+      - name: Run Jest
+        run: cd frontend && npm run jest
       - name: TSC
         run: yarn tsc
         working-directory: ./frontend
diff --git a/frontend/jest.setup.ts b/frontend/jest.setup.ts
index 6557f780cf..b3b8061422 100644
--- a/frontend/jest.setup.ts
+++ b/frontend/jest.setup.ts
@@ -2,3 +2,4 @@
  * Adds custom matchers from the react testing library to all tests
  */
 import '@testing-library/jest-dom';
+import 'jest-styled-components';
diff --git a/frontend/package.json b/frontend/package.json
index ebaffb5fae..f93bc9684c 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -159,6 +159,7 @@
 		"husky": "^7.0.4",
 		"is-ci": "^3.0.1",
 		"jest-playwright-preset": "^1.7.0",
+		"jest-styled-components": "^7.0.8",
 		"less-plugin-npm-import": "^2.1.0",
 		"lint-staged": "^12.3.7",
 		"portfinder-sync": "^0.0.2",
diff --git a/frontend/src/components/NotFound/__snapshots__/NotFound.test.tsx.snap b/frontend/src/components/NotFound/__snapshots__/NotFound.test.tsx.snap
index 0e9ce92e30..9da91a31bd 100644
--- a/frontend/src/components/NotFound/__snapshots__/NotFound.test.tsx.snap
+++ b/frontend/src/components/NotFound/__snapshots__/NotFound.test.tsx.snap
@@ -2,8 +2,102 @@
 
 exports[`Not Found page test should render Not Found page without errors 1`] = `
 <DocumentFragment>
-  <div
-    class="sc-gsDKAQ cLXpIa"
+  .c3 {
+  border: 2px solid #2f80ed;
+  box-sizing: border-box;
+  border-radius: 10px;
+  width: 400px;
+  background: inherit;
+  font-style: normal;
+  font-weight: normal;
+  font-size: 24px;
+  line-height: 20px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  padding-top: 14px;
+  padding-bottom: 14px;
+  color: #2f80ed;
+}
+
+.c0 {
+  min-height: 80vh;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c2 {
+  font-style: normal;
+  font-weight: 300;
+  font-size: 18px;
+  line-height: 20px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  text-align: center;
+  color: #828282;
+  text-align: center;
+  margin: 0;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.c1 {
+  min-height: 50px;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  margin-bottom: 30px;
+  margin-top: 20px;
+}
+
+<div
+    class="c0"
   >
     <svg
       fill="none"
@@ -272,21 +366,21 @@ exports[`Not Found page test should render Not Found page without errors 1`] = `
       </defs>
     </svg>
     <div
-      class="sc-hKwDye foaleg"
+      class="c1"
     >
       <p
-        class="sc-dkPtRN fcyVIq"
+        class="c2"
       >
         Ah, seems like we reached a dead end!
       </p>
       <p
-        class="sc-dkPtRN fcyVIq"
+        class="c2"
       >
         Page Not Found
       </p>
     </div>
     <a
-      class="sc-bdvvtL dbTZkj"
+      class="c3"
       href="/application"
       tabindex="0"
     >
diff --git a/frontend/src/container/TraceFlameGraph/__tests__/__snapshots__/TraceFlameGraph.test.tsx.snap b/frontend/src/container/TraceFlameGraph/__tests__/__snapshots__/TraceFlameGraph.test.tsx.snap
index 39a3638956..c8c24ebfd4 100644
--- a/frontend/src/container/TraceFlameGraph/__tests__/__snapshots__/TraceFlameGraph.test.tsx.snap
+++ b/frontend/src/container/TraceFlameGraph/__tests__/__snapshots__/TraceFlameGraph.test.tsx.snap
@@ -2,12 +2,30 @@
 
 exports[`loads and displays greeting 1`] = `
 <DocumentFragment>
-  <div
-    class="sc-gsDKAQ jFDWPs"
+  .c1 {
+  position: absolute;
+  top: 0px;
+  left: NaN%;
+  width: Infinity%;
+  height: 10px;
+  margin: 1px 0;
+  background-color: hsl(282.9,100%,60.7%);
+  border-radius: 5px;
+  z-index: 1;
+}
+
+.c0 {
+  position: relative;
+  width: 100%;
+  height: 120px;
+}
+
+<div
+    class="c0"
     height="0"
   >
     <div
-      class="sc-bdvvtL fyFVjh"
+      class="c1"
       title=""
       width="Infinity"
     />
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index b3aa27fe50..a10bce6e81 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -35,6 +35,7 @@
 		"playwright.config.ts",
 		"./commitlint.config.js",
 		"./webpack.config.js",
-		"./webpack.config.prod.js"
+		"./webpack.config.prod.js",
+		"./jest.setup.ts"
 	]
 }
diff --git a/frontend/yarn.lock b/frontend/yarn.lock
index 2227658f6b..3a254370a1 100644
--- a/frontend/yarn.lock
+++ b/frontend/yarn.lock
@@ -8128,6 +8128,13 @@ jest-snapshot@^27.5.1:
     pretty-format "^27.5.1"
     semver "^7.3.2"
 
+jest-styled-components@^7.0.8:
+  version "7.0.8"
+  resolved "https://registry.yarnpkg.com/jest-styled-components/-/jest-styled-components-7.0.8.tgz#9ea3b43f002de060b4638fde3b422d14b3e3ec9f"
+  integrity sha512-0KE54d0yIzKcvtOv8eikyjG3rFRtKYUyQovaoha3nondtZzXYGB3bhsvYgEegU08Iry0ndWx2+g9f5ZzD4I+0Q==
+  dependencies:
+    css "^3.0.0"
+
 jest-util@^26.6.2:
   version "26.6.2"
   resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-26.6.2.tgz#907535dbe4d5a6cb4c47ac9b926f6af29576cbc1"

From afbcde5edc9f8cac44122593ae1963c3f1c5c3e2 Mon Sep 17 00:00:00 2001
From: Ankit Nayan <ankit@signoz.io>
Date: Thu, 23 Jun 2022 15:29:15 +0530
Subject: [PATCH 25/42] fix: added 404 for error in getRule api (#1309)

* fix: added multiple error checks in getRule api
---
 .../app/clickhouseReader/reader.go            | 36 +++++++++++++++----
 1 file changed, 30 insertions(+), 6 deletions(-)

diff --git a/pkg/query-service/app/clickhouseReader/reader.go b/pkg/query-service/app/clickhouseReader/reader.go
index 1258060c41..f405c69f6d 100644
--- a/pkg/query-service/app/clickhouseReader/reader.go
+++ b/pkg/query-service/app/clickhouseReader/reader.go
@@ -592,21 +592,45 @@ func (r *ClickHouseReader) GetRulesFromDB() (*[]model.RuleResponseItem, *model.A
 
 func (r *ClickHouseReader) GetRule(id string) (*model.RuleResponseItem, *model.ApiError) {
 
-	idInt, _ := strconv.Atoi(id)
+	idInt, err := strconv.Atoi(id)
+	if err != nil {
+		zap.S().Debug("Error in parsing param: ", err)
+		return nil, &model.ApiError{Typ: model.ErrorBadData, Err: err}
+	}
 
 	rule := &model.RuleResponseItem{}
 
-	query := fmt.Sprintf("SELECT id, updated_at, data FROM rules WHERE id=%d", idInt)
-
-	err := r.localDB.Get(rule, query)
-
-	zap.S().Info(query)
+	query := "SELECT id, updated_at, data FROM rules WHERE id=?"
+	rows, err := r.localDB.Query(query, idInt)
 
 	if err != nil {
 		zap.S().Debug("Error in processing sql query: ", err)
 		return nil, &model.ApiError{Typ: model.ErrorInternal, Err: err}
 	}
 
+	count := 0
+	// iterate over each row
+	for rows.Next() {
+		err = rows.Scan(&rule.Id, &rule.UpdatedAt, &rule.Data)
+		if err != nil {
+			zap.S().Debug(err)
+			return nil, &model.ApiError{Typ: model.ErrorInternal, Err: err}
+		}
+		count += 1
+
+	}
+
+	if count == 0 {
+		err = fmt.Errorf("no rule with id %d found", idInt)
+		zap.S().Debug(err)
+		return nil, &model.ApiError{Typ: model.ErrorNotFound, Err: err}
+	}
+	if count > 1 {
+		err = fmt.Errorf("multiple rules with id %d found", idInt)
+		zap.S().Debug(err)
+		return nil, &model.ApiError{Typ: model.ErrorConflict, Err: err}
+	}
+
 	return rule, nil
 }
 

From 64927acd976259c85dad26b6b5ea935b24f81501 Mon Sep 17 00:00:00 2001
From: Ankit Nayan <ankit@signoz.io>
Date: Thu, 23 Jun 2022 15:33:31 +0530
Subject: [PATCH 26/42] updated codeowners for query-service

---
 .github/CODEOWNERS | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS
index b717ca9eee..2781d2a0c6 100644
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -4,3 +4,4 @@
 * @ankitnayan
 /frontend/ @palashgdev @pranshuchittora
 /deploy/ @prashant-shahi
+/pkg/query-service/ @srikanthccv @makeavish @nityanandagohain

From e4f2219f8c8f12030fd9544f2cf02aaf39baf5bb Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 16:29:38 +0530
Subject: [PATCH 27/42] feat: dashboard breadcrumb is added

---
 frontend/src/container/TopNav/Breadcrumbs/index.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/src/container/TopNav/Breadcrumbs/index.tsx b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
index 33d42ac5b0..c8d8bc9628 100644
--- a/frontend/src/container/TopNav/Breadcrumbs/index.tsx
+++ b/frontend/src/container/TopNav/Breadcrumbs/index.tsx
@@ -17,6 +17,7 @@ const breadcrumbNameMap = {
 	[ROUTES.MY_SETTINGS]: 'My Settings',
 	[ROUTES.ERROR_DETAIL]: 'Errors',
 	[ROUTES.LIST_ALL_ALERT]: 'Alerts',
+	[ROUTES.ALL_DASHBOARD]: 'Dashboard',
 };
 
 function ShowBreadcrumbs(props: RouteComponentProps): JSX.Element {

From 186f4dca71c9c40d0f211267e5cbc8ccac59c804 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 18:07:03 +0530
Subject: [PATCH 28/42] feat: light mode tooltip is updated

---
 .../Trace/Filters/Panel/PanelBody/Common/Checkbox.tsx      | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/Common/Checkbox.tsx b/frontend/src/container/Trace/Filters/Panel/PanelBody/Common/Checkbox.tsx
index a198dd960b..a30118fe36 100644
--- a/frontend/src/container/Trace/Filters/Panel/PanelBody/Common/Checkbox.tsx
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/Common/Checkbox.tsx
@@ -155,10 +155,9 @@ function CheckBoxComponent(props: CheckBoxProps): JSX.Element {
 
 	const isCheckBoxSelected = isUserSelected;
 
-	const TooTipOverLay = useMemo(
-		(): JSX.Element => <Typography>{keyValue}</Typography>,
-		[keyValue],
-	);
+	const TooTipOverLay = useMemo((): JSX.Element => <div>{keyValue}</div>, [
+		keyValue,
+	]);
 
 	return (
 		<CheckBoxContainer>

From 1ebf3dbf657f00e3dee4ef221e1087ef8b9a2233 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 19:11:19 +0530
Subject: [PATCH 29/42] feat: select tags key and value are updated to
 autocomplete filtering (#1267)

* feat: select tags key and value are updated to autocomplete filtering
Co-authored-by: Palash gupta <palash@signoz.io>
---
 .../Trace/Search/AllTags/Tag/TagKey.tsx       | 23 ++++++++++----
 .../Trace/Search/AllTags/Tag/TagValue.tsx     | 31 ++++++++++++++-----
 .../Trace/Search/AllTags/Tag/styles.ts        | 21 ++++++++++---
 3 files changed, 57 insertions(+), 18 deletions(-)

diff --git a/frontend/src/container/Trace/Search/AllTags/Tag/TagKey.tsx b/frontend/src/container/Trace/Search/AllTags/Tag/TagKey.tsx
index b57b4fc361..bb9794d8e7 100644
--- a/frontend/src/container/Trace/Search/AllTags/Tag/TagKey.tsx
+++ b/frontend/src/container/Trace/Search/AllTags/Tag/TagKey.tsx
@@ -73,11 +73,24 @@ function TagsKey(props: TagsKeysProps): JSX.Element {
 		<AutoComplete
 			dropdownClassName="certain-category-search-dropdown"
 			dropdownMatchSelectWidth={500}
-			style={{ width: 300 }}
-			options={options}
+			style={{ width: '100%' }}
 			value={selectedKey}
-			onChange={(value): void => {
-				if (options && options.find((option) => option.value === value)) {
+			allowClear
+			showSearch
+			options={options?.map((e) => ({
+				label: e.label?.toString(),
+				value: e.value,
+			}))}
+			filterOption={(inputValue, option): boolean =>
+				option?.label?.toUpperCase().indexOf(inputValue.toUpperCase()) !== -1
+			}
+			onChange={(e): void => setSelectedKey(e)}
+			onSelect={(value: unknown): void => {
+				if (
+					typeof value === 'string' &&
+					options &&
+					options.find((option) => option.value === value)
+				) {
 					setSelectedKey(value);
 
 					setLocalSelectedTags((tags) => [
@@ -89,8 +102,6 @@ function TagsKey(props: TagsKeysProps): JSX.Element {
 						},
 						...tags.slice(index + 1, tags.length),
 					]);
-				} else {
-					setSelectedKey('');
 				}
 			}}
 		>
diff --git a/frontend/src/container/Trace/Search/AllTags/Tag/TagValue.tsx b/frontend/src/container/Trace/Search/AllTags/Tag/TagValue.tsx
index 756bb54225..60b2d4118b 100644
--- a/frontend/src/container/Trace/Search/AllTags/Tag/TagValue.tsx
+++ b/frontend/src/container/Trace/Search/AllTags/Tag/TagValue.tsx
@@ -1,13 +1,13 @@
 import { Select } from 'antd';
 import getTagValue from 'api/trace/getTagValue';
-import React from 'react';
+import React, { useState } from 'react';
 import { useQuery } from 'react-query';
 import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
 import { GlobalReducer } from 'types/reducer/globalTime';
 import { TraceReducer } from 'types/reducer/trace';
 
-import { SelectComponent } from './styles';
+import { AutoCompleteComponent } from './styles';
 
 function TagValue(props: TagValueProps): JSX.Element {
 	const { tag, setLocalSelectedTags, index, tagKey } = props;
@@ -16,6 +16,7 @@ function TagValue(props: TagValueProps): JSX.Element {
 		Operator: selectedOperator,
 		Values: selectedValues,
 	} = tag;
+	const [localValue, setLocalValue] = useState<string>(selectedValues[0]);
 
 	const globalReducer = useSelector<AppState, GlobalReducer>(
 		(state) => state.globalTime,
@@ -34,22 +35,38 @@ function TagValue(props: TagValueProps): JSX.Element {
 	);
 
 	return (
-		<SelectComponent
-			value={selectedValues[0]}
+		<AutoCompleteComponent
+			options={data?.payload?.map((e) => ({
+				label: e.tagValues,
+				value: e.tagValues,
+			}))}
+			allowClear
+			defaultOpen
+			showSearch
+			filterOption={(inputValue, option): boolean =>
+				option?.label.toUpperCase().indexOf(inputValue.toUpperCase()) !== -1
+			}
+			disabled={isLoading}
+			value={localValue}
+			onChange={(values): void => {
+				if (typeof values === 'string') {
+					setLocalValue(values);
+				}
+			}}
 			onSelect={(value: unknown): void => {
 				if (typeof value === 'string') {
+					setLocalValue(value);
 					setLocalSelectedTags((tags) => [
 						...tags.slice(0, index),
 						{
 							Key: selectedKey,
 							Operator: selectedOperator,
-							Values: [...selectedValues, value],
+							Values: [value],
 						},
 						...tags.slice(index + 1, tags.length),
 					]);
 				}
 			}}
-			loading={isLoading || false}
 		>
 			{data &&
 				data.payload &&
@@ -58,7 +75,7 @@ function TagValue(props: TagValueProps): JSX.Element {
 						{suggestion.tagValues}
 					</Select.Option>
 				))}
-		</SelectComponent>
+		</AutoCompleteComponent>
 	);
 }
 
diff --git a/frontend/src/container/Trace/Search/AllTags/Tag/styles.ts b/frontend/src/container/Trace/Search/AllTags/Tag/styles.ts
index 347bc287f2..e604a444d7 100644
--- a/frontend/src/container/Trace/Search/AllTags/Tag/styles.ts
+++ b/frontend/src/container/Trace/Search/AllTags/Tag/styles.ts
@@ -1,4 +1,4 @@
-import { Select, Space } from 'antd';
+import { AutoComplete, Select, Space } from 'antd';
 import styled from 'styled-components';
 
 export const SpaceComponent = styled(Space)`
@@ -9,18 +9,23 @@ export const SpaceComponent = styled(Space)`
 
 export const SelectComponent = styled(Select)`
 	&&& {
-		min-width: 170px;
-		margin-right: 21.91px;
-		margin-left: 21.92px;
+		width: 100%;
 	}
 `;
 
-export const Container = styled.div`
+export const Container = styled(Space)`
 	&&& {
 		display: flex;
 		margin-top: 1rem;
 		margin-bottom: 1rem;
 	}
+
+	.ant-space-item:not(:last-child, :nth-child(2)) {
+		width: 100%;
+	}
+	.ant-space-item:nth-child(2) {
+		width: 50%;
+	}
 `;
 
 export const IconContainer = styled.div`
@@ -31,3 +36,9 @@ export const IconContainer = styled.div`
 
 	margin-left: 1.125rem;
 `;
+
+export const AutoCompleteComponent = styled(AutoComplete)`
+	&&& {
+		width: 100%;
+	}
+`;

From bef83d30cce8e3d86dc39c8e312c4759b44ef5f5 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Thu, 23 Jun 2022 19:12:43 +0530
Subject: [PATCH 30/42] feat: duration filter is updated (#1272)

* feat: duration filter is updated

* feat: search filter is added in the trace filter

Co-authored-by: Palash gupta <palash@signoz.io>
---
 .../Panel/PanelBody/CommonCheckBox/index.tsx  | 51 ++++++++++-
 .../Panel/PanelBody/Duration/index.tsx        | 89 +++++++++----------
 .../Panel/PanelBody/Duration/styles.ts        | 15 +++-
 .../Filters/Panel/PanelBody/Duration/util.ts  | 13 +++
 frontend/src/store/reducers/trace.ts          | 21 +++++
 frontend/src/types/actions/trace.ts           | 10 ++-
 frontend/src/types/reducer/trace.ts           |  1 +
 7 files changed, 149 insertions(+), 51 deletions(-)
 create mode 100644 frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/util.ts

diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
index 0681e7e5d5..72d7439ade 100644
--- a/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/CommonCheckBox/index.tsx
@@ -1,12 +1,19 @@
-import React from 'react';
-import { useSelector } from 'react-redux';
+import { Button, Input } from 'antd';
+import React, { useState } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { Dispatch } from 'redux';
 import { AppState } from 'store/reducers';
+import { INITIAL_FILTER_VALUE } from 'store/reducers/trace';
+import AppActions from 'types/actions';
+import { UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE } from 'types/actions/trace';
 import { TraceFilterEnum, TraceReducer } from 'types/reducer/trace';
 
 import CheckBoxComponent from '../Common/Checkbox';
 
+const { Search } = Input;
+
 function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
-	const { filter } = useSelector<AppState, TraceReducer>(
+	const { filter, filterDisplayValue } = useSelector<AppState, TraceReducer>(
 		(state) => state.traces,
 	);
 
@@ -15,9 +22,34 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 	const status = filter.get(name) || {};
 
 	const statusObj = Object.keys(status);
+	const numberOfFilters = filterDisplayValue.get(name) || 0;
+	const dispatch = useDispatch<Dispatch<AppActions>>();
+	const [searchFilter, setSearchFilter] = useState<string>('');
+
+	const onClickMoreHandler = (): void => {
+		const newFilterDisplayValue = new Map(filterDisplayValue);
+		const preValue =
+			(newFilterDisplayValue.get(name) || 0) + INITIAL_FILTER_VALUE;
+
+		newFilterDisplayValue.set(name, preValue);
+
+		dispatch({
+			type: UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE,
+			payload: newFilterDisplayValue,
+		});
+	};
 
 	return (
 		<>
+			<Search
+				value={searchFilter}
+				onChange={(e): void => setSearchFilter(e.target.value)}
+				style={{
+					padding: '0 3%',
+				}}
+				placeholder="Filter Values"
+			/>
+
 			{statusObj
 				.sort((a, b) => {
 					const countA = +status[a];
@@ -28,6 +60,13 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 					}
 					return countA - countB;
 				})
+				.filter((_, index) => index < numberOfFilters)
+				.filter((filter) => {
+					if (searchFilter.length === 0) {
+						return true;
+					}
+					return filter.includes(searchFilter);
+				})
 				.map((e) => (
 					<CheckBoxComponent
 						key={e}
@@ -38,6 +77,12 @@ function CommonCheckBox(props: CommonCheckBoxProps): JSX.Element {
 						}}
 					/>
 				))}
+
+			{numberOfFilters && statusObj.length > numberOfFilters && (
+				<Button onClick={onClickMoreHandler} type="link">
+					More
+				</Button>
+			)}
 		</>
 	);
 }
diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/index.tsx b/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/index.tsx
index a2a5d163a1..81bd6e7faa 100644
--- a/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/index.tsx
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/index.tsx
@@ -1,11 +1,14 @@
-/* eslint-disable react/no-unstable-nested-components */
-import { Input, Slider } from 'antd';
+import { Slider } from 'antd';
 import { SliderRangeProps } from 'antd/lib/slider';
 import getFilters from 'api/trace/getFilters';
-import dayjs from 'dayjs';
-import durationPlugin from 'dayjs/plugin/duration';
 import useDebouncedFn from 'hooks/useDebouncedFunction';
-import React, { useEffect, useMemo, useRef, useState } from 'react';
+import React, {
+	useCallback,
+	useEffect,
+	useMemo,
+	useRef,
+	useState,
+} from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { Dispatch } from 'redux';
 import { getFilter, updateURL } from 'store/actions/trace/util';
@@ -15,19 +18,8 @@ import { UPDATE_ALL_FILTERS } from 'types/actions/trace';
 import { GlobalReducer } from 'types/reducer/globalTime';
 import { TraceReducer } from 'types/reducer/trace';
 
-import { Container, InputContainer, Text } from './styles';
-
-dayjs.extend(durationPlugin);
-
-const getMs = (value: string): string => {
-	return parseFloat(
-		dayjs
-			.duration({
-				milliseconds: parseInt(value, 10) / 1000000,
-			})
-			.format('SSS'),
-	).toFixed(2);
-};
+import { Container, InputComponent, InputContainer, Text } from './styles';
+import { getMs } from './util';
 
 function Duration(): JSX.Element {
 	const {
@@ -77,17 +69,18 @@ function Duration(): JSX.Element {
 			preLocalMinDuration.current = parseFloat(minDuration);
 		}
 
-		setPreMax(maxDuration);
-		setPreMin(minDuration);
+		setPreMax(getMs(maxDuration));
+		setPreMin(getMs(minDuration));
 	}, [getDuration]);
 
-	const defaultValue = [parseFloat(preMin), parseFloat(preMax)];
-
 	const updatedUrl = async (min: number, max: number): Promise<void> => {
 		const preSelectedFilter = new Map(selectedFilter);
 		const preUserSelected = new Map(userSelectedFilter);
 
-		preSelectedFilter.set('duration', [String(max), String(min)]);
+		preSelectedFilter.set('duration', [
+			String(max * 1000000),
+			String(min * 1000000),
+		]);
 
 		const response = await getFilters({
 			end: String(globalTime.maxTime),
@@ -137,18 +130,18 @@ function Duration(): JSX.Element {
 		}
 	};
 
-	const onRangeSliderHandler = (number: [number, number]): void => {
+	const onRangeSliderHandler = (number: [string, string]): void => {
 		const [min, max] = number;
 
-		setPreMin(min.toString());
-		setPreMax(max.toString());
+		setPreMin(min);
+		setPreMax(max);
 	};
 
 	const debouncedFunction = useDebouncedFn(
 		(min, max) => {
 			updatedUrl(min as number, max as number);
 		},
-		500,
+		1500,
 		undefined,
 	);
 
@@ -156,8 +149,8 @@ function Duration(): JSX.Element {
 		event,
 	) => {
 		const { value } = event.target;
-		const min = parseFloat(preMin);
-		const max = parseFloat(value) * 1000000;
+		const min = preMin;
+		const max = value;
 
 		onRangeSliderHandler([min, max]);
 		debouncedFunction(min, max);
@@ -167,8 +160,9 @@ function Duration(): JSX.Element {
 		event,
 	) => {
 		const { value } = event.target;
-		const min = parseFloat(value) * 1000000;
-		const max = parseFloat(preMax);
+		const min = value;
+		const max = preMax;
+
 		onRangeSliderHandler([min, max]);
 		debouncedFunction(min, max);
 	};
@@ -177,45 +171,48 @@ function Duration(): JSX.Element {
 		updatedUrl(min, max);
 	};
 
+	const TipComponent = useCallback((value) => {
+		if (value === undefined) {
+			return <div />;
+		}
+		return <div>{`${getMs(value?.toString())}ms`}</div>;
+	}, []);
+
 	return (
 		<div>
 			<Container>
 				<InputContainer>
 					<Text>Min</Text>
 				</InputContainer>
-				<Input
+				<InputComponent
 					addonAfter="ms"
+					type="number"
 					onChange={onChangeMinHandler}
-					value={getMs(preMin)}
+					value={preMin}
 				/>
 
 				<InputContainer>
 					<Text>Max</Text>
 				</InputContainer>
-				<Input
+				<InputComponent
 					addonAfter="ms"
+					type="number"
 					onChange={onChangeMaxHandler}
-					value={getMs(preMax)}
+					value={preMax}
 				/>
 			</Container>
 
 			<Container>
 				<Slider
-					defaultValue={[defaultValue[0], defaultValue[1]]}
-					min={parseFloat((preLocalMinDuration.current || 0).toString())}
-					max={parseFloat((preLocalMaxDuration.current || 0).toString())}
+					min={Number(getMs(String(preLocalMinDuration.current || 0)))}
+					max={Number(getMs(String(preLocalMaxDuration.current || 0)))}
 					range
-					tipFormatter={(value): JSX.Element => {
-						if (value === undefined) {
-							return <div />;
-						}
-						return <div>{`${getMs(value?.toString())}ms`}</div>;
-					}}
+					tipFormatter={TipComponent}
 					onChange={([min, max]): void => {
-						onRangeSliderHandler([min, max]);
+						onRangeSliderHandler([String(min), String(max)]);
 					}}
 					onAfterChange={onRangeHandler}
-					value={[parseFloat(preMin), parseFloat(preMax)]}
+					value={[Number(preMin), Number(preMax)]}
 				/>
 			</Container>
 		</div>
diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/styles.ts b/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/styles.ts
index d80c0e503d..1cab3f8954 100644
--- a/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/styles.ts
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/styles.ts
@@ -1,4 +1,4 @@
-import { Typography } from 'antd';
+import { Input, Typography } from 'antd';
 import styled from 'styled-components';
 
 export const DurationText = styled.div`
@@ -9,6 +9,19 @@ export const DurationText = styled.div`
 	flex-direction: column;
 `;
 
+export const InputComponent = styled(Input)`
+	input::-webkit-outer-spin-button,
+	input::-webkit-inner-spin-button {
+		-webkit-appearance: none;
+		margin: 0;
+	}
+
+	/* Firefox */
+	input[type='number'] {
+		-moz-appearance: textfield;
+	}
+`;
+
 export const InputContainer = styled.div`
 	width: 100%;
 	margin-top: 0.5rem;
diff --git a/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/util.ts b/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/util.ts
new file mode 100644
index 0000000000..2a6bcf9586
--- /dev/null
+++ b/frontend/src/container/Trace/Filters/Panel/PanelBody/Duration/util.ts
@@ -0,0 +1,13 @@
+import dayjs from 'dayjs';
+import durationPlugin from 'dayjs/plugin/duration';
+
+dayjs.extend(durationPlugin);
+
+export const getMs = (value: string): string =>
+	parseFloat(
+		dayjs
+			.duration({
+				milliseconds: parseInt(value, 10) / 1000000,
+			})
+			.format('SSS'),
+	).toFixed(2);
diff --git a/frontend/src/store/reducers/trace.ts b/frontend/src/store/reducers/trace.ts
index b99ee7dd3a..4023d375ca 100644
--- a/frontend/src/store/reducers/trace.ts
+++ b/frontend/src/store/reducers/trace.ts
@@ -11,6 +11,7 @@ import {
 	UPDATE_SELECTED_TAGS,
 	UPDATE_SPAN_ORDER,
 	UPDATE_SPAN_ORDER_PARAMS,
+	UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE,
 	UPDATE_SPANS_AGGREGATE,
 	UPDATE_SPANS_AGGREGATE_PAGE_NUMBER,
 	UPDATE_SPANS_AGGREGATE_PAGE_SIZE,
@@ -23,6 +24,8 @@ import {
 } from 'types/actions/trace';
 import { TraceFilterEnum, TraceReducer } from 'types/reducer/trace';
 
+export const INITIAL_FILTER_VALUE = 4;
+
 const initialValue: TraceReducer = {
 	filter: new Map(),
 	filterToFetchData: ['duration', 'status', 'serviceName'],
@@ -53,6 +56,17 @@ const initialValue: TraceReducer = {
 		loading: true,
 		payload: { items: {} },
 	},
+	filterDisplayValue: new Map<TraceFilterEnum, number>([
+		['component', INITIAL_FILTER_VALUE],
+		['duration', INITIAL_FILTER_VALUE],
+		['httpCode', INITIAL_FILTER_VALUE],
+		['httpHost', INITIAL_FILTER_VALUE],
+		['httpMethod', INITIAL_FILTER_VALUE],
+		['httpUrl', INITIAL_FILTER_VALUE],
+		['operation', INITIAL_FILTER_VALUE],
+		['serviceName', INITIAL_FILTER_VALUE],
+		['status', INITIAL_FILTER_VALUE],
+	]),
 };
 
 const traceReducer = (
@@ -251,6 +265,13 @@ const traceReducer = (
 			};
 		}
 
+		case UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE: {
+			return {
+				...state,
+				filterDisplayValue: action.payload,
+			};
+		}
+
 		default:
 			return state;
 	}
diff --git a/frontend/src/types/actions/trace.ts b/frontend/src/types/actions/trace.ts
index da97d05129..f043926142 100644
--- a/frontend/src/types/actions/trace.ts
+++ b/frontend/src/types/actions/trace.ts
@@ -31,6 +31,8 @@ export const UPDATE_SPANS_AGGREGATE_PAGE_NUMBER =
 export const UPDATE_SPANS_AGGREGATE_PAGE_SIZE =
 	'UPDATE_SPANS_AGGREGATE_PAGE_SIZE';
 export const UPDATE_SPAN_ORDER_PARAMS = 'UPDATE_SPAN_ORDER_PARAMS';
+export const UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE =
+	'UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE';
 
 export interface UpdateFilter {
 	type: typeof UPDATE_TRACE_FILTER;
@@ -187,6 +189,11 @@ export interface UpdateSpanParams {
 	};
 }
 
+export interface UpdateTraceFilterDisplayValue {
+	type: typeof UPDATE_SPAN_UPDATE_FILTER_DISPLAY_VALUE;
+	payload: TraceReducer['filterDisplayValue'];
+}
+
 export type TraceActions =
 	| UpdateFilter
 	| GetTraceFilter
@@ -208,4 +215,5 @@ export type TraceActions =
 	| UpdateSpanOrder
 	| UpdateSpansAggregatePageNumber
 	| UpdateSpanSize
-	| UpdateSpanParams;
+	| UpdateSpanParams
+	| UpdateTraceFilterDisplayValue;
diff --git a/frontend/src/types/reducer/trace.ts b/frontend/src/types/reducer/trace.ts
index babeb344c6..fc1c08f4fc 100644
--- a/frontend/src/types/reducer/trace.ts
+++ b/frontend/src/types/reducer/trace.ts
@@ -32,6 +32,7 @@ export interface TraceReducer {
 		payload: PayloadProps;
 	};
 	yAxisUnit: string | undefined;
+	filterDisplayValue: Map<TraceFilterEnum, number>;
 }
 
 interface SpansAggregateData {

From a733adad2c0ec9cc9b1c2f3b62e91a11b42c30e8 Mon Sep 17 00:00:00 2001
From: Srikanth Chekuri <srikanth.chekuri92@gmail.com>
Date: Fri, 24 Jun 2022 14:52:11 +0530
Subject: [PATCH 31/42] Add v2 query range metrics API (#1020)

* Queryrange params tests

* review suggestions, quantile, simple metric filter and some refactoring

* Add value type support

* Add supprot for re2 regex, refactor, update tests and other changes

* chore: update govaluate dep to signoz/govaluate

* chore: add name to grouping

* chore: add support for NOOP

* fix: make result format compatible with prom HTTP API

* chore: update clickhouse server and update query builder to use new schema

* chore: use metric_name in auto suggest APIs

* chore: add reduce operator and new aggregate functions

* chore: add support for not like op

* chore: fix the dip at the end for incomplete time range

* chore: rounddown the end to exclude the incomplete collection
---
 .../app/clickhouseReader/reader.go            | 116 ++++-
 pkg/query-service/app/http_handler.go         | 178 +++++++-
 pkg/query-service/app/interface.go            |   3 +-
 .../app/metrics/query_builder.go              | 421 ++++++++++++++++++
 .../app/metrics/query_builder_test.go         | 130 ++++++
 pkg/query-service/app/parser.go               |   9 +
 pkg/query-service/app/parser/metrics.go       |  26 +-
 pkg/query-service/app/parser_test.go          |  60 +++
 pkg/query-service/constants/constants.go      |   5 +
 pkg/query-service/go.mod                      |   5 +-
 pkg/query-service/go.sum                      |   6 +-
 pkg/query-service/model/queryParams.go        | 137 +++++-
 pkg/query-service/model/response.go           |  17 +
 13 files changed, 1062 insertions(+), 51 deletions(-)
 create mode 100644 pkg/query-service/app/metrics/query_builder.go
 create mode 100644 pkg/query-service/app/metrics/query_builder_test.go
 create mode 100644 pkg/query-service/app/parser_test.go

diff --git a/pkg/query-service/app/clickhouseReader/reader.go b/pkg/query-service/app/clickhouseReader/reader.go
index f405c69f6d..17f3e5b047 100644
--- a/pkg/query-service/app/clickhouseReader/reader.go
+++ b/pkg/query-service/app/clickhouseReader/reader.go
@@ -14,6 +14,7 @@ import (
 	"net/http"
 	"net/url"
 	"os"
+	"reflect"
 	"regexp"
 	"sort"
 	"strconv"
@@ -61,10 +62,8 @@ const (
 	signozErrorIndexTable = "signoz_error_index"
 	signozTraceTableName  = "signoz_index_v2"
 	signozMetricDBName    = "signoz_metrics"
-	signozSampleName      = "samples"
-	signozTSName          = "time_series"
-	signozSampleTableName = "samples"
-	signozTSTableName     = "time_series"
+	signozSampleTableName = "samples_v2"
+	signozTSTableName     = "time_series_v2"
 
 	minTimespanForProgressiveSearch       = time.Hour
 	minTimespanForProgressiveSearchMargin = time.Minute
@@ -2368,7 +2367,7 @@ func (r *ClickHouseReader) SetTTL(ctx context.Context,
 		}
 
 	case constants.MetricsTTL:
-		tableName = signozMetricDBName + "." + signozSampleName
+		tableName = signozMetricDBName + "." + signozSampleTableName
 		statusItem, err := r.checkTTLStatusItem(ctx, tableName)
 		if err != nil {
 			return nil, &model.ApiError{Typ: model.ErrorExec, Err: fmt.Errorf("Error in processing ttl_status check sql query")}
@@ -2607,7 +2606,7 @@ func (r *ClickHouseReader) GetTTL(ctx context.Context, ttlParams *model.GetTTLPa
 		return &model.GetTTLResponseItem{TracesTime: delTTL, TracesMoveTime: moveTTL, ExpectedTracesTime: ttlQuery.TTL, ExpectedTracesMoveTime: ttlQuery.ColdStorageTtl, Status: status}, nil
 
 	case constants.MetricsTTL:
-		tableNameArray := []string{signozMetricDBName + "." + signozSampleName}
+		tableNameArray := []string{signozMetricDBName + "." + signozSampleTableName}
 		status, err := r.setTTLQueryStatus(ctx, tableNameArray)
 		if err != nil {
 			return nil, err
@@ -2726,16 +2725,16 @@ func (r *ClickHouseReader) GetMetricAutocompleteTagKey(ctx context.Context, para
 	tagsWhereClause := ""
 
 	for key, val := range params.MetricTags {
-		tagsWhereClause += fmt.Sprintf("AND JSONExtractString(labels,'%s') = '%s'", key, val)
+		tagsWhereClause += fmt.Sprintf(" AND labels_object.%s = '%s' ", key, val)
 	}
 	// "select distinctTagKeys from (SELECT DISTINCT arrayJoin(tagKeys) distinctTagKeys from (SELECT DISTINCT(JSONExtractKeys(labels)) tagKeys from signoz_metrics.time_series WHERE JSONExtractString(labels,'__name__')='node_udp_queues'))  WHERE distinctTagKeys ILIKE '%host%';"
 	if len(params.Match) != 0 {
-		query = fmt.Sprintf("select distinctTagKeys from (SELECT DISTINCT arrayJoin(tagKeys) distinctTagKeys from (SELECT DISTINCT(JSONExtractKeys(labels)) tagKeys from %s.%s WHERE JSONExtractString(labels,'__name__')=$1 %s)) WHERE distinctTagKeys ILIKE $2;", signozMetricDBName, signozTSTableName, tagsWhereClause)
+		query = fmt.Sprintf("select distinctTagKeys from (SELECT DISTINCT arrayJoin(tagKeys) distinctTagKeys from (SELECT DISTINCT(JSONExtractKeys(labels)) tagKeys from %s.%s WHERE metric_name=$1 %s)) WHERE distinctTagKeys ILIKE $2;", signozMetricDBName, signozTSTableName, tagsWhereClause)
 
 		rows, err = r.db.Query(ctx, query, params.MetricName, fmt.Sprintf("%%%s%%", params.Match))
 
 	} else {
-		query = fmt.Sprintf("select distinctTagKeys from (SELECT DISTINCT arrayJoin(tagKeys) distinctTagKeys from (SELECT DISTINCT(JSONExtractKeys(labels)) tagKeys from %s.%s WHERE JSONExtractString(labels,'__name__')=$1 %s ));", signozMetricDBName, signozTSTableName, tagsWhereClause)
+		query = fmt.Sprintf("select distinctTagKeys from (SELECT DISTINCT arrayJoin(tagKeys) distinctTagKeys from (SELECT DISTINCT(JSONExtractKeys(labels)) tagKeys from %s.%s WHERE metric_name=$1 %s ));", signozMetricDBName, signozTSTableName, tagsWhereClause)
 
 		rows, err = r.db.Query(ctx, query, params.MetricName)
 	}
@@ -2765,16 +2764,16 @@ func (r *ClickHouseReader) GetMetricAutocompleteTagValue(ctx context.Context, pa
 	tagsWhereClause := ""
 
 	for key, val := range params.MetricTags {
-		tagsWhereClause += fmt.Sprintf("AND JSONExtractString(labels,'%s') = '%s'", key, val)
+		tagsWhereClause += fmt.Sprintf(" AND labels_object.%s = '%s' ", key, val)
 	}
 
 	if len(params.Match) != 0 {
-		query = fmt.Sprintf("SELECT DISTINCT(JSONExtractString(labels, $1)) from %s.%s WHERE JSONExtractString(labels,'__name__')=$2 %s AND JSONExtractString(labels, $1) ILIKE $3;", signozMetricDBName, signozTSTableName, tagsWhereClause)
+		query = fmt.Sprintf("SELECT DISTINCT(labels_object.%s) from %s.%s WHERE metric_name=$1 %s AND labels_object.%s ILIKE $2;", params.TagKey, signozMetricDBName, signozTSTableName, tagsWhereClause, params.TagKey)
 
 		rows, err = r.db.Query(ctx, query, params.TagKey, params.MetricName, fmt.Sprintf("%%%s%%", params.Match))
 
 	} else {
-		query = fmt.Sprintf("SELECT DISTINCT(JSONExtractString(labels, $1)) FROM %s.%s WHERE JSONExtractString(labels,'__name__')=$2 %s;", signozMetricDBName, signozTSTableName, tagsWhereClause)
+		query = fmt.Sprintf("SELECT DISTINCT(labels_object.%s) FROM %s.%s WHERE metric_name=$2 %s;", params.TagKey, signozMetricDBName, signozTSTableName, tagsWhereClause)
 		rows, err = r.db.Query(ctx, query, params.TagKey, params.MetricName)
 
 	}
@@ -2796,20 +2795,18 @@ func (r *ClickHouseReader) GetMetricAutocompleteTagValue(ctx context.Context, pa
 	return &tagValueList, nil
 }
 
-func (r *ClickHouseReader) GetMetricAutocompleteMetricNames(ctx context.Context, matchText string) (*[]string, *model.ApiError) {
+func (r *ClickHouseReader) GetMetricAutocompleteMetricNames(ctx context.Context, matchText string, limit int) (*[]string, *model.ApiError) {
 
 	var query string
 	var err error
 	var metricNameList []string
 	var rows driver.Rows
 
-	if len(matchText) != 0 {
-		query = fmt.Sprintf("SELECT DISTINCT(JSONExtractString(labels,'__name__')) from %s.%s WHERE JSONExtractString(labels,'__name__') ILIKE $1;", signozMetricDBName, signozTSTableName)
-		rows, err = r.db.Query(ctx, query, fmt.Sprintf("%%%s%%", matchText))
-	} else {
-		query = fmt.Sprintf("SELECT DISTINCT(JSONExtractString(labels,'__name__')) from %s.%s;", signozMetricDBName, signozTSTableName)
-		rows, err = r.db.Query(ctx, query)
+	query = fmt.Sprintf("SELECT DISTINCT(metric_name) from %s.%s WHERE metric_name ILIKE $1", signozMetricDBName, signozTSTableName)
+	if limit != 0 {
+		query = query + fmt.Sprintf(" LIMIT %d;", limit)
 	}
+	rows, err = r.db.Query(ctx, query, fmt.Sprintf("%%%s%%", matchText))
 
 	if err != nil {
 		zap.S().Error(err)
@@ -2828,3 +2825,84 @@ func (r *ClickHouseReader) GetMetricAutocompleteMetricNames(ctx context.Context,
 	return &metricNameList, nil
 
 }
+
+// GetMetricResult runs the query and returns list of time series
+func (r *ClickHouseReader) GetMetricResult(ctx context.Context, query string) ([]*model.Series, error) {
+
+	rows, err := r.db.Query(ctx, query)
+
+	if err != nil {
+		zap.S().Debug("Error in processing query: ", err)
+		return nil, fmt.Errorf("error in processing query")
+	}
+
+	var (
+		columnTypes = rows.ColumnTypes()
+		columnNames = rows.Columns()
+		vars        = make([]interface{}, len(columnTypes))
+	)
+	for i := range columnTypes {
+		vars[i] = reflect.New(columnTypes[i].ScanType()).Interface()
+	}
+	// when group by is applied, each combination of cartesian product
+	// of attributes is separate series. each item in metricPointsMap
+	// represent a unique series.
+	metricPointsMap := make(map[string][]model.MetricPoint)
+	// attribute key-value pairs for each group selection
+	attributesMap := make(map[string]map[string]string)
+
+	defer rows.Close()
+	for rows.Next() {
+		if err := rows.Scan(vars...); err != nil {
+			return nil, err
+		}
+		var groupBy []string
+		var metricPoint model.MetricPoint
+		groupAttributes := make(map[string]string)
+		// Assuming that the end result row contains a timestamp, value and option labels
+		// Label key and value are both strings.
+		for idx, v := range vars {
+			colName := columnNames[idx]
+			switch v := v.(type) {
+			case *string:
+				// special case for returning all labels
+				if colName == "fullLabels" {
+					var metric map[string]string
+					err := json.Unmarshal([]byte(*v), &metric)
+					if err != nil {
+						return nil, err
+					}
+					for key, val := range metric {
+						groupBy = append(groupBy, val)
+						groupAttributes[key] = val
+					}
+				} else {
+					groupBy = append(groupBy, *v)
+					groupAttributes[colName] = *v
+				}
+			case *time.Time:
+				metricPoint.Timestamp = v.UnixMilli()
+			case *float64:
+				metricPoint.Value = *v
+			}
+		}
+		sort.Strings(groupBy)
+		key := strings.Join(groupBy, "")
+		attributesMap[key] = groupAttributes
+		metricPointsMap[key] = append(metricPointsMap[key], metricPoint)
+	}
+
+	var seriesList []*model.Series
+	for key := range metricPointsMap {
+		points := metricPointsMap[key]
+		// first point in each series could be invalid since the
+		// aggregations are applied with point from prev series
+		if len(points) != 0 && len(points) > 1 {
+			points = points[1:]
+		}
+		attributes := attributesMap[key]
+		series := model.Series{Labels: attributes, Points: points}
+		seriesList = append(seriesList, &series)
+	}
+	return seriesList, nil
+}
diff --git a/pkg/query-service/app/http_handler.go b/pkg/query-service/app/http_handler.go
index ee4633ff1a..400c9f2de4 100644
--- a/pkg/query-service/app/http_handler.go
+++ b/pkg/query-service/app/http_handler.go
@@ -7,12 +7,16 @@ import (
 	"fmt"
 	"io/ioutil"
 	"net/http"
+	"strconv"
+	"sync"
+	"time"
 
 	"github.com/gorilla/mux"
 	jsoniter "github.com/json-iterator/go"
 	_ "github.com/mattn/go-sqlite3"
 	"github.com/prometheus/prometheus/promql"
 	"go.signoz.io/query-service/app/dashboards"
+	"go.signoz.io/query-service/app/metrics"
 	"go.signoz.io/query-service/app/parser"
 	"go.signoz.io/query-service/auth"
 	"go.signoz.io/query-service/constants"
@@ -384,7 +388,12 @@ func (aH *APIHandler) getRule(w http.ResponseWriter, r *http.Request) {
 
 func (aH *APIHandler) metricAutocompleteMetricName(w http.ResponseWriter, r *http.Request) {
 	matchText := r.URL.Query().Get("match")
-	metricNameList, apiErrObj := (*aH.reader).GetMetricAutocompleteMetricNames(r.Context(), matchText)
+	limit, err := strconv.Atoi(r.URL.Query().Get("limit"))
+	if err != nil {
+		limit = 0 // no limit
+	}
+
+	metricNameList, apiErrObj := (*aH.reader).GetMetricAutocompleteMetricNames(r.Context(), matchText, limit)
 
 	if apiErrObj != nil {
 		respondError(w, apiErrObj, nil)
@@ -436,18 +445,173 @@ func (aH *APIHandler) metricAutocompleteTagValue(w http.ResponseWriter, r *http.
 func (aH *APIHandler) queryRangeMetricsV2(w http.ResponseWriter, r *http.Request) {
 	metricsQueryRangeParams, apiErrorObj := parser.ParseMetricQueryRangeParams(r)
 
-	fmt.Println(metricsQueryRangeParams)
-
 	if apiErrorObj != nil {
 		zap.S().Errorf(apiErrorObj.Err.Error())
 		respondError(w, apiErrorObj, nil)
 		return
 	}
-	response_data := &model.QueryDataV2{
-		ResultType: "matrix",
-		Result:     nil,
+
+	// prometheus instant query needs same timestamp
+	if metricsQueryRangeParams.CompositeMetricQuery.PanelType == model.QUERY_VALUE &&
+		metricsQueryRangeParams.CompositeMetricQuery.QueryType == model.PROM {
+		metricsQueryRangeParams.Start = metricsQueryRangeParams.End
 	}
-	aH.respond(w, response_data)
+
+	// round up the end to neaerest multiple
+	if metricsQueryRangeParams.CompositeMetricQuery.QueryType == model.QUERY_BUILDER {
+		end := (metricsQueryRangeParams.End) / 1000
+		step := metricsQueryRangeParams.Step
+		metricsQueryRangeParams.End = (end / step * step) * 1000
+	}
+
+	type channelResult struct {
+		Series []*model.Series
+		Err    error
+	}
+
+	execClickHouseQueries := func(queries map[string]string) ([]*model.Series, error) {
+		var seriesList []*model.Series
+		ch := make(chan channelResult, len(queries))
+		var wg sync.WaitGroup
+
+		for name, query := range queries {
+			wg.Add(1)
+			go func(name, query string) {
+				defer wg.Done()
+				seriesList, err := (*aH.reader).GetMetricResult(r.Context(), query)
+				for _, series := range seriesList {
+					series.QueryName = name
+				}
+
+				if err != nil {
+					ch <- channelResult{Err: fmt.Errorf("error in query-%s: %v", name, err)}
+					return
+				}
+				ch <- channelResult{Series: seriesList}
+			}(name, query)
+		}
+
+		wg.Wait()
+		close(ch)
+
+		var errs []error
+		// read values from the channel
+		for r := range ch {
+			if r.Err != nil {
+				errs = append(errs, r.Err)
+				continue
+			}
+			seriesList = append(seriesList, r.Series...)
+		}
+		if len(errs) != 0 {
+			return nil, fmt.Errorf("encountered multiple errors: %s", metrics.FormatErrs(errs, "\n"))
+		}
+		return seriesList, nil
+	}
+
+	execPromQueries := func(metricsQueryRangeParams *model.QueryRangeParamsV2) ([]*model.Series, error) {
+		var seriesList []*model.Series
+		ch := make(chan channelResult, len(metricsQueryRangeParams.CompositeMetricQuery.PromQueries))
+		var wg sync.WaitGroup
+
+		for name, query := range metricsQueryRangeParams.CompositeMetricQuery.PromQueries {
+			if query.Disabled {
+				continue
+			}
+			wg.Add(1)
+			go func(name string, query *model.PromQuery) {
+				var seriesList []*model.Series
+				defer wg.Done()
+				queryModel := model.QueryRangeParams{
+					Start: time.UnixMilli(metricsQueryRangeParams.Start),
+					End:   time.UnixMilli(metricsQueryRangeParams.End),
+					Step:  time.Duration(metricsQueryRangeParams.Step * int64(time.Second)),
+					Query: query.Query,
+				}
+				promResult, _, err := (*aH.reader).GetQueryRangeResult(r.Context(), &queryModel)
+				if err != nil {
+					ch <- channelResult{Err: fmt.Errorf("error in query-%s: %v", name, err)}
+					return
+				}
+				matrix, _ := promResult.Matrix()
+				for _, v := range matrix {
+					var s model.Series
+					s.QueryName = name
+					s.Labels = v.Metric.Copy().Map()
+					for _, p := range v.Points {
+						s.Points = append(s.Points, model.MetricPoint{Timestamp: p.T, Value: p.V})
+					}
+					seriesList = append(seriesList, &s)
+				}
+				ch <- channelResult{Series: seriesList}
+			}(name, query)
+		}
+
+		wg.Wait()
+		close(ch)
+
+		var errs []error
+		// read values from the channel
+		for r := range ch {
+			if r.Err != nil {
+				errs = append(errs, r.Err)
+				continue
+			}
+			seriesList = append(seriesList, r.Series...)
+		}
+		if len(errs) != 0 {
+			return nil, fmt.Errorf("encountered multiple errors: %s", metrics.FormatErrs(errs, "\n"))
+		}
+		return seriesList, nil
+	}
+
+	var seriesList []*model.Series
+	var err error
+	switch metricsQueryRangeParams.CompositeMetricQuery.QueryType {
+	case model.QUERY_BUILDER:
+		runQueries := metrics.PrepareBuilderMetricQueries(metricsQueryRangeParams, constants.SIGNOZ_TIMESERIES_TABLENAME)
+		if runQueries.Err != nil {
+			respondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: runQueries.Err}, nil)
+			return
+		}
+		seriesList, err = execClickHouseQueries(runQueries.Queries)
+
+	case model.CLICKHOUSE:
+		queries := make(map[string]string)
+		for name, chQuery := range metricsQueryRangeParams.CompositeMetricQuery.ClickHouseQueries {
+			if chQuery.Disabled {
+				continue
+			}
+			queries[name] = chQuery.Query
+		}
+		seriesList, err = execClickHouseQueries(queries)
+	case model.PROM:
+		seriesList, err = execPromQueries(metricsQueryRangeParams)
+	default:
+		err = fmt.Errorf("invalid query type")
+		respondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
+		return
+	}
+
+	if err != nil {
+		apiErrObj := &model.ApiError{Typ: model.ErrorBadData, Err: err}
+		respondError(w, apiErrObj, nil)
+		return
+	}
+	if metricsQueryRangeParams.CompositeMetricQuery.PanelType == model.QUERY_VALUE &&
+		len(seriesList) > 1 &&
+		(metricsQueryRangeParams.CompositeMetricQuery.QueryType == model.QUERY_BUILDER ||
+			metricsQueryRangeParams.CompositeMetricQuery.QueryType == model.CLICKHOUSE) {
+		respondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: fmt.Errorf("invalid: query resulted in more than one series for value type")}, nil)
+		return
+	}
+
+	type ResponseFormat struct {
+		ResultType string          `json:"resultType"`
+		Result     []*model.Series `json:"result"`
+	}
+	resp := ResponseFormat{ResultType: "matrix", Result: seriesList}
+	aH.respond(w, resp)
 }
 
 func (aH *APIHandler) listRulesFromProm(w http.ResponseWriter, r *http.Request) {
diff --git a/pkg/query-service/app/interface.go b/pkg/query-service/app/interface.go
index cbbb78249b..fadbcd1e79 100644
--- a/pkg/query-service/app/interface.go
+++ b/pkg/query-service/app/interface.go
@@ -50,7 +50,8 @@ type Reader interface {
 	// Setter Interfaces
 	SetTTL(ctx context.Context, ttlParams *model.TTLParams) (*model.SetTTLResponseItem, *model.ApiError)
 
-	GetMetricAutocompleteMetricNames(ctx context.Context, matchText string) (*[]string, *model.ApiError)
+	GetMetricAutocompleteMetricNames(ctx context.Context, matchText string, limit int) (*[]string, *model.ApiError)
 	GetMetricAutocompleteTagKey(ctx context.Context, params *model.MetricAutocompleteTagParams) (*[]string, *model.ApiError)
 	GetMetricAutocompleteTagValue(ctx context.Context, params *model.MetricAutocompleteTagParams) (*[]string, *model.ApiError)
+	GetMetricResult(ctx context.Context, query string) ([]*model.Series, error)
 }
diff --git a/pkg/query-service/app/metrics/query_builder.go b/pkg/query-service/app/metrics/query_builder.go
new file mode 100644
index 0000000000..bf1896af2e
--- /dev/null
+++ b/pkg/query-service/app/metrics/query_builder.go
@@ -0,0 +1,421 @@
+package metrics
+
+import (
+	"fmt"
+	"reflect"
+	"strings"
+
+	"github.com/SigNoz/govaluate"
+	"go.signoz.io/query-service/constants"
+	"go.signoz.io/query-service/model"
+)
+
+type RunQueries struct {
+	Queries map[string]string
+	Err     error
+}
+
+var AggregateOperatorToPercentile = map[model.AggregateOperator]float64{
+	model.P05: 0.5,
+	model.P10: 0.10,
+	model.P20: 0.20,
+	model.P25: 0.25,
+	model.P50: 0.50,
+	model.P75: 0.75,
+	model.P90: 0.90,
+	model.P95: 0.95,
+	model.P99: 0.99,
+}
+
+var AggregateOperatorToSQLFunc = map[model.AggregateOperator]string{
+	model.AVG:      "avg",
+	model.MAX:      "max",
+	model.MIN:      "min",
+	model.SUM:      "sum",
+	model.RATE_SUM: "sum",
+	model.RATE_AVG: "avg",
+	model.RATE_MAX: "max",
+	model.RATE_MIN: "min",
+}
+
+var SupportedFunctions = []string{"exp", "log", "ln", "exp2", "log2", "exp10", "log10", "sqrt", "cbrt", "erf", "erfc", "lgamma", "tgamma", "sin", "cos", "tan", "asin", "acos", "atan", "degrees", "radians"}
+
+func GoValuateFuncs() map[string]govaluate.ExpressionFunction {
+	var GoValuateFuncs = map[string]govaluate.ExpressionFunction{}
+	for _, fn := range SupportedFunctions {
+		GoValuateFuncs[fn] = func(args ...interface{}) (interface{}, error) {
+			return nil, nil
+		}
+	}
+	return GoValuateFuncs
+}
+
+// formattedValue formats the value to be used in clickhouse query
+func formattedValue(v interface{}) string {
+	switch x := v.(type) {
+	case int:
+		return fmt.Sprintf("%d", x)
+	case float32, float64:
+		return fmt.Sprintf("%f", x)
+	case string:
+		return fmt.Sprintf("'%s'", x)
+	case bool:
+		return fmt.Sprintf("%v", x)
+	case []interface{}:
+		switch x[0].(type) {
+		case string:
+			str := "["
+			for idx, sVal := range x {
+				str += fmt.Sprintf("'%s'", sVal)
+				if idx != len(x)-1 {
+					str += ","
+				}
+			}
+			str += "]"
+			return str
+		case int, float32, float64, bool:
+			return strings.Join(strings.Fields(fmt.Sprint(x)), ",")
+		}
+		return ""
+	default:
+		// may be log the warning here?
+		return ""
+	}
+}
+
+// BuildMetricsTimeSeriesFilterQuery builds the sub-query to be used for filtering
+// timeseries based on search criteria
+func BuildMetricsTimeSeriesFilterQuery(fs *model.FilterSet, groupTags []string, metricName string, aggregateOperator model.AggregateOperator) (string, error) {
+	var conditions []string
+	conditions = append(conditions, fmt.Sprintf("metric_name = %s", formattedValue(metricName)))
+	if fs != nil && len(fs.Items) != 0 {
+		for _, item := range fs.Items {
+			toFormat := item.Value
+			// if the received value is an array for like/match op, just take the first value
+			if strings.ToLower(item.Operation) == "like" ||
+				strings.ToLower(item.Operation) == "match" ||
+				strings.ToLower(item.Operation) == "nlike" {
+				x, ok := item.Value.([]interface{})
+				if ok {
+					if len(x) == 0 {
+						continue
+					}
+					toFormat = x[0]
+				}
+			}
+			fmtVal := formattedValue(toFormat)
+			switch op := strings.ToLower(item.Operation); op {
+			case "eq":
+				conditions = append(conditions, fmt.Sprintf("labels_object.%s = %s", item.Key, fmtVal))
+			case "neq":
+				conditions = append(conditions, fmt.Sprintf("labels_object.%s != %s", item.Key, fmtVal))
+			case "in":
+				conditions = append(conditions, fmt.Sprintf("labels_object.%s IN %s", item.Key, fmtVal))
+			case "nin":
+				conditions = append(conditions, fmt.Sprintf("labels_object.%s NOT IN %s", item.Key, fmtVal))
+			case "like":
+				conditions = append(conditions, fmt.Sprintf("like(labels_object.%s, %s)", item.Key, fmtVal))
+			case "nlike":
+				conditions = append(conditions, fmt.Sprintf("notLike(labels_object.%s, %s)", item.Key, fmtVal))
+			case "match":
+				conditions = append(conditions, fmt.Sprintf("match(labels_object.%s, %s)", item.Key, fmtVal))
+			default:
+				return "", fmt.Errorf("unsupported operation")
+			}
+		}
+	}
+	queryString := strings.Join(conditions, " AND ")
+
+	var selectLabels string
+	if aggregateOperator == model.NOOP || aggregateOperator == model.RATE {
+		selectLabels = "labels,"
+	} else {
+		for _, tag := range groupTags {
+			selectLabels += fmt.Sprintf(" labels_object.%s as %s,", tag, tag)
+		}
+	}
+
+	filterSubQuery := fmt.Sprintf("SELECT %s fingerprint FROM %s.%s WHERE %s", selectLabels, constants.SIGNOZ_METRIC_DBNAME, constants.SIGNOZ_TIMESERIES_TABLENAME, queryString)
+
+	return filterSubQuery, nil
+}
+
+func BuildMetricQuery(qp *model.QueryRangeParamsV2, mq *model.MetricQuery, tableName string) (string, error) {
+
+	if qp.CompositeMetricQuery.PanelType == model.QUERY_VALUE && len(mq.GroupingTags) != 0 {
+		return "", fmt.Errorf("reduce operator cannot be applied for the query")
+	}
+
+	filterSubQuery, err := BuildMetricsTimeSeriesFilterQuery(mq.TagFilters, mq.GroupingTags, mq.MetricName, mq.AggregateOperator)
+	if err != nil {
+		return "", err
+	}
+
+	samplesTableTimeFilter := fmt.Sprintf("metric_name = %s AND timestamp_ms >= %d AND timestamp_ms <= %d", formattedValue(mq.MetricName), qp.Start, qp.End)
+
+	// Select the aggregate value for interval
+	queryTmpl :=
+		"SELECT %s" +
+			" toStartOfInterval(toDateTime(intDiv(timestamp_ms, 1000)), INTERVAL %d SECOND) as ts," +
+			" %s as value" +
+			" FROM " + constants.SIGNOZ_METRIC_DBNAME + "." + constants.SIGNOZ_SAMPLES_TABLENAME +
+			" INNER JOIN" +
+			" (%s) as filtered_time_series" +
+			" USING fingerprint" +
+			" WHERE " + samplesTableTimeFilter +
+			" GROUP BY %s" +
+			" ORDER BY %s ts"
+
+	groupBy := groupBy(mq.GroupingTags...)
+	groupTags := groupSelect(mq.GroupingTags...)
+
+	switch mq.AggregateOperator {
+	case model.RATE:
+		// Calculate rate of change of metric for each unique time series
+		groupBy = "fingerprint, ts"
+		groupTags = "fingerprint,"
+		op := "max(value)" // max value should be the closest value for point in time
+		subQuery := fmt.Sprintf(
+			queryTmpl, "any(labels) as labels, "+groupTags, qp.Step, op, filterSubQuery, groupBy, groupTags,
+		) // labels will be same so any should be fine
+		query := `SELECT %s ts, runningDifference(value)/runningDifference(ts) as value FROM(%s)`
+
+		query = fmt.Sprintf(query, "labels as fullLabels,", subQuery)
+		return query, nil
+	case model.SUM_RATE:
+		rateGroupBy := "fingerprint, " + groupBy
+		rateGroupTags := "fingerprint, " + groupTags
+		op := "max(value)"
+		subQuery := fmt.Sprintf(
+			queryTmpl, rateGroupTags, qp.Step, op, filterSubQuery, rateGroupBy, rateGroupTags,
+		) // labels will be same so any should be fine
+		query := `SELECT %s ts, runningDifference(value)/runningDifference(ts) as value FROM(%s) OFFSET 1`
+		query = fmt.Sprintf(query, groupTags, subQuery)
+		query = fmt.Sprintf(`SELECT %s ts, sum(value) as value FROM (%s) GROUP BY %s ORDER BY %s ts`, groupTags, query, groupBy, groupTags)
+		return query, nil
+	case model.RATE_SUM, model.RATE_MAX, model.RATE_AVG, model.RATE_MIN:
+		op := fmt.Sprintf("%s(value)", AggregateOperatorToSQLFunc[mq.AggregateOperator])
+		subQuery := fmt.Sprintf(queryTmpl, groupTags, qp.Step, op, filterSubQuery, groupBy, groupTags)
+		query := `SELECT %s ts, runningDifference(value)/runningDifference(ts) as value FROM(%s) OFFSET 1`
+		query = fmt.Sprintf(query, groupTags, subQuery)
+		return query, nil
+	case model.P05, model.P10, model.P20, model.P25, model.P50, model.P75, model.P90, model.P95, model.P99:
+		op := fmt.Sprintf("quantile(%v)(value)", AggregateOperatorToPercentile[mq.AggregateOperator])
+		query := fmt.Sprintf(queryTmpl, groupTags, qp.Step, op, filterSubQuery, groupBy, groupTags)
+		return query, nil
+	case model.AVG, model.SUM, model.MIN, model.MAX:
+		op := fmt.Sprintf("%s(value)", AggregateOperatorToSQLFunc[mq.AggregateOperator])
+		query := fmt.Sprintf(queryTmpl, groupTags, qp.Step, op, filterSubQuery, groupBy, groupTags)
+		return query, nil
+	case model.COUNT:
+		op := "toFloat64(count(*))"
+		query := fmt.Sprintf(queryTmpl, groupTags, qp.Step, op, filterSubQuery, groupBy, groupTags)
+		return query, nil
+	case model.COUNT_DISTINCT:
+		op := "toFloat64(count(distinct(value)))"
+		query := fmt.Sprintf(queryTmpl, groupTags, qp.Step, op, filterSubQuery, groupBy, groupTags)
+		return query, nil
+	case model.NOOP:
+		queryTmpl :=
+			"SELECT fingerprint, labels as fullLabels," +
+				" toStartOfInterval(toDateTime(intDiv(timestamp_ms, 1000)), INTERVAL %d SECOND) as ts," +
+				" any(value) as value" +
+				" FROM " + constants.SIGNOZ_METRIC_DBNAME + "." + constants.SIGNOZ_SAMPLES_TABLENAME +
+				" INNER JOIN" +
+				" (%s) as filtered_time_series" +
+				" USING fingerprint" +
+				" WHERE " + samplesTableTimeFilter +
+				" GROUP BY fingerprint, labels, ts" +
+				" ORDER BY fingerprint, labels, ts"
+		query := fmt.Sprintf(queryTmpl, qp.Step, filterSubQuery)
+		return query, nil
+	default:
+		return "", fmt.Errorf("unsupported aggregate operator")
+	}
+}
+
+func groupBy(tags ...string) string {
+	tags = append(tags, "ts")
+	return strings.Join(tags, ",")
+}
+
+func groupSelect(tags ...string) string {
+	groupTags := strings.Join(tags, ",")
+	if len(tags) != 0 {
+		groupTags += ", "
+	}
+	return groupTags
+}
+
+// validateExpressions validates the math expressions using the list of
+// allowed functions.
+func validateExpressions(expressions []string, funcs map[string]govaluate.ExpressionFunction) []error {
+	var errs []error
+	for _, exp := range expressions {
+		_, err := govaluate.NewEvaluableExpressionWithFunctions(exp, funcs)
+		if err != nil {
+			errs = append(errs, err)
+		}
+	}
+	return errs
+}
+
+// FormatErrs returns formatted error string
+func FormatErrs(errs []error, separator string) string {
+	var errStrs []string
+	for _, err := range errs {
+		errStrs = append(errStrs, err.Error())
+	}
+	return strings.Join(errStrs, separator)
+}
+
+func reduceQuery(query string, reduceTo model.ReduceToOperator, aggregateOperator model.AggregateOperator) (string, error) {
+	var selectLabels string
+	var groupBy string
+	// NOOP and RATE can possibly return multiple time series and reduce should be applied
+	// for each uniques series. When the final result contains more than one series we throw
+	// an error post DB fetching. Otherwise just return the single data. This is not known until queried so the
+	// the query is prepared accordingly.
+	if aggregateOperator == model.NOOP || aggregateOperator == model.RATE {
+		selectLabels = ", any(fullLabels) as fullLabels"
+		groupBy = "GROUP BY fingerprint"
+	}
+	// the timestamp picked is not relevant here since the final value used is show the single
+	// chart with just the query value. For the quer
+	switch reduceTo {
+	case model.RLAST:
+		query = fmt.Sprintf("SELECT anyLast(value) as value, any(ts) as ts %s FROM (%s) %s", selectLabels, query, groupBy)
+	case model.RSUM:
+		query = fmt.Sprintf("SELECT sum(value) as value, any(ts) as ts %s FROM (%s) %s", selectLabels, query, groupBy)
+	case model.RAVG:
+		query = fmt.Sprintf("SELECT avg(value) as value, any(ts) as ts %s FROM (%s) %s", selectLabels, query, groupBy)
+	case model.RMAX:
+		query = fmt.Sprintf("SELECT max(value) as value, any(ts) as ts %s FROM (%s) %s", selectLabels, query, groupBy)
+	case model.RMIN:
+		query = fmt.Sprintf("SELECT min(value) as value, any(ts) as ts %s FROM (%s) %s", selectLabels, query, groupBy)
+	default:
+		return "", fmt.Errorf("unsupported reduce operator")
+	}
+	return query, nil
+}
+
+// varToQuery constructs the query for each named builder block
+func varToQuery(qp *model.QueryRangeParamsV2, tableName string) (map[string]string, error) {
+	evalFuncs := GoValuateFuncs()
+	varToQuery := make(map[string]string)
+	for _, builderQuery := range qp.CompositeMetricQuery.BuilderQueries {
+		expression, _ := govaluate.NewEvaluableExpressionWithFunctions(builderQuery.Expression, evalFuncs)
+
+		// Use the parsed expression and build the query for each variable
+		// if not already exists
+		var errs []error
+		for _, _var := range expression.Vars() {
+			if _, ok := varToQuery[_var]; !ok {
+				mq := qp.CompositeMetricQuery.BuilderQueries[_var]
+				query, err := BuildMetricQuery(qp, mq, tableName)
+				if err != nil {
+					errs = append(errs, err)
+				} else {
+					if qp.CompositeMetricQuery.PanelType == model.QUERY_VALUE {
+						query, err = reduceQuery(query, mq.ReduceTo, mq.AggregateOperator)
+						if err != nil {
+							errs = append(errs, err)
+						}
+					}
+				}
+				varToQuery[_var] = query
+			}
+		}
+		if len(errs) != 0 {
+			return nil, fmt.Errorf("error while creating query: %s", FormatErrs(errs, "\n"))
+		}
+	}
+	return varToQuery, nil
+}
+
+// expressionToQuery constructs the query for the expression
+func expressionToQuery(qp *model.QueryRangeParamsV2, varToQuery map[string]string, expression *govaluate.EvaluableExpression) (string, error) {
+	var formulaQuery string
+	vars := expression.Vars()
+	for idx, var_ := range vars[1:] {
+		x, y := vars[idx], var_
+		if !reflect.DeepEqual(qp.CompositeMetricQuery.BuilderQueries[x].GroupingTags, qp.CompositeMetricQuery.BuilderQueries[y].GroupingTags) {
+			return "", fmt.Errorf("group by must be same")
+		}
+	}
+	var modified []govaluate.ExpressionToken
+	tokens := expression.Tokens()
+	for idx := range tokens {
+		token := tokens[idx]
+		if token.Kind == govaluate.VARIABLE {
+			token.Value = fmt.Sprintf("%v.value", token.Value)
+			token.Meta = fmt.Sprintf("%v.value", token.Meta)
+		}
+		modified = append(modified, token)
+	}
+	formula, _ := govaluate.NewEvaluableExpressionFromTokens(modified)
+
+	var formulaSubQuery string
+	var joinUsing string
+	for idx, var_ := range vars {
+		query := varToQuery[var_]
+		groupTags := qp.CompositeMetricQuery.BuilderQueries[var_].GroupingTags
+		groupTags = append(groupTags, "ts")
+		joinUsing = strings.Join(groupTags, ",")
+		formulaSubQuery += fmt.Sprintf("(%s) as %s ", query, var_)
+		if idx < len(vars)-1 {
+			formulaSubQuery += "INNER JOIN"
+		} else if len(vars) > 1 {
+			formulaSubQuery += fmt.Sprintf("USING (%s)", joinUsing)
+		}
+	}
+	formulaQuery = fmt.Sprintf("SELECT %s, %s as value FROM ", joinUsing, formula.ExpressionString()) + formulaSubQuery
+	return formulaQuery, nil
+}
+
+// PrepareBuilderMetricQueries constructs the queries to be run for query range timeseries
+func PrepareBuilderMetricQueries(qp *model.QueryRangeParamsV2, tableName string) *RunQueries {
+	evalFuncs := GoValuateFuncs()
+
+	// validate the expressions
+	var expressions []string
+	for _, bq := range qp.CompositeMetricQuery.BuilderQueries {
+		expressions = append(expressions, bq.Expression)
+	}
+	if errs := validateExpressions(expressions, evalFuncs); len(errs) != 0 {
+		return &RunQueries{Err: fmt.Errorf("invalid expressions: %s", FormatErrs(errs, "\n"))}
+	}
+
+	varToQuery, err := varToQuery(qp, tableName)
+	if err != nil {
+		return &RunQueries{Err: err}
+	}
+
+	namedQueries := make(map[string]string)
+
+	var errs []error
+	for _, builderQuery := range qp.CompositeMetricQuery.BuilderQueries {
+		if builderQuery.Disabled {
+			continue
+		}
+		expression, _ := govaluate.NewEvaluableExpressionWithFunctions(builderQuery.Expression, evalFuncs)
+		tokens := expression.Tokens()
+		// expression with one token is used to represent
+		// that there are no functions applied on query
+		if len(tokens) == 1 {
+			_var := tokens[0].Value.(string)
+			namedQueries[builderQuery.QueryName] = varToQuery[_var]
+		} else {
+			query, err := expressionToQuery(qp, varToQuery, expression)
+			if err != nil {
+				errs = append(errs, err)
+			}
+			namedQueries[builderQuery.QueryName] = query
+		}
+	}
+	if len(errs) != 0 {
+		return &RunQueries{Err: fmt.Errorf("errors with formulas: %s", FormatErrs(errs, "\n"))}
+	}
+	fmt.Println(namedQueries)
+	return &RunQueries{Queries: namedQueries}
+}
diff --git a/pkg/query-service/app/metrics/query_builder_test.go b/pkg/query-service/app/metrics/query_builder_test.go
new file mode 100644
index 0000000000..4530a01a79
--- /dev/null
+++ b/pkg/query-service/app/metrics/query_builder_test.go
@@ -0,0 +1,130 @@
+package metrics
+
+import (
+	"testing"
+
+	. "github.com/smartystreets/goconvey/convey"
+	"go.signoz.io/query-service/model"
+)
+
+func TestBuildQuery(t *testing.T) {
+	Convey("TestSimpleQueryWithName", t, func() {
+		q := &model.QueryRangeParamsV2{
+			Start: 1650991982000,
+			End:   1651078382000,
+			Step:  60,
+			CompositeMetricQuery: &model.CompositeMetricQuery{
+				BuilderQueries: map[string]*model.MetricQuery{
+					"a": {
+						QueryName:         "a",
+						MetricName:        "name",
+						AggregateOperator: model.RATE_MAX,
+						Expression:        "a",
+					},
+				},
+			},
+		}
+		queries := PrepareBuilderMetricQueries(q, "table").Queries
+		So(len(queries), ShouldEqual, 1)
+		So(queries["a"], ShouldContainSubstring, "WHERE metric_name = 'name'")
+		So(queries["a"], ShouldContainSubstring, "runningDifference(value)/runningDifference(ts)")
+	})
+}
+
+func TestBuildQueryWithFilters(t *testing.T) {
+	Convey("TestBuildQueryWithFilters", t, func() {
+		q := &model.QueryRangeParamsV2{
+			Start: 1650991982000,
+			End:   1651078382000,
+			Step:  60,
+			CompositeMetricQuery: &model.CompositeMetricQuery{
+				BuilderQueries: map[string]*model.MetricQuery{
+					"a": {
+						QueryName:  "a",
+						MetricName: "name",
+						TagFilters: &model.FilterSet{Operation: "AND", Items: []model.FilterItem{
+							{Key: "a", Value: "b", Operation: "neq"},
+						}},
+						AggregateOperator: model.RATE_MAX,
+						Expression:        "a",
+					},
+				},
+			},
+		}
+		queries := PrepareBuilderMetricQueries(q, "table").Queries
+		So(len(queries), ShouldEqual, 1)
+
+		So(queries["a"], ShouldContainSubstring, "WHERE metric_name = 'name' AND labels_object.a != 'b'")
+		So(queries["a"], ShouldContainSubstring, "runningDifference(value)/runningDifference(ts)")
+	})
+}
+
+func TestBuildQueryWithMultipleQueries(t *testing.T) {
+	Convey("TestBuildQueryWithFilters", t, func() {
+		q := &model.QueryRangeParamsV2{
+			Start: 1650991982000,
+			End:   1651078382000,
+			Step:  60,
+			CompositeMetricQuery: &model.CompositeMetricQuery{
+				BuilderQueries: map[string]*model.MetricQuery{
+					"a": {
+						QueryName:  "a",
+						MetricName: "name",
+						TagFilters: &model.FilterSet{Operation: "AND", Items: []model.FilterItem{
+							{Key: "in", Value: []interface{}{"a", "b", "c"}, Operation: "in"},
+						}},
+						AggregateOperator: model.RATE_AVG,
+						Expression:        "a",
+					},
+					"b": {
+						QueryName:         "b",
+						MetricName:        "name2",
+						AggregateOperator: model.RATE_MAX,
+						Expression:        "b",
+					},
+				},
+			},
+		}
+		queries := PrepareBuilderMetricQueries(q, "table").Queries
+		So(len(queries), ShouldEqual, 2)
+		So(queries["a"], ShouldContainSubstring, "WHERE metric_name = 'name' AND labels_object.in IN ['a','b','c']")
+		So(queries["a"], ShouldContainSubstring, "runningDifference(value)/runningDifference(ts)")
+	})
+}
+
+func TestBuildQueryWithMultipleQueriesAndFormula(t *testing.T) {
+	Convey("TestBuildQueryWithFilters", t, func() {
+		q := &model.QueryRangeParamsV2{
+			Start: 1650991982000,
+			End:   1651078382000,
+			Step:  60,
+			CompositeMetricQuery: &model.CompositeMetricQuery{
+				BuilderQueries: map[string]*model.MetricQuery{
+					"a": {
+						QueryName:  "a",
+						MetricName: "name",
+						TagFilters: &model.FilterSet{Operation: "AND", Items: []model.FilterItem{
+							{Key: "in", Value: []interface{}{"a", "b", "c"}, Operation: "in"},
+						}},
+						AggregateOperator: model.RATE_MAX,
+						Expression:        "a",
+					},
+					"b": {
+						MetricName:        "name2",
+						AggregateOperator: model.RATE_AVG,
+						Expression:        "b",
+					},
+					"c": {
+						QueryName:  "c",
+						Expression: "a/b",
+					},
+				},
+			},
+		}
+		queries := PrepareBuilderMetricQueries(q, "table").Queries
+		So(len(queries), ShouldEqual, 3)
+		So(queries["c"], ShouldContainSubstring, "SELECT ts, a.value / b.value")
+		So(queries["c"], ShouldContainSubstring, "WHERE metric_name = 'name' AND labels_object.in IN ['a','b','c']")
+		So(queries["c"], ShouldContainSubstring, "runningDifference(value)/runningDifference(ts)")
+	})
+}
diff --git a/pkg/query-service/app/parser.go b/pkg/query-service/app/parser.go
index 2dd6e44c52..9d3705da9f 100644
--- a/pkg/query-service/app/parser.go
+++ b/pkg/query-service/app/parser.go
@@ -667,3 +667,12 @@ func parseChangePasswordRequest(r *http.Request) (*model.ChangePasswordRequest,
 
 	return &req, nil
 }
+
+func parseFilterSet(r *http.Request) (*model.FilterSet, error) {
+	var filterSet model.FilterSet
+	err := json.NewDecoder(r.Body).Decode(&filterSet)
+	if err != nil {
+		return nil, err
+	}
+	return &filterSet, nil
+}
diff --git a/pkg/query-service/app/parser/metrics.go b/pkg/query-service/app/parser/metrics.go
index 279331ba3c..ce4d079fa5 100644
--- a/pkg/query-service/app/parser/metrics.go
+++ b/pkg/query-service/app/parser/metrics.go
@@ -5,19 +5,39 @@ import (
 	"fmt"
 	"net/http"
 
+	"go.signoz.io/query-service/app/metrics"
 	"go.signoz.io/query-service/model"
 )
 
+func validateQueryRangeParamsV2(qp *model.QueryRangeParamsV2) error {
+	var errs []error
+	if !(qp.DataSource >= model.METRICS && qp.DataSource <= model.LOGS) {
+		errs = append(errs, fmt.Errorf("unsupported data source"))
+	}
+	if !(qp.CompositeMetricQuery.QueryType >= model.QUERY_BUILDER && qp.CompositeMetricQuery.QueryType <= model.PROM) {
+		errs = append(errs, fmt.Errorf("unsupported query type"))
+	}
+	if !(qp.CompositeMetricQuery.PanelType >= model.TIME_SERIES && qp.CompositeMetricQuery.PanelType <= model.QUERY_VALUE) {
+		errs = append(errs, fmt.Errorf("unsupported panel type"))
+	}
+	if len(errs) != 0 {
+		return fmt.Errorf("one or more errors found : %s", metrics.FormatErrs(errs, ","))
+	}
+	return nil
+}
+
 func ParseMetricQueryRangeParams(r *http.Request) (*model.QueryRangeParamsV2, *model.ApiError) {
 
 	var postData *model.QueryRangeParamsV2
-	err := json.NewDecoder(r.Body).Decode(&postData)
 
-	if err != nil {
+	if err := json.NewDecoder(r.Body).Decode(&postData); err != nil {
+		return nil, &model.ApiError{Typ: model.ErrorBadData, Err: err}
+	}
+	if err := validateQueryRangeParamsV2(postData); err != nil {
 		return nil, &model.ApiError{Typ: model.ErrorBadData, Err: err}
 	}
 
-	return nil, nil
+	return postData, nil
 }
 
 func ParseMetricAutocompleteTagParams(r *http.Request) (*model.MetricAutocompleteTagParams, *model.ApiError) {
diff --git a/pkg/query-service/app/parser_test.go b/pkg/query-service/app/parser_test.go
new file mode 100644
index 0000000000..6fa049a05e
--- /dev/null
+++ b/pkg/query-service/app/parser_test.go
@@ -0,0 +1,60 @@
+package app
+
+import (
+	"bytes"
+	"net/http"
+	"testing"
+
+	"github.com/smartystreets/assertions/should"
+
+	. "github.com/smartystreets/goconvey/convey"
+	"go.signoz.io/query-service/app/metrics"
+	"go.signoz.io/query-service/model"
+)
+
+func TestParseFilterSingleFilter(t *testing.T) {
+	Convey("TestParseFilterSingleFilter", t, func() {
+		postBody := []byte(`{
+			"op": "AND",
+			"items": [
+				{"key": "namespace", "value": "a", "op": "EQ"}
+			]
+		}`)
+		req, _ := http.NewRequest("POST", "", bytes.NewReader(postBody))
+		res, _ := parseFilterSet(req)
+		query, _ := metrics.BuildMetricsTimeSeriesFilterQuery(res, []string{}, "table", model.NOOP)
+		So(query, ShouldContainSubstring, "signoz_metrics.time_series_v2 WHERE metric_name = 'table' AND labels_object.namespace = 'a'")
+	})
+}
+
+func TestParseFilterMultipleFilter(t *testing.T) {
+	Convey("TestParseFilterMultipleFilter", t, func() {
+		postBody := []byte(`{
+			"op": "AND",
+			"items": [
+				{"key": "namespace", "value": "a", "op": "EQ"},
+				{"key": "host", "value": ["host-1", "host-2"], "op": "IN"}
+			]
+		}`)
+		req, _ := http.NewRequest("POST", "", bytes.NewReader(postBody))
+		res, _ := parseFilterSet(req)
+		query, _ := metrics.BuildMetricsTimeSeriesFilterQuery(res, []string{}, "table", model.NOOP)
+		So(query, should.ContainSubstring, "labels_object.host IN ['host-1','host-2']")
+		So(query, should.ContainSubstring, "labels_object.namespace = 'a'")
+	})
+}
+
+func TestParseFilterNotSupportedOp(t *testing.T) {
+	Convey("TestParseFilterNotSupportedOp", t, func() {
+		postBody := []byte(`{
+			"op": "AND",
+			"items": [
+				{"key": "namespace", "value": "a", "op": "PO"}
+			]
+		}`)
+		req, _ := http.NewRequest("POST", "", bytes.NewReader(postBody))
+		res, _ := parseFilterSet(req)
+		_, err := metrics.BuildMetricsTimeSeriesFilterQuery(res, []string{}, "table", model.NOOP)
+		So(err, should.BeError, "unsupported operation")
+	})
+}
diff --git a/pkg/query-service/constants/constants.go b/pkg/query-service/constants/constants.go
index 2825ce31ea..b4bc4b08ef 100644
--- a/pkg/query-service/constants/constants.go
+++ b/pkg/query-service/constants/constants.go
@@ -62,6 +62,11 @@ const (
 	StatusFailed     = "failed"
 	StatusSuccess    = "success"
 )
+const (
+	SIGNOZ_METRIC_DBNAME        = "signoz_metrics"
+	SIGNOZ_SAMPLES_TABLENAME    = "samples_v2"
+	SIGNOZ_TIMESERIES_TABLENAME = "time_series_v2"
+)
 
 func GetOrDefaultEnv(key string, fallback string) string {
 	v := os.Getenv(key)
diff --git a/pkg/query-service/go.mod b/pkg/query-service/go.mod
index b101f18da5..6bd0e68ead 100644
--- a/pkg/query-service/go.mod
+++ b/pkg/query-service/go.mod
@@ -4,6 +4,7 @@ go 1.17
 
 require (
 	github.com/ClickHouse/clickhouse-go/v2 v2.0.12
+	github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb
 	github.com/go-kit/log v0.1.0
 	github.com/google/uuid v1.3.0
 	github.com/gorilla/handlers v1.5.1
@@ -107,7 +108,7 @@ require (
 	github.com/segmentio/backo-go v1.0.0 // indirect
 	github.com/shopspring/decimal v1.3.1 // indirect
 	github.com/sirupsen/logrus v1.8.1 // indirect
-	github.com/smartystreets/assertions v1.1.0 // indirect
+	github.com/smartystreets/assertions v1.1.0
 	github.com/spaolacci/murmur3 v1.1.0 // indirect
 	github.com/spf13/pflag v1.0.3 // indirect
 	github.com/stretchr/testify v1.7.1
@@ -139,4 +140,4 @@ require (
 	k8s.io/client-go v8.0.0+incompatible // indirect
 )
 
-replace github.com/prometheus/prometheus => github.com/SigNoz/prometheus v1.9.70
+replace github.com/prometheus/prometheus => github.com/SigNoz/prometheus v1.9.71
diff --git a/pkg/query-service/go.sum b/pkg/query-service/go.sum
index 77fd087ceb..72675da497 100644
--- a/pkg/query-service/go.sum
+++ b/pkg/query-service/go.sum
@@ -55,8 +55,10 @@ github.com/ClickHouse/clickhouse-go/v2 v2.0.12/go.mod h1:u4RoNQLLM2W6hNSPYrIESLJ
 github.com/OneOfOne/xxhash v1.2.2/go.mod h1:HSdplMjZKSmBqAxg5vPj2TmRDmfkzw+cTzAElWljhcU=
 github.com/OneOfOne/xxhash v1.2.8 h1:31czK/TI9sNkxIKfaUfGlU47BAxQ0ztGgd9vPyqimf8=
 github.com/OneOfOne/xxhash v1.2.8/go.mod h1:eZbhyaAYD41SGSSsnmcpxVoRiQ/MPUTjUdIIOT9Um7Q=
-github.com/SigNoz/prometheus v1.9.70 h1:0214i78cje5MkX0tXYwX2cK4cHXrFw18WcSLhv4YDpk=
-github.com/SigNoz/prometheus v1.9.70/go.mod h1:Y4J9tGDmacMC+EcOTp+EIAn2C1sN+9kE+idyVKadiVM=
+github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb h1:bneLSKPf9YUSFmafKx32bynV6QrzViL/s+ZDvQxH1E4=
+github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb/go.mod h1:JznGDNg9x1cujDKa22RaQOimOvvEfy3nxzDGd8XDgmA=
+github.com/SigNoz/prometheus v1.9.71 h1:X+6f4k5bqX+lpPFHCi+f6XiSehTj3Yzh1B/FDJi//Sk=
+github.com/SigNoz/prometheus v1.9.71/go.mod h1:Y4J9tGDmacMC+EcOTp+EIAn2C1sN+9kE+idyVKadiVM=
 github.com/StackExchange/wmi v0.0.0-20190523213315-cbe66965904d/go.mod h1:3eOhrUMpNV+6aFIbp5/iudMxNCF27Vw2OZgy4xEx0Fg=
 github.com/alecthomas/template v0.0.0-20160405071501-a0175ee3bccc/go.mod h1:LOuyumcjzFXgccqObfd/Ljyb9UuFJ6TxHnclSeseNhc=
 github.com/alecthomas/units v0.0.0-20151022065526-2efee857e7cf/go.mod h1:ybxpYRFXyAe+OPACYpWeL0wqObRcbAqCMya13uyzqw0=
diff --git a/pkg/query-service/model/queryParams.go b/pkg/query-service/model/queryParams.go
index 9cc1ce235c..d1763a0440 100644
--- a/pkg/query-service/model/queryParams.go
+++ b/pkg/query-service/model/queryParams.go
@@ -18,27 +18,114 @@ type QueryRangeParams struct {
 	Stats string
 }
 
-type Query struct {
-	Datasource string `json:"datasource"`
-	Format     string `json:"format"`
-	Expr       string `json:"expr"`
+type MetricQuery struct {
+	QueryName         string            `json:"queryName"`
+	MetricName        string            `json:"metricName"`
+	TagFilters        *FilterSet        `json:"tagFilters,omitempty"`
+	GroupingTags      []string          `json:"groupBy,omitempty"`
+	AggregateOperator AggregateOperator `json:"aggregateOperator"`
+	Expression        string            `json:"expression"`
+	Disabled          bool              `json:"disabled"`
+	ReduceTo          ReduceToOperator  `json:"reduceTo,omitempty"`
 }
 
+type ReduceToOperator int
+
+const (
+	_ ReduceToOperator = iota
+	RLAST
+	RSUM
+	RAVG
+	RMAX
+	RMIN
+)
+
+type QueryType int
+
+const (
+	_ QueryType = iota
+	QUERY_BUILDER
+	CLICKHOUSE
+	PROM
+)
+
+type PromQuery struct {
+	Query    string `json:"query"`
+	Stats    string `json:"stats,omitempty"`
+	Disabled bool   `json:"disabled"`
+}
+
+type ClickHouseQuery struct {
+	Query    string `json:"query"`
+	Disabled bool   `json:"disabled"`
+}
+
+type PanelType int
+
+const (
+	_ PanelType = iota
+	TIME_SERIES
+	QUERY_VALUE
+)
+
+type CompositeMetricQuery struct {
+	BuilderQueries    map[string]*MetricQuery     `json:"builderQueries,omitempty"`
+	ClickHouseQueries map[string]*ClickHouseQuery `json:"chQueries,omitempty"`
+	PromQueries       map[string]*PromQuery       `json:"promQueries,omitempty"`
+	PanelType         PanelType                   `json:"panelType"`
+	QueryType         QueryType                   `json:"queryType"`
+}
+
+type AggregateOperator int
+
+const (
+	_ AggregateOperator = iota
+	NOOP
+	COUNT
+	COUNT_DISTINCT
+	SUM
+	AVG
+	MAX
+	MIN
+	P05
+	P10
+	P20
+	P25
+	P50
+	P75
+	P90
+	P95
+	P99
+	RATE
+	SUM_RATE
+	// leave blank space for possily {AVG, X}_RATE
+	_
+	_
+	_
+	RATE_SUM
+	RATE_AVG
+	RATE_MAX
+	RATE_MIN
+)
+
+type DataSource int
+
+const (
+	_ DataSource = iota
+	METRICS
+	TRACES
+	LOGS
+)
+
 type QueryRangeParamsV2 struct {
-	Start    time.Time
-	End      time.Time
-	Step     time.Duration
-	StartStr string  `json:"start"`
-	EndStr   string  `json:"end"`
-	StepStr  string  `json:"step"`
-	Queries  []Query `json:"queries"`
-}
-
-func (params QueryRangeParamsV2) sanitizeAndValidate() (*QueryRangeParamsV2, error) {
-
-	return nil, nil
+	DataSource           DataSource            `json:"dataSource"`
+	Start                int64                 `json:"start"`
+	End                  int64                 `json:"end"`
+	Step                 int64                 `json:"step"`
+	CompositeMetricQuery *CompositeMetricQuery `json:"compositeMetricQuery"`
 }
 
+// Metric auto complete types
 type metricTags map[string]string
 
 type MetricAutocompleteTagParams struct {
@@ -192,7 +279,7 @@ type TTLParams struct {
 }
 
 type GetTTLParams struct {
-	Type      string
+	Type string
 }
 
 type GetErrorsParams struct {
@@ -205,3 +292,19 @@ type GetErrorParams struct {
 	ErrorID     string
 	ServiceName string
 }
+
+type FilterItem struct {
+	Key       string      `json:"key"`
+	Value     interface{} `json:"value"`
+	Operation string      `json:"op"`
+}
+
+type FilterSet struct {
+	Operation string       `json:"op,omitempty"`
+	Items     []FilterItem `json:"items"`
+}
+
+type RemoveTTLParams struct {
+	Type         string
+	RemoveAllTTL bool
+}
diff --git a/pkg/query-service/model/response.go b/pkg/query-service/model/response.go
index 358fe6e979..523ad7e96e 100644
--- a/pkg/query-service/model/response.go
+++ b/pkg/query-service/model/response.go
@@ -356,3 +356,20 @@ type ErrorWithSpan struct {
 	NewerErrorID        string    `json:"newerErrorId" ch:"newerErrorId"`
 	OlderErrorID        string    `json:"olderErrorId" ch:"olderErrorId"`
 }
+
+type Series struct {
+	QueryName string            `json:"queryName"`
+	Labels    map[string]string `json:"metric"`
+	Points    []MetricPoint     `json:"values"`
+}
+
+type MetricPoint struct {
+	Timestamp int64
+	Value     float64
+}
+
+// MarshalJSON implements json.Marshaler.
+func (p *MetricPoint) MarshalJSON() ([]byte, error) {
+	v := strconv.FormatFloat(p.Value, 'f', -1, 64)
+	return json.Marshal([...]interface{}{float64(p.Timestamp) / 1000, v})
+}

From b2afb9aabc9cfc8a6867fa8328c14ecd94fa543e Mon Sep 17 00:00:00 2001
From: Ankit Nayan <ankit@signoz.io>
Date: Fri, 24 Jun 2022 14:55:02 +0530
Subject: [PATCH 32/42] chore: changed scrape interval to 60s and batch size to
 10000 (#1316)

* chore: changed scrape interval to 60s and batch size to 10000
* chore: added send_batch_max_size to the batch processor
---
 .../docker-swarm/clickhouse-setup/otel-collector-config.yaml | 5 +++--
 .../clickhouse-setup/otel-collector-metrics-config.yaml      | 5 +++--
 deploy/docker/clickhouse-setup/otel-collector-config.yaml    | 5 +++--
 .../clickhouse-setup/otel-collector-metrics-config.yaml      | 5 +++--
 4 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/deploy/docker-swarm/clickhouse-setup/otel-collector-config.yaml b/deploy/docker-swarm/clickhouse-setup/otel-collector-config.yaml
index 5f65e6eb5c..a998d93ab9 100644
--- a/deploy/docker-swarm/clickhouse-setup/otel-collector-config.yaml
+++ b/deploy/docker-swarm/clickhouse-setup/otel-collector-config.yaml
@@ -12,7 +12,7 @@ receivers:
       grpc:
       thrift_http:
   hostmetrics:
-    collection_interval: 30s
+    collection_interval: 60s
     scrapers:
       cpu:
       load:
@@ -22,7 +22,8 @@ receivers:
       network:
 processors:
   batch:
-    send_batch_size: 1000
+    send_batch_size: 10000
+    send_batch_max_size: 11000
     timeout: 10s
   signozspanmetrics/prometheus:
     metrics_exporter: prometheus
diff --git a/deploy/docker-swarm/clickhouse-setup/otel-collector-metrics-config.yaml b/deploy/docker-swarm/clickhouse-setup/otel-collector-metrics-config.yaml
index 0563a397da..3aa39b5f7e 100644
--- a/deploy/docker-swarm/clickhouse-setup/otel-collector-metrics-config.yaml
+++ b/deploy/docker-swarm/clickhouse-setup/otel-collector-metrics-config.yaml
@@ -9,12 +9,13 @@ receivers:
     config:
       scrape_configs:
         - job_name: "otel-collector"
-          scrape_interval: 30s
+          scrape_interval: 60s
           static_configs:
             - targets: ["otel-collector:8889"]
 processors:
   batch:
-    send_batch_size: 1000
+    send_batch_size: 10000
+    send_batch_max_size: 11000
     timeout: 10s
   # memory_limiter:
   #   # 80% of maximum memory up to 2G
diff --git a/deploy/docker/clickhouse-setup/otel-collector-config.yaml b/deploy/docker/clickhouse-setup/otel-collector-config.yaml
index bcf7ce58ce..e363f015df 100644
--- a/deploy/docker/clickhouse-setup/otel-collector-config.yaml
+++ b/deploy/docker/clickhouse-setup/otel-collector-config.yaml
@@ -12,7 +12,7 @@ receivers:
       grpc:
       thrift_http:
   hostmetrics:
-    collection_interval: 30s
+    collection_interval: 60s
     scrapers:
       cpu:
       load:
@@ -22,7 +22,8 @@ receivers:
       network:
 processors:
   batch:
-    send_batch_size: 1000
+    send_batch_size: 10000
+    send_batch_max_size: 11000
     timeout: 10s
   signozspanmetrics/prometheus:
     metrics_exporter: prometheus
diff --git a/deploy/docker/clickhouse-setup/otel-collector-metrics-config.yaml b/deploy/docker/clickhouse-setup/otel-collector-metrics-config.yaml
index cd5ede2358..26c629ba60 100644
--- a/deploy/docker/clickhouse-setup/otel-collector-metrics-config.yaml
+++ b/deploy/docker/clickhouse-setup/otel-collector-metrics-config.yaml
@@ -9,12 +9,13 @@ receivers:
     config:
       scrape_configs:
         - job_name: "otel-collector"
-          scrape_interval: 30s
+          scrape_interval: 60s
           static_configs:
             - targets: ["otel-collector:8889"]
 processors:
   batch:
-    send_batch_size: 1000
+    send_batch_size: 10000
+    send_batch_max_size: 11000
     timeout: 10s
   # memory_limiter:
   #   # 80% of maximum memory up to 2G

From 9d3fc493a38115e2c402fc6c81c40aca59584c1e Mon Sep 17 00:00:00 2001
From: Pranshu Chittora <pranshu@signoz.io>
Date: Fri, 24 Jun 2022 15:00:21 +0530
Subject: [PATCH 33/42] feat: Metrics Query Builder (#1166)

* feat: metrics builder metrics name suggestion UX changes
* feat: metrics builder metric name and single value selection
* feat: code cleanup
* feat: improved ts typings

Co-authored-by: Srikanth Chekuri <srikanth.chekuri92@gmail.com>
---
 frontend/src/api/metrics/getMetricName.ts     |  27 ++
 frontend/src/api/metrics/getQueryRange.ts     |  25 ++
 .../src/api/metrics/getResourceAttributes.ts  |  13 +-
 frontend/src/components/Editor/index.tsx      |  32 +-
 .../src/components/Graph/Plugin/Legend.ts     |   1 -
 frontend/src/components/Graph/index.tsx       |   9 +-
 frontend/src/components/Graph/xAxisConfig.ts  |   8 +-
 frontend/src/components/Graph/yAxisConfig.ts  |  10 +-
 frontend/src/components/TextToolTip/index.tsx |   8 +-
 frontend/src/constants/dashboard.ts           |  33 ++
 .../Graph/FullView/index.metricsBuilder.tsx   | 132 ++++++++
 .../GridGraphLayout/Graph/FullView/index.tsx  |   4 +-
 .../container/GridGraphLayout/Graph/index.tsx | 191 ++++++++----
 .../src/container/GridGraphLayout/utils.ts    |  36 ++-
 .../ResourceAttributesFilter/utils.ts         |  12 +-
 .../MetricsApplication/Tabs/DBCall.tsx        |   4 +-
 .../MetricsApplication/Tabs/External.tsx      |   4 +-
 .../MetricsApplication/Tabs/Overview.tsx      |  10 +-
 .../container/MetricsApplication/index.tsx    |   4 +-
 .../LeftContainer/QuerySection/Query.tsx      | 151 ---------
 .../QuerySection/QueryBuilder/Options.ts      |  20 ++
 .../QuerySection/QueryBuilder/QueryHeader.tsx |  46 +++
 .../QueryBuilder/clickHouse/index.tsx         |  69 ++++
 .../QueryBuilder/clickHouse/query.tsx         |  53 ++++
 .../QuerySection/QueryBuilder/index.tsx       |  95 ++++++
 .../QueryBuilder/promQL/index.tsx             |  67 ++++
 .../QueryBuilder/promQL/query.tsx             |  45 +++
 .../MetricTagKey.machine.ts                   |  61 ++++
 .../MetricTagKey.machine.typegen.ts           |  32 ++
 .../MetricTagKeyFilter/QueryChip.tsx          |  31 ++
 .../queryBuilder/MetricTagKeyFilter/index.tsx | 211 +++++++++++++
 .../queryBuilder/MetricTagKeyFilter/styles.ts |  30 ++
 .../queryBuilder/MetricTagKeyFilter/types.ts  |  11 +
 .../queryBuilder/MetricTagKeyFilter/utils.ts  |  55 ++++
 .../QueryBuilder/queryBuilder/formula.tsx     |  37 +++
 .../QueryBuilder/queryBuilder/index.tsx       | 168 ++++++++++
 .../QueryBuilder/queryBuilder/query.tsx       | 200 ++++++++++++
 .../QueryBuilder/queryBuilder/utils.ts        |  16 +
 .../LeftContainer/QuerySection/TabHeader.tsx  |  31 ++
 .../LeftContainer/QuerySection/constants.ts   |  17 +
 .../LeftContainer/QuerySection/index.tsx      | 295 ++++++++++++++++--
 .../LeftContainer/QuerySection/styles.ts      |  13 +-
 .../LeftContainer/QuerySection/types.ts       |  13 +
 .../QuerySection/utils/getQueryKey.ts         |   7 +
 .../QuerySection/utils/userSettings.ts        |  23 ++
 .../NewWidget/LeftContainer/QueryTypeTag.tsx  |  35 +++
 .../LeftContainer/WidgetGraph/PlotTag.tsx     |  17 +
 .../LeftContainer/WidgetGraph/WidgetGraph.tsx |  10 +-
 .../LeftContainer/WidgetGraph/index.tsx       |   3 +-
 .../LeftContainer/WidgetGraph/styles.ts       |   4 +-
 .../NewWidget/LeftContainer/index.tsx         |   9 +-
 frontend/src/container/NewWidget/index.tsx    | 106 ++++---
 frontend/src/container/NewWidget/styles.ts    |   6 +-
 frontend/src/lib/getChartData.ts              |  11 +-
 frontend/src/lib/getLabelName.ts              |   4 +-
 frontend/src/lib/getMaxMinTime.ts             |   2 +-
 frontend/src/lib/query/GetFormulaName.ts      |  27 ++
 frontend/src/lib/query/GetQueryName.ts        |  29 ++
 .../store/actions/dashboard/getDashboard.ts   |  42 ++-
 .../actions/dashboard/getQueryResults.ts      | 223 +++++++++----
 .../store/actions/dashboard/saveDashboard.ts  |   1 -
 .../store/actions/dashboard/updateQuery.ts    |  29 +-
 .../actions/dashboard/updateQueryType.ts      |  21 ++
 frontend/src/store/reducers/dashboard.ts      | 122 ++++----
 frontend/src/types/actions/dashboard.ts       |  37 ++-
 frontend/src/types/api/dashboard/getAll.ts    |  67 +++-
 frontend/src/types/api/dashboard/shared.ts    |   5 +
 .../src/types/api/metrics/getMetricName.ts    |   4 +
 .../src/types/api/metrics/getQueryRange.ts    |   9 +
 .../api/metrics/getResourceAttributes.ts      |   9 +-
 frontend/src/types/api/widgets/getQuery.ts    |   1 +
 frontend/src/types/common/dashboard.ts        |  50 +++
 72 files changed, 2700 insertions(+), 543 deletions(-)
 create mode 100644 frontend/src/api/metrics/getMetricName.ts
 create mode 100644 frontend/src/api/metrics/getQueryRange.ts
 create mode 100644 frontend/src/constants/dashboard.ts
 create mode 100644 frontend/src/container/GridGraphLayout/Graph/FullView/index.metricsBuilder.tsx
 delete mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.typegen.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/userSettings.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx
 create mode 100644 frontend/src/lib/query/GetFormulaName.ts
 create mode 100644 frontend/src/lib/query/GetQueryName.ts
 create mode 100644 frontend/src/store/actions/dashboard/updateQueryType.ts
 create mode 100644 frontend/src/types/api/dashboard/shared.ts
 create mode 100644 frontend/src/types/api/metrics/getMetricName.ts
 create mode 100644 frontend/src/types/api/metrics/getQueryRange.ts
 create mode 100644 frontend/src/types/common/dashboard.ts

diff --git a/frontend/src/api/metrics/getMetricName.ts b/frontend/src/api/metrics/getMetricName.ts
new file mode 100644
index 0000000000..f3bff5a921
--- /dev/null
+++ b/frontend/src/api/metrics/getMetricName.ts
@@ -0,0 +1,27 @@
+import { ApiV2Instance as axios } from 'api';
+import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
+import { AxiosError } from 'axios';
+import { ErrorResponse, SuccessResponse } from 'types/api';
+import {
+	MetricNameProps,
+	MetricNamesPayloadProps,
+} from 'types/api/metrics/getMetricName';
+
+export const getMetricName = async (
+	props: MetricNameProps,
+): Promise<SuccessResponse<MetricNamesPayloadProps> | ErrorResponse> => {
+	try {
+		const response = await axios.get(
+			`/metrics/autocomplete/list?match=${props || ''}`,
+		);
+
+		return {
+			statusCode: 200,
+			error: null,
+			message: response.data.status,
+			payload: response.data,
+		};
+	} catch (error) {
+		return ErrorResponseHandler(error as AxiosError);
+	}
+};
diff --git a/frontend/src/api/metrics/getQueryRange.ts b/frontend/src/api/metrics/getQueryRange.ts
new file mode 100644
index 0000000000..b6715f85e6
--- /dev/null
+++ b/frontend/src/api/metrics/getQueryRange.ts
@@ -0,0 +1,25 @@
+import { ApiV2Instance as axios } from 'api';
+import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
+import { AxiosError } from 'axios';
+import { ErrorResponse, SuccessResponse } from 'types/api';
+import {
+	MetricRangePayloadProps,
+	MetricsRangeProps,
+} from 'types/api/metrics/getQueryRange';
+
+export const getMetricsQueryRange = async (
+	props: MetricsRangeProps,
+): Promise<SuccessResponse<MetricRangePayloadProps> | ErrorResponse> => {
+	try {
+		const response = await axios.post(`/metrics/query_range`, props);
+
+		return {
+			statusCode: 200,
+			error: null,
+			message: response.data.status,
+			payload: response.data,
+		};
+	} catch (error) {
+		return ErrorResponseHandler(error as AxiosError);
+	}
+};
diff --git a/frontend/src/api/metrics/getResourceAttributes.ts b/frontend/src/api/metrics/getResourceAttributes.ts
index 5be45af6f1..66524bf8f7 100644
--- a/frontend/src/api/metrics/getResourceAttributes.ts
+++ b/frontend/src/api/metrics/getResourceAttributes.ts
@@ -3,17 +3,20 @@ import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
 import { AxiosError } from 'axios';
 import { ErrorResponse, SuccessResponse } from 'types/api';
 import {
+	TagKeyProps,
 	TagKeysPayloadProps,
 	TagValueProps,
 	TagValuesPayloadProps,
 } from 'types/api/metrics/getResourceAttributes';
 
-export const getResourceAttributesTagKeys = async (): Promise<
-	SuccessResponse<TagKeysPayloadProps> | ErrorResponse
-> => {
+export const getResourceAttributesTagKeys = async (
+	props: TagKeyProps,
+): Promise<SuccessResponse<TagKeysPayloadProps> | ErrorResponse> => {
 	try {
 		const response = await axios.get(
-			'/metrics/autocomplete/tagKey?metricName=signoz_calls_total&match=resource_',
+			`/metrics/autocomplete/tagKey?metricName=${props.metricName}${
+				props.match ? `&match=${props.match}` : ''
+			}`,
 		);
 
 		return {
@@ -32,7 +35,7 @@ export const getResourceAttributesTagValues = async (
 ): Promise<SuccessResponse<TagValuesPayloadProps> | ErrorResponse> => {
 	try {
 		const response = await axios.get(
-			`/metrics/autocomplete/tagValue?metricName=signoz_calls_total&tagKey=${props}`,
+			`/metrics/autocomplete/tagValue?metricName=${props.metricName}&tagKey=${props.tagKey}`,
 		);
 
 		return {
diff --git a/frontend/src/components/Editor/index.tsx b/frontend/src/components/Editor/index.tsx
index 0ed486e248..92033b0830 100644
--- a/frontend/src/components/Editor/index.tsx
+++ b/frontend/src/components/Editor/index.tsx
@@ -1,38 +1,46 @@
-import MEditor from '@monaco-editor/react';
+import MEditor, { EditorProps } from '@monaco-editor/react';
 import React from 'react';
+import { useSelector } from 'react-redux';
+import { AppState } from 'store/reducers';
+import AppReducer from 'types/reducer/app';
 
 function Editor({
 	value,
-	language = 'yaml',
+	language,
 	onChange,
-	readOnly = false,
-}: EditorProps): JSX.Element {
+	readOnly,
+	height,
+	options,
+}: MEditorProps): JSX.Element {
+	const { isDarkMode } = useSelector<AppState, AppReducer>((state) => state.app);
 	return (
 		<MEditor
-			theme="vs-dark"
+			theme={isDarkMode ? 'vs-dark' : 'vs-light'}
 			language={language}
 			value={value}
-			options={{ fontSize: 16, automaticLayout: true, readOnly }}
-			height="40vh"
+			options={{ fontSize: 16, automaticLayout: true, readOnly, ...options }}
+			height={height}
 			onChange={(newValue): void => {
-				if (newValue) {
-					onChange(newValue);
-				}
+				if (typeof newValue === 'string') onChange(newValue);
 			}}
 		/>
 	);
 }
 
-interface EditorProps {
+interface MEditorProps {
 	value: string;
 	language?: string;
 	onChange: (value: string) => void;
 	readOnly?: boolean;
+	height?: string;
+	options?: EditorProps['options'];
 }
 
 Editor.defaultProps = {
-	language: undefined,
+	language: 'yaml',
 	readOnly: false,
+	height: '40vh',
+	options: {},
 };
 
 export default Editor;
diff --git a/frontend/src/components/Graph/Plugin/Legend.ts b/frontend/src/components/Graph/Plugin/Legend.ts
index b8ec2facf9..51ec58df2e 100644
--- a/frontend/src/components/Graph/Plugin/Legend.ts
+++ b/frontend/src/components/Graph/Plugin/Legend.ts
@@ -22,7 +22,6 @@ const getOrCreateLegendList = (
 		listContainer.style.height = '100%';
 		listContainer.style.flexWrap = 'wrap';
 		listContainer.style.justifyContent = 'center';
-
 		legendContainer?.appendChild(listContainer);
 	}
 
diff --git a/frontend/src/components/Graph/index.tsx b/frontend/src/components/Graph/index.tsx
index 2194387dd4..4bb76276c0 100644
--- a/frontend/src/components/Graph/index.tsx
+++ b/frontend/src/components/Graph/index.tsx
@@ -182,11 +182,10 @@ function Graph({
 			};
 			const chartHasData = hasData(data);
 			const chartPlugins = [];
-			if (chartHasData) {
-				chartPlugins.push(legend(name, data.datasets.length > 3));
-			} else {
-				chartPlugins.push(emptyGraph);
-			}
+
+			if (!chartHasData) chartPlugins.push(emptyGraph);
+			chartPlugins.push(legend(name, data.datasets.length > 3));
+
 			lineChartRef.current = new Chart(chartRef.current, {
 				type,
 				data,
diff --git a/frontend/src/components/Graph/xAxisConfig.ts b/frontend/src/components/Graph/xAxisConfig.ts
index 565b60f7e0..d14d9bba09 100644
--- a/frontend/src/components/Graph/xAxisConfig.ts
+++ b/frontend/src/components/Graph/xAxisConfig.ts
@@ -109,14 +109,14 @@ export const useXAxisTimeUnit = (data: Chart['data']): IAxisTimeConfig => {
 		let minTime = Number.POSITIVE_INFINITY;
 		let maxTime = Number.NEGATIVE_INFINITY;
 		data?.labels?.forEach((timeStamp: unknown): void => {
-			const getTimeStamp = (time: string | number): Date | number | string => {
-				if (typeof timeStamp === 'string') {
-					return Date.parse(timeStamp);
+			const getTimeStamp = (time: Date | number): Date | number | string => {
+				if (time instanceof Date) {
+					return Date.parse(time.toString());
 				}
 
 				return time;
 			};
-			const time = getTimeStamp(timeStamp as string | number);
+			const time = getTimeStamp(timeStamp as Date | number);
 
 			minTime = Math.min(parseInt(time.toString(), 10), minTime);
 			maxTime = Math.max(parseInt(time.toString(), 10), maxTime);
diff --git a/frontend/src/components/Graph/yAxisConfig.ts b/frontend/src/components/Graph/yAxisConfig.ts
index 5d1eeb5da7..44377b6fc5 100644
--- a/frontend/src/components/Graph/yAxisConfig.ts
+++ b/frontend/src/components/Graph/yAxisConfig.ts
@@ -7,13 +7,17 @@ export const getYAxisFormattedValue = (
 	let decimalPrecision: number | undefined;
 	const parsedValue = getValueFormat(format)(
 		parseFloat(value),
-		undefined,
-		undefined,
+		12,
+		12,
 		undefined,
 	);
+
 	try {
 		const decimalSplitted = parsedValue.text.split('.');
-		if (decimalSplitted.length === 1) {
+		if (
+			decimalSplitted.length === 1 ||
+			parseFloat(parsedValue.text) === parseInt(parsedValue.text, 10)
+		) {
 			decimalPrecision = 0;
 		} else {
 			const decimalDigits = decimalSplitted[1].split('');
diff --git a/frontend/src/components/TextToolTip/index.tsx b/frontend/src/components/TextToolTip/index.tsx
index 051d48c30d..06802b475f 100644
--- a/frontend/src/components/TextToolTip/index.tsx
+++ b/frontend/src/components/TextToolTip/index.tsx
@@ -10,9 +10,11 @@ function TextToolTip({ text, url }: TextToolTipProps): JSX.Element {
 				return (
 					<div>
 						{`${text} `}
-						<a href={url} rel="noopener noreferrer" target="_blank">
-							here
-						</a>
+						{url && (
+							<a href={url} rel="noopener noreferrer" target="_blank">
+								here
+							</a>
+						)}
 					</div>
 				);
 			}}
diff --git a/frontend/src/constants/dashboard.ts b/frontend/src/constants/dashboard.ts
new file mode 100644
index 0000000000..3aa495d6b8
--- /dev/null
+++ b/frontend/src/constants/dashboard.ts
@@ -0,0 +1,33 @@
+import { EAggregateOperator, EReduceOperator } from 'types/common/dashboard';
+
+export const PromQLQueryTemplate = {
+	query: '',
+	legend: '',
+	disabled: false,
+};
+
+export const ClickHouseQueryTemplate = {
+	rawQuery: '',
+	legend: '',
+	disabled: false,
+};
+
+export const QueryBuilderQueryTemplate = {
+	metricName: null,
+	aggregateOperator: EAggregateOperator.NOOP,
+	tagFilters: {
+		op: 'AND',
+		items: [],
+	},
+	legend: '',
+	disabled: false,
+	// Specific to TIME_SERIES type graph
+	groupBy: [],
+	// Specific to VALUE type graph
+	reduceTo: EReduceOperator['Latest of values in timeframe'],
+};
+
+export const QueryBuilderFormulaTemplate = {
+	expression: '',
+	disabled: false,
+};
diff --git a/frontend/src/container/GridGraphLayout/Graph/FullView/index.metricsBuilder.tsx b/frontend/src/container/GridGraphLayout/Graph/FullView/index.metricsBuilder.tsx
new file mode 100644
index 0000000000..8fe3b259c1
--- /dev/null
+++ b/frontend/src/container/GridGraphLayout/Graph/FullView/index.metricsBuilder.tsx
@@ -0,0 +1,132 @@
+import { Button, Typography } from 'antd';
+import { GraphOnClickHandler } from 'components/Graph';
+import Spinner from 'components/Spinner';
+import TimePreference from 'components/TimePreferenceDropDown';
+import GridGraphComponent from 'container/GridGraphComponent';
+import {
+	timeItems,
+	timePreferance,
+} from 'container/NewWidget/RightContainer/timeItems';
+import getChartData from 'lib/getChartData';
+import React, { useCallback, useState } from 'react';
+import { useQuery } from 'react-query';
+import { useSelector } from 'react-redux';
+import { GetMetricQueryRange } from 'store/actions/dashboard/getQueryResults';
+import { AppState } from 'store/reducers';
+import { ErrorResponse, SuccessResponse } from 'types/api';
+import { Widgets } from 'types/api/dashboard/getAll';
+import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
+import { GlobalReducer } from 'types/reducer/globalTime';
+
+import { NotFoundContainer, TimeContainer } from './styles';
+
+function FullView({
+	widget,
+	fullViewOptions = true,
+	onClickHandler,
+	name,
+	yAxisUnit,
+}: FullViewProps): JSX.Element {
+	const { selectedTime: globalSelectedTime } = useSelector<
+		AppState,
+		GlobalReducer
+	>((state) => state.globalTime);
+
+	const getSelectedTime = useCallback(
+		() =>
+			timeItems.find((e) => e.enum === (widget?.timePreferance || 'GLOBAL_TIME')),
+		[widget],
+	);
+
+	const [selectedTime, setSelectedTime] = useState<timePreferance>({
+		name: getSelectedTime()?.name || '',
+		enum: widget?.timePreferance || 'GLOBAL_TIME',
+	});
+	const response = useQuery<
+		SuccessResponse<MetricRangePayloadProps> | ErrorResponse
+	>(
+		`FullViewGetMetricsQueryRange-${selectedTime.enum}-${globalSelectedTime}`,
+		() =>
+			GetMetricQueryRange({
+				selectedTime: selectedTime.enum,
+				graphType: widget.panelTypes,
+				query: widget.query,
+				globalSelectedInterval: globalSelectedTime,
+			}),
+	);
+
+	const isError = response?.error;
+	const isLoading = response.isLoading === true;
+	const errorMessage = isError instanceof Error ? isError?.message : '';
+
+	if (isLoading) {
+		return <Spinner height="100%" size="large" tip="Loading..." />;
+	}
+	if (isError || !response?.data?.payload?.data?.result) {
+		return (
+			<NotFoundContainer>
+				<Typography>{errorMessage}</Typography>
+			</NotFoundContainer>
+		);
+	}
+
+	return (
+		<>
+			{fullViewOptions && (
+				<TimeContainer>
+					<TimePreference
+						{...{
+							selectedTime,
+							setSelectedTime,
+						}}
+					/>
+					<Button
+						onClick={(): void => {
+							response.refetch();
+						}}
+						type="primary"
+					>
+						Refresh
+					</Button>
+				</TimeContainer>
+			)}
+
+			<GridGraphComponent
+				{...{
+					GRAPH_TYPES: widget.panelTypes,
+					data: getChartData({
+						queryData: [
+							{
+								queryData: response.data?.payload?.data?.result
+									? response.data?.payload?.data?.result
+									: [],
+							},
+						],
+					}),
+					isStacked: widget.isStacked,
+					opacity: widget.opacity,
+					title: widget.title,
+					onClickHandler,
+					name,
+					yAxisUnit,
+				}}
+			/>
+		</>
+	);
+}
+
+interface FullViewProps {
+	widget: Widgets;
+	fullViewOptions?: boolean;
+	onClickHandler?: GraphOnClickHandler;
+	name: string;
+	yAxisUnit?: string;
+}
+
+FullView.defaultProps = {
+	fullViewOptions: undefined,
+	onClickHandler: undefined,
+	yAxisUnit: undefined,
+};
+
+export default FullView;
diff --git a/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx b/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx
index 3111e33e87..ad228f642e 100644
--- a/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx
+++ b/frontend/src/container/GridGraphLayout/Graph/FullView/index.tsx
@@ -19,7 +19,7 @@ import React, { useCallback, useState } from 'react';
 import { useQueries } from 'react-query';
 import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
-import { Widgets } from 'types/api/dashboard/getAll';
+import { PromQLWidgets } from 'types/api/dashboard/getAll';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
 import { NotFoundContainer, TimeContainer } from './styles';
@@ -173,7 +173,7 @@ function FullView({
 }
 
 interface FullViewProps {
-	widget: Widgets;
+	widget: PromQLWidgets;
 	fullViewOptions?: boolean;
 	onClickHandler?: GraphOnClickHandler;
 	name: string;
diff --git a/frontend/src/container/GridGraphLayout/Graph/index.tsx b/frontend/src/container/GridGraphLayout/Graph/index.tsx
index a57a396fd0..f39d64cb76 100644
--- a/frontend/src/container/GridGraphLayout/Graph/index.tsx
+++ b/frontend/src/container/GridGraphLayout/Graph/index.tsx
@@ -1,14 +1,12 @@
 import { Typography } from 'antd';
-import getQueryResult from 'api/widgets/getQuery';
+import { AxiosError } from 'axios';
+import { ChartData } from 'chart.js';
 import Spinner from 'components/Spinner';
 import GridGraphComponent from 'container/GridGraphComponent';
 import getChartData from 'lib/getChartData';
-import GetMaxMinTime from 'lib/getMaxMinTime';
-import GetStartAndEndTime from 'lib/getStartAndEndTime';
 import isEmpty from 'lodash-es/isEmpty';
-import React, { memo, useCallback, useState } from 'react';
+import React, { memo, useCallback, useEffect, useState } from 'react';
 import { Layout } from 'react-grid-layout';
-import { useQueries } from 'react-query';
 import { connect, useSelector } from 'react-redux';
 import { bindActionCreators, Dispatch } from 'redux';
 import { ThunkDispatch } from 'redux-thunk';
@@ -16,15 +14,17 @@ import {
 	DeleteWidget,
 	DeleteWidgetProps,
 } from 'store/actions/dashboard/deleteWidget';
+import { GetMetricQueryRange } from 'store/actions/dashboard/getQueryResults';
 import { AppState } from 'store/reducers';
 import AppActions from 'types/actions';
 import { GlobalTime } from 'types/actions/globalTime';
 import { Widgets } from 'types/api/dashboard/getAll';
+import { GlobalReducer } from 'types/reducer/globalTime';
 
 import { LayoutProps } from '..';
 import EmptyWidget from '../EmptyWidget';
 import WidgetHeader from '../WidgetHeader';
-import FullView from './FullView';
+import FullView from './FullView/index.metricsBuilder';
 import { ErrorContainer, FullViewContainer, Modal } from './styles';
 
 function GridCardGraph({
@@ -35,60 +35,118 @@ function GridCardGraph({
 	layout = [],
 	setLayout,
 }: GridCardGraphProps): JSX.Element {
+	const [state, setState] = useState<GridCardGraphState>({
+		loading: true,
+		errorMessage: '',
+		error: false,
+		payload: undefined,
+	});
 	const [hovered, setHovered] = useState(false);
 	const [modal, setModal] = useState(false);
+	const [deleteModal, setDeleteModal] = useState(false);
+
 	const { minTime, maxTime } = useSelector<AppState, GlobalTime>(
 		(state) => state.globalTime,
 	);
-	const [deleteModal, setDeleteModal] = useState(false);
+	const { selectedTime: globalSelectedInterval } = useSelector<
+		AppState,
+		GlobalReducer
+	>((state) => state.globalTime);
 
-	const getMaxMinTime = GetMaxMinTime({
-		graphType: widget?.panelTypes,
-		maxTime,
-		minTime,
-	});
+	// const getMaxMinTime = GetMaxMinTime({
+	// 	graphType: widget?.panelTypes,
+	// 	maxTime,
+	// 	minTime,
+	// });
 
-	const { start, end } = GetStartAndEndTime({
-		type: widget?.timePreferance,
-		maxTime: getMaxMinTime.maxTime,
-		minTime: getMaxMinTime.minTime,
-	});
+	// const { start, end } = GetStartAndEndTime({
+	// 	type: widget?.timePreferance,
+	// 	maxTime: getMaxMinTime.maxTime,
+	// 	minTime: getMaxMinTime.minTime,
+	// });
 
-	const queryLength = widget?.query?.filter((e) => e.query.length !== 0) || [];
+	// const queryLength = widget?.query?.filter((e) => e.query.length !== 0) || [];
 
-	const response = useQueries(
-		queryLength?.map((query) => {
-			return {
-				// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
-				queryFn: () => {
-					return getQueryResult({
-						end,
-						query: query?.query,
-						start,
-						step: '60',
+	// const response = useQueries(
+	// 	queryLength?.map((query) => {
+	// 		return {
+	// 			// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
+	// 			queryFn: () => {
+	// 				return getQueryResult({
+	// 					end,
+	// 					query: query?.query,
+	// 					start,
+	// 					step: '60',
+	// 				});
+	// 			},
+	// 			queryHash: `${query?.query}-${query?.legend}-${start}-${end}`,
+	// 			retryOnMount: false,
+	// 		};
+	// 	}),
+	// );
+
+	// const isError =
+	// 	response.find((e) => e?.data?.statusCode !== 200) !== undefined ||
+	// 	response.some((e) => e.isError === true);
+
+	// const isLoading = response.some((e) => e.isLoading === true);
+
+	// const errorMessage = response.find((e) => e.data?.error !== null)?.data?.error;
+
+	// const data = response.map((responseOfQuery) =>
+	// 	responseOfQuery?.data?.payload?.result.map((e, index) => ({
+	// 		query: queryLength[index]?.query,
+	// 		queryData: e,
+	// 		legend: queryLength[index]?.legend,
+	// 	})),
+	// );
+
+	useEffect(() => {
+		(async (): Promise<void> => {
+			try {
+				const response = await GetMetricQueryRange({
+					selectedTime: widget.timePreferance,
+					graphType: widget.panelTypes,
+					query: widget.query,
+					globalSelectedInterval,
+				});
+
+				const isError = response.error;
+
+				if (isError != null) {
+					setState((state) => ({
+						...state,
+						error: true,
+						errorMessage: isError || 'Something went wrong',
+						loading: false,
+					}));
+				} else {
+					const chartDataSet = getChartData({
+						queryData: [
+							{
+								queryData: response.payload?.data?.result
+									? response.payload?.data?.result
+									: [],
+							},
+						],
 					});
-				},
-				queryHash: `${query?.query}-${query?.legend}-${start}-${end}`,
-				retryOnMount: false,
-			};
-		}),
-	);
 
-	const isError =
-		response.find((e) => e?.data?.statusCode !== 200) !== undefined ||
-		response.some((e) => e.isError === true);
-
-	const isLoading = response.some((e) => e.isLoading === true);
-
-	const errorMessage = response.find((e) => e.data?.error !== null)?.data?.error;
-
-	const data = response.map((responseOfQuery) =>
-		responseOfQuery?.data?.payload?.result.map((e, index) => ({
-			query: queryLength[index]?.query,
-			queryData: e,
-			legend: queryLength[index]?.legend,
-		})),
-	);
+					setState((state) => ({
+						...state,
+						loading: false,
+						payload: chartDataSet,
+					}));
+				}
+			} catch (error) {
+				setState((state) => ({
+					...state,
+					error: true,
+					errorMessage: (error as AxiosError).toString(),
+					loading: false,
+				}));
+			}
+		})();
+	}, [widget, maxTime, minTime, globalSelectedInterval]);
 
 	const onToggleModal = useCallback(
 		(func: React.Dispatch<React.SetStateAction<boolean>>) => {
@@ -144,14 +202,7 @@ function GridCardGraph({
 
 	const isEmptyLayout = widget?.id === 'empty' || isEmpty(widget);
 
-	if (isLoading) {
-		return <Spinner height="20vh" tip="Loading..." />;
-	}
-
-	if (
-		(isError || data === undefined || data[0] === undefined) &&
-		!isEmptyLayout
-	) {
+	if (state.error && !isEmptyLayout) {
 		return (
 			<>
 				{getModals()}
@@ -163,18 +214,17 @@ function GridCardGraph({
 					onDelete={(): void => onToggleModal(setDeleteModal)}
 				/>
 
-				<ErrorContainer>{errorMessage}</ErrorContainer>
+				<ErrorContainer>{state.errorMessage}</ErrorContainer>
 			</>
 		);
 	}
 
-	const chartData = getChartData({
-		queryData: data.map((e) => ({
-			query: e?.map((e) => e.query).join(' ') || '',
-			queryData: e?.map((e) => e.queryData) || [],
-			legend: e?.map((e) => e.legend).join('') || '',
-		})),
-	});
+	if (
+		(state.loading === true || state.payload === undefined) &&
+		!isEmptyLayout
+	) {
+		return <Spinner height="20vh" tip="Loading..." />;
+	}
 
 	return (
 		<span
@@ -203,11 +253,11 @@ function GridCardGraph({
 
 			{!isEmptyLayout && getModals()}
 
-			{!isEmpty(widget) && (
+			{!isEmpty(widget) && !!state.payload && (
 				<GridGraphComponent
 					{...{
 						GRAPH_TYPES: widget.panelTypes,
-						data: chartData,
+						data: state.payload,
 						isStacked: widget.isStacked,
 						opacity: widget.opacity,
 						title: ' ', // empty title to accommodate absolutely positioned widget header
@@ -222,6 +272,13 @@ function GridCardGraph({
 	);
 }
 
+interface GridCardGraphState {
+	loading: boolean;
+	error: boolean;
+	errorMessage: string;
+	payload: ChartData | undefined;
+}
+
 interface DispatchProps {
 	deleteWidget: ({
 		widgetId,
diff --git a/frontend/src/container/GridGraphLayout/utils.ts b/frontend/src/container/GridGraphLayout/utils.ts
index 67b854368c..c2c762e1f7 100644
--- a/frontend/src/container/GridGraphLayout/utils.ts
+++ b/frontend/src/container/GridGraphLayout/utils.ts
@@ -1,9 +1,16 @@
 import { notification } from 'antd';
 import updateDashboardApi from 'api/dashboard/update';
+import {
+	ClickHouseQueryTemplate,
+	PromQLQueryTemplate,
+	QueryBuilderQueryTemplate,
+} from 'constants/dashboard';
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
+import GetQueryName from 'lib/query/GetQueryName';
 import { Layout } from 'react-grid-layout';
 import store from 'store';
 import { Dashboard } from 'types/api/dashboard/getAll';
+import { EQueryType } from 'types/common/dashboard';
 
 export const UpdateDashboard = async ({
 	data,
@@ -29,12 +36,31 @@ export const UpdateDashboard = async ({
 					nullZeroValues: '',
 					opacity: '',
 					panelTypes: graphType,
-					query: [
-						{
-							query: '',
-							legend: '',
+					queryType: 0,
+					query: {
+						queryType: EQueryType.QUERY_BUILDER,
+						promQL: [
+							{
+								name: GetQueryName([]),
+								...PromQLQueryTemplate,
+							},
+						],
+						clickHouse: [
+							{
+								name: GetQueryName([]),
+								...ClickHouseQueryTemplate,
+							},
+						],
+						metricsBuilder: {
+							formulas: [],
+							queryBuilder: [
+								{
+									name: GetQueryName([]),
+									...QueryBuilderQueryTemplate,
+								},
+							],
 						},
-					],
+					},
 					queryData: {
 						data: [],
 						error: false,
diff --git a/frontend/src/container/MetricsApplication/ResourceAttributesFilter/utils.ts b/frontend/src/container/MetricsApplication/ResourceAttributesFilter/utils.ts
index e8dd7bb503..aa16f160ac 100644
--- a/frontend/src/container/MetricsApplication/ResourceAttributesFilter/utils.ts
+++ b/frontend/src/container/MetricsApplication/ResourceAttributesFilter/utils.ts
@@ -21,7 +21,10 @@ export const GetTagKeys = async (): Promise<IOption[]> => {
 	// 		resolve(TagKeysCache);
 	// 	});
 	// }
-	const { payload } = await getResourceAttributesTagKeys();
+	const { payload } = await getResourceAttributesTagKeys({
+		metricName: 'signoz_calls_total',
+		match: 'resource_',
+	});
 	if (!payload || !payload?.data) {
 		return [];
 	}
@@ -32,12 +35,15 @@ export const GetTagKeys = async (): Promise<IOption[]> => {
 };
 
 export const GetTagValues = async (tagKey: string): Promise<IOption[]> => {
-	const { payload } = await getResourceAttributesTagValues(tagKey);
+	const { payload } = await getResourceAttributesTagValues({
+		tagKey,
+		metricName: 'signoz_calls_total',
+	});
 
 	if (!payload || !payload?.data) {
 		return [];
 	}
-	return payload.data.filter(Boolean).map((tagValue: string) => ({
+	return payload.data.map((tagValue: string) => ({
 		label: tagValue,
 		value: tagValue,
 	}));
diff --git a/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx b/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx
index ba0af031cd..b5466f2b02 100644
--- a/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx
+++ b/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx
@@ -4,7 +4,7 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import { AppState } from 'store/reducers';
-import { Widgets } from 'types/api/dashboard/getAll';
+import { PromQLWidgets, Widgets } from 'types/api/dashboard/getAll';
 import MetricReducer from 'types/reducer/metrics';
 
 import { Card, GraphContainer, GraphTitle, Row } from '../styles';
@@ -58,7 +58,7 @@ function DBCall({ getWidget }: DBCallProps): JSX.Element {
 }
 
 interface DBCallProps {
-	getWidget: (query: Widgets['query']) => Widgets;
+	getWidget: (query: PromQLWidgets['query']) => PromQLWidgets;
 }
 
 export default DBCall;
diff --git a/frontend/src/container/MetricsApplication/Tabs/External.tsx b/frontend/src/container/MetricsApplication/Tabs/External.tsx
index 73eca09600..2974ba3f38 100644
--- a/frontend/src/container/MetricsApplication/Tabs/External.tsx
+++ b/frontend/src/container/MetricsApplication/Tabs/External.tsx
@@ -4,7 +4,7 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import { AppState } from 'store/reducers';
-import { Widgets } from 'types/api/dashboard/getAll';
+import { PromQLWidgets } from 'types/api/dashboard/getAll';
 import MetricReducer from 'types/reducer/metrics';
 
 import { Card, GraphContainer, GraphTitle, Row } from '../styles';
@@ -102,7 +102,7 @@ function External({ getWidget }: ExternalProps): JSX.Element {
 }
 
 interface ExternalProps {
-	getWidget: (query: Widgets['query']) => Widgets;
+	getWidget: (query: PromQLWidgets['query']) => PromQLWidgets;
 }
 
 export default External;
diff --git a/frontend/src/container/MetricsApplication/Tabs/Overview.tsx b/frontend/src/container/MetricsApplication/Tabs/Overview.tsx
index fbc1a855ac..a24e67aeb7 100644
--- a/frontend/src/container/MetricsApplication/Tabs/Overview.tsx
+++ b/frontend/src/container/MetricsApplication/Tabs/Overview.tsx
@@ -11,7 +11,7 @@ import React, { useRef } from 'react';
 import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import { AppState } from 'store/reducers';
-import { Widgets } from 'types/api/dashboard/getAll';
+import { PromQLWidgets } from 'types/api/dashboard/getAll';
 import MetricReducer from 'types/reducer/metrics';
 
 import { Card, Col, GraphContainer, GraphTitle, Row } from '../styles';
@@ -42,8 +42,7 @@ function Application({ getWidget }: DashboardProps): JSX.Element {
 		urlParams.set(METRICS_PAGE_QUERY_PARAM.endTime, tPlusOne.toString());
 
 		history.replace(
-			`${
-				ROUTES.TRACE
+			`${ROUTES.TRACE
 			}?${urlParams.toString()}&selected={"serviceName":["${servicename}"]}&filterToFetchData=["duration","status","serviceName"]&spanAggregateCurrentPage=1&selectedTags=${selectedTraceTags}&&isFilterExclude={"serviceName":false}&userSelectedFilter={"status":["error","ok"],"serviceName":["${servicename}"]}&spanAggregateCurrentPage=1&spanAggregateOrder=ascend`,
 		);
 	};
@@ -94,8 +93,7 @@ function Application({ getWidget }: DashboardProps): JSX.Element {
 		urlParams.set(METRICS_PAGE_QUERY_PARAM.endTime, tPlusOne.toString());
 
 		history.replace(
-			`${
-				ROUTES.TRACE
+			`${ROUTES.TRACE
 			}?${urlParams.toString()}?selected={"serviceName":["${servicename}"],"status":["error"]}&filterToFetchData=["duration","status","serviceName"]&spanAggregateCurrentPage=1&selectedTags=${selectedTraceTags}&isFilterExclude={"serviceName":false,"status":false}&userSelectedFilter={"serviceName":["${servicename}"],"status":["error"]}&spanAggregateCurrentPage=1&spanAggregateOrder=ascend`,
 		);
 	};
@@ -248,7 +246,7 @@ function Application({ getWidget }: DashboardProps): JSX.Element {
 }
 
 interface DashboardProps {
-	getWidget: (query: Widgets['query']) => Widgets;
+	getWidget: (query: PromQLWidgets['query']) => PromQLWidgets;
 }
 
 export default Application;
diff --git a/frontend/src/container/MetricsApplication/index.tsx b/frontend/src/container/MetricsApplication/index.tsx
index 9922fbb8c2..aeaf4a5664 100644
--- a/frontend/src/container/MetricsApplication/index.tsx
+++ b/frontend/src/container/MetricsApplication/index.tsx
@@ -3,14 +3,14 @@ import ROUTES from 'constants/routes';
 import React from 'react';
 import { generatePath, useParams } from 'react-router-dom';
 import { useLocation } from 'react-use';
-import { Widgets } from 'types/api/dashboard/getAll';
+import { PromQLWidgets } from 'types/api/dashboard/getAll';
 
 import ResourceAttributesFilter from './ResourceAttributesFilter';
 import DBCall from './Tabs/DBCall';
 import External from './Tabs/External';
 import Overview from './Tabs/Overview';
 
-const getWidget = (query: Widgets['query']): Widgets => {
+const getWidget = (query: PromQLWidgets['query']): PromQLWidgets => {
 	return {
 		description: '',
 		id: '',
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx
deleted file mode 100644
index 916771eece..0000000000
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/Query.tsx
+++ /dev/null
@@ -1,151 +0,0 @@
-import { Button, Divider } from 'antd';
-import Input from 'components/Input';
-import TextToolTip from 'components/TextToolTip';
-import { timePreferance } from 'container/NewWidget/RightContainer/timeItems';
-import React, { useCallback, useMemo, useState } from 'react';
-import { connect, useSelector } from 'react-redux';
-import { useLocation } from 'react-router-dom';
-import { bindActionCreators, Dispatch } from 'redux';
-import { ThunkDispatch } from 'redux-thunk';
-import { DeleteQuery } from 'store/actions';
-import {
-	UpdateQuery,
-	UpdateQueryProps,
-} from 'store/actions/dashboard/updateQuery';
-import { AppState } from 'store/reducers';
-import AppActions from 'types/actions';
-import { DeleteQueryProps } from 'types/actions/dashboard';
-import { Widgets } from 'types/api/dashboard/getAll';
-import DashboardReducer from 'types/reducer/dashboards';
-
-import {
-	ButtonContainer,
-	Container,
-	InputContainer,
-	QueryWrapper,
-} from './styles';
-
-function Query({
-	currentIndex,
-	preLegend,
-	preQuery,
-	updateQuery,
-	deleteQuery,
-}: QueryProps): JSX.Element {
-	const [promqlQuery, setPromqlQuery] = useState(preQuery);
-	const [legendFormat, setLegendFormat] = useState(preLegend);
-	const { search } = useLocation();
-	const { dashboards } = useSelector<AppState, DashboardReducer>(
-		(state) => state.dashboards,
-	);
-
-	const [selectedDashboards] = dashboards;
-	const { widgets } = selectedDashboards.data;
-
-	const query = new URLSearchParams(search);
-	const widgetId = query.get('widgetId') || '';
-
-	const urlQuery = useMemo(() => {
-		return new URLSearchParams(search);
-	}, [search]);
-
-	const getWidget = useCallback(() => {
-		const widgetId = urlQuery.get('widgetId');
-		return widgets?.find((e) => e.id === widgetId);
-	}, [widgets, urlQuery]);
-
-	const selectedWidget = getWidget() as Widgets;
-
-	const onChangeHandler = useCallback(
-		(setFunc: React.Dispatch<React.SetStateAction<string>>, value: string) => {
-			setFunc(value);
-		},
-		[],
-	);
-
-	const onBlurHandler = (): void => {
-		updateQuery({
-			currentIndex,
-			legend: legendFormat,
-			query: promqlQuery,
-			widgetId,
-			yAxisUnit: selectedWidget.yAxisUnit,
-		});
-	};
-
-	const onDeleteQueryHandler = (): void => {
-		deleteQuery({
-			widgetId,
-			currentIndex,
-		});
-	};
-
-	return (
-		<>
-			<Container>
-				<QueryWrapper>
-					<InputContainer>
-						<Input
-							onChangeHandler={(event): void =>
-								onChangeHandler(setPromqlQuery, event.target.value)
-							}
-							size="middle"
-							value={promqlQuery}
-							addonBefore="PromQL Query"
-							onBlur={(): void => onBlurHandler()}
-						/>
-					</InputContainer>
-
-					<InputContainer>
-						<Input
-							onChangeHandler={(event): void =>
-								onChangeHandler(setLegendFormat, event.target.value)
-							}
-							size="middle"
-							value={legendFormat}
-							addonBefore="Legend Format"
-							onBlur={(): void => onBlurHandler()}
-						/>
-					</InputContainer>
-				</QueryWrapper>
-
-				<ButtonContainer>
-					<Button onClick={onDeleteQueryHandler}>Delete</Button>
-					<TextToolTip
-						{...{
-							text: `More details on how to plot metrics graphs`,
-							url: 'https://signoz.io/docs/userguide/send-metrics/#related-videos',
-						}}
-					/>
-				</ButtonContainer>
-			</Container>
-
-			<Divider />
-		</>
-	);
-}
-
-interface DispatchProps {
-	updateQuery: (
-		props: UpdateQueryProps,
-	) => (dispatch: Dispatch<AppActions>) => void;
-	deleteQuery: (
-		props: DeleteQueryProps,
-	) => (dispatch: Dispatch<AppActions>) => void;
-}
-
-const mapDispatchToProps = (
-	dispatch: ThunkDispatch<unknown, unknown, AppActions>,
-): DispatchProps => ({
-	updateQuery: bindActionCreators(UpdateQuery, dispatch),
-	deleteQuery: bindActionCreators(DeleteQuery, dispatch),
-});
-
-interface QueryProps extends DispatchProps {
-	selectedTime: timePreferance;
-	currentIndex: number;
-	preQuery: string;
-	preLegend: string;
-}
-
-export default connect(null, mapDispatchToProps)(Query);
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts
new file mode 100644
index 0000000000..80a14f173b
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts
@@ -0,0 +1,20 @@
+import { EAggregateOperator } from 'types/common/dashboard';
+
+export const AggregateFunctions = Object.keys(EAggregateOperator)
+	.filter((key) => Number.isNaN(parseInt(key, 10)))
+	.map((key) => {
+		return {
+			label: key,
+			value: EAggregateOperator[key],
+		};
+	});
+
+export const TagKeyOperator = [
+	{ label: 'In', value: 'IN' },
+	{ label: 'Not In', value: 'NIN' },
+	{ label: 'Like', value: 'LIKE' },
+	{ label: 'Not Like', value: 'NLIKE' },
+	// { label: 'Equal', value: 'EQ' },
+	// { label: 'Not Equal', value: 'NEQ' },
+	// { label: 'REGEX', value: 'REGEX' },
+];
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx
new file mode 100644
index 0000000000..9164c532af
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx
@@ -0,0 +1,46 @@
+import {
+	DeleteOutlined,
+	DownOutlined,
+	EyeFilled,
+	EyeInvisibleFilled,
+	RightOutlined,
+} from '@ant-design/icons';
+import { Button, Row } from 'antd';
+import React, { useState } from 'react';
+
+import { QueryWrapper } from '../styles';
+
+function QueryHeader({
+	disabled,
+	onDisable,
+	name,
+	onDelete,
+	children,
+}): JSX.Element {
+	const [collapse, setCollapse] = useState(false);
+	return (
+		<QueryWrapper>
+			<Row style={{ justifyContent: 'space-between' }}>
+				<Row>
+					<Button
+						type="ghost"
+						icon={disabled ? <EyeInvisibleFilled /> : <EyeFilled />}
+						onClick={onDisable}
+					>
+						{name}
+					</Button>
+					<Button
+						type="ghost"
+						icon={collapse ? <RightOutlined /> : <DownOutlined />}
+						onClick={(): void => setCollapse(!collapse)}
+					/>
+				</Row>
+
+				<Button type="ghost" danger icon={<DeleteOutlined />} onClick={onDelete} />
+			</Row>
+			{!collapse && children}
+		</QueryWrapper>
+	);
+}
+
+export default QueryHeader;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx
new file mode 100644
index 0000000000..cabd7470b8
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx
@@ -0,0 +1,69 @@
+import { PlusOutlined } from '@ant-design/icons';
+import { ClickHouseQueryTemplate } from 'constants/dashboard';
+import GetQueryName from 'lib/query/GetQueryName';
+import React from 'react';
+
+import { WIDGET_CLICKHOUSE_QUERY_KEY_NAME } from '../../constants';
+import { QueryButton } from '../../styles';
+import ClickHouseQueryBuilder from './query';
+
+function ClickHouseQueryContainer({
+	queryData,
+	updateQueryData,
+	clickHouseQueries,
+}): JSX.Element | null {
+	const handleClickHouseQueryChange = ({
+		queryIndex,
+		rawQuery,
+		legend,
+		toggleDisable,
+		toggleDelete,
+	}): void => {
+		const allQueries = queryData[WIDGET_CLICKHOUSE_QUERY_KEY_NAME];
+		const currentIndexQuery = allQueries[queryIndex];
+
+		if (rawQuery !== undefined) {
+			currentIndexQuery.rawQuery = rawQuery;
+		}
+
+		if (legend !== undefined) {
+			currentIndexQuery.legend = legend;
+		}
+
+		if (toggleDisable) {
+			currentIndexQuery.disabled = !currentIndexQuery.disabled;
+		}
+		if (toggleDelete) {
+			allQueries.splice(queryIndex, 1);
+		}
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+	const addQueryHandler = (): void => {
+		queryData[WIDGET_CLICKHOUSE_QUERY_KEY_NAME].push({
+			name: GetQueryName(queryData[WIDGET_CLICKHOUSE_QUERY_KEY_NAME]),
+			...ClickHouseQueryTemplate,
+		});
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+
+	if (!clickHouseQueries) {
+		return null;
+	}
+	return (
+		<>
+			{clickHouseQueries.map((q, idx) => (
+				<ClickHouseQueryBuilder
+					key={q.name}
+					queryIndex={idx}
+					queryData={q}
+					handleQueryChange={handleClickHouseQueryChange}
+				/>
+			))}
+			<QueryButton onClick={addQueryHandler} icon={<PlusOutlined />}>
+				Query
+			</QueryButton>
+		</>
+	);
+}
+
+export default ClickHouseQueryContainer;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx
new file mode 100644
index 0000000000..f51ffbf08b
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx
@@ -0,0 +1,53 @@
+import { Input } from 'antd';
+import MonacoEditor from 'components/Editor';
+import React from 'react';
+
+import QueryHeader from '../QueryHeader';
+
+function ClickHouseQueryBuilder({
+	queryData,
+	queryIndex,
+	handleQueryChange,
+}): JSX.Element | null {
+	if (queryData === undefined) {
+		return null;
+	}
+
+	return (
+		<QueryHeader
+			name={queryData.name}
+			disabled={queryData.disabled}
+			onDisable={(): void =>
+				handleQueryChange({ queryIndex, toggleDisable: true })
+			}
+			onDelete={(): void => {
+				handleQueryChange({ queryIndex, toggleDelete: true });
+			}}
+		>
+			<MonacoEditor
+				language="sql"
+				theme="vs-dark"
+				height="200px"
+				onChange={(value): void =>
+					handleQueryChange({ queryIndex, rawQuery: value })
+				}
+				value={queryData.rawQuery}
+				options={{
+					scrollbar: {
+						alwaysConsumeMouseWheel: false,
+					},
+				}}
+			/>
+			<Input
+				onChange={(event): void =>
+					handleQueryChange({ queryIndex, legend: event.target.value })
+				}
+				size="middle"
+				defaultValue={queryData.legend}
+				addonBefore="Legend Format"
+			/>
+		</QueryHeader>
+	);
+}
+
+export default ClickHouseQueryBuilder;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx
new file mode 100644
index 0000000000..ba01fb0389
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx
@@ -0,0 +1,95 @@
+import {
+	DeleteOutlined,
+	DownOutlined,
+	EyeFilled,
+	RightOutlined,
+} from '@ant-design/icons';
+import { Button, Row } from 'antd';
+import MonacoEditor from 'components/Editor';
+import React, { useState } from 'react';
+import { useSelector } from 'react-redux';
+import { AppState } from 'store/reducers';
+import AppReducer from 'types/reducer/app';
+
+import { QueryBuilderWrapper, QueryWrapper } from '../styles';
+import { TQueryCategories } from '../types';
+import PromQLQueryBuilder from './promQL/promQL';
+import MetricsBuilder from './queryBuilder/query';
+
+function QueryBuilder({
+	name,
+	onDelete,
+	queryCategory,
+	queryData,
+	updateQueryData,
+}: QueryBuilderProps): JSX.Element {
+	const { isDarkMode } = useSelector<AppState, AppReducer>((state) => state.app);
+	const [hideFromUI, setHideFromUI] = useState<boolean>(false);
+	const handleHideFromUI = (): void => {
+		setHideFromUI(!hideFromUI);
+	};
+	const handleClickhouseQueryChange = (clickHouseQuery): void => {
+		if (clickHouseQuery !== null) {
+			queryData.clickHouseQuery = clickHouseQuery;
+		}
+		updateQueryData(queryData);
+	};
+	const handlePromQLQueryChange = ({ query, legend }): void => {
+		if (query) queryData.promQL.query = query;
+		if (legend) queryData.promQL.legend = legend;
+
+		updateQueryData(queryData);
+	};
+
+	return (
+		<QueryWrapper>
+			<Row style={{ justifyContent: 'space-between' }}>
+				<Row>
+					<Button type="ghost" icon={<EyeFilled />}>
+						{name}
+					</Button>
+					<Button
+						type="ghost"
+						icon={hideFromUI ? <RightOutlined /> : <DownOutlined />}
+						onClick={handleHideFromUI}
+					/>
+				</Row>
+
+				<Button type="ghost" danger icon={<DeleteOutlined />} onClick={onDelete} />
+			</Row>
+			{!hideFromUI && (
+				<QueryBuilderWrapper isDarkMode={isDarkMode}>
+					{queryCategory === 0 ? (
+						<MetricsBuilder
+							queryData={queryData}
+							updateQueryData={updateQueryData}
+							metricName={queryData.queryBuilder.metricName}
+						/>
+					) : queryCategory === 1 ? (
+						<MonacoEditor
+							language="sql"
+							theme="vs-dark"
+							height="200px"
+							onChange={handleClickhouseQueryChange}
+							value={queryData.clickHouseQuery}
+							// options={options}
+						/>
+					) : queryCategory === 2 ? (
+						<PromQLQueryBuilder
+							query={queryData.promQL.query}
+							onQueryChange={(value) => handlePromQLQueryChange({ query: value })}
+							legend={queryData.promQL.legend}
+							onLegendChange={(value) => handlePromQLQueryChange({ legend: value })}
+						/>
+					) : null}
+				</QueryBuilderWrapper>
+			)}
+		</QueryWrapper>
+	);
+}
+
+interface QueryBuilderProps {
+	queryCategory: TQueryCategories;
+	name: string;
+}
+export default QueryBuilder;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx
new file mode 100644
index 0000000000..58d8685a15
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx
@@ -0,0 +1,67 @@
+import { PlusOutlined } from '@ant-design/icons';
+import { PromQLQueryTemplate } from 'constants/dashboard';
+import GetQueryName from 'lib/query/GetQueryName';
+import React from 'react';
+
+import { WIDGET_PROMQL_QUERY_KEY_NAME } from '../../constants';
+import { QueryButton } from '../../styles';
+import PromQLQueryBuilder from './query';
+
+function PromQLQueryContainer({
+	queryData,
+	updateQueryData,
+	promQLQueries,
+	onQueryChange,
+	onQueryAdd,
+}): JSX.Element | null {
+	const handlePromQLQueryChange = ({
+		queryIndex,
+		query,
+		legend,
+		toggleDisable,
+		toggleDelete,
+	}): void => {
+		const allQueries = queryData[WIDGET_PROMQL_QUERY_KEY_NAME];
+		const currentIndexQuery = allQueries[queryIndex];
+		if (query) currentIndexQuery.query = query;
+		if (legend) currentIndexQuery.legend = legend;
+
+		if (toggleDisable) {
+			currentIndexQuery.disabled = !currentIndexQuery.disabled;
+		}
+		if (toggleDelete) {
+			allQueries.splice(queryIndex, 1);
+		}
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+	const addQueryHandler = (): void => {
+		queryData[WIDGET_PROMQL_QUERY_KEY_NAME].push({
+			name: GetQueryName(queryData[WIDGET_PROMQL_QUERY_KEY_NAME]),
+			...PromQLQueryTemplate,
+		});
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+
+	if (!promQLQueries) {
+		return null;
+	}
+	return (
+		<>
+			{promQLQueries.map(
+				(q, idx): JSX.Element => (
+					<PromQLQueryBuilder
+						key={q.name}
+						queryIndex={idx}
+						queryData={q}
+						handleQueryChange={handlePromQLQueryChange}
+					/>
+				),
+			)}
+			<QueryButton onClick={addQueryHandler} icon={<PlusOutlined />}>
+				Query
+			</QueryButton>
+		</>
+	);
+}
+
+export default PromQLQueryContainer;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx
new file mode 100644
index 0000000000..26c089b20b
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx
@@ -0,0 +1,45 @@
+import { Input } from 'antd';
+import React from 'react';
+
+import QueryHeader from '../QueryHeader';
+
+function PromQLQueryBuilder({
+	queryData,
+	queryIndex,
+	handleQueryChange,
+}): JSX.Element {
+	return (
+		<QueryHeader
+			name={queryData.name}
+			disabled={queryData.disabled}
+			onDisable={(): void =>
+				handleQueryChange({ queryIndex, toggleDisable: true })
+			}
+			onDelete={(): void => {
+				handleQueryChange({ queryIndex, toggleDelete: true });
+			}}
+		>
+			<Input
+				onChange={(event): void =>
+					handleQueryChange({ queryIndex, query: event.target.value })
+				}
+				size="middle"
+				defaultValue={queryData.query}
+				addonBefore="PromQL Query"
+				style={{ marginBottom: '0.5rem' }}
+			/>
+
+			<Input
+				onChange={(event): void =>
+					handleQueryChange({ queryIndex, legend: event.target.value })
+				}
+				size="middle"
+				defaultValue={queryData.legend}
+				addonBefore="Legend Format"
+				style={{ marginBottom: '0.5rem' }}
+			/>
+		</QueryHeader>
+	);
+}
+
+export default PromQLQueryBuilder;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.ts
new file mode 100644
index 0000000000..f082f4091f
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.ts
@@ -0,0 +1,61 @@
+import { createMachine } from 'xstate';
+
+export const ResourceAttributesFilterMachine =
+	/** @xstate-layout N4IgpgJg5mDOIC5QBECGsAWAjA9qgThAAQDKYBAxhkQIIB2xAYgJYA2ALmPgHQAqqUANJgAngGIAcgFEAGr0SgADjljN2zHHQUgAHogAcAFgAM3AOz6ATAEYAzJdsA2Y4cOWAnABoQIxAFpDR2tuQ319AFYTcKdbFycAX3jvNExcAmIySmp6JjZOHn4hUTFNACFWAFd8bWVVdU1tPQQzY1MXY2tDdzNHM3dHd0NvXwR7biMTa313S0i+63DE5PRsPEJScnwqWgYiFg4uPgFhcQAlKRIpeSQQWrUNLRumx3Czbg8TR0sbS31jfUcw38fW47gBHmm4XCVms3SWIBSq3SGyyO1yBx4AHlFFxUOwcPhJLJrkoVPcGk9ENYFuF3i5YR0wtEHECEAEgiEmV8zH1DLYzHZ4Yi0utMltsrt9vluNjcfjCWVKtUbnd6o9QE1rMYBtxbGFvsZ3NrZj1WdYOfotUZLX0XEFHEKViKMpttjk9nlDrL8HiCWJzpcSbcyWrGoh3NCQj0zK53P1ph1WeFLLqnJZ2s5vmZLA6kginWsXaj3VLDoUAGqoSpgEp0cpVGohh5hhDWDy0sz8zruakzamWVm-Qyg362V5-AZOayO1KFlHitEejFHKCV6v+i5XRt1ZuU1s52zjNOOaZfdOWIY+RDZ0Hc6ZmKEXqyLPPCudit2Sz08ACSEFYNbSHI27kuquiIOEjiONwjJgrM3RWJYZisgEIJgnYPTmuEdi2OaiR5nQOAQHA2hvsiH4Sui0qFCcIGhnuLSmP0YJuJ2xjJsmKELG8XZTK0tjdHG06vgW5GupRS7St6vrKqSO4UhqVL8TBWp8o4eqdl0A5Xmy3G6gK56-B4uERDOSKiuJi6lgUAhrhUYB0buimtrEKZBDYrxaS0OZca8+ltheybOI4hivGZzrzp+VGHH+AGOQp4EIHy+ghNYnawtG4TsbYvk8QKfHGAJfQ9uF76WSW37xWBTSGJ0qXpd0vRZdEKGPqC2YeO2-zfO4+HxEAA */
+	createMachine({
+		tsTypes: {} as import('./MetricTagKey.machine.typegen').Typegen0,
+		initial: 'Idle',
+		states: {
+			TagKey: {
+				on: {
+					NEXT: {
+						actions: 'onSelectOperator',
+						target: 'Operator',
+					},
+					onBlur: {
+						actions: 'onBlurPurge',
+						target: 'Idle',
+					},
+					RESET: {
+						target: 'Idle',
+					},
+				},
+			},
+			Operator: {
+				on: {
+					NEXT: {
+						actions: 'onSelectTagValue',
+						target: 'TagValue',
+					},
+					// onBlur: {
+					// 	actions: 'onBlurPurge',
+					// 	target: 'Idle',
+					// },
+					RESET: {
+						target: 'Idle',
+					},
+				},
+			},
+			TagValue: {
+				on: {
+					onBlur: {
+						actions: ['onValidateQuery'],
+						// target: 'Idle',
+					},
+					RESET: {
+						target: 'Idle',
+					},
+				},
+			},
+			Idle: {
+				on: {
+					NEXT: {
+						actions: 'onSelectTagKey',
+						description: 'Select Category',
+						target: 'TagKey',
+					},
+				},
+			},
+		},
+		id: 'Dashboard Search And Filter',
+	});
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.typegen.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.typegen.ts
new file mode 100644
index 0000000000..e7f7ee3de7
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/MetricTagKey.machine.typegen.ts
@@ -0,0 +1,32 @@
+// This file was automatically generated. Edits will be overwritten
+
+export interface Typegen0 {
+	'@@xstate/typegen': true;
+	eventsCausingActions: {
+		onSelectOperator: 'NEXT';
+		onBlurPurge: 'onBlur';
+		onSelectTagValue: 'NEXT';
+		onValidateQuery: 'onBlur';
+		onSelectTagKey: 'NEXT';
+	};
+	internalEvents: {
+		'xstate.init': { type: 'xstate.init' };
+	};
+	invokeSrcNameMap: {};
+	missingImplementations: {
+		actions:
+			| 'onSelectOperator'
+			| 'onBlurPurge'
+			| 'onSelectTagValue'
+			| 'onValidateQuery'
+			| 'onSelectTagKey';
+		services: never;
+		guards: never;
+		delays: never;
+	};
+	eventsCausingServices: {};
+	eventsCausingGuards: {};
+	eventsCausingDelays: {};
+	matchesStates: 'TagKey' | 'Operator' | 'TagValue' | 'Idle';
+	tags: never;
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx
new file mode 100644
index 0000000000..72da49ae49
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx
@@ -0,0 +1,31 @@
+import React from 'react';
+
+import { QueryChipContainer, QueryChipItem } from './styles';
+import { IMetricBuilderTagKeyQuery } from './types';
+
+interface IQueryChipProps {
+	queryData: IMetricBuilderTagKeyQuery;
+	onClose: (id: string) => void;
+	disabled: boolean;
+}
+
+export default function QueryChip({
+	queryData,
+	onClose,
+	disabled,
+}: IQueryChipProps): JSX.Element {
+	return (
+		<QueryChipContainer>
+			<QueryChipItem>{queryData.key}</QueryChipItem>
+			<QueryChipItem>{queryData.op}</QueryChipItem>
+			<QueryChipItem
+				closable={!disabled}
+				onClose={(): void => {
+					if (!disabled) onClose(queryData.id);
+				}}
+			>
+				{queryData.value.join(', ')}
+			</QueryChipItem>
+		</QueryChipContainer>
+	);
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx
new file mode 100644
index 0000000000..ee58974549
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx
@@ -0,0 +1,211 @@
+import { CloseCircleFilled } from '@ant-design/icons';
+import { useMachine } from '@xstate/react';
+import { Button, Select, Spin } from 'antd';
+import { map } from 'lodash-es';
+import React, { useCallback, useEffect, useState } from 'react';
+import { useSelector } from 'react-redux';
+import { AppState } from 'store/reducers';
+import AppReducer from 'types/reducer/app';
+import { v4 as uuid } from 'uuid';
+
+import { ResourceAttributesFilterMachine } from './MetricTagKey.machine';
+import QueryChip from './QueryChip';
+import { QueryChipItem, SearchContainer } from './styles';
+import { IMetricBuilderTagKeyQuery, IOption } from './types';
+import {
+	createQuery,
+	GetTagKeys,
+	GetTagValues,
+	OperatorSchema,
+	SingleValueOperators,
+} from './utils';
+
+function MetricTagKeyFilter({
+	metricName,
+	onSetQuery,
+	selectedTagFilters: selectedTagQueries,
+}): JSX.Element | null {
+	const { isDarkMode } = useSelector<AppState, AppReducer>((state) => state.app);
+	const [loading, setLoading] = useState(true);
+	const [selectedValues, setSelectedValues] = useState<string[]>([]);
+	const [staging, setStaging] = useState<string[]>([]);
+	const [queries, setQueries] = useState<IMetricBuilderTagKeyQuery[]>([]);
+	const [optionsData, setOptionsData] = useState<{
+		mode: undefined | 'tags' | 'multiple';
+		options: IOption[];
+	}>({
+		mode: undefined,
+		options: [],
+	});
+
+	const dispatchQueries = (
+		updatedQueries: IMetricBuilderTagKeyQuery[],
+	): void => {
+		onSetQuery(updatedQueries);
+		setQueries(updatedQueries);
+	};
+	const handleLoading = (isLoading: boolean): void => {
+		setLoading(isLoading);
+		if (isLoading) {
+			setOptionsData({ mode: undefined, options: [] });
+		}
+	};
+	const [state, send] = useMachine(ResourceAttributesFilterMachine, {
+		actions: {
+			onSelectTagKey: () => {
+				handleLoading(true);
+				GetTagKeys(metricName)
+					.then((tagKeys) => setOptionsData({ options: tagKeys, mode: undefined }))
+					.finally(() => {
+						handleLoading(false);
+					});
+			},
+			onSelectOperator: () => {
+				setOptionsData({ options: OperatorSchema, mode: undefined });
+			},
+			onSelectTagValue: () => {
+				handleLoading(true);
+
+				GetTagValues(staging[0], metricName)
+					.then((tagValuesOptions) =>
+						setOptionsData({ options: tagValuesOptions, mode: 'tags' }),
+					)
+					.finally(() => {
+						handleLoading(false);
+					});
+			},
+			onBlurPurge: () => {
+				setSelectedValues([]);
+				setStaging([]);
+			},
+			onValidateQuery: (): void => {
+				if (staging.length < 2 || selectedValues.length === 0) {
+					return;
+				}
+
+				const generatedQuery = createQuery([...staging, selectedValues]);
+
+				if (generatedQuery) {
+					dispatchQueries([...queries, generatedQuery]);
+					setSelectedValues([]);
+					setStaging([]);
+					send('RESET');
+				}
+			},
+		},
+	});
+
+	useEffect(() => {
+		setQueries(selectedTagQueries);
+	}, [selectedTagQueries]);
+
+	const handleFocus = (): void => {
+		if (state.value === 'Idle') {
+			send('NEXT');
+		}
+	};
+
+	const handleBlur = useCallback((): void => {
+		send('onBlur');
+	}, [send]);
+
+	useEffect(() => {
+		handleBlur();
+	}, [handleBlur, metricName]);
+
+	const handleChange = (value: never): void => {
+		if (!optionsData.mode) {
+			setStaging((prevStaging) => [...prevStaging, value]);
+			setSelectedValues([]);
+			send('NEXT');
+			return;
+		}
+		if (
+			state.value === 'TagValue' &&
+			SingleValueOperators.includes(staging[staging.length - 1])
+		) {
+			setSelectedValues([value[value.length - 1]]);
+			return;
+		}
+
+		setSelectedValues([...value]);
+	};
+
+	const handleClose = (id: string): void => {
+		dispatchQueries(queries.filter((queryData) => queryData.id !== id));
+	};
+
+	const handleClearAll = (): void => {
+		send('RESET');
+		dispatchQueries([]);
+		setStaging([]);
+		setSelectedValues([]);
+	};
+
+	const disabledOrEmpty = !!(
+		queries.length ||
+		staging.length ||
+		selectedValues.length
+	);
+
+	return (
+		<SearchContainer isDarkMode={isDarkMode}>
+			<div style={{ display: 'inline-flex', flexWrap: 'wrap' }}>
+				{queries.length > 0 &&
+					map(
+						queries,
+						(query): JSX.Element => {
+							return (
+								<QueryChip key={query.id} queryData={query} onClose={handleClose} />
+							);
+						},
+					)}
+			</div>
+			<div>
+				{map(staging, (item, idx) => {
+					return <QueryChipItem key={uuid()}>{item}</QueryChipItem>;
+				})}
+			</div>
+
+			<div style={{ display: 'flex', width: '100%' }}>
+				<Select
+					disabled={!metricName}
+					placeholder={`Select ${
+						state.value === 'Idle' ? 'Tag Key Pair' : state.value
+					}`}
+					onChange={handleChange}
+					bordered={false}
+					value={selectedValues as never}
+					style={{ flex: 1 }}
+					options={optionsData.options}
+					mode={optionsData?.mode}
+					showArrow={false}
+					onFocus={handleFocus}
+					onBlur={handleBlur}
+					notFoundContent={
+						loading ? (
+							<span>
+								<Spin size="small" /> Loading...{' '}
+							</span>
+						) : (
+							<span>
+								No resource attributes available to filter. Please refer docs to send
+								attributes.
+							</span>
+						)
+					}
+				/>
+
+				{queries.length || staging.length || selectedValues.length ? (
+					<Button
+						onClick={handleClearAll}
+						icon={<CloseCircleFilled />}
+						type="text"
+					/>
+				) : null}
+			</div>
+		</SearchContainer>
+	);
+}
+
+export default MetricTagKeyFilter;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts
new file mode 100644
index 0000000000..035dca4dd7
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts
@@ -0,0 +1,30 @@
+import { grey } from '@ant-design/colors';
+import { Tag } from 'antd';
+import styled from 'styled-components';
+
+export const SearchContainer = styled.div<{
+	isDarkMode: boolean;
+	disabled: boolean;
+}>`
+	background: ${({ isDarkMode }): string => (isDarkMode ? '#000' : '#fff')};
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+	padding: 0.2rem;
+	border: 1px solid #ccc5;
+	${({ disabled }): string => (disabled ? `cursor: not-allowed;` : '')}
+`;
+export const QueryChipContainer = styled.span`
+	display: flex;
+	align-items: center;
+	margin-right: 0.5rem;
+	&:hover {
+		& > * {
+			background: ${grey.primary}44;
+		}
+	}
+`;
+
+export const QueryChipItem = styled(Tag)`
+	margin-right: 0.1rem;
+`;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts
new file mode 100644
index 0000000000..4eb8bb719c
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts
@@ -0,0 +1,11 @@
+export interface IOption {
+	label: string;
+	value: string;
+}
+
+export interface IMetricBuilderTagKeyQuery {
+	id: string;
+	tagKey: string;
+	operator: string;
+	tagValue: string[];
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts
new file mode 100644
index 0000000000..685d05d095
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts
@@ -0,0 +1,55 @@
+import {
+	getResourceAttributesTagKeys,
+	getResourceAttributesTagValues,
+} from 'api/metrics/getResourceAttributes';
+import { v4 as uuid } from 'uuid';
+
+import { TagKeyOperator } from '../../Options';
+import { IMetricBuilderTagKeyQuery, IOption } from './types';
+
+export const OperatorSchema: IOption[] = TagKeyOperator;
+
+export const GetTagKeys = async (metricName: string): Promise<IOption[]> => {
+	const { payload } = await getResourceAttributesTagKeys({ metricName });
+	if (!payload || !payload?.data) {
+		return [];
+	}
+	return payload.data.map((tagKey: string) => ({
+		label: tagKey,
+		value: tagKey,
+	}));
+};
+
+export const GetTagValues = async (
+	tagKey: string,
+	metricName: string,
+): Promise<IOption[]> => {
+	const { payload } = await getResourceAttributesTagValues({
+		tagKey,
+		metricName,
+	});
+
+	if (!payload || !payload?.data) {
+		return [];
+	}
+	return payload.data.map((tagValue: string) => ({
+		label: tagValue,
+		value: tagValue,
+	}));
+};
+
+export const createQuery = (
+	selectedItems: Array<string | string[]> = [],
+): IMetricBuilderTagKeyQuery | null => {
+	if (selectedItems.length === 3) {
+		return {
+			id: uuid().slice(0, 8),
+			key: selectedItems[0] as string,
+			op: selectedItems[1] as string,
+			value: selectedItems[2] as string[],
+		};
+	}
+	return null;
+};
+
+export const SingleValueOperators = ['LIKE', 'NLIKE'];
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx
new file mode 100644
index 0000000000..bc47ddf33c
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx
@@ -0,0 +1,37 @@
+import { Input } from 'antd';
+import React from 'react';
+
+import QueryHeader from '../QueryHeader';
+
+const { TextArea } = Input;
+
+function MetricsBuilderFormula({
+	formulaData,
+	formulaIndex,
+	handleFormulaChange,
+}): JSX.Element {
+	return (
+		<QueryHeader
+			name={formulaData.name}
+			disabled={formulaData.disabled}
+			onDisable={(): void =>
+				handleFormulaChange({ formulaIndex, toggleDisable: true })
+			}
+			onDelete={(): void => {
+				handleFormulaChange({ formulaIndex, toggleDelete: true });
+			}}
+		>
+			<TextArea
+				onChange={(event): void =>
+					handleFormulaChange({ formulaIndex, expression: event.target.value })
+				}
+				size="middle"
+				defaultValue={formulaData.expression}
+				style={{ marginBottom: '0.5rem' }}
+				rows={2}
+			/>
+		</QueryHeader>
+	);
+}
+
+export default MetricsBuilderFormula;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx
new file mode 100644
index 0000000000..6a4b812c62
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx
@@ -0,0 +1,168 @@
+import { PlusOutlined } from '@ant-design/icons';
+import { notification } from 'antd';
+import {
+	QueryBuilderFormulaTemplate,
+	QueryBuilderQueryTemplate,
+} from 'constants/dashboard';
+import GetFormulaName from 'lib/query/GetFormulaName';
+import GetQueryName from 'lib/query/GetQueryName';
+import React from 'react';
+
+import {
+	WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME,
+	WIDGET_QUERY_BUILDER_QUERY_KEY_NAME,
+} from '../../constants';
+import { QueryButton } from '../../styles';
+import MetricsBuilderFormula from './formula';
+import MetricsBuilder from './query';
+import { canCreateQueryAndFormula } from './utils';
+
+function QueryBuilderQueryContainer({
+	queryData,
+	updateQueryData,
+	metricsBuilderQueries,
+	selectedGraph,
+}): JSX.Element | null {
+	const handleQueryBuilderQueryChange = ({
+		queryIndex,
+		aggregateFunction,
+		metricName,
+		tagFilters,
+		groupBy,
+		legend,
+		toggleDisable,
+		toggleDelete,
+		reduceTo,
+	}): void => {
+		const allQueries =
+			queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder;
+		const currentIndexQuery = allQueries[queryIndex];
+		if (aggregateFunction) {
+			currentIndexQuery.aggregateOperator = aggregateFunction;
+		}
+
+		if (metricName) {
+			currentIndexQuery.metricName = metricName;
+		}
+
+		if (tagFilters) {
+			currentIndexQuery.tagFilters.items = tagFilters;
+		}
+
+		if (groupBy) {
+			currentIndexQuery.groupBy = groupBy;
+		}
+
+		if (reduceTo) {
+			currentIndexQuery.reduceTo = reduceTo;
+		}
+
+		if (legend !== undefined) {
+			currentIndexQuery.legend = legend;
+		}
+		if (toggleDisable) {
+			currentIndexQuery.disabled = !currentIndexQuery.disabled;
+		}
+		if (toggleDelete) {
+			allQueries.splice(queryIndex, 1);
+		}
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+	const handleQueryBuilderFormulaChange = ({
+		formulaIndex,
+		expression,
+		toggleDisable,
+		toggleDelete,
+	}): void => {
+		const allFormulas =
+			queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
+				WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
+			];
+		const currentIndexFormula = allFormulas[formulaIndex];
+
+		if (expression) {
+			currentIndexFormula.expression = expression;
+		}
+
+		if (toggleDisable) {
+			currentIndexFormula.disabled = !currentIndexFormula.disabled;
+		}
+
+		if (toggleDelete) {
+			allFormulas.splice(formulaIndex, 1);
+		}
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+	const addQueryHandler = (): void => {
+		if (!canCreateQueryAndFormula(queryData)) {
+			notification.error({
+				message:
+					'Unable to create query. You can create at max 10 queries and formulae.',
+			});
+			return;
+		}
+		queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder.push({
+			name: GetQueryName(
+				queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder,
+			),
+			...QueryBuilderQueryTemplate,
+		});
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+
+	const addFormulaHandler = (): void => {
+		if (!canCreateQueryAndFormula(queryData)) {
+			notification.error({
+				message:
+					'Unable to create formula. You can create at max 10 queries and formulae.',
+			});
+			return;
+		}
+		queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
+			WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
+		].push({
+			name: GetFormulaName(
+				queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
+					WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
+				],
+			),
+			...QueryBuilderFormulaTemplate,
+		});
+		updateQueryData({ updatedQuery: { ...queryData } });
+	};
+
+	if (!metricsBuilderQueries) {
+		return null;
+	}
+	return (
+		<>
+			{metricsBuilderQueries.queryBuilder.map((q, idx) => (
+				<MetricsBuilder
+					key={q.name}
+					queryIndex={idx}
+					queryData={q}
+					handleQueryChange={handleQueryBuilderQueryChange}
+					selectedGraph={selectedGraph}
+				/>
+			))}
+			<QueryButton onClick={addQueryHandler} icon={<PlusOutlined />}>
+				Query
+			</QueryButton>
+			<div style={{ marginTop: '1rem' }}>
+				{metricsBuilderQueries.formulas.map((f, idx) => (
+					<MetricsBuilderFormula
+						key={f.name}
+						formulaIndex={idx}
+						formulaData={f}
+						handleFormulaChange={handleQueryBuilderFormulaChange}
+					/>
+				))}
+				<QueryButton onClick={addFormulaHandler} icon={<PlusOutlined />}>
+					Formula
+				</QueryButton>
+			</div>
+		</>
+	);
+}
+
+export default QueryBuilderQueryContainer;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx
new file mode 100644
index 0000000000..d953ab9dae
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx
@@ -0,0 +1,200 @@
+import { AutoComplete, Col, Input, Row, Select, Spin } from 'antd';
+import { getMetricName } from 'api/metrics/getMetricName';
+import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
+import React, { useEffect, useState } from 'react';
+import { EReduceOperator } from 'types/common/dashboard';
+
+import { TQueryCategories } from '../../types';
+import { AggregateFunctions } from '../Options';
+import QueryHeader from '../QueryHeader';
+import MetricTagKeyFilter from './MetricTagKeyFilter';
+import { GetTagKeys } from './MetricTagKeyFilter/utils';
+
+const { Option } = Select;
+function MetricsBuilder({
+	queryData,
+	queryIndex,
+	handleQueryChange,
+	selectedGraph,
+}: QueryBuilderProps): JSX.Element {
+	const [groupByOptions, setGroupByOptions] = useState([]);
+	const [metricName, setMetricName] = useState(queryData.metricName);
+
+	const [metricNameList, setMetricNameList] = useState([]);
+	const [metricNameLoading, setMetricNameLoading] = useState(false);
+
+	const handleMetricNameSelect = (e): void => {
+		handleQueryChange({ queryIndex, metricName: e });
+		setMetricName(e);
+	};
+
+	const handleMetricNameSearch = async (searchQuery = ''): Promise<void> => {
+		handleMetricNameSelect(searchQuery);
+		setMetricNameList([]);
+		setMetricNameLoading(true);
+		const { payload } = await getMetricName(searchQuery);
+		setMetricNameLoading(false);
+		if (!payload || !payload.data) {
+			return;
+		}
+		setMetricNameList(payload.data);
+	};
+	const [aggregateFunctionList, setAggregateFunctionList] = useState(
+		AggregateFunctions,
+	);
+	const handleAggregateFunctionsSearch = (searchQuery = ''): void => {
+		setAggregateFunctionList(
+			AggregateFunctions.filter(({ label }) =>
+				label.includes(searchQuery.toUpperCase()),
+			) || [],
+		);
+	};
+
+	useEffect(() => {
+		GetTagKeys(metricName).then((tagKeys) => {
+			setGroupByOptions(tagKeys);
+		});
+	}, [metricName]);
+
+	return (
+		<QueryHeader
+			name={queryData.name}
+			disabled={queryData.disabled}
+			onDisable={(): void =>
+				handleQueryChange({ queryIndex, toggleDisable: true })
+			}
+			onDelete={(): void => {
+				handleQueryChange({ queryIndex, toggleDelete: true });
+			}}
+		>
+			<div style={{ display: 'flex', flexDirection: 'column', padding: '0.5rem' }}>
+				<div>
+					<Select
+						onChange={(e): void =>
+							handleQueryChange({ queryIndex, aggregateFunction: e })
+						}
+						defaultValue={queryData.aggregateOperator || AggregateFunctions[0]}
+						style={{ minWidth: 150 }}
+						options={aggregateFunctionList}
+						showSearch
+						onSearch={handleAggregateFunctionsSearch}
+						filterOption={false}
+					/>
+				</div>
+				<Row style={{ gap: '3%', margin: '0.5rem 0' }}>
+					<Row style={{ flex: 2, gap: '3%' }}>
+						<Select
+							defaultValue="metrics"
+							showArrow={false}
+							dropdownStyle={{ display: 'none' }}
+						>
+							<Option value="metrics">Metrics</Option>
+						</Select>
+
+						<AutoComplete
+							showSearch
+							placeholder="Metric Name (Start typing to get suggestions)"
+							style={{ flex: 1, minWidth: 200 }}
+							showArrow={false}
+							filterOption={false}
+							onSearch={handleMetricNameSearch}
+							notFoundContent={metricNameLoading ? <Spin size="small" /> : null}
+							options={metricNameList.map((option) => ({
+								label: option,
+								value: option,
+							}))}
+							defaultValue={queryData.metricName}
+							value={metricName}
+							onSelect={handleMetricNameSelect}
+						/>
+					</Row>
+					<Col style={{ flex: 3 }}>
+						<Row style={{ gap: '3%', marginBottom: '1rem' }}>
+							<Select
+								defaultValue="WHERE"
+								showArrow={false}
+								dropdownStyle={{ display: 'none' }}
+							>
+								<Option value="WHERE">WHERE</Option>
+							</Select>
+							<MetricTagKeyFilter
+								metricName={metricName}
+								selectedTagFilters={queryData.tagFilters.items}
+								onSetQuery={(updatedTagFilters): void =>
+									handleQueryChange({ queryIndex, tagFilters: updatedTagFilters })
+								}
+							/>
+						</Row>
+						<Row style={{ gap: '3%', marginBottom: '1rem' }}>
+							{selectedGraph === 'TIME_SERIES' ? (
+								<>
+									{' '}
+									<Select
+										defaultValue="GROUP BY"
+										showArrow={false}
+										dropdownStyle={{ display: 'none' }}
+									>
+										<Option value="GROUP BY">GROUP BY</Option>
+									</Select>
+									<Select
+										mode="multiple"
+										showSearch
+										style={{ flex: 1 }}
+										defaultActiveFirstOption={false}
+										filterOption={false}
+										notFoundContent={metricNameLoading ? <Spin size="small" /> : null}
+										options={groupByOptions}
+										defaultValue={queryData.groupBy}
+										onChange={(e): void => {
+											handleQueryChange({ queryIndex, groupBy: e });
+										}}
+									/>
+								</>
+							) : (
+								<>
+									<Select
+										defaultValue="REDUCE TO"
+										showArrow={false}
+										dropdownStyle={{ display: 'none' }}
+									>
+										<Option value="GROUP BY">REDUCE TO</Option>
+									</Select>
+									<Select
+										placeholder="Latest of values in timeframe"
+										style={{ flex: 1 }}
+										options={Object.keys(EReduceOperator)
+											.filter((op) => !(parseInt(op, 10) >= 0))
+											.map((op) => ({
+												label: op,
+												value: EReduceOperator[op],
+											}))}
+										defaultValue={EReduceOperator[queryData.reduceTo]}
+										onChange={(e): void => {
+											handleQueryChange({ queryIndex, reduceTo: e });
+										}}
+									/>
+								</>
+							)}
+						</Row>
+					</Col>
+				</Row>
+				<Row style={{ margin: '0.5rem 0' }}>
+					<Input
+						onChange={(e): void => {
+							handleQueryChange({ queryIndex, legend: e.target.value });
+						}}
+						size="middle"
+						defaultValue={queryData.legend}
+						addonBefore="Legend Format"
+					/>
+				</Row>
+			</div>
+		</QueryHeader>
+	);
+}
+
+interface QueryBuilderProps {
+	selectedGraph: GRAPH_TYPES;
+	queryCategory: TQueryCategories;
+}
+export default MetricsBuilder;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts
new file mode 100644
index 0000000000..977d194c9b
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts
@@ -0,0 +1,16 @@
+import {
+	WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME,
+	WIDGET_QUERY_BUILDER_QUERY_KEY_NAME,
+} from '../../constants';
+
+const QUERY_AND_FORMULA_LIMIT = 10;
+
+export const canCreateQueryAndFormula = (query): boolean => {
+	const queries = query[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder;
+	const formulas =
+		query[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
+			WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
+		];
+
+	return queries.length + formulas.length < QUERY_AND_FORMULA_LIMIT;
+};
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx
new file mode 100644
index 0000000000..c8067a873b
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx
@@ -0,0 +1,31 @@
+import { Tooltip } from 'antd';
+import React from 'react';
+
+function TabHeader({ tabName, hasUnstagedChanges }): JSX.Element {
+	return (
+		<div
+			style={{
+				display: 'flex',
+				gap: '0.5rem',
+				justifyContent: 'center',
+				alignItems: 'center',
+			}}
+		>
+			{tabName}
+			{hasUnstagedChanges && (
+				<Tooltip title="Looks like you have un-staged changes. Make sure you click 'Stage & Run Query' if you want to save these changes.">
+					<div
+						style={{
+							height: '0.6rem',
+							width: '0.6rem',
+							borderRadius: '1rem',
+							background: 'orange',
+						}}
+					/>
+				</Tooltip>
+			)}
+		</div>
+	);
+}
+
+export default TabHeader;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts
new file mode 100644
index 0000000000..35e6cf5b63
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts
@@ -0,0 +1,17 @@
+import { EQueryType } from 'types/common/dashboard';
+
+import { EQueryTypeToQueryKeyMapping } from './types';
+
+export const WIDGET_PROMQL_QUERY_KEY_NAME: string = EQueryTypeToQueryKeyMapping[
+	EQueryType[EQueryType.PROM]
+] as string;
+
+export const WIDGET_CLICKHOUSE_QUERY_KEY_NAME: string = EQueryTypeToQueryKeyMapping[
+	EQueryType[EQueryType.CLICKHOUSE]
+] as string;
+
+export const WIDGET_QUERY_BUILDER_QUERY_KEY_NAME: string = EQueryTypeToQueryKeyMapping[
+	EQueryType[EQueryType.QUERY_BUILDER]
+] as string;
+
+export const WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME: string = 'formulas' as string;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx
index c0ad837b9c..fb1cf331c6 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx
@@ -1,20 +1,57 @@
-import { PlusOutlined } from '@ant-design/icons';
+import { Button, Tabs } from 'antd';
+import TextToolTip from 'components/TextToolTip';
+import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
 import { timePreferance } from 'container/NewWidget/RightContainer/timeItems';
-import React, { useCallback, useMemo } from 'react';
+import { cloneDeep, isEqual } from 'lodash-es';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { connect, useSelector } from 'react-redux';
 import { useLocation } from 'react-router-dom';
 import { bindActionCreators, Dispatch } from 'redux';
 import { ThunkDispatch } from 'redux-thunk';
 import { CreateQuery, CreateQueryProps } from 'store/actions';
+import {
+	GetQueryResults,
+	GetQueryResultsProps,
+} from 'store/actions/dashboard/getQueryResults';
+import {
+	UpdateQuery,
+	UpdateQueryProps,
+} from 'store/actions/dashboard/updateQuery';
+import {
+	UpdateQueryType,
+	UpdateQueryTypeProps,
+} from 'store/actions/dashboard/updateQueryType';
 import { AppState } from 'store/reducers';
 import AppActions from 'types/actions';
 import { Widgets } from 'types/api/dashboard/getAll';
+import { EQueryType } from 'types/common/dashboard';
 import DashboardReducer from 'types/reducer/dashboards';
+import { v4 as uuid } from 'uuid';
 
-import Query from './Query';
-import { QueryButton } from './styles';
+import {
+	WIDGET_CLICKHOUSE_QUERY_KEY_NAME,
+	WIDGET_PROMQL_QUERY_KEY_NAME,
+	WIDGET_QUERY_BUILDER_QUERY_KEY_NAME,
+} from './constants';
+import ClickHouseQueryContainer from './QueryBuilder/clickHouse';
+import PromQLQueryContainer from './QueryBuilder/promQL';
+import QueryBuilderQueryContainer from './QueryBuilder/queryBuilder';
+import TabHeader from './TabHeader';
+import { getQueryKey } from './utils/getQueryKey';
+import { showUnstagedStashConfirmBox } from './utils/userSettings';
 
-function QuerySection({ selectedTime, createQuery }: QueryProps): JSX.Element {
+const { TabPane } = Tabs;
+function QuerySection({
+	handleUnstagedChanges,
+	updateQuery,
+	selectedGraph,
+}: QueryProps): JSX.Element {
+	const [localQueryChanges, setLocalQueryChanges] = useState({});
+	const [rctTabKey, setRctTabKey] = useState({
+		QUERY_BUILDER: uuid(),
+		CLICKHOUSE: uuid(),
+		PROMQL: uuid(),
+	});
 	const { dashboards } = useSelector<AppState, DashboardReducer>(
 		(state) => state.dashboards,
 	);
@@ -32,50 +69,256 @@ function QuerySection({ selectedTime, createQuery }: QueryProps): JSX.Element {
 	}, [widgets, urlQuery]);
 
 	const selectedWidget = getWidget() as Widgets;
+	const [queryCategory, setQueryCategory] = useState<EQueryType>(
+		selectedWidget.query.queryType,
+	);
 
 	const { query = [] } = selectedWidget || {};
+	useEffect(() => {
+		setLocalQueryChanges(cloneDeep(query));
+	}, [query]);
+	const queryOnClickHandler = () => {
+		setLocalQueryChanges([
+			...localQueryChanges,
+			// {
+			// 	name: GetQueryName(localQueryChanges),
+			// 	disabled: false,
 
-	const queryOnClickHandler = useCallback(() => {
-		const widgetId = urlQuery.get('widgetId');
+			// 	promQL: {
+			// 		query: '',
+			// 		legend: '',
+			// 	},
+			// 	clickHouseQuery: '',
+			// 	queryBuilder: {
+			// 		metricName: null,
+			// 		aggregateOperator: null,
+			// 		tagFilters: {
+			// 			op: 'AND',
+			// 			items: [],
+			// 		},
+			// 		groupBy: [],
+			// 	},
+			// },
+		]);
+	};
 
-		createQuery({
-			widgetId: String(widgetId),
+	const queryDiff = (queryA, queryB, queryCategory) => {
+		const keyOfConcern = getQueryKey(queryCategory);
+		return !isEqual(queryA[keyOfConcern], queryB[keyOfConcern]);
+	};
+
+	useEffect(() => {
+		handleUnstagedChanges(
+			queryDiff(query, localQueryChanges, parseInt(queryCategory)),
+		);
+	}, [handleUnstagedChanges, localQueryChanges, query, queryCategory]);
+
+	const purgeLocalChanges = () => {
+		setLocalQueryChanges(query);
+	};
+	const regenRctKeys = () => {
+		setRctTabKey((prevState) => {
+			Object.keys(prevState).map((key) => {
+				prevState[key] = uuid();
+			});
+
+			return cloneDeep(prevState);
 		});
-	}, [createQuery, urlQuery]);
+	};
+
+	const handleStageQuery = () => {
+		updateQuery({
+			updatedQuery: localQueryChanges,
+			widgetId: urlQuery.get('widgetId'),
+			yAxisUnit: selectedWidget.yAxisUnit,
+		});
+	};
+
+	const handleQueryCategoryChange = (qCategory): void => {
+		// If true, then it means that the user has made some changes and haven't staged them
+		const unstagedChanges = queryDiff(
+			query,
+			localQueryChanges,
+			parseInt(queryCategory),
+		);
+
+		if (unstagedChanges && showUnstagedStashConfirmBox()) {
+			window.confirm(
+				"You are trying to navigate to different tab with unstaged changes. Your current changes will be purged. Press 'Stage & Run Query' to stage them.",
+			);
+			return;
+		}
+
+		setQueryCategory(parseInt(qCategory));
+		const newLocalQuery = {
+			...cloneDeep(query),
+			queryType: parseInt(qCategory),
+		};
+		setLocalQueryChanges(newLocalQuery);
+		regenRctKeys();
+		updateQuery({
+			updatedQuery: newLocalQuery,
+			widgetId: urlQuery.get('widgetId'),
+			yAxisUnit: selectedWidget.yAxisUnit,
+		});
+	};
+	const handleLocalQueryUpdate = ({ updatedQuery }) => {
+		setLocalQueryChanges(updatedQuery);
+	};
+
+	const handleDeleteQuery = ({ currentIndex }) => {
+		setLocalQueryChanges((prevState) => {
+			prevState.splice(currentIndex, 1);
+			return [...prevState];
+		});
+	};
 
 	return (
 		<>
-			{query.map((e, index) => (
-				<Query
-					currentIndex={index}
-					selectedTime={selectedTime}
-					key={`${e.query} ${e.query.length}`}
-					preQuery={e.query}
-					preLegend={e.legend || ''}
+			<div style={{ display: 'flex' }}>
+				<Tabs
+					type="card"
+					style={{ width: '100%' }}
+					defaultActiveKey={queryCategory.toString()}
+					activeKey={queryCategory.toString()}
+					onChange={handleQueryCategoryChange}
+					tabBarExtraContent={
+						<span style={{ display: 'flex', gap: '1rem', alignItems: 'center' }}>
+							<TextToolTip
+								{...{
+									text: `This will temporarily save the current query and graph state. This will persist across tab change`,
+								}}
+							/>
+							<Button type="primary" onClick={handleStageQuery}>
+								Stage & Run Query
+							</Button>
+						</span>
+					}
+				>
+					<TabPane
+						tab={
+							<TabHeader
+								tabName="Query Builder"
+								hasUnstagedChanges={queryDiff(
+									query,
+									localQueryChanges,
+									EQueryType.QUERY_BUILDER,
+								)}
+							/>
+						}
+						key={EQueryType.QUERY_BUILDER.toString()}
+					>
+						<QueryBuilderQueryContainer
+							key={rctTabKey.QUERY_BUILDER}
+							queryData={localQueryChanges}
+							updateQueryData={({ updatedQuery }) => {
+								handleLocalQueryUpdate({ updatedQuery });
+							}}
+							metricsBuilderQueries={
+								localQueryChanges[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME]
+							}
+							selectedGraph={selectedGraph}
+						/>
+					</TabPane>
+					<TabPane
+						tab={
+							<TabHeader
+								tabName="ClickHouse Query"
+								hasUnstagedChanges={queryDiff(
+									query,
+									localQueryChanges,
+									EQueryType.CLICKHOUSE,
+								)}
+							/>
+						}
+						key={EQueryType.CLICKHOUSE.toString()}
+					>
+						<ClickHouseQueryContainer
+							key={rctTabKey.CLICKHOUSE}
+							queryData={localQueryChanges}
+							updateQueryData={({ updatedQuery }) => {
+								handleLocalQueryUpdate({ updatedQuery });
+							}}
+							clickHouseQueries={localQueryChanges[WIDGET_CLICKHOUSE_QUERY_KEY_NAME]}
+						/>
+					</TabPane>
+					<TabPane
+						tab={
+							<TabHeader
+								tabName="PromQL"
+								hasUnstagedChanges={queryDiff(
+									query,
+									localQueryChanges,
+									EQueryType.PROM,
+								)}
+							/>
+						}
+						key={EQueryType.PROM.toString()}
+					>
+						<PromQLQueryContainer
+							key={rctTabKey.PROMQL}
+							queryData={localQueryChanges}
+							updateQueryData={({ updatedQuery }) => {
+								handleLocalQueryUpdate({ updatedQuery });
+							}}
+							promQLQueries={localQueryChanges[WIDGET_PROMQL_QUERY_KEY_NAME]}
+						/>
+					</TabPane>
+				</Tabs>
+			</div>
+			{/* {localQueryChanges.map((e, index) => (
+				// <Query
+				// 	name={e.name}
+				// 	currentIndex={index}
+				// 	selectedTime={selectedTime}
+				// 	key={JSON.stringify(e)}
+				// 	queryInput={e}
+				// 	updatedLocalQuery={handleLocalQueryUpdate}
+				// 	queryCategory={queryCategory}
+				// />
+				<QueryBuilder
+					key={`${JSON.stringify(e)}`}
+					name={e.name}
+					updateQueryData={(updatedQuery) =>
+						handleLocalQueryUpdate({ currentIndex: index, updatedQuery })
+					}
+					onDelete={() => handleDeleteQuery({ currentIndex: index })}
+					queryData={e}
+					queryCategory={queryCategory}
 				/>
-			))}
-
-			<QueryButton onClick={queryOnClickHandler} icon={<PlusOutlined />}>
-				Query
-			</QueryButton>
+			))} */}
 		</>
 	);
 }
 
 interface DispatchProps {
-	createQuery: ({
-		widgetId,
-	}: CreateQueryProps) => (dispatch: Dispatch<AppActions>) => void;
+	// createQuery: ({
+	// 	widgetId,
+	// }: CreateQueryProps) => (dispatch: Dispatch<AppActions>) => void;
+	updateQuery: (
+		props: UpdateQueryProps,
+	) => (dispatch: Dispatch<AppActions>) => void;
+	// getQueryResults: (
+	// 	props: GetQueryResultsProps,
+	// ) => (dispatch: Dispatch<AppActions>) => void;
+	// updateQueryType: (
+	// 	props: UpdateQueryTypeProps,
+	// ) => (dispatch: Dispatch<AppActions>) => void;
 }
 
 const mapDispatchToProps = (
 	dispatch: ThunkDispatch<unknown, unknown, AppActions>,
 ): DispatchProps => ({
-	createQuery: bindActionCreators(CreateQuery, dispatch),
+	// createQuery: bindActionCreators(CreateQuery, dispatch),
+	updateQuery: bindActionCreators(UpdateQuery, dispatch),
+	// getQueryResults: bindActionCreators(GetQueryResults, dispatch),
+	// updateQueryType: bindActionCreators(UpdateQueryType, dispatch),
 });
 
 interface QueryProps extends DispatchProps {
+	selectedGraph: GRAPH_TYPES;
 	selectedTime: timePreferance;
+	handleUnstagedChanges: (arg0: boolean) => void;
 }
 
 export default connect(null, mapDispatchToProps)(QuerySection);
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/styles.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/styles.ts
index 8efadde259..3a0d73e1ab 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/styles.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/styles.ts
@@ -8,6 +8,7 @@ export const InputContainer = styled.div`
 export const Container = styled.div`
 	margin-top: 1rem;
 	display: flex;
+	flex-direction: column;
 `;
 
 export const QueryButton = styled(Button)`
@@ -18,11 +19,15 @@ export const QueryButton = styled(Button)`
 `;
 
 export const QueryWrapper = styled.div`
-	width: 100%; // parent need to 100%
+	width: 100%;
+	margin: 1rem 0;
+	padding: 1rem 0.5rem;
+	display: flex;
+	flex-direction: column;
+`;
 
-	> div {
-		width: 95%; // each child is taking 95% of the parent
-	}
+export const QueryBuilderWrapper = styled.div<{ isDarkMode: boolean }>`
+	background: ${({ isDarkMode }): string => (isDarkMode ? '#000' : '#efefef')};
 `;
 
 export const ButtonContainer = styled.div`
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts
new file mode 100644
index 0000000000..67993af292
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts
@@ -0,0 +1,13 @@
+export type TQueryCategories = 'query_builder' | 'clickhouse_query' | 'promql';
+
+export enum EQueryCategories {
+	query_builder = 0,
+	clickhouse_query,
+	promql,
+}
+
+export enum EQueryTypeToQueryKeyMapping {
+	QUERY_BUILDER = 'metricsBuilder',
+	CLICKHOUSE = 'clickHouse',
+	PROM = 'promQL',
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts
new file mode 100644
index 0000000000..e698edc4a0
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts
@@ -0,0 +1,7 @@
+import { EQueryType } from 'types/common/dashboard';
+
+import { EQueryTypeToQueryKeyMapping } from '../types';
+
+export const getQueryKey = (queryCategory): EQueryTypeToQueryKeyMapping => {
+	return EQueryTypeToQueryKeyMapping[EQueryType[queryCategory] as unknown];
+};
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/userSettings.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/userSettings.ts
new file mode 100644
index 0000000000..f05671556b
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/userSettings.ts
@@ -0,0 +1,23 @@
+import getLocalStorageApi from 'api/browser/localstorage/get';
+import setLocalStorageApi from 'api/browser/localstorage/set';
+
+const UNSTAGE_CONFIRM_BOX_SHOW_COUNT = 2;
+const UNSTAGE_CONFIRM_BOX_KEY =
+	'DASHBOARD_METRICS_BUILDER_UNSTAGE_STASH_CONFIRM_SHOW_COUNT';
+
+export const showUnstagedStashConfirmBox = (): boolean => {
+	const showCountTillNow: number = parseInt(
+		getLocalStorageApi(UNSTAGE_CONFIRM_BOX_KEY) || '',
+		10,
+	);
+	if (Number.isNaN(showCountTillNow)) {
+		setLocalStorageApi(UNSTAGE_CONFIRM_BOX_KEY, '1');
+		return true;
+	}
+
+	if (showCountTillNow >= UNSTAGE_CONFIRM_BOX_SHOW_COUNT) {
+		return false;
+	}
+	setLocalStorageApi(UNSTAGE_CONFIRM_BOX_KEY, `${showCountTillNow + 1}`);
+	return true;
+};
diff --git a/frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx b/frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx
new file mode 100644
index 0000000000..6838e994de
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx
@@ -0,0 +1,35 @@
+import React from 'react';
+import { EQueryType } from 'types/common/dashboard';
+
+import { Tag } from '../styles';
+
+interface IQueryTypeTagProps {
+	queryType: EQueryType;
+}
+function QueryTypeTag({ queryType }: IQueryTypeTagProps): JSX.Element {
+	switch (queryType) {
+		case EQueryType.QUERY_BUILDER:
+			return (
+				<span>
+					<Tag color="geekblue">Query Builder</Tag>
+				</span>
+			);
+
+		case EQueryType.CLICKHOUSE:
+			return (
+				<span>
+					<Tag color="orange">ClickHouse Query</Tag>
+				</span>
+			);
+		case EQueryType.PROM:
+			return (
+				<span>
+					<Tag color="green">PromQL</Tag>
+				</span>
+			);
+		default:
+			return <span />;
+	}
+}
+
+export default QueryTypeTag;
diff --git a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx
new file mode 100644
index 0000000000..6b5666cd89
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx
@@ -0,0 +1,17 @@
+import React from 'react';
+
+import QueryTypeTag from '../QueryTypeTag';
+
+function PlotTag({ queryType }): JSX.Element | null {
+	if (queryType === undefined) {
+		return null;
+	}
+
+	return (
+		<div style={{ marginLeft: '2rem', position: 'absolute', top: '1rem' }}>
+			Plotted using <QueryTypeTag queryType={queryType} />
+		</div>
+	);
+}
+
+export default PlotTag;
diff --git a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx
index 37bf188bb3..78a5a3b85c 100644
--- a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx
@@ -34,7 +34,15 @@ function WidgetGraph({
 
 	const { queryData, title, opacity, isStacked } = selectedWidget;
 
-	if (queryData.data.length === 0) {
+	if (queryData.error) {
+		return (
+			<NotFoundContainer>
+				<Typography>{queryData.errorMessage}</Typography>
+			</NotFoundContainer>
+		);
+	}
+
+	if (queryData.data.length === 0 || queryData.data[0].queryData.length === 0) {
 		return (
 			<NotFoundContainer>
 				<Typography>No Data</Typography>
diff --git a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/index.tsx b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/index.tsx
index 2fa28b7e1b..342599c49a 100644
--- a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/index.tsx
@@ -8,6 +8,7 @@ import { AppState } from 'store/reducers';
 import DashboardReducer from 'types/reducer/dashboards';
 
 import { NewWidgetProps } from '../../index';
+import PlotTag from './PlotTag';
 import { AlertIconContainer, Container, NotFoundContainer } from './styles';
 import WidgetGraphComponent from './WidgetGraph';
 
@@ -35,9 +36,9 @@ function WidgetGraph({
 	}
 
 	const { queryData } = selectedWidget;
-
 	return (
 		<Container>
+			<PlotTag queryType={selectedWidget.query.queryType} />
 			{queryData.error && (
 				<AlertIconContainer color="red" title={queryData.errorMessage}>
 					<InfoCircleOutlined />
diff --git a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/styles.ts b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/styles.ts
index b376f0d247..32a8c15f08 100644
--- a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/styles.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/styles.ts
@@ -7,8 +7,8 @@ export const Container = styled(Card)`
 	}
 
 	.ant-card-body {
-		padding: 0;
-		height: 55vh;
+		padding: 1.5rem 0;
+		height: 57vh;
 		/* padding-bottom: 2rem; */
 	}
 `;
diff --git a/frontend/src/container/NewWidget/LeftContainer/index.tsx b/frontend/src/container/NewWidget/LeftContainer/index.tsx
index 33c1bcaeaa..9e02adcd68 100644
--- a/frontend/src/container/NewWidget/LeftContainer/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/index.tsx
@@ -10,13 +10,17 @@ function LeftContainer({
 	selectedGraph,
 	selectedTime,
 	yAxisUnit,
+	handleUnstagedChanges,
 }: LeftContainerProps): JSX.Element {
 	return (
 		<>
 			<WidgetGraph selectedGraph={selectedGraph} yAxisUnit={yAxisUnit} />
-
 			<QueryContainer>
-				<QuerySection selectedTime={selectedTime} />
+				<QuerySection
+					selectedTime={selectedTime}
+					handleUnstagedChanges={handleUnstagedChanges}
+					selectedGraph={selectedGraph}
+				/>
 			</QueryContainer>
 		</>
 	);
@@ -24,6 +28,7 @@ function LeftContainer({
 
 interface LeftContainerProps extends NewWidgetProps {
 	selectedTime: timePreferance;
+	handleUnstagedChanges: (arg0: boolean) => void;
 }
 
 export default memo(LeftContainer);
diff --git a/frontend/src/container/NewWidget/index.tsx b/frontend/src/container/NewWidget/index.tsx
index 4943948abe..2ca25241a5 100644
--- a/frontend/src/container/NewWidget/index.tsx
+++ b/frontend/src/container/NewWidget/index.tsx
@@ -1,14 +1,13 @@
-import { Button } from 'antd';
+import { Button, Modal, Typography } from 'antd';
 import ROUTES from 'constants/routes';
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
 import history from 'lib/history';
 import { DashboardWidgetPageParams } from 'pages/DashboardWidget';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { connect, useSelector } from 'react-redux';
+import { connect, useDispatch, useSelector } from 'react-redux';
 import { generatePath, useLocation, useParams } from 'react-router-dom';
 import { bindActionCreators, Dispatch } from 'redux';
 import { ThunkDispatch } from 'redux-thunk';
-import { ApplySettingsToPanel, ApplySettingsToPanelProps } from 'store/actions';
 import {
 	GetQueryResults,
 	GetQueryResultsProps,
@@ -17,17 +16,15 @@ import {
 	SaveDashboard,
 	SaveDashboardProps,
 } from 'store/actions/dashboard/saveDashboard';
-import {
-	UpdateQuery,
-	UpdateQueryProps,
-} from 'store/actions/dashboard/updateQuery';
 import { AppState } from 'store/reducers';
 import AppActions from 'types/actions';
+import { FLUSH_DASHBOARD } from 'types/actions/dashboard';
 import { Widgets } from 'types/api/dashboard/getAll';
 import DashboardReducer from 'types/reducer/dashboards';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
 import LeftContainer from './LeftContainer';
+import QueryTypeTag from './LeftContainer/QueryTypeTag';
 import RightContainer from './RightContainer';
 import TimeItems, { timePreferance } from './RightContainer/timeItems';
 import {
@@ -36,15 +33,15 @@ import {
 	LeftContainerWrapper,
 	PanelContainer,
 	RightContainerWrapper,
+	Tag,
 } from './styles';
 
 function NewWidget({
 	selectedGraph,
-	applySettingsToPanel,
 	saveSettingOfPanel,
 	getQueryResults,
-	updateQuery,
 }: Props): JSX.Element {
+	const dispatch = useDispatch();
 	const { dashboards } = useSelector<AppState, DashboardReducer>(
 		(state) => state.dashboards,
 	);
@@ -87,6 +84,8 @@ function NewWidget({
 	const [selectedNullZeroValue, setSelectedNullZeroValue] = useState<string>(
 		selectedWidget?.nullZeroValues || 'zero',
 	);
+	const [saveModal, setSaveModal] = useState(false);
+	const [hasUnstagedChanges, setHasUnstagedChanges] = useState(false);
 
 	const getSelectedTime = useCallback(
 		() =>
@@ -116,45 +115,25 @@ function NewWidget({
 			dashboardId,
 		});
 	}, [
-		opacity,
-		description,
-		query,
-		selectedTime,
-		stacked,
-		title,
-		selectedNullZeroValue,
 		saveSettingOfPanel,
-		selectedDashboard,
-		dashboardId,
+		selectedDashboard.uuid,
+		description,
+		stacked,
+		selectedNullZeroValue,
+		opacity,
+		selectedTime.enum,
+		title,
 		yAxisUnit,
+		query,
+		dashboardId,
 	]);
 
-	const onClickApplyHandler = (): void => {
-		selectedWidget?.query.forEach((element, index) => {
-			updateQuery({
-				widgetId: selectedWidget?.id || '',
-				query: element.query || '',
-				legend: element.legend || '',
-				currentIndex: index,
-				yAxisUnit,
-			});
-		});
-
-		applySettingsToPanel({
-			description,
-			isStacked: stacked,
-			nullZeroValues: selectedNullZeroValue,
-			opacity,
-			timePreferance: selectedTime.enum,
-			title,
-			widgetId: selectedWidget?.id || '',
-			yAxisUnit,
-		});
-	};
-
 	const onClickDiscardHandler = useCallback(() => {
+		dispatch({
+			type: FLUSH_DASHBOARD,
+		});
 		history.push(generatePath(ROUTES.DASHBOARD, { dashboardId }));
-	}, [dashboardId]);
+	}, [dashboardId, dispatch]);
 
 	const getQueryResult = useCallback(() => {
 		if (selectedWidget?.id.length !== 0) {
@@ -182,14 +161,17 @@ function NewWidget({
 	return (
 		<Container>
 			<ButtonContainer>
-				<Button onClick={onClickSaveHandler}>Save</Button>
-				<Button onClick={onClickApplyHandler}>Apply</Button>
+				<Button type="primary" onClick={(): void => setSaveModal(true)}>
+					Save
+				</Button>
+				{/* <Button onClick={onClickApplyHandler}>Apply</Button> */}
 				<Button onClick={onClickDiscardHandler}>Discard</Button>
 			</ButtonContainer>
 
 			<PanelContainer>
 				<LeftContainerWrapper flex={5}>
 					<LeftContainer
+						handleUnstagedChanges={setHasUnstagedChanges}
 						selectedTime={selectedTime}
 						selectedGraph={selectedGraph}
 						yAxisUnit={yAxisUnit}
@@ -218,6 +200,34 @@ function NewWidget({
 					/>
 				</RightContainerWrapper>
 			</PanelContainer>
+			<Modal
+				title="Save Changes"
+				focusTriggerAfterClose
+				forceRender
+				destroyOnClose
+				closable
+				onCancel={(): void => setSaveModal(false)}
+				onOk={(): void => {
+					onClickSaveHandler();
+				}}
+				centered
+				visible={saveModal}
+				width={600}
+			>
+				{hasUnstagedChanges ? (
+					<Typography>
+						Looks like you have unstaged changes. Would you like to SAVE the last
+						staged changes? If you want to stage new changes - Press{' '}
+						<Tag>Stage & Run Query</Tag> and then try saving again.
+					</Typography>
+				) : (
+					<Typography>
+						Your graph built with{' '}
+						<QueryTypeTag queryType={selectedWidget?.query.queryType} /> query will be
+						saved. Press OK to confirm.
+					</Typography>
+				)}
+			</Modal>
 		</Container>
 	);
 }
@@ -228,27 +238,19 @@ export interface NewWidgetProps {
 }
 
 interface DispatchProps {
-	applySettingsToPanel: (
-		props: ApplySettingsToPanelProps,
-	) => (dispatch: Dispatch<AppActions>) => void;
 	saveSettingOfPanel: (
 		props: SaveDashboardProps,
 	) => (dispatch: Dispatch<AppActions>) => void;
 	getQueryResults: (
 		props: GetQueryResultsProps,
 	) => (dispatch: Dispatch<AppActions>) => void;
-	updateQuery: (
-		props: UpdateQueryProps,
-	) => (dispatch: Dispatch<AppActions>) => void;
 }
 
 const mapDispatchToProps = (
 	dispatch: ThunkDispatch<unknown, unknown, AppActions>,
 ): DispatchProps => ({
-	applySettingsToPanel: bindActionCreators(ApplySettingsToPanel, dispatch),
 	saveSettingOfPanel: bindActionCreators(SaveDashboard, dispatch),
 	getQueryResults: bindActionCreators(GetQueryResults, dispatch),
-	updateQuery: bindActionCreators(UpdateQuery, dispatch),
 });
 
 type Props = DispatchProps & NewWidgetProps;
diff --git a/frontend/src/container/NewWidget/styles.ts b/frontend/src/container/NewWidget/styles.ts
index c5974baf45..386f044a0b 100644
--- a/frontend/src/container/NewWidget/styles.ts
+++ b/frontend/src/container/NewWidget/styles.ts
@@ -1,4 +1,4 @@
-import { Col } from 'antd';
+import { Col, Tag as AntDTag } from 'antd';
 import styled from 'styled-components';
 
 export const Container = styled.div`
@@ -31,3 +31,7 @@ export const ButtonContainer = styled.div`
 export const PanelContainer = styled.div`
 	display: flex;
 `;
+
+export const Tag = styled(AntDTag)`
+	margin: 0;
+`;
diff --git a/frontend/src/lib/getChartData.ts b/frontend/src/lib/getChartData.ts
index 81b1c11d94..b1619fcd7a 100644
--- a/frontend/src/lib/getChartData.ts
+++ b/frontend/src/lib/getChartData.ts
@@ -6,15 +6,15 @@ import convertIntoEpoc from './covertIntoEpoc';
 import { colors } from './getRandomColor';
 
 const getChartData = ({ queryData }: GetChartDataProps): ChartData => {
-	const response = queryData.map(({ query, queryData, legend }) => {
+	const response = queryData.map(({ queryData }) => {
 		return queryData.map((e) => {
-			const { values = [], metric } = e || {};
+			const { values = [], metric, legend, queryName } = e || {};
+
 			const labelNames = getLabelName(
 				metric,
-				query, // query
-				legend || '', // legends
+				queryName || '', // query
+				legend || '',
 			);
-
 			const dataValue = values?.map((e) => {
 				const [first = 0, second = ''] = e || [];
 				return {
@@ -30,7 +30,6 @@ const getChartData = ({ queryData }: GetChartDataProps): ChartData => {
 			};
 		});
 	});
-
 	const allLabels = response
 		.map((e) => e.map((e) => e.label))
 		.reduce((a, b) => [...a, ...b], []);
diff --git a/frontend/src/lib/getLabelName.ts b/frontend/src/lib/getLabelName.ts
index 0208e80920..44f0173450 100644
--- a/frontend/src/lib/getLabelName.ts
+++ b/frontend/src/lib/getLabelName.ts
@@ -10,7 +10,6 @@ const getLabelName = (
 	}
 
 	const keysArray = Object.keys(metric);
-
 	if (legends.length !== 0) {
 		const variables = legends
 			.split('{{')
@@ -30,7 +29,7 @@ const getLabelName = (
 
 	const index = keysArray.findIndex((e) => e === '__name__');
 
-	const preArray = keysArray.slice(0, index);
+	const preArray = index !== -1 ? keysArray.slice(0, index) : [];
 	const postArray = keysArray.slice(index + 1, keysArray.length);
 
 	if (index === undefined && preArray.length === 0 && postArray.length) {
@@ -47,7 +46,6 @@ const getLabelName = (
 	if (post.length === 0 && pre.length === 0) {
 		return result;
 	}
-
 	return `${result}{${pre}${post}}`;
 };
 
diff --git a/frontend/src/lib/getMaxMinTime.ts b/frontend/src/lib/getMaxMinTime.ts
index b403da6e8a..483613c440 100644
--- a/frontend/src/lib/getMaxMinTime.ts
+++ b/frontend/src/lib/getMaxMinTime.ts
@@ -19,7 +19,7 @@ const GetMaxMinTime = ({
 };
 
 interface GetMaxMinProps {
-	graphType: Widgets['panelTypes'];
+	graphType: Widgets['panelTypes'] | null;
 	maxTime: GlobalTime['maxTime'];
 	minTime: GlobalTime['minTime'];
 }
diff --git a/frontend/src/lib/query/GetFormulaName.ts b/frontend/src/lib/query/GetFormulaName.ts
new file mode 100644
index 0000000000..b10b6203c0
--- /dev/null
+++ b/frontend/src/lib/query/GetFormulaName.ts
@@ -0,0 +1,27 @@
+import { sortBy } from 'lodash-es';
+
+const MAX_QUERIES = 20;
+
+function GetFormulaName(formulas = []): string | null {
+	if (!formulas.length) return 'F1';
+	if (formulas.length === MAX_QUERIES) {
+		return null;
+	}
+	const formulasNameNumbered = sortBy(
+		formulas.map(({ name }) => {
+			return parseInt(name.slice(1), 10);
+		}),
+		(e) => e,
+	);
+
+	// let formulaIteratorIdx = 0;
+
+	for (let charItr = 1; charItr <= MAX_QUERIES; charItr += 1) {
+		if (!formulasNameNumbered.includes(charItr)) {
+			return `F${charItr}`;
+		}
+		// formulaIteratorIdx += 1;
+	}
+}
+
+export default GetFormulaName;
diff --git a/frontend/src/lib/query/GetQueryName.ts b/frontend/src/lib/query/GetQueryName.ts
new file mode 100644
index 0000000000..316b48d81a
--- /dev/null
+++ b/frontend/src/lib/query/GetQueryName.ts
@@ -0,0 +1,29 @@
+import { sortBy } from 'lodash-es';
+
+const MAX_QUERIES = 26;
+function GetQueryName(queries = []): string | null {
+	if (!queries.length) return 'A';
+	if (queries.length === MAX_QUERIES) {
+		return null;
+	}
+	const sortedQueries = sortBy(queries, function (q) {
+		return q.name;
+	});
+
+	let query_iterator_idx = 0;
+
+	for (
+		let charItr = 'A'.charCodeAt(0);
+		charItr <= 'A'.charCodeAt(0) + MAX_QUERIES;
+		charItr += 1
+	) {
+		if (charItr !== sortedQueries[query_iterator_idx]?.name.charCodeAt(0)) {
+			return String.fromCharCode(charItr);
+		}
+		query_iterator_idx += 1;
+	}
+
+	return null;
+}
+
+export default GetQueryName;
diff --git a/frontend/src/store/actions/dashboard/getDashboard.ts b/frontend/src/store/actions/dashboard/getDashboard.ts
index 917365049e..4582a1255e 100644
--- a/frontend/src/store/actions/dashboard/getDashboard.ts
+++ b/frontend/src/store/actions/dashboard/getDashboard.ts
@@ -1,8 +1,15 @@
 import getDashboard from 'api/dashboard/get';
+import {
+	ClickHouseQueryTemplate,
+	PromQLQueryTemplate,
+	QueryBuilderQueryTemplate,
+} from 'constants/dashboard';
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
+import GetQueryName from 'lib/query/GetQueryName';
 import { Dispatch } from 'redux';
 import AppActions from 'types/actions';
 import { Props } from 'types/api/dashboard/get';
+import { EQueryType } from 'types/common/dashboard';
 
 export const GetDashboard = ({
 	uuid,
@@ -37,18 +44,41 @@ export const GetDashboard = ({
 							panelTypes: graphType || 'TIME_SERIES',
 							timePreferance: 'GLOBAL_TIME',
 							title: '',
+							queryType: 0,
 							queryData: {
-								data: [],
+								data: [
+									{
+										queryData: [],
+									},
+								],
 								error: false,
 								errorMessage: '',
 								loading: false,
 							},
-							query: [
-								{
-									query: '',
-									legend: '',
+							query: {
+								queryType: EQueryType.QUERY_BUILDER,
+								promQL: [
+									{
+										name: GetQueryName([]) as string,
+										...PromQLQueryTemplate,
+									},
+								],
+								clickHouse: [
+									{
+										name: GetQueryName([]) as string,
+										...ClickHouseQueryTemplate,
+									},
+								],
+								metricsBuilder: {
+									formulas: [],
+									queryBuilder: [
+										{
+											name: GetQueryName([]) as string,
+											...QueryBuilderQueryTemplate,
+										},
+									],
 								},
-							],
+							},
 						},
 					});
 				}
diff --git a/frontend/src/store/actions/dashboard/getQueryResults.ts b/frontend/src/store/actions/dashboard/getQueryResults.ts
index e2ced192db..d2d8c6da6f 100644
--- a/frontend/src/store/actions/dashboard/getQueryResults.ts
+++ b/frontend/src/store/actions/dashboard/getQueryResults.ts
@@ -1,91 +1,203 @@
-import getQueryResult from 'api/widgets/getQuery';
+import { getMetricsQueryRange } from 'api/metrics/getQueryRange';
 import { AxiosError } from 'axios';
+import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
 import { ITEMS } from 'container/NewDashboard/ComponentsSlider/menuItems';
+import { WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME } from 'container/NewWidget/LeftContainer/QuerySection/constants';
+import { EQueryTypeToQueryKeyMapping } from 'container/NewWidget/LeftContainer/QuerySection/types';
 import { timePreferenceType } from 'container/NewWidget/RightContainer/timeItems';
+import { Time } from 'container/TopNav/DateTimeSelection/config';
 import GetMaxMinTime from 'lib/getMaxMinTime';
 import GetMinMax from 'lib/getMinMax';
 import GetStartAndEndTime from 'lib/getStartAndEndTime';
 import getStep from 'lib/getStep';
+import { isEmpty } from 'lodash-es';
 import { Dispatch } from 'redux';
 import store from 'store';
 import AppActions from 'types/actions';
+import { ErrorResponse, SuccessResponse } from 'types/api';
 import { Query } from 'types/api/dashboard/getAll';
+import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
+import { EDataSource, EPanelType, EQueryType } from 'types/common/dashboard';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+export async function GetMetricQueryRange({
+	query,
+	globalSelectedInterval,
+	graphType,
+	selectedTime,
+}: {
+	query: Query;
+	graphType: GRAPH_TYPES;
+	selectedTime: timePreferenceType;
+	globalSelectedInterval: Time;
+}): Promise<SuccessResponse<MetricRangePayloadProps> | ErrorResponse> {
+	const { queryType } = query;
+	const queryKey: Record<EQueryTypeToQueryKeyMapping, string> =
+		EQueryTypeToQueryKeyMapping[EQueryType[query.queryType]];
+	const queryData = query[queryKey];
+	const legendMap: Record<string, string> = {};
+	const QueryPayload = {
+		dataSource: EDataSource.METRICS,
+		compositeMetricQuery: {
+			queryType,
+			panelType: EPanelType[graphType],
+		},
+	};
+	switch (queryType as EQueryType) {
+		case EQueryType.QUERY_BUILDER: {
+			const builderQueries = {};
+			queryData.queryBuilder.map((query) => {
+				const generatedQueryPayload = {
+					queryName: query.name,
+					aggregateOperator: query.aggregateOperator,
+					metricName: query.metricName,
+					tagFilters: query.tagFilters,
+				};
+
+				if (graphType === 'TIME_SERIES') {
+					generatedQueryPayload.groupBy = query.groupBy;
+				}
+
+				// Value
+				else {
+					generatedQueryPayload.reduceTo = query.reduceTo;
+				}
+
+				generatedQueryPayload.expression = query.name;
+				generatedQueryPayload.disabled = query.disabled;
+				builderQueries[query.name] = generatedQueryPayload;
+				legendMap[query.name] = query.legend || '';
+			});
+
+			queryData[WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME].map((formula) => {
+				const generatedFormulaPayload = {};
+				generatedFormulaPayload.queryName = formula.name;
+				generatedFormulaPayload.expression = formula.expression;
+				generatedFormulaPayload.disabled = formula.disabled;
+				builderQueries[formula.name] = generatedFormulaPayload;
+			});
+			QueryPayload.compositeMetricQuery.builderQueries = builderQueries;
+			break;
+		}
+		case EQueryType.CLICKHOUSE: {
+			const chQueries = {};
+			queryData.map((query) => {
+				if (!query.rawQuery) return;
+				chQueries[query.name] = {
+					query: query.rawQuery,
+					disabled: query.disabled,
+				};
+				legendMap[query.name] = query.legend;
+			});
+			QueryPayload.compositeMetricQuery.chQueries = chQueries;
+			break;
+		}
+		case EQueryType.PROM: {
+			const promQueries = {};
+			queryData.map((query) => {
+				if (!query.query) return;
+				promQueries[query.name] = {
+					query: query.query,
+					disabled: query.disabled,
+				};
+				legendMap[query.name] = query.legend;
+			});
+			QueryPayload.compositeMetricQuery.promQueries = promQueries;
+			break;
+		}
+		default:
+			return;
+	}
+
+	const { globalTime } = store.getState();
+
+	const minMax = GetMinMax(globalSelectedInterval, [
+		globalTime.minTime / 1000000,
+		globalTime.maxTime / 1000000,
+	]);
+
+	const getMaxMinTime = GetMaxMinTime({
+		graphType: null,
+		maxTime: minMax.maxTime,
+		minTime: minMax.minTime,
+	});
+
+	const { end, start } = GetStartAndEndTime({
+		type: selectedTime,
+		maxTime: getMaxMinTime.maxTime,
+		minTime: getMaxMinTime.minTime,
+	});
+	const response = await getMetricsQueryRange({
+		start: parseInt(start, 10) * 1e3,
+		end: parseInt(end, 10) * 1e3,
+		step: getStep({ start, end, inputFormat: 'ms' }),
+		...QueryPayload,
+	});
+	if (response.statusCode >= 400) {
+		throw new Error(
+			`API responded with ${response.statusCode} -  ${response.error}`,
+		);
+	}
+
+	if (response.payload?.data?.result) {
+		response.payload.data.result = response.payload.data.result.map(
+			(queryData) => {
+				const newQueryData = queryData;
+				newQueryData.legend = legendMap[queryData.queryName];
+				if (isEmpty(queryData.metric)) {
+					newQueryData.metric[queryData.queryName] = queryData.queryName;
+					newQueryData.legend = queryData.queryName;
+				}
+				return queryData;
+			},
+		);
+	}
+	return response;
+}
+
 export const GetQueryResults = (
 	props: GetQueryResultsProps,
 ): ((dispatch: Dispatch<AppActions>) => void) => {
 	return async (dispatch: Dispatch<AppActions>): Promise<void> => {
 		try {
-			const queryData = props.query;
+			const response = await GetMetricQueryRange(props);
 
-			const { globalTime } = store.getState();
+			const isError = response.error;
 
-			const minMax = GetMinMax(props.globalSelectedInterval, [
-				globalTime.minTime / 1000000,
-				globalTime.maxTime / 1000000,
-			]);
-
-			const getMaxMinTime = GetMaxMinTime({
-				graphType: props.graphType,
-				maxTime: minMax.maxTime,
-				minTime: minMax.minTime,
-			});
-
-			const { end, start } = GetStartAndEndTime({
-				type: props.selectedTime,
-				maxTime: getMaxMinTime.maxTime,
-				minTime: getMaxMinTime.minTime,
-			});
-
-			const response = await Promise.all(
-				queryData
-					.filter((e) => e.query)
-					.map(async (query) => {
-						const result = await getQueryResult({
-							end,
-							query: encodeURIComponent(query.query),
-							start,
-							step: `${getStep({ start, end, inputFormat: 'ms' })}`,
-						});
-						return {
-							query: query.query,
-							queryData: result,
-							legend: query.legend,
-						};
-					}),
-			);
-
-			const isError = response.find(
-				({ queryData }) => queryData.statusCode !== 200,
-			);
-
-			// want to make sure query is not empty
-			const isEmptyQuery =
-				queryData.map((e) => e.query).filter((e) => e).length ===
-				queryData.map((e) => e.query).length;
-
-			if (isError !== undefined && isEmptyQuery) {
+			if (isError != null) {
 				dispatch({
 					type: 'QUERY_ERROR',
 					payload: {
-						errorMessage: isError.queryData.error || '',
+						errorMessage: isError || '',
 						widgetId: props.widgetId,
 					},
 				});
+				return;
 			}
 
-			const data = response.map((e) => ({
-				query: e.query,
-				legend: e.legend || '',
-				queryData: e.queryData.payload?.result || [],
-			}));
+			// const data = response.map((e) => ({
+			// 	query: e.query,
+			// 	legend: e.legend || '',
+			// 	queryData: e.queryData.payload?.result || [],
+			// }));
 
 			dispatch({
 				type: 'QUERY_SUCCESS',
 				payload: {
 					widgetId: props.widgetId,
-					data,
+					data: {
+						queryData: response.payload?.data?.result
+							? response.payload?.data?.result
+							: [],
+					},
+				},
+			});
+			dispatch({
+				type: 'QUERY_ERROR',
+				payload: {
+					errorMessage: '',
+					widgetId: props.widgetId,
+					errorBoolean: false,
 				},
 			});
 		} catch (error) {
@@ -94,6 +206,7 @@ export const GetQueryResults = (
 				payload: {
 					errorMessage: (error as AxiosError).toString(),
 					widgetId: props.widgetId,
+					errorBoolean: true,
 				},
 			});
 		}
diff --git a/frontend/src/store/actions/dashboard/saveDashboard.ts b/frontend/src/store/actions/dashboard/saveDashboard.ts
index a1e28d3efe..101a7e30e0 100644
--- a/frontend/src/store/actions/dashboard/saveDashboard.ts
+++ b/frontend/src/store/actions/dashboard/saveDashboard.ts
@@ -84,7 +84,6 @@ export const SaveDashboard = ({
 			};
 
 			const allLayout = getAllLayout();
-
 			const response = await updateDashboardApi({
 				data: {
 					...selectedDashboard.data,
diff --git a/frontend/src/store/actions/dashboard/updateQuery.ts b/frontend/src/store/actions/dashboard/updateQuery.ts
index 49ff7c7439..0e00c21948 100644
--- a/frontend/src/store/actions/dashboard/updateQuery.ts
+++ b/frontend/src/store/actions/dashboard/updateQuery.ts
@@ -1,5 +1,4 @@
 import { Dispatch } from 'redux';
-import store from 'store';
 import AppActions from 'types/actions';
 import { Query } from 'types/api/dashboard/getAll';
 
@@ -7,29 +6,10 @@ export const UpdateQuery = (
 	props: UpdateQueryProps,
 ): ((dispatch: Dispatch<AppActions>) => void) => {
 	return (dispatch: Dispatch<AppActions>): void => {
-		const state = store.getState();
-		const { dashboards } = state.dashboards;
-		const [selectedDashboard] = dashboards;
-		const { data } = selectedDashboard;
-		const { widgets = [] } = data;
-		const selectedWidgetIndex = widgets.findIndex((e) => e.id === props.widgetId);
-		const selectedWidget = widgets[selectedWidgetIndex];
-		const { query } = selectedWidget;
-		const preQuery = query.slice(0, props.currentIndex);
-		const afterQuery = query.slice(props.currentIndex + 1, query.length);
-		const queryArray: Query[] = [
-			...preQuery,
-			{
-				query: props.query,
-				legend: props.legend,
-			},
-			...afterQuery,
-		];
-
 		dispatch({
 			type: 'UPDATE_QUERY',
 			payload: {
-				query: queryArray,
+				query: props.updatedQuery,
 				widgetId: props.widgetId,
 				yAxisUnit: props.yAxisUnit,
 			},
@@ -38,9 +18,10 @@ export const UpdateQuery = (
 };
 
 export interface UpdateQueryProps {
+	// query: string;
+	// legend: string;
+	// currentIndex: number;
+	updatedQuery: Query;
 	widgetId: string;
-	query: string;
-	legend: string;
-	currentIndex: number;
 	yAxisUnit: string | undefined;
 }
diff --git a/frontend/src/store/actions/dashboard/updateQueryType.ts b/frontend/src/store/actions/dashboard/updateQueryType.ts
new file mode 100644
index 0000000000..f8f4ee1b29
--- /dev/null
+++ b/frontend/src/store/actions/dashboard/updateQueryType.ts
@@ -0,0 +1,21 @@
+import { Dispatch } from 'redux';
+import AppActions from 'types/actions';
+
+export const UpdateQueryType = (
+	props: UpdateQueryTypeProps,
+): ((dispatch: Dispatch<AppActions>) => void) => {
+	return (dispatch: Dispatch<AppActions>): void => {
+		dispatch({
+			type: 'UPDATE_QUERY_TYPE',
+			payload: {
+				queryType: props.queryType,
+				widgetId: props.widgetId,
+			},
+		});
+	};
+};
+
+export interface UpdateQueryTypeProps {
+	widgetId: string;
+	queryType: number;
+}
diff --git a/frontend/src/store/reducers/dashboard.ts b/frontend/src/store/reducers/dashboard.ts
index d205341e44..4d7656993e 100644
--- a/frontend/src/store/reducers/dashboard.ts
+++ b/frontend/src/store/reducers/dashboard.ts
@@ -1,11 +1,11 @@
 import {
 	APPLY_SETTINGS_TO_PANEL,
 	CREATE_DEFAULT_WIDGET,
-	CREATE_NEW_QUERY,
 	DashboardActions,
 	DELETE_DASHBOARD_SUCCESS,
-	DELETE_QUERY,
+	// DELETE_QUERY,
 	DELETE_WIDGET_SUCCESS,
+	FLUSH_DASHBOARD,
 	GET_ALL_DASHBOARD_ERROR,
 	GET_ALL_DASHBOARD_LOADING_START,
 	GET_ALL_DASHBOARD_SUCCESS,
@@ -19,6 +19,7 @@ import {
 	TOGGLE_EDIT_MODE,
 	UPDATE_DASHBOARD,
 	UPDATE_QUERY,
+	UPDATE_QUERY_TYPE,
 	UPDATE_TITLE_DESCRIPTION_TAGS_SUCCESS,
 } from 'types/actions/dashboard';
 import InitialValueTypes from 'types/reducer/dashboards';
@@ -134,7 +135,6 @@ const dashboard = (
 		// NOTE: this action will will be dispatched in the single dashboard only
 		case CREATE_DEFAULT_WIDGET: {
 			const [selectedDashboard] = state.dashboards;
-
 			const { data } = selectedDashboard;
 			const { widgets } = data;
 			const defaultWidget = action.payload;
@@ -169,56 +169,8 @@ const dashboard = (
 			};
 		}
 
-		case CREATE_NEW_QUERY: {
-			const [selectedDashboard] = state.dashboards;
-
-			const { data } = selectedDashboard;
-			const { widgets } = data;
-			const selectedWidgetId = action.payload.widgetId;
-			const selectedWidgetIndex = data.widgets?.findIndex(
-				(e) => e.id === selectedWidgetId,
-			);
-
-			const preWidget = data.widgets?.slice(0, selectedWidgetIndex);
-			const afterWidget = data.widgets?.slice(
-				(selectedWidgetIndex || 0) + 1, // this is never undefined
-				widgets?.length,
-			);
-
-			const selectedWidget = (data.widgets || [])[selectedWidgetIndex || 0];
-
-			// this condition will never run as there will a widget with this widgetId
-			if (selectedWidget === undefined) {
-				return {
-					...state,
-				};
-			}
-
-			const newQuery = [...selectedWidget.query, { query: '', legend: '' }];
-
-			return {
-				...state,
-				dashboards: [
-					{
-						...selectedDashboard,
-						data: {
-							...data,
-							widgets: [
-								...(preWidget || []),
-								{
-									...selectedWidget,
-									query: newQuery,
-								},
-								...(afterWidget || []),
-							],
-						},
-					},
-				],
-			};
-		}
-
 		case QUERY_ERROR: {
-			const { widgetId, errorMessage } = action.payload;
+			const { widgetId, errorMessage, errorBoolean = true } = action.payload;
 
 			const [selectedDashboard] = state.dashboards;
 			const { data } = selectedDashboard;
@@ -249,7 +201,7 @@ const dashboard = (
 									...selectedWidget,
 									queryData: {
 										...selectedWidget.queryData,
-										error: true,
+										error: errorBoolean,
 										errorMessage,
 									},
 								},
@@ -291,7 +243,7 @@ const dashboard = (
 								{
 									...selectedWidget,
 									queryData: {
-										data: [...queryDataResponse],
+										data: [queryDataResponse],
 										error: selectedWidget.queryData.error,
 										errorMessage: selectedWidget.queryData.errorMessage,
 										loading: false,
@@ -370,6 +322,12 @@ const dashboard = (
 			};
 		}
 
+		case FLUSH_DASHBOARD: {
+			return {
+				...state,
+				dashboards: [],
+			};
+		}
 		case DELETE_WIDGET_SUCCESS: {
 			const { widgetId, layout } = action.payload;
 
@@ -439,9 +397,8 @@ const dashboard = (
 				],
 			};
 		}
-
-		case DELETE_QUERY: {
-			const { currentIndex, widgetId } = action.payload;
+		case UPDATE_QUERY_TYPE: {
+			const { widgetId, queryType } = action.payload;
 			const { dashboards } = state;
 			const [selectedDashboard] = dashboards;
 			const { data } = selectedDashboard;
@@ -458,11 +415,6 @@ const dashboard = (
 
 			const selectedWidget = widgets[selectedWidgetIndex];
 
-			const { query } = selectedWidget;
-
-			const preQuery = query.slice(0, currentIndex);
-			const postQuery = query.slice(currentIndex + 1, query.length);
-
 			return {
 				...state,
 				dashboards: [
@@ -474,7 +426,7 @@ const dashboard = (
 								...preWidget,
 								{
 									...selectedWidget,
-									query: [...preQuery, ...postQuery],
+									queryType,
 								},
 								...afterWidget,
 							],
@@ -484,6 +436,50 @@ const dashboard = (
 			};
 		}
 
+		// case DELETE_QUERY: {
+		// 	const { currentIndex, widgetId } = action.payload;
+		// 	const { dashboards } = state;
+		// 	const [selectedDashboard] = dashboards;
+		// 	const { data } = selectedDashboard;
+		// 	const { widgets = [] } = data;
+
+		// 	const selectedWidgetIndex = widgets.findIndex((e) => e.id === widgetId) || 0;
+
+		// 	const preWidget = widgets?.slice(0, selectedWidgetIndex) || [];
+		// 	const afterWidget =
+		// 		widgets?.slice(
+		// 			selectedWidgetIndex + 1, // this is never undefined
+		// 			widgets.length,
+		// 		) || [];
+
+		// 	const selectedWidget = widgets[selectedWidgetIndex];
+
+		// 	const { query } = selectedWidget;
+
+		// 	const preQuery = query.slice(0, currentIndex);
+		// 	const postQuery = query.slice(currentIndex + 1, query.length);
+
+		// 	return {
+		// 		...state,
+		// 		dashboards: [
+		// 			{
+		// 				...selectedDashboard,
+		// 				data: {
+		// 					...data,
+		// 					widgets: [
+		// 						...preWidget,
+		// 						{
+		// 							...selectedWidget,
+		// 							query: [...preQuery, ...postQuery],
+		// 						},
+		// 						...afterWidget,
+		// 					],
+		// 				},
+		// 			},
+		// 		],
+		// 	};
+		// }
+
 		default:
 			return state;
 	}
diff --git a/frontend/src/types/actions/dashboard.ts b/frontend/src/types/actions/dashboard.ts
index 5f60ce747d..c1051d542f 100644
--- a/frontend/src/types/actions/dashboard.ts
+++ b/frontend/src/types/actions/dashboard.ts
@@ -25,7 +25,6 @@ export const DELETE_DASHBOARD_ERROR = 'DELETE_DASHBOARD_ERROR';
 
 export const CREATE_DEFAULT_WIDGET = 'CREATE_DEFAULT_WIDGET';
 
-export const CREATE_NEW_QUERY = 'CREATE_NEW_QUERY';
 export const QUERY_SUCCESS = 'QUERY_SUCCESS';
 export const QUERY_ERROR = 'QUERY_ERROR';
 
@@ -42,7 +41,8 @@ export const DELETE_WIDGET_ERROR = 'DELETE_WIDGET_ERROR';
 export const IS_ADD_WIDGET = 'IS_ADD_WIDGET';
 
 export const DELETE_QUERY = 'DELETE_QUERY';
-
+export const UPDATE_QUERY_TYPE = 'UPDATE_QUERY_TYPE';
+export const FLUSH_DASHBOARD = 'FLUSH_DASHBOARD';
 interface GetDashboard {
 	type: typeof GET_DASHBOARD;
 	payload: Dashboard;
@@ -85,13 +85,6 @@ interface CreateDefaultWidget {
 	payload: Widgets;
 }
 
-interface CreateNewQuery {
-	type: typeof CREATE_NEW_QUERY;
-	payload: {
-		widgetId: string;
-	};
-}
-
 interface IsAddWidget {
 	type: typeof IS_ADD_WIDGET;
 	payload: {
@@ -127,7 +120,11 @@ interface ToggleEditMode {
 
 export interface QuerySuccessPayload {
 	widgetId: string;
-	data: { legend: string; queryData: QueryData[]; query: string }[];
+	data: {
+		// legend: string;
+		queryData: QueryData[];
+		// query: string
+	}[];
 }
 interface QuerySuccess {
 	type: typeof QUERY_SUCCESS;
@@ -137,7 +134,7 @@ interface QuerySuccess {
 interface UpdateQuery {
 	type: typeof UPDATE_QUERY;
 	payload: {
-		query: Query[];
+		query: Query;
 		widgetId: string;
 		yAxisUnit: string | undefined;
 	};
@@ -148,6 +145,7 @@ interface QueryError {
 	payload: {
 		errorMessage: string;
 		widgetId: string;
+		errorBoolean?: boolean;
 	};
 }
 
@@ -174,6 +172,18 @@ interface DeleteQuery {
 	payload: DeleteQueryProps;
 }
 
+interface UpdateQueryType {
+	type: typeof UPDATE_QUERY_TYPE;
+	payload: {
+		queryType: number;
+		widgetId: string;
+	};
+}
+
+interface FlushDashboard {
+	type: typeof FLUSH_DASHBOARD;
+}
+
 export type DashboardActions =
 	| GetDashboard
 	| UpdateDashboard
@@ -185,7 +195,6 @@ export type DashboardActions =
 	| UpdateDashboardTitle
 	| ToggleEditMode
 	| CreateDefaultWidget
-	| CreateNewQuery
 	| QuerySuccess
 	| QueryError
 	| ApplySettingsToPanel
@@ -193,4 +202,6 @@ export type DashboardActions =
 	| WidgetDeleteSuccess
 	| IsAddWidget
 	| UpdateQuery
-	| DeleteQuery;
+	| DeleteQuery
+	| UpdateQueryType
+	| FlushDashboard;
diff --git a/frontend/src/types/api/dashboard/getAll.ts b/frontend/src/types/api/dashboard/getAll.ts
index fa01e809fb..66710016da 100644
--- a/frontend/src/types/api/dashboard/getAll.ts
+++ b/frontend/src/types/api/dashboard/getAll.ts
@@ -1,6 +1,7 @@
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
 import { timePreferenceType } from 'container/NewWidget/RightContainer/timeItems';
 import { Layout } from 'react-grid-layout';
+import { EAggregateOperator, EQueryType } from 'types/common/dashboard';
 
 import { QueryData } from '../widgets/getQuery';
 
@@ -23,7 +24,7 @@ export interface DashboardData {
 	layout?: Layout[];
 }
 
-export interface Widgets {
+export interface IBaseWidget {
 	isStacked: boolean;
 	id: string;
 	panelTypes: GRAPH_TYPES;
@@ -32,22 +33,72 @@ export interface Widgets {
 	opacity: string;
 	nullZeroValues: string;
 	timePreferance: timePreferenceType;
-	query: Query[];
 	queryData: {
 		loading: boolean;
 		error: boolean;
 		errorMessage: string;
 		data: {
-			legend?: string;
+			// legend?: string;
 			queryData: QueryData[];
-			query: string;
+			// query: string;
 		}[];
 	};
 	stepSize?: number;
 	yAxisUnit?: string;
 }
-
-export interface Query {
-	query: string;
-	legend?: string;
+export interface Widgets extends IBaseWidget {
+	query: Query;
+}
+
+export interface PromQLWidgets extends IBaseWidget {
+	query: { query: string; legend: string }[];
+}
+export interface Query {
+	queryType: EQueryType;
+	promQL: IPromQLQuery[];
+	metricsBuilder: {
+		formulas: IMetricsBuilderFormula[];
+		queryBuilder: IMetricsBuilderQuery[];
+	};
+	clickHouse: IClickHouseQuery[];
+}
+
+export interface IMetricsBuilderFormula {
+	expression: string;
+	disabled: boolean;
+	name: string;
+}
+export interface IMetricsBuilderQuery {
+	aggregateOperator: EAggregateOperator;
+	disabled: boolean;
+	name: string;
+	legend: string;
+	metricName: string | null;
+	groupBy: string[];
+	tagFilters: IQueryBuilderTagFilters;
+}
+
+export interface IQueryBuilderTagFilters {
+	op: string;
+	items:
+		| {
+				id: string;
+				key: string;
+				op: string;
+				value: string[];
+		  }[]
+		| [];
+}
+
+export interface IClickHouseQuery {
+	name: string;
+	rawQuery: string;
+	legend: string;
+	disabled: boolean;
+}
+export interface IPromQLQuery {
+	query: string;
+	legend: string;
+	disabled: boolean;
+	name: string;
 }
diff --git a/frontend/src/types/api/dashboard/shared.ts b/frontend/src/types/api/dashboard/shared.ts
new file mode 100644
index 0000000000..31778e79bc
--- /dev/null
+++ b/frontend/src/types/api/dashboard/shared.ts
@@ -0,0 +1,5 @@
+export enum EQueryTypeToQueryKeyMapping {
+	QUERY_BUILDER = 'metricsBuilder',
+	CLICKHOUSE = 'clickHouse',
+	PROM = 'promQL',
+}
diff --git a/frontend/src/types/api/metrics/getMetricName.ts b/frontend/src/types/api/metrics/getMetricName.ts
new file mode 100644
index 0000000000..881653085c
--- /dev/null
+++ b/frontend/src/types/api/metrics/getMetricName.ts
@@ -0,0 +1,4 @@
+export type MetricNameProps = string;
+export type MetricNamesPayloadProps = {
+	data: string[];
+};
diff --git a/frontend/src/types/api/metrics/getQueryRange.ts b/frontend/src/types/api/metrics/getQueryRange.ts
new file mode 100644
index 0000000000..742a0608f0
--- /dev/null
+++ b/frontend/src/types/api/metrics/getQueryRange.ts
@@ -0,0 +1,9 @@
+import { QueryData } from '../widgets/getQuery';
+
+export type MetricsRangeProps = any;
+export interface MetricRangePayloadProps {
+	data: {
+		result: QueryData[];
+		resultType: string;
+	};
+}
diff --git a/frontend/src/types/api/metrics/getResourceAttributes.ts b/frontend/src/types/api/metrics/getResourceAttributes.ts
index 04b35255c9..8183cfbe2a 100644
--- a/frontend/src/types/api/metrics/getResourceAttributes.ts
+++ b/frontend/src/types/api/metrics/getResourceAttributes.ts
@@ -1,8 +1,15 @@
+export type TagKeyProps = {
+	match?: string;
+	metricName: string;
+};
 export type TagKeysPayloadProps = {
 	data: string[];
 };
 
-export type TagValueProps = string;
+export type TagValueProps = {
+	tagKey: string;
+	metricName: string;
+};
 export type TagValuesPayloadProps = {
 	data: string[];
 };
diff --git a/frontend/src/types/api/widgets/getQuery.ts b/frontend/src/types/api/widgets/getQuery.ts
index e6c3a3d504..6e97d116e8 100644
--- a/frontend/src/types/api/widgets/getQuery.ts
+++ b/frontend/src/types/api/widgets/getQuery.ts
@@ -8,6 +8,7 @@ export interface QueryData {
 		__name__: string;
 		[key: string]: string;
 	};
+	queryName: string;
 	values: [number, string][];
 }
 
diff --git a/frontend/src/types/common/dashboard.ts b/frontend/src/types/common/dashboard.ts
new file mode 100644
index 0000000000..c8ae2bd9d9
--- /dev/null
+++ b/frontend/src/types/common/dashboard.ts
@@ -0,0 +1,50 @@
+export enum EDataSource {
+	METRICS = 1,
+	TRACES,
+	LOGS,
+}
+
+export enum EQueryType {
+	QUERY_BUILDER = 1,
+	CLICKHOUSE,
+	PROM,
+}
+
+export enum EAggregateOperator {
+	NOOP = 1,
+	COUNT = 2,
+	COUNT_DISTINCT = 3,
+	SUM = 4,
+	AVG = 5,
+	MAX = 6,
+	MIN = 7,
+	P05 = 8,
+	P10 = 9,
+	P20 = 10,
+	P25 = 11,
+	P50 = 12,
+	P75 = 13,
+	P90 = 14,
+	P95 = 15,
+	P99 = 16,
+	RATE = 17,
+	SUM_RATE = 18,
+	// leaving gap for possible future {X}_RATE
+	RATE_SUM = 22,
+	RATE_AVG = 23,
+	RATE_MAX = 24,
+	RATE_MIN = 25,
+}
+
+export enum EPanelType {
+	TIME_SERIES = 1,
+	VALUE,
+}
+
+export enum EReduceOperator {
+	'Latest of values in timeframe' = 1, // LAST
+	'Sum of values in timeframe', // SUM
+	'Average of values in timeframe', // AVG
+	'Max of values in timeframe', // MAX
+	'Min of values in timeframe', // MIN
+}

From 282c47def841e2571c3eaf79e21b4ad6c62e336d Mon Sep 17 00:00:00 2001
From: Srikanth Chekuri <srikanth.chekuri92@gmail.com>
Date: Fri, 24 Jun 2022 15:19:20 +0530
Subject: [PATCH 34/42] chore(deps): bump github.com/SigNoz/prometheus from
 v1.9.71 to v1.9.72 (#1317)

---
 pkg/query-service/go.mod | 2 +-
 pkg/query-service/go.sum | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/pkg/query-service/go.mod b/pkg/query-service/go.mod
index 6bd0e68ead..2effc47563 100644
--- a/pkg/query-service/go.mod
+++ b/pkg/query-service/go.mod
@@ -140,4 +140,4 @@ require (
 	k8s.io/client-go v8.0.0+incompatible // indirect
 )
 
-replace github.com/prometheus/prometheus => github.com/SigNoz/prometheus v1.9.71
+replace github.com/prometheus/prometheus => github.com/SigNoz/prometheus v1.9.72
diff --git a/pkg/query-service/go.sum b/pkg/query-service/go.sum
index 72675da497..17a4a6e144 100644
--- a/pkg/query-service/go.sum
+++ b/pkg/query-service/go.sum
@@ -57,8 +57,8 @@ github.com/OneOfOne/xxhash v1.2.8 h1:31czK/TI9sNkxIKfaUfGlU47BAxQ0ztGgd9vPyqimf8
 github.com/OneOfOne/xxhash v1.2.8/go.mod h1:eZbhyaAYD41SGSSsnmcpxVoRiQ/MPUTjUdIIOT9Um7Q=
 github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb h1:bneLSKPf9YUSFmafKx32bynV6QrzViL/s+ZDvQxH1E4=
 github.com/SigNoz/govaluate v0.0.0-20220522085550-d19c08c206cb/go.mod h1:JznGDNg9x1cujDKa22RaQOimOvvEfy3nxzDGd8XDgmA=
-github.com/SigNoz/prometheus v1.9.71 h1:X+6f4k5bqX+lpPFHCi+f6XiSehTj3Yzh1B/FDJi//Sk=
-github.com/SigNoz/prometheus v1.9.71/go.mod h1:Y4J9tGDmacMC+EcOTp+EIAn2C1sN+9kE+idyVKadiVM=
+github.com/SigNoz/prometheus v1.9.72 h1:0p4ZN/NUb5jChB3blqpKKmANCAMWLp7N5L9YyyV7SQs=
+github.com/SigNoz/prometheus v1.9.72/go.mod h1:Y4J9tGDmacMC+EcOTp+EIAn2C1sN+9kE+idyVKadiVM=
 github.com/StackExchange/wmi v0.0.0-20190523213315-cbe66965904d/go.mod h1:3eOhrUMpNV+6aFIbp5/iudMxNCF27Vw2OZgy4xEx0Fg=
 github.com/alecthomas/template v0.0.0-20160405071501-a0175ee3bccc/go.mod h1:LOuyumcjzFXgccqObfd/Ljyb9UuFJ6TxHnclSeseNhc=
 github.com/alecthomas/units v0.0.0-20151022065526-2efee857e7cf/go.mod h1:ybxpYRFXyAe+OPACYpWeL0wqObRcbAqCMya13uyzqw0=

From 47e6e00a642caaea9da1288af2f6a76b675a0ee9 Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Fri, 24 Jun 2022 19:21:23 +0530
Subject: [PATCH 35/42] test: playwright github action is updated (#1286)

* test: playwright github action is updated

Co-authored-by: Pranshu Chittora <pranshu@signoz.io>
---
 .github/workflows/playwright.yaml | 18 ++++++++++--------
 frontend/playwright.config.ts     |  2 +-
 2 files changed, 11 insertions(+), 9 deletions(-)

diff --git a/.github/workflows/playwright.yaml b/.github/workflows/playwright.yaml
index be8108e6ef..0a6addfaeb 100644
--- a/.github/workflows/playwright.yaml
+++ b/.github/workflows/playwright.yaml
@@ -1,22 +1,24 @@
 name: Playwright Tests
-on:
-  deployment_status:
+on: [pull_request]
+
 jobs:
-  test:
+  playwright:
+    defaults:
+      run:
+        working-directory: frontend
     timeout-minutes: 60
     runs-on: ubuntu-latest
-    if: github.event.deployment_status.state == 'success'
     steps:
       - uses: actions/checkout@v2
       - uses: actions/setup-node@v2
         with:
-          node-version: "14.x"
+          node-version: "16.x"
       - name: Install dependencies
-        run: npm ci
+        run: CI=1 yarn install
       - name: Install Playwright
         run: npx playwright install --with-deps
       - name: Run Playwright tests
-        run: npm run test:e2e
+        run: yarn playwright
         env:
           # This might depend on your test-runner/language binding
-          PLAYWRIGHT_TEST_BASE_URL: ${{ github.event.deployment_status.target_url }}
+          PLAYWRIGHT_TEST_BASE_URL: ${{ secrets.PLAYWRIGHT_TEST_BASE_URL }}
diff --git a/frontend/playwright.config.ts b/frontend/playwright.config.ts
index 3fc61908c7..98fccbcb7f 100644
--- a/frontend/playwright.config.ts
+++ b/frontend/playwright.config.ts
@@ -11,7 +11,7 @@ const config: PlaywrightTestConfig = {
 	testDir: './tests',
 	use: {
 		trace: 'retain-on-failure',
-		baseURL: process.env.FRONTEND_API_ENDPOINT,
+		baseURL: process.env.PLAYWRIGHT_TEST_BASE_URL || 'http://localhost:3301',
 	},
 	updateSnapshots: 'all',
 	fullyParallel: false,

From d0e272b6790dfa3ee3ef7d1b51e00d0688b4c19b Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Tue, 28 Jun 2022 16:18:16 +0530
Subject: [PATCH 36/42] fix: text is updated in the light and dark mode (#1318)

---
 frontend/src/container/SideNav/index.tsx | 5 +++--
 frontend/src/container/SideNav/styles.ts | 6 ++++++
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/frontend/src/container/SideNav/index.tsx b/frontend/src/container/SideNav/index.tsx
index e322fcb7e2..fd39653cd6 100644
--- a/frontend/src/container/SideNav/index.tsx
+++ b/frontend/src/container/SideNav/index.tsx
@@ -15,6 +15,7 @@ import AppReducer from 'types/reducer/app';
 import menus from './menuItems';
 import Slack from './Slack';
 import {
+	Name,
 	RedDot,
 	Sider,
 	SlackButton,
@@ -103,8 +104,8 @@ function SideNav(): JSX.Element {
 						icon={<Icon />}
 						onClick={(): void => onClickHandler(to)}
 					>
-						<Space style={{ position: 'relative' }}>
-							<Typography>{name}</Typography>
+						<Space>
+							<Name ellipsis>{name}</Name>
 							{tags &&
 								tags.map((e) => (
 									<Tags style={{ lineHeight: '1rem' }} color="#177DDC" key={e}>
diff --git a/frontend/src/container/SideNav/styles.ts b/frontend/src/container/SideNav/styles.ts
index 688356cf7d..b7aea2fdc1 100644
--- a/frontend/src/container/SideNav/styles.ts
+++ b/frontend/src/container/SideNav/styles.ts
@@ -83,3 +83,9 @@ export const Tags = styled(Tag)`
 		border-radius: 0.5rem;
 	}
 `;
+
+export const Name = styled(Typography.Paragraph)`
+	&&& {
+		margin: 0;
+	}
+`;

From a25e7a64ceb3339b52f9666b29278151666c5f8f Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Tue, 28 Jun 2022 16:18:53 +0530
Subject: [PATCH 37/42] fix: light mode issues are fixed (#1319)

Co-authored-by: Ankit Nayan <ankit@signoz.io>
---
 frontend/src/index.html.ejs | 10 ++--------
 1 file changed, 2 insertions(+), 8 deletions(-)

diff --git a/frontend/src/index.html.ejs b/frontend/src/index.html.ejs
index c5e79d2e89..34fe2fb0c0 100644
--- a/frontend/src/index.html.ejs
+++ b/frontend/src/index.html.ejs
@@ -55,7 +55,7 @@
 			id="appMode"
 			rel="stylesheet"
 			type="text/css"
-			href="/css/antd.dark.min.css"
+			rel="preload"
 		/>
 	</head>
 	<body>
@@ -64,13 +64,7 @@
 
 		<script>
 			const themeNode = document.getElementById('appMode');
-			let userTheme;
-
-			try {
-				userTheme = localStorage.getItem('theme');
-			} catch (e) {
-				userTheme = '';
-			}
+			let userTheme = localStorage.getItem('theme') || "";
 
 			if (userTheme === 'lightMode') {
 				themeNode.setAttribute('href', '/css/antd.min.css');

From eeae71163ca973c2eed759c1b9479c88f55b4bc1 Mon Sep 17 00:00:00 2001
From: Pranshu Chittora <pranshu@signoz.io>
Date: Tue, 28 Jun 2022 16:19:46 +0530
Subject: [PATCH 38/42] fix: dashboard save layout (#1320)

Co-authored-by: Palash <palashgdev@gmail.com>
---
 .../src/container/GridGraphLayout/index.tsx   | 32 +++++++++++--------
 1 file changed, 19 insertions(+), 13 deletions(-)

diff --git a/frontend/src/container/GridGraphLayout/index.tsx b/frontend/src/container/GridGraphLayout/index.tsx
index 8f7ea56c15..d80b12f7a1 100644
--- a/frontend/src/container/GridGraphLayout/index.tsx
+++ b/frontend/src/container/GridGraphLayout/index.tsx
@@ -113,20 +113,21 @@ function GridGraph(props: Props): JSX.Element {
 					errorMessage: '',
 					loading: true,
 				}));
-
+				const updatedDashboard: Dashboard = {
+					...selectedDashboard,
+					data: {
+						title: data.title,
+						description: data.description,
+						name: data.name,
+						tags: data.tags,
+						widgets: data.widgets,
+						layout,
+					},
+					uuid: selectedDashboard.uuid,
+				};
 				// Save layout only when users has the has the permission to do so.
 				if (saveLayoutPermission) {
-					const response = await updateDashboardApi({
-						data: {
-							title: data.title,
-							description: data.description,
-							name: data.name,
-							tags: data.tags,
-							widgets: data.widgets,
-							layout,
-						},
-						uuid: selectedDashboard.uuid,
-					});
+					const response = await updateDashboardApi(updatedDashboard);
 					if (response.statusCode === 200) {
 						setSaveLayoutState((state) => ({
 							...state,
@@ -134,6 +135,10 @@ function GridGraph(props: Props): JSX.Element {
 							errorMessage: '',
 							loading: false,
 						}));
+						dispatch({
+							type: UPDATE_DASHBOARD,
+							payload: updatedDashboard,
+						});
 					} else {
 						setSaveLayoutState((state) => ({
 							...state,
@@ -153,8 +158,9 @@ function GridGraph(props: Props): JSX.Element {
 			data.tags,
 			data.title,
 			data.widgets,
+			dispatch,
 			saveLayoutPermission,
-			selectedDashboard.uuid,
+			selectedDashboard,
 		],
 	);
 

From 6dbc11991bb291c5c77b945a7eda0cf44b1de9ac Mon Sep 17 00:00:00 2001
From: Palash <palashgdev@gmail.com>
Date: Tue, 28 Jun 2022 16:20:18 +0530
Subject: [PATCH 39/42] feat: service map color is updated according to the
 darkMode (#1324)

---
 frontend/src/modules/Servicemap/ServiceMap.tsx | 5 ++---
 frontend/src/modules/Servicemap/utils.ts       | 9 ++++-----
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/frontend/src/modules/Servicemap/ServiceMap.tsx b/frontend/src/modules/Servicemap/ServiceMap.tsx
index ffbe2929ea..03256dde59 100644
--- a/frontend/src/modules/Servicemap/ServiceMap.tsx
+++ b/frontend/src/modules/Servicemap/ServiceMap.tsx
@@ -92,7 +92,7 @@ function ServiceMap(props: ServiceMapProps): JSX.Element {
 		fgRef && fgRef.current && fgRef.current.zoomToFit(100, 120);
 	};
 
-	const { nodes, links } = getGraphData(serviceMap);
+	const { nodes, links } = getGraphData(serviceMap, isDarkMode);
 	const graphData = { nodes, links };
 	return (
 		<Container>
@@ -109,7 +109,7 @@ function ServiceMap(props: ServiceMapProps): JSX.Element {
 				linkAutoColorBy={(d) => d.target}
 				linkDirectionalParticles="value"
 				linkDirectionalParticleSpeed={(d) => d.value}
-				nodeCanvasObject={(node, ctx, globalScale) => {
+				nodeCanvasObject={(node, ctx) => {
 					const label = transformLabel(node.id);
 					const { fontSize } = node;
 					ctx.font = `${fontSize}px Roboto`;
@@ -118,7 +118,6 @@ function ServiceMap(props: ServiceMapProps): JSX.Element {
 					ctx.fillStyle = node.color;
 					ctx.beginPath();
 					ctx.arc(node.x, node.y, width, 0, 2 * Math.PI, false);
-					ctx.fillStyle = isDarkMode ? '#3C8618' : '#D5F2BB';
 					ctx.fill();
 					ctx.textAlign = 'center';
 					ctx.textBaseline = 'middle';
diff --git a/frontend/src/modules/Servicemap/utils.ts b/frontend/src/modules/Servicemap/utils.ts
index 21b93952a8..6bec25f8a6 100644
--- a/frontend/src/modules/Servicemap/utils.ts
+++ b/frontend/src/modules/Servicemap/utils.ts
@@ -2,7 +2,6 @@
 //@ts-nocheck
 
 import { cloneDeep, find, maxBy, uniq, uniqBy } from 'lodash-es';
-
 import { graphDataType } from './ServiceMap';
 
 const MIN_WIDTH = 10;
@@ -18,7 +17,7 @@ export const getDimensions = (num, highest) => {
 	};
 };
 
-export const getGraphData = (serviceMap): graphDataType => {
+export const getGraphData = (serviceMap, isDarkMode): graphDataType => {
 	const { items, services } = serviceMap;
 	const highestCallCount = maxBy(items, (e) => e?.callCount)?.callCount;
 	const highestCallRate = maxBy(services, (e) => e?.callRate)?.callRate;
@@ -39,7 +38,7 @@ export const getGraphData = (serviceMap): graphDataType => {
 	const uniqNodes = uniq([...uniqParent, ...uniqChild]);
 	const nodes = uniqNodes.map((node, i) => {
 		const service = find(services, (service) => service.serviceName === node);
-		let color = '#88CEA5';
+		let color = isDarkMode ? '#7CA568' : '#D5F2BB';
 		if (!service) {
 			return {
 				id: node,
@@ -54,9 +53,9 @@ export const getGraphData = (serviceMap): graphDataType => {
 			};
 		}
 		if (service.errorRate > 0) {
-			color = '#F98989';
+			color = isDarkMode ? '#DB836E' : '#F98989';
 		} else if (service.fourXXRate > 0) {
-			color = '#F9DA7B';
+			color = isDarkMode ? '#C79931' : '#F9DA7B';
 		}
 		const { fontSize, width } = getDimensions(service.callRate, highestCallRate);
 		return {

From ba7427f2806a4b97e60e3091de738feb9dd5d29c Mon Sep 17 00:00:00 2001
From: Pranshu Chittora <pranshu@signoz.io>
Date: Tue, 28 Jun 2022 17:32:02 +0530
Subject: [PATCH 40/42] feat: Metrics Builder Enhancements and Code Cleanup
 (#1325)

* feat: improved ts typings
* chore: remove uncommented code
---
 frontend/src/components/TextToolTip/index.tsx |   5 +-
 .../src/container/GridGraphLayout/utils.ts    |   9 +-
 .../ListOfDashboard/ImportJSON/index.tsx      |   5 +-
 .../MetricsApplication/Tabs/DBCall.tsx        |   2 +-
 .../MetricsApplication/Tabs/External.tsx      |   2 +-
 .../MetricsApplication/Tabs/Overview.tsx      |   6 +-
 .../container/MetricsApplication/index.tsx    |   2 +-
 .../QuerySection/QueryBuilder/Options.ts      |   2 +-
 .../QuerySection/QueryBuilder/QueryHeader.tsx |  10 +-
 .../QueryBuilder/clickHouse/index.tsx         |  14 ++-
 .../QueryBuilder/clickHouse/query.tsx         |  11 +-
 .../QueryBuilder/clickHouse/types.ts          |   9 ++
 .../QuerySection/QueryBuilder/index.tsx       |  95 ----------------
 .../QueryBuilder/promQL/index.tsx             |  19 +++-
 .../QueryBuilder/promQL/query.tsx             |  10 +-
 .../QuerySection/QueryBuilder/promQL/types.ts |   9 ++
 .../MetricTagKeyFilter/QueryChip.tsx          |   9 +-
 .../queryBuilder/MetricTagKeyFilter/index.tsx |  34 +++---
 .../queryBuilder/MetricTagKeyFilter/styles.ts |   2 +-
 .../queryBuilder/MetricTagKeyFilter/types.ts  |   7 ++
 .../queryBuilder/MetricTagKeyFilter/utils.ts  |   8 +-
 .../QueryBuilder/queryBuilder/formula.tsx     |   9 +-
 .../QueryBuilder/queryBuilder/index.tsx       |  37 +++++--
 .../QueryBuilder/queryBuilder/query.tsx       |  52 +++++----
 .../QueryBuilder/queryBuilder/types.ts        |  23 ++++
 .../QueryBuilder/queryBuilder/utils.ts        |   4 +-
 .../LeftContainer/QuerySection/TabHeader.tsx  |  10 +-
 .../LeftContainer/QuerySection/constants.ts   |  16 ++-
 .../LeftContainer/QuerySection/index.tsx      | 104 +++++++-----------
 .../LeftContainer/QuerySection/types.ts       |   6 +
 .../QuerySection/utils/getQueryKey.ts         |   8 +-
 .../NewWidget/LeftContainer/QueryTypeTag.tsx  |   2 +-
 .../LeftContainer/WidgetGraph/PlotTag.tsx     |   7 +-
 .../LeftContainer/WidgetGraph/WidgetGraph.tsx |   5 +-
 frontend/src/container/NewWidget/index.tsx    |   4 +-
 frontend/src/lib/getChartData.ts              |  43 ++++----
 frontend/src/lib/query/GetFormulaName.ts      |   8 +-
 frontend/src/lib/query/GetQueryName.ts        |  10 +-
 .../store/actions/dashboard/createQuery.ts    |  17 ---
 .../store/actions/dashboard/getDashboard.ts   |   9 +-
 .../actions/dashboard/getQueryResults.ts      |  13 +--
 frontend/src/store/actions/dashboard/index.ts |   1 -
 .../store/actions/dashboard/saveDashboard.ts  |   7 --
 .../actions/dashboard/updateQueryType.ts      |  21 ----
 frontend/src/store/reducers/dashboard.ts      |  86 +--------------
 frontend/src/types/actions/dashboard.ts       |  12 +-
 frontend/src/types/api/dashboard/getAll.ts    |  15 ++-
 .../src/types/api/metrics/getQueryRange.ts    |   2 +-
 frontend/src/types/api/widgets/getQuery.ts    |   1 +
 49 files changed, 353 insertions(+), 449 deletions(-)
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/types.ts
 delete mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/types.ts
 create mode 100644 frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/types.ts
 delete mode 100644 frontend/src/store/actions/dashboard/createQuery.ts
 delete mode 100644 frontend/src/store/actions/dashboard/updateQueryType.ts

diff --git a/frontend/src/components/TextToolTip/index.tsx b/frontend/src/components/TextToolTip/index.tsx
index 06802b475f..60032ab5c9 100644
--- a/frontend/src/components/TextToolTip/index.tsx
+++ b/frontend/src/components/TextToolTip/index.tsx
@@ -24,8 +24,11 @@ function TextToolTip({ text, url }: TextToolTipProps): JSX.Element {
 	);
 }
 
+TextToolTip.defaultProps = {
+	url: '',
+};
 interface TextToolTipProps {
-	url: string;
+	url?: string;
 	text: string;
 }
 
diff --git a/frontend/src/container/GridGraphLayout/utils.ts b/frontend/src/container/GridGraphLayout/utils.ts
index c2c762e1f7..0d7320f6f5 100644
--- a/frontend/src/container/GridGraphLayout/utils.ts
+++ b/frontend/src/container/GridGraphLayout/utils.ts
@@ -36,18 +36,17 @@ export const UpdateDashboard = async ({
 					nullZeroValues: '',
 					opacity: '',
 					panelTypes: graphType,
-					queryType: 0,
 					query: {
 						queryType: EQueryType.QUERY_BUILDER,
 						promQL: [
 							{
-								name: GetQueryName([]),
+								name: GetQueryName([]) || '',
 								...PromQLQueryTemplate,
 							},
 						],
 						clickHouse: [
 							{
-								name: GetQueryName([]),
+								name: GetQueryName([]) || '',
 								...ClickHouseQueryTemplate,
 							},
 						],
@@ -55,14 +54,14 @@ export const UpdateDashboard = async ({
 							formulas: [],
 							queryBuilder: [
 								{
-									name: GetQueryName([]),
+									name: GetQueryName([]) || '',
 									...QueryBuilderQueryTemplate,
 								},
 							],
 						},
 					},
 					queryData: {
-						data: [],
+						data: { queryData: [] },
 						error: false,
 						errorMessage: '',
 						loading: false,
diff --git a/frontend/src/container/ListOfDashboard/ImportJSON/index.tsx b/frontend/src/container/ListOfDashboard/ImportJSON/index.tsx
index 99f5fb0eeb..021a5f9805 100644
--- a/frontend/src/container/ListOfDashboard/ImportJSON/index.tsx
+++ b/frontend/src/container/ListOfDashboard/ImportJSON/index.tsx
@@ -73,10 +73,7 @@ function ImportJSON({
 					...e,
 					queryData: {
 						...e.queryData,
-						data: e.queryData.data.map((queryData) => ({
-							...queryData,
-							queryData: [],
-						})),
+						data: e.queryData.data,
 						error: false,
 						errorMessage: '',
 						loading: false,
diff --git a/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx b/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx
index b5466f2b02..60441b7876 100644
--- a/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx
+++ b/frontend/src/container/MetricsApplication/Tabs/DBCall.tsx
@@ -4,7 +4,7 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import { AppState } from 'store/reducers';
-import { PromQLWidgets, Widgets } from 'types/api/dashboard/getAll';
+import { PromQLWidgets } from 'types/api/dashboard/getAll';
 import MetricReducer from 'types/reducer/metrics';
 
 import { Card, GraphContainer, GraphTitle, Row } from '../styles';
diff --git a/frontend/src/container/MetricsApplication/Tabs/External.tsx b/frontend/src/container/MetricsApplication/Tabs/External.tsx
index 2974ba3f38..9811e2f269 100644
--- a/frontend/src/container/MetricsApplication/Tabs/External.tsx
+++ b/frontend/src/container/MetricsApplication/Tabs/External.tsx
@@ -29,7 +29,7 @@ function External({ getWidget }: ExternalProps): JSX.Element {
 								widget={getWidget([
 									{
 										query: `max((sum(rate(signoz_external_call_latency_count{service_name="${servicename}", status_code="STATUS_CODE_ERROR"${resourceAttributePromQLQuery}}[1m]) OR rate(signoz_external_call_latency_count{service_name="${servicename}", http_status_code=~"5.."${resourceAttributePromQLQuery}}[1m]) OR vector(0)) by (http_url))*100/sum(rate(signoz_external_call_latency_count{service_name="${servicename}"${resourceAttributePromQLQuery}}[1m])) by (http_url)) < 1000 OR vector(0)`,
-										legend,
+										legend: 'External Call Error Percentage',
 									},
 								])}
 								yAxisUnit="%"
diff --git a/frontend/src/container/MetricsApplication/Tabs/Overview.tsx b/frontend/src/container/MetricsApplication/Tabs/Overview.tsx
index a24e67aeb7..a53714d05d 100644
--- a/frontend/src/container/MetricsApplication/Tabs/Overview.tsx
+++ b/frontend/src/container/MetricsApplication/Tabs/Overview.tsx
@@ -42,7 +42,8 @@ function Application({ getWidget }: DashboardProps): JSX.Element {
 		urlParams.set(METRICS_PAGE_QUERY_PARAM.endTime, tPlusOne.toString());
 
 		history.replace(
-			`${ROUTES.TRACE
+			`${
+				ROUTES.TRACE
 			}?${urlParams.toString()}&selected={"serviceName":["${servicename}"]}&filterToFetchData=["duration","status","serviceName"]&spanAggregateCurrentPage=1&selectedTags=${selectedTraceTags}&&isFilterExclude={"serviceName":false}&userSelectedFilter={"status":["error","ok"],"serviceName":["${servicename}"]}&spanAggregateCurrentPage=1&spanAggregateOrder=ascend`,
 		);
 	};
@@ -93,7 +94,8 @@ function Application({ getWidget }: DashboardProps): JSX.Element {
 		urlParams.set(METRICS_PAGE_QUERY_PARAM.endTime, tPlusOne.toString());
 
 		history.replace(
-			`${ROUTES.TRACE
+			`${
+				ROUTES.TRACE
 			}?${urlParams.toString()}?selected={"serviceName":["${servicename}"],"status":["error"]}&filterToFetchData=["duration","status","serviceName"]&spanAggregateCurrentPage=1&selectedTags=${selectedTraceTags}&isFilterExclude={"serviceName":false,"status":false}&userSelectedFilter={"serviceName":["${servicename}"],"status":["error"]}&spanAggregateCurrentPage=1&spanAggregateOrder=ascend`,
 		);
 	};
diff --git a/frontend/src/container/MetricsApplication/index.tsx b/frontend/src/container/MetricsApplication/index.tsx
index aeaf4a5664..f6305358b3 100644
--- a/frontend/src/container/MetricsApplication/index.tsx
+++ b/frontend/src/container/MetricsApplication/index.tsx
@@ -20,7 +20,7 @@ const getWidget = (query: PromQLWidgets['query']): PromQLWidgets => {
 		panelTypes: 'TIME_SERIES',
 		query,
 		queryData: {
-			data: [],
+			data: { queryData: [] },
 			error: false,
 			errorMessage: '',
 			loading: false,
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts
index 80a14f173b..38d9094dcc 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/Options.ts
@@ -5,7 +5,7 @@ export const AggregateFunctions = Object.keys(EAggregateOperator)
 	.map((key) => {
 		return {
 			label: key,
-			value: EAggregateOperator[key],
+			value: EAggregateOperator[key as keyof typeof EAggregateOperator],
 		};
 	});
 
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx
index 9164c532af..6584cdc390 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/QueryHeader.tsx
@@ -10,13 +10,21 @@ import React, { useState } from 'react';
 
 import { QueryWrapper } from '../styles';
 
+interface IQueryHeaderProps {
+	disabled: boolean;
+	onDisable: VoidFunction;
+	name: string;
+	onDelete: VoidFunction;
+	children: React.ReactNode;
+}
+
 function QueryHeader({
 	disabled,
 	onDisable,
 	name,
 	onDelete,
 	children,
-}): JSX.Element {
+}: IQueryHeaderProps): JSX.Element {
 	const [collapse, setCollapse] = useState(false);
 	return (
 		<QueryWrapper>
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx
index cabd7470b8..b2712c86ae 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/index.tsx
@@ -2,23 +2,31 @@ import { PlusOutlined } from '@ant-design/icons';
 import { ClickHouseQueryTemplate } from 'constants/dashboard';
 import GetQueryName from 'lib/query/GetQueryName';
 import React from 'react';
+import { Query } from 'types/api/dashboard/getAll';
 
 import { WIDGET_CLICKHOUSE_QUERY_KEY_NAME } from '../../constants';
 import { QueryButton } from '../../styles';
+import { IHandleUpdatedQuery } from '../../types';
 import ClickHouseQueryBuilder from './query';
+import { IClickHouseQueryHandleChange } from './types';
 
+interface IClickHouseQueryContainerProps {
+	queryData: Query;
+	updateQueryData: (args: IHandleUpdatedQuery) => void;
+	clickHouseQueries: Query['clickHouse'];
+}
 function ClickHouseQueryContainer({
 	queryData,
 	updateQueryData,
 	clickHouseQueries,
-}): JSX.Element | null {
+}: IClickHouseQueryContainerProps): JSX.Element | null {
 	const handleClickHouseQueryChange = ({
 		queryIndex,
 		rawQuery,
 		legend,
 		toggleDisable,
 		toggleDelete,
-	}): void => {
+	}: IClickHouseQueryHandleChange): void => {
 		const allQueries = queryData[WIDGET_CLICKHOUSE_QUERY_KEY_NAME];
 		const currentIndexQuery = allQueries[queryIndex];
 
@@ -40,7 +48,7 @@ function ClickHouseQueryContainer({
 	};
 	const addQueryHandler = (): void => {
 		queryData[WIDGET_CLICKHOUSE_QUERY_KEY_NAME].push({
-			name: GetQueryName(queryData[WIDGET_CLICKHOUSE_QUERY_KEY_NAME]),
+			name: GetQueryName(queryData[WIDGET_CLICKHOUSE_QUERY_KEY_NAME]) || '',
 			...ClickHouseQueryTemplate,
 		});
 		updateQueryData({ updatedQuery: { ...queryData } });
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx
index f51ffbf08b..7e9a3df0c2 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/query.tsx
@@ -1,14 +1,22 @@
 import { Input } from 'antd';
 import MonacoEditor from 'components/Editor';
 import React from 'react';
+import { IClickHouseQuery } from 'types/api/dashboard/getAll';
 
 import QueryHeader from '../QueryHeader';
+import { IClickHouseQueryHandleChange } from './types';
+
+interface IClickHouseQueryBuilderProps {
+	queryData: IClickHouseQuery;
+	queryIndex: number;
+	handleQueryChange: (args: IClickHouseQueryHandleChange) => void;
+}
 
 function ClickHouseQueryBuilder({
 	queryData,
 	queryIndex,
 	handleQueryChange,
-}): JSX.Element | null {
+}: IClickHouseQueryBuilderProps): JSX.Element | null {
 	if (queryData === undefined) {
 		return null;
 	}
@@ -26,7 +34,6 @@ function ClickHouseQueryBuilder({
 		>
 			<MonacoEditor
 				language="sql"
-				theme="vs-dark"
 				height="200px"
 				onChange={(value): void =>
 					handleQueryChange({ queryIndex, rawQuery: value })
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/types.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/types.ts
new file mode 100644
index 0000000000..6e0d21b206
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/clickHouse/types.ts
@@ -0,0 +1,9 @@
+import { IClickHouseQuery } from 'types/api/dashboard/getAll';
+
+export interface IClickHouseQueryHandleChange {
+	queryIndex: number;
+	rawQuery?: IClickHouseQuery['rawQuery'];
+	legend?: IClickHouseQuery['legend'];
+	toggleDisable?: IClickHouseQuery['disabled'];
+	toggleDelete?: boolean;
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx
deleted file mode 100644
index ba01fb0389..0000000000
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/index.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import {
-	DeleteOutlined,
-	DownOutlined,
-	EyeFilled,
-	RightOutlined,
-} from '@ant-design/icons';
-import { Button, Row } from 'antd';
-import MonacoEditor from 'components/Editor';
-import React, { useState } from 'react';
-import { useSelector } from 'react-redux';
-import { AppState } from 'store/reducers';
-import AppReducer from 'types/reducer/app';
-
-import { QueryBuilderWrapper, QueryWrapper } from '../styles';
-import { TQueryCategories } from '../types';
-import PromQLQueryBuilder from './promQL/promQL';
-import MetricsBuilder from './queryBuilder/query';
-
-function QueryBuilder({
-	name,
-	onDelete,
-	queryCategory,
-	queryData,
-	updateQueryData,
-}: QueryBuilderProps): JSX.Element {
-	const { isDarkMode } = useSelector<AppState, AppReducer>((state) => state.app);
-	const [hideFromUI, setHideFromUI] = useState<boolean>(false);
-	const handleHideFromUI = (): void => {
-		setHideFromUI(!hideFromUI);
-	};
-	const handleClickhouseQueryChange = (clickHouseQuery): void => {
-		if (clickHouseQuery !== null) {
-			queryData.clickHouseQuery = clickHouseQuery;
-		}
-		updateQueryData(queryData);
-	};
-	const handlePromQLQueryChange = ({ query, legend }): void => {
-		if (query) queryData.promQL.query = query;
-		if (legend) queryData.promQL.legend = legend;
-
-		updateQueryData(queryData);
-	};
-
-	return (
-		<QueryWrapper>
-			<Row style={{ justifyContent: 'space-between' }}>
-				<Row>
-					<Button type="ghost" icon={<EyeFilled />}>
-						{name}
-					</Button>
-					<Button
-						type="ghost"
-						icon={hideFromUI ? <RightOutlined /> : <DownOutlined />}
-						onClick={handleHideFromUI}
-					/>
-				</Row>
-
-				<Button type="ghost" danger icon={<DeleteOutlined />} onClick={onDelete} />
-			</Row>
-			{!hideFromUI && (
-				<QueryBuilderWrapper isDarkMode={isDarkMode}>
-					{queryCategory === 0 ? (
-						<MetricsBuilder
-							queryData={queryData}
-							updateQueryData={updateQueryData}
-							metricName={queryData.queryBuilder.metricName}
-						/>
-					) : queryCategory === 1 ? (
-						<MonacoEditor
-							language="sql"
-							theme="vs-dark"
-							height="200px"
-							onChange={handleClickhouseQueryChange}
-							value={queryData.clickHouseQuery}
-							// options={options}
-						/>
-					) : queryCategory === 2 ? (
-						<PromQLQueryBuilder
-							query={queryData.promQL.query}
-							onQueryChange={(value) => handlePromQLQueryChange({ query: value })}
-							legend={queryData.promQL.legend}
-							onLegendChange={(value) => handlePromQLQueryChange({ legend: value })}
-						/>
-					) : null}
-				</QueryBuilderWrapper>
-			)}
-		</QueryWrapper>
-	);
-}
-
-interface QueryBuilderProps {
-	queryCategory: TQueryCategories;
-	name: string;
-}
-export default QueryBuilder;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx
index 58d8685a15..1d96297d04 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/index.tsx
@@ -2,25 +2,32 @@ import { PlusOutlined } from '@ant-design/icons';
 import { PromQLQueryTemplate } from 'constants/dashboard';
 import GetQueryName from 'lib/query/GetQueryName';
 import React from 'react';
+import { IPromQLQuery, Query } from 'types/api/dashboard/getAll';
 
 import { WIDGET_PROMQL_QUERY_KEY_NAME } from '../../constants';
 import { QueryButton } from '../../styles';
+import { IHandleUpdatedQuery } from '../../types';
 import PromQLQueryBuilder from './query';
+import { IPromQLQueryHandleChange } from './types';
+
+interface IPromQLQueryContainerProps {
+	queryData: Query;
+	updateQueryData: (args: IHandleUpdatedQuery) => void;
+	promQLQueries: IPromQLQuery[];
+}
 
 function PromQLQueryContainer({
 	queryData,
 	updateQueryData,
 	promQLQueries,
-	onQueryChange,
-	onQueryAdd,
-}): JSX.Element | null {
+}: IPromQLQueryContainerProps): JSX.Element | null {
 	const handlePromQLQueryChange = ({
 		queryIndex,
 		query,
 		legend,
 		toggleDisable,
 		toggleDelete,
-	}): void => {
+	}: IPromQLQueryHandleChange): void => {
 		const allQueries = queryData[WIDGET_PROMQL_QUERY_KEY_NAME];
 		const currentIndexQuery = allQueries[queryIndex];
 		if (query) currentIndexQuery.query = query;
@@ -36,7 +43,7 @@ function PromQLQueryContainer({
 	};
 	const addQueryHandler = (): void => {
 		queryData[WIDGET_PROMQL_QUERY_KEY_NAME].push({
-			name: GetQueryName(queryData[WIDGET_PROMQL_QUERY_KEY_NAME]),
+			name: GetQueryName(queryData[WIDGET_PROMQL_QUERY_KEY_NAME]) || '',
 			...PromQLQueryTemplate,
 		});
 		updateQueryData({ updatedQuery: { ...queryData } });
@@ -48,7 +55,7 @@ function PromQLQueryContainer({
 	return (
 		<>
 			{promQLQueries.map(
-				(q, idx): JSX.Element => (
+				(q: IPromQLQuery, idx: number): JSX.Element => (
 					<PromQLQueryBuilder
 						key={q.name}
 						queryIndex={idx}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx
index 26c089b20b..1a6dd2f9d2 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/query.tsx
@@ -1,13 +1,21 @@
 import { Input } from 'antd';
 import React from 'react';
+import { IPromQLQuery } from 'types/api/dashboard/getAll';
 
 import QueryHeader from '../QueryHeader';
+import { IPromQLQueryHandleChange } from './types';
+
+interface IPromQLQueryBuilderProps {
+	queryData: IPromQLQuery;
+	queryIndex: number;
+	handleQueryChange: (args: IPromQLQueryHandleChange) => void;
+}
 
 function PromQLQueryBuilder({
 	queryData,
 	queryIndex,
 	handleQueryChange,
-}): JSX.Element {
+}: IPromQLQueryBuilderProps): JSX.Element {
 	return (
 		<QueryHeader
 			name={queryData.name}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/types.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/types.ts
new file mode 100644
index 0000000000..f1c88dd488
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/promQL/types.ts
@@ -0,0 +1,9 @@
+import { IPromQLQuery } from 'types/api/dashboard/getAll';
+
+export interface IPromQLQueryHandleChange {
+	queryIndex: number;
+	query?: IPromQLQuery['query'];
+	legend?: IPromQLQuery['legend'];
+	toggleDisable?: IPromQLQuery['disabled'];
+	toggleDelete?: boolean;
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx
index 72da49ae49..e992536b74 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/QueryChip.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 
 import { QueryChipContainer, QueryChipItem } from './styles';
-import { IMetricBuilderTagKeyQuery } from './types';
+import { ITagKeyValueQuery } from './types';
 
 interface IQueryChipProps {
-	queryData: IMetricBuilderTagKeyQuery;
+	queryData: ITagKeyValueQuery;
 	onClose: (id: string) => void;
-	disabled: boolean;
+	disabled?: boolean;
 }
 
 export default function QueryChip({
@@ -29,3 +29,6 @@ export default function QueryChip({
 		</QueryChipContainer>
 	);
 }
+QueryChip.defaultProps = {
+	disabled: false,
+};
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx
index ee58974549..c83052cb22 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/index.tsx
@@ -5,13 +5,14 @@ import { map } from 'lodash-es';
 import React, { useCallback, useEffect, useState } from 'react';
 import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
+import { IMetricsBuilderQuery } from 'types/api/dashboard/getAll';
 import AppReducer from 'types/reducer/app';
 import { v4 as uuid } from 'uuid';
 
 import { ResourceAttributesFilterMachine } from './MetricTagKey.machine';
 import QueryChip from './QueryChip';
 import { QueryChipItem, SearchContainer } from './styles';
-import { IMetricBuilderTagKeyQuery, IOption } from './types';
+import { IOption, ITagKeyValueQuery } from './types';
 import {
 	createQuery,
 	GetTagKeys,
@@ -20,16 +21,22 @@ import {
 	SingleValueOperators,
 } from './utils';
 
+interface IMetricTagKeyFilterProps {
+	metricName: IMetricsBuilderQuery['metricName'];
+	onSetQuery: (args: IMetricsBuilderQuery['tagFilters']['items']) => void;
+	selectedTagFilters: IMetricsBuilderQuery['tagFilters']['items'];
+}
+
 function MetricTagKeyFilter({
 	metricName,
 	onSetQuery,
 	selectedTagFilters: selectedTagQueries,
-}): JSX.Element | null {
+}: IMetricTagKeyFilterProps): JSX.Element | null {
 	const { isDarkMode } = useSelector<AppState, AppReducer>((state) => state.app);
 	const [loading, setLoading] = useState(true);
 	const [selectedValues, setSelectedValues] = useState<string[]>([]);
 	const [staging, setStaging] = useState<string[]>([]);
-	const [queries, setQueries] = useState<IMetricBuilderTagKeyQuery[]>([]);
+	const [queries, setQueries] = useState<ITagKeyValueQuery[]>([]);
 	const [optionsData, setOptionsData] = useState<{
 		mode: undefined | 'tags' | 'multiple';
 		options: IOption[];
@@ -39,7 +46,7 @@ function MetricTagKeyFilter({
 	});
 
 	const dispatchQueries = (
-		updatedQueries: IMetricBuilderTagKeyQuery[],
+		updatedQueries: IMetricsBuilderQuery['tagFilters']['items'],
 	): void => {
 		onSetQuery(updatedQueries);
 		setQueries(updatedQueries);
@@ -54,7 +61,7 @@ function MetricTagKeyFilter({
 		actions: {
 			onSelectTagKey: () => {
 				handleLoading(true);
-				GetTagKeys(metricName)
+				GetTagKeys(metricName || '')
 					.then((tagKeys) => setOptionsData({ options: tagKeys, mode: undefined }))
 					.finally(() => {
 						handleLoading(false);
@@ -66,7 +73,7 @@ function MetricTagKeyFilter({
 			onSelectTagValue: () => {
 				handleLoading(true);
 
-				GetTagValues(staging[0], metricName)
+				GetTagValues(staging[0], metricName || '')
 					.then((tagValuesOptions) =>
 						setOptionsData({ options: tagValuesOptions, mode: 'tags' }),
 					)
@@ -113,16 +120,17 @@ function MetricTagKeyFilter({
 		handleBlur();
 	}, [handleBlur, metricName]);
 
-	const handleChange = (value: never): void => {
+	const handleChange = (value: never | string[]): void => {
 		if (!optionsData.mode) {
-			setStaging((prevStaging) => [...prevStaging, value]);
+			setStaging((prevStaging) => [...prevStaging, String(value)]);
 			setSelectedValues([]);
 			send('NEXT');
 			return;
 		}
 		if (
 			state.value === 'TagValue' &&
-			SingleValueOperators.includes(staging[staging.length - 1])
+			SingleValueOperators.includes(staging[staging.length - 1]) &&
+			Array.isArray(value)
 		) {
 			setSelectedValues([value[value.length - 1]]);
 			return;
@@ -142,12 +150,6 @@ function MetricTagKeyFilter({
 		setSelectedValues([]);
 	};
 
-	const disabledOrEmpty = !!(
-		queries.length ||
-		staging.length ||
-		selectedValues.length
-	);
-
 	return (
 		<SearchContainer isDarkMode={isDarkMode}>
 			<div style={{ display: 'inline-flex', flexWrap: 'wrap' }}>
@@ -162,7 +164,7 @@ function MetricTagKeyFilter({
 					)}
 			</div>
 			<div>
-				{map(staging, (item, idx) => {
+				{map(staging, (item) => {
 					return <QueryChipItem key={uuid()}>{item}</QueryChipItem>;
 				})}
 			</div>
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts
index 035dca4dd7..fcb7e20372 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/styles.ts
@@ -4,7 +4,7 @@ import styled from 'styled-components';
 
 export const SearchContainer = styled.div<{
 	isDarkMode: boolean;
-	disabled: boolean;
+	disabled?: boolean;
 }>`
 	background: ${({ isDarkMode }): string => (isDarkMode ? '#000' : '#fff')};
 	flex: 1;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts
index 4eb8bb719c..89340d6cbe 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/types.ts
@@ -9,3 +9,10 @@ export interface IMetricBuilderTagKeyQuery {
 	operator: string;
 	tagValue: string[];
 }
+
+export interface ITagKeyValueQuery {
+	id: string;
+	key: string;
+	op: string;
+	value: string[];
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts
index 685d05d095..ba3ce8bca9 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/MetricTagKeyFilter/utils.ts
@@ -5,7 +5,7 @@ import {
 import { v4 as uuid } from 'uuid';
 
 import { TagKeyOperator } from '../../Options';
-import { IMetricBuilderTagKeyQuery, IOption } from './types';
+import { IOption, ITagKeyValueQuery } from './types';
 
 export const OperatorSchema: IOption[] = TagKeyOperator;
 
@@ -40,12 +40,12 @@ export const GetTagValues = async (
 
 export const createQuery = (
 	selectedItems: Array<string | string[]> = [],
-): IMetricBuilderTagKeyQuery | null => {
+): ITagKeyValueQuery | null => {
 	if (selectedItems.length === 3) {
 		return {
 			id: uuid().slice(0, 8),
-			key: selectedItems[0] as string,
-			op: selectedItems[1] as string,
+			key: typeof selectedItems[0] === 'string' ? selectedItems[0] : '',
+			op: typeof selectedItems[1] === 'string' ? selectedItems[1] : '',
 			value: selectedItems[2] as string[],
 		};
 	}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx
index bc47ddf33c..5be08f044e 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/formula.tsx
@@ -1,15 +1,22 @@
 import { Input } from 'antd';
 import React from 'react';
+import { IMetricsBuilderFormula } from 'types/api/dashboard/getAll';
 
 import QueryHeader from '../QueryHeader';
+import { IQueryBuilderFormulaHandleChange } from './types';
 
 const { TextArea } = Input;
 
+interface IMetricsBuilderFormulaProps {
+	formulaData: IMetricsBuilderFormula;
+	formulaIndex: number;
+	handleFormulaChange: (args: IQueryBuilderFormulaHandleChange) => void;
+}
 function MetricsBuilderFormula({
 	formulaData,
 	formulaIndex,
 	handleFormulaChange,
-}): JSX.Element {
+}: IMetricsBuilderFormulaProps): JSX.Element {
 	return (
 		<QueryHeader
 			name={formulaData.name}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx
index 6a4b812c62..fd5d7f32ad 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/index.tsx
@@ -4,25 +4,39 @@ import {
 	QueryBuilderFormulaTemplate,
 	QueryBuilderQueryTemplate,
 } from 'constants/dashboard';
+import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
 import GetFormulaName from 'lib/query/GetFormulaName';
 import GetQueryName from 'lib/query/GetQueryName';
 import React from 'react';
+import { Query } from 'types/api/dashboard/getAll';
 
 import {
 	WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME,
 	WIDGET_QUERY_BUILDER_QUERY_KEY_NAME,
 } from '../../constants';
 import { QueryButton } from '../../styles';
+import { IHandleUpdatedQuery } from '../../types';
 import MetricsBuilderFormula from './formula';
 import MetricsBuilder from './query';
+import {
+	IQueryBuilderFormulaHandleChange,
+	IQueryBuilderQueryHandleChange,
+} from './types';
 import { canCreateQueryAndFormula } from './utils';
 
+interface IQueryBuilderQueryContainerProps {
+	queryData: Query;
+	updateQueryData: (args: IHandleUpdatedQuery) => void;
+	metricsBuilderQueries: Query['metricsBuilder'];
+	selectedGraph: GRAPH_TYPES;
+}
+
 function QueryBuilderQueryContainer({
 	queryData,
 	updateQueryData,
 	metricsBuilderQueries,
 	selectedGraph,
-}): JSX.Element | null {
+}: IQueryBuilderQueryContainerProps): JSX.Element | null {
 	const handleQueryBuilderQueryChange = ({
 		queryIndex,
 		aggregateFunction,
@@ -33,7 +47,7 @@ function QueryBuilderQueryContainer({
 		toggleDisable,
 		toggleDelete,
 		reduceTo,
-	}): void => {
+	}: IQueryBuilderQueryHandleChange): void => {
 		const allQueries =
 			queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder;
 		const currentIndexQuery = allQueries[queryIndex];
@@ -73,7 +87,7 @@ function QueryBuilderQueryContainer({
 		expression,
 		toggleDisable,
 		toggleDelete,
-	}): void => {
+	}: IQueryBuilderFormulaHandleChange): void => {
 		const allFormulas =
 			queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
 				WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
@@ -102,9 +116,9 @@ function QueryBuilderQueryContainer({
 			return;
 		}
 		queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder.push({
-			name: GetQueryName(
-				queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder,
-			),
+			name:
+				GetQueryName(queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder) ||
+				'',
 			...QueryBuilderQueryTemplate,
 		});
 		updateQueryData({ updatedQuery: { ...queryData } });
@@ -121,11 +135,12 @@ function QueryBuilderQueryContainer({
 		queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
 			WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
 		].push({
-			name: GetFormulaName(
-				queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
-					WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
-				],
-			),
+			name:
+				GetFormulaName(
+					queryData[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
+						WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME
+					],
+				) || '',
 			...QueryBuilderFormulaTemplate,
 		});
 		updateQueryData({ updatedQuery: { ...queryData } });
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx
index d953ab9dae..fccf108b41 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/query.tsx
@@ -2,28 +2,40 @@ import { AutoComplete, Col, Input, Row, Select, Spin } from 'antd';
 import { getMetricName } from 'api/metrics/getMetricName';
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
 import React, { useEffect, useState } from 'react';
+import { IMetricsBuilderQuery } from 'types/api/dashboard/getAll';
 import { EReduceOperator } from 'types/common/dashboard';
 
-import { TQueryCategories } from '../../types';
 import { AggregateFunctions } from '../Options';
 import QueryHeader from '../QueryHeader';
 import MetricTagKeyFilter from './MetricTagKeyFilter';
+import { IOption } from './MetricTagKeyFilter/types';
 import { GetTagKeys } from './MetricTagKeyFilter/utils';
+import { IQueryBuilderQueryHandleChange } from './types';
 
 const { Option } = Select;
-function MetricsBuilder({
-	queryData,
-	queryIndex,
-	handleQueryChange,
-	selectedGraph,
-}: QueryBuilderProps): JSX.Element {
-	const [groupByOptions, setGroupByOptions] = useState([]);
-	const [metricName, setMetricName] = useState(queryData.metricName);
 
-	const [metricNameList, setMetricNameList] = useState([]);
+interface IMetricsBuilderProps {
+	queryIndex: number;
+	selectedGraph: GRAPH_TYPES;
+	queryData: IMetricsBuilderQuery;
+	handleQueryChange: (args: IQueryBuilderQueryHandleChange) => void;
+}
+
+function MetricsBuilder({
+	queryIndex,
+	selectedGraph,
+	queryData,
+	handleQueryChange,
+}: IMetricsBuilderProps): JSX.Element {
+	const [groupByOptions, setGroupByOptions] = useState<IOption[]>([]);
+	const [metricName, setMetricName] = useState<string | null>(
+		queryData.metricName,
+	);
+
+	const [metricNameList, setMetricNameList] = useState<string[]>([]);
 	const [metricNameLoading, setMetricNameLoading] = useState(false);
 
-	const handleMetricNameSelect = (e): void => {
+	const handleMetricNameSelect = (e: string): void => {
 		handleQueryChange({ queryIndex, metricName: e });
 		setMetricName(e);
 	};
@@ -51,7 +63,7 @@ function MetricsBuilder({
 	};
 
 	useEffect(() => {
-		GetTagKeys(metricName).then((tagKeys) => {
+		GetTagKeys(metricName || '').then((tagKeys) => {
 			setGroupByOptions(tagKeys);
 		});
 	}, [metricName]);
@@ -120,7 +132,9 @@ function MetricsBuilder({
 							<MetricTagKeyFilter
 								metricName={metricName}
 								selectedTagFilters={queryData.tagFilters.items}
-								onSetQuery={(updatedTagFilters): void =>
+								onSetQuery={(
+									updatedTagFilters: IMetricsBuilderQuery['tagFilters']['items'],
+								): void =>
 									handleQueryChange({ queryIndex, tagFilters: updatedTagFilters })
 								}
 							/>
@@ -166,9 +180,13 @@ function MetricsBuilder({
 											.filter((op) => !(parseInt(op, 10) >= 0))
 											.map((op) => ({
 												label: op,
-												value: EReduceOperator[op],
+												value: EReduceOperator[op as keyof typeof EReduceOperator],
 											}))}
-										defaultValue={EReduceOperator[queryData.reduceTo]}
+										defaultValue={
+											EReduceOperator[
+												(queryData.reduceTo as unknown) as keyof typeof EReduceOperator
+											]
+										}
 										onChange={(e): void => {
 											handleQueryChange({ queryIndex, reduceTo: e });
 										}}
@@ -193,8 +211,4 @@ function MetricsBuilder({
 	);
 }
 
-interface QueryBuilderProps {
-	selectedGraph: GRAPH_TYPES;
-	queryCategory: TQueryCategories;
-}
 export default MetricsBuilder;
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/types.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/types.ts
new file mode 100644
index 0000000000..8d177cffd8
--- /dev/null
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/types.ts
@@ -0,0 +1,23 @@
+import {
+	IMetricsBuilderFormula,
+	IMetricsBuilderQuery,
+} from 'types/api/dashboard/getAll';
+
+export interface IQueryBuilderQueryHandleChange {
+	queryIndex: number;
+	aggregateFunction?: IMetricsBuilderQuery['aggregateOperator'];
+	metricName?: IMetricsBuilderQuery['metricName'];
+	tagFilters?: IMetricsBuilderQuery['tagFilters']['items'];
+	groupBy?: IMetricsBuilderQuery['groupBy'];
+	legend?: IMetricsBuilderQuery['legend'];
+	toggleDisable?: boolean;
+	toggleDelete?: boolean;
+	reduceTo?: IMetricsBuilderQuery['reduceTo'];
+}
+
+export interface IQueryBuilderFormulaHandleChange {
+	formulaIndex: number;
+	expression?: IMetricsBuilderFormula['expression'];
+	toggleDisable?: IMetricsBuilderFormula['disabled'];
+	toggleDelete?: boolean;
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts
index 977d194c9b..e634d2dce3 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/QueryBuilder/queryBuilder/utils.ts
@@ -1,3 +1,5 @@
+import { Query } from 'types/api/dashboard/getAll';
+
 import {
 	WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME,
 	WIDGET_QUERY_BUILDER_QUERY_KEY_NAME,
@@ -5,7 +7,7 @@ import {
 
 const QUERY_AND_FORMULA_LIMIT = 10;
 
-export const canCreateQueryAndFormula = (query): boolean => {
+export const canCreateQueryAndFormula = (query: Query): boolean => {
 	const queries = query[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME].queryBuilder;
 	const formulas =
 		query[WIDGET_QUERY_BUILDER_QUERY_KEY_NAME][
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx
index c8067a873b..c7f4e49735 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/TabHeader.tsx
@@ -1,7 +1,15 @@
 import { Tooltip } from 'antd';
 import React from 'react';
 
-function TabHeader({ tabName, hasUnstagedChanges }): JSX.Element {
+interface ITabHeaderProps {
+	tabName: string;
+	hasUnstagedChanges: boolean;
+}
+
+function TabHeader({
+	tabName,
+	hasUnstagedChanges,
+}: ITabHeaderProps): JSX.Element {
 	return (
 		<div
 			style={{
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts
index 35e6cf5b63..a16ed33a74 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/constants.ts
@@ -1,17 +1,21 @@
+/* eslint-disable  */
+// @ts-ignore
+// @ts-nocheck
+
 import { EQueryType } from 'types/common/dashboard';
 
 import { EQueryTypeToQueryKeyMapping } from './types';
 
-export const WIDGET_PROMQL_QUERY_KEY_NAME: string = EQueryTypeToQueryKeyMapping[
-	EQueryType[EQueryType.PROM]
-] as string;
+export const WIDGET_PROMQL_QUERY_KEY_NAME: EQueryTypeToQueryKeyMapping.PROM =
+	EQueryTypeToQueryKeyMapping[EQueryType[EQueryType.PROM]];
 
-export const WIDGET_CLICKHOUSE_QUERY_KEY_NAME: string = EQueryTypeToQueryKeyMapping[
+export const WIDGET_CLICKHOUSE_QUERY_KEY_NAME: EQueryTypeToQueryKeyMapping.CLICKHOUSE = EQueryTypeToQueryKeyMapping[
 	EQueryType[EQueryType.CLICKHOUSE]
 ] as string;
 
-export const WIDGET_QUERY_BUILDER_QUERY_KEY_NAME: string = EQueryTypeToQueryKeyMapping[
+export const WIDGET_QUERY_BUILDER_QUERY_KEY_NAME: EQueryTypeToQueryKeyMapping.QUERY_BUILDER = EQueryTypeToQueryKeyMapping[
 	EQueryType[EQueryType.QUERY_BUILDER]
 ] as string;
 
-export const WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME: string = 'formulas' as string;
+type TFormulas = 'formulas';
+export const WIDGET_QUERY_BUILDER_FORMULA_KEY_NAME: TFormulas = 'formulas';
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx b/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx
index fb1cf331c6..333888c86b 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/index.tsx
@@ -1,3 +1,6 @@
+/* eslint-disable  */
+//@ts-nocheck
+
 import { Button, Tabs } from 'antd';
 import TextToolTip from 'components/TextToolTip';
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
@@ -8,22 +11,13 @@ import { connect, useSelector } from 'react-redux';
 import { useLocation } from 'react-router-dom';
 import { bindActionCreators, Dispatch } from 'redux';
 import { ThunkDispatch } from 'redux-thunk';
-import { CreateQuery, CreateQueryProps } from 'store/actions';
-import {
-	GetQueryResults,
-	GetQueryResultsProps,
-} from 'store/actions/dashboard/getQueryResults';
 import {
 	UpdateQuery,
 	UpdateQueryProps,
 } from 'store/actions/dashboard/updateQuery';
-import {
-	UpdateQueryType,
-	UpdateQueryTypeProps,
-} from 'store/actions/dashboard/updateQueryType';
 import { AppState } from 'store/reducers';
 import AppActions from 'types/actions';
-import { Widgets } from 'types/api/dashboard/getAll';
+import { Query, Widgets } from 'types/api/dashboard/getAll';
 import { EQueryType } from 'types/common/dashboard';
 import DashboardReducer from 'types/reducer/dashboards';
 import { v4 as uuid } from 'uuid';
@@ -46,11 +40,13 @@ function QuerySection({
 	updateQuery,
 	selectedGraph,
 }: QueryProps): JSX.Element {
-	const [localQueryChanges, setLocalQueryChanges] = useState({});
-	const [rctTabKey, setRctTabKey] = useState({
+	const [localQueryChanges, setLocalQueryChanges] = useState<Query>({} as Query);
+	const [rctTabKey, setRctTabKey] = useState<
+		Record<keyof typeof EQueryType, string>
+	>({
 		QUERY_BUILDER: uuid(),
 		CLICKHOUSE: uuid(),
-		PROMQL: uuid(),
+		PROM: uuid(),
 	});
 	const { dashboards } = useSelector<AppState, DashboardReducer>(
 		(state) => state.dashboards,
@@ -73,104 +69,80 @@ function QuerySection({
 		selectedWidget.query.queryType,
 	);
 
-	const { query = [] } = selectedWidget || {};
+	const { query } = selectedWidget || {};
 	useEffect(() => {
-		setLocalQueryChanges(cloneDeep(query));
+		setLocalQueryChanges(cloneDeep(query) as Query);
 	}, [query]);
-	const queryOnClickHandler = () => {
-		setLocalQueryChanges([
-			...localQueryChanges,
-			// {
-			// 	name: GetQueryName(localQueryChanges),
-			// 	disabled: false,
 
-			// 	promQL: {
-			// 		query: '',
-			// 		legend: '',
-			// 	},
-			// 	clickHouseQuery: '',
-			// 	queryBuilder: {
-			// 		metricName: null,
-			// 		aggregateOperator: null,
-			// 		tagFilters: {
-			// 			op: 'AND',
-			// 			items: [],
-			// 		},
-			// 		groupBy: [],
-			// 	},
-			// },
-		]);
-	};
 
-	const queryDiff = (queryA, queryB, queryCategory) => {
+	const queryDiff = (
+		queryA: Query,
+		queryB: Query,
+		queryCategory: EQueryType,
+	): boolean => {
 		const keyOfConcern = getQueryKey(queryCategory);
 		return !isEqual(queryA[keyOfConcern], queryB[keyOfConcern]);
 	};
 
 	useEffect(() => {
 		handleUnstagedChanges(
-			queryDiff(query, localQueryChanges, parseInt(queryCategory)),
+			queryDiff(query, localQueryChanges, parseInt(`${queryCategory}`, 10)),
 		);
 	}, [handleUnstagedChanges, localQueryChanges, query, queryCategory]);
 
-	const purgeLocalChanges = () => {
-		setLocalQueryChanges(query);
-	};
-	const regenRctKeys = () => {
+	const regenRctKeys = (): void => {
 		setRctTabKey((prevState) => {
-			Object.keys(prevState).map((key) => {
-				prevState[key] = uuid();
+			const newState = prevState;
+			Object.keys(newState).forEach((key) => {
+				newState[key as keyof typeof EQueryType] = uuid();
 			});
 
-			return cloneDeep(prevState);
+			return cloneDeep(newState);
 		});
 	};
 
-	const handleStageQuery = () => {
+	const handleStageQuery = (): void => {
 		updateQuery({
 			updatedQuery: localQueryChanges,
-			widgetId: urlQuery.get('widgetId'),
+			widgetId: urlQuery.get('widgetId') || '',
 			yAxisUnit: selectedWidget.yAxisUnit,
 		});
 	};
 
-	const handleQueryCategoryChange = (qCategory): void => {
+	const handleQueryCategoryChange = (qCategory: string): void => {
 		// If true, then it means that the user has made some changes and haven't staged them
 		const unstagedChanges = queryDiff(
 			query,
 			localQueryChanges,
-			parseInt(queryCategory),
+			parseInt(`${queryCategory}`, 10),
 		);
 
 		if (unstagedChanges && showUnstagedStashConfirmBox()) {
+			// eslint-disable-next-line no-alert
 			window.confirm(
 				"You are trying to navigate to different tab with unstaged changes. Your current changes will be purged. Press 'Stage & Run Query' to stage them.",
 			);
 			return;
 		}
 
-		setQueryCategory(parseInt(qCategory));
+		setQueryCategory(parseInt(`${qCategory}`, 10));
 		const newLocalQuery = {
 			...cloneDeep(query),
-			queryType: parseInt(qCategory),
+			queryType: parseInt(`${qCategory}`, 10),
 		};
 		setLocalQueryChanges(newLocalQuery);
 		regenRctKeys();
 		updateQuery({
 			updatedQuery: newLocalQuery,
-			widgetId: urlQuery.get('widgetId'),
+			widgetId: urlQuery.get('widgetId') || '',
 			yAxisUnit: selectedWidget.yAxisUnit,
 		});
 	};
-	const handleLocalQueryUpdate = ({ updatedQuery }) => {
-		setLocalQueryChanges(updatedQuery);
-	};
 
-	const handleDeleteQuery = ({ currentIndex }) => {
-		setLocalQueryChanges((prevState) => {
-			prevState.splice(currentIndex, 1);
-			return [...prevState];
-		});
+	const handleLocalQueryUpdate = ({
+		updatedQuery,
+	}: IHandleUpdatedQuery): void => {
+		setLocalQueryChanges(updatedQuery);
 	};
 
 	return (
@@ -211,7 +183,7 @@ function QuerySection({
 						<QueryBuilderQueryContainer
 							key={rctTabKey.QUERY_BUILDER}
 							queryData={localQueryChanges}
-							updateQueryData={({ updatedQuery }) => {
+							updateQueryData={({ updatedQuery }: IHandleUpdatedQuery): void => {
 								handleLocalQueryUpdate({ updatedQuery });
 							}}
 							metricsBuilderQueries={
@@ -236,7 +208,7 @@ function QuerySection({
 						<ClickHouseQueryContainer
 							key={rctTabKey.CLICKHOUSE}
 							queryData={localQueryChanges}
-							updateQueryData={({ updatedQuery }) => {
+							updateQueryData={({ updatedQuery }: IHandleUpdatedQuery): void => {
 								handleLocalQueryUpdate({ updatedQuery });
 							}}
 							clickHouseQueries={localQueryChanges[WIDGET_CLICKHOUSE_QUERY_KEY_NAME]}
@@ -256,9 +228,9 @@ function QuerySection({
 						key={EQueryType.PROM.toString()}
 					>
 						<PromQLQueryContainer
-							key={rctTabKey.PROMQL}
+							key={rctTabKey.PROM}
 							queryData={localQueryChanges}
-							updateQueryData={({ updatedQuery }) => {
+							updateQueryData={({ updatedQuery }: IHandleUpdatedQuery): void => {
 								handleLocalQueryUpdate({ updatedQuery });
 							}}
 							promQLQueries={localQueryChanges[WIDGET_PROMQL_QUERY_KEY_NAME]}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts
index 67993af292..3db9cb18b2 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/types.ts
@@ -1,3 +1,5 @@
+import { Query } from 'types/api/dashboard/getAll';
+
 export type TQueryCategories = 'query_builder' | 'clickhouse_query' | 'promql';
 
 export enum EQueryCategories {
@@ -11,3 +13,7 @@ export enum EQueryTypeToQueryKeyMapping {
 	CLICKHOUSE = 'clickHouse',
 	PROM = 'promQL',
 }
+
+export interface IHandleUpdatedQuery {
+	updatedQuery: Query;
+}
diff --git a/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts b/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts
index e698edc4a0..b095621ec8 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts
+++ b/frontend/src/container/NewWidget/LeftContainer/QuerySection/utils/getQueryKey.ts
@@ -2,6 +2,10 @@ import { EQueryType } from 'types/common/dashboard';
 
 import { EQueryTypeToQueryKeyMapping } from '../types';
 
-export const getQueryKey = (queryCategory): EQueryTypeToQueryKeyMapping => {
-	return EQueryTypeToQueryKeyMapping[EQueryType[queryCategory] as unknown];
+export const getQueryKey = (
+	queryCategory: EQueryType,
+): EQueryTypeToQueryKeyMapping => {
+	return EQueryTypeToQueryKeyMapping[
+		EQueryType[queryCategory] as keyof typeof EQueryTypeToQueryKeyMapping
+	];
 };
diff --git a/frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx b/frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx
index 6838e994de..32745ee95e 100644
--- a/frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/QueryTypeTag.tsx
@@ -4,7 +4,7 @@ import { EQueryType } from 'types/common/dashboard';
 import { Tag } from '../styles';
 
 interface IQueryTypeTagProps {
-	queryType: EQueryType;
+	queryType: EQueryType | undefined;
 }
 function QueryTypeTag({ queryType }: IQueryTypeTagProps): JSX.Element {
 	switch (queryType) {
diff --git a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx
index 6b5666cd89..5103b262a3 100644
--- a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/PlotTag.tsx
@@ -1,8 +1,13 @@
 import React from 'react';
+import { EQueryType } from 'types/common/dashboard';
 
 import QueryTypeTag from '../QueryTypeTag';
 
-function PlotTag({ queryType }): JSX.Element | null {
+interface IPlotTagProps {
+	queryType: EQueryType;
+}
+
+function PlotTag({ queryType }: IPlotTagProps): JSX.Element | null {
 	if (queryType === undefined) {
 		return null;
 	}
diff --git a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx
index 78a5a3b85c..8c06836b2d 100644
--- a/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx
+++ b/frontend/src/container/NewWidget/LeftContainer/WidgetGraph/WidgetGraph.tsx
@@ -41,8 +41,7 @@ function WidgetGraph({
 			</NotFoundContainer>
 		);
 	}
-
-	if (queryData.data.length === 0 || queryData.data[0].queryData.length === 0) {
+	if (queryData.data.queryData.length === 0) {
 		return (
 			<NotFoundContainer>
 				<Typography>No Data</Typography>
@@ -51,7 +50,7 @@ function WidgetGraph({
 	}
 
 	const chartDataSet = getChartData({
-		queryData: queryData.data,
+		queryData: [queryData.data],
 	});
 
 	return (
diff --git a/frontend/src/container/NewWidget/index.tsx b/frontend/src/container/NewWidget/index.tsx
index 2ca25241a5..82627f8d22 100644
--- a/frontend/src/container/NewWidget/index.tsx
+++ b/frontend/src/container/NewWidget/index.tsx
@@ -136,9 +136,9 @@ function NewWidget({
 	}, [dashboardId, dispatch]);
 
 	const getQueryResult = useCallback(() => {
-		if (selectedWidget?.id.length !== 0) {
+		if (selectedWidget?.id.length !== 0 && selectedWidget?.query) {
 			getQueryResults({
-				query: selectedWidget?.query || [],
+				query: selectedWidget?.query,
 				selectedTime: selectedTime.enum,
 				widgetId: selectedWidget?.id || '',
 				graphType: selectedGraph,
diff --git a/frontend/src/lib/getChartData.ts b/frontend/src/lib/getChartData.ts
index b1619fcd7a..c3eefb0055 100644
--- a/frontend/src/lib/getChartData.ts
+++ b/frontend/src/lib/getChartData.ts
@@ -6,30 +6,31 @@ import convertIntoEpoc from './covertIntoEpoc';
 import { colors } from './getRandomColor';
 
 const getChartData = ({ queryData }: GetChartDataProps): ChartData => {
-	const response = queryData.map(({ queryData }) => {
-		return queryData.map((e) => {
-			const { values = [], metric, legend, queryName } = e || {};
+	const response = queryData.map(
+		({ queryData, query: queryG, legend: legendG }) => {
+			return queryData.map((e) => {
+				const { values = [], metric, legend, queryName } = e || {};
+				const labelNames = getLabelName(
+					metric,
+					queryName || queryG || '', // query
+					legend || legendG || '',
+				);
+				const dataValue = values?.map((e) => {
+					const [first = 0, second = ''] = e || [];
+					return {
+						first: new Date(parseInt(convertIntoEpoc(first * 1000), 10)), // converting in ms
+						second: Number(parseFloat(second)),
+					};
+				});
 
-			const labelNames = getLabelName(
-				metric,
-				queryName || '', // query
-				legend || '',
-			);
-			const dataValue = values?.map((e) => {
-				const [first = 0, second = ''] = e || [];
 				return {
-					first: new Date(parseInt(convertIntoEpoc(first * 1000), 10)), // converting in ms
-					second: Number(parseFloat(second)),
+					label: labelNames !== 'undefined' ? labelNames : '',
+					first: dataValue.map((e) => e.first),
+					second: dataValue.map((e) => e.second),
 				};
 			});
-
-			return {
-				label: labelNames !== 'undefined' ? labelNames : '',
-				first: dataValue.map((e) => e.first),
-				second: dataValue.map((e) => e.second),
-			};
-		});
-	});
+		},
+	);
 	const allLabels = response
 		.map((e) => e.map((e) => e.label))
 		.reduce((a, b) => [...a, ...b], []);
@@ -58,7 +59,7 @@ const getChartData = ({ queryData }: GetChartDataProps): ChartData => {
 };
 
 interface GetChartDataProps {
-	queryData: Widgets['queryData']['data'];
+	queryData: Widgets['queryData']['data'][];
 }
 
 export default getChartData;
diff --git a/frontend/src/lib/query/GetFormulaName.ts b/frontend/src/lib/query/GetFormulaName.ts
index b10b6203c0..a02ed45797 100644
--- a/frontend/src/lib/query/GetFormulaName.ts
+++ b/frontend/src/lib/query/GetFormulaName.ts
@@ -2,13 +2,16 @@ import { sortBy } from 'lodash-es';
 
 const MAX_QUERIES = 20;
 
-function GetFormulaName(formulas = []): string | null {
+function GetFormulaName(
+	// eslint-disable-next-line @typescript-eslint/no-explicit-any
+	formulas: { name: string; [key: string]: any }[] = [],
+): string | null {
 	if (!formulas.length) return 'F1';
 	if (formulas.length === MAX_QUERIES) {
 		return null;
 	}
 	const formulasNameNumbered = sortBy(
-		formulas.map(({ name }) => {
+		formulas.map(({ name }: { name: string }) => {
 			return parseInt(name.slice(1), 10);
 		}),
 		(e) => e,
@@ -22,6 +25,7 @@ function GetFormulaName(formulas = []): string | null {
 		}
 		// formulaIteratorIdx += 1;
 	}
+	return null;
 }
 
 export default GetFormulaName;
diff --git a/frontend/src/lib/query/GetQueryName.ts b/frontend/src/lib/query/GetQueryName.ts
index 316b48d81a..94806ba359 100644
--- a/frontend/src/lib/query/GetQueryName.ts
+++ b/frontend/src/lib/query/GetQueryName.ts
@@ -1,26 +1,26 @@
 import { sortBy } from 'lodash-es';
 
 const MAX_QUERIES = 26;
-function GetQueryName(queries = []): string | null {
+function GetQueryName(queries: { name: string }[] = []): string | null {
 	if (!queries.length) return 'A';
 	if (queries.length === MAX_QUERIES) {
 		return null;
 	}
-	const sortedQueries = sortBy(queries, function (q) {
+	const sortedQueries = sortBy(queries, (q) => {
 		return q.name;
 	});
 
-	let query_iterator_idx = 0;
+	let queryIteratorIdx = 0;
 
 	for (
 		let charItr = 'A'.charCodeAt(0);
 		charItr <= 'A'.charCodeAt(0) + MAX_QUERIES;
 		charItr += 1
 	) {
-		if (charItr !== sortedQueries[query_iterator_idx]?.name.charCodeAt(0)) {
+		if (charItr !== sortedQueries[queryIteratorIdx]?.name.charCodeAt(0)) {
 			return String.fromCharCode(charItr);
 		}
-		query_iterator_idx += 1;
+		queryIteratorIdx += 1;
 	}
 
 	return null;
diff --git a/frontend/src/store/actions/dashboard/createQuery.ts b/frontend/src/store/actions/dashboard/createQuery.ts
deleted file mode 100644
index bd8947526e..0000000000
--- a/frontend/src/store/actions/dashboard/createQuery.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { Dispatch } from 'redux';
-import AppActions from 'types/actions';
-
-export const CreateQuery = ({ widgetId }: CreateQueryProps) => (
-	dispatch: Dispatch<AppActions>,
-): void => {
-	dispatch({
-		type: 'CREATE_NEW_QUERY',
-		payload: {
-			widgetId,
-		},
-	});
-};
-
-export interface CreateQueryProps {
-	widgetId: string;
-}
diff --git a/frontend/src/store/actions/dashboard/getDashboard.ts b/frontend/src/store/actions/dashboard/getDashboard.ts
index 4582a1255e..ea039ccc22 100644
--- a/frontend/src/store/actions/dashboard/getDashboard.ts
+++ b/frontend/src/store/actions/dashboard/getDashboard.ts
@@ -46,11 +46,10 @@ export const GetDashboard = ({
 							title: '',
 							queryType: 0,
 							queryData: {
-								data: [
-									{
-										queryData: [],
-									},
-								],
+								data: {
+									queryData: [],
+								},
+
 								error: false,
 								errorMessage: '',
 								loading: false,
diff --git a/frontend/src/store/actions/dashboard/getQueryResults.ts b/frontend/src/store/actions/dashboard/getQueryResults.ts
index d2d8c6da6f..f1143a1431 100644
--- a/frontend/src/store/actions/dashboard/getQueryResults.ts
+++ b/frontend/src/store/actions/dashboard/getQueryResults.ts
@@ -1,3 +1,7 @@
+/* eslint-disable  */
+// @ts-ignore
+// @ts-nocheck
+
 import { getMetricsQueryRange } from 'api/metrics/getQueryRange';
 import { AxiosError } from 'axios';
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
@@ -36,6 +40,7 @@ export async function GetMetricQueryRange({
 		EQueryTypeToQueryKeyMapping[EQueryType[query.queryType]];
 	const queryData = query[queryKey];
 	const legendMap: Record<string, string> = {};
+
 	const QueryPayload = {
 		dataSource: EDataSource.METRICS,
 		compositeMetricQuery: {
@@ -175,12 +180,6 @@ export const GetQueryResults = (
 				return;
 			}
 
-			// const data = response.map((e) => ({
-			// 	query: e.query,
-			// 	legend: e.legend || '',
-			// 	queryData: e.queryData.payload?.result || [],
-			// }));
-
 			dispatch({
 				type: 'QUERY_SUCCESS',
 				payload: {
@@ -216,7 +215,7 @@ export const GetQueryResults = (
 export interface GetQueryResultsProps {
 	widgetId: string;
 	selectedTime: timePreferenceType;
-	query: Query[];
+	query: Query;
 	graphType: ITEMS;
 	globalSelectedInterval: GlobalReducer['selectedTime'];
 }
diff --git a/frontend/src/store/actions/dashboard/index.ts b/frontend/src/store/actions/dashboard/index.ts
index cc4979e08e..3e6abb6d77 100644
--- a/frontend/src/store/actions/dashboard/index.ts
+++ b/frontend/src/store/actions/dashboard/index.ts
@@ -1,5 +1,4 @@
 export * from './applySettingsToPanel';
-export * from './createQuery';
 export * from './deleteDashboard';
 export * from './deleteQuery';
 export * from './getAllDashboard';
diff --git a/frontend/src/store/actions/dashboard/saveDashboard.ts b/frontend/src/store/actions/dashboard/saveDashboard.ts
index 101a7e30e0..54365330f3 100644
--- a/frontend/src/store/actions/dashboard/saveDashboard.ts
+++ b/frontend/src/store/actions/dashboard/saveDashboard.ts
@@ -82,7 +82,6 @@ export const SaveDashboard = ({
 					...allLayout.slice(emptyLayoutIndex + 1, allLayout.length),
 				];
 			};
-
 			const allLayout = getAllLayout();
 			const response = await updateDashboardApi({
 				data: {
@@ -109,12 +108,6 @@ export const SaveDashboard = ({
 							panelTypes: search.get('graphType') as Widgets['panelTypes'],
 							queryData: {
 								...selectedWidget.queryData,
-								data: [
-									...selectedWidget.queryData.data.map((e) => ({
-										...e,
-										queryData: [],
-									})),
-								],
 							},
 						},
 						...afterWidget,
diff --git a/frontend/src/store/actions/dashboard/updateQueryType.ts b/frontend/src/store/actions/dashboard/updateQueryType.ts
deleted file mode 100644
index f8f4ee1b29..0000000000
--- a/frontend/src/store/actions/dashboard/updateQueryType.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Dispatch } from 'redux';
-import AppActions from 'types/actions';
-
-export const UpdateQueryType = (
-	props: UpdateQueryTypeProps,
-): ((dispatch: Dispatch<AppActions>) => void) => {
-	return (dispatch: Dispatch<AppActions>): void => {
-		dispatch({
-			type: 'UPDATE_QUERY_TYPE',
-			payload: {
-				queryType: props.queryType,
-				widgetId: props.widgetId,
-			},
-		});
-	};
-};
-
-export interface UpdateQueryTypeProps {
-	widgetId: string;
-	queryType: number;
-}
diff --git a/frontend/src/store/reducers/dashboard.ts b/frontend/src/store/reducers/dashboard.ts
index 4d7656993e..61c5cc7351 100644
--- a/frontend/src/store/reducers/dashboard.ts
+++ b/frontend/src/store/reducers/dashboard.ts
@@ -19,7 +19,6 @@ import {
 	TOGGLE_EDIT_MODE,
 	UPDATE_DASHBOARD,
 	UPDATE_QUERY,
-	UPDATE_QUERY_TYPE,
 	UPDATE_TITLE_DESCRIPTION_TAGS_SUCCESS,
 } from 'types/actions/dashboard';
 import InitialValueTypes from 'types/reducer/dashboards';
@@ -216,6 +215,7 @@ const dashboard = (
 
 		case QUERY_SUCCESS: {
 			const { widgetId, data: queryDataResponse } = action.payload;
+
 			const { dashboards } = state;
 			const [selectedDashboard] = dashboards;
 			const { data } = selectedDashboard;
@@ -243,7 +243,7 @@ const dashboard = (
 								{
 									...selectedWidget,
 									queryData: {
-										data: [queryDataResponse],
+										data: queryDataResponse,
 										error: selectedWidget.queryData.error,
 										errorMessage: selectedWidget.queryData.errorMessage,
 										loading: false,
@@ -397,88 +397,6 @@ const dashboard = (
 				],
 			};
 		}
-		case UPDATE_QUERY_TYPE: {
-			const { widgetId, queryType } = action.payload;
-			const { dashboards } = state;
-			const [selectedDashboard] = dashboards;
-			const { data } = selectedDashboard;
-			const { widgets = [] } = data;
-
-			const selectedWidgetIndex = widgets.findIndex((e) => e.id === widgetId) || 0;
-
-			const preWidget = widgets?.slice(0, selectedWidgetIndex) || [];
-			const afterWidget =
-				widgets?.slice(
-					selectedWidgetIndex + 1, // this is never undefined
-					widgets.length,
-				) || [];
-
-			const selectedWidget = widgets[selectedWidgetIndex];
-
-			return {
-				...state,
-				dashboards: [
-					{
-						...selectedDashboard,
-						data: {
-							...data,
-							widgets: [
-								...preWidget,
-								{
-									...selectedWidget,
-									queryType,
-								},
-								...afterWidget,
-							],
-						},
-					},
-				],
-			};
-		}
-
-		// case DELETE_QUERY: {
-		// 	const { currentIndex, widgetId } = action.payload;
-		// 	const { dashboards } = state;
-		// 	const [selectedDashboard] = dashboards;
-		// 	const { data } = selectedDashboard;
-		// 	const { widgets = [] } = data;
-
-		// 	const selectedWidgetIndex = widgets.findIndex((e) => e.id === widgetId) || 0;
-
-		// 	const preWidget = widgets?.slice(0, selectedWidgetIndex) || [];
-		// 	const afterWidget =
-		// 		widgets?.slice(
-		// 			selectedWidgetIndex + 1, // this is never undefined
-		// 			widgets.length,
-		// 		) || [];
-
-		// 	const selectedWidget = widgets[selectedWidgetIndex];
-
-		// 	const { query } = selectedWidget;
-
-		// 	const preQuery = query.slice(0, currentIndex);
-		// 	const postQuery = query.slice(currentIndex + 1, query.length);
-
-		// 	return {
-		// 		...state,
-		// 		dashboards: [
-		// 			{
-		// 				...selectedDashboard,
-		// 				data: {
-		// 					...data,
-		// 					widgets: [
-		// 						...preWidget,
-		// 						{
-		// 							...selectedWidget,
-		// 							query: [...preQuery, ...postQuery],
-		// 						},
-		// 						...afterWidget,
-		// 					],
-		// 				},
-		// 			},
-		// 		],
-		// 	};
-		// }
 
 		default:
 			return state;
diff --git a/frontend/src/types/actions/dashboard.ts b/frontend/src/types/actions/dashboard.ts
index c1051d542f..3330f028d4 100644
--- a/frontend/src/types/actions/dashboard.ts
+++ b/frontend/src/types/actions/dashboard.ts
@@ -41,7 +41,6 @@ export const DELETE_WIDGET_ERROR = 'DELETE_WIDGET_ERROR';
 export const IS_ADD_WIDGET = 'IS_ADD_WIDGET';
 
 export const DELETE_QUERY = 'DELETE_QUERY';
-export const UPDATE_QUERY_TYPE = 'UPDATE_QUERY_TYPE';
 export const FLUSH_DASHBOARD = 'FLUSH_DASHBOARD';
 interface GetDashboard {
 	type: typeof GET_DASHBOARD;
@@ -124,7 +123,7 @@ export interface QuerySuccessPayload {
 		// legend: string;
 		queryData: QueryData[];
 		// query: string
-	}[];
+	};
 }
 interface QuerySuccess {
 	type: typeof QUERY_SUCCESS;
@@ -172,14 +171,6 @@ interface DeleteQuery {
 	payload: DeleteQueryProps;
 }
 
-interface UpdateQueryType {
-	type: typeof UPDATE_QUERY_TYPE;
-	payload: {
-		queryType: number;
-		widgetId: string;
-	};
-}
-
 interface FlushDashboard {
 	type: typeof FLUSH_DASHBOARD;
 }
@@ -203,5 +194,4 @@ export type DashboardActions =
 	| IsAddWidget
 	| UpdateQuery
 	| DeleteQuery
-	| UpdateQueryType
 	| FlushDashboard;
diff --git a/frontend/src/types/api/dashboard/getAll.ts b/frontend/src/types/api/dashboard/getAll.ts
index 66710016da..6ae751475f 100644
--- a/frontend/src/types/api/dashboard/getAll.ts
+++ b/frontend/src/types/api/dashboard/getAll.ts
@@ -1,7 +1,11 @@
 import { GRAPH_TYPES } from 'container/NewDashboard/ComponentsSlider';
 import { timePreferenceType } from 'container/NewWidget/RightContainer/timeItems';
 import { Layout } from 'react-grid-layout';
-import { EAggregateOperator, EQueryType } from 'types/common/dashboard';
+import {
+	EAggregateOperator,
+	EQueryType,
+	EReduceOperator,
+} from 'types/common/dashboard';
 
 import { QueryData } from '../widgets/getQuery';
 
@@ -38,10 +42,10 @@ export interface IBaseWidget {
 		error: boolean;
 		errorMessage: string;
 		data: {
-			// legend?: string;
+			query?: string;
+			legend?: string;
 			queryData: QueryData[];
-			// query: string;
-		}[];
+		};
 	};
 	stepSize?: number;
 	yAxisUnit?: string;
@@ -74,8 +78,9 @@ export interface IMetricsBuilderQuery {
 	name: string;
 	legend: string;
 	metricName: string | null;
-	groupBy: string[];
+	groupBy?: string[];
 	tagFilters: IQueryBuilderTagFilters;
+	reduceTo?: EReduceOperator;
 }
 
 export interface IQueryBuilderTagFilters {
diff --git a/frontend/src/types/api/metrics/getQueryRange.ts b/frontend/src/types/api/metrics/getQueryRange.ts
index 742a0608f0..da28970542 100644
--- a/frontend/src/types/api/metrics/getQueryRange.ts
+++ b/frontend/src/types/api/metrics/getQueryRange.ts
@@ -1,6 +1,6 @@
 import { QueryData } from '../widgets/getQuery';
 
-export type MetricsRangeProps = any;
+export type MetricsRangeProps = never;
 export interface MetricRangePayloadProps {
 	data: {
 		result: QueryData[];
diff --git a/frontend/src/types/api/widgets/getQuery.ts b/frontend/src/types/api/widgets/getQuery.ts
index 6e97d116e8..3a2eb1cda5 100644
--- a/frontend/src/types/api/widgets/getQuery.ts
+++ b/frontend/src/types/api/widgets/getQuery.ts
@@ -9,6 +9,7 @@ export interface QueryData {
 		[key: string]: string;
 	};
 	queryName: string;
+	legend?: string;
 	values: [number, string][];
 }
 

From dbe68c064c7ec909e8d72f88969b9b71d89dc64d Mon Sep 17 00:00:00 2001
From: Prashant Shahi <prashant@signoz.io>
Date: Tue, 28 Jun 2022 17:33:50 +0530
Subject: [PATCH 41/42] =?UTF-8?q?chore(install-script):=20=F0=9F=97=91?=
 =?UTF-8?q?=EF=B8=8F=20=20remove=20arm=20YAML=20as=20already=20satisfied?=
 =?UTF-8?q?=20by=20single=20YAML=20(#1326)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Prashant Shahi <prashant@signoz.io>
---
 deploy/install.sh | 30 +++++++-----------------------
 1 file changed, 7 insertions(+), 23 deletions(-)

diff --git a/deploy/install.sh b/deploy/install.sh
index 12814c8980..492336a566 100755
--- a/deploy/install.sh
+++ b/deploy/install.sh
@@ -36,9 +36,9 @@ is_mac() {
     [[ $OSTYPE == darwin* ]]
 }
 
-is_arm64(){
-    [[ `uname -m` == 'arm64' ]]
-}
+# is_arm64(){
+#     [[ `uname -m` == 'arm64' ]]
+# }
 
 check_os() {
     if is_mac; then
@@ -237,11 +237,7 @@ bye() {  # Prints a friendly good bye message and exits the script.
 
         echo "🔴 The containers didn't seem to start correctly. Please run the following command to check containers that may have errored out:"
         echo ""
-        if is_arm64; then
-            echo -e "$sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.arm.yaml ps -a"
-        else
-            echo -e "$sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml ps -a"
-        fi
+        echo -e "$sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml ps -a"
 
         # echo "Please read our troubleshooting guide https://signoz.io/docs/deployment/docker#troubleshooting"
         echo "or reach us for support in #help channel in our Slack Community https://signoz.io/slack"
@@ -466,22 +462,14 @@ start_docker
 
 echo ""
 echo -e "\n🟡 Pulling the latest container images for SigNoz.\n"
-if is_arm64; then
-    $sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.arm.yaml pull
-else
-    $sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml pull
-fi
+$sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml pull
 
 echo ""
 echo "🟡 Starting the SigNoz containers. It may take a few minutes ..."
 echo
 # The docker-compose command does some nasty stuff for the `--detach` functionality. So we add a `|| true` so that the
 # script doesn't exit because this command looks like it failed to do it's thing.
-if is_arm64; then
-    $sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.arm.yaml up --detach --remove-orphans || true
-else
-    $sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml up --detach --remove-orphans || true
-fi
+$sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml up --detach --remove-orphans || true
 
 wait_for_containers_start 60
 echo ""
@@ -510,11 +498,7 @@ else
     echo -e "🟢 Your frontend is running on http://localhost:3301"
     echo ""
 
-    if is_arm64; then
-        echo "ℹ️  To bring down SigNoz and clean volumes : $sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.arm.yaml down -v"
-    else
-        echo "ℹ️  To bring down SigNoz and clean volumes : $sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml down -v"
-    fi
+    echo "ℹ️  To bring down SigNoz and clean volumes : $sudo_cmd docker-compose -f ./docker/clickhouse-setup/docker-compose.yaml down -v"
 
     echo ""
     echo "+++++++++++++++++++++++++++++++++++++++++++++++++"

From 0a6fa0ee8549d8b1cd391bdfc67d565b91f4c432 Mon Sep 17 00:00:00 2001
From: Prashant Shahi <prashant@signoz.io>
Date: Wed, 29 Jun 2022 13:38:56 +0530
Subject: [PATCH 42/42] =?UTF-8?q?chore(release):=20=F0=9F=93=8C=20pin=20ve?=
 =?UTF-8?q?rsions:=20SigNoz=200.9.0,=20OtelCollector=200.45.1-1.0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Prashant Shahi <prashant@signoz.io>
---
 deploy/docker-swarm/clickhouse-setup/docker-compose.yaml | 8 ++++----
 deploy/docker/clickhouse-setup/docker-compose.yaml       | 8 ++++----
 pkg/query-service/tests/test-deploy/docker-compose.yaml  | 4 ++--
 3 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml b/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml
index 45b4137d11..4f27360876 100644
--- a/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml
+++ b/deploy/docker-swarm/clickhouse-setup/docker-compose.yaml
@@ -39,7 +39,7 @@ services:
         condition: on-failure
 
   query-service:
-    image: signoz/query-service:0.8.2
+    image: signoz/query-service:0.9.0
     command: ["-config=/root/config/prometheus.yml"]
     # ports:
     #   - "6060:6060"     # pprof port
@@ -67,7 +67,7 @@ services:
       - clickhouse
 
   frontend:
-    image: signoz/frontend:0.8.2
+    image: signoz/frontend:0.9.0
     deploy:
       restart_policy:
         condition: on-failure
@@ -80,7 +80,7 @@ services:
       - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
 
   otel-collector:
-    image: signoz/otelcontribcol:0.45.1-0.3
+    image: signoz/otelcontribcol:0.45.1-1.0
     command: ["--config=/etc/otel-collector-config.yaml"]
     volumes:
       - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
@@ -106,7 +106,7 @@ services:
       - clickhouse
 
   otel-collector-metrics:
-    image: signoz/otelcontribcol:0.45.1-0.3
+    image: signoz/otelcontribcol:0.45.1-1.0
     command: ["--config=/etc/otel-collector-metrics-config.yaml"]
     volumes:
       - ./otel-collector-metrics-config.yaml:/etc/otel-collector-metrics-config.yaml
diff --git a/deploy/docker/clickhouse-setup/docker-compose.yaml b/deploy/docker/clickhouse-setup/docker-compose.yaml
index 166a2096e3..8ce015e298 100644
--- a/deploy/docker/clickhouse-setup/docker-compose.yaml
+++ b/deploy/docker/clickhouse-setup/docker-compose.yaml
@@ -38,7 +38,7 @@ services:
 # Notes for Maintainers/Contributors who will change Line Numbers of Frontend & Query-Section. Please Update Line Numbers in `./scripts/commentLinesForSetup.sh` & `./CONTRIBUTING.md`
 
   query-service:
-    image: signoz/query-service:0.8.2
+    image: signoz/query-service:0.9.0
     container_name: query-service
     command: ["-config=/root/config/prometheus.yml"]
     # ports:
@@ -65,7 +65,7 @@ services:
         condition: service_healthy
 
   frontend:
-    image: signoz/frontend:0.8.2
+    image: signoz/frontend:0.9.0
     container_name: frontend
     restart: on-failure
     depends_on:
@@ -77,7 +77,7 @@ services:
       - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
 
   otel-collector:
-    image: signoz/otelcontribcol:0.45.1-0.3
+    image: signoz/otelcontribcol:0.45.1-1.0
     command: ["--config=/etc/otel-collector-config.yaml"]
     volumes:
       - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
@@ -98,7 +98,7 @@ services:
         condition: service_healthy
 
   otel-collector-metrics:
-    image: signoz/otelcontribcol:0.45.1-0.3
+    image: signoz/otelcontribcol:0.45.1-1.0
     command: ["--config=/etc/otel-collector-metrics-config.yaml"]
     volumes:
       - ./otel-collector-metrics-config.yaml:/etc/otel-collector-metrics-config.yaml
diff --git a/pkg/query-service/tests/test-deploy/docker-compose.yaml b/pkg/query-service/tests/test-deploy/docker-compose.yaml
index b1c6a39d7e..beb2e0b068 100644
--- a/pkg/query-service/tests/test-deploy/docker-compose.yaml
+++ b/pkg/query-service/tests/test-deploy/docker-compose.yaml
@@ -58,7 +58,7 @@ services:
         condition: service_healthy
 
   otel-collector:
-    image: signoz/otelcontribcol:0.45.1-0.3
+    image: signoz/otelcontribcol:0.45.1-1.0
     command: ["--config=/etc/otel-collector-config.yaml"]
     volumes:
       - ./otel-collector-config.yaml:/etc/otel-collector-config.yaml
@@ -71,7 +71,7 @@ services:
         condition: service_healthy
 
   otel-collector-metrics:
-    image: signoz/otelcontribcol:0.45.1-0.3
+    image: signoz/otelcontribcol:0.45.1-1.0
     command: ["--config=/etc/otel-collector-metrics-config.yaml"]
     volumes:
       - ./otel-collector-metrics-config.yaml:/etc/otel-collector-metrics-config.yaml