-
-
Notifications
You must be signed in to change notification settings - Fork 4.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
ref(feedback): Refactor the 3 feedback integrations we have into one …
…base hook and two views (#61411) We don't need to copy+paste here 3x! Also, we probably don't need any of this code in sentry, because Feedback is only initialized in getsentry. I can followup with those moves.
- Loading branch information
Showing
24 changed files
with
133 additions
and
170 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
22 changes: 22 additions & 0 deletions
22
static/app/components/feedback/widget/feedbackWidgetButton.tsx
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
import {useRef} from 'react'; | ||
|
||
import {Button} from 'sentry/components/button'; | ||
import useFeedbackWidget from 'sentry/components/feedback/widget/useFeedbackWidget'; | ||
import {IconMegaphone} from 'sentry/icons/iconMegaphone'; | ||
import {t} from 'sentry/locale'; | ||
|
||
export default function FeedbackWidgetButton() { | ||
const buttonRef = useRef<HTMLButtonElement>(null); | ||
const feedback = useFeedbackWidget({buttonRef}); | ||
|
||
// Do not show button if Feedback integration is not enabled | ||
if (!feedback) { | ||
return null; | ||
} | ||
|
||
return ( | ||
<Button ref={buttonRef} size="sm" icon={<IconMegaphone />}> | ||
{t('Give Feedback')} | ||
</Button> | ||
); | ||
} |
27 changes: 27 additions & 0 deletions
27
static/app/components/feedback/widget/floatingFeedbackWidget.tsx
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,27 @@ | ||
import {css, Global} from '@emotion/react'; | ||
|
||
import useFeedbackWidget from 'sentry/components/feedback/widget/useFeedbackWidget'; | ||
import theme from 'sentry/utils/theme'; | ||
|
||
/** | ||
* Use this to display the Feedback widget in certain routes/components | ||
*/ | ||
export default function FloatingFeedbackWidget() { | ||
const feedback = useFeedbackWidget({}); | ||
|
||
// No need for global styles if Feedback integration is not enabled | ||
if (!feedback) { | ||
return null; | ||
} | ||
|
||
// z-index needs to be below our indicators which is 10001 | ||
return ( | ||
<Global | ||
styles={css` | ||
#sentry-feedback { | ||
--z-index: ${theme.zIndex.toast - 1}; | ||
} | ||
`} | ||
/> | ||
); | ||
} |
48 changes: 48 additions & 0 deletions
48
static/app/components/feedback/widget/useFeedbackWidget.tsx
This file contains 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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
import {RefObject, useEffect} from 'react'; | ||
import {Feedback, getCurrentHub} from '@sentry/react'; | ||
|
||
import {t} from 'sentry/locale'; | ||
import ConfigStore from 'sentry/stores/configStore'; | ||
import {useLegacyStore} from 'sentry/stores/useLegacyStore'; | ||
|
||
interface Props { | ||
buttonRef?: RefObject<HTMLButtonElement>; | ||
} | ||
|
||
export default function useFeedbackWidget({buttonRef}: Props) { | ||
const config = useLegacyStore(ConfigStore); | ||
const hub = getCurrentHub(); | ||
const feedback = hub.getIntegration(Feedback); | ||
|
||
useEffect(() => { | ||
if (!feedback) { | ||
return undefined; | ||
} | ||
|
||
const options = { | ||
colorScheme: config.theme === 'dark' ? ('dark' as const) : ('light' as const), | ||
buttonLabel: t('Give Feedback'), | ||
submitButtonLabel: t('Send Feedback'), | ||
messagePlaceholder: t('What did you expect?'), | ||
formTitle: t('Give Feedback'), | ||
}; | ||
|
||
if (buttonRef) { | ||
if (buttonRef.current) { | ||
const widget = feedback.attachTo(buttonRef.current, options); | ||
return () => { | ||
feedback.removeWidget(widget); | ||
}; | ||
} | ||
} else { | ||
const widget = feedback.createWidget(options); | ||
return () => { | ||
feedback.removeWidget(widget); | ||
}; | ||
} | ||
|
||
return undefined; | ||
}, [buttonRef, config.theme, feedback]); | ||
|
||
return feedback; | ||
} |
This file contains 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
46 changes: 0 additions & 46 deletions
46
static/app/components/profiling/profilingFeedbackButton.tsx
This file was deleted.
Oops, something went wrong.
This file contains 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
This file contains 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
46 changes: 0 additions & 46 deletions
46
static/app/views/monitors/components/cronsFeedbackButton.tsx
This file was deleted.
Oops, something went wrong.
This file contains 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
This file contains 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
This file contains 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
This file contains 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
Oops, something went wrong.