Replace the contact us dialog with a Posthog survey

[elisescu]

Summary by CodeRabbit

• UI/UX Updates

  • Feedback button icon changed from a paper plane to comment dots for clearer affordance
  • Feedback button now reports clicks for engagement tracking (added stable identifier)

• Chores

  • Updated analytics-related dependencies to newer versions

• Tests

  • Tightened iframe-related tests with more granular assertions for robustness

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[coderabbitai]

📝 Walkthrough

Walkthrough

Updated PostHog dependencies and replaced the feedback button's modal behavior with a PostHog click event; the feedback icon changed from a paper plane to comment dots. A test was relaxed to assert iframe attributes rather than exact HTML string.

Changes

Cohort / File(s)	Summary
Dependency Updates front_end/package.json	Bumped posthog-js from ^1.181.0 to ^1.325.0 and posthog-node from ^4.2.1 to ^5.21.0.
UI Component front_end/src/app/(main)/(home)/components/feedback_float.tsx	Removed useModal usage and modal-open logic; added PostHog tracking (posthog.capture("feedback_float_clicked")) on button click; replaced faPaperPlane with faCommentDots; added id="feedback-float" to the button.
Tests front_end/src/components/markdown_editor/__tests__/helpers.test.ts	Relaxed iframe assertion: replaced exact HTML string check with granular assertions for iframe existence and attributes (src, width, height, closing tag).

Sequence Diagram(s)

(omitted)

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 I hopped to the float with a curious sigh,
I swapped out a plane for a chatty dot sky,
Now each tiny click sends a PostHog hello,
Counting soft questions as breezes that blow. ✨🐇

🚥 Pre-merge checks | ✅ 1 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Title check	⚠️ Warning	The PR title states 'Replace the contact us dialog with a Posthog survey', but the actual changes update PostHog dependencies, replace a feedback float icon/behavior, and refactor test assertions. The title does not accurately describe these changes.	Update the title to reflect the actual changes, such as 'Update PostHog dependencies and refactor feedback float tracking' or similar to accurately represent the modifications made.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

• 📝 Generate docstrings

---

🧹 Recent nitpick comments

front_end/src/components/markdown_editor/__tests__/helpers.test.ts (1)

387-391: Bind iframe attribute assertions to a single element.
Multiple toContain checks can pass even if attributes come from different tags or multiple iframes. Consider a single regex with lookaheads to ensure one <iframe> contains all required attributes.

💡 Example assertion

-      expect(result).toContain("<iframe");
-      expect(result).toContain('src="https://example.com"');
-      expect(result).toContain('width="560"');
-      expect(result).toContain('height="315"');
-      expect(result).toContain("</iframe>");
+      expect(result).toMatch(
+        /<iframe\b(?=[^>]*\bsrc="https:\/\/example\.com")(?=[^>]*\bwidth="560")(?=[^>]*\bheight="315")[^>]*><\/iframe>/
+      );

front_end/src/app/(main)/(home)/components/feedback_float.tsx (1)

8-14: Optional: Use optional chaining for consistency with defensive patterns in the codebase.

Since posthog_page_view.tsx checks for posthog before use, consider the same pattern here for consistency:

🔧 Suggested refactor

-      onClick={() => posthog.capture("feedback_float_clicked")}
+      onClick={() => posthog?.capture("feedback_float_clicked")}

The PostHogProvider is initialized at the app root, so the instance will be available, but this pattern aligns the codebase's defensive practices.

📜 Recent review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between ce33e27 and 251f3d3.

⛔ Files ignored due to path filters (1)

• front_end/package-lock.json is excluded by !**/package-lock.json

📒 Files selected for processing (3)

• front_end/package.json
• front_end/src/app/(main)/(home)/components/feedback_float.tsx
• front_end/src/components/markdown_editor/__tests__/helpers.test.ts

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (4)

• GitHub Check: Build Docker Image
• GitHub Check: Backend Checks
• GitHub Check: Frontend Checks
• GitHub Check: integration-tests

🔇 Additional comments (2)

front_end/src/app/(main)/(home)/components/feedback_float.tsx (1)

3-5: Icon swap + stable button id look good.
The new faCommentDots icon and id="feedback-float" are clear and should help with targeting/QA.

Also applies to: 16-18

front_end/package.json (1)

82-83: No breaking changes or API shifts are documented for posthog-js@1.325.0 (published Jan 16, 2026) or posthog-node@5.21.0. Both versions are confirmed as published releases, and existing initialization and capture patterns remain compatible. The dependency bumps are safe to proceed with.

_{✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.}

---

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

[github-actions]

🚀 Preview Environment

Your preview environment is ready!

Resource	Details
🌐 Preview URL	https://metaculus-pr-4116-posthogsurveys.fly.dev
📦 Docker Image	ghcr.io/metaculus/metaculus:posthogsurveys-7a90767
🗄️ PostgreSQL	NeonDB branch preview/pr-4116-posthogsurveys
⚡ Redis	Fly Redis mtc-redis-pr-4116-posthogsurveys

Details

• Commit: 7a90767221b099e4176953fde932b31fe6737c74
• Branch: posthogSurveys
• Fly App: metaculus-pr-4116-posthogsurveys

---

ℹ️ Preview Environment Info

Isolation:

• PostgreSQL and Redis are fully isolated from production
• Each PR gets its own database branch and Redis instance
• Changes pushed to this PR will trigger a new deployment

Limitations:

• Background workers and cron jobs are not deployed in preview environments
• If you need to test background jobs, use Heroku staging environments

Cleanup:

• This preview will be automatically destroyed when the PR is closed

[aseckin]

I just gave this a test run and submitting the default survey works as expected.

However I created another survey, and chose the 'predict' event as the trigger. This didn't work on the platform, as in it didn't pop the survey out when I made a prediction