ref(starfish): create a shared useSeries function (#70235)

1. Create shared `useSeries` which support `useSpanMetricsSeries` and
`useMetricsSeries` where SpanMetrics and Metrics are the dataset names.
2. Rename `MetricsResponse` to `SpanMetricsResponse`, `MetricsProperty`
to `SpanMetricsProperty`, etc so that they match the datasetname
3. Create `MetricsResponse`, `MetricsProperty` etc for fields in the
Metrics dataset

static/app/views/aiMonitoring/PipelinesTable.tsx

@@ -25,11 +25,11 @@ import useOrganization from 'sentry/utils/useOrganization';
 import {normalizeUrl} from 'sentry/utils/withDomainRequired';
 import {renderHeadCell} from 'sentry/views/starfish/components/tableCells/renderHeadCell';
 import {useSpanMetrics} from 'sentry/views/starfish/queries/useSpanMetrics';
-import type {MetricsResponse} from 'sentry/views/starfish/types';
+import type {SpanMetricsResponse} from 'sentry/views/starfish/types';
 import {QueryParameterNames} from 'sentry/views/starfish/views/queryParameters';
 
 type Row = Pick<
-  MetricsResponse,
+  SpanMetricsResponse,
   | 'project.id'
   | 'span.description'
   | 'span.group'

static/app/views/performance/browser/resources/resourceSummaryPage/resourceSummaryCharts.tsx

@@ -8,7 +8,7 @@ import {useResourceModuleFilters} from 'sentry/views/performance/browser/resourc
 import {AVG_COLOR, THROUGHPUT_COLOR} from 'sentry/views/starfish/colors';
 import Chart, {ChartType} from 'sentry/views/starfish/components/chart';
 import ChartPanel from 'sentry/views/starfish/components/chartPanel';
-import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSpanMetricsSeries';
+import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSeries';
 import {SpanMetricsField} from 'sentry/views/starfish/types';
 import {
   DataTitles,

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

@@ -31,8 +31,8 @@ import {
 } from 'sentry/views/performance/cache/tables/transactionsTable';
 import * as ModuleLayout from 'sentry/views/performance/moduleLayout';
 import {ModulePageProviders} from 'sentry/views/performance/modulePageProviders';
+import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSeries';
 import {useSpanMetrics} from 'sentry/views/starfish/queries/useSpanMetrics';
-import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSpanMetricsSeries';
 import {SpanFunction} from 'sentry/views/starfish/types';
 import {QueryParameterNames} from 'sentry/views/starfish/views/queryParameters';
 

static/app/views/performance/cache/samplePanel/charts/transactionDurationChart.tsx

@@ -1,11 +1,13 @@
 import {decodeScalar} from 'sentry/utils/queryString';
+import {MutableSearch} from 'sentry/utils/tokenizeSearch';
 import useLocationQuery from 'sentry/utils/url/useLocationQuery';
 import {Referrer} from 'sentry/views/performance/cache/referrers';
-import {useTransactionDurationSeries} from 'sentry/views/performance/cache/samplePanel/charts/useTransactionDurationSeries';
 import {CHART_HEIGHT} from 'sentry/views/performance/cache/settings';
 import {AVG_COLOR} from 'sentry/views/starfish/colors';
 import Chart, {ChartType} from 'sentry/views/starfish/components/chart';
 import ChartPanel from 'sentry/views/starfish/components/chartPanel';
+import {useMetricsSeries} from 'sentry/views/starfish/queries/useSeries';
+import type {MetricsQueryFilters} from 'sentry/views/starfish/types';
 import {DataTitles} from 'sentry/views/starfish/views/spans/types';
 
 export function TransactionDurationChart() {
@@ -16,8 +18,13 @@ export function TransactionDurationChart() {
     },
   });
 
-  const {data, isLoading} = useTransactionDurationSeries({
-    transactionName: transaction,
+  const search: MetricsQueryFilters = {
+    transaction,
+  };
+
+  const {data, isLoading} = useMetricsSeries({
+    yAxis: ['avg(transaction.duration)'],
+    search: MutableSearch.fromQueryObject(search),
     referrer: Referrer.SAMPLES_CACHE_TRANSACTION_DURATION,
   });
 

static/app/views/performance/cache/samplePanel/charts/useTransactionDurationSeries.ts

@@ -1,59 +0,0 @@
-import keyBy from 'lodash/keyBy';
-
-import type {Series} from 'sentry/types/echarts';
-import {DiscoverDatasets} from 'sentry/utils/discover/types';
-import {MutableSearch} from 'sentry/utils/tokenizeSearch';
-import usePageFilters from 'sentry/utils/usePageFilters';
-import {getSeriesEventView} from 'sentry/views/starfish/queries/getSeriesEventView';
-import type {MetricTimeseriesRow} from 'sentry/views/starfish/queries/useSpanMetricsSeries';
-import {useWrappedDiscoverTimeseriesQuery} from 'sentry/views/starfish/utils/useSpansQuery';
-
-// TODO - this is pretty much the same as `useSpanMetricsSeries`, we should probably consider making useMetricsSeries later on
-export const useTransactionDurationSeries = (options: {
-  referrer: string;
-  transactionName: string;
-  enabled?: boolean;
-}) => {
-  const pageFilters = usePageFilters();
-
-  const {transactionName, referrer} = options;
-
-  const filters = {
-    transaction: transactionName,
-  };
-
-  const yAxis = ['avg(transaction.duration)'];
-
-  const eventView = getSeriesEventView(
-    MutableSearch.fromQueryObject(filters),
-    undefined,
-    pageFilters.selection,
-    yAxis,
-    undefined,
-    DiscoverDatasets.METRICS
-  );
-
-  const result = useWrappedDiscoverTimeseriesQuery<MetricTimeseriesRow[]>({
-    eventView,
-    initialData: [],
-    referrer,
-    enabled: options.enabled,
-  });
-
-  const parsedData = keyBy(
-    yAxis.map(seriesName => {
-      const series: Series = {
-        seriesName,
-        data: (result?.data ?? []).map(datum => ({
-          value: datum[seriesName],
-          name: datum?.interval,
-        })),
-      };
-
-      return series;
-    }),
-    'seriesName'
-  ) as Record<'avg(transaction.duration)', Series>;
-
-  return {...result, data: parsedData};
-};

static/app/views/performance/cache/tables/transactionsTable.tsx

@@ -17,14 +17,14 @@ import {useLocation} from 'sentry/utils/useLocation';
 import useOrganization from 'sentry/utils/useOrganization';
 import {TransactionCell} from 'sentry/views/performance/cache/tables/transactionCell';
 import {renderHeadCell} from 'sentry/views/starfish/components/tableCells/renderHeadCell';
-import {type MetricsResponse, SpanFunction} from 'sentry/views/starfish/types';
+import {SpanFunction, type SpanMetricsResponse} from 'sentry/views/starfish/types';
 import {QueryParameterNames} from 'sentry/views/starfish/views/queryParameters';
 import {DataTitles} from 'sentry/views/starfish/views/spans/types';
 
 const {CACHE_MISS_RATE, SPM, TIME_SPENT_PERCENTAGE} = SpanFunction;
 
 type Row = Pick<
-  MetricsResponse,
+  SpanMetricsResponse,
   | 'project'
   | 'project.id'
   | 'transaction'

static/app/views/performance/database/databaseLandingPage.tsx

@@ -29,8 +29,8 @@ import * as ModuleLayout from 'sentry/views/performance/moduleLayout';
 import {ModulePageProviders} from 'sentry/views/performance/modulePageProviders';
 import Onboarding from 'sentry/views/performance/onboarding';
 import {useSynchronizeCharts} from 'sentry/views/starfish/components/chart';
+import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSeries';
 import {useSpanMetrics} from 'sentry/views/starfish/queries/useSpanMetrics';
-import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSpanMetricsSeries';
 import {ModuleName, SpanMetricsField} from 'sentry/views/starfish/types';
 import {QueryParameterNames} from 'sentry/views/starfish/views/queryParameters';
 import {ActionSelector} from 'sentry/views/starfish/views/spans/selectors/actionSelector';

static/app/views/performance/database/databaseSpanSummaryPage.tsx

@@ -25,8 +25,8 @@ import {ModulePageProviders} from 'sentry/views/performance/modulePageProviders'
 import {useSynchronizeCharts} from 'sentry/views/starfish/components/chart';
 import {DatabaseSpanDescription} from 'sentry/views/starfish/components/spanDescription';
 import {getTimeSpentExplanation} from 'sentry/views/starfish/components/tableCells/timeSpentCell';
+import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSeries';
 import {useSpanMetrics} from 'sentry/views/starfish/queries/useSpanMetrics';
-import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSpanMetricsSeries';
 import type {SpanMetricsQueryFilters} from 'sentry/views/starfish/types';
 import {SpanFunction, SpanMetricsField} from 'sentry/views/starfish/types';
 import {QueryParameterNames} from 'sentry/views/starfish/views/queryParameters';

static/app/views/performance/database/queriesTable.tsx

@@ -16,13 +16,13 @@ import {useLocation} from 'sentry/utils/useLocation';
 import useOrganization from 'sentry/utils/useOrganization';
 import {renderHeadCell} from 'sentry/views/starfish/components/tableCells/renderHeadCell';
 import {SpanDescriptionCell} from 'sentry/views/starfish/components/tableCells/spanDescriptionCell';
-import type {MetricsResponse} from 'sentry/views/starfish/types';
+import type {SpanMetricsResponse} from 'sentry/views/starfish/types';
 import {ModuleName} from 'sentry/views/starfish/types';
 import {QueryParameterNames} from 'sentry/views/starfish/views/queryParameters';
 import {DataTitles} from 'sentry/views/starfish/views/spans/types';
 
 type Row = Pick<
-  MetricsResponse,
+  SpanMetricsResponse,
   | 'project.id'
   | 'span.description'
   | 'span.group'

static/app/views/performance/http/httpDomainSummaryPage.tsx

@@ -46,8 +46,8 @@ import * as ModuleLayout from 'sentry/views/performance/moduleLayout';
 import {ModulePageProviders} from 'sentry/views/performance/modulePageProviders';
 import {useSynchronizeCharts} from 'sentry/views/starfish/components/chart';
 import {getTimeSpentExplanation} from 'sentry/views/starfish/components/tableCells/timeSpentCell';
+import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSeries';
 import {useSpanMetrics} from 'sentry/views/starfish/queries/useSpanMetrics';
-import {useSpanMetricsSeries} from 'sentry/views/starfish/queries/useSpanMetricsSeries';
 import type {SpanMetricsQueryFilters} from 'sentry/views/starfish/types';
 import {ModuleName, SpanFunction, SpanMetricsField} from 'sentry/views/starfish/types';
 import {QueryParameterNames} from 'sentry/views/starfish/views/queryParameters';