Skip to content

Commit 639f64d

Browse files
antonisantonis
committed
Rename form to widget
1 parent 99d7772 commit 639f64d

File tree

2 files changed

+37
-37
lines changed

2 files changed

+37
-37
lines changed

‎docs/platforms/react-native/user-feedback/configuration/index.mdx

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -7,26 +7,26 @@ description: "Learn about the User Feedback Widget configuration options."
77
The User Feedback Widget offers many customization options, and if the available options are insufficient, you can [use your own UI](/platforms/react-native/user-feedback/#user-feedback-api).
88

99
![An image showing the main customization options for the User Feedback Widget](./img/mobile-user-feedback-widget-customization.png)
10-
To collect user feedback from inside your application use the `showFeedbackForm` method.
10+
To collect user feedback from inside your application use the `showFeedbackWidget` method.
1111

1212
```javascript
1313
import * as Sentry from "@sentry/react-native";
1414

15-
Sentry.showFeedbackForm();
15+
Sentry.showFeedbackWidget();
1616
```
1717
## General
1818

19-
The following options can be configured for the integration in `feedbackIntegration({})` or passed in the `FeedbackForm` component props:
19+
The following options can be configured for the integration in `feedbackIntegration({})` or passed in the `FeedbackWidget` component props:
2020

2121

2222
| Key | Type | Default | Description |
2323
| ---------------------- | ------------------------ | ------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
24-
| `showBranding` | `boolean` | `true` | Displays the Sentry logo inside of the form. |
25-
| `showName` | `boolean` | `true` | Displays the name field on the feedback form. |
26-
| `showEmail` | `boolean` | `true` | Displays the email field on the feedback form. |
24+
| `showBranding` | `boolean` | `true` | Displays the Sentry logo. |
25+
| `showName` | `boolean` | `true` | Displays the name field on the feedback widget. |
26+
| `showEmail` | `boolean` | `true` | Displays the email field on the feedback widget. |
2727
| `enableScreenshot` | `boolean` | `false` | Allows the user to send a screenshot attachment with their feedback. |
28-
| `isNameRequired` | `boolean` | `false` | Requires the name field on the feedback form to be filled in. |
29-
| `isEmailRequired` | `boolean` | `false` | Requires the email field on the feedback form to be filled in. |
28+
| `isNameRequired` | `boolean` | `false` | Requires the name field on the feedback widget to be filled in. |
29+
| `isEmailRequired` | `boolean` | `false` | Requires the email field on the feedback widget to be filled in. |
3030
| `shouldValidateEmail` | `boolean` | `true` | If set the email is validated with the following regular expression `"/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/"` |
3131
| `useSentryUser` | `Record<string, string>` | `{ email: 'email', name: 'username'}` | Sets the default values for the `email` and `name` fields. |
3232

@@ -35,15 +35,15 @@ The following options can be configured for the integration in `feedbackIntegrat
3535

3636
All the text that you see in the Feedback widget can be customized.
3737

38-
The following options can be configured for the integration in `feedbackIntegration({})` or passed in the `FeedbackForm` component props:
38+
The following options can be configured for the integration in `feedbackIntegration({})` or passed in the `FeedbackWidget` component props:
3939

4040
| Key | Default | Description |
4141
| ----------------------------- | ------------------------------------------------------- | --------------------------------------------------------------- |
42-
| `formTitle` | `"Report a Bug"` | The title at the top of the feedback form. |
43-
| `submitButtonLabel` | `"Send Bug Report"` | The label of the submit button used in the feedback form. |
44-
| `cancelButtonLabel` | `"Cancel"` | The label of cancel buttons used in the feedback form. |
45-
| `addScreenshotButtonLabel` | `"Add a screenshot"` | The label of the button to add a screenshot to the form. |
46-
| `removeScreenshotButtonLabel` | `"Remove screenshot"` | The label of the button to remove the screenshot from the form. |
42+
| `formTitle` | `"Report a Bug"` | The title at the top of the feedback widget. |
43+
| `submitButtonLabel` | `"Send Bug Report"` | The label of the submit button used in the feedback widget. |
44+
| `cancelButtonLabel` | `"Cancel"` | The label of cancel buttons used in the feedback widget. |
45+
| `addScreenshotButtonLabel` | `"Add a screenshot"` | The label of the button to add a screenshot to the widget. |
46+
| `removeScreenshotButtonLabel` | `"Remove screenshot"` | The label of the button to remove the screenshot. |
4747
| `nameLabel` | `"Name"` | The label of the name input field. |
4848
| `namePlaceholder` | `"Your Name"` | The placeholder for the name input field. |
4949
| `emailLabel` | `"Email"` | The label of the email input field. |
@@ -85,15 +85,15 @@ Sentry.feedbackIntegration({
8585
},
8686
});
8787

88-
Sentry.showFeedbackForm();
88+
Sentry.showFeedbackWidget();
8989
```
9090

91-
The same can be achived by passing the `styles` prop to the `FeedbackForm` component:
91+
The same can be achived by passing the `styles` prop to the `FeedbackWidget` component:
9292

9393
```javascript
94-
import { FeedbackForm } from "@sentry/react-native";
94+
import { FeedbackWidget } from "@sentry/react-native";
9595

96-
<FeedbackForm
96+
<FeedbackWidget
9797
styles={{
9898
submitButton: {
9999
backgroundColor: '#6a1b9a',
@@ -107,7 +107,7 @@ The following styles are available for customisation.
107107

108108
| Style | Type | Description |
109109
| ------------------ | ------------ | -------------------------------------------------------------------------------- |
110-
| `container` | `ViewStyle` | The form container style. |
110+
| `container` | `ViewStyle` | The widget container style. |
111111
| `title` | `TextStyle` | The title text style. |
112112
| `label` | `TextStyle` | The label text style (name, email). |
113113
| `input` | `TextStyle` | The input field text style (name, email). |
@@ -122,16 +122,16 @@ The following styles are available for customisation.
122122

123123
## Event Callbacks
124124

125-
The following callbacks can be configured for the integration in `feedbackIntegration({})` or passed in the `FeedbackForm` component props:
125+
The following callbacks can be configured for the integration in `feedbackIntegration({})` or passed in the `FeedbackWidget` component props:
126126

127-
| Callback | Parameters | Default behavior | Description |
128-
| ----------------- | ---------------------------------------------------------- | ---------------------- | ------------------------------------------------------------------------------------------------------------ |
129-
| `onFormOpen` | | | Callback when form is opened. |
130-
| `onFormClose` | | The form is unmounted. | Callback when form is closed and not submitted. |
131-
| `onSubmitSuccess` | `data: FeedbackFormData` | | Callback when feedback is successfully submitted. |
132-
| `onSubmitError` | `error: Error` | | Callback when feedback is unsuccessfully submitted. |
133-
| `onFormSubmitted` | | The form is unmounted. | Callback when the feedback form is submitted successfully, and the SuccessMessage is complete, or dismissed. |
134-
| `onAddScreenshot` | `attachFile: (filename: string, data: Uint8Array) => void` | | Callback when a screenshot is added. |
127+
| Callback | Parameters | Default behavior | Description |
128+
| ----------------- | ---------------------------------------------------------- | ----------------------- | ------------------------------------------------------------------------------------------------------------- |
129+
| `onFormOpen` | | | Callback when widget is opened. |
130+
| `onFormClose` | | The widget is unmounted.| Callback when widget is closed and not submitted. |
131+
| `onSubmitSuccess` | `data: FeedbackFormData` | | Callback when feedback is successfully submitted. |
132+
| `onSubmitError` | `error: Error` | | Callback when feedback is unsuccessfully submitted. |
133+
| `onFormSubmitted` | | The widget is unmounted.| Callback when the feedback widget is submitted successfully, and the SuccessMessage is complete, or dismissed.|
134+
| `onAddScreenshot` | `attachFile: (filename: string, data: Uint8Array) => void` | | Callback when a screenshot is added. |
135135

136136
## Screenshots
137137

‎docs/platforms/react-native/user-feedback/index.mdx

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,17 +12,17 @@ Note that if you're using a self-hosted Sentry instance, you'll need to be on ve
1212

1313
The user feedback widget allows users to submit feedback from anywhere inside your application.
1414

15-
To collect user feedback from inside your application use the `showFeedbackForm` method.
15+
To collect user feedback from inside your application use the `showFeedbackWidget` method.
1616

1717
```javascript
1818
import * as Sentry from "@sentry/react-native";
1919

20-
Sentry.showFeedbackForm();
20+
Sentry.showFeedbackWidget();
2121
```
2222

23-
Note that the `showFeedbackForm` method depends on the React Native `Modal` implementation. It is supported fully in the legacy architecture. For the new architecture (Fabric renderer) it requires React Native `0.71` and up.
23+
Note that the `showFeedbackWidget` method depends on the React Native `Modal` implementation. It is supported fully in the legacy architecture. For the new architecture (Fabric renderer) it requires React Native `0.71` and up.
2424

25-
To configure the form you can use the `Sentry.feedbackIntegration({})` or add it to your Sentry initialization.
25+
To configure the widget you can use the `Sentry.feedbackIntegration({})` or add it to your Sentry initialization.
2626

2727
```javascript
2828
import * as Sentry from "@sentry/react-native";
@@ -46,17 +46,17 @@ Sentry.init({
4646

4747
There are many options you can pass to the integration constructor. See the [configuration documentation](/platforms/react-native/user-feedback/configuration/) for more details.
4848

49-
### Feedback Form Component
49+
### Feedback Widget Component
5050

51-
You can also integrate the `FeedbackForm` component manually in your app.
51+
You can also integrate the `FeedbackWidget` component manually in your app.
5252

5353
```javascript
54-
import { FeedbackForm } from "@sentry/react-native";
54+
import { FeedbackWidget } from "@sentry/react-native";
5555

56-
<FeedbackForm/>
56+
<FeedbackWidget/>
5757
```
5858

59-
For the full set of options you can pass to the `FeedbackForm` component see the [configuration documentation](/platforms/react-native/user-feedback/configuration/).
59+
For the full set of options you can pass to the `FeedbackWidget` component see the [configuration documentation](/platforms/react-native/user-feedback/configuration/).
6060

6161
<Alert>
6262

0 commit comments

Comments
 (0)