Hide key factors to 10% of logged out users

[cemreinanc]

Fixes #4168

• Added useShouldHideKeyFactors hook to determine visibility based on user authentication and feature flag.
• Updated KeyFactorsCommentSection, KeyFactorsQuestionConsumerSection, and KeyFactorsQuestionSection to conditionally render based on the new hook.
• Integrated the hook into KeyFactorsTileView to enhance user experience by hiding key factors for logged-out users when the feature flag is active.

Summary by CodeRabbit

• New Features
  • Implemented conditional visibility for key factors section based on user authentication status and feature testing, with potential impact on user experience for logged-out users.

[coderabbitai]

📝 Walkthrough

Walkthrough

This PR implements A/B testing for key factors visibility by introducing a new hook that checks if a user is logged out and if a PostHog feature flag variant is set to "hidden", then applies conditional rendering across four key factors components.

Changes

Cohort / File(s)	Summary
New A/B Testing Hook front_end/src/app/(main)/questions/[id]/components/key_factors/use_should_hide_key_factors.ts	Added new client-side hook that checks if user is logged out and if the logged_out_key_factors_variant flag is set to "hidden"; returns boolean for conditional rendering.
Key Factors Components front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_comment_section.tsx, key_factors_question_consumer_section.tsx, key_factors_question_section.tsx, questions_feed_view/key_factors_tile_view.tsx	Each component imports and uses the new hook, adding an early return to render null when shouldHideKeyFactors is true, effectively hiding the section for targeted users.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• Show key factors in prediction flow #4166: Modifies key_factors components and changes rendering logic for key factors visibility, suggesting parallel or complementary A/B testing changes.

Suggested reviewers

• hlbmtc
• elisescu

Poem

🐰 A banner of flags flies high today,
Hidden factors for some who stray,
Logged-out users get the A/B test,
While components render or take rest! ✨

🚥 Pre-merge checks | ✅ 4

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the main change: hiding key factors to logged out users via an A/B test.
Linked Issues check	✅ Passed	The PR implements all coding requirements from issue #4168: created useShouldHideKeyFactors hook, integrated it across feed, question pages, and comments components.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to the linked issue requirements; no unrelated modifications detected in the PR.

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

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch 4168-guest-key-factors-experiment

---

📜 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 0cbacbe and 8eb54f0.

📒 Files selected for processing (5)

• front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_comment_section.tsx
• front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_question_consumer_section.tsx
• front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_question_section.tsx
• front_end/src/app/(main)/questions/[id]/components/key_factors/questions_feed_view/key_factors_tile_view.tsx
• front_end/src/app/(main)/questions/[id]/components/key_factors/use_should_hide_key_factors.ts

🧰 Additional context used

🧬 Code graph analysis (4)

front_end/src/app/(main)/questions/[id]/components/key_factors/questions_feed_view/key_factors_tile_view.tsx (1)

front_end/src/app/(main)/questions/[id]/components/key_factors/use_should_hide_key_factors.ts (1)

• useShouldHideKeyFactors (10-20)

front_end/src/app/(main)/questions/[id]/components/key_factors/use_should_hide_key_factors.ts (1)

front_end/src/contexts/auth_context.tsx (1)

• useAuth (60-60)

front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_question_section.tsx (1)

front_end/src/app/(main)/questions/[id]/components/key_factors/use_should_hide_key_factors.ts (1)

• useShouldHideKeyFactors (10-20)

front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_comment_section.tsx (1)

front_end/src/app/(main)/questions/[id]/components/key_factors/use_should_hide_key_factors.ts (1)

• useShouldHideKeyFactors (10-20)

⏰ 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 / Build Docker Image
• GitHub Check: Frontend Checks
• GitHub Check: integration-tests
• GitHub Check: Backend Checks

🔇 Additional comments (5)

front_end/src/app/(main)/questions/[id]/components/key_factors/use_should_hide_key_factors.ts (1)

10-20: LGTM! Clean and focused hook implementation.

The logic correctly handles the requirement: hiding key factors only for logged-out users (isNil(user)) when the feature flag variant is explicitly "hidden". The implicit handling of the loading state (when flagVariant is undefined or null) is correct—key factors remain visible until the flag explicitly returns "hidden".

front_end/src/app/(main)/questions/[id]/components/key_factors/questions_feed_view/key_factors_tile_view.tsx (1)

32-32: LGTM! Correct hook integration.

The hook is called unconditionally at the component's top level, and the early return is correctly placed after all other hooks (useState, useContext, useMemo, useEffect, useCallback). This maintains proper React hook call order.

Also applies to: 69-69, 215-216

front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_question_consumer_section.tsx (1)

12-12: LGTM! Proper hook placement.

The hook is called after other hooks but before any early returns or conditional logic, maintaining correct React hook semantics. The early return at line 34 correctly comes after the useTopKeyFactorsCarouselItems hook call.

Also applies to: 27-27, 34-35

front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_comment_section.tsx (1)

9-9: LGTM! Correct integration with existing logic.

The hook is properly placed after all other hook calls, and the combined condition (keyFactors.length === 0 || shouldHideKeyFactors) correctly handles both the empty state and the A/B test condition. The comment accurately describes both exit conditions.

Also applies to: 36-36, 43-46

front_end/src/app/(main)/questions/[id]/components/key_factors/key_factors_question_section.tsx (1)

21-21: LGTM! Proper hook ordering maintained.

The hook is called within the hook block (lines 41-76), and the early return is correctly placed after all hooks (useTranslations, useAuth, useQuestionLayout, useCommentsFeed, useShouldHideKeyFactors, useCoherenceLinksContext, useMemo, useTopKeyFactorsCarouselItems, useEffect). This ensures consistent hook call order across renders.

Also applies to: 45-45, 78-79

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

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

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

[cemreinanc]

@ncarazon can you please check posthog variant setup to see if it's configured correctly?

[github-actions]

🧹 Preview Environment Cleaned Up

The preview environment for this PR has been destroyed.

Resource	Status
🌐 Preview App	✅ Deleted
🗄️ PostgreSQL Branch	✅ Deleted
⚡ Redis Database	✅ Deleted
🔧 GitHub Deployments	✅ Removed
📦 Docker Image	⚠️ Retained (auto-cleanup via GHCR policies)

---

Cleanup triggered by PR close at 2026-02-05T11:03:53Z

[ncarazon]

LGTM