Private
Public Access
1
0

Limit dashboard spending to top 10 categories and fix nav double-highlight

Show top 10 categories in spending breakdown with label indicating the limit.
Fix account-scoped transactions highlighting both Accounts and Transactions
nav items by excluding sub-route match when account-transactions is active.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Catherine Renelle
2026-02-15 15:59:27 -05:00
parent d5c90a9197
commit dc4fd692ba
3 changed files with 4 additions and 3 deletions
+2 -2
View File
@@ -159,10 +159,10 @@ const navItems = [
function isNavActive(navRoute: string) {
if (route.path === navRoute) return true
// Highlight parent nav for sub-routes (e.g. /loans/:id highlights Loans)
if (navRoute !== '/' && route.path.startsWith(navRoute + '/')) return true
// Highlight "Transactions" when viewing account-scoped transactions
if (navRoute === '/transactions' && route.name === 'account-transactions') return true
// Highlight parent nav for sub-routes, but not when account-transactions takes priority
if (navRoute !== '/' && route.name !== 'account-transactions' && route.path.startsWith(navRoute + '/')) return true
return false
}
@@ -51,7 +51,7 @@
<v-col cols="12" md="6">
<v-card>
<v-card-title><v-icon class="mr-2">mdi-chart-pie</v-icon>Spending This Month</v-card-title>
<v-card-title><v-icon class="mr-2">mdi-chart-pie</v-icon>Spending This Month (Top 10 Categories)</v-card-title>
<v-card-text>
<div class="text-h5 mb-2">{{ formatCurrency(dashboard.spendingSummary.thisMonth) }}</div>
<div class="text-caption" :class="dashboard.spendingSummary.changePercent <= 0 ? 'text-success' : 'text-error'">