import {Fragment} from 'react'; import {BrowserClient} from '@sentry/react'; import {FeatureFeedback} from 'sentry/components/featureFeedback'; import TextField from 'sentry/components/forms/fields/textField'; import GlobalModal from 'sentry/components/globalModal'; import IndicatorContainer from 'sentry/components/indicators'; import {RouteContext} from 'sentry/views/routeContext'; export default { title: 'Components/Feature Feedback', }; export const _FeatureFeedback = () => { const router = { location: { query: {}, pathname: '/mock-pathname/', }, routes: [], params: {orgId: 'org-slug'}, }; // A workaround for this story to not send feedback events to Sentry // TODO: Check if there is a way to mock this in Storybook BrowserClient.prototype.captureEvent = () => {}; return (

Default

Custom

{({Header, Body, Footer, state, onFieldChange}) => { if (state.step === 0) { return (
First Step
onFieldChange('name', value)} />
onFieldChange('step', 1)} /> ); } return (
Last Step
onFieldChange('surname', value)} />
onFieldChange('step', 0)} primaryDisabled={!state.surname?.trim()} submitEventData={{message: 'Feedback: test'}} /> ); }}
); }; _FeatureFeedback.storyName = 'FeatureFeedback'; _FeatureFeedback.parameters = { docs: { description: { story: 'It includes a button that, when clicked, opens a modal that the user can use to send feedback to sentry', }, }, };