Browse Source

feat(profiling): add billing banner to prep for GA (#46869)

Adds the billing banner component when GA flag is enabled

---------

Co-authored-by: getsantry[bot] <66042841+getsantry[bot]@users.noreply.github.com>
Jonas 1 year ago
parent
commit
ff146ed209

+ 5 - 0
static/app/components/profiling/billing/alerts.tsx

@@ -0,0 +1,5 @@
+import HookOrDefault from 'sentry/components/hookOrDefault';
+
+export const ProfilingBetaAlertBanner = HookOrDefault({
+  hookName: 'component:profiling-billing-banner',
+});

+ 5 - 0
static/app/types/hooks.tsx

@@ -85,6 +85,10 @@ type ReplayGracePeriodAlertProps = {organization: Organization};
 
 type ReplayOnboardinCTAProps = {children: React.ReactNode; organization: Organization};
 
+type ProfilingBetaAlertBannerProps = {
+  organization: Organization;
+};
+
 type SetUpSdkDocProps = {
   location: Location;
   organization: Organization;
@@ -139,6 +143,7 @@ export type ComponentHooks = {
   'component:issue-priority-feedback': () => React.ComponentType<QualitativeIssueFeedbackProps>;
   'component:member-list-header': () => React.ComponentType<MemberListHeaderProps>;
   'component:org-stats-banner': () => React.ComponentType<DashboardHeadersProps>;
+  'component:profiling-billing-banner': () => React.ComponentType<ProfilingBetaAlertBannerProps>;
   'component:replay-beta-grace-period-alert': () => React.ComponentType<ReplayGracePeriodAlertProps>;
   'component:replay-feedback-button': () => React.ComponentType<{}>;
   'component:replay-onboarding-cta': () => React.ComponentType<ReplayOnboardinCTAProps>;

+ 6 - 0
static/app/views/profiling/content.tsx

@@ -15,6 +15,7 @@ import PageFilterBar from 'sentry/components/organizations/pageFilterBar';
 import PageFiltersContainer from 'sentry/components/organizations/pageFilters/container';
 import {PageHeadingQuestionTooltip} from 'sentry/components/pageHeadingQuestionTooltip';
 import Pagination from 'sentry/components/pagination';
+import {ProfilingBetaAlertBanner} from 'sentry/components/profiling/billing/alerts';
 import {ProfileEventsTable} from 'sentry/components/profiling/profileEventsTable';
 import ProjectPageFilter from 'sentry/components/projectPageFilter';
 import SentryDocumentTitle from 'sentry/components/sentryDocumentTitle';
@@ -146,6 +147,8 @@ function ProfilingContent({location}: ProfilingContentProps) {
     return _eventView;
   }, [location, query, selection.projects]);
 
+  const isProfilingGA = organization.features.includes('profiling-ga');
+
   return (
     <SentryDocumentTitle title={t('Profiling')} orgSlug={organization.slug}>
       <PageFiltersContainer
@@ -156,6 +159,9 @@ function ProfilingContent({location}: ProfilingContentProps) {
         }
       >
         <Layout.Page>
+          {isProfilingGA ? (
+            <ProfilingBetaAlertBanner organization={organization} />
+          ) : null}
           <Layout.Header>
             <Layout.HeaderContent>
               <Layout.Title>