From da614abbe382d0c014359737c3cd0f6c66b1a711 Mon Sep 17 00:00:00 2001 From: Rohan Agarwal Date: Wed, 28 May 2025 14:25:28 -0700 Subject: [PATCH 1/3] Make feedback mechanisms clearer --- .../autofix/autofixHighlightWrapper.tsx | 11 ++--- .../events/autofix/autofixInsightCards.tsx | 43 ++++++++++++++----- 2 files changed, 39 insertions(+), 15 deletions(-) diff --git a/static/app/components/events/autofix/autofixHighlightWrapper.tsx b/static/app/components/events/autofix/autofixHighlightWrapper.tsx index c05fc59f6e9b4a..5d8924b9112bae 100644 --- a/static/app/components/events/autofix/autofixHighlightWrapper.tsx +++ b/static/app/components/events/autofix/autofixHighlightWrapper.tsx @@ -47,7 +47,12 @@ export function AutofixHighlightWrapper({ return ( - + {children} @@ -76,10 +81,6 @@ const Wrapper = styled('div')<{isSelected: boolean}>` !p.isSelected && css` cursor: pointer; - - * { - ${p.theme.tooltipUnderline('gray200')}; - } `}; } `; diff --git a/static/app/components/events/autofix/autofixInsightCards.tsx b/static/app/components/events/autofix/autofixInsightCards.tsx index 7bcda532a56137..0bfa3014ba7c34 100644 --- a/static/app/components/events/autofix/autofixInsightCards.tsx +++ b/static/app/components/events/autofix/autofixInsightCards.tsx @@ -13,7 +13,7 @@ import {replaceHeadersWithBold} from 'sentry/components/events/autofix/autofixRo import type {AutofixInsight} from 'sentry/components/events/autofix/types'; import {makeAutofixQueryKey} from 'sentry/components/events/autofix/useAutofix'; import {useTypingAnimation} from 'sentry/components/events/autofix/useTypingAnimation'; -import {IconChevron, IconClose, IconRefresh} from 'sentry/icons'; +import {IconChevron, IconClose} from 'sentry/icons'; import {t, tn} from 'sentry/locale'; import {space} from 'sentry/styles/space'; import {singleLineRenderer} from 'sentry/utils/marked/marked'; @@ -145,6 +145,8 @@ function AutofixInsightCard({ if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); handleSubmit(e); + } else if (e.key === 'Escape') { + handleCancel(); } }} /> @@ -162,10 +164,10 @@ function AutofixInsightCard({ type="submit" priority="primary" size="sm" - title={t('Rethink the answer')} - aria-label={t('Rethink the answer')} + title={t('Restart work from here')} + aria-label={t('Restart work from here')} > - + {'\u23CE'} @@ -208,7 +210,7 @@ function AutofixInsightCard({ size="zero" borderless onClick={handleEdit} - icon={} + icon={} aria-label={t('Edit insight')} title={t('Rethink the answer from here')} /> @@ -372,6 +374,8 @@ function CollapsibleChainLink({ if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); handleSubmit(e); + } else if (e.key === 'Escape') { + handleCancel(); } }} /> @@ -388,10 +392,10 @@ function CollapsibleChainLink({ type="submit" priority="primary" size="sm" - title={t('Rethink the answer')} - aria-label={t('Rethink the answer')} + title={t('Restart work from here')} + aria-label={t('Restart work from here')} > - + {'\u23CE'} @@ -402,10 +406,12 @@ function CollapsibleChainLink({ size="zero" borderless onClick={() => setIsAdding(true)} - icon={} title={t('Give feedback and rethink the answer')} aria-label={t('Give feedback and rethink the answer')} - /> + > + {t('Rethink this answer')} + + ))} @@ -819,4 +825,21 @@ const AddButton = styled(Button)` } `; +function FlippedReturnIcon(props: React.HTMLAttributes) { + return {'\u21A9'}; +} + export default AutofixInsightCards; + +const CheckpointIcon = styled('span')` + transform: scaleY(-1); + margin-bottom: ${space(0.5)}; +`; + +const RethinkLabel = styled('span')` + display: flex; + align-items: center; + font-size: ${p => p.theme.fontSizeSmall}; + color: ${p => p.theme.subText}; + margin-right: ${space(0.5)}; +`; From c4ea7f7203d6a105c362bf255a4e1db21746b7fd Mon Sep 17 00:00:00 2001 From: Rohan Agarwal Date: Wed, 28 May 2025 14:33:49 -0700 Subject: [PATCH 2/3] Fix test --- .../components/events/autofix/autofixInsightCards.spec.tsx | 2 +- static/app/components/events/autofix/autofixInsightCards.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/static/app/components/events/autofix/autofixInsightCards.spec.tsx b/static/app/components/events/autofix/autofixInsightCards.spec.tsx index f9763447e5fa19..9e445672ca546e 100644 --- a/static/app/components/events/autofix/autofixInsightCards.spec.tsx +++ b/static/app/components/events/autofix/autofixInsightCards.spec.tsx @@ -176,7 +176,7 @@ describe('AutofixInsightCards', () => { const input = screen.getByPlaceholderText('Share your own insight here...'); await userEvent.type(input, 'Here is my insight.'); - const submitButton = screen.getByLabelText('Rethink the answer'); + const submitButton = screen.getByLabelText('Redo work from here'); await userEvent.click(submitButton); await waitFor(() => { diff --git a/static/app/components/events/autofix/autofixInsightCards.tsx b/static/app/components/events/autofix/autofixInsightCards.tsx index 0bfa3014ba7c34..99c95aae64243b 100644 --- a/static/app/components/events/autofix/autofixInsightCards.tsx +++ b/static/app/components/events/autofix/autofixInsightCards.tsx @@ -392,8 +392,8 @@ function CollapsibleChainLink({ type="submit" priority="primary" size="sm" - title={t('Restart work from here')} - aria-label={t('Restart work from here')} + title={t('Redo work from here')} + aria-label={t('Redo work from here')} > {'\u23CE'} From 3a5705d47bd856366f5c7ff24beae17d58ad8b83 Mon Sep 17 00:00:00 2001 From: Rohan Agarwal Date: Wed, 28 May 2025 14:34:47 -0700 Subject: [PATCH 3/3] Fix tests --- .../components/events/autofix/autofixInsightCards.spec.tsx | 4 ++-- static/app/components/events/autofix/autofixInsightCards.tsx | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/static/app/components/events/autofix/autofixInsightCards.spec.tsx b/static/app/components/events/autofix/autofixInsightCards.spec.tsx index 9e445672ca546e..812de450b37b5b 100644 --- a/static/app/components/events/autofix/autofixInsightCards.spec.tsx +++ b/static/app/components/events/autofix/autofixInsightCards.spec.tsx @@ -121,7 +121,7 @@ describe('AutofixInsightCards', () => { const input = screen.getByPlaceholderText('Share your own insight here...'); await userEvent.type(input, 'Here is my insight.'); - const submitButton = screen.getByLabelText('Rethink the answer'); + const submitButton = screen.getByLabelText('Redo work from here'); await userEvent.click(submitButton); expect(mockApi).toHaveBeenCalledWith( @@ -154,7 +154,7 @@ describe('AutofixInsightCards', () => { const input = screen.getByPlaceholderText('Share your own insight here...'); await userEvent.type(input, 'Here is my insight.'); - const submitButton = screen.getByLabelText('Rethink the answer'); + const submitButton = screen.getByLabelText('Redo work from here'); await userEvent.click(submitButton); await waitFor(() => { diff --git a/static/app/components/events/autofix/autofixInsightCards.tsx b/static/app/components/events/autofix/autofixInsightCards.tsx index 99c95aae64243b..cf6ff52e24e623 100644 --- a/static/app/components/events/autofix/autofixInsightCards.tsx +++ b/static/app/components/events/autofix/autofixInsightCards.tsx @@ -164,8 +164,8 @@ function AutofixInsightCard({ type="submit" priority="primary" size="sm" - title={t('Restart work from here')} - aria-label={t('Restart work from here')} + title={t('Redo work from here')} + aria-label={t('Redo work from here')} > {'\u23CE'}