Cleaner Mobile Navigation: Fixing Misleading Badges on the Tenancies Tab
Cleaner Mobile Navigation: Fixing Misleading Badges on the Tenancies Tab
Release: v0.1.304
The Problem
On mobile, the bottom navigation bar is the primary way users move between the key areas of the platform: Dashboard, Tenancies, Deposits, and more. Every badge on that bar is a signal — something needs your attention, go here.
In v0.1.303 and earlier, the Tenancies tab carried a badge driven by the upcomingCheckOuts count. On the surface this seems reasonable — upcoming check-outs are related to tenancies. But in practice it created two distinct problems.
1. Badge duplication
The upcomingCheckOuts count wasn't exclusive to the Tenancies tab. The same number was already being shown on:
- The Deposit Releases navigation item
- The Tenancies item in the sidebar
This meant the same urgency signal was appearing in up to three places simultaneously, diluting its meaning and creating visual noise.
2. Wrong semantic meaning
A red badge on Tenancies implies something is wrong with a tenancy record — an overdue action, a compliance issue, something requiring direct intervention on the tenancy itself. An upcomingCheckOuts count doesn't mean that. It means a check-out report is approaching, which is an action best handled from the Dashboard work queue, not by drilling into a tenancy list.
The mismatch was particularly confusing because the Deposits tab correctly uses an amber badge for openDisputes — a genuinely deposit-scoped signal. The inconsistency across tabs made the navigation harder to trust.
What We Changed
The upcomingCheckOuts badge has been removed from the Tenancies mobile bottom tab in src/components/mobile-bottom-tabs.tsx.
The count itself hasn't gone anywhere — it remains surfaced in the Dashboard work queue, which is the correct place for urgency routing on mobile. Users who need to act on upcoming check-outs will see the signal on the Dashboard tab, which already functions as the command centre for time-sensitive tasks.
What Comes Next
This fix is the first step in a broader audit of badge semantics across the platform. The goal is a simple rule: each count appears in exactly one navigation location. Where a badge belongs should be determined by the semantic meaning of the action it represents, not by proximity to related data.
We're also evaluating whether the Tenancies tab should carry an overdueCheckOuts badge — representing the smaller, more urgent subset of check-outs that are already past due. Unlike upcomingCheckOuts, this would be a genuinely Tenancies-scoped signal with a clear call to action. That change will ship in a follow-up release once the broader badge audit is complete.
Summary of Changes
| Location | Before | After |
|---|---|---|
| Mobile — Tenancies tab | upcomingCheckOuts badge (red) | No badge |
| Mobile — Dashboard tab (work queue) | upcomingCheckOuts surfaced | upcomingCheckOuts surfaced ✓ |
| Mobile — Deposits tab | openDisputes badge (amber) | openDisputes badge (amber) — unchanged |
| Sidebar — Tenancies item | upcomingCheckOuts badge | No change in this release |
File changed: src/components/mobile-bottom-tabs.tsx