getsentry · gggritso · Jun 3, 2024 · May 31, 2024 · May 31, 2024 · May 31, 2024
@@ -229,7 +229,9 @@ function NewTraceDetailsSpanDetail(props: SpanDetailProps) {
     }
 
     const transactionName = event.title;
-    const hasNewSpansUIFlag = organization.features.includes('performance-spans-new-ui');
+    const hasNewSpansUIFlag =
+      organization.features.includes('performance-spans-new-ui') &&
+      organization.features.includes('insights-initial-modules');
 
     // The new spans UI relies on the group hash assigned by Relay, which is different from the hash available on the span itself
     const groupHash = hasNewSpansUIFlag

@@ -150,7 +150,7 @@ describe('SpanDetail', function () {
           }),
           organization: OrganizationFixture({
             ...organization,
-            features: ['spans-first-ui'],
+            features: ['insights-initial-modules'],
           }),
         })
       );

@@ -40,7 +40,7 @@ function SpanSummaryButton(props: Props) {
     : PERFORMANCE_RESOURCE_DATA_TYPE;
 
   if (
-    organization.features.includes('spans-first-ui') &&
+    organization.features.includes('insights-initial-modules') &&
     resolvedModule === ModuleName.DB
   ) {
     return (
@@ -59,7 +59,7 @@ function SpanSummaryButton(props: Props) {
   }
 
   if (
-    organization.features.includes('spans-first-ui') &&
+    organization.features.includes('insights-initial-modules') &&
     resolvedModule === ModuleName.RESOURCE &&
     resourceSummaryAvailable(sentryTags.op)
   ) {

diff --git a/static/app/components/sidebar/index.tsx b/static/app/components/sidebar/index.tsx
@@ -250,7 +250,7 @@ function Sidebar() {
   const moduleURLBuilder = useModuleURLBuilder(true);
 
   const queries = hasOrganization && (
-    <Feature key="db" features="spans-first-ui" organization={organization}>
+    <Feature key="db" features="insights-entry-points" organization={organization}>
       <SidebarItem
         {...sidebarItemProps}
         label={
@@ -264,7 +264,7 @@ function Sidebar() {
   );
 
   const requests = hasOrganization && (
-    <Feature key="http" features="spans-first-ui" organization={organization}>
+    <Feature key="http" features="insights-entry-points" organization={organization}>
       <SidebarItem
         {...sidebarItemProps}
         label={<GuideAnchor target="performance-http">{MODULE_TITLES.http}</GuideAnchor>}
@@ -276,7 +276,11 @@ function Sidebar() {
   );
 
   const caches = hasOrganization && (
-    <Feature key="cache" features="performance-cache-view" organization={organization}>
+    <Feature
+      key="cache"
+      features={['insights-entry-points', 'performance-cache-view']}
+      organization={organization}
+    >
       <SidebarItem
         {...sidebarItemProps}
         label={
@@ -291,7 +295,7 @@ function Sidebar() {
   );
 
   const webVitals = hasOrganization && (
-    <Feature key="vital" features="spans-first-ui" organization={organization}>
+    <Feature key="vital" features="insights-entry-points" organization={organization}>
       <SidebarItem
         {...sidebarItemProps}
         label={
@@ -305,7 +309,11 @@ function Sidebar() {
   );
 
   const queues = hasOrganization && (
-    <Feature key="queue" features="performance-queues-view" organization={organization}>
+    <Feature
+      key="queue"
+      features={['insights-entry-points', 'performance-queues-view']}
+      organization={organization}
+    >
       <SidebarItem
         {...sidebarItemProps}
         label={
@@ -320,7 +328,11 @@ function Sidebar() {
   );
 
   const screenLoads = hasOrganization && (
-    <Feature key="screen_load" features="spans-first-ui" organization={organization}>
+    <Feature
+      key="screen_load"
+      features="insights-entry-points"
+      organization={organization}
+    >
       <SidebarItem
         {...sidebarItemProps}
         label={MODULE_TITLES.screen_load}
@@ -332,7 +344,7 @@ function Sidebar() {
   );
 
   const appStarts = hasOrganization && (
-    <Feature key="app_start" features="spans-first-ui" organization={organization}>
+    <Feature key="app_start" features="insights-entry-points" organization={organization}>
       <SidebarItem
         {...sidebarItemProps}
         label={MODULE_TITLES.app_start}
@@ -346,7 +358,7 @@ function Sidebar() {
   const mobileUI = hasOrganization && (
     <Feature
       key="mobile-ui"
-      features={['spans-first-ui', 'starfish-mobile-ui-module']}
+      features={['insights-entry-points', 'starfish-mobile-ui-module']}
       organization={organization}
     >
       <SidebarItem
@@ -361,7 +373,7 @@ function Sidebar() {
   );
 
   const resources = hasOrganization && (
-    <Feature key="resource" features="spans-first-ui">
+    <Feature key="resource" features="insights-entry-points">
       <SidebarItem
         {...sidebarItemProps}
         label={<GuideAnchor target="starfish">{resourceModuleTitle}</GuideAnchor>}
@@ -386,7 +398,10 @@ function Sidebar() {
   );
 
   const llmMonitoring = hasOrganization && (
-    <Feature features="ai-analytics" organization={organization}>
+    <Feature
+      features={['insights-entry-points', 'ai-analytics']}
+      organization={organization}
+    >
       <SidebarItem
         {...sidebarItemProps}
         icon={hasNewSidebarHierarchy ? <SubitemDot collapsed /> : <IconRobot />}
@@ -408,7 +423,7 @@ function Sidebar() {
         // If the client has the old sidebar hierarchy _and_ something to show inside the Performance dropdown, render an accordion.
         if (
           !hasNewSidebarHierarchy &&
-          (organization.features.includes('spans-first-ui') ||
+          (organization.features.includes('insights-entry-points') ||
             organization.features.includes('performance-cache-view') ||
             organization.features.includes('performance-queues-view') ||
             organization.features.includes('performance-trace-explorer'))
@@ -594,26 +609,28 @@ function Sidebar() {
     />
   );
 
-  const insights = (
-    <SidebarAccordion
-      {...sidebarItemProps}
-      icon={<IconGraph />}
-      label={<GuideAnchor target="insights">{t('Insights')}</GuideAnchor>}
-      id="insights"
-      isNew
-      exact={!shouldAccordionFloat}
-    >
-      {requests}
-      {queries}
-      {resources}
-      {appStarts}
-      {screenLoads}
-      {webVitals}
-      {caches}
-      {queues}
-      {mobileUI}
-      {llmMonitoring}
-    </SidebarAccordion>
+  const insights = hasOrganization && (
+    <Feature key="insights" features="insights-entry-points" organization={organization}>
+      <SidebarAccordion
+        {...sidebarItemProps}
+        icon={<IconGraph />}
+        label={<GuideAnchor target="insights">{t('Insights')}</GuideAnchor>}
+        id="insights"
+        isNew
+        exact={!shouldAccordionFloat}
+      >
+        {requests}
+        {queries}
+        {resources}
+        {appStarts}
+        {screenLoads}
+        {webVitals}
+        {caches}
+        {queues}
+        {mobileUI}
+        {llmMonitoring}
+      </SidebarAccordion>
+    </Feature>
   );
 
   const explore = (

diff --git a/static/app/views/performance/browser/resources/index.spec.tsx b/static/app/views/performance/browser/resources/index.spec.tsx
@@ -27,7 +27,7 @@ const requestMocks: Record<string, jest.Mock> = {};
 
 describe('ResourcesLandingPage', function () {
   const organization = OrganizationFixture({
-    features: ['spans-first-ui', 'starfish-view'],
+    features: ['insights-initial-modules'],
   });
 
   beforeEach(() => {

diff --git a/static/app/views/performance/browser/resources/index.tsx b/static/app/views/performance/browser/resources/index.tsx
@@ -97,7 +97,7 @@ function ResourcesLandingPage() {
 
 function PageWithProviders() {
   return (
-    <ModulePageProviders moduleName="resource" features="spans-first-ui">
+    <ModulePageProviders moduleName="resource" features="insights-initial-modules">
       <ResourcesLandingPage />
     </ModulePageProviders>
   );

diff --git a/static/app/views/performance/browser/resources/resourceSummaryPage/index.tsx b/static/app/views/performance/browser/resources/resourceSummaryPage/index.tsx
@@ -165,7 +165,7 @@ function PageWithProviders() {
     <ModulePageProviders
       moduleName="resource"
       pageTitle={`${resourceDataType} ${t('Summary')}`}
-      features="spans-first-ui"
+      features="insights-initial-modules"
     >
       <ResourceSummary />
     </ModulePageProviders>

diff --git a/static/app/views/performance/browser/resources/resourceSummaryPage/sampleImages.spec.tsx b/static/app/views/performance/browser/resources/resourceSummaryPage/sampleImages.spec.tsx
@@ -18,7 +18,7 @@ jest.mock('sentry/utils/usePageFilters');
 
 describe('SampleImages', function () {
   const organization = OrganizationFixture({
-    features: ['starfish-view', 'spans-first-ui'],
+    features: ['insights-initial-modules'],
   });
 
   beforeEach(() => {

diff --git a/static/app/views/performance/browser/resources/resourceView/index.tsx b/static/app/views/performance/browser/resources/resourceView/index.tsx
@@ -85,7 +85,7 @@ function ResourceView() {
 function ResourceTypeSelector({value}: {value?: string}) {
   const location = useLocation();
   const {features} = useOrganization();
-  const hasImageView = features.includes('spans-first-ui');
+  const hasImageView = features.includes('insights-initial-modules');
 
   const options: Option[] = [
     {value: '', label: 'All'},

diff --git a/static/app/views/performance/browser/webVitals/pageOverview.spec.tsx b/static/app/views/performance/browser/webVitals/pageOverview.spec.tsx
@@ -11,7 +11,7 @@ jest.mock('sentry/utils/usePageFilters');
 
 describe('PageOverview', function () {
   const organization = OrganizationFixture({
-    features: ['spans-first-ui'],
+    features: ['insights-initial-modules'],
   });
 
   let eventsMock;
@@ -81,7 +81,7 @@ describe('PageOverview', function () {
 
   it('renders interaction samples', async () => {
     const organizationWithInp = OrganizationFixture({
-      features: ['spans-first-ui'],
+      features: ['insights-initial-modules'],
     });
     jest.mocked(useLocation).mockReturnValue({
       pathname: '',
@@ -125,7 +125,7 @@ describe('PageOverview', function () {
 
   it('escapes transaction name before querying discover', async () => {
     const organizationWithInp = OrganizationFixture({
-      features: ['spans-first-ui'],
+      features: ['insights-initial-modules'],
     });
     jest.mocked(useLocation).mockReturnValue({
       pathname: '',

diff --git a/static/app/views/performance/browser/webVitals/pageOverview.tsx b/static/app/views/performance/browser/webVitals/pageOverview.tsx
@@ -293,7 +293,7 @@ export function PageOverview() {
 
 function PageWithProviders() {
   return (
-    <ModulePageProviders moduleName="vital" features="spans-first-ui">
+    <ModulePageProviders moduleName="vital" features="insights-initial-modules">
       <PageOverview />
     </ModulePageProviders>
   );

diff --git a/static/app/views/performance/browser/webVitals/webVitalsLandingPage.spec.tsx b/static/app/views/performance/browser/webVitals/webVitalsLandingPage.spec.tsx
@@ -11,7 +11,7 @@ jest.mock('sentry/utils/usePageFilters');
 
 describe('WebVitalsLandingPage', function () {
   const organization = OrganizationFixture({
-    features: ['spans-first-ui'],
+    features: ['insights-initial-modules'],
   });
 
   beforeEach(function () {

diff --git a/static/app/views/performance/browser/webVitals/webVitalsLandingPage.tsx b/static/app/views/performance/browser/webVitals/webVitalsLandingPage.tsx
@@ -183,7 +183,7 @@ export function WebVitalsLandingPage() {
 
 function PageWithProviders() {
   return (
-    <ModulePageProviders moduleName="vital" features="spans-first-ui">
+    <ModulePageProviders moduleName="vital" features="insights-initial-modules">
       <WebVitalsLandingPage />
     </ModulePageProviders>
   );

diff --git a/static/app/views/performance/cache/cacheLandingPage.tsx b/static/app/views/performance/cache/cacheLandingPage.tsx
@@ -207,7 +207,10 @@ export function CacheLandingPage() {
 
 function PageWithProviders() {
   return (
-    <ModulePageProviders moduleName="cache" features="performance-cache-view">
+    <ModulePageProviders
+      moduleName="cache"
+      features={['insights-addon-modules', 'performance-cache-view']}
+    >
       <CacheLandingPage />
     </ModulePageProviders>
   );

diff --git a/static/app/views/performance/database/databaseLandingPage.tsx b/static/app/views/performance/database/databaseLandingPage.tsx
@@ -270,7 +270,7 @@ const LIMIT: number = 25;
 
 function PageWithProviders() {
   return (
-    <ModulePageProviders moduleName="db" features="spans-first-ui">
+    <ModulePageProviders moduleName="db" features="insights-initial-modules">
       <DatabaseLandingPage />
     </ModulePageProviders>
   );

diff --git a/static/app/views/performance/database/databaseSpanSummaryPage.tsx b/static/app/views/performance/database/databaseSpanSummaryPage.tsx
@@ -304,7 +304,7 @@ function PageWithProviders(props) {
     <ModulePageProviders
       moduleName="db"
       pageTitle={t('Query Summary')}
-      features="spans-first-ui"
+      features="insights-initial-modules"
     >
       <DatabaseSpanSummaryPage {...props} />
     </ModulePageProviders>

diff --git a/static/app/views/performance/http/httpDomainSummaryPage.tsx b/static/app/views/performance/http/httpDomainSummaryPage.tsx
@@ -343,7 +343,7 @@ function PageWithProviders() {
     <ModulePageProviders
       moduleName="http"
       pageTitle={t('Domain Summary')}
-      features="spans-first-ui"
+      features="insights-initial-modules"
     >
       <HTTPDomainSummaryPage />
     </ModulePageProviders>

diff --git a/static/app/views/performance/http/httpLandingPage.tsx b/static/app/views/performance/http/httpLandingPage.tsx
@@ -247,7 +247,7 @@ const DOMAIN_TABLE_ROW_COUNT = 10;
 
 function PageWithProviders() {
   return (
-    <ModulePageProviders moduleName="http" features="spans-first-ui">
+    <ModulePageProviders moduleName="http" features="insights-initial-modules">
       <HTTPLandingPage />
     </ModulePageProviders>
   );

diff --git a/static/app/views/performance/landing/views/allTransactionsView.tsx b/static/app/views/performance/landing/views/allTransactionsView.tsx
@@ -45,7 +45,7 @@ export function AllTransactionsView(props: BasePerformanceViewProps) {
     props.organization.features.includes('performance-new-trends') &&
     canUseMetricsData(props.organization)
   ) {
-    if (props.organization.features.includes('spans-first-ui')) {
+    if (props.organization.features.includes('insights-initial-modules')) {
       doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_RELATED_ISSUES);
       doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_CHANGED);
       doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_TIME_CONSUMING_DOMAINS);

diff --git a/static/app/views/performance/landing/views/backendView.tsx b/static/app/views/performance/landing/views/backendView.tsx
@@ -69,7 +69,7 @@ export function BackendView(props: BasePerformanceViewProps) {
       doubleChartRowCharts.push(PerformanceWidgetSetting.MOST_CHANGED);
     }
 
-    if (props.organization.features.includes('spans-first-ui')) {
+    if (props.organization.features.includes('insights-initial-modules')) {
       doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_TIME_CONSUMING_DOMAINS);
       doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_TIME_SPENT_DB_QUERIES);
 

diff --git a/static/app/views/performance/landing/views/frontendOtherView.tsx b/static/app/views/performance/landing/views/frontendOtherView.tsx
@@ -37,7 +37,7 @@ export function FrontendOtherView(props: BasePerformanceViewProps) {
     PerformanceWidgetSetting.SLOW_RESOURCE_OPS,
   ];
 
-  if (props.organization.features.includes('spans-first-ui')) {
+  if (props.organization.features.includes('insights-initial-modules')) {
     doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_TIME_CONSUMING_DOMAINS);
     doubleChartRowCharts.unshift(PerformanceWidgetSetting.MOST_TIME_CONSUMING_RESOURCES);
   }

diff --git a/static/app/views/performance/landing/views/mobileView.tsx b/static/app/views/performance/landing/views/mobileView.tsx
@@ -40,7 +40,7 @@ export function MobileView(props: BasePerformanceViewProps) {
       ]
     );
   }
-  if (organization.features.includes('spans-first-ui')) {
+  if (organization.features.includes('insights-initial-modules')) {
     doubleRowAllowedCharts[0] = PerformanceWidgetSetting.SLOW_SCREENS_BY_TTID;
   }
   if (organization.features.includes('starfish-mobile-appstart')) {
@@ -61,7 +61,7 @@ export function MobileView(props: BasePerformanceViewProps) {
     );
   }
 
-  if (props.organization.features.includes('spans-first-ui')) {
+  if (props.organization.features.includes('insights-initial-modules')) {
     doubleRowAllowedCharts.push(PerformanceWidgetSetting.MOST_TIME_CONSUMING_DOMAINS);
   }
   return (