Link to team billing page in faucet button on free plan

[MananTank]

---

PR-Codex overview

This PR enhances the FaucetButton component by introducing a new condition to handle cases where a paid plan is required to access the faucet. It provides a link to upgrade the plan if the user is on a free plan.

Detailed summary

• Added a check for canClaimFaucetQuery.data.type being "paid-plan-required".
• If true, renders a button linking to the billing page with an upgrade message.
• Removed a TODO comment regarding upsell paths for subscription plans.
• Cleaned up the conditional rendering logic for the button.

✨ Ask PR-Codex anything about this PR by commenting with /codex {your question}

Summary by CodeRabbit

• New Features
  • Enhanced faucet button for paid-plan scenarios: when claiming is blocked by plan limits, the button now links directly to billing/subscription management and shows an inline arrow indicator for a clearer, actionable path.
• Bug Fixes
  • Preserved existing disabled states for throttle and unsupported-chain cases to avoid regressions.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 8f74c85

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
thirdweb-www	Error			Nov 18, 2025 4:58pm

4 Skipped Deployments

Project	Deployment	Preview	Comments	Updated (UTC)
docs-v2	Skipped			Nov 18, 2025 4:58pm
nebula	Skipped			Nov 18, 2025 4:58pm
thirdweb_playground	Skipped			Nov 18, 2025 4:58pm
wallet-ui	Skipped			Nov 18, 2025 4:58pm

[coderabbitai]

Walkthrough

When canClaimFaucetQuery indicates paid-plan-required, FaucetButton now renders an upsell button linking to the billing page with an inline arrow icon, short-circuiting the previous disabled-button path and removing the prior inline availability message and TODO comment; other disabled cases unchanged.

Changes

Cohort / File(s)	Summary
FaucetButton Enhancement apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx	Added ArrowUpRightIcon import. When canClaim === false and type === "paid-plan-required", render an upsell button linking to /billing with an inline arrow icon (short-circuits prior disabled-button rendering). Removed the inline "availability on Starter/Growth/Scale/Pro" message and a TODO comment. Throttle and unsupported-chain disabled-button branches remain.

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant FaucetButton
  participant BillingPage as "/billing"

  User->>FaucetButton: Click / interact
  FaucetButton->>FaucetButton: Evaluate canClaimFaucetQuery.data
  alt paid-plan-required
    FaucetButton->>User: Render upsell button (arrow icon)
    User->>BillingPage: Follow link -> /billing
  else other disabled reasons (throttle/unsupported)
    FaucetButton->>User: Render disabled button with reason
  end

Loading

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

• Files to check closely:
  • apps/.../FaucetButton.tsx — ensure link URL, accessibility attributes, and icon import are correct.

Pre-merge checks and finishing touches

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run @coderabbitai generate docstrings to improve docstring coverage.
Description check	❓ Inconclusive	The description includes a PR-Codex overview covering the main changes, but it lacks the recommended template format with title prefix, Linear issue tag, explicit reviewer notes section, and testing instructions.	Consider following the repository template more closely: add title prefix format, include Linear issue tag (TEAM-XXXX), provide explicit 'Notes for the reviewer' section, and document how to test the changes.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly and concisely describes the main change: adding a link to the team billing page in the faucet button for free plan users.

✨ 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 11-18-link_to_team_billing_page_in_faucet_button_on_free_plan

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 588ea30 and 8f74c85.

📒 Files selected for processing (1)

• apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx (2 hunks)

🧰 Additional context used

🧠 Learnings (3)

📓 Common learnings

Learnt from: jnsdls
Repo: thirdweb-dev/js PR: 7888
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/payments/page.tsx:77-81
Timestamp: 2025-08-20T10:35:18.543Z
Learning: The webhooks/payments route exists at apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/payments/page.tsx and was added as part of the unified project layout PR #7888.

📚 Learning: 2025-07-07T21:21:47.488Z

Learnt from: saminacodes
Repo: thirdweb-dev/js PR: 7543
File: apps/portal/src/app/pay/page.mdx:4-4
Timestamp: 2025-07-07T21:21:47.488Z
Learning: In the thirdweb-dev/js repository, lucide-react icons must be imported with the "Icon" suffix (e.g., ExternalLinkIcon, RocketIcon) as required by the new linting rule, contrary to the typical lucide-react convention of importing without the suffix.

Applied to files:

• apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx

📚 Learning: 2025-07-31T16:17:42.753Z

Learnt from: MananTank
Repo: thirdweb-dev/js PR: 7768
File: apps/playground-web/src/app/navLinks.ts:1-1
Timestamp: 2025-07-31T16:17:42.753Z
Learning: Configuration files that import and reference React components (like icon components from lucide-react) need the "use client" directive, even if they primarily export static data, because the referenced components need to be executed in a client context when used by other client components.

Applied to files:

• apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx

⏰ 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). (5)

• GitHub Check: E2E Tests (pnpm, esbuild)
• GitHub Check: E2E Tests (pnpm, vite)
• GitHub Check: Size
• GitHub Check: Lint Packages
• GitHub Check: Analyze (javascript)

🔇 Additional comments (2)

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/client/FaucetButton.tsx (2)

6-6: LGTM! Icon import follows the correct pattern.

The import correctly uses the "Icon" suffix as required by the project's linting rules for lucide-react.

---

196-209: The implementation is correct and no changes are needed.

The /team/~/~/billing route is an intentional pattern in this codebase where ~ is used as a literal directory segment to represent a fallback or default team context. The route physically exists at apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/billing/page.tsx. Since the FaucetButton component exists in the chain context (not team/project context) and receives no team or project information as props, using this fallback path is the correct and expected behavior.

Warning

Review ran into problems

🔥 Problems

Errors were encountered while retrieving linked issues.

Errors (1)

• TEAM-0000: Entity not found: Issue - Could not find referenced Issue.

---

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

[MananTank]

• [PRO-106] Dashboard: Update Bridge stats #8430
• Link to team billing page in faucet button on free plan #8429 👈 (View in Graphite)
• main

---

How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

• merge-queue - adds this PR to the back of the merge queue
• hotfix - for urgent hot fixes, skip the queue and merge this PR next

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has enabled the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 54.83%. Comparing base (73c924b) to head (8f74c85).

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #8429   +/-   ##
=======================================
  Coverage   54.83%   54.83%           
=======================================
  Files         919      919           
  Lines       60865    60865           
  Branches     4141     4141           
=======================================
  Hits        33373    33373           
  Misses      27390    27390           
  Partials      102      102           

Flag	Coverage Δ
packages	54.83% <ø> (ø)

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[github-actions]

size-limit report 📦

Path	Size
@thirdweb-dev/nexus (esm)	104.88 KB (0%)
@thirdweb-dev/nexus (cjs)	316.6 KB (0%)

[graphite-app]

Merge activity

• Nov 18, 4:50 PM UTC: MananTank added this pull request to the Graphite merge queue.
• Nov 18, 4:58 PM UTC: The Graphite merge queue couldn't merge this PR because it was not satisfying all requirements (Failed CI: 'Vercel – thirdweb-www').