diff --git a/static/app/views/insights/browser/webVitals/components/charts/performanceScoreBreakdownChart.tsx b/static/app/views/insights/browser/webVitals/components/charts/performanceScoreBreakdownChart.tsx index b778bd1fa2ec68..7387d99ea9e9d7 100644 --- a/static/app/views/insights/browser/webVitals/components/charts/performanceScoreBreakdownChart.tsx +++ b/static/app/views/insights/browser/webVitals/components/charts/performanceScoreBreakdownChart.tsx @@ -5,6 +5,7 @@ import {DEFAULT_RELATIVE_PERIODS} from 'sentry/constants'; import {t} from 'sentry/locale'; import {space} from 'sentry/styles/space'; import type {Series} from 'sentry/types/echarts'; +import useOrganization from 'sentry/utils/useOrganization'; import usePageFilters from 'sentry/utils/usePageFilters'; import {ORDER} from 'sentry/views/insights/browser/webVitals/components/charts/performanceScoreChart'; import { @@ -49,6 +50,7 @@ export function PerformanceScoreBreakdownChart({ browserTypes, subregions, }: Props) { + const organization = useOrganization(); const theme = useTheme(); const segmentColors = [...theme.charts.getColorPalette(3).slice(0, 5)]; @@ -61,7 +63,10 @@ export function PerformanceScoreBreakdownChart({ const performanceScoreSubtext = (period && DEFAULT_RELATIVE_PERIODS[period]) ?? ''; const chartSeriesOrder = ORDER; - const weightedTimeseriesData = applyStaticWeightsToTimeseries(timeseriesData); + const weightedTimeseriesData = applyStaticWeightsToTimeseries( + organization, + timeseriesData + ); const weightedTimeseries = formatTimeSeriesResultsToChartData( weightedTimeseriesData, diff --git a/static/app/views/insights/browser/webVitals/components/performanceScoreRingWithTooltips.tsx b/static/app/views/insights/browser/webVitals/components/performanceScoreRingWithTooltips.tsx index de1c78091c4c25..ccb1f213bc70b6 100644 --- a/static/app/views/insights/browser/webVitals/components/performanceScoreRingWithTooltips.tsx +++ b/static/app/views/insights/browser/webVitals/components/performanceScoreRingWithTooltips.tsx @@ -17,6 +17,7 @@ import type { WebVitals, } from 'sentry/views/insights/browser/webVitals/types'; import {getWeights} from 'sentry/views/insights/browser/webVitals/utils/getWeights'; +import {PERFORMANCE_SCORE_WEIGHTS} from 'sentry/views/insights/browser/webVitals/utils/scoreThresholds'; import {useModuleURL} from 'sentry/views/insights/common/utils/useModuleURL'; import {getFormattedDuration} from './webVitalMeters'; @@ -162,7 +163,11 @@ function PerformanceScoreRingWithTooltips({ }); } - const weights = getWeights(ORDER.filter(webVital => projectScore[`${webVital}Score`])); + const weights = organization.features.includes( + 'organizations:performance-vitals-handle-missing-webvitals' + ) + ? getWeights(ORDER.filter(webVital => projectScore[`${webVital}Score`])) + : PERFORMANCE_SCORE_WEIGHTS; const commonWebVitalLabelProps = { organization, diff --git a/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.spec.tsx b/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.spec.tsx index 6da9a7a64ebe25..35b80141833dee 100644 --- a/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.spec.tsx +++ b/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.spec.tsx @@ -1,7 +1,10 @@ +import {OrganizationFixture} from 'sentry-fixture/organization'; + import {applyStaticWeightsToTimeseries} from 'sentry/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries'; describe('applyStaticWeightsToTimeseries', function () { it('updates timeseries scores with static weighing', function () { + const organization = OrganizationFixture(); const timeseriesData = { lcp: [ {name: '2024-07-01T00:00:00.000Z', value: 90}, @@ -28,7 +31,7 @@ describe('applyStaticWeightsToTimeseries', function () { {name: '2024-07-02T00:00:00.000Z', value: 50}, ], }; - const result = applyStaticWeightsToTimeseries(timeseriesData); + const result = applyStaticWeightsToTimeseries(organization, timeseriesData); expect(result).toEqual({ lcp: [ {name: '2024-07-01T00:00:00.000Z', value: 90 * 0.3}, diff --git a/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.tsx b/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.tsx index f83d2b250e2ee0..c1d49ba42f8228 100644 --- a/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.tsx +++ b/static/app/views/insights/browser/webVitals/utils/applyStaticWeightsToTimeseries.tsx @@ -1,14 +1,25 @@ +import type {Organization} from 'sentry/types/organization'; import type {WebVitalsScoreBreakdown} from 'sentry/views/insights/browser/webVitals/queries/storedScoreQueries/useProjectWebVitalsScoresTimeseriesQuery'; import type {WebVitals} from 'sentry/views/insights/browser/webVitals/types'; import {getWeights} from 'sentry/views/insights/browser/webVitals/utils/getWeights'; +import {PERFORMANCE_SCORE_WEIGHTS} from 'sentry/views/insights/browser/webVitals/utils/scoreThresholds'; // Returns a weighed score timeseries with each interval calculated from applying hardcoded weights to unweighted scores -export function applyStaticWeightsToTimeseries(timeseriesData: WebVitalsScoreBreakdown) { - const weights = getWeights( - Object.keys(timeseriesData) - .filter(key => key !== 'total') - .filter(key => timeseriesData[key].some(series => series.value > 0)) as WebVitals[] - ); +export function applyStaticWeightsToTimeseries( + organization: Organization, + timeseriesData: WebVitalsScoreBreakdown +) { + const weights = organization.features.includes( + 'organizations:performance-vitals-handle-missing-webvitals' + ) + ? getWeights( + Object.keys(timeseriesData) + .filter(key => key !== 'total') + .filter(key => + timeseriesData[key].some(series => series.value > 0) + ) as WebVitals[] + ) + : PERFORMANCE_SCORE_WEIGHTS; return { ...Object.keys(weights).reduce((acc, webVital) => { acc[webVital] = timeseriesData[webVital].map(({name, value}) => ({ diff --git a/static/app/views/performance/landing/widgets/widgets/performanceScoreListWidget.tsx b/static/app/views/performance/landing/widgets/widgets/performanceScoreListWidget.tsx index dbbce8d2070a2d..fbe0a64c09b4a7 100644 --- a/static/app/views/performance/landing/widgets/widgets/performanceScoreListWidget.tsx +++ b/static/app/views/performance/landing/widgets/widgets/performanceScoreListWidget.tsx @@ -63,7 +63,10 @@ export function PerformanceScoreListWidget(props: PerformanceWidgetProps) { const order = ORDER; - const weightedTimeseriesData = applyStaticWeightsToTimeseries(timeseriesData); + const weightedTimeseriesData = applyStaticWeightsToTimeseries( + props.organization, + timeseriesData + ); const getAreaChart = () => { const segmentColors = theme.charts.getColorPalette(3).slice(0, 5);