diff --git a/frontend/src/container/QueryTable/QueryTable.intefaces.ts b/frontend/src/container/QueryTable/QueryTable.intefaces.ts
index f76aba08b3..de3885701a 100644
--- a/frontend/src/container/QueryTable/QueryTable.intefaces.ts
+++ b/frontend/src/container/QueryTable/QueryTable.intefaces.ts
@@ -13,4 +13,5 @@ export type QueryTableProps = Omit<
 	query: Query;
 	renderActionCell?: (record: RowData) => ReactNode;
 	modifyColumns?: (columns: ColumnsType<RowData>) => ColumnsType<RowData>;
+	renderColumnCell?: Record<string, (record: RowData) => ReactNode>;
 };
diff --git a/frontend/src/container/QueryTable/QueryTable.tsx b/frontend/src/container/QueryTable/QueryTable.tsx
index 309b0fd338..5ec9dd9121 100644
--- a/frontend/src/container/QueryTable/QueryTable.tsx
+++ b/frontend/src/container/QueryTable/QueryTable.tsx
@@ -9,6 +9,7 @@ export function QueryTable({
 	query,
 	renderActionCell,
 	modifyColumns,
+	renderColumnCell,
 	...props
 }: QueryTableProps): JSX.Element {
 	const { columns, dataSource } = useMemo(
@@ -17,8 +18,9 @@ export function QueryTable({
 				query,
 				queryTableData,
 				renderActionCell,
+				renderColumnCell,
 			}),
-		[query, queryTableData, renderActionCell],
+		[query, queryTableData, renderColumnCell, renderActionCell],
 	);
 
 	const filteredColumns = columns.filter((item) => item.key !== 'timestamp');
diff --git a/frontend/src/lib/query/createTableColumnsFromQuery.ts b/frontend/src/lib/query/createTableColumnsFromQuery.ts
index 7fbbfbe3c7..8a2ffd3ec9 100644
--- a/frontend/src/lib/query/createTableColumnsFromQuery.ts
+++ b/frontend/src/lib/query/createTableColumnsFromQuery.ts
@@ -15,7 +15,7 @@ import { v4 as uuid } from 'uuid';
 
 type CreateTableDataFromQueryParams = Pick<
 	QueryTableProps,
-	'queryTableData' | 'query' | 'renderActionCell'
+	'queryTableData' | 'query' | 'renderActionCell' | 'renderColumnCell'
 >;
 
 export type RowData = {
@@ -347,6 +347,7 @@ const generateData = (
 
 const generateTableColumns = (
 	dynamicColumns: DynamicColumns,
+	renderColumnCell?: QueryTableProps['renderColumnCell'],
 ): ColumnsType<RowData> => {
 	const columns: ColumnsType<RowData> = dynamicColumns.reduce<
 		ColumnsType<RowData>
@@ -355,6 +356,7 @@ const generateTableColumns = (
 			dataIndex: item.key,
 			key: item.key,
 			title: item.title,
+			render: renderColumnCell && renderColumnCell[item.key],
 			// sorter: item.sortable
 			// 	? (a: RowData, b: RowData): number =>
 			// 			(a[item.key] as number) - (b[item.key] as number)
@@ -371,6 +373,7 @@ export const createTableColumnsFromQuery: CreateTableDataFromQuery = ({
 	query,
 	queryTableData,
 	renderActionCell,
+	renderColumnCell,
 }) => {
 	const dynamicColumns = getDynamicColumns(queryTableData, query);
 
@@ -381,7 +384,7 @@ export const createTableColumnsFromQuery: CreateTableDataFromQuery = ({
 
 	const dataSource = generateData(filledDynamicColumns, rowsLength);
 
-	const columns = generateTableColumns(filledDynamicColumns);
+	const columns = generateTableColumns(filledDynamicColumns, renderColumnCell);
 
 	const actionsCell: ColumnType<RowData> | null = renderActionCell
 		? {