diff --git a/static/app/views/insights/browser/webVitals/components/charts/webVitalStatusLineChart.tsx b/static/app/views/insights/browser/webVitals/components/charts/webVitalStatusLineChart.tsx index 8a1f2a2fd44911..38249a696ae00a 100644 --- a/static/app/views/insights/browser/webVitals/components/charts/webVitalStatusLineChart.tsx +++ b/static/app/views/insights/browser/webVitals/components/charts/webVitalStatusLineChart.tsx @@ -6,14 +6,16 @@ import type {Plottable} from 'sentry/views/dashboards/widgets/timeSeriesWidget/p import {Thresholds} from 'sentry/views/dashboards/widgets/timeSeriesWidget/plottables/thresholds'; import {WEB_VITAL_FULL_NAME_MAP} from 'sentry/views/insights/browser/webVitals/components/webVitalDescription'; import {Referrer} from 'sentry/views/insights/browser/webVitals/referrers'; -import {FIELD_ALIASES} from 'sentry/views/insights/browser/webVitals/settings'; +import { + DEFAULT_QUERY_FILTER, + FIELD_ALIASES, +} from 'sentry/views/insights/browser/webVitals/settings'; import type {WebVitals} from 'sentry/views/insights/browser/webVitals/types'; import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; import { PERFORMANCE_SCORE_MEDIANS, PERFORMANCE_SCORE_P90S, } from 'sentry/views/insights/browser/webVitals/utils/scoreThresholds'; -import {useDefaultWebVitalsQuery} from 'sentry/views/insights/browser/webVitals/utils/useDefaultQuery'; // eslint-disable-next-line no-restricted-imports import {InsightsLineChartWidget} from 'sentry/views/insights/common/components/insightsLineChartWidget'; import type {DiscoverSeries} from 'sentry/views/insights/common/queries/useDiscoverSeries'; @@ -34,11 +36,10 @@ export function WebVitalStatusLineChart({ browserTypes, subregions, }: Props) { - const defaultQuery = useDefaultWebVitalsQuery(); const webVitalP90 = webVital ? PERFORMANCE_SCORE_P90S[webVital] : 0; const webVitalMedian = webVital ? PERFORMANCE_SCORE_MEDIANS[webVital] : 0; - const search = new MutableSearch(defaultQuery); + const search = new MutableSearch(DEFAULT_QUERY_FILTER); const referrer = Referrer.WEB_VITAL_STATUS_LINE_CHART; if (transaction) { diff --git a/static/app/views/insights/browser/webVitals/components/pageOverviewWebVitalsDetailPanel.tsx b/static/app/views/insights/browser/webVitals/components/pageOverviewWebVitalsDetailPanel.tsx index 90d6bb7d0e9bed..ee1ddbef9a0fda 100644 --- a/static/app/views/insights/browser/webVitals/components/pageOverviewWebVitalsDetailPanel.tsx +++ b/static/app/views/insights/browser/webVitals/components/pageOverviewWebVitalsDetailPanel.tsx @@ -29,7 +29,6 @@ import {useProjectRawWebVitalsQuery} from 'sentry/views/insights/browser/webVita import {getWebVitalScoresFromTableDataRow} from 'sentry/views/insights/browser/webVitals/queries/storedScoreQueries/getWebVitalScoresFromTableDataRow'; import {useProjectWebVitalsScoresQuery} from 'sentry/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresQuery'; import {useSpanSamplesCategorizedQuery} from 'sentry/views/insights/browser/webVitals/queries/useSpanSamplesCategorizedQuery'; -import {useTransactionSamplesCategorizedQuery} from 'sentry/views/insights/browser/webVitals/queries/useTransactionSamplesCategorizedQuery'; import type { SpanSampleRowWithScore, TransactionSampleRowWithScore, @@ -38,7 +37,6 @@ import type { import decodeBrowserTypes from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; import useProfileExists from 'sentry/views/insights/browser/webVitals/utils/useProfileExists'; import {SampleDrawerBody} from 'sentry/views/insights/common/components/sampleDrawerBody'; -import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap'; import {useDomainViewFilters} from 'sentry/views/insights/pages/useFilters'; import {SpanIndexedField, type SubregionCode} from 'sentry/views/insights/types'; import {TraceViewSources} from 'sentry/views/performance/newTraceDetails/traceHeader/breadcrumbs'; @@ -85,7 +83,6 @@ export function PageOverviewWebVitalsDetailPanel({ const routes = useRoutes(); const {replayExists} = useReplayExists(); const domainViewFilters = useDomainViewFilters(); - const useEap = useInsightsEap(); const browserTypes = decodeBrowserTypes(location.query[SpanIndexedField.BROWSER_NAME]); const subregions = location.query[ @@ -124,24 +121,11 @@ export function PageOverviewWebVitalsDetailPanel({ const projectScore = getWebVitalScoresFromTableDataRow(projectScoresData?.[0]); - const {data: transactionsTableData, isLoading: isTransactionWebVitalsQueryLoading} = - useTransactionSamplesCategorizedQuery({ - transaction: transaction ?? '', - webVital, - enabled: - Boolean(webVital) && - !useEap && - (!isInp || (!isSpansWebVital && useSpansWebVitals)), - browserTypes, - subregions, - }); - const {data: spansTableData, isLoading: isSpansLoading} = useSpanSamplesCategorizedQuery({ transaction: transaction ?? '', webVital, - enabled: - Boolean(webVital) && (useEap || isInp || (isSpansWebVital && useSpansWebVitals)), + enabled: Boolean(webVital), browserTypes, subregions, }); @@ -150,10 +134,6 @@ export function PageOverviewWebVitalsDetailPanel({ spansTableData.filter(row => row['profile.id']).map(row => row['profile.id']) ); - const getProjectSlug = (row: TransactionSampleRowWithScore): string => { - return project && !Array.isArray(location.query.project) ? project.slug : row.project; - }; - const renderHeadCell = (col: Column) => { if (col.key === 'transaction') { return {col.name}; @@ -192,99 +172,6 @@ export function PageOverviewWebVitalsDetailPanel({ return getDuration(value / 1000, 2, true); }; - const renderBodyCell = (col: Column, row: TransactionSampleRowWithScore) => { - const {key} = col; - const projectSlug = getProjectSlug(row); - if (key === 'score') { - if (row[`measurements.${webVital}` as keyof typeof row] !== undefined) { - return ( - - - - ); - } - return null; - } - if (col.key === 'webVital') { - // @ts-expect-error TS(2551): Property 'measurements.null' does not exist on typ... Remove this comment to see the full error message - const value = row[`measurements.${webVital}`]; - if (value === undefined) { - return ( - - {t('(no value)')} - - ); - } - const formattedValue = - webVital === 'cls' ? value?.toFixed(2) : getFormattedDuration(value); - return {formattedValue}; - } - if (key === 'id') { - const eventTarget = generateLinkToEventInTraceView({ - eventId: row.id, - traceSlug: row.trace, - timestamp: row.timestamp, - organization, - location, - view: domainViewFilters.view, - source: TraceViewSources.WEB_VITALS_MODULE, - }); - return ( - - {getShortEventId(row.id)} - - ); - } - if (key === 'replayId') { - const replayTarget = - row['transaction.duration'] !== undefined && - replayLinkGenerator( - organization, - { - replayId: row.replayId, - id: row.id, - 'transaction.duration': row['transaction.duration'], - timestamp: row.timestamp, - }, - undefined - ); - - return row.replayId && replayTarget && replayExists(row[key]) ? ( - - {getShortEventId(row.replayId)} - - ) : ( - - {t('(no value)')} - - ); - } - if (key === 'profile.id') { - if (!defined(project) || !defined(row['profile.id'])) { - return ( - - {t('(no value)')} - - ); - } - const target = generateProfileFlamechartRoute({ - organization, - projectSlug, - profileId: String(row['profile.id']), - }); - - return ( - - {getShortEventId(row['profile.id'])} - - ); - } - // @ts-expect-error TS(7053): Element implicitly has an 'any' type because expre... Remove this comment to see the full error message - return {row[key]}; - }; - const renderSpansBodyCell = (col: Column, row: SpanSampleRowWithScore) => { const {key} = col; if (key === 'score') { @@ -319,11 +206,7 @@ export function PageOverviewWebVitalsDetailPanel({ { replayId: row.replayId, id: '', // id doesn't actually matter here. Just to satisfy type. - 'transaction.duration': - useEap || isInp || (isSpansWebVital && useSpansWebVitals) - ? row[SpanIndexedField.SPAN_SELF_TIME] - : // @ts-expect-error TS(7053): Element implicitly has an 'any' type because expre... Remove this comment to see the full error message - row['transaction.duration'], + 'transaction.duration': row[SpanIndexedField.SPAN_SELF_TIME], timestamp: row.timestamp, }, undefined @@ -381,13 +264,6 @@ export function PageOverviewWebVitalsDetailPanel({ } return {NO_VALUE}; } - if (key === SpanIndexedField.SPAN_DESCRIPTION) { - return ( - - {row[key]} - - ); - } if (key === 'id') { const eventTarget = project?.slug && @@ -460,7 +336,7 @@ export function PageOverviewWebVitalsDetailPanel({ renderBodyCell: renderSpansBodyCell, }} /> - ) : useEap || (isSpansWebVital && useSpansWebVitals) ? ( + ) : ( - ) : ( - )} diff --git a/static/app/views/insights/browser/webVitals/components/tables/pagePerformanceTable.spec.tsx b/static/app/views/insights/browser/webVitals/components/tables/pagePerformanceTable.spec.tsx index 11847023132540..61d65540fd39d4 100644 --- a/static/app/views/insights/browser/webVitals/components/tables/pagePerformanceTable.spec.tsx +++ b/static/app/views/insights/browser/webVitals/components/tables/pagePerformanceTable.spec.tsx @@ -55,8 +55,7 @@ describe('PagePerformanceTable', function () { 'count_scores(measurements.score.inp)': 985, 'count_scores(measurements.score.total)': 985, 'performance_score(measurements.score.total)': 0.847767385770207, - 'total_opportunity_score()': 6.956683571915815e-5, - 'opportunity_score(measurements.score.total)': 179.76662400002692, + 'opportunity_score(measurements.score.total)': 0.0001, 'p75(measurements.inp)': 144.0, 'p75(measurements.ttfb)': 783.125, 'p75(measurements.lcp)': 700.2999782562256, diff --git a/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.spec.tsx b/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.spec.tsx index 2a9278eeb26e22..76f4784b779bb3 100644 --- a/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.spec.tsx +++ b/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.spec.tsx @@ -70,7 +70,7 @@ describe('WebVitalsDetailPanel', function () { 'count()', ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>"', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>"', }), }) ); @@ -103,7 +103,7 @@ describe('WebVitalsDetailPanel', function () { 'sum(measurements.score.weight.lcp)', ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>"', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>"', }), }) ); @@ -133,10 +133,10 @@ describe('WebVitalsDetailPanel', function () { 'count_scores(measurements.score.inp)', 'count_scores(measurements.score.ttfb)', 'count_scores(measurements.score.total)', - 'total_opportunity_score()', + 'opportunity_score(measurements.score.total)', ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>" avg(measurements.score.total):>=0 count_scores(measurements.score.lcp):>0', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,\"\"] !transaction:\"<< unparameterized >>\" avg(measurements.score.total):>=0 count_scores(measurements.score.lcp):>0', }), }) ); diff --git a/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.tsx b/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.tsx index b1090b927535c2..5ab188862036e0 100644 --- a/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.tsx +++ b/static/app/views/insights/browser/webVitals/components/webVitalsDetailPanel.tsx @@ -34,7 +34,6 @@ import type { } from 'sentry/views/insights/browser/webVitals/types'; import decodeBrowserTypes from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; import {SampleDrawerBody} from 'sentry/views/insights/common/components/sampleDrawerBody'; -import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap'; import {useModuleURL} from 'sentry/views/insights/common/utils/useModuleURL'; import { ModuleName, @@ -65,8 +64,6 @@ export function WebVitalsDetailPanel({webVital}: {webVital: WebVitals | null}) { location.query[SpanIndexedField.USER_GEO_SUBREGION] ) as SubregionCode[]; - const useEap = useInsightsEap(); - const {data: projectData} = useProjectRawWebVitalsQuery({browserTypes, subregions}); const {data: projectScoresData} = useProjectWebVitalsScoresQuery({ weightWebVital: webVital ?? 'total', @@ -97,11 +94,8 @@ export function WebVitalsDetailPanel({webVital}: {webVital: WebVitals | null}) { if (!data) { return []; } - const sumWeights = useEap - ? 1 - : webVital - ? projectScoresData?.[0]?.[`sum(measurements.score.weight.${webVital})`] || 0 - : 0; + const sumWeights = 1; + return data .map(row => ({ ...row, @@ -117,7 +111,7 @@ export function WebVitalsDetailPanel({webVital}: {webVital: WebVitals | null}) { return b.opportunity - a.opportunity; }) .slice(0, MAX_ROWS); - }, [data, projectScoresData, webVital, useEap]); + }, [data]); useEffect(() => { if (webVital !== null) { diff --git a/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsQuery.tsx b/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsQuery.tsx index 0bbafb4b6bd799..32e663816d0e4e 100644 --- a/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsQuery.tsx +++ b/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsQuery.tsx @@ -1,7 +1,7 @@ import type {Tag} from 'sentry/types/group'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; +import {DEFAULT_QUERY_FILTER} from 'sentry/views/insights/browser/webVitals/settings'; import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; -import {useDefaultWebVitalsQuery} from 'sentry/views/insights/browser/webVitals/utils/useDefaultQuery'; import {useMetrics} from 'sentry/views/insights/common/queries/useDiscover'; import {SpanMetricsField, type SubregionCode} from 'sentry/views/insights/types'; @@ -19,7 +19,6 @@ export const useProjectRawWebVitalsQuery = ({ subregions, }: Props = {}) => { const search = new MutableSearch([]); - const defaultQuery = useDefaultWebVitalsQuery(); if (transaction) { search.addFilterValue('transaction', transaction); } @@ -35,7 +34,7 @@ export const useProjectRawWebVitalsQuery = ({ return useMetrics( { - search: [defaultQuery, search.formatString()].join(' ').trim(), + search: [DEFAULT_QUERY_FILTER, search.formatString()].join(' ').trim(), limit: 50, fields: [ 'p75(measurements.lcp)', diff --git a/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsValuesTimeseriesQuery.tsx b/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsValuesTimeseriesQuery.tsx index 94b7a27e944d02..897c8da88ed923 100644 --- a/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsValuesTimeseriesQuery.tsx +++ b/static/app/views/insights/browser/webVitals/queries/rawWebVitalsQueries/useProjectRawWebVitalsValuesTimeseriesQuery.tsx @@ -1,10 +1,9 @@ import {getInterval} from 'sentry/components/charts/utils'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; import usePageFilters from 'sentry/utils/usePageFilters'; +import {DEFAULT_QUERY_FILTER} from 'sentry/views/insights/browser/webVitals/settings'; import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; -import {useDefaultWebVitalsQuery} from 'sentry/views/insights/browser/webVitals/utils/useDefaultQuery'; import {useMetricsSeries} from 'sentry/views/insights/common/queries/useDiscoverSeries'; -import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap'; import {SpanIndexedField, type SubregionCode} from 'sentry/views/insights/types'; type Props = { @@ -19,8 +18,6 @@ export const useProjectRawWebVitalsValuesTimeseriesQuery = ({ subregions, }: Props) => { const pageFilters = usePageFilters(); - const defaultQuery = useDefaultWebVitalsQuery(); - const useEap = useInsightsEap(); const search = new MutableSearch([]); if (transaction) { @@ -33,12 +30,10 @@ export const useProjectRawWebVitalsValuesTimeseriesQuery = ({ search.addDisjunctionFilterValues(SpanIndexedField.USER_GEO_SUBREGION, subregions); } - const interval = useEap ? 'spans-low' : 'low'; - const result = useMetricsSeries( { - search: [defaultQuery, search.formatString()].join(' ').trim(), - interval: getInterval(pageFilters.selection.datetime, interval), + search: [DEFAULT_QUERY_FILTER, search.formatString()].join(' ').trim(), + interval: getInterval(pageFilters.selection.datetime, 'spans-low'), yAxis: [ 'p75(measurements.lcp)', 'p75(measurements.fcp)', diff --git a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresQuery.tsx b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresQuery.tsx index af8b1dff1fe43d..59098c220d4172 100644 --- a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresQuery.tsx +++ b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresQuery.tsx @@ -1,9 +1,9 @@ import type {Tag} from 'sentry/types/group'; import type {DiscoverDatasets} from 'sentry/utils/discover/types'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; +import {DEFAULT_QUERY_FILTER} from 'sentry/views/insights/browser/webVitals/settings'; import type {WebVitals} from 'sentry/views/insights/browser/webVitals/types'; import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; -import {useDefaultWebVitalsQuery} from 'sentry/views/insights/browser/webVitals/utils/useDefaultQuery'; import {useMetrics} from 'sentry/views/insights/common/queries/useDiscover'; import {SpanIndexedField, type SubregionCode} from 'sentry/views/insights/types'; @@ -23,8 +23,6 @@ export const useProjectWebVitalsScoresQuery = ({ browserTypes, subregions, }: Props = {}) => { - const defaultQuery = useDefaultWebVitalsQuery(); - const search = new MutableSearch([]); if (transaction) { search.addFilterValue('transaction', transaction); @@ -43,7 +41,7 @@ export const useProjectWebVitalsScoresQuery = ({ { cursor: '', limit: 50, - search: [defaultQuery, search.formatString()].join(' ').trim(), + search: [DEFAULT_QUERY_FILTER, search.formatString()].join(' ').trim(), fields: [ 'performance_score(measurements.score.lcp)', 'performance_score(measurements.score.fcp)', diff --git a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresTimeseriesQuery.tsx b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresTimeseriesQuery.tsx index d12b731dc3c3e7..4c8131c1e73587 100644 --- a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresTimeseriesQuery.tsx +++ b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresTimeseriesQuery.tsx @@ -1,8 +1,8 @@ import type {SeriesDataUnit} from 'sentry/types/echarts'; import type {Tag} from 'sentry/types/group'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; +import {DEFAULT_QUERY_FILTER} from 'sentry/views/insights/browser/webVitals/settings'; import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; -import {useDefaultWebVitalsQuery} from 'sentry/views/insights/browser/webVitals/utils/useDefaultQuery'; import {useMetricsSeries} from 'sentry/views/insights/common/queries/useDiscoverSeries'; import {SpanMetricsField, type SubregionCode} from 'sentry/views/insights/types'; @@ -30,8 +30,6 @@ export const useProjectWebVitalsScoresTimeseriesQuery = ({ browserTypes, subregions, }: Props) => { - const defaultQuery = useDefaultWebVitalsQuery(); - const search = new MutableSearch([ 'has:measurements.score.total', ...(tag ? [`${tag.key}:"${tag.name}"`] : []), @@ -48,7 +46,7 @@ export const useProjectWebVitalsScoresTimeseriesQuery = ({ const result = useMetricsSeries( { - search: [defaultQuery, search.formatString()].join(' ').trim(), + search: [DEFAULT_QUERY_FILTER, search.formatString()].join(' ').trim(), yAxis: [ 'performance_score(measurements.score.lcp)', 'performance_score(measurements.score.fcp)', diff --git a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionSamplesWebVitalsScoresQuery.tsx b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionSamplesWebVitalsScoresQuery.tsx index 7cbcf4d35ae889..20128130ebc0a3 100644 --- a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionSamplesWebVitalsScoresQuery.tsx +++ b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionSamplesWebVitalsScoresQuery.tsx @@ -1,4 +1,3 @@ -import {DiscoverDatasets} from 'sentry/utils/discover/types'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; import type {WebVitals} from 'sentry/views/insights/browser/webVitals/types'; import { @@ -8,14 +7,8 @@ import { import {mapWebVitalToOrderBy} from 'sentry/views/insights/browser/webVitals/utils/mapWebVitalToOrderBy'; import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; import {useWebVitalsSort} from 'sentry/views/insights/browser/webVitals/utils/useWebVitalsSort'; -import {useDiscover, useEAPSpans} from 'sentry/views/insights/common/queries/useDiscover'; -import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap'; -import { - type DiscoverProperty, - type DiscoverResponse, - SpanIndexedField, - type SubregionCode, -} from 'sentry/views/insights/types'; +import {useEAPSpans} from 'sentry/views/insights/common/queries/useDiscover'; +import {SpanIndexedField, type SubregionCode} from 'sentry/views/insights/types'; type Props = { transaction: string; @@ -42,8 +35,6 @@ export const useTransactionSamplesWebVitalsScoresQuery = ({ browserTypes, subregions, }: Props) => { - const useEap = useInsightsEap(); - const filteredSortableFields = SORTABLE_INDEXED_FIELDS; const sort = useWebVitalsSort({ @@ -69,14 +60,14 @@ export const useTransactionSamplesWebVitalsScoresQuery = ({ ); } - const eapResult = useEAPSpans( + const result = useEAPSpans( { sorts: [sort], search: mutableSearch.formatString(), orderby: (mapWebVitalToOrderBy(orderBy) ?? withProfiles) ? '-profile.id' : undefined, limit: limit ?? 50, - enabled: enabled && useEap, + enabled, fields: [ 'id', 'trace', @@ -100,48 +91,9 @@ export const useTransactionSamplesWebVitalsScoresQuery = ({ 'api.performance.browser.web-vitals.transaction' ); - const result = useDiscover( - { - sorts: [sort], - search: mutableSearch.formatString(), - limit: limit ?? 50, - enabled: enabled && !useEap, - orderby: - (mapWebVitalToOrderBy(orderBy) ?? withProfiles) ? '-profile.id' : undefined, - fields: [ - 'id', - 'trace', - 'user.display', - 'transaction', - 'measurements.lcp', - 'measurements.fcp', - 'measurements.cls', - 'measurements.ttfb', - 'transaction.duration', - 'replayId', - 'timestamp', - 'profile.id', - 'project', - 'measurements.score.total', - ...(webVital - ? ([ - `measurements.score.${webVital}`, - `measurements.score.weight.${webVital}`, - ] as const) - : []), - ], - }, - DiscoverDatasets.DISCOVER, - 'api.performance.browser.web-vitals.transaction' - ); - - const finalResult = useEap ? eapResult : result; - - const finalData = finalResult.data.map(row => ({ + const finalData = result.data.map(row => ({ ...row, - 'span.duration': useEap - ? row['span.duration'] - : (row as (typeof result)['data'][number])['transaction.duration'], + 'span.duration': row['span.duration'], ...(webVital ? { [`${webVital}Score`]: Math.round( diff --git a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionWebVitalsScoresQuery.tsx b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionWebVitalsScoresQuery.tsx index 8dc4b5bf67fb17..a6dc84a7db8346 100644 --- a/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionWebVitalsScoresQuery.tsx +++ b/static/app/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionWebVitalsScoresQuery.tsx @@ -1,16 +1,15 @@ import type {Sort} from 'sentry/utils/discover/fields'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; import {getWebVitalScoresFromTableDataRow} from 'sentry/views/insights/browser/webVitals/queries/storedScoreQueries/getWebVitalScoresFromTableDataRow'; +import {DEFAULT_QUERY_FILTER} from 'sentry/views/insights/browser/webVitals/settings'; import type { Opportunity, Score, WebVitals, } from 'sentry/views/insights/browser/webVitals/types'; import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; -import {useDefaultWebVitalsQuery} from 'sentry/views/insights/browser/webVitals/utils/useDefaultQuery'; import {useWebVitalsSort} from 'sentry/views/insights/browser/webVitals/utils/useWebVitalsSort'; import {useMetrics} from 'sentry/views/insights/common/queries/useDiscover'; -import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap'; import { type MetricsProperty, SpanIndexedField, @@ -43,26 +42,14 @@ export const useTransactionWebVitalsScoresQuery = ({ subregions, }: Props) => { const sort = useWebVitalsSort({sortName, defaultSort}); - const defaultQuery = useDefaultWebVitalsQuery(); - const useEap = useInsightsEap(); - - const totalOpportunityScoreField = ( - useEap ? 'opportunity_score(measurements.score.total)' : 'total_opportunity_score()' - ) satisfies MetricsProperty; + const totalOpportunityScoreField = + 'opportunity_score(measurements.score.total)' satisfies MetricsProperty; if (sort !== undefined) { if (sort.field === 'avg(measurements.score.total)') { sort.field = 'performance_score(measurements.score.total)'; } - if ( - [ - 'opportunity_score(measurements.score.total)', - 'total_opportunity_score()', - ].includes(sort.field) - ) { - sort.field = totalOpportunityScoreField; - } } const search = new MutableSearch([ @@ -82,7 +69,7 @@ export const useTransactionWebVitalsScoresQuery = ({ const {data, isPending, ...rest} = useMetrics( { limit: limit ?? 50, - search: [defaultQuery, search.formatString()].join(' ').trim(), + search: [DEFAULT_QUERY_FILTER, search.formatString()].join(' ').trim(), sorts: [sort], enabled, fields: [ diff --git a/static/app/views/insights/browser/webVitals/queries/useTransactionSamplesCategorizedQuery.tsx b/static/app/views/insights/browser/webVitals/queries/useTransactionSamplesCategorizedQuery.tsx deleted file mode 100644 index a1a13761955b58..00000000000000 --- a/static/app/views/insights/browser/webVitals/queries/useTransactionSamplesCategorizedQuery.tsx +++ /dev/null @@ -1,86 +0,0 @@ -import {useTransactionSamplesWebVitalsScoresQuery} from 'sentry/views/insights/browser/webVitals/queries/storedScoreQueries/useTransactionSamplesWebVitalsScoresQuery'; -import type {WebVitals} from 'sentry/views/insights/browser/webVitals/types'; -import type {BrowserType} from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; -import { - PERFORMANCE_SCORE_MEDIANS, - PERFORMANCE_SCORE_P90S, -} from 'sentry/views/insights/browser/webVitals/utils/scoreThresholds'; -import type {SubregionCode} from 'sentry/views/insights/types'; - -type Props = { - browserTypes: BrowserType[]; - enabled: boolean; - subregions: SubregionCode[]; - transaction: string; - webVital: WebVitals | null; -}; - -export function useTransactionSamplesCategorizedQuery({ - transaction, - webVital, - enabled, - browserTypes, - subregions, -}: Props) { - const {data: goodData, isLoading: isGoodTransactionWebVitalsQueryLoading} = - useTransactionSamplesWebVitalsScoresQuery({ - limit: 3, - transaction: transaction ?? '', - query: webVital - ? `measurements.${webVital}:<${PERFORMANCE_SCORE_P90S[webVital]}` - : undefined, - enabled, - withProfiles: true, - sortName: 'webVitalSort', - webVital: webVital ?? undefined, - browserTypes, - subregions, - }); - - const {data: mehData, isLoading: isMehTransactionWebVitalsQueryLoading} = - useTransactionSamplesWebVitalsScoresQuery({ - limit: 3, - transaction: transaction ?? '', - query: webVital - ? `measurements.${webVital}:<${PERFORMANCE_SCORE_MEDIANS[webVital]} measurements.${webVital}:>=${PERFORMANCE_SCORE_P90S[webVital]}` - : undefined, - enabled, - withProfiles: true, - sortName: 'webVitalSort', - webVital: webVital ?? undefined, - browserTypes, - subregions, - }); - - const {data: poorData, isLoading: isPoorTransactionWebVitalsQueryLoading} = - useTransactionSamplesWebVitalsScoresQuery({ - limit: 3, - transaction: transaction ?? '', - query: webVital - ? `measurements.${webVital}:>=${PERFORMANCE_SCORE_MEDIANS[webVital]}` - : undefined, - enabled, - withProfiles: true, - sortName: 'webVitalSort', - webVital: webVital ?? undefined, - browserTypes, - subregions, - }); - - const data = [...goodData, ...mehData, ...poorData]; - - const isTransactionWebVitalsQueryLoading = - isGoodTransactionWebVitalsQueryLoading || - isMehTransactionWebVitalsQueryLoading || - isPoorTransactionWebVitalsQueryLoading; - - const transactionsTableData = data.sort( - // @ts-expect-error TS(7053): Element implicitly has an 'any' type because expre... Remove this comment to see the full error message - (a, b) => a[`${webVital}Score`] - b[`${webVital}Score`] - ); - - return { - data: transactionsTableData, - isLoading: isTransactionWebVitalsQueryLoading, - }; -} diff --git a/static/app/views/insights/browser/webVitals/settings.ts b/static/app/views/insights/browser/webVitals/settings.ts index 973e985a689829..2c6a77bc42a48b 100644 --- a/static/app/views/insights/browser/webVitals/settings.ts +++ b/static/app/views/insights/browser/webVitals/settings.ts @@ -10,9 +10,6 @@ export const MODULE_DOC_LINK = 'https://docs.sentry.io/product/insights/frontend/web-vitals/'; export const DEFAULT_QUERY_FILTER = - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>"'; - -export const DEFAULT_EAP_QUERY_FILTER = 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>"'; export const MODULE_FEATURES = ['insights-initial-modules']; diff --git a/static/app/views/insights/browser/webVitals/utils/useDefaultQuery.ts b/static/app/views/insights/browser/webVitals/utils/useDefaultQuery.ts deleted file mode 100644 index a455c39468d6e2..00000000000000 --- a/static/app/views/insights/browser/webVitals/utils/useDefaultQuery.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { - DEFAULT_EAP_QUERY_FILTER, - DEFAULT_QUERY_FILTER, -} from 'sentry/views/insights/browser/webVitals/settings'; -import {useInsightsEap} from 'sentry/views/insights/common/utils/useEap'; - -export const useDefaultWebVitalsQuery = () => { - const useEap = useInsightsEap(); - - if (useEap) { - return DEFAULT_EAP_QUERY_FILTER; - } - - return DEFAULT_QUERY_FILTER; -}; diff --git a/static/app/views/insights/browser/webVitals/views/pageOverview.spec.tsx b/static/app/views/insights/browser/webVitals/views/pageOverview.spec.tsx index 1b5c594e833cb5..90ea81074274eb 100644 --- a/static/app/views/insights/browser/webVitals/views/pageOverview.spec.tsx +++ b/static/app/views/insights/browser/webVitals/views/pageOverview.spec.tsx @@ -79,7 +79,7 @@ describe('PageOverview', function () { 'count()', ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>"', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>"', }), }) ); @@ -111,7 +111,7 @@ describe('PageOverview', function () { `count_scores(measurements.score.inp)`, ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>"', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>"', }), }) ); diff --git a/static/app/views/insights/browser/webVitals/views/webVitalsLandingPage.spec.tsx b/static/app/views/insights/browser/webVitals/views/webVitalsLandingPage.spec.tsx index 3d1edd59ebf273..76a7a7522a0d87 100644 --- a/static/app/views/insights/browser/webVitals/views/webVitalsLandingPage.spec.tsx +++ b/static/app/views/insights/browser/webVitals/views/webVitalsLandingPage.spec.tsx @@ -93,10 +93,9 @@ describe('WebVitalsLandingPage', function () { 'count_scores(measurements.score.inp)', 'count_scores(measurements.score.ttfb)', 'count_scores(measurements.score.total)', - 'total_opportunity_score()', ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>" avg(measurements.score.total):>=0', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>" avg(measurements.score.total):>=0', }), }) ); @@ -116,7 +115,7 @@ describe('WebVitalsLandingPage', function () { 'count()', ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>"', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>"', }), }) ); @@ -148,7 +147,7 @@ describe('WebVitalsLandingPage', function () { `count_scores(measurements.score.inp)`, ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>"', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>"', }), }) ); diff --git a/static/app/views/insights/common/components/widgets/performanceScoreBreakdownChartWidget.tsx b/static/app/views/insights/common/components/widgets/performanceScoreBreakdownChartWidget.tsx index 281fa8c52ba974..ab7647f5d65898 100644 --- a/static/app/views/insights/common/components/widgets/performanceScoreBreakdownChartWidget.tsx +++ b/static/app/views/insights/common/components/widgets/performanceScoreBreakdownChartWidget.tsx @@ -6,10 +6,10 @@ import {MutableSearch} from 'sentry/utils/tokenizeSearch'; import useLocationQuery from 'sentry/utils/url/useLocationQuery'; import {ORDER} from 'sentry/views/insights/browser/webVitals/components/charts/performanceScoreChart'; import {WebVitalsWeightList} from 'sentry/views/insights/browser/webVitals/components/charts/webVitalWeightList'; +import {DEFAULT_QUERY_FILTER} from 'sentry/views/insights/browser/webVitals/settings'; import type {WebVitals} from 'sentry/views/insights/browser/webVitals/types'; import {getWeights} from 'sentry/views/insights/browser/webVitals/utils/getWeights'; import decodeBrowserTypes from 'sentry/views/insights/browser/webVitals/utils/queryParameterDecoders/browserType'; -import {useDefaultWebVitalsQuery} from 'sentry/views/insights/browser/webVitals/utils/useDefaultQuery'; import {InsightsTimeSeriesWidget} from 'sentry/views/insights/common/components/insightsTimeSeriesWidget'; import type {LoadableChartWidgetProps} from 'sentry/views/insights/common/components/widgets/types'; import { @@ -34,8 +34,9 @@ export default function PerformanceScoreBreakdownChartWidget( }); const theme = useTheme(); const segmentColors = theme.chart.getColorPalette(4).slice(0, 5); - const defaultQuery = useDefaultWebVitalsQuery(); - const search = new MutableSearch(`${defaultQuery} has:measurements.score.total`); + const search = new MutableSearch( + `${DEFAULT_QUERY_FILTER} has:measurements.score.total` + ); if (transaction.length && transaction[0]) { search.addFilterValue('transaction', transaction[0]); diff --git a/static/app/views/insights/common/queries/useDiscover.ts b/static/app/views/insights/common/queries/useDiscover.ts index a2a4c572511a02..988a9b9a29cac0 100644 --- a/static/app/views/insights/common/queries/useDiscover.ts +++ b/static/app/views/insights/common/queries/useDiscover.ts @@ -107,10 +107,7 @@ export const useDiscoverOrEap = ( ); }; -export const useDiscover = < - T extends Array>, - ResponseType, ->( +const useDiscover = >, ResponseType>( options: UseDiscoverOptions = {}, dataset: DiscoverDatasets, referrer: string diff --git a/static/app/views/insights/types.tsx b/static/app/views/insights/types.tsx index 80ab620f681c4d..0e4f90afdc9596 100644 --- a/static/app/views/insights/types.tsx +++ b/static/app/views/insights/types.tsx @@ -554,7 +554,6 @@ type MetricsFunctions = | 'performance_score' | 'count_scores' | 'opportunity_score' - | 'total_opportunity_score' | 'p75'; export enum MetricsFields { diff --git a/static/app/views/performance/landing/widgets/components/widgetContainer.spec.tsx b/static/app/views/performance/landing/widgets/components/widgetContainer.spec.tsx index 3636693b721b9f..9b54af40eccc78 100644 --- a/static/app/views/performance/landing/widgets/components/widgetContainer.spec.tsx +++ b/static/app/views/performance/landing/widgets/components/widgetContainer.spec.tsx @@ -1097,10 +1097,9 @@ describe('Performance > Widgets > WidgetContainer', function () { 'count_scores(measurements.score.inp)', 'count_scores(measurements.score.ttfb)', 'count_scores(measurements.score.total)', - 'total_opportunity_score()', ], query: - 'transaction.op:[pageload,""] span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,""] !transaction:"<< unparameterized >>" avg(measurements.score.total):>=0', + 'span.op:[ui.interaction.click,ui.interaction.hover,ui.interaction.drag,ui.interaction.press,ui.webvital.cls,ui.webvital.lcp,pageload,""] !transaction:"<< unparameterized >>" avg(measurements.score.total):>=0', }), }) );