Use Sentry user email and name when set

Author: antonis

packages/core/src/js/feedback/FeedbackForm.tsx

@@ -4,7 +4,7 @@ import * as React from 'react';
 import type { KeyboardTypeOptions } from 'react-native';
 import { Alert, Text, TextInput, TouchableOpacity, View } from 'react-native';
 
-import { defaultConfiguration } from './constants';
+import { defaultConfiguration } from './defaults';
 import defaultStyles from './FeedbackForm.styles';
 import type { FeedbackFormProps, FeedbackFormState, FeedbackFormStyles,FeedbackGeneralConfiguration, FeedbackTextConfiguration } from './FeedbackForm.types';
 
@@ -15,9 +15,11 @@ import type { FeedbackFormProps, FeedbackFormState, FeedbackFormStyles,FeedbackG
 export class FeedbackForm extends React.Component<FeedbackFormProps, FeedbackFormState> {
   public constructor(props: FeedbackFormProps) {
     super(props);
+
+    const config: FeedbackGeneralConfiguration = { ...defaultConfiguration, ...props };
     this.state = {
-      name: '',
-      email: '',
+      name: config.useSentryUser.name,
+      email: config.useSentryUser.email,
       description: '',
     };
   }

packages/core/src/js/feedback/FeedbackForm.types.ts

@@ -28,6 +28,15 @@ export interface FeedbackGeneralConfiguration {
    * Should the name input field be visible? Note: name will still be collected if set via `Sentry.setUser()`
    */
   showName?: boolean;
+
+  /**
+   * Fill in email/name input fields with Sentry user context if it exists.
+   * The value of the email/name keys represent the properties of your user context.
+   */
+  useSentryUser?: {
+    email: string;
+    name: string;
+  };
 }
 
 /**

packages/core/src/js/feedback/constants.ts renamed to packages/core/src/js/feedback/defaults.ts

@@ -1,3 +1,5 @@
+import { getCurrentScope } from '@sentry/core';
+
 import type { FeedbackFormProps } from './FeedbackForm.types';
 
 const FORM_TITLE = 'Report a Bug';
@@ -20,6 +22,10 @@ export const defaultConfiguration: Partial<FeedbackFormProps> = {
   isNameRequired: false,
   showEmail: true,
   showName: true,
+  useSentryUser: {
+    email: getCurrentScope().getUser().email || '',
+    name: getCurrentScope().getUser().name || '',
+  },
 
   // FeedbackTextConfiguration
   cancelButtonLabel: CANCEL_BUTTON_LABEL,

packages/core/test/feedback/FeedbackForm.test.tsx

@@ -12,6 +12,12 @@ jest.spyOn(Alert, 'alert');
 
 jest.mock('@sentry/core', () => ({
   captureFeedback: jest.fn(),
+  getCurrentScope: jest.fn(() => ({
+    getUser: jest.fn(() => ({
+      email: '[email protected]',
+      name: 'Test User',
+    })),
+  })),
 }));
 
 const defaultProps: FeedbackFormProps = {
@@ -50,6 +56,16 @@ describe('FeedbackForm', () => {
     expect(getByText(defaultProps.cancelButtonLabel)).toBeTruthy();
   });
 
+  it('name and email are prefilled when sentry user is set', () => {
+    const { getByPlaceholderText } = render(<FeedbackForm {...defaultProps} />);
+
+    const nameInput = getByPlaceholderText(defaultProps.namePlaceholder);
+    const emailInput = getByPlaceholderText(defaultProps.emailPlaceholder);
+
+    expect(nameInput.props.value).toBe('Test User');
+    expect(emailInput.props.value).toBe('[email protected]');
+  });
+
   it('shows an error message if required fields are empty', async () => {
     const { getByText } = render(<FeedbackForm {...defaultProps} />);