docs icon indicating copy to clipboard operation
docs copied to clipboard

[WEB-4688] Add PostHog feedback integration to Footer

Open jamiehenson opened this issue 1 month ago • 1 comments

Summary

  • Added PostHog feedback survey integration to the Footer component
  • Implemented feedback form submission that sends data to PostHog surveys
  • Added environment variable configuration for PostHog feedback survey name

Changes

Configuration

  • Added POSTHOG_FEEDBACK_SURVEY_NAME environment variable
  • Updated Gatsby config to expose the survey name through site metadata
  • Wrapped app with PostHogProvider in gatsby-browser.tsx

Footer Component

  • Integrated PostHog's survey functionality using usePostHog hook
  • Added state management for feedback text, submission status, and survey data
  • Implemented survey fetching and feedback submission handlers
  • Added success message display after submission
  • Connected textarea and button to PostHog submission flow

Implementation Details

The implementation follows the same pattern as the website repo's Feedback component in HeaderButtons.tsx, ensuring consistency across projects.

When a user:

  1. Clicks Yes/No/Feedback buttons
  2. Optionally enters feedback text
  3. Clicks "Send feedback"

The feedback is submitted to PostHog under the configured survey name with the appropriate response data.

Testing

To test this PR:

  1. Set POSTHOG_FEEDBACK_SURVEY_NAME environment variable to match a survey created in PostHog
  2. Ensure POSTHOG_API_KEY and POSTHOG_API_HOST are configured
  3. Navigate to any docs page
  4. Use the feedback form in the footer
  5. Verify submissions appear in PostHog

🤖 Generated with Claude Code

jamiehenson avatar Nov 18 '25 11:11 jamiehenson

[!IMPORTANT]

Review skipped

Auto reviews are disabled on this repository.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

✨ Finishing touches
🧪 Generate unit tests (beta)
  • [ ] Create PR with unit tests
  • [ ] Post copyable unit tests in a comment
  • [ ] Commit unit tests in branch web-4688-footer

Comment @coderabbitai help to get the list of available commands and usage tips.

coderabbitai[bot] avatar Nov 18 '25 11:11 coderabbitai[bot]

Woops @aralovelace you shouldn't see the feedback unit - it's supposed to be hidden in this PR as the wider purpose of it is still undecided. I toggled it on to take a screenshot and accidentally committed it. Updated that now.

As for the "Edit on Github" bit, it's situational, you'll only get it on the (I guess you could call them) standard docs pages like this. You won't get it on the homepage for instance as we don't want to invite people to edit that on Github. There could be a "last updated" field as well, but that data isn't actually available anywhere atm.

As for the wideness, it's a good point - this is part of some Jamie W feedback as well and will be addressed once all these base pieces are in place.

jamiehenson avatar Nov 27 '25 15:11 jamiehenson