feat: query logic

frontend/src/queries/schema/schema-general.ts

@@ -131,6 +131,7 @@ export type AnyDataNode =
     | ExperimentFunnelsQuery
     | ExperimentTrendsQuery
     | RecordingsQuery
+    | TracesQuery
 
 /**
  * @discriminator kind
@@ -633,6 +634,7 @@ export interface DataTableNode
                     | ErrorTrackingQuery
                     | ExperimentFunnelsQuery
                     | ExperimentTrendsQuery
+                    | TracesQuery
                 )['response']
             >
         >,
@@ -653,6 +655,7 @@ export interface DataTableNode
         | ErrorTrackingQuery
         | ExperimentFunnelsQuery
         | ExperimentTrendsQuery
+        | TracesQuery
     /** Columns shown in the table, unless the `source` provides them. */
     columns?: HogQLExpression[]
     /** Columns that aren't shown in the table, even if in columns or returned data */

frontend/src/scenes/llm-observability/LLMObservabilityTraces.tsx

@@ -1,3 +1,10 @@
+import { useValues } from 'kea'
+
+import { Query } from '~/queries/Query/Query'
+
+import { llmObservabilityLogic } from './llmObservabilityLogic'
+
 export function LLMObservabilityTraces(): JSX.Element {
-    return <div>Traces</div>
+    const { query } = useValues(llmObservabilityLogic)
+    return <Query query={query} />
 }

frontend/src/scenes/llm-observability/llmObservabilityLogic.tsx

@@ -3,6 +3,7 @@ import { loaders } from 'kea-loaders'
 import api from 'lib/api'
 import { STALE_EVENT_SECONDS } from 'lib/constants'
 import { dayjs } from 'lib/dayjs'
+import { getTracesQuery } from 'scenes/llm-observability/queries'
 
 import { NodeKind, TrendsQuery } from '~/queries/schema/schema-general'
 import {
@@ -47,6 +48,7 @@ export const llmObservabilityLogic = kea<llmObservabilityLogicType>([
         setDates: (dateFrom: string | null, dateTo: string | null) => ({ dateFrom, dateTo }),
         setShouldFilterTestAccounts: (shouldFilterTestAccounts: boolean) => ({ shouldFilterTestAccounts }),
         setActiveTab: (activeTab: LLMObservabilityTab) => ({ activeTab }),
+        loadMoreTraces: true,
     }),
 
     reducers({
@@ -66,6 +68,7 @@ export const llmObservabilityLogic = kea<llmObservabilityLogicType>([
             },
         ],
         activeTab: [LLMObservabilityTab.Dashboard, { setActiveTab: (_, { activeTab }) => activeTab }],
+        queryLimit: [30, { setQueryLimit: (_, { queryLimit }) => queryLimit + 30 }],
     }),
 
     selectors({
@@ -238,6 +241,7 @@ export const llmObservabilityLogic = kea<llmObservabilityLogicType>([
                 },
             ],
         ],
+        query: [(s) => [s.queryLimit], (queryLimit) => getTracesQuery({ limit: queryLimit })],
     }),
     loaders({
         hasSentAiGenerationEvent: {

frontend/src/scenes/llm-observability/queries.ts

@@ -0,0 +1,16 @@
+import { DataTableNode, NodeKind, TracesQuery } from '~/queries/schema/schema-general'
+
+type GetTracesQueryParams = Pick<TracesQuery, 'limit'>
+
+export function getTracesQuery({ limit }: GetTracesQueryParams): DataTableNode {
+    return {
+        kind: NodeKind.DataTableNode,
+        source: {
+            kind: NodeKind.TracesQuery,
+            limit: limit,
+        },
+        showActions: false,
+        showTimings: false,
+        // columns: columns,
+    }
+}