3

I need to open the user feedback window in my simulator using @sentry/react-native.

I have tired by adding the Sentry.showReportDialog() in my App.js.

But it not worked and I got an undefined error.

Can anyone suggest what is the best practice to open the user feedback window in @sentry/react-native?

sejn
  • 2,040
  • 6
  • 28
  • 82

2 Answers2

3

I think feedback windows is only for browsers as you can read in this thread https://github.com/getsentry/sentry-react-native/issues/500 as an option you can put it via feedback API and make your own global modal/alert

Sentry.init({
    dsn: 'key',
    beforeSend(event, hint) {
      // Check if it is an exception, and if so, show the report dialog
      if (event.exception) {
        Sentry.showReportDialog({ eventId: event.event_id });
      }
      return event;
    }
});

Example of sentry api feedback

let endpoint = 'https://sentry.io/api/0/projects/{your_organization_slug}/{your_project_slug}/user-feedback/'

let params = {
  event_id: ...,
  name: 'John Smith',
  email: 'johnsmith@example.com',
  comments: 'This app sucks'
}

try {
  await fetch(endpoint, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(params)
  })
  console.log('Feedback submitted!')
} catch (error) {
  console.error(error)
}
anthony willis muñoz
  • 2,346
  • 3
  • 16
  • 33
  • If I use the above can I able to show in the ios(Simulator) and android – sejn Jan 23 '20 at 07:26
  • 1
    no that only work in browser. you can read the github thread, there is a feature request for what you want. But if you need it you can use Feedback Api to register the events and show some ui alert – anthony willis muñoz Jan 23 '20 at 07:29
  • So I can able to use this API to get the feedback in mobile app. So I needs to customize the popup window for now. I am i right? – sejn Jan 23 '20 at 07:42
  • with the api you can send the feedback from the user to your sentry dashboard. So for achieve this you should send a post request to sentry feedback api. you can check my edit – anthony willis muñoz Jan 23 '20 at 07:49
  • Can yu give any examples in expo. I am getting error while creating lastEventId – sejn Jan 23 '20 at 10:46
0

Sentry.showReportDialog() exists only in the browser sdk

To send user feedback in the React Native SDK use Sentry.captureUserFeedback(userFeedback) details are in the Sentry docs.

import * as Sentry from '@sentry/react-native';
import { UserFeedback } from '@sentry/react-native';

const sentryId = Sentry.captureMessage('My Message');
// OR: const sentryId = Sentry.lastEventId();

const userFeedback: UserFeedback = {
  event_id: sentryId,
  name: 'John Doe',
  email: 'john@doe.com',
  comments: 'Hello World!',
};

Sentry.captureUserFeedback(userFeedback);

To see how to create a popup User Feedback form check the sample app implementation.

Kryštof Woldřich
  • 51
  • 3