fix(insights): use correct meta in llm monitoring pipelines table (#92328)

llm monitoring table makes multiple requests and joins their data to
create a `rows` array for the `pipelines` table. Because we make
multiple requests, we should combine the meta so that the
`fieldRenderer` is able to correctly lookup the `meta`

Author: DominikB2014

static/app/views/insights/cache/views/cacheLandingPage.tsx

@@ -35,6 +35,7 @@ import {
 import {useSpanMetricsSeries} from 'sentry/views/insights/common/queries/useDiscoverSeries';
 import {useHasFirstSpan} from 'sentry/views/insights/common/queries/useHasFirstSpan';
 import {useOnboardingProject} from 'sentry/views/insights/common/queries/useOnboardingProject';
+import {combineMeta} from 'sentry/views/insights/common/utils/combineMeta';
 import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap';
 import {useSamplesDrawer} from 'sentry/views/insights/common/utils/useSamplesDrawer';
 import {QueryParameterNames} from 'sentry/views/insights/common/views/queryParameters';
@@ -229,25 +230,6 @@ function PageWithProviders() {
 
 export default PageWithProviders;
 
-const combineMeta = (
-  meta1?: EventsMetaType,
-  meta2?: EventsMetaType
-): EventsMetaType | undefined => {
-  if (!meta1 && !meta2) {
-    return undefined;
-  }
-  if (!meta1) {
-    return meta2;
-  }
-  if (!meta2) {
-    return meta1;
-  }
-  return {
-    fields: {...meta1.fields, ...meta2.fields},
-    units: {...meta1.units, ...meta2.units},
-  };
-};
-
 // TODO - this won't be needed once we migrate to EAP
 const addCustomMeta = (meta?: EventsMetaType) => {
   if (meta?.fields) {

static/app/views/insights/common/utils/combineMeta.spec.ts

@@ -0,0 +1,56 @@
+import type {EventsMetaType} from 'sentry/utils/discover/eventView';
+import {combineMeta} from 'sentry/views/insights/common/utils/combineMeta';
+
+describe('combineMeta', () => {
+  it('should combine meta', () => {
+    const meta1: EventsMetaType = {
+      fields: {a: 'boolean'},
+      units: {a: 'boolean'},
+    };
+    const meta2: EventsMetaType = {
+      fields: {b: 'duration'},
+      units: {b: 'millisecond'},
+    };
+
+    const combinedMeta = combineMeta(meta1, meta2);
+    expect(combinedMeta).toEqual({
+      fields: {a: 'boolean', b: 'duration'},
+      units: {a: 'boolean', b: 'millisecond'},
+    });
+  });
+
+  it('should return undefined if both meta are undefined', () => {
+    const combinedMeta = combineMeta(undefined, undefined);
+    expect(combinedMeta).toBeUndefined();
+  });
+
+  it('should return meta1 if meta2 is undefined', () => {
+    const meta1: EventsMetaType = {
+      fields: {a: 'boolean'},
+      units: {a: 'boolean'},
+    };
+    const combinedMeta = combineMeta(meta1, undefined);
+    expect(combinedMeta).toEqual(meta1);
+  });
+
+  it('should combine 3 metas', () => {
+    const meta1: EventsMetaType = {
+      fields: {a: 'boolean'},
+      units: {a: 'boolean'},
+    };
+    const meta2: EventsMetaType = {
+      fields: {b: 'duration'},
+      units: {b: 'millisecond'},
+    };
+    const meta3: EventsMetaType = {
+      fields: {c: 'integer'},
+      units: {},
+    };
+
+    const combinedMeta = combineMeta(meta1, meta2, meta3);
+    expect(combinedMeta).toEqual({
+      fields: {a: 'boolean', b: 'duration', c: 'integer'},
+      units: {a: 'boolean', b: 'millisecond'},
+    });
+  });
+});

static/app/views/insights/common/utils/combineMeta.ts

@@ -0,0 +1,23 @@
+import type {EventsMetaType} from 'sentry/utils/discover/eventView';
+
+export const combineMeta = (
+  ...metas: Array<EventsMetaType | undefined>
+): EventsMetaType | undefined => {
+  const definedMetas = metas.filter(meta => meta !== undefined);
+
+  if (definedMetas.length === 0) {
+    return undefined;
+  }
+
+  const finalMeta: EventsMetaType = {
+    fields: {},
+    units: {},
+  };
+
+  definedMetas.forEach(meta => {
+    finalMeta.fields = {...finalMeta.fields, ...meta.fields};
+    finalMeta.units = {...finalMeta.units, ...meta.units};
+  });
+
+  return finalMeta;
+};

static/app/views/insights/llmMonitoring/components/tables/pipelinesTable.tsx

@@ -28,6 +28,7 @@ import {useNavigate} from 'sentry/utils/useNavigate';
 import useOrganization from 'sentry/utils/useOrganization';
 import {renderHeadCell} from 'sentry/views/insights/common/components/tableCells/renderHeadCell';
 import {useSpanMetrics} from 'sentry/views/insights/common/queries/useDiscover';
+import {combineMeta} from 'sentry/views/insights/common/utils/combineMeta';
 import {useModuleURL} from 'sentry/views/insights/common/utils/useModuleURL';
 import {QueryParameterNames} from 'sentry/views/insights/common/views/queryParameters';
 import type {SpanMetricsResponse} from 'sentry/views/insights/types';
@@ -105,7 +106,13 @@ export function PipelinesTable() {
     sort = {field: 'epm()', kind: 'desc'};
   }
 
-  const {data, isPending, meta, pageLinks, error} = useSpanMetrics(
+  const {
+    data,
+    isPending,
+    meta: baseMeta,
+    pageLinks,
+    error,
+  } = useSpanMetrics(
     {
       search: MutableSearch.fromQueryObject({
         'span.category': 'ai.pipeline',
@@ -125,7 +132,11 @@ export function PipelinesTable() {
     'api.ai-pipelines.view'
   );
 
-  const {data: tokensUsedData, isPending: tokensUsedLoading} = useSpanMetrics(
+  const {
+    data: tokensUsedData,
+    meta: tokensUsedMeta,
+    isPending: tokensUsedLoading,
+  } = useSpanMetrics(
     {
       search: new MutableSearch(
         `span.category:ai span.ai.pipeline.group:[${(data as Row[])
@@ -140,6 +151,7 @@ export function PipelinesTable() {
 
   const {
     data: tokenCostData,
+    meta: tokenCostMeta,
     isPending: tokenCostLoading,
     error: tokenCostError,
   } = useSpanMetrics(
@@ -178,6 +190,8 @@ export function PipelinesTable() {
     return row;
   });
 
+  const meta = combineMeta(baseMeta, tokensUsedMeta, tokenCostMeta);
+
   const handleCursor: CursorHandler = (newCursor, pathname, query) => {
     navigate({
       pathname,