ref(insights): remove any fields that are already returned as default in useSpanSamples (#89513)

The `useSpanSamples` hook returns a few fields by default, it also takes
a prop `additionalFields` which allows you to return a few extra fields.
The PR ensures that you cannot pass in fields that is returned by
default into `additionalFields`

This will make the eap migration a bit easier. In eap the
`transaction.id` field is now called `transaction.span_id`, so it will
be easier to migrate if we don't have to update `transaction.id`
everywhere.

Author: DominikB2014

static/app/views/insights/common/queries/useSpanSamples.tsx

@@ -19,7 +19,7 @@ import {SpanIndexedField, SpanMetricsField} from 'sentry/views/insights/types';
 
 const {SPAN_SELF_TIME, SPAN_GROUP} = SpanIndexedField;
 
-type Options<Fields> = {
+type Options<Fields extends NonDefaultSpanSampleFields[]> = {
   groupId: string;
   transactionName: string;
   additionalFields?: Fields;
@@ -42,7 +42,20 @@ export type SpanSample = Pick<
   | SpanIndexedField.TRACE
 >;
 
-export const useSpanSamples = <Fields extends SpanIndexedProperty[]>(
+export type DefaultSpanSampleFields =
+  | SpanIndexedField.PROJECT
+  | SpanIndexedField.TRANSACTION_ID
+  | SpanIndexedField.TIMESTAMP
+  | SpanIndexedField.SPAN_ID
+  | SpanIndexedField.PROFILE_ID
+  | SpanIndexedField.SPAN_SELF_TIME;
+
+export type NonDefaultSpanSampleFields = Exclude<
+  SpanIndexedProperty,
+  DefaultSpanSampleFields
+>;
+
+export const useSpanSamples = <Fields extends NonDefaultSpanSampleFields[]>(
   options: Options<Fields>
 ) => {
   const organization = useOrganization();
@@ -103,19 +116,7 @@ export const useSpanSamples = <Fields extends SpanIndexedProperty[]>(
   );
 
   return useApiQuery<{
-    data: Array<
-      Pick<
-        SpanIndexedResponse,
-        | Fields[number]
-        // These fields are returned by default
-        | SpanIndexedField.PROJECT
-        | SpanIndexedField.TRANSACTION_ID
-        | SpanIndexedField.TIMESTAMP
-        | SpanIndexedField.SPAN_ID
-        | SpanIndexedField.PROFILE_ID
-        | SpanIndexedField.SPAN_SELF_TIME
-      >
-    >;
+    data: Array<Pick<SpanIndexedResponse, Fields[number] | DefaultSpanSampleFields>>;
     meta: EventsMetaType;
   }>(
     [

static/app/views/insights/common/views/spanSummaryPage/sampleList/durationChart/index.tsx

@@ -15,23 +15,22 @@ import Chart, {ChartType} from 'sentry/views/insights/common/components/chart';
 import ChartPanel from 'sentry/views/insights/common/components/chartPanel';
 import {useSpanMetrics} from 'sentry/views/insights/common/queries/useDiscover';
 import {useSpanMetricsSeries} from 'sentry/views/insights/common/queries/useDiscoverSeries';
-import type {SpanSample} from 'sentry/views/insights/common/queries/useSpanSamples';
+import type {
+  NonDefaultSpanSampleFields,
+  SpanSample,
+} from 'sentry/views/insights/common/queries/useSpanSamples';
 import {useSpanSamples} from 'sentry/views/insights/common/queries/useSpanSamples';
 import {AverageValueMarkLine} from 'sentry/views/insights/common/utils/averageValueMarkLine';
 import {useSampleScatterPlotSeries} from 'sentry/views/insights/common/views/spanSummaryPage/sampleList/durationChart/useSampleScatterPlotSeries';
-import type {
-  SpanIndexedProperty,
-  SpanMetricsQueryFilters,
-  SubregionCode,
-} from 'sentry/views/insights/types';
+import type {SpanMetricsQueryFilters, SubregionCode} from 'sentry/views/insights/types';
 import {SpanMetricsField} from 'sentry/views/insights/types';
 
 const {SPAN_SELF_TIME, SPAN_OP} = SpanMetricsField;
 
 type Props = {
   groupId: string;
   transactionName: string;
-  additionalFields?: SpanIndexedProperty[];
+  additionalFields?: NonDefaultSpanSampleFields[];
   additionalFilters?: Record<string, string>;
   highlightedSpanId?: string;
   onClickSample?: (sample: SpanSample) => void;

static/app/views/insights/common/views/spanSummaryPage/sampleList/index.tsx

@@ -22,14 +22,14 @@ import decodeSubregions from 'sentry/views/insights/browser/resources/utils/quer
 import {SampleDrawerBody} from 'sentry/views/insights/common/components/sampleDrawerBody';
 import {SampleDrawerHeaderTransaction} from 'sentry/views/insights/common/components/sampleDrawerHeaderTransaction';
 import {DEFAULT_COLUMN_ORDER} from 'sentry/views/insights/common/components/samplesTable/spanSamplesTable';
+import type {NonDefaultSpanSampleFields} from 'sentry/views/insights/common/queries/useSpanSamples';
 import DurationChart from 'sentry/views/insights/common/views/spanSummaryPage/sampleList/durationChart';
 import SampleInfo from 'sentry/views/insights/common/views/spanSummaryPage/sampleList/sampleInfo';
 import SampleTable from 'sentry/views/insights/common/views/spanSummaryPage/sampleList/sampleTable/sampleTable';
 import {useDomainViewFilters} from 'sentry/views/insights/pages/useFilters';
 import {
   ModuleName,
   SpanIndexedField,
-  type SpanIndexedProperty,
   SpanMetricsField,
 } from 'sentry/views/insights/types';
 import {getTransactionSummaryBaseUrl} from 'sentry/views/performance/transactionSummary/utils';
@@ -108,10 +108,7 @@ export function SampleList({groupId, moduleName, transactionRoute, referrer}: Pr
 
   let columnOrder = DEFAULT_COLUMN_ORDER;
 
-  const additionalFields: SpanIndexedProperty[] = [
-    SpanIndexedField.TRACE,
-    SpanIndexedField.TRANSACTION_ID,
-  ];
+  const additionalFields: NonDefaultSpanSampleFields[] = [SpanIndexedField.TRACE];
 
   if (moduleName === ModuleName.RESOURCE) {
     additionalFields?.push(SpanIndexedField.HTTP_RESPONSE_CONTENT_LENGTH);

static/app/views/insights/common/views/spanSummaryPage/sampleList/sampleTable/sampleTable.tsx

@@ -12,12 +12,14 @@ import useOrganization from 'sentry/utils/useOrganization';
 import type {SamplesTableColumnHeader} from 'sentry/views/insights/common/components/samplesTable/spanSamplesTable';
 import {SpanSamplesTable} from 'sentry/views/insights/common/components/samplesTable/spanSamplesTable';
 import {useSpanMetrics} from 'sentry/views/insights/common/queries/useDiscover';
-import type {SpanSample} from 'sentry/views/insights/common/queries/useSpanSamples';
+import type {
+  NonDefaultSpanSampleFields,
+  SpanSample,
+} from 'sentry/views/insights/common/queries/useSpanSamples';
 import {useSpanSamples} from 'sentry/views/insights/common/queries/useSpanSamples';
 import {useTransactions} from 'sentry/views/insights/common/queries/useTransactions';
 import type {
   ModuleName,
-  SpanIndexedProperty,
   SpanMetricsQueryFilters,
   SubregionCode,
 } from 'sentry/views/insights/types';
@@ -32,7 +34,7 @@ type Props = {
   groupId: string;
   moduleName: ModuleName;
   transactionName: string;
-  additionalFields?: SpanIndexedProperty[];
+  additionalFields?: NonDefaultSpanSampleFields[];
   additionalFilters?: Record<string, string>;
   columnOrder?: SamplesTableColumnHeader[];
   highlightedSpanId?: string;

static/app/views/insights/http/components/httpSamplesPanel.spec.tsx

@@ -416,12 +416,7 @@ describe('HTTPSamplesPanel', () => {
             query:
               'span.module:http span.op:http.client span.domain:"\\*.sentry.dev" transaction:/api/0/users',
             project: [],
-            additionalFields: [
-              'trace',
-              'transaction.id',
-              'span.description',
-              'span.status_code',
-            ],
+            additionalFields: ['trace', 'span.description', 'span.status_code'],
             lowerBound: 0,
             firstBound: expect.closeTo(333.3333),
             secondBound: expect.closeTo(666.6666),

static/app/views/insights/http/components/httpSamplesPanel.tsx

@@ -233,7 +233,6 @@ export function HTTPSamplesPanel() {
     search,
     fields: [
       SpanIndexedField.TRACE,
-      SpanIndexedField.TRANSACTION_ID,
       SpanIndexedField.SPAN_DESCRIPTION,
       SpanIndexedField.RESPONSE_CODE,
     ],

static/app/views/insights/http/queries/useSpanSamples.spec.tsx

@@ -8,8 +8,8 @@ import {QueryClientProvider} from 'sentry/utils/queryClient';
 import {MutableSearch} from 'sentry/utils/tokenizeSearch';
 import {useLocation} from 'sentry/utils/useLocation';
 import usePageFilters from 'sentry/utils/usePageFilters';
+import type {NonDefaultSpanSampleFields} from 'sentry/views/insights/common/queries/useSpanSamples';
 import {useSpanSamples} from 'sentry/views/insights/http/queries/useSpanSamples';
-import {SpanIndexedField, type SpanIndexedProperty} from 'sentry/views/insights/types';
 import {OrganizationContext} from 'sentry/views/organizationContext';
 
 jest.mock('sentry/utils/usePageFilters');
@@ -69,10 +69,7 @@ describe('useSpanSamples', () => {
       {
         wrapper: Wrapper,
         initialProps: {
-          fields: [
-            SpanIndexedField.TRANSACTION_ID,
-            SpanIndexedField.SPAN_ID,
-          ] as SpanIndexedProperty[],
+          fields: [] satisfies NonDefaultSpanSampleFields[],
           enabled: false,
         },
       }
@@ -122,10 +119,7 @@ describe('useSpanSamples', () => {
             'span.group': '221aa7ebd216',
             release: '0.0.1',
           },
-          fields: [
-            SpanIndexedField.TRANSACTION_ID,
-            SpanIndexedField.SPAN_ID,
-          ] as SpanIndexedProperty[],
+          fields: [] satisfies NonDefaultSpanSampleFields[],
           referrer: 'api-spec',
         },
       }
@@ -138,7 +132,7 @@ describe('useSpanSamples', () => {
       expect.objectContaining({
         method: 'GET',
         query: {
-          additionalFields: ['transaction.id', 'span_id'],
+          additionalFields: [],
           project: [],
           query: `span.group:221aa7ebd216 release:0.0.1`,
           referrer: 'api-spec',

static/app/views/insights/http/queries/useSpanSamples.tsx

@@ -6,14 +6,13 @@ import {useApiQuery} from 'sentry/utils/queryClient';
 import type {MutableSearch} from 'sentry/utils/tokenizeSearch';
 import useOrganization from 'sentry/utils/useOrganization';
 import usePageFilters from 'sentry/utils/usePageFilters';
-import {getDateConditions} from 'sentry/views/insights/common/utils/getDateConditions';
 import type {
-  SpanIndexedField,
-  SpanIndexedProperty,
-  SpanIndexedResponse,
-} from 'sentry/views/insights/types';
-
-import {useInsightsEap} from '../../common/utils/useEap';
+  DefaultSpanSampleFields,
+  NonDefaultSpanSampleFields,
+} from 'sentry/views/insights/common/queries/useSpanSamples';
+import {getDateConditions} from 'sentry/views/insights/common/utils/getDateConditions';
+import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap';
+import type {SpanIndexedResponse} from 'sentry/views/insights/types';
 
 interface UseSpanSamplesOptions<Fields> {
   enabled?: boolean;
@@ -24,7 +23,7 @@ interface UseSpanSamplesOptions<Fields> {
   search?: MutableSearch;
 }
 
-export const useSpanSamples = <Fields extends SpanIndexedProperty[]>(
+export const useSpanSamples = <Fields extends NonDefaultSpanSampleFields[]>(
   options: UseSpanSamplesOptions<Fields> = {}
 ) => {
   const {
@@ -55,12 +54,7 @@ export const useSpanSamples = <Fields extends SpanIndexedProperty[]>(
         SpanIndexedResponse,
         | Fields[number]
         // These fields are returned by default
-        | SpanIndexedField.PROJECT
-        | SpanIndexedField.TRANSACTION_ID
-        | SpanIndexedField.TIMESTAMP
-        | SpanIndexedField.SPAN_ID
-        | SpanIndexedField.PROFILE_ID
-        | SpanIndexedField.SPAN_SELF_TIME
+        | DefaultSpanSampleFields
       >
     >;
     meta: EventsMetaType;

static/app/views/insights/queues/components/messageSpanSamplesPanel.spec.tsx

@@ -189,7 +189,6 @@ describe('messageSpanSamplesPanel', () => {
         query: expect.objectContaining({
           additionalFields: [
             'trace',
-            'transaction.id',
             'span.description',
             'measurements.messaging.message.body.size',
             'measurements.messaging.message.receive.latency',
@@ -285,7 +284,6 @@ describe('messageSpanSamplesPanel', () => {
         query: expect.objectContaining({
           additionalFields: [
             'trace',
-            'transaction.id',
             'span.description',
             'measurements.messaging.message.body.size',
             'measurements.messaging.message.receive.latency',

static/app/views/insights/queues/components/messageSpanSamplesPanel.tsx

@@ -188,7 +188,6 @@ export function MessageSpanSamplesPanel() {
     enabled: isPanelOpen && durationAxisMax > 0,
     fields: [
       SpanIndexedField.TRACE,
-      SpanIndexedField.TRANSACTION_ID,
       SpanIndexedField.SPAN_DESCRIPTION,
       SpanIndexedField.MESSAGING_MESSAGE_BODY_SIZE,
       SpanIndexedField.MESSAGING_MESSAGE_RECEIVE_LATENCY,