ref(quick-start): Remove the basics step (#79393)

static/app/components/onboardingWizard/progressHeader.tsx

@@ -27,16 +27,14 @@ function ProgressHeader({allTasks, completedTasks}: Props) {
     description = t('Walk through this guide to get the most out of Sentry right away.');
   }
 
-  const filteredTasks = allTasks.filter(task => !task.renderCard);
-
   return (
     <Container>
       <StyledProgressRing
         size={80}
         barWidth={8}
-        text={filteredTasks.length - completedTasks.length}
+        text={allTasks.length - completedTasks.length}
         animateText
-        value={(completedTasks.length / filteredTasks.length) * 100}
+        value={(completedTasks.length / allTasks.length) * 100}
         progressEndcaps="round"
         backgroundColor={theme.gray100}
         textCss={() => css`

static/app/components/onboardingWizard/sidebar.tsx

@@ -57,7 +57,6 @@ Heading.defaultProps = {
 
 const completeNowText = isDemoWalkthrough() ? t('Sentry Basics') : t('Next Steps');
 
-const customizedTasksHeading = <Heading key="customized">{t('The Basics')}</Heading>;
 const completeNowHeading = <Heading key="now">{completeNowText}</Heading>;
 const upcomingTasksHeading = (
   <Heading key="upcoming">
@@ -82,13 +81,11 @@ export const useOnboardingTasks = (
       projects,
       onboardingContext,
     }).filter(task => task.display);
-    const filteredTasks = all.filter(task => !task.renderCard);
     return {
       allTasks: all,
-      customTasks: all.filter(task => task.renderCard),
-      active: filteredTasks.filter(findActiveTasks),
-      upcoming: filteredTasks.filter(findUpcomingTasks),
-      complete: filteredTasks.filter(findCompleteTasks),
+      active: all.filter(findActiveTasks),
+      upcoming: all.filter(findUpcomingTasks),
+      complete: all.filter(findCompleteTasks),
     };
   }, [organization, projects, onboardingContext]);
 };
@@ -120,7 +117,7 @@ export default function OnboardingWizardSidebar({
     });
   }
 
-  const {allTasks, customTasks, active, upcoming, complete} = useOnboardingTasks(
+  const {allTasks, active, upcoming, complete} = useOnboardingTasks(
     organization,
     projects,
     onboardingContext
@@ -184,20 +181,7 @@ export default function OnboardingWizardSidebar({
     </CompleteList>
   );
 
-  const customizedCards = customTasks
-    .map(task =>
-      task.renderCard?.({
-        organization,
-        task,
-        onboardingContext,
-        projects,
-      })
-    )
-    .filter(card => !!card);
-
   const items = [
-    customizedCards.length > 0 && customizedTasksHeading,
-    ...customizedCards,
     active.length > 0 && completeNowHeading,
     ...active.map(renderItem),
     upcoming.length > 0 && upcomingTasksHeading,

static/app/components/onboardingWizard/taskConfig.tsx

@@ -31,8 +31,6 @@ import EventWaiter from 'sentry/utils/eventWaiter';
 import normalizeUrl from 'sentry/utils/url/normalizeUrl';
 import withApi from 'sentry/utils/withApi';
 
-import OnboardingProjectsCard from './onboardingProjectsCard';
-
 function hasPlatformWithSourceMaps(projects: Project[] | undefined) {
   return projects !== undefined
     ? projects.some(({platform}) => platform && sourceMaps.includes(platform))
@@ -467,17 +465,6 @@ export function getOnboardingTasks({
       // Use `features?.` because getsentry has a different `Organization` type/payload
       display: organization.features?.includes('incidents'),
     },
-    {
-      task: OnboardingTaskKey.USER_SELECTED_PROJECTS,
-      title: t('Projects to Setup'),
-      description: '',
-      skippable: true,
-      requisites: [],
-      actionType: 'action',
-      action: () => {},
-      display: true,
-      renderCard: OnboardingProjectsCard,
-    },
   ];
 }
 

static/app/components/sidebar/index.tsx

@@ -112,9 +112,7 @@ function useOpenOnboardingSidebar(organization?: Organization) {
           onboardingContext,
         });
 
-        const allDisplayedTasks = tasks
-          .filter(task => task.display)
-          .filter(task => !task.renderCard);
+        const allDisplayedTasks = tasks.filter(task => task.display);
         const doneTasks = allDisplayedTasks.filter(isDone);
 
         return !(doneTasks.length >= allDisplayedTasks.length);

static/app/components/sidebar/onboardingStatus.tsx

@@ -63,9 +63,7 @@ export default function OnboardingStatus({
     onboardingContext,
   });
 
-  const allDisplayedTasks = tasks
-    .filter(task => task.display)
-    .filter(task => !task.renderCard);
+  const allDisplayedTasks = tasks.filter(task => task.display);
 
   const doneTasks = allDisplayedTasks.filter(isDone);
   const numberRemaining = allDisplayedTasks.length - doneTasks.length;

static/app/types/onboarding.tsx

@@ -78,15 +78,6 @@ interface OnboardingTaskDescriptorBase {
    * The group that this task belongs to, e.g. basic and level up
    */
   group?: OnboardingTaskGroup;
-  /**
-   * If a render function was provided, it will be used to render the entire card,
-   * and the card will be rendered before any other cards regardless of completion status.
-   * the render function is therefore responsible for determining the completion status
-   * of the card by returning null when it's completed.
-   *
-   * Note that this should not be given a react component.
-   */
-  renderCard?: (props: OnboardingCustomComponentProps) => JSX.Element | null;
   /**
    * Joins with this task id for server-side onboarding state.
    * This allows you to create alias for exising onboarding tasks or create multiple