Skip to content

Commit 509080c

Browse files
Add user feedback integration checkbox (#13959)
A "User Feedback" checkbox was added to the onboarding component, allowing users to opt-in to user feedback integration during setup. Changes were made to `src/components/onboarding/index.tsx`: * The `optionDetails` object was updated to include a new `'user-feedback'` entry. This defines the checkbox's display name ("User Feedback") and a descriptive tooltip: "Collect user feedback from anywhere in your application with an embeddable widget that allows users to report bugs and provide insights." * The `OPTION_IDS` array was extended to include `'user-feedback'`, ensuring the new checkbox appears in the setup flow alongside existing options like tracing and session replay. This modification successfully integrates the new UI element. However, it was confirmed that the checkbox's state will not automatically update related code snippets. For code snippets to dynamically change, documentation files must explicitly wrap `feedbackIntegration()` code within `<OnboardingOption optionId="user-feedback">` components or use product option markers like `// ___PRODUCT_OPTION_START___ user-feedback`. This session established the checkbox's presence and interactivity, but further steps are needed for full code snippet integration. --------- Co-authored-by: Cursor Agent <[email protected]>
1 parent 50b8528 commit 509080c

File tree

19 files changed

+228
-27
lines changed

19 files changed

+228
-27
lines changed

docs/platforms/javascript/common/index.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ Select which Sentry features you'd like to install in addition to Error Monitori
4747
<PlatformCategorySection notSupported={["server"]}>
4848
<PlatformSection notSupported={["javascript", "javascript.cordova"]}>
4949
<OnboardingOptionButtons
50-
options={["error-monitoring", "performance", "session-replay"]}
50+
options={["error-monitoring", "performance", "session-replay", "user-feedback"]}
5151
/>
5252
</PlatformSection>
5353
</PlatformCategorySection>
@@ -78,7 +78,7 @@ Select which Sentry features you'd like to install in addition to Error Monitori
7878

7979
<PlatformSection notSupported={["javascript.nextjs"]}>
8080

81-
Sentry captures data by using an SDK within your applications runtime.
81+
Sentry captures data by using an SDK within your application's runtime.
8282

8383
</PlatformSection>
8484

docs/platforms/javascript/guides/angular/manual-setup.mdx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ You need:
2424
Choose the features you want to configure, and this guide will show you how:
2525

2626
<OnboardingOptionButtons
27-
options={["error-monitoring", "performance", "session-replay"]}
27+
options={["error-monitoring", "performance", "session-replay", "user-feedback"]}
2828
/>
2929

3030
<PlatformContent includePath="getting-started-features-expandable" />
@@ -102,6 +102,12 @@ Sentry.init({
102102
// which automatically captures Session Replays
103103
Sentry.replayIntegration(),
104104
// ___PRODUCT_OPTION_END___ session-replay
105+
// ___PRODUCT_OPTION_START___ user-feedback
106+
Sentry.feedbackIntegration({
107+
// Additional SDK configuration goes in here, for example:
108+
colorScheme: "system",
109+
}),
110+
// ___PRODUCT_OPTION_END___ user-feedback
105111
],
106112
// ___PRODUCT_OPTION_START___ performance
107113

@@ -156,6 +162,12 @@ Sentry.init({
156162
// which automatically captures Session Replays
157163
Sentry.replayIntegration(),
158164
// ___PRODUCT_OPTION_END___ session-replay
165+
// ___PRODUCT_OPTION_START___ user-feedback
166+
Sentry.feedbackIntegration({
167+
// Additional SDK configuration goes in here, for example:
168+
colorScheme: "system",
169+
}),
170+
// ___PRODUCT_OPTION_END___ user-feedback
159171
],
160172
// ___PRODUCT_OPTION_START___ performance
161173

docs/platforms/javascript/guides/astro/index.mdx

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,9 @@ Non-Node runtimes, like Vercel's Edge runtime or Cloudflare Pages, are currently
2626

2727
## Install
2828

29-
<OnboardingOptionButtons options={["error-monitoring", "performance", "profiling", "session-replay"]} />
29+
<OnboardingOptionButtons options={["error-monitoring", "performance", "profiling", "session-replay", "user-feedback"]} />
3030

31-
Sentry captures data by using an SDK within your applications runtime.
31+
Sentry captures data by using an SDK within your application's runtime.
3232

3333
Install the SDK by using the `astro` CLI:
3434

@@ -112,6 +112,12 @@ Sentry.init({
112112
// ___PRODUCT_OPTION_START___ session-replay
113113
Sentry.replayIntegration(),
114114
// ___PRODUCT_OPTION_END___ session-replay
115+
// ___PRODUCT_OPTION_START___ user-feedback
116+
Sentry.feedbackIntegration({
117+
// Additional SDK configuration goes in here, for example:
118+
colorScheme: "system",
119+
}),
120+
// ___PRODUCT_OPTION_END___ user-feedback
115121
],
116122
// ___PRODUCT_OPTION_START___ performance
117123

docs/platforms/javascript/guides/capacitor/index.mdx

Lines changed: 32 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,9 @@ Select which Sentry features you'd like to install in addition to Error Monitori
1616

1717
## Install
1818

19-
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay"]} />
19+
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay", "user-feedback"]} />
2020

21-
Sentry captures data by using an SDK within your applications runtime.
21+
Sentry captures data by using an SDK within your application's runtime.
2222

2323
Install the Sentry Capacitor SDK alongside the corresponding Sentry SDK for the framework you're using:
2424

@@ -130,6 +130,12 @@ Sentry.init(
130130
// which automatically captures Session Replays
131131
Sentry.replayIntegration(),
132132
// ___PRODUCT_OPTION_END___ session-replay
133+
// ___PRODUCT_OPTION_START___ user-feedback
134+
Sentry.feedbackIntegration({
135+
// Additional SDK configuration goes in here, for example:
136+
colorScheme: "system",
137+
}),
138+
// ___PRODUCT_OPTION_END___ user-feedback
133139
],
134140
// ___PRODUCT_OPTION_START___ performance
135141

@@ -209,6 +215,12 @@ Sentry.init(
209215
// which automatically captures Session Replays
210216
new Sentry.Replay(),
211217
// ___PRODUCT_OPTION_END___ session-replay
218+
// ___PRODUCT_OPTION_START___ user-feedback
219+
Sentry.feedbackIntegration({
220+
// Additional SDK configuration goes in here, for example:
221+
colorScheme: "system",
222+
}),
223+
// ___PRODUCT_OPTION_END___ user-feedback
212224
],
213225

214226
// ___PRODUCT_OPTION_START___ performance
@@ -285,6 +297,12 @@ Sentry.init(
285297
// which automatically captures Session Replays
286298
Sentry.replayIntegration(),
287299
// ___PRODUCT_OPTION_END___ session-replay
300+
// ___PRODUCT_OPTION_START___ user-feedback
301+
Sentry.feedbackIntegration({
302+
// Additional SDK configuration goes in here, for example:
303+
colorScheme: "system",
304+
}),
305+
// ___PRODUCT_OPTION_END___ user-feedback
288306
],
289307
// ___PRODUCT_OPTION_START___ performance
290308

@@ -345,6 +363,12 @@ Sentry.init(
345363
// which automatically captures Session Replays
346364
Sentry.replayIntegration(),
347365
// ___PRODUCT_OPTION_END___ session-replay
366+
// ___PRODUCT_OPTION_START___ user-feedback
367+
Sentry.feedbackIntegration({
368+
// Additional SDK configuration goes in here, for example:
369+
colorScheme: "system",
370+
}),
371+
// ___PRODUCT_OPTION_END___ user-feedback
348372
],
349373
// ___PRODUCT_OPTION_START___ performance
350374

@@ -402,6 +426,12 @@ Sentry.init(
402426
// which automatically captures Session Replays
403427
Sentry.replayIntegration(),
404428
// ___PRODUCT_OPTION_END___ session-replay
429+
// ___PRODUCT_OPTION_START___ user-feedback
430+
Sentry.feedbackIntegration({
431+
// Additional SDK configuration goes in here, for example:
432+
colorScheme: "system",
433+
}),
434+
// ___PRODUCT_OPTION_END___ user-feedback
405435
],
406436
// ___PRODUCT_OPTION_START___ performance
407437

docs/platforms/javascript/guides/electron/index.mdx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ Select which Sentry features you'd like to install in addition to Error Monitori
1717

1818
## Install
1919

20-
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay"]} />
20+
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay", "user-feedback"]} />
2121

2222
```bash {tabTitle:npm}
2323
npm install @sentry/electron --save
@@ -61,6 +61,12 @@ Sentry.init({
6161
// ___PRODUCT_OPTION_START___ session-replay
6262
Sentry.replayIntegration(),
6363
// ___PRODUCT_OPTION_END___ session-replay
64+
// ___PRODUCT_OPTION_START___ user-feedback
65+
Sentry.feedbackIntegration({
66+
// Additional SDK configuration goes in here, for example:
67+
colorScheme: "system",
68+
}),
69+
// ___PRODUCT_OPTION_END___ user-feedback
6470
],
6571
// ___PRODUCT_OPTION_START___ performance
6672

docs/platforms/javascript/guides/ember/index.mdx

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,9 @@ Select which Sentry features you'd like to install in addition to Error Monitori
2424

2525
## Install
2626

27-
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay"]} />
27+
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay", "user-feedback"]} />
2828

29-
Sentry captures data by using an SDK within your applications runtime.
29+
Sentry captures data by using an SDK within your application's runtime.
3030

3131
<PlatformContent includePath="getting-started-install" />
3232

@@ -52,7 +52,15 @@ Sentry.init({
5252
sendDefaultPii: true,
5353

5454
// ___PRODUCT_OPTION_START___ session-replay
55-
integrations: [Sentry.replayIntegration()],
55+
integrations: [
56+
Sentry.replayIntegration(),
57+
// ___PRODUCT_OPTION_START___ user-feedback
58+
Sentry.feedbackIntegration({
59+
// Additional SDK configuration goes in here, for example:
60+
colorScheme: "system",
61+
}),
62+
// ___PRODUCT_OPTION_END___ user-feedback
63+
],
5664
// ___PRODUCT_OPTION_END___ session-replay
5765
// ___PRODUCT_OPTION_START___ performance
5866

docs/platforms/javascript/guides/gatsby/index.mdx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ Select which Sentry features you'd like to install in addition to Error Monitori
1515

1616
## Install
1717

18-
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay"]} />
18+
<OnboardingOptionButtons options={["error-monitoring", "performance", "session-replay", "user-feedback"]} />
1919

2020
To use Sentry with your Gatsby application, you will need to use `@sentry/gatsby` (Sentry's Gatsby SDK):
2121

@@ -71,6 +71,12 @@ Sentry.init({
7171
// ___PRODUCT_OPTION_START___ session-replay
7272
Sentry.replayIntegration(),
7373
// ___PRODUCT_OPTION_END___ session-replay
74+
// ___PRODUCT_OPTION_START___ user-feedback
75+
Sentry.feedbackIntegration({
76+
// Additional SDK configuration goes in here, for example:
77+
colorScheme: "system",
78+
}),
79+
// ___PRODUCT_OPTION_END___ user-feedback
7480
],
7581
// ___PRODUCT_OPTION_START___ performance
7682

docs/platforms/javascript/guides/nextjs/manual-setup.mdx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ description: "Learn how to manually set up Sentry in your Next.js app and captur
1616
Choose the features you want to configure, and this guide will show you how:
1717

1818
<OnboardingOptionButtons
19-
options={["error-monitoring", "performance", "session-replay"]}
19+
options={["error-monitoring", "performance", "session-replay", "user-feedback"]}
2020
/>
2121

2222
<PlatformContent includePath="getting-started-features-expandable" />
@@ -122,7 +122,15 @@ Sentry.init({
122122
// ___PRODUCT_OPTION_END___ performance
123123
// ___PRODUCT_OPTION_START___ session-replay
124124
// Replay may only be enabled for the client-side
125-
integrations: [Sentry.replayIntegration()],
125+
integrations: [
126+
Sentry.replayIntegration(),
127+
// ___PRODUCT_OPTION_START___ user-feedback
128+
Sentry.feedbackIntegration({
129+
// Additional SDK configuration goes in here, for example:
130+
colorScheme: "system",
131+
}),
132+
// ___PRODUCT_OPTION_END___ user-feedback
133+
],
126134

127135
// Capture Replay for 10% of all sessions,
128136
// plus for 100% of sessions with an error

docs/platforms/javascript/guides/nuxt/manual-setup.mdx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ Add the following overrides:
5151
Choose the features you want to configure, and this guide will show you how:
5252

5353
<OnboardingOptionButtons
54-
options={["error-monitoring", "performance", "session-replay"]}
54+
options={["error-monitoring", "performance", "session-replay", "user-feedback"]}
5555
/>
5656

5757
<PlatformContent includePath="getting-started-features-expandable" />
@@ -103,7 +103,15 @@ Sentry.init({
103103
// ___PRODUCT_OPTION_START___ session-replay
104104

105105
// Replay may only be enabled for the client-side
106-
integrations: [Sentry.replayIntegration()],
106+
integrations: [
107+
Sentry.replayIntegration(),
108+
// ___PRODUCT_OPTION_START___ user-feedback
109+
Sentry.feedbackIntegration({
110+
// Additional SDK configuration goes in here, for example:
111+
colorScheme: "system",
112+
}),
113+
// ___PRODUCT_OPTION_END___ user-feedback
114+
],
107115
// ___PRODUCT_OPTION_END___ session-replay
108116
// ___PRODUCT_OPTION_START___ performance
109117

docs/platforms/javascript/guides/react-router/index.mdx

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,13 +25,14 @@ categories:
2525

2626
## Install
2727

28-
Sentry captures data by using an SDK within your applications runtime.
28+
Sentry captures data by using an SDK within your application's runtime.
2929

3030
<OnboardingOptionButtons
3131
options={[
3232
"error-monitoring",
3333
"performance",
3434
"session-replay",
35+
"user-feedback",
3536
{
3637
id: 'profiling',
3738
checked: false
@@ -103,6 +104,12 @@ Initialize the Sentry React SDK in your `entry.client.tsx` file:
103104
+ // ___PRODUCT_OPTION_START___ session-replay
104105
+ Sentry.replayIntegration(),
105106
+ // ___PRODUCT_OPTION_END___ session-replay
107+
+ // ___PRODUCT_OPTION_START___ user-feedback
108+
+ Sentry.feedbackIntegration({
109+
+ // Additional SDK configuration goes in here, for example:
110+
+ colorScheme: "system",
111+
+ }),
112+
+ // ___PRODUCT_OPTION_END___ user-feedback
106113
+ ],
107114
+ // ___PRODUCT_OPTION_START___ performance
108115
+

0 commit comments

Comments
 (0)