feat(onboarding): Hide quick start guides that are not supported (#68381)

Some platforms don't support some features. As an example, if an org
only has projects in platforms that don't support replay it doesn't make
sense to show them replay onboarding tips.

Product conversation
[here](https://sentry.slack.com/archives/CTZCE4WBZ/p1712697918650289)
that performance product aligns with this decision: if none of the
projects on an org doesn't support a feature we shouldn't show those
onboardings.

Before in performance tab:
![Screenshot 2024-04-11 at 2 11 07
PM](https://github.com/getsentry/sentry/assets/132939361/27a323eb-9142-40d4-9ec2-6f0aae59a0bd)

After, no side bar pops up:
<img width="698" alt="Screenshot 2024-04-12 at 3 53 49 PM"
src="https://github.com/getsentry/sentry/assets/132939361/b15bd378-8113-4290-9c54-281a0283fe21">


For general onboarding, before all tips showed:
<img width="723" alt="Screenshot 2024-04-12 at 3 57 00 PM"
src="https://github.com/getsentry/sentry/assets/132939361/52a1b307-4c9c-4d11-91b7-afa6fbe3fb33">


After, unrelated tips don't show:
<img width="666" alt="Screenshot 2024-04-12 at 3 57 33 PM"
src="https://github.com/getsentry/sentry/assets/132939361/6d7fdda9-dfac-448d-8581-44dcad977478">

Author: sentaur-athena

src/sentry/models/project.py

@@ -110,7 +110,7 @@
     "minidump",
     "native",
     "native-qt",
-    "nintendo",
+    "nintendo-switch",
     "node",
     "node-awslambda",
     "node-azurefunctions",

static/app/components/onboardingWizard/filterSupportedTasks.spec.tsx

@@ -0,0 +1,107 @@
+import {ProjectFixture} from 'sentry-fixture/project';
+
+import {filterSupportedTasks} from 'sentry/components/onboardingWizard/filterSupportedTasks';
+import {
+  type OnboardingTask,
+  OnboardingTaskKey,
+  type PlatformKey,
+  type Project,
+} from 'sentry/types';
+
+describe('filterSupportedTasks', function () {
+  const onboardingTasks: OnboardingTask[] = [
+    {
+      task: OnboardingTaskKey.FIRST_PROJECT,
+      title: '',
+      description: '',
+      skippable: false,
+      actionType: 'app',
+      location: '',
+      display: true,
+      requisites: [],
+      requisiteTasks: [],
+      status: 'pending',
+    },
+    {
+      task: OnboardingTaskKey.SESSION_REPLAY,
+      title: '',
+      description: '',
+      skippable: true,
+      requisites: [],
+      actionType: 'app',
+      location: '',
+      display: true,
+      requisiteTasks: [],
+      status: 'pending',
+    },
+    {
+      task: OnboardingTaskKey.USER_REPORTS,
+      title: '',
+      description: '',
+      skippable: true,
+      requisites: [],
+      actionType: 'app',
+      location: '',
+      display: true,
+      requisiteTasks: [],
+      status: 'pending',
+    },
+    {
+      task: OnboardingTaskKey.FIRST_TRANSACTION,
+      title: '',
+      description: '',
+      skippable: true,
+      requisites: [],
+      actionType: 'app',
+      location: '',
+      display: true,
+      requisiteTasks: [],
+      status: 'pending',
+    },
+  ];
+
+  it('filters out nothing if any supported platform', function () {
+    const supportedProject = ProjectFixture({
+      platform: 'javascript-react',
+    }) as Project & {platform: PlatformKey};
+    const unsupportedProject = ProjectFixture({
+      platform: 'nintendo-switch',
+    }) as Project & {platform: PlatformKey};
+    const supportedTasks = filterSupportedTasks(
+      [supportedProject, unsupportedProject],
+      onboardingTasks
+    );
+    expect(supportedTasks.length).toBe(4);
+  });
+
+  it('filters out for unsupported platform', function () {
+    const project = ProjectFixture({
+      platform: 'nintendo-switch',
+      firstTransactionEvent: false,
+    }) as Project & {platform: PlatformKey};
+    const supportedTasks = filterSupportedTasks([project], onboardingTasks);
+    expect(supportedTasks.length).toBe(1);
+  });
+
+  it('filters out performance only if all projects are without support', function () {
+    const project1 = ProjectFixture({
+      platform: 'nintendo-switch',
+      firstTransactionEvent: false,
+    }) as Project & {platform: PlatformKey};
+    const project2 = ProjectFixture({
+      platform: 'elixir',
+      firstTransactionEvent: false,
+    }) as Project & {platform: PlatformKey};
+
+    const supportedTasks = filterSupportedTasks([project1, project2], onboardingTasks);
+    expect(
+      supportedTasks.filter(task =>
+        [
+          OnboardingTaskKey.FIRST_PROJECT,
+          OnboardingTaskKey.SESSION_REPLAY,
+          OnboardingTaskKey.USER_REPORTS,
+        ].includes(task.task)
+      ).length
+    ).toBe(3);
+  });
+});

static/app/components/onboardingWizard/filterSupportedTasks.tsx

@@ -0,0 +1,50 @@
+import {
+  feedbackOnboardingPlatforms,
+  replayOnboardingPlatforms,
+  withoutPerformanceSupport,
+} from 'sentry/data/platformCategories';
+import {type OnboardingTask, OnboardingTaskKey, type Project} from 'sentry/types';
+
+const replayRelatedTasks = [OnboardingTaskKey.SESSION_REPLAY];
+const performanceRelatedTasks = [
+  OnboardingTaskKey.FIRST_TRANSACTION,
+  OnboardingTaskKey.PERFORMANCE_GUIDE,
+  OnboardingTaskKey.METRIC_ALERT,
+];
+const feedbackRelatedTasks = [OnboardingTaskKey.USER_REPORTS];
+
+export function filterSupportedTasks(
+  projects: Project[] | undefined,
+  allTasks: OnboardingTask[]
+): OnboardingTask[] {
+  if (!projects) {
+    return [];
+  }
+  // Remove tasks for features that are not supported
+  const excludeList = allTasks.filter(
+    task =>
+      (!shouldShowReplayTasks(projects) && replayRelatedTasks.includes(task.task)) ||
+      (!shouldShowPerformanceTasks(projects) &&
+        performanceRelatedTasks.includes(task.task)) ||
+      (!shouldShowFeedbackTasks(projects) && feedbackRelatedTasks.includes(task.task))
+  );
+  return allTasks.filter(task => !excludeList.includes(task));
+}
+
+export function shouldShowPerformanceTasks(projects: Project[]): boolean {
+  return !projects?.every(
+    project => project.platform && withoutPerformanceSupport.has(project.platform)
+  );
+}
+
+export function shouldShowFeedbackTasks(projects: Project[]): boolean {
+  return projects?.some(
+    project => project.platform && feedbackOnboardingPlatforms.includes(project.platform)
+  );
+}
+
+export function shouldShowReplayTasks(projects: Project[]): boolean {
+  return projects?.some(
+    project => project.platform && replayOnboardingPlatforms.includes(project.platform)
+  );
+}

static/app/components/onboardingWizard/taskConfig.tsx

@@ -4,6 +4,7 @@ import {openInviteMembersModal} from 'sentry/actionCreators/modal';
 import {navigateTo} from 'sentry/actionCreators/navigation';
 import type {Client} from 'sentry/api';
 import type {OnboardingContextProps} from 'sentry/components/onboarding/onboardingContext';
+import {filterSupportedTasks} from 'sentry/components/onboardingWizard/filterSupportedTasks';
 import {taskIsDone} from 'sentry/components/onboardingWizard/utils';
 import {filterProjects} from 'sentry/components/performanceOnboarding/utils';
 import {sourceMaps} from 'sentry/data/platformCategories';
@@ -445,11 +446,12 @@ export function getMergedTasks({organization, projects, onboardingContext}: Opti
       }) as OnboardingTask
   );
 
+  const supportedTasks = filterSupportedTasks(projects, allTasks);
   // Map incomplete requisiteTasks as full task objects
-  return allTasks.map(task => ({
+  return supportedTasks.map(task => ({
     ...task,
     requisiteTasks: task.requisites
-      .map(key => allTasks.find(task2 => task2.task === key)!)
+      .map(key => supportedTasks.find(task2 => task2.task === key)!)
       .filter(reqTask => reqTask.status !== 'complete'),
   }));
 }

static/app/components/performanceOnboarding/sidebar.spec.tsx

@@ -11,6 +11,7 @@ import {SidebarPanelKey} from 'sentry/components/sidebar/types';
 import PageFiltersStore from 'sentry/stores/pageFiltersStore';
 import ProjectsStore from 'sentry/stores/projectsStore';
 import SidebarPanelStore from 'sentry/stores/sidebarPanelStore';
+import type {PlatformKey, Project} from 'sentry/types';
 
 import {generateDocKeys} from './utils';
 
@@ -59,6 +60,9 @@ describe('Sidebar > Performance Onboarding Checklist', function () {
   });
 
   it('displays boost performance card', async function () {
+    ProjectsStore.loadInitialData([
+      ProjectFixture({platform: 'javascript-react', firstTransactionEvent: false}),
+    ]);
     renderSidebar({
       organization: {
         ...organization,
@@ -82,7 +86,10 @@ describe('Sidebar > Performance Onboarding Checklist', function () {
     expect(screen.queryByText('Boost performance')).not.toBeInTheDocument();
   });
 
-  it('checklist feature disabled', async function () {
+  it('checklist feature supported by platform but disabled', async function () {
+    ProjectsStore.loadInitialData([
+      ProjectFixture({platform: 'javascript-react', firstTransactionEvent: false}),
+    ]);
     renderSidebar({
       organization: {
         ...organization,
@@ -177,15 +184,18 @@ describe('Sidebar > Performance Onboarding Checklist', function () {
   });
 
   it('checklist feature enabled > navigate to performance page > project without performance support', async function () {
-    ProjectsStore.loadInitialData([
-      ProjectFixture({platform: 'elixir', firstTransactionEvent: false}),
-    ]);
+    const project = ProjectFixture({
+      platform: 'elixir',
+      firstTransactionEvent: false,
+    }) as Project & {platform: PlatformKey};
+    ProjectsStore.loadInitialData([project]);
     renderSidebar({
       organization: {
         ...organization,
         features: ['onboarding', 'performance-onboarding-checklist'],
       },
     });
+
     window.open = jest.fn().mockImplementation(() => true);
 
     const quickStart = await screen.findByText('Quick Start');
@@ -198,12 +208,7 @@ describe('Sidebar > Performance Onboarding Checklist', function () {
 
     expect(screen.getByText('Capture your first error')).toBeInTheDocument();
     expect(screen.getByText('Level Up')).toBeInTheDocument();
-    expect(screen.getByText('Boost performance')).toBeInTheDocument();
-    const performanceCard = screen.getByTestId('setup_transactions');
-
-    await userEvent.click(performanceCard);
-    expect(window.open).not.toHaveBeenCalled();
-    expect(router.push).toHaveBeenCalledWith('/organizations/org-slug/performance/');
+    expect(screen.queryByText('Boost performance')).not.toBeInTheDocument();
   });
 
   it('displays checklist', async function () {

static/app/components/performanceOnboarding/sidebar.tsx

@@ -8,6 +8,7 @@ import type {MenuItemProps} from 'sentry/components/dropdownMenu';
 import {DropdownMenu} from 'sentry/components/dropdownMenu';
 import IdBadge from 'sentry/components/idBadge';
 import LoadingIndicator from 'sentry/components/loadingIndicator';
+import {shouldShowPerformanceTasks} from 'sentry/components/onboardingWizard/filterSupportedTasks';
 import useOnboardingDocs from 'sentry/components/onboardingWizard/useOnboardingDocs';
 import OnboardingStep from 'sentry/components/sidebar/onboardingStep';
 import SidebarPanel from 'sentry/components/sidebar/sidebarPanel';
@@ -107,6 +108,7 @@ function PerformanceOnboardingSidebar(props: CommonSidebarProps) {
     !isActive ||
     !hasProjectAccess ||
     currentProject === undefined ||
+    !shouldShowPerformanceTasks(projects) ||
     !projectsLoaded ||
     !projects ||
     projects.length <= 0 ||