From f6a4b24d82395c83f5898a78d05882ced0ea95cf Mon Sep 17 00:00:00 2001 From: Dominik Buszowiecki Date: Wed, 16 Oct 2024 14:09:31 -0400 Subject: [PATCH] fix none label on distribution chart --- .../insights/pages/ai/aiOverviewPage.tsx | 29 +++++++++++------ .../pages/backend/backendOverviewPage.tsx | 31 ++++++++++++------- .../pages/frontend/frontendOverviewPage.tsx | 29 +++++++++++------ .../pages/mobile/mobileOverviewPage.tsx | 29 +++++++++++------ 4 files changed, 77 insertions(+), 41 deletions(-) diff --git a/static/app/views/insights/pages/ai/aiOverviewPage.tsx b/static/app/views/insights/pages/ai/aiOverviewPage.tsx index aa517302178c1e..85b6989ff1d450 100644 --- a/static/app/views/insights/pages/ai/aiOverviewPage.tsx +++ b/static/app/views/insights/pages/ai/aiOverviewPage.tsx @@ -12,7 +12,10 @@ import {ProjectPageFilter} from 'sentry/components/organizations/projectPageFilt import TransactionNameSearchBar from 'sentry/components/performance/searchBar'; import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle'; import {trackAnalytics} from 'sentry/utils/analytics'; -import {canUseMetricsData} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; +import { + canUseMetricsData, + useMEPSettingContext, +} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; import {PageAlert, usePageAlert} from 'sentry/utils/performance/contexts/pageAlert'; import {PerformanceDisplayProvider} from 'sentry/utils/performance/contexts/performanceDisplayContext'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; @@ -28,6 +31,7 @@ import {AI_LANDING_TITLE} from 'sentry/views/insights/pages/ai/settings'; import {OVERVIEW_PAGE_TITLE} from 'sentry/views/insights/pages/settings'; import {generateGenericPerformanceEventView} from 'sentry/views/performance/data'; import {TripleChartRow} from 'sentry/views/performance/landing/widgets/components/widgetChartRow'; +import {filterAllowedChartsMetrics} from 'sentry/views/performance/landing/widgets/utils'; import {PerformanceWidgetSetting} from 'sentry/views/performance/landing/widgets/widgetDefinitions'; import Onboarding from 'sentry/views/performance/onboarding'; import Table from 'sentry/views/performance/table'; @@ -54,6 +58,7 @@ function AiOverviewPage() { const {projects} = useProjects(); const onboardingProject = useOnboardingProject(); const navigate = useNavigate(); + const mepSetting = useMEPSettingContext(); const withStaticFilters = canUseMetricsData(organization); const eventView = generateGenericPerformanceEventView( @@ -76,15 +81,19 @@ function AiOverviewPage() { const showOnboarding = onboardingProject !== undefined; - const tripleChartRowCharts = [ - PerformanceWidgetSetting.TPM_AREA, - PerformanceWidgetSetting.DURATION_HISTOGRAM, - PerformanceWidgetSetting.P50_DURATION_AREA, - PerformanceWidgetSetting.P75_DURATION_AREA, - PerformanceWidgetSetting.P95_DURATION_AREA, - PerformanceWidgetSetting.P99_DURATION_AREA, - PerformanceWidgetSetting.FAILURE_RATE_AREA, - ]; + const tripleChartRowCharts = filterAllowedChartsMetrics( + organization, + [ + PerformanceWidgetSetting.TPM_AREA, + PerformanceWidgetSetting.DURATION_HISTOGRAM, + PerformanceWidgetSetting.P50_DURATION_AREA, + PerformanceWidgetSetting.P75_DURATION_AREA, + PerformanceWidgetSetting.P95_DURATION_AREA, + PerformanceWidgetSetting.P99_DURATION_AREA, + PerformanceWidgetSetting.FAILURE_RATE_AREA, + ], + mepSetting + ); const sharedProps = {eventView, location, organization, withStaticFilters}; diff --git a/static/app/views/insights/pages/backend/backendOverviewPage.tsx b/static/app/views/insights/pages/backend/backendOverviewPage.tsx index 3ab775bfe0601d..283ab5b72c6214 100644 --- a/static/app/views/insights/pages/backend/backendOverviewPage.tsx +++ b/static/app/views/insights/pages/backend/backendOverviewPage.tsx @@ -12,7 +12,10 @@ import {ProjectPageFilter} from 'sentry/components/organizations/projectPageFilt import TransactionNameSearchBar from 'sentry/components/performance/searchBar'; import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle'; import {trackAnalytics} from 'sentry/utils/analytics'; -import {canUseMetricsData} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; +import { + canUseMetricsData, + useMEPSettingContext, +} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; import {PageAlert, usePageAlert} from 'sentry/utils/performance/contexts/pageAlert'; import {PerformanceDisplayProvider} from 'sentry/utils/performance/contexts/performanceDisplayContext'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; @@ -31,6 +34,7 @@ import { DoubleChartRow, TripleChartRow, } from 'sentry/views/performance/landing/widgets/components/widgetChartRow'; +import {filterAllowedChartsMetrics} from 'sentry/views/performance/landing/widgets/utils'; import {PerformanceWidgetSetting} from 'sentry/views/performance/landing/widgets/widgetDefinitions'; import Onboarding from 'sentry/views/performance/onboarding'; import Table from 'sentry/views/performance/table'; @@ -60,6 +64,7 @@ function BackendOverviewPage() { const {projects} = useProjects(); const onboardingProject = useOnboardingProject(); const navigate = useNavigate(); + const mepSetting = useMEPSettingContext(); const withStaticFilters = canUseMetricsData(organization); const eventView = generateBackendPerformanceEventView( @@ -91,16 +96,20 @@ function BackendOverviewPage() { PerformanceWidgetSetting.SLOW_HTTP_OPS, PerformanceWidgetSetting.SLOW_DB_OPS, ]; - const tripleChartRowCharts = [ - PerformanceWidgetSetting.TPM_AREA, - PerformanceWidgetSetting.DURATION_HISTOGRAM, - PerformanceWidgetSetting.P50_DURATION_AREA, - PerformanceWidgetSetting.P75_DURATION_AREA, - PerformanceWidgetSetting.P95_DURATION_AREA, - PerformanceWidgetSetting.P99_DURATION_AREA, - PerformanceWidgetSetting.FAILURE_RATE_AREA, - PerformanceWidgetSetting.APDEX_AREA, - ]; + const tripleChartRowCharts = filterAllowedChartsMetrics( + organization, + [ + PerformanceWidgetSetting.TPM_AREA, + PerformanceWidgetSetting.DURATION_HISTOGRAM, + PerformanceWidgetSetting.P50_DURATION_AREA, + PerformanceWidgetSetting.P75_DURATION_AREA, + PerformanceWidgetSetting.P95_DURATION_AREA, + PerformanceWidgetSetting.P99_DURATION_AREA, + PerformanceWidgetSetting.FAILURE_RATE_AREA, + PerformanceWidgetSetting.APDEX_AREA, + ], + mepSetting + ); if (organization.features.includes('insights-initial-modules')) { doubleChartRowCharts.unshift( diff --git a/static/app/views/insights/pages/frontend/frontendOverviewPage.tsx b/static/app/views/insights/pages/frontend/frontendOverviewPage.tsx index 883c4c6fabb39a..a3424c4f760c42 100644 --- a/static/app/views/insights/pages/frontend/frontendOverviewPage.tsx +++ b/static/app/views/insights/pages/frontend/frontendOverviewPage.tsx @@ -12,7 +12,10 @@ import {ProjectPageFilter} from 'sentry/components/organizations/projectPageFilt import TransactionNameSearchBar from 'sentry/components/performance/searchBar'; import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle'; import {trackAnalytics} from 'sentry/utils/analytics'; -import {canUseMetricsData} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; +import { + canUseMetricsData, + useMEPSettingContext, +} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; import {PageAlert, usePageAlert} from 'sentry/utils/performance/contexts/pageAlert'; import {PerformanceDisplayProvider} from 'sentry/utils/performance/contexts/performanceDisplayContext'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; @@ -32,6 +35,7 @@ import { DoubleChartRow, TripleChartRow, } from 'sentry/views/performance/landing/widgets/components/widgetChartRow'; +import {filterAllowedChartsMetrics} from 'sentry/views/performance/landing/widgets/utils'; import {PerformanceWidgetSetting} from 'sentry/views/performance/landing/widgets/widgetDefinitions'; import Onboarding from 'sentry/views/performance/onboarding'; import Table from 'sentry/views/performance/table'; @@ -59,6 +63,7 @@ function FrontendOverviewPage() { const {projects} = useProjects(); const onboardingProject = useOnboardingProject(); const navigate = useNavigate(); + const mepSetting = useMEPSettingContext(); const withStaticFilters = canUseMetricsData(organization); const eventView = generateFrontendOtherPerformanceEventView( @@ -94,15 +99,19 @@ function FrontendOverviewPage() { PerformanceWidgetSetting.SLOW_HTTP_OPS, PerformanceWidgetSetting.SLOW_RESOURCE_OPS, ]; - const tripleChartRowCharts = [ - PerformanceWidgetSetting.TPM_AREA, - PerformanceWidgetSetting.DURATION_HISTOGRAM, - PerformanceWidgetSetting.P50_DURATION_AREA, - PerformanceWidgetSetting.P75_DURATION_AREA, - PerformanceWidgetSetting.P95_DURATION_AREA, - PerformanceWidgetSetting.P99_DURATION_AREA, - PerformanceWidgetSetting.FAILURE_RATE_AREA, - ]; + const tripleChartRowCharts = filterAllowedChartsMetrics( + organization, + [ + PerformanceWidgetSetting.TPM_AREA, + PerformanceWidgetSetting.DURATION_HISTOGRAM, + PerformanceWidgetSetting.P50_DURATION_AREA, + PerformanceWidgetSetting.P75_DURATION_AREA, + PerformanceWidgetSetting.P95_DURATION_AREA, + PerformanceWidgetSetting.P99_DURATION_AREA, + PerformanceWidgetSetting.FAILURE_RATE_AREA, + ], + mepSetting + ); if (organization.features.includes('insights-initial-modules')) { doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_TIME_CONSUMING_DOMAINS); diff --git a/static/app/views/insights/pages/mobile/mobileOverviewPage.tsx b/static/app/views/insights/pages/mobile/mobileOverviewPage.tsx index 3a60c01d968e03..2339fd5c82a663 100644 --- a/static/app/views/insights/pages/mobile/mobileOverviewPage.tsx +++ b/static/app/views/insights/pages/mobile/mobileOverviewPage.tsx @@ -11,7 +11,10 @@ import {ProjectPageFilter} from 'sentry/components/organizations/projectPageFilt import TransactionNameSearchBar from 'sentry/components/performance/searchBar'; import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle'; import {trackAnalytics} from 'sentry/utils/analytics'; -import {canUseMetricsData} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; +import { + canUseMetricsData, + useMEPSettingContext, +} from 'sentry/utils/performance/contexts/metricsEnhancedSetting'; import {PageAlert, usePageAlert} from 'sentry/utils/performance/contexts/pageAlert'; import {PerformanceDisplayProvider} from 'sentry/utils/performance/contexts/performanceDisplayContext'; import {MutableSearch} from 'sentry/utils/tokenizeSearch'; @@ -35,6 +38,7 @@ import { DoubleChartRow, TripleChartRow, } from 'sentry/views/performance/landing/widgets/components/widgetChartRow'; +import {filterAllowedChartsMetrics} from 'sentry/views/performance/landing/widgets/utils'; import {PerformanceWidgetSetting} from 'sentry/views/performance/landing/widgets/widgetDefinitions'; import Onboarding from 'sentry/views/performance/onboarding'; import Table from 'sentry/views/performance/table'; @@ -73,6 +77,7 @@ function MobileOverviewPage() { const {projects} = useProjects(); const onboardingProject = useOnboardingProject(); const navigate = useNavigate(); + const mepSetting = useMEPSettingContext(); const withStaticFilters = canUseMetricsData(organization); @@ -94,15 +99,19 @@ function MobileOverviewPage() { PerformanceWidgetSetting.MOST_SLOW_FRAMES, PerformanceWidgetSetting.MOST_FROZEN_FRAMES, ]; - const tripleChartRowCharts = [ - PerformanceWidgetSetting.TPM_AREA, - PerformanceWidgetSetting.DURATION_HISTOGRAM, - PerformanceWidgetSetting.P50_DURATION_AREA, - PerformanceWidgetSetting.P75_DURATION_AREA, - PerformanceWidgetSetting.P95_DURATION_AREA, - PerformanceWidgetSetting.P99_DURATION_AREA, - PerformanceWidgetSetting.FAILURE_RATE_AREA, - ]; + const tripleChartRowCharts = filterAllowedChartsMetrics( + organization, + [ + PerformanceWidgetSetting.TPM_AREA, + PerformanceWidgetSetting.DURATION_HISTOGRAM, + PerformanceWidgetSetting.P50_DURATION_AREA, + PerformanceWidgetSetting.P75_DURATION_AREA, + PerformanceWidgetSetting.P95_DURATION_AREA, + PerformanceWidgetSetting.P99_DURATION_AREA, + PerformanceWidgetSetting.FAILURE_RATE_AREA, + ], + mepSetting + ); if (organization.features.includes('mobile-vitals')) { columnTitles = [...columnTitles.slice(0, 5), 'ttid', ...columnTitles.slice(5, 0)];