ref(project-creation): Polish typography and copy across SCM create flow#117846
Merged
jaydgoss merged 2 commits intoJun 22, 2026
Merged
Conversation
github-actions
Bot
added
the
Scope: Frontend
jaydgoss
changed the base branch from
master
to
jaygoss/vdy-25-scm-connect-step-support-scenarios-d-e-f-add-org-switch
jaydgoss
changed the title
jaydgoss
force-pushed
the
jaygoss/vdy-77-project-creation-ui-polish-and-analytics-pass
branch
from
59e9bd9 to
b5ae2bc
Compare
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
Abdkhan14
approved these changes
Jun 18, 2026
jaydgoss
force-pushed
the
jaygoss/vdy-77-project-creation-ui-polish-and-analytics-pass
branch
from
b5ae2bc to
dda33cc
Compare
jaydgoss
force-pushed
the
jaygoss/vdy-25-scm-connect-step-support-scenarios-d-e-f-add-org-switch
branch
from
a788c37 to
b590a00
Compare
Contributor
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 1 potential issue.
There are 3 total unresolved issues (including 2 from previous reviews).
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit dda33cc. Configure here.
Base automatically changed from
jaygoss/vdy-25-scm-connect-step-support-scenarios-d-e-f-add-org-switch
to
master
June 22, 2026 16:33
Normalize heading levels and text sizing across the SCM project-creation surface. Drop section headings from h2/xl to h3, step down body text from lg to md, and simplify the create-project intro copy. No behavior change.
Convert section sub-labels from h3 headings to bold text across the SCM create flow, lay the project name and team fields out in a two-column grid, drop the per-section icons, and refresh the field copy. Bump the create-flow card padding and radius and remove the redundant card descriptions. Update the affected specs for the new copy and for the section labels that are no longer h3 headings.
jaydgoss
force-pushed
the
jaygoss/vdy-77-project-creation-ui-polish-and-analytics-pass
branch
from
dda33cc to
a171292
Compare
Comment on lines
254
to
+260
| <Layout.Title withMargins>{t('Create a new project')}</Layout.Title> | ||
| <Container paddingBottom="lg"> | ||
| <Text as="p" variant="muted"> | ||
| {tct( | ||
| 'Set up a separate project for each part of your application (for example, your API server and frontend client), to quickly pinpoint which part of your application errors are coming from. [link: Read the docs].', | ||
| { | ||
| link: ( | ||
| <ExternalLink href="https://docs.sentry.io/product/sentry-basics/integrate-frontend/create-new-project/" /> | ||
| ), | ||
| } | ||
| )} | ||
| <Stack paddingBottom="lg" gap="md"> | ||
| <Heading as="h1">{t('Create a new project')}</Heading> | ||
| <Text size="lg"> | ||
| {t('Pick a platform, name your project, and choose what to monitor.')} | ||
| </Text> | ||
| </Container> | ||
| </Stack> |
Contributor
There was a problem hiding this comment.
Bug: The page renders a duplicate "Create a new project" heading due to the presence of both <Layout.Title> and a new <Heading as="h1">.
Severity: LOW
Suggested Fix
Remove the legacy <Layout.Title withMargins>{t('Create a new project')}</Layout.Title> component from scmCreateProject.tsx. This will eliminate the duplicate heading appearing in the top navigation bar, leaving only the new <Heading as="h1"> in the page body.
Prompt for AI Agent
Review the code at the location below. A potential bug has been identified by an AI
agent. Verify if this is a real issue. If it is, propose a fix; if not, explain why it's
not valid.
Location: static/app/views/projectInstall/scmCreateProject.tsx#L254-L260
Potential issue: The `scmCreateProject.tsx` file includes both a `<Layout.Title>`
component and a new `<Heading as="h1">` component, both of which render the text "Create
a new project". Because the `page-frame` feature flag is enabled, the `<Layout.Title>`
renders the title in the top navigation bar, while the `<Heading>` renders it in the
main page body. This results in a duplicate page title being displayed to the user,
creating a confusing user experience.
jaydgoss
added a commit
that referenced
this pull request
Jun 22, 2026
…low (#117847) ## TLDR Introduces `ScmCollapsibleSection`, a reusable collapsible section for the SCM project-creation flow. The component lands on its own here and is not yet consumed in production; the alert-frequency follow-up (#117849) is its first consumer. ## Details - `ScmCollapsibleSection` puts the chevron and title in one transparent toggle button (mirroring the core Disclosure look) with an optional trailing slot pinned right. The body animates its own height (auto to 0) so sibling `layout="position"` cards below reflow through normal document flow, and `initial={false}` skips the mount animation so it renders in its `defaultExpanded` state. - It is a local variant of the core Disclosure rather than a consumer: `Disclosure.Content` hides with `display: none`, which cannot tween and would not reflow the sibling cards, and `Disclosure.Title`'s full-width stretched button cannot express a content-hugging toggle without forking the shared component. - The component has no production consumer in this PR, so it is added to the knip production entry points (see `knip.config.ts`). #117849 removes that exemption when it wires the component into alert frequency. ## Stack - [#117731](#117731): SCM integration selector (merged) - [#117846](#117846): Typography and copy polish (merged) - **PR 3 (this) #117847:** Reusable collapsible section - [#117849](#117849): Alert-frequency collapsible (stacked on this)
jaydgoss
added a commit
that referenced
this pull request
Jun 22, 2026
…psibleSection (#117849) ## TLDR Applies `ScmCollapsibleSection` to the alert-frequency section of `ScmProjectDetailsCore`, folding it behind a toggle in the project-creation flow. Onboarding keeps the always-expanded header. This is the first production consumer of the component. ## Details - Gated with `collapsible = analyticsFlow === 'project-creation'`. - The chevron and "Alert frequency" title replace the `IconSiren` header, and the "Get notified when things go wrong" subtitle moves into the collapsible body so it hides when collapsed. - Onboarding renders the original `IconSiren` header with an always-expanded body. The body markup is shared between both branches, so onboarding stays visually unchanged. - Removes the knip production-entry exemption that #117847 added for `ScmCollapsibleSection`. Now that the component has a production consumer, the exemption is redundant and would trip knip's config-hint check. ## Stack - [#117731](#117731): SCM integration selector (merged) - [#117846](#117846): Typography and copy polish (merged) - [#117847](#117847): Reusable collapsible section (base of this PR) - **PR 4 (this) #117849:** Alert-frequency collapsible
sehr-m
pushed a commit
that referenced
this pull request
Jun 23, 2026
…low (#117846) ## TLDR Typography and copy polish across the SCM project-creation flow: normalized heading levels and text sizing, and simplified the create-project intro copy. ## Details - Dropped section headings from `h2`/`xl` to `h3` and stepped body text from `lg` to `md` across `scmFeatureInfoCards`, `scmFeatureSelectionCards`, `scmProjectDetailsCore`, and `scmCreateProject`. - Simplified the create-project intro copy and removed the docs link. ## Stack - [#117731](#117731): SCM integration selector (base of this PR) - **PR 2 (this) #117846:** Typography and copy polish - [#117847](#117847): Reusable collapsible section (stacked on this) - [#117849](#117849): Alert-frequency collapsible Draft: more changes coming on this branch.
sehr-m
pushed a commit
that referenced
this pull request
Jun 23, 2026
…low (#117847) ## TLDR Introduces `ScmCollapsibleSection`, a reusable collapsible section for the SCM project-creation flow. The component lands on its own here and is not yet consumed in production; the alert-frequency follow-up (#117849) is its first consumer. ## Details - `ScmCollapsibleSection` puts the chevron and title in one transparent toggle button (mirroring the core Disclosure look) with an optional trailing slot pinned right. The body animates its own height (auto to 0) so sibling `layout="position"` cards below reflow through normal document flow, and `initial={false}` skips the mount animation so it renders in its `defaultExpanded` state. - It is a local variant of the core Disclosure rather than a consumer: `Disclosure.Content` hides with `display: none`, which cannot tween and would not reflow the sibling cards, and `Disclosure.Title`'s full-width stretched button cannot express a content-hugging toggle without forking the shared component. - The component has no production consumer in this PR, so it is added to the knip production entry points (see `knip.config.ts`). #117849 removes that exemption when it wires the component into alert frequency. ## Stack - [#117731](#117731): SCM integration selector (merged) - [#117846](#117846): Typography and copy polish (merged) - **PR 3 (this) #117847:** Reusable collapsible section - [#117849](#117849): Alert-frequency collapsible (stacked on this)
sehr-m
pushed a commit
that referenced
this pull request
Jun 23, 2026
…psibleSection (#117849) ## TLDR Applies `ScmCollapsibleSection` to the alert-frequency section of `ScmProjectDetailsCore`, folding it behind a toggle in the project-creation flow. Onboarding keeps the always-expanded header. This is the first production consumer of the component. ## Details - Gated with `collapsible = analyticsFlow === 'project-creation'`. - The chevron and "Alert frequency" title replace the `IconSiren` header, and the "Get notified when things go wrong" subtitle moves into the collapsible body so it hides when collapsed. - Onboarding renders the original `IconSiren` header with an always-expanded body. The body markup is shared between both branches, so onboarding stays visually unchanged. - Removes the knip production-entry exemption that #117847 added for `ScmCollapsibleSection`. Now that the component has a production consumer, the exemption is redundant and would trip knip's config-hint check. ## Stack - [#117731](#117731): SCM integration selector (merged) - [#117846](#117846): Typography and copy polish (merged) - [#117847](#117847): Reusable collapsible section (base of this PR) - **PR 4 (this) #117849:** Alert-frequency collapsible
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
TLDR
Typography and copy polish across the SCM project-creation flow: normalized heading levels and text sizing, and simplified the create-project intro copy.
Details
h2/xltoh3and stepped body text fromlgtomdacrossscmFeatureInfoCards,scmFeatureSelectionCards,scmProjectDetailsCore, andscmCreateProject.Stack
Draft: more changes coming on this branch.