feat(feedback): Add UF screenshot capability (#9867)

* add screenshot to docs * Update docs/platforms/javascript/common/user-feedback/configuration/index.mdx Co-authored-by: vivianyentran <[email protected]> * Update docs/platforms/javascript/common/user-feedback/index.mdx Co-authored-by: vivianyentran <[email protected]> * Update docs/platforms/javascript/common/user-feedback/index.mdx Co-authored-by: Michelle Zhang <[email protected]> * Update docs/platforms/javascript/common/user-feedback/index.mdx Co-authored-by: Jasmin <[email protected]> * Update docs/platforms/javascript/common/user-feedback/configuration/index.mdx Co-authored-by: Jasmin <[email protected]> * Update docs/platforms/javascript/common/user-feedback/index.mdx Co-authored-by: Michelle Zhang <[email protected]> * Update docs/platforms/javascript/common/user-feedback/index.mdx Co-authored-by: Bruno Garcia <[email protected]> * Update index.mdx * Update docs/platforms/javascript/common/user-feedback/index.mdx Co-authored-by: Bruno Garcia <[email protected]> * Update index.mdx * Update index.mdx * Update docs/platforms/javascript/common/user-feedback/configuration/index.mdx Co-authored-by: Bruno Garcia <[email protected]> * Update docs/platforms/javascript/common/user-feedback/index.mdx Co-authored-by: Bruno Garcia <[email protected]> * screenshots * showscreenshot renamed + pr comment * Update index.mdx * Update index.mdx * Update index.mdx * update screenshots * hopefully last modification --------- Co-authored-by: vivianyentran <[email protected]> Co-authored-by: Jasmin <[email protected]> Co-authored-by: Michelle Zhang <[email protected]> Co-authored-by: Bruno Garcia <[email protected]>
getsentry · May 9, 2024 · 6c02ad1 · 6c02ad1
1 parent 28927ad
commit 6c02ad1
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 5 deletions.
diff --git a/docs/platforms/javascript/common/user-feedback/configuration/index.mdx b/docs/platforms/javascript/common/user-feedback/configuration/index.mdx
@@ -28,6 +28,7 @@ The following options can be configured for the integration in `feedbackIntegrat
 | ----------------- | ------------------------ | ------------------------------------- | --------------------------------------------------------------------------------------------------------------------------- |
 | `showName` | `boolean` | `true` | Displays the name field on the Feedback form, however will still capture the name (if available) from Sentry SDK context. |
 | `showEmail` | `boolean` | `true` | Displays the email field on the Feedback form, however will still capture the email (if available) from Sentry SDK context. |
+| `enableScreenshot` | `boolean` | `true` | Allows the user to send a screenshot attachment with their feedback. Requires SDK version 8.0.0-rc.2 and above. For self-hosted, release 24.4.2 is also required. |
 | `isNameRequired` | `boolean` | `false` | Requires the name field on the Feedback form to be filled in. |
 | `isEmailRequired` | `boolean` | `false` | Requires the email field on the Feedback form to be filled in. |
 | `useSentryUser` | `Record<string, string>` | `{ email: 'email', name: 'username'}` | Map of the `email` and `name` fields to the corresponding Sentry SDK user fields that were called with `Sentry.setUser`. |

diff --git a/docs/platforms/javascript/common/user-feedback/img/user-feedback-widget.png b/docs/platforms/javascript/common/user-feedback/img/user-feedback-widget.png
diff --git a/docs/platforms/javascript/common/user-feedback/index.mdx b/docs/platforms/javascript/common/user-feedback/index.mdx
@@ -14,7 +14,8 @@ The User Feedback feature allows you to collect user feedback from anywhere insi
 
 The embeddable JavaScript widget allows users to submit feedback from anywhere inside your application. The [Crash-Report Modal](#crash-report-modal) collects reactive feedback tied to an error event.
 
-![An example image of the User Feedback Widget on a demo site](./img/user-feedback-widget.png)
+![An example feedback image of the User Feedback Widget on a demo site](./img/user-feedback-widget.png)
+
 
 ### Pre-requisites
 
@@ -28,16 +29,22 @@ The embeddable JavaScript widget allows users to submit feedback from anywhere i
 
 To set up the integration, add the following to your Sentry initialization. There are many options you can pass to the integration constructor. See the [configuration documentation](/platforms/javascript/user-feedback/configuration/) for more details.
 
-### Session Replay
-
-The User Feedback Widget integrates easily with <PlatformLink to="/session-replay/">Session Replay</PlatformLink>. First, make sure that the Session Replay integration is configured correctly and that `replaysOnErrorSampleRate` is greater than 0. When this is done, the Replay SDK will buffer up to 30 seconds worth of events until the user *opens* the User Feedback Widget. If the user submits feedback, you'll be able to view the Feedback (including the replay), inside of Sentry's web application.
-
 <SignInNote />
 
 <PlatformContent includePath="user-feedback/setup" />
 
 By default, this will insert the widget into the bottom right corner of your website. You're free to customize nearly every aspect of the widget, including replacing it completely with your own UI.
 
+On SDK version 8.0.0-rc.2 and above, users can send screenshots with their feedback. If you're self-hosting, you also need release 24.4.2 and above. You can configure this using the `enableScreenshot` option, by default it is set to `true`. Screenshots aren't supported on mobile devices, so the screenshot button will be hidden automatically in this case.
+
+<Alert level="">
+ Screenshots use your [attachments quota](/product/accounts/quotas/manage-attachments-quota). All plans come with 1GB of attachments, which is approxiamately 2500 screenshots.
+</Alert>
+
+### Session Replay
+
+The User Feedback widget integrates easily with <PlatformLink to="/session-replay/">Session Replay</PlatformLink>. First, make sure that the Session Replay integration is configured correctly and that `replaysOnErrorSampleRate` is greater than 0. When this is done, the Replay SDK will buffer up to 30 seconds of the user's session until the user *opens* the User Feedback widget. If the user submits feedback, you'll be able to view the feedback (including the replay), in sentry.io.
+
 </PlatformSection>
 
 ## User Feedback API

diff --git a/docs/product/user-feedback/img/user-feedback-list.png b/docs/product/user-feedback/img/user-feedback-list.png
diff --git a/docs/product/user-feedback/img/user-feedback-triaging.png b/docs/product/user-feedback/img/user-feedback-triaging.png
diff --git a/docs/product/user-feedback/img/user-feedback-widget.png b/docs/product/user-feedback/img/user-feedback-widget.png
diff --git a/docs/product/user-feedback/index.mdx b/docs/product/user-feedback/index.mdx
@@ -19,6 +19,7 @@ The User Feedback Widget is an out-of-the-box, persistent widget you can add any
 Feedback collected via the Feedback Widget may have some or all of the following information (depending on what you mark as required and what’s available from the error context):
 
 - Description from the user
+- Screenshot from the user
 - User email
 - Associated replay event (with up to 60 seconds of replay recording before the user submitted the feedback)
 - Learn more about how to set up Session Replay [here](/product/session-replay/getting-started/).