Cleaner Wayfinding: Fixing the Billing Tab That Wasn't Really a Tab
Cleaner Wayfinding: Fixing the Billing Tab That Wasn't Really a Tab
Release v0.1.123 — Settings & Navigation
Good navigation should feel obvious. When you click a tab, you expect to stay on the page and see a new panel of content. When you click a sidebar link, you expect to go somewhere new. In v0.1.123 we fixed a case where those two patterns were blurred — and it was quietly making the Settings page harder to use.
What was happening
The Settings page has a tab bar at the top — General, Organization, Team, and so on. Billing was listed there too, with a small → arrow next to it. That arrow was a hint that something was off: clicking it didn't reveal a tab panel, it navigated you away from Settings entirely, dropping you on the standalone Billing page.
At the same time, Billing already had its own dedicated entry in the Admin section of the sidebar.
The result was two paths to the same destination, with no clear signal about which one was "correct" — and a settings tab bar that broke its own interaction contract.
What changed
The pseudo-tab is gone
The Billing item has been removed from the settings tab bar. Every tab in that bar now behaves like a tab: it renders content inline, without leaving the page.
A contextual card in Organization settings
For users who naturally land in Settings → Organization and want to review or change their plan, there is now a Billing & Plan card at the bottom of that tab. It provides a brief description and a clear CTA button that takes you to the Billing page. This keeps the link discoverable in context without polluting the tab bar.
The sidebar remains canonical
The Admin → Billing sidebar item was always the intended primary entry point. It continues to serve that role, unambiguously, for anyone navigating from the main dashboard structure.
The rule this enforces
Tabs are for in-page content switching. Links are for navigation. Don't mix them.
If Billing content ever needs to be embedded directly inside Settings in the future, the right approach is to bring the billing component into a proper tab panel — not to use a link styled as a tab.
Summary
| Before | After | |
|---|---|---|
| Billing in tab bar | ✅ Present (as a <Link>) | ❌ Removed |
| Billing in sidebar | ✅ Present | ✅ Present (canonical) |
| Billing CTA in Organization tab | ❌ Absent | ✅ Added as a card |
| Tab bar contract | ⚠️ Broken by one pseudo-tab | ✅ All tabs render panels |
Affected file: src/app/dashboard/settings/settings-tabs.tsx