Chapter 15: Subscription Billing

[Gotcha1001]

Summary by CodeRabbit

Release Notes

• New Features
  • Added new pricing page with subscription plan information.
  • Implemented tiered chapter access: chapters beyond the second now display a Pro badge and require premium membership.
  • Updated exercise access based on subscription level—free members can access the first two chapters' exercises, while Pro members can access all content.

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

[coderabbitai]

Caution

Review failed

The pull request is closed.

Walkthrough

The PR integrates Clerk authentication across three components to gate course content based on user plan type. CourseChapters now shows a "Pro" badge for restricted chapters and limits exercise access. UpgradeToPro displays conditionally based on plan access. A new pricing page is added using Clerk's PricingTable component.

Changes

Cohort / File(s)	Summary
Plan-based access control app/(routes)/courses/[courseId]/_components/CourseChapters.tsx, app/(routes)/dashboard/_components/UpgradeToPro.tsx	Integrated Clerk authentication via useAuth hook to determine hasUnlimitedAccess. CourseChapters now conditionally displays a "Pro" badge for chapters beyond the 2nd when user lacks unlimited access. Exercise access gated by plan type: enrolled non-unlimited users can access only first two chapters' exercises; unlimited users retain full exercise access; others see enrollment tooltip. UpgradeToPro renders conditionally only when user lacks unlimited access.
Pricing page app/(routes)/pricing/page.tsx	New route component that renders a Pricing section with title, subtitle, and Clerk's PricingTable component.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

• CourseChapters.tsx requires careful attention to validate the plan-based exercise access gating logic and Pro badge conditional rendering across different user states
• UpgradeToPro.tsx conditional rendering logic should be verified against authentication state
• Ensure Clerk authentication integration (useAuth hook) is correctly wired in both modified components

Possibly related PRs

• PR #9: Modifies CourseChapters.tsx to refactor exercise navigation and completion tracking logic; may conflict or complement the exercise access gating changes introduced here
• PR #4: Updates the existing UpgradeToPro component with Clerk auth usage; introduces the same component now modified in this PR
• PR #6: Introduces the initial CourseChapters.tsx component that is now extended with Clerk-based plan access logic

Poem

🐰 A rabbit hops through chapters bright,
With "Pro" badges shining in the light,
Clerk auth gates the coding quest,
Unlimited plans pass every test,
Pricing pages hop on by,
Under the subscription sky!

✨ 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 Chapter-15-Subscription-Billing

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 7391618 and 10c95cb.

📒 Files selected for processing (3)

• app/(routes)/courses/[courseId]/_components/CourseChapters.tsx (3 hunks)
• app/(routes)/dashboard/_components/UpgradeToPro.tsx (1 hunks)
• app/(routes)/pricing/page.tsx (1 hunks)

---

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.}