From 9d3c4598ac1c1cf1f269695618b258ca8f3ec175 Mon Sep 17 00:00:00 2001
From: Rajat Dabade <rajat@signoz.io>
Date: Fri, 15 Sep 2023 18:13:25 +0530
Subject: [PATCH] refactor: aggreated attributes and resources from json
 (#3558)

---
 .../container/LogDetailedView/JsonView.tsx    | 13 +++---
 .../LogDetailedView/LogDetailedView.types.ts  |  5 +++
 .../src/container/LogDetailedView/utils.tsx   | 42 +++++++++++++++++++
 frontend/src/types/api/logs/log.ts            | 17 ++++++++
 4 files changed, 72 insertions(+), 5 deletions(-)

diff --git a/frontend/src/container/LogDetailedView/JsonView.tsx b/frontend/src/container/LogDetailedView/JsonView.tsx
index e510d46d10..c3ab659567 100644
--- a/frontend/src/container/LogDetailedView/JsonView.tsx
+++ b/frontend/src/container/LogDetailedView/JsonView.tsx
@@ -4,14 +4,17 @@ import { Button, Row } from 'antd';
 import Editor from 'components/Editor';
 import { useMemo } from 'react';
 import { useCopyToClipboard } from 'react-use';
-import { ILog } from 'types/api/logs/log';
 
-interface JSONViewProps {
-	logData: ILog;
-}
+import { JSONViewProps } from './LogDetailedView.types';
+import { aggregateAttributesResourcesToString } from './utils';
+
 function JSONView({ logData }: JSONViewProps): JSX.Element {
 	const [, copyToClipboard] = useCopyToClipboard();
-	const LogJsonData = useMemo(() => JSON.stringify(logData, null, 2), [logData]);
+
+	const LogJsonData = useMemo(
+		() => aggregateAttributesResourcesToString(logData),
+		[logData],
+	);
 	return (
 		<div>
 			<Row
diff --git a/frontend/src/container/LogDetailedView/LogDetailedView.types.ts b/frontend/src/container/LogDetailedView/LogDetailedView.types.ts
index 730bab15c2..5cdf79a30c 100644
--- a/frontend/src/container/LogDetailedView/LogDetailedView.types.ts
+++ b/frontend/src/container/LogDetailedView/LogDetailedView.types.ts
@@ -1,4 +1,5 @@
 import { MetricsType } from 'container/MetricsApplication/constant';
+import { ILog } from 'types/api/logs/log';
 
 export interface BodyTitleRendererProps {
 	title: string;
@@ -18,3 +19,7 @@ export interface IFieldAttributes {
 	newField?: string;
 	logType?: MetricsType;
 }
+
+export interface JSONViewProps {
+	logData: ILog;
+}
diff --git a/frontend/src/container/LogDetailedView/utils.tsx b/frontend/src/container/LogDetailedView/utils.tsx
index 8baee65965..c07c4c7622 100644
--- a/frontend/src/container/LogDetailedView/utils.tsx
+++ b/frontend/src/container/LogDetailedView/utils.tsx
@@ -1,6 +1,7 @@
 import { DataNode } from 'antd/es/tree';
 import { MetricsType } from 'container/MetricsApplication/constant';
 import { uniqueId } from 'lodash-es';
+import { ILog, ILogAggregateAttributesResources } from 'types/api/logs/log';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
 import BodyTitleRenderer from './BodyTitleRenderer';
@@ -12,6 +13,15 @@ export const recursiveParseJSON = (obj: string): Record<string, unknown> => {
 		if (typeof value === 'string') {
 			return recursiveParseJSON(value);
 		}
+		if (typeof value === 'object') {
+			Object.entries(value).forEach(([key, val]) => {
+				if (typeof val === 'string') {
+					value[key] = val.trim();
+				} else if (typeof val === 'object') {
+					value[key] = recursiveParseJSON(JSON.stringify(val));
+				}
+			});
+		}
 		return value;
 	} catch (e) {
 		return {};
@@ -174,3 +184,35 @@ export const getFieldAttributes = (field: string): IFieldAttributes => {
 
 	return { dataType, newField, logType };
 };
+
+export const aggregateAttributesResourcesToString = (logData: ILog): string => {
+	const outputJson: ILogAggregateAttributesResources = {
+		body: logData.body,
+		date: logData.date,
+		id: logData.id,
+		severityNumber: logData.severityNumber,
+		severityText: logData.severityText,
+		spanId: logData.spanId,
+		timestamp: logData.timestamp,
+		traceFlags: logData.traceFlags,
+		traceId: logData.traceId,
+		attributes: {},
+		resources: {},
+	};
+
+	Object.keys(logData).forEach((key) => {
+		if (key.startsWith('attributes_')) {
+			outputJson.attributes = outputJson.attributes || {};
+			Object.assign(outputJson.attributes, logData[key as keyof ILog]);
+		} else if (key.startsWith('resources_')) {
+			outputJson.resources = outputJson.resources || {};
+			Object.assign(outputJson.resources, logData[key as keyof ILog]);
+		} else {
+			// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+			// @ts-ignore
+			outputJson[key] = logData[key as keyof ILog];
+		}
+	});
+
+	return JSON.stringify(outputJson, null, 2);
+};
diff --git a/frontend/src/types/api/logs/log.ts b/frontend/src/types/api/logs/log.ts
index 77b090a0d7..0b519936a6 100644
--- a/frontend/src/types/api/logs/log.ts
+++ b/frontend/src/types/api/logs/log.ts
@@ -14,3 +14,20 @@ export interface ILog {
 	attributesInt: Record<string, never>;
 	attributesFloat: Record<string, never>;
 }
+
+type OmitAttributesResources = Pick<
+	ILog,
+	Exclude<
+		keyof ILog,
+		| 'resources_string'
+		| 'attributesString'
+		| 'attributes_string'
+		| 'attributesInt'
+		| 'attributesFloat'
+	>
+>;
+
+export type ILogAggregateAttributesResources = OmitAttributesResources & {
+	attributes: Record<string, never>;
+	resources: Record<string, never>;
+};