ref(onboarding): Remove step indicators and animated logo from SCM flow

Remove "Step X of Y" text, "Optional" tag, and animated Sentry logo
progress indicator from the SCM onboarding steps per design review
feedback. Simplify ScmStepHeader to only render heading and subtitle.

Author: jaydgoss

static/app/views/onboarding/components/scmStepHeader.tsx

@@ -1,47 +1,27 @@
-import {Tag} from '@sentry/scraps/badge';
-import {Flex, Stack} from '@sentry/scraps/layout';
+import {Stack} from '@sentry/scraps/layout';
 import {Heading, Text} from '@sentry/scraps/text';
 
-import {t} from 'sentry/locale';
-
 interface ScmStepHeaderProps {
   heading: string;
-  stepNumber: number;
   subtitle: string;
-  tag?: string;
-  totalSteps?: number;
 }
 
-export function ScmStepHeader({
-  stepNumber,
-  totalSteps = 3,
-  heading,
-  subtitle,
-  tag,
-}: ScmStepHeaderProps) {
+export function ScmStepHeader({heading, subtitle}: ScmStepHeaderProps) {
   return (
-    <Stack align="center" gap="md">
-      <Flex align="center" gap="lg">
-        <Text variant="muted" size="lg" bold density="comfortable">
-          {t('Step %s of %s', stepNumber, totalSteps)}
-        </Text>
-        {tag && <Tag variant="muted">{tag}</Tag>}
-      </Flex>
-      <Stack align="center" gap="sm">
-        <Heading as="h2" size="3xl">
-          {heading}
-        </Heading>
-        <Text
-          variant="muted"
-          size="lg"
-          wrap="pre-line"
-          align="center"
-          bold
-          density="comfortable"
-        >
-          {subtitle}
-        </Text>
-      </Stack>
+    <Stack align="center" gap="sm">
+      <Heading as="h2" size="3xl">
+        {heading}
+      </Heading>
+      <Text
+        variant="muted"
+        size="lg"
+        wrap="pre-line"
+        align="center"
+        bold
+        density="comfortable"
+      >
+        {subtitle}
+      </Text>
     </Stack>
   );
 }

static/app/views/onboarding/onboarding.tsx

@@ -3,10 +3,9 @@ import styled from '@emotion/styled';
 import {AnimatePresence, motion} from 'framer-motion';
 
 import {Button} from '@sentry/scraps/button';
-import {Container, Stack} from '@sentry/scraps/layout';
+import {Stack} from '@sentry/scraps/layout';
 import {Link} from '@sentry/scraps/link';
 
-import {AnimatedSentryLogo} from 'sentry/components/animatedSentryLogo';
 import Hook from 'sentry/components/hook';
 import {LogoSentry} from 'sentry/components/logoSentry';
 import {
@@ -102,16 +101,6 @@ const scmOnboardingSteps: StepDescriptor[] = [
   },
 ];
 
-/**
- * The SCM steps that display the animated logo progress indicator.
- * Order determines the progress level (first = 0, last = 1).
- */
-const SCM_LOGO_STEPS = [
-  OnboardingStepId.SCM_CONNECT,
-  OnboardingStepId.SCM_PLATFORM_FEATURES,
-  OnboardingStepId.SCM_PROJECT_DETAILS,
-];
-
 function WelcomeVariable(props: StepProps) {
   const hasNewWelcomeUI = useHasNewWelcomeUI();
 
@@ -318,12 +307,6 @@ export function OnboardingWithoutContext() {
     );
   };
 
-  const scmLogoIndex = stepObj ? SCM_LOGO_STEPS.indexOf(stepObj.id) : -1;
-  const scmLogoProgress =
-    scmLogoIndex >= 0 && SCM_LOGO_STEPS.length > 1
-      ? scmLogoIndex / (SCM_LOGO_STEPS.length - 1)
-      : null;
-
   // Redirect to the first step if we end up in an invalid state
   const isInvalidDocsStep = stepId === 'setup-docs' && !projectSlug;
   if (!stepObj || stepIndex === -1 || isInvalidDocsStep) {
@@ -393,11 +376,6 @@ export function OnboardingWithoutContext() {
             </Button>
           </BackMotionDiv>
         )}
-        {scmLogoProgress !== null && (
-          <Container alignSelf="center">
-            <AnimatedSentryLogo progress={scmLogoProgress} />
-          </Container>
-        )}
         <AnimatePresence mode="wait" onExitComplete={updateAnimationState}>
           <OnboardingStepVariable id={stepObj.id} hasNewWelcomeUI={hasNewWelcomeUI}>
             {stepObj.Component && (

static/app/views/onboarding/scmConnect.tsx

@@ -63,10 +63,8 @@ export function ScmConnect({onComplete}: StepProps) {
   return (
     <Flex direction="column" align="center" gap="2xl" flexGrow={1}>
       <ScmStepHeader
-        stepNumber={1}
         heading={t('Connect a repository')}
         subtitle={t('Link your source control for enhanced debugging features')}
-        tag={t('Optional')}
       />
 
       <LayoutGroup>

static/app/views/onboarding/scmPlatformFeatures.tsx

@@ -372,7 +372,6 @@ export function ScmPlatformFeatures({onComplete}: StepProps) {
   return (
     <Flex direction="column" align="center" gap="3xl" flexGrow={1}>
       <ScmStepHeader
-        stepNumber={2}
         heading={t('Platform & features')}
         subtitle={t('Select your SDK first, then choose the features to enable.')}
       />

static/app/views/onboarding/scmProjectDetails.tsx

@@ -133,7 +133,6 @@ export function ScmProjectDetails({onComplete}: StepProps) {
   return (
     <Flex direction="column" align="center" gap="2xl" flexGrow={1}>
       <ScmStepHeader
-        stepNumber={3}
         heading={t('Project details')}
         subtitle={t(
           'Set the project name, assign a team, and configure\nhow you want to receive issue alerts'