feat: send content feedback plausible events

[a-hariti]

closes #11363

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
develop-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 27, 2025 11:44am
sentry-docs	🔄 Building (Inspect)	Visit Preview	💬 Add feedback	Jan 27, 2025 11:44am

1 Skipped Deployment

Name	Status	Preview	Comments	Updated (UTC)
changelog	⬜️ Ignored (Inspect)	Visit Preview		Jan 27, 2025 11:44am

[codecov]

Bundle Report

Changes will increase total bundle size by 21.24kB (0.11%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
sentry-docs-server-cjs	10.39MB	14.8kB (0.14%) ⬆️
sentry-docs-client-array-push	9.31MB	6.45kB (0.07%) ⬆️

View changes by path for bundle: sentry-docs-server-cjs

File path	Size	Change
/[[...path]]	514.38kB	80 bytes (0.02%)
/platform-redirect	31.08kB	80 bytes (0.26%)

[chargome]

Should we maybe move this somewhere into the "Help improve this content" section below the navigation buttons?

[a-hariti]

I thought about it, but I think it's more useful to be immediately next to the content, also it's very compact

[chargome]

Generally looks good to me, left some comments!

I'll also need to set up the custom plausible event before merging this.

Let's also get feedback from @stephanie-anderson on this one

[stephanie-anderson]

General feedback from the preview so far:

User Feedback

We should definitely provide feedback on each interactive element, as soon as users interact with it. So for example, when someone presses "Yes" or "No", we should let the user know that the system actually did something (which is currently not the case for "Yes").

There are other examples out there that work like this preview (stripe, mintlify), but they too are lacking a feedback component.

Placing

We should think about the proper placing of this element again. Was this a conscious decision to put it above the page navigation buttons on the bottom? I'm torn, but I do like how Next.js is handling it. What I like about it is that this visual element is easily distinguishable from the rest, it's subtle but still eye-catching. And bonus: it offers a range of options.

Getting Feedback for "Yes" as well

Again something that is really nice about the Next.js docs, they always ask for feedback, regardless of the user's selection. What I also like about it is the subtlety of the textarea. It's not a modal, it's tiny. I think this could positively influence how willingly users are to providing a feedback message. Modal feels like a form they have to fill out. This little box though seems "manageable" and doesn't interrupt the users flow (of setting up Sentry for their app) so much.

The form is only submittable once

We should make that visible to the user, by no longer showing the voting options. Instead we could let the users know that their feedback has been submitted, and remove the buttons.

Styles

If we stick with the modal, we need to address the contrast issues for the primary button:

Text-heaviness

We need to shorten the wording on the modal (if it stays). "Help us improve", "What could we improve" etc is redundant, we should try to make it as sharp and short as possible. Same goes for the confirmation step of the modal.

edit: only read now that @chargome raised some of these issues as well

[a-hariti]

looks like Mintlify suffers from the same lack of feedback problem and it's ripe for rage clicks

should we collect positive feedback for now? @stephanie-anderson

[stephanie-anderson]

@a-hariti yes, I'd say let's collect additional feedback on all of the options we offer (even if that's just these two at the moment)

[stephanie-anderson]

Wow, I like the changes you've done, @a-hariti !

Additional feedback now is, that I would increase the spacing between the next/previous nav and the feedback a little bit

We could also test with

• making the question bold(er)
• aligning the border radius to the other visual elements, like the next/previous nav buttons
• aligning the font size of question and options
• maybe remove too much horizontal padding between options, and options/question
• I also played around with emojis, for me personally, the thumbs up/down make most sense (and are the easiest to identify with a smaller font size)

🙏

[stephanie-anderson]

what's the best way to capture the positive/negative flag along with the user comment? one of these?

Sentry.setExtra('battery', 0.7);
Sentry.setTag('user_mode', 'admin');

@chargome @stephanie-anderson

@a-hariti I would go for setTag, cause tags are able to be searched for, whereas context (previously setExtra) is not