diff --git a/.changeset/tricky-dodos-report.md b/.changeset/tricky-dodos-report.md new file mode 100644 index 000000000..dbbded8f4 --- /dev/null +++ b/.changeset/tricky-dodos-report.md @@ -0,0 +1,5 @@ +--- +"@hyperdx/app": patch +--- + +fix: add json compatibility for infrastructure tab diff --git a/packages/app/src/components/DBInfraPanel.tsx b/packages/app/src/components/DBInfraPanel.tsx index 1b79c9ebd..927aac91c 100644 --- a/packages/app/src/components/DBInfraPanel.tsx +++ b/packages/app/src/components/DBInfraPanel.tsx @@ -119,7 +119,7 @@ const InfraSubpanelGroup = ({ where, groupBy: [], aggFn: 'avg', - field: `${fieldPrefix}cpu.utilization - Gauge`, + field: `${fieldPrefix}cpu.usage - Gauge`, table: 'metrics', numberFormat: K8S_CPU_PERCENTAGE_NUMBER_FORMAT, }, diff --git a/packages/app/src/components/DBRowDataPanel.tsx b/packages/app/src/components/DBRowDataPanel.tsx index c974d56cd..332891314 100644 --- a/packages/app/src/components/DBRowDataPanel.tsx +++ b/packages/app/src/components/DBRowDataPanel.tsx @@ -1,4 +1,5 @@ import { useMemo } from 'react'; +import { flatten } from 'flat'; import type { ResponseJSON } from '@hyperdx/common-utils/dist/clickhouse'; import { SourceKind, TSource } from '@hyperdx/common-utils/dist/types'; import { Box } from '@mantine/core'; @@ -23,7 +24,7 @@ export function useRowData({ const severityTextExpr = source.severityTextExpression || source.statusCodeExpression; - return useQueriedChartConfig( + const queryResult = useQueriedChartConfig( { connection: source.connection, select: [ @@ -112,6 +113,36 @@ export function useRowData({ enabled: rowId != null, }, ); + + // Normalize resource and event attributes to always use flat keys for both JSON and Map columns + const normalizedData = useMemo(() => { + if (!queryResult.data?.data?.[0]) { + return queryResult.data; + } + + const row = queryResult.data.data[0]; + const normalizedRow = { ...row }; + + if (row.__hdx_resource_attributes) { + normalizedRow.__hdx_resource_attributes = flatten( + row.__hdx_resource_attributes, + ); + } + + if (row.__hdx_event_attributes) { + normalizedRow.__hdx_event_attributes = flatten(row.__hdx_event_attributes); + } + + return { + ...queryResult.data, + data: [normalizedRow], + }; + }, [queryResult.data]); + + return { + ...queryResult, + data: normalizedData, + }; } export function getJSONColumnNames(meta: ResponseJSON['meta'] | undefined) { diff --git a/packages/app/src/components/DBRowOverviewPanel.tsx b/packages/app/src/components/DBRowOverviewPanel.tsx index 55d3829c5..9e55a2296 100644 --- a/packages/app/src/components/DBRowOverviewPanel.tsx +++ b/packages/app/src/components/DBRowOverviewPanel.tsx @@ -1,5 +1,4 @@ import { useCallback, useContext, useMemo } from 'react'; -import { flatten } from 'flat'; import isString from 'lodash/isString'; import pickBy from 'lodash/pickBy'; import { SourceKind, TSource } from '@hyperdx/common-utils/dist/types'; @@ -70,17 +69,8 @@ export function RowOverviewPanel({ return false; }); - // memo - const resourceAttributes = useMemo(() => { - return flatten>( - firstRow?.__hdx_resource_attributes ?? EMPTY_OBJ, - ); - }, [firstRow?.__hdx_resource_attributes]); - - const _eventAttributes = firstRow?.__hdx_event_attributes ?? EMPTY_OBJ; - const flattenedEventAttributes = useMemo(() => { - return flatten>(_eventAttributes); - }, [_eventAttributes]); + const resourceAttributes = firstRow?.__hdx_resource_attributes ?? EMPTY_OBJ; + const flattenedEventAttributes = firstRow?.__hdx_event_attributes ?? EMPTY_OBJ; const dataAttributes = eventAttributesExpr && diff --git a/packages/app/src/components/DBRowSidePanel.tsx b/packages/app/src/components/DBRowSidePanel.tsx index c12a895cf..b156b0b7e 100644 --- a/packages/app/src/components/DBRowSidePanel.tsx +++ b/packages/app/src/components/DBRowSidePanel.tsx @@ -231,11 +231,11 @@ const DBRowSidePanel = ({ if (!source?.resourceAttributesExpression || !normalizedRow) { return false; } + + const resourceAttrs = normalizedRow['__hdx_resource_attributes']; return ( - normalizedRow[source.resourceAttributesExpression]?.['k8s.pod.uid'] != - null || - normalizedRow[source.resourceAttributesExpression]?.['k8s.node.name'] != - null + resourceAttrs?.['k8s.pod.uid'] != null || + resourceAttrs?.['k8s.node.name'] != null ); } catch (e) { console.error(e);