feat(bar-app): tune density and add spend chart style toggle

Narrow the dropdown (380 to 360) and give it more vertical room (620 to 700).
Tighten the subscription cards (less spacing/padding) since they carry only a
few window rows. Make the spend chart taller (18 to 30) and let the user pick
its style in Settings: chunk bars (default) or a line graph with a subtle area
fill. Persist the choice in UserDefaults.
This commit is contained in:
Tam Nhu Tran committed 2026-06-09 17:06:33 -04:00
1 parent b9a4a4a3a4
commit 0b1c4e4908
8 files changed
+187 -27

No files matched your search

@@ -19,6 +19,9 @@ struct BarAnalyticsView: View {
/// top-models detail placed below the pool accounts.
enum Section { case spend, breakdown }
var section: Section = .spend
/// Controls whether the spend sparkline renders as bars or a line graph.
/// Passed in by BarMenuView so it reflects the user's persisted choice live.
var spendChartStyle: SpendChartStyle = .bars
private var lastActive: String? {
BarFormatting.lastActiveLabel(
@@ -74,8 +77,10 @@ struct BarAnalyticsView: View {
.font(.caption2)
.foregroundStyle(.secondary)
if !sparklineIsEmpty {
Sparkline(values: analytics.byDay.map(\.cost), accent: theme.accent)
.frame(height: 18)
// height: 30 (up from 18) so daily spend gradations are clearly readable.
Sparkline(values: analytics.byDay.map(\.cost), accent: theme.accent,
style: spendChartStyle)
.frame(height: 30)
}
} else {
Text(idleCaption)