From 471803115ed91b1cf6404e4bb02cf3745925fea4 Mon Sep 17 00:00:00 2001
From: Vikrant Gupta <vikrant.thomso@gmail.com>
Date: Thu, 7 Nov 2024 11:47:35 +0530
Subject: [PATCH] feat: added support for instrumentation scope in logs (#6378)

* feat: added support for instrumentation scope in logs

* chore: remove console logs

* fix: the logic for rendering prefix

* feat: address review comments

---------

Co-authored-by: SagarRajput-7 <162284829+SagarRajput-7@users.noreply.github.com>
---
 .../Logs/LogStateIndicator/utils.test.ts      |  7 +++++++
 .../src/container/LogDetailedView/utils.tsx   |  9 +++++++++
 .../container/MetricsApplication/constant.ts  |  1 +
 .../AggregatorFilter/AggregatorFilter.tsx     |  5 +++++
 .../filters/GroupByFilter/GroupByFilter.tsx   |  3 +++
 .../filters/GroupByFilter/utils.ts            |  7 ++++++-
 .../QueryBuilderSearch/OptionRenderer.tsx     |  9 ++++-----
 .../filters/QueryBuilderSearch/index.tsx      |  1 +
 .../QueryBuilderSearchV2.styles.scss          | 14 ++++++++++++++
 .../Suggestions.styles.scss                   | 19 +++++++++++++++++++
 frontend/src/container/QueryBuilder/type.ts   |  1 +
 frontend/src/hooks/queryBuilder/useOptions.ts |  1 +
 frontend/src/types/api/logs/log.ts            |  3 +++
 13 files changed, 74 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/Logs/LogStateIndicator/utils.test.ts b/frontend/src/components/Logs/LogStateIndicator/utils.test.ts
index 17c601ffb4..f940ee3046 100644
--- a/frontend/src/components/Logs/LogStateIndicator/utils.test.ts
+++ b/frontend/src/components/Logs/LogStateIndicator/utils.test.ts
@@ -17,6 +17,7 @@ describe('getLogIndicatorType', () => {
 			body: 'Sample log Message',
 			resources_string: {},
 			attributesString: {},
+			scope_string: {},
 			attributes_string: {},
 			attributesInt: {},
 			attributesFloat: {},
@@ -40,6 +41,7 @@ describe('getLogIndicatorType', () => {
 			body: 'Sample log Message',
 			resources_string: {},
 			attributesString: {},
+			scope_string: {},
 			attributes_string: {},
 			attributesInt: {},
 			attributesFloat: {},
@@ -62,6 +64,7 @@ describe('getLogIndicatorType', () => {
 			body: 'Sample log Message',
 			resources_string: {},
 			attributesString: {},
+			scope_string: {},
 			attributes_string: {},
 			attributesInt: {},
 			attributesFloat: {},
@@ -83,6 +86,7 @@ describe('getLogIndicatorType', () => {
 			body: 'Sample log',
 			resources_string: {},
 			attributesString: {},
+			scope_string: {},
 			attributes_string: {
 				log_level: 'INFO' as never,
 			},
@@ -112,6 +116,7 @@ describe('getLogIndicatorTypeForTable', () => {
 			attributesString: {},
 			attributes_string: {},
 			attributesInt: {},
+			scope_string: {},
 			attributesFloat: {},
 			severity_text: 'WARN',
 		};
@@ -130,6 +135,7 @@ describe('getLogIndicatorTypeForTable', () => {
 			severity_number: 0,
 			body: 'Sample log message',
 			resources_string: {},
+			scope_string: {},
 			attributesString: {},
 			attributes_string: {},
 			attributesInt: {},
@@ -166,6 +172,7 @@ describe('logIndicatorBySeverityNumber', () => {
 				body: 'Sample log Message',
 				resources_string: {},
 				attributesString: {},
+				scope_string: {},
 				attributes_string: {},
 				attributesInt: {},
 				attributesFloat: {},
diff --git a/frontend/src/container/LogDetailedView/utils.tsx b/frontend/src/container/LogDetailedView/utils.tsx
index 766bb8b5bf..da62f97f8e 100644
--- a/frontend/src/container/LogDetailedView/utils.tsx
+++ b/frontend/src/container/LogDetailedView/utils.tsx
@@ -157,6 +157,11 @@ export const getFieldAttributes = (field: string): IFieldAttributes => {
 		const stringWithoutPrefix = field.slice('resources_'.length);
 		const parts = splitOnce(stringWithoutPrefix, '.');
 		[dataType, newField] = parts;
+	} else if (field.startsWith('scope_string')) {
+		logType = MetricsType.Scope;
+		const stringWithoutPrefix = field.slice('scope_'.length);
+		const parts = splitOnce(stringWithoutPrefix, '.');
+		[dataType, newField] = parts;
 	}
 
 	return { dataType, newField, logType };
@@ -187,6 +192,7 @@ export const aggregateAttributesResourcesToString = (logData: ILog): string => {
 		traceId: logData.traceId,
 		attributes: {},
 		resources: {},
+		scope: {},
 		severity_text: logData.severity_text,
 		severity_number: logData.severity_number,
 	};
@@ -198,6 +204,9 @@ export const aggregateAttributesResourcesToString = (logData: ILog): string => {
 		} else if (key.startsWith('resources_')) {
 			outputJson.resources = outputJson.resources || {};
 			Object.assign(outputJson.resources, logData[key as keyof ILog]);
+		} else if (key.startsWith('scope_string')) {
+			outputJson.scope = outputJson.scope || {};
+			Object.assign(outputJson.scope, logData[key as keyof ILog]);
 		} else {
 			// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 			// @ts-ignore
diff --git a/frontend/src/container/MetricsApplication/constant.ts b/frontend/src/container/MetricsApplication/constant.ts
index 9c039292bd..decd31534b 100644
--- a/frontend/src/container/MetricsApplication/constant.ts
+++ b/frontend/src/container/MetricsApplication/constant.ts
@@ -53,6 +53,7 @@ export enum KeyOperationTableHeader {
 export enum MetricsType {
 	Tag = 'tag',
 	Resource = 'resource',
+	Scope = 'scope',
 }
 
 export enum WidgetKeys {
diff --git a/frontend/src/container/QueryBuilder/filters/AggregatorFilter/AggregatorFilter.tsx b/frontend/src/container/QueryBuilder/filters/AggregatorFilter/AggregatorFilter.tsx
index 36c54aa9a1..60905fa33b 100644
--- a/frontend/src/container/QueryBuilder/filters/AggregatorFilter/AggregatorFilter.tsx
+++ b/frontend/src/container/QueryBuilder/filters/AggregatorFilter/AggregatorFilter.tsx
@@ -81,8 +81,10 @@ export const AggregatorFilter = memo(function AggregatorFilter({
 										prefix: item.type || '',
 										condition: !item.isColumn,
 									}),
+									!item.isColumn && item.type ? item.type : '',
 								)}
 								dataType={item.dataType}
+								type={item.type || ''}
 							/>
 						),
 						value: `${item.key}${selectValueDivider}${createIdFromObjectFields(
@@ -187,6 +189,9 @@ export const AggregatorFilter = memo(function AggregatorFilter({
 			prefix: query.aggregateAttribute.type || '',
 			condition: !query.aggregateAttribute.isColumn,
 		}),
+		!query.aggregateAttribute.isColumn && query.aggregateAttribute.type
+			? query.aggregateAttribute.type
+			: '',
 	);
 
 	return (
diff --git a/frontend/src/container/QueryBuilder/filters/GroupByFilter/GroupByFilter.tsx b/frontend/src/container/QueryBuilder/filters/GroupByFilter/GroupByFilter.tsx
index bed3870570..476bf71f21 100644
--- a/frontend/src/container/QueryBuilder/filters/GroupByFilter/GroupByFilter.tsx
+++ b/frontend/src/container/QueryBuilder/filters/GroupByFilter/GroupByFilter.tsx
@@ -75,8 +75,10 @@ export const GroupByFilter = memo(function GroupByFilter({
 										prefix: item.type || '',
 										condition: !item.isColumn,
 									}),
+									!item.isColumn && item.type ? item.type : '',
 								)}
 								dataType={item.dataType || ''}
+								type={item.type || ''}
 							/>
 						),
 						value: `${item.id}`,
@@ -166,6 +168,7 @@ export const GroupByFilter = memo(function GroupByFilter({
 						prefix: item.type || '',
 						condition: !item.isColumn,
 					}),
+					!item.isColumn && item.type ? item.type : '',
 				)}`,
 				value: `${item.id}`,
 			}),
diff --git a/frontend/src/container/QueryBuilder/filters/GroupByFilter/utils.ts b/frontend/src/container/QueryBuilder/filters/GroupByFilter/utils.ts
index 50dccec4d9..0fb85a7e30 100644
--- a/frontend/src/container/QueryBuilder/filters/GroupByFilter/utils.ts
+++ b/frontend/src/container/QueryBuilder/filters/GroupByFilter/utils.ts
@@ -1,8 +1,9 @@
 import { MetricsType } from 'container/MetricsApplication/constant';
 
-export function removePrefix(str: string): string {
+export function removePrefix(str: string, type: string): string {
 	const tagPrefix = `${MetricsType.Tag}_`;
 	const resourcePrefix = `${MetricsType.Resource}_`;
+	const scopePrefix = `${MetricsType.Scope}_`;
 
 	if (str.startsWith(tagPrefix)) {
 		return str.slice(tagPrefix.length);
@@ -10,5 +11,9 @@ export function removePrefix(str: string): string {
 	if (str.startsWith(resourcePrefix)) {
 		return str.slice(resourcePrefix.length);
 	}
+	if (str.startsWith(scopePrefix) && type === MetricsType.Scope) {
+		return str.slice(scopePrefix.length);
+	}
+
 	return str;
 }
diff --git a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/OptionRenderer.tsx b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/OptionRenderer.tsx
index a7dcef96c3..a93041f5e8 100644
--- a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/OptionRenderer.tsx
+++ b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/OptionRenderer.tsx
@@ -3,25 +3,23 @@ import './QueryBuilderSearch.styles.scss';
 import { Tooltip } from 'antd';
 
 import { TagContainer, TagLabel, TagValue } from './style';
-import { getOptionType } from './utils';
 
 function OptionRenderer({
 	label,
 	value,
 	dataType,
+	type,
 }: OptionRendererProps): JSX.Element {
-	const optionType = getOptionType(label);
-
 	return (
 		<span className="option">
-			{optionType ? (
+			{type ? (
 				<Tooltip title={`${value}`} placement="topLeft">
 					<div className="selectOptionContainer">
 						<div className="option-value">{value}</div>
 						<div className="option-meta-data-container">
 							<TagContainer>
 								<TagLabel>Type: </TagLabel>
-								<TagValue>{optionType}</TagValue>
+								<TagValue>{type}</TagValue>
 							</TagContainer>
 							<TagContainer>
 								<TagLabel>Data type: </TagLabel>
@@ -43,6 +41,7 @@ interface OptionRendererProps {
 	label: string;
 	value: string;
 	dataType: string;
+	type: string;
 }
 
 export default OptionRenderer;
diff --git a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/index.tsx b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/index.tsx
index c1f4b85a11..ba30d96d9c 100644
--- a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/index.tsx
+++ b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/index.tsx
@@ -410,6 +410,7 @@ function QueryBuilderSearch({
 									label={option.label}
 									value={option.value}
 									dataType={option.dataType || ''}
+									type={option.type || ''}
 								/>
 								{option.selected && <StyledCheckOutlined />}
 							</Select.Option>
diff --git a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.styles.scss b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.styles.scss
index 7aee4f9414..60eec0bdb6 100644
--- a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.styles.scss
+++ b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.styles.scss
@@ -260,6 +260,20 @@
 					background: rgba(189, 153, 121, 0.1);
 				}
 			}
+
+			&.scope {
+				border: 1px solid rgba(113, 144, 249, 0.2);
+
+				.ant-typography {
+					color: var(--bg-robin-400);
+					background: rgba(113, 144, 249, 0.1);
+					font-size: 14px;
+				}
+
+				.ant-tag-close-icon {
+					background: rgba(113, 144, 249, 0.1);
+				}
+			}
 		}
 	}
 }
diff --git a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/Suggestions.styles.scss b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/Suggestions.styles.scss
index 1b434316e5..bff02fab3e 100644
--- a/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/Suggestions.styles.scss
+++ b/frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/Suggestions.styles.scss
@@ -94,6 +94,25 @@
 						letter-spacing: -0.06px;
 					}
 				}
+
+				&.scope {
+					border-radius: 50px;
+					background: rgba(113, 144, 249, 0.1) !important;
+					color: var(--bg-robin-400) !important;
+
+					.dot {
+						background-color: var(--bg-robin-400);
+					}
+					.text {
+						color: var(--bg-robin-400);
+						font-family: Inter;
+						font-size: 12px;
+						font-style: normal;
+						font-weight: 400;
+						line-height: 18px; /* 150% */
+						letter-spacing: -0.06px;
+					}
+				}
 			}
 		}
 		.option-meta-data-container {
diff --git a/frontend/src/container/QueryBuilder/type.ts b/frontend/src/container/QueryBuilder/type.ts
index 183dd157f8..d20925e330 100644
--- a/frontend/src/container/QueryBuilder/type.ts
+++ b/frontend/src/container/QueryBuilder/type.ts
@@ -16,4 +16,5 @@ export type Option = {
 	selected?: boolean;
 	dataType?: string;
 	isIndexed?: boolean;
+	type?: string;
 };
diff --git a/frontend/src/hooks/queryBuilder/useOptions.ts b/frontend/src/hooks/queryBuilder/useOptions.ts
index 2f24dd0d21..e990f789de 100644
--- a/frontend/src/hooks/queryBuilder/useOptions.ts
+++ b/frontend/src/hooks/queryBuilder/useOptions.ts
@@ -46,6 +46,7 @@ export const useOptions = (
 				value: item.key,
 				dataType: item.dataType,
 				isIndexed: item?.isIndexed,
+				type: item?.type || '',
 			})),
 		[getLabel],
 	);
diff --git a/frontend/src/types/api/logs/log.ts b/frontend/src/types/api/logs/log.ts
index 85574248f7..1224f55fee 100644
--- a/frontend/src/types/api/logs/log.ts
+++ b/frontend/src/types/api/logs/log.ts
@@ -9,6 +9,7 @@ export interface ILog {
 	severityNumber: number;
 	body: string;
 	resources_string: Record<string, never>;
+	scope_string: Record<string, never>;
 	attributesString: Record<string, never>;
 	attributes_string: Record<string, never>;
 	attributesInt: Record<string, never>;
@@ -22,6 +23,7 @@ type OmitAttributesResources = Pick<
 	Exclude<
 		keyof ILog,
 		| 'resources_string'
+		| 'scope_string'
 		| 'attributesString'
 		| 'attributes_string'
 		| 'attributesInt'
@@ -32,4 +34,5 @@ type OmitAttributesResources = Pick<
 export type ILogAggregateAttributesResources = OmitAttributesResources & {
 	attributes: Record<string, never>;
 	resources: Record<string, never>;
+	scope: Record<string, never>;
 };