ref(onboarding): ends multi-select experiment (#34139)

This PR end the multi-select platform experience because it's winning prettily handily. This PR does not remove a lot of the older unused components and we will take care of that in upcoming PRs (right now it would cause a bunch of merge conflicts for other in-flight PRs).

static/app/components/onboardingWizard/onboardingCard.tsx

@@ -22,18 +22,7 @@ type Props = {
   org: Organization;
 };
 
-// Warning: OnboardingViewTask and InternalOnboardingViewTask were split into two because useProjects
-// hook was being conditionally called. This is no longer allowed and we need to lift the return into
-// a separate component higher in the tree.
-function OnboardingViewTask(props: Props) {
-  if (!props.org?.experiments.TargetedOnboardingMultiSelectExperiment) {
-    return null;
-  }
-
-  return <InternalOnboardingViewTask {...props} />;
-}
-
-function InternalOnboardingViewTask({org}: Props) {
+function OnboardingViewTask({org}: Props) {
   const [onboardingState, setOnboardingState] = usePersistedOnboardingState();
   const {projects: allProjects} = useProjects({orgId: org.id});
 

static/app/data/experimentConfig.tsx

@@ -13,12 +13,6 @@ export const unassignedValue = -1;
  * Frontend experiment configuration object
  */
 export const experimentList = [
-  {
-    key: 'TargetedOnboardingMultiSelectExperiment',
-    type: ExperimentType.Organization,
-    parameter: 'exposed',
-    assignments: [0, 1],
-  },
   {
     key: 'TargetedOnboardingMobileRedirectExperiment',
     type: ExperimentType.Organization,

static/app/views/onboarding/onboardingController.tsx

@@ -1,24 +1,18 @@
-import {ComponentPropsWithoutRef, useEffect} from 'react';
-
-import {logExperiment} from 'sentry/utils/analytics';
 import withOrganization from 'sentry/utils/withOrganization';
 
 import TargetedOnboarding from './targetedOnboarding/onboarding';
-import Onboarding from './onboarding';
 
-type Props = Omit<ComponentPropsWithoutRef<typeof Onboarding>, 'projects'>;
+type Props = Omit<React.ComponentPropsWithoutRef<typeof TargetedOnboarding>, 'projects'>;
 
 function OnboardingController({...rest}: Props) {
-  useEffect(() => {
-    logExperiment({
-      key: 'TargetedOnboardingMultiSelectExperiment',
-      organization: rest.organization,
-    });
-  }, [rest.organization]);
-  if (rest.organization?.experiments.TargetedOnboardingMultiSelectExperiment) {
-    return <TargetedOnboarding {...rest} />;
-  }
-  return <Onboarding {...rest} />;
+  // TODO: uncomment
+  // useEffect(() => {
+  //   logExperiment({
+  //     key: 'TargetedOnboardingMobileRedirectExperiment',
+  //     organization: rest.organization,
+  //   });
+  // }, [rest.organization]);
+  return <TargetedOnboarding {...rest} />;
 }
 
 export default withOrganization(OnboardingController);

static/app/views/onboarding/targetedOnboarding/setupDocs.tsx

@@ -1,3 +1,5 @@
+import 'prism-sentry/index.css';
+
 import {useEffect, useState} from 'react';
 import * as React from 'react';
 import {browserHistory} from 'react-router';

tests/acceptance/test_onboarding.py

@@ -22,46 +22,6 @@ class OrganizationOnboardingTest(AcceptanceTestCase):
     def test_onboarding(self, generate_api_key):
         self.browser.get("/onboarding/%s/" % self.org.slug)
 
-        # Welcome step
-        self.browser.wait_until('[data-test-id="onboarding-step-welcome"]')
-        self.browser.snapshot(name="onboarding - welcome")
-
-        # Platform selection step
-        self.browser.click('[aria-label="Start"]')
-        self.browser.wait_until('[data-test-id="onboarding-step-select-platform"]')
-
-        self.browser.snapshot(name="onboarding - select platform")
-
-        # Select and create node JS project
-        self.browser.click('[data-test-id="platform-node"]')
-        self.browser.wait_until_not('[data-test-id="platform-select-next"][aria-disabled="true"]')
-        self.browser.wait_until('[data-test-id="platform-select-next"][aria-disabled="false"]')
-
-        @TimedRetryPolicy.wrap(timeout=5, exceptions=((TimeoutException,)))
-        def click_platform_select_name(browser):
-            browser.click('[data-test-id="platform-select-next"]')
-            # Project getting started
-            browser.wait_until('[data-test-id="onboarding-step-get-started"]')
-
-        click_platform_select_name(self.browser)
-        self.browser.snapshot(name="onboarding - get started")
-
-        # Verify project was created for org
-        project = Project.objects.get(organization=self.org)
-        assert project.name == "rowdy-tiger"
-        assert project.platform == "node"
-
-        self.browser.click('[data-test-id="onboarding-getting-started-invite-members"]')
-        self.browser.wait_until("[role='dialog']")
-        self.browser.snapshot(name="onboarding - invite members")
-
-    @mock.patch("sentry.models.ProjectKey.generate_api_key", return_value="test-dsn")
-    @mock.patch(
-        "sentry.experiments.all", return_value={"TargetedOnboardingMultiSelectExperiment": 1}
-    )
-    def test_onboarding_new(self, generate_api_key, all_experiments):
-        self.browser.get("/onboarding/%s/" % self.org.slug)
-
         # Welcome step
         self.browser.wait_until('[data-test-id="onboarding-step-welcome"]')
         self.browser.snapshot(name="onboarding - new - welcome")

tests/js/spec/components/sidebar/index.spec.jsx

@@ -4,6 +4,8 @@ import {act, render, screen, userEvent, waitFor} from 'sentry-test/reactTestingL
 import * as incidentActions from 'sentry/actionCreators/serviceIncidents';
 import SidebarContainer from 'sentry/components/sidebar';
 import ConfigStore from 'sentry/stores/configStore';
+import {PersistedStoreProvider} from 'sentry/stores/persistedStore';
+import {OrganizationContext} from 'sentry/views/organizationContext';
 
 jest.mock('sentry/actionCreators/serviceIncidents');
 
@@ -19,7 +21,12 @@ describe('Sidebar', function () {
     <SidebarContainer organization={organization} location={location} {...props} />
   );
 
-  const renderSidebar = props => render(getElement(props));
+  const renderSidebar = props =>
+    render(
+      <OrganizationContext.Provider value={organization}>
+        <PersistedStoreProvider>{getElement(props)}</PersistedStoreProvider>
+      </OrganizationContext.Provider>
+    );
 
   beforeEach(function () {
     apiMocks.broadcasts = MockApiClient.addMockResponse({
@@ -34,6 +41,10 @@ describe('Sidebar', function () {
       url: `/organizations/${organization.slug}/sdk-updates/`,
       body: [],
     });
+    MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/client-state/`,
+      body: {},
+    });
   });
 
   it('renders', async function () {

tests/js/spec/views/onboarding/onboardingController.spec.jsx

@@ -7,37 +7,8 @@ import OnboardingController from 'sentry/views/onboarding/onboardingController';
 import {OrganizationContext} from 'sentry/views/organizationContext';
 
 describe('OnboardingController', function () {
-  it('Shows legacy onboarding without experiment', function () {
+  it('Shows targeted onboarding', function () {
     const {organization, router, routerContext} = initializeOrg({
-      organization: {
-        experiments: {
-          TargetedOnboardingMultiSelectExperiment: 0,
-        },
-      },
-      router: {
-        params: {
-          step: 'welcome',
-        },
-      },
-    });
-
-    render(
-      <OrganizationContext.Provider value={organization}>
-        <OnboardingController {...router} />
-      </OrganizationContext.Provider>,
-      {
-        context: routerContext,
-      }
-    );
-    expect(screen.queryByTestId('targeted-onboarding')).not.toBeInTheDocument();
-  });
-  it('Shows targeted onboarding with multi-select experiment active', function () {
-    const {organization, router, routerContext} = initializeOrg({
-      organization: {
-        experiments: {
-          TargetedOnboardingMultiSelectExperiment: 1,
-        },
-      },
       router: {
         params: {
           step: 'setup-docs',