Skip to content

Commit 53dd2fd

Browse files
authored
chore(prevent): Prevent onboarding page polish take 2 (#97966)
This PR features some minor updates to the prevent onboarding page: - New Image - Slightly increased font size for the gray box header/subheader - Info icon with blurb thing at the bottom **BEFORE** <img width="1626" height="976" alt="Screenshot 2025-08-15 at 4 05 42 PM" src="https://github.com/user-attachments/assets/c7e5ee71-1d58-49a4-903b-b77d5634f069" /> **AFTER** <img width="3268" height="1948" alt="Screenshot 2025-08-15 at 4 04 52 PM" src="https://github.com/user-attachments/assets/9ff4c469-85da-4175-a15a-38656203e18f" /> Closes https://linear.app/getsentry/issue/PREVENT-267/onboarding-page-polish-copy-tweaks <!-- Sentry employees and contractors can delete or ignore the following. --> ### Legal Boilerplate Look, I get it. The entity doing business as "Sentry" was incorporated in the State of Delaware in 2015 as Functional Software, Inc. and is gonna need some rights from me in order to utilize my contributions in this here PR. So here's the deal: I retain all rights, title and interest in and to my contributions, and by keeping this boilerplate intact I confirm that Sentry can use, modify, copy, and redistribute my contributions, under Sentry's choice of terms.
1 parent a1252ee commit 53dd2fd

File tree

4 files changed

+18
-9
lines changed

4 files changed

+18
-9
lines changed

static/app/views/prevent/preventAI/onboarding.spec.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ import PreventAIOnboarding from './onboarding';
77

88
jest.mock('sentry-images/features/prevent-hero.svg', () => 'prevent-hero-mock.svg');
99
jest.mock(
10-
'sentry-images/features/prevent-pr-comment.png',
11-
() => 'prevent-pr-comment-mock.png'
10+
'sentry-images/features/prevent-pr-comments.png',
11+
() => 'prevent-pr-comments-mock.png'
1212
);
1313

1414
describe('PreventAIOnboarding', () => {
@@ -131,9 +131,9 @@ describe('PreventAIOnboarding', () => {
131131
const heroImage = screen.getByAltText('Prevent AI Hero');
132132
expect(heroImage).toBeInTheDocument();
133133

134-
const prCommentImage = screen.getByAltText('Prevent PR Comment');
135-
expect(prCommentImage).toBeInTheDocument();
136-
expect(prCommentImage).toHaveAttribute('src', 'prevent-pr-comment-mock.png');
134+
const prCommentsImage = screen.getByAltText('Prevent PR Comments');
135+
expect(prCommentsImage).toBeInTheDocument();
136+
expect(prCommentsImage).toHaveAttribute('src', 'prevent-pr-comments-mock.png');
137137
});
138138

139139
it('renders admin notice text', () => {

static/app/views/prevent/preventAI/onboarding.tsx

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,13 @@ import {useTheme} from '@emotion/react';
22
import styled from '@emotion/styled';
33

44
import preventHero from 'sentry-images/features/prevent-hero.svg';
5-
import preventPrComment from 'sentry-images/features/prevent-pr-comment.png';
5+
import preventPrComments from 'sentry-images/features/prevent-pr-comments.png';
66

77
import {Container, Flex} from 'sentry/components/core/layout';
88
import {ExternalLink} from 'sentry/components/core/link';
99
import {Text} from 'sentry/components/core/text';
1010
import {Heading} from 'sentry/components/core/text/heading';
11+
import {IconInfo} from 'sentry/icons/iconInfo';
1112
import {t, tct} from 'sentry/locale';
1213
import useOrganization from 'sentry/utils/useOrganization';
1314

@@ -132,10 +133,10 @@ export default function PreventAIOnboarding() {
132133
background="secondary"
133134
radius="md"
134135
>
135-
<Text variant="primary" size="sm" bold>
136+
<Text variant="primary" size="md" bold>
136137
{t('How to use Prevent AI')}
137138
</Text>
138-
<Text variant="muted" size="sm">
139+
<Text variant="muted" size="md">
139140
{t('Prevent AI helps you ship better code with three features:')}
140141
</Text>
141142
<Container as="ul" style={{margin: 0, fontSize: '12px'}}>
@@ -193,8 +194,16 @@ export default function PreventAIOnboarding() {
193194
)}
194195
</Text>
195196
</Flex>
197+
<Text variant="muted" size="xs">
198+
<Flex gap="sm" justify="center">
199+
<IconInfo size="xs" />
200+
{t(
201+
`This page will remain visible after the app is installed. Reviewer Configuration and Usage Stats are coming soon.`
202+
)}
203+
</Flex>
204+
</Text>
196205
</Flex>
197-
<StyledImg src={preventPrComment} alt="Prevent PR Comment" />
206+
<StyledImg src={preventPrComments} alt="Prevent PR Comments" />
198207
</Flex>
199208
</Flex>
200209
);
-484 KB
Binary file not shown.
98.4 KB
Loading

0 commit comments

Comments
 (0)