Merge fa41526 into 0935bbd

CHANGELOG.md

@@ -10,22 +10,32 @@
 
 ### Features
 
-- Adds new `captureFeedback` and deprecates the `captureUserFeedback` API ([#4320](https://github.com/getsentry/sentry-react-native/pull/4320))
+- Adds new `captureFeedback` and deprecates the `captureUserFeedback` API ([#4320](https://github.com/getsentry/sentry-react-native/pull/4320), [#4322](https://github.com/getsentry/sentry-react-native/pull/4322))
 
   ```jsx
-  import * as Sentry from "@sentry/react-native";
-  import { SendFeedbackParams } from "@sentry/react-native";
+  import * as Sentry from '@sentry/react-native';
+  import { SendFeedbackParams } from '@sentry/react-native';
 
-  const eventId = Sentry.captureMessage("My Message");
+  const eventId = Sentry.captureMessage('My Message');
   // OR: const eventId = Sentry.lastEventId();
 
   const userFeedback: SendFeedbackParams = {
-    name: "John Doe",
-    email: "[email protected]",
-    message: "Hello World!",
+    name: 'John Doe',
+    email: '[email protected]',
+    message: 'Hello World!',
     associatedEventId: eventId,// Optional
   };
-  Sentry.captureFeedback(userFeedback);
+  Sentry.captureFeedback(userFeedback, {
+    captureContext: {
+      tags: { 'tag-key': 'tag-value' },
+    },
+    attachments: [
+      {
+        filename: 'screenshot.png',
+        data: 'base64-encoded-image',
+      },
+    ],
+  });
   ```
 
 ### Fixes

packages/core/src/js/client.ts

@@ -86,8 +86,8 @@ export class ReactNativeClient extends BaseClient<ReactNativeClientOptions> {
   /**
    * Sends user feedback to Sentry.
    */
-  public captureFeedback(feedback: SendFeedbackParams): void {
-    captureFeedbackApi(feedback);
+  public captureFeedback(feedback: SendFeedbackParams, hint?: EventHint): void {
+    captureFeedbackApi(feedback, hint);
   }
 
   /**

packages/core/src/js/sdk.tsx

@@ -4,7 +4,7 @@ import {
   defaultStackParser,
   makeFetchTransport,
 } from '@sentry/react';
-import type { Breadcrumb, BreadcrumbHint, Integration, Scope, SendFeedbackParams, UserFeedback } from '@sentry/types';
+import type { Breadcrumb, BreadcrumbHint, EventHint, Integration, Scope, SendFeedbackParams, UserFeedback } from '@sentry/types';
 import { logger, stackParserFromStackParserOptions } from '@sentry/utils';
 import * as React from 'react';
 
@@ -234,8 +234,8 @@ export function captureUserFeedback(feedback: UserFeedback): void {
 /**
  * Captures user feedback and sends it to Sentry.
  */
-export function captureFeedback(feedbackParams: SendFeedbackParams): void {
-  getClient<ReactNativeClient>()?.captureFeedback(feedbackParams);
+export function captureFeedback(feedbackParams: SendFeedbackParams, hint?: EventHint): void {
+  getClient<ReactNativeClient>()?.captureFeedback(feedbackParams, hint);
 }
 
 /**

packages/core/test/client.test.ts

@@ -313,7 +313,40 @@ describe('Tests ReactNativeClient', () => {
 
       client.captureFeedback(feedback);
 
-      expect(captureFeedbackApi).toHaveBeenCalledWith(feedback);
+      expect(captureFeedbackApi).toHaveBeenCalledWith(feedback, undefined);
+    });
+
+    test('sends UserFeedback with hint', () => {
+      const client = new ReactNativeClient({
+        ...DEFAULT_OPTIONS,
+        dsn: EXAMPLE_DSN,
+      });
+      jest.mock('@sentry/browser', () => ({
+        captureFeedback: jest.fn(),
+      }));
+
+      const feedback: SendFeedbackParams = {
+        message: 'Test Comments',
+        email: '[email protected]',
+        name: 'Test User',
+        associatedEventId: 'testEvent123',
+      };
+
+      const hint = {
+        captureContext: {
+          tags: { testtag: 'testvalue' },
+        },
+        attachments: [
+          {
+            filename: 'screenshot.png',
+            data: 'base64Image',
+          },
+        ],
+      };
+
+      client.captureFeedback(feedback, hint);
+
+      expect(captureFeedbackApi).toHaveBeenCalledWith(feedback, hint);
     });
   });
 

samples/react-native-macos/src/components/UserFeedbackModal.tsx

@@ -65,6 +65,36 @@ export function UserFeedbackModal(props: { onDismiss: () => void }) {
             }}
           />
           <View style={styles.buttonSpacer} />
+          <Button
+            title="Send feedback with attachment and tags"
+            color="#6C5FC7"
+            onPress={async () => {
+              onDismiss();
+
+              const base64Image =
+                'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/wcAAgUBA+kZYq8AAAAASUVORK5CYII=';
+
+              const userFeedback: SendFeedbackParams = {
+                message: comments,
+                name: 'John Doe',
+                email: '[email protected]',
+              };
+
+              Sentry.captureFeedback(userFeedback, {
+                captureContext: {
+                  tags: { testtag: 'testvalue' },
+                },
+                attachments: [
+                  {
+                    filename: 'screenshot.png',
+                    data: base64Image,
+                  },
+                ],
+              });
+              clearComments();
+            }}
+          />
+          <View style={styles.buttonSpacer} />
           <Button
             title="Close"
             color="#6C5FC7"

samples/react-native/src/components/UserFeedbackModal.tsx

@@ -65,6 +65,35 @@ export function UserFeedbackModal(props: { onDismiss: () => void }) {
             }}
           />
           <View style={styles.buttonSpacer} />
+          <Button
+            title="Send feedback with attachment and tags"
+            color="#6C5FC7"
+            onPress={async () => {
+              onDismiss();
+
+              const base64Image = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mP8/wcAAgUBA+kZYq8AAAAASUVORK5CYII=';
+
+              const userFeedback: SendFeedbackParams = {
+                message: comments,
+                name: 'John Doe',
+                email: '[email protected]',
+              };
+
+              Sentry.captureFeedback(userFeedback, {
+                captureContext: {
+                  tags: { testtag: 'testvalue' },
+                },
+                attachments: [
+                  {
+                    filename: 'screenshot.png',
+                    data: base64Image,
+                  },
+                ],
+              });
+              clearComments();
+            }}
+          />
+          <View style={styles.buttonSpacer} />
           <Button
             title="Close"
             color="#6C5FC7"