spinner feedback to ui
This commit is contained in:
davmar
@@ -12,6 +12,7 @@ import '../providers/bank_provider.dart';
|
||||
import '../providers/preferences_provider.dart';
|
||||
import '../providers/tx_meta_provider.dart';
|
||||
import '../utils/app_theme.dart';
|
||||
import '../utils/deferred_tab_work.dart';
|
||||
import '../utils/helpers.dart';
|
||||
import '../utils/navigation.dart';
|
||||
import '../utils/tx_calendar.dart';
|
||||
@@ -28,6 +29,36 @@ import 'transactions_screen.dart';
|
||||
const _kIncomeColor = AppTheme.accent;
|
||||
const _kExpenseColor = AppTheme.expense;
|
||||
|
||||
class _FavouriteAgg {
|
||||
const _FavouriteAgg({
|
||||
required this.periods,
|
||||
required this.monthly,
|
||||
required this.labelSpend,
|
||||
required this.labelAmountByPeriod,
|
||||
});
|
||||
|
||||
final List<DateTime> periods;
|
||||
final Map<DateTime, _MonthBucket> monthly;
|
||||
final List<_LabelSpend> labelSpend;
|
||||
final Map<DateTime, Map<String, double>> labelAmountByPeriod;
|
||||
}
|
||||
|
||||
class _OverviewAggSnapshot {
|
||||
const _OverviewAggSnapshot({
|
||||
required this.periods,
|
||||
required this.monthly,
|
||||
required this.labelSpend,
|
||||
required this.labelAmountByPeriod,
|
||||
required this.favourites,
|
||||
});
|
||||
|
||||
final List<DateTime> periods;
|
||||
final Map<DateTime, _MonthBucket> monthly;
|
||||
final List<_LabelSpend> labelSpend;
|
||||
final Map<DateTime, Map<String, double>> labelAmountByPeriod;
|
||||
final Map<String, _FavouriteAgg> favourites;
|
||||
}
|
||||
|
||||
class OverviewScreen extends StatefulWidget {
|
||||
const OverviewScreen({super.key});
|
||||
|
||||
@@ -59,6 +90,7 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
/// Favourites charts view (vs full overview with history).
|
||||
bool _showFavouritesView = false;
|
||||
var _favouritesDefaultApplied = false;
|
||||
final _work = DeferredTabWork<_OverviewAggSnapshot>();
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
@@ -247,7 +279,15 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
if (ShellTabScope.of(context) != OverviewScreen.tabIndex) {
|
||||
final active = ShellTabScope.of(context) == OverviewScreen.tabIndex;
|
||||
if (!active) {
|
||||
if (_work.isLoading) {
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
if (!mounted) return;
|
||||
if (ShellTabScope.of(context) == OverviewScreen.tabIndex) return;
|
||||
_work.cancel();
|
||||
});
|
||||
}
|
||||
return const SizedBox.expand();
|
||||
}
|
||||
|
||||
@@ -268,6 +308,41 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
});
|
||||
}
|
||||
|
||||
final emptyLoading =
|
||||
bank.isLoading && bank.transactions.isEmpty && bank.balance == null;
|
||||
final needsData = bank.isLinked || bank.hasData;
|
||||
final displayedFavs = prefs.displayedOverviewFavourites;
|
||||
final cacheKey = Object.hash(
|
||||
meta.storeRevision,
|
||||
identityHashCode(bank.transactions),
|
||||
_showFavouritesView,
|
||||
_period,
|
||||
_metric,
|
||||
_cursor.year,
|
||||
Object.hashAll(_includedLabelIds),
|
||||
_labelFlow,
|
||||
_labelBarStyle,
|
||||
_labelInvertChart,
|
||||
Object.hashAll(displayedFavs.map((f) => f.id)),
|
||||
Object.hashAll(displayedFavs.map((f) => f.updatedAt)),
|
||||
);
|
||||
|
||||
if (needsData && !emptyLoading && !_work.readyFor(cacheKey)) {
|
||||
WidgetsBinding.instance.addPostFrameCallback((_) {
|
||||
if (!mounted) return;
|
||||
if (ShellTabScope.of(context) != OverviewScreen.tabIndex) return;
|
||||
_scheduleOverviewCompute(
|
||||
key: cacheKey,
|
||||
bank: bank,
|
||||
meta: meta,
|
||||
displayedFavs: displayedFavs,
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
final showSpinner =
|
||||
needsData && !emptyLoading && !_work.readyFor(cacheKey);
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: Text(_showFavouritesView ? 'Favourites' : 'Overview'),
|
||||
@@ -288,16 +363,107 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
body: RefreshIndicator(
|
||||
onRefresh: bank.refresh,
|
||||
child: ResponsiveBody(
|
||||
child: SkipBuildWhenCovered(
|
||||
builder: (context) => _showFavouritesView
|
||||
? _buildFavouritesBody(context, bank, meta, prefs)
|
||||
: _buildBody(context, bank, meta, prefs),
|
||||
),
|
||||
child: showSpinner
|
||||
? ListView(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
children: const [
|
||||
SizedBox(height: 120),
|
||||
LoadingView(message: 'Loading overview…'),
|
||||
],
|
||||
)
|
||||
: SkipBuildWhenCovered(
|
||||
builder: (context) => _showFavouritesView
|
||||
? _buildFavouritesBody(context, bank, meta, prefs)
|
||||
: _buildBody(context, bank, meta, prefs),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _scheduleOverviewCompute({
|
||||
required Object key,
|
||||
required BankController bank,
|
||||
required TxMetaController meta,
|
||||
required List<OverviewFavourite> displayedFavs,
|
||||
}) {
|
||||
_work.ensure(
|
||||
key: key,
|
||||
mounted: () => mounted,
|
||||
onUpdate: () {
|
||||
if (mounted) setState(() {});
|
||||
},
|
||||
compute: (yieldUi) async {
|
||||
final txs = bank.transactions;
|
||||
final periods = _chartPeriods(txs);
|
||||
await yieldUi();
|
||||
|
||||
Map<DateTime, _MonthBucket> monthly = const {};
|
||||
var labelSpend = const <_LabelSpend>[];
|
||||
Map<DateTime, Map<String, double>> labelAmountByPeriod = const {};
|
||||
|
||||
if (!_showFavouritesView) {
|
||||
if (_metric == OverviewMetricMode.flow) {
|
||||
monthly = _flowTotals(txs, meta, periods, _period);
|
||||
} else {
|
||||
final labels = _labelAggregates(
|
||||
txs,
|
||||
meta,
|
||||
periods,
|
||||
_period,
|
||||
includedLabelIds: _includedLabelIds,
|
||||
flow: _labelFlow,
|
||||
);
|
||||
labelSpend = labels.spend;
|
||||
labelAmountByPeriod = labels.amountByPeriod;
|
||||
}
|
||||
await yieldUi();
|
||||
}
|
||||
|
||||
final favourites = <String, _FavouriteAgg>{};
|
||||
if (_showFavouritesView) {
|
||||
for (var i = 0; i < displayedFavs.length; i++) {
|
||||
final favourite = displayedFavs[i];
|
||||
final favPeriods = _chartPeriodsFor(favourite.period, txs);
|
||||
Map<DateTime, _MonthBucket> favMonthly = const {};
|
||||
var favLabels = const <_LabelSpend>[];
|
||||
Map<DateTime, Map<String, double>> favByPeriod = const {};
|
||||
if (favourite.metric == OverviewMetricMode.flow) {
|
||||
favMonthly =
|
||||
_flowTotals(txs, meta, favPeriods, favourite.period);
|
||||
} else {
|
||||
final labels = _labelAggregates(
|
||||
txs,
|
||||
meta,
|
||||
favPeriods,
|
||||
favourite.period,
|
||||
includedLabelIds: favourite.labelIds.toSet(),
|
||||
flow: favourite.flow,
|
||||
);
|
||||
favLabels = labels.spend;
|
||||
favByPeriod = labels.amountByPeriod;
|
||||
}
|
||||
favourites[favourite.id] = _FavouriteAgg(
|
||||
periods: favPeriods,
|
||||
monthly: favMonthly,
|
||||
labelSpend: favLabels,
|
||||
labelAmountByPeriod: favByPeriod,
|
||||
);
|
||||
await yieldUi();
|
||||
}
|
||||
}
|
||||
|
||||
return _OverviewAggSnapshot(
|
||||
periods: periods,
|
||||
monthly: monthly,
|
||||
labelSpend: labelSpend,
|
||||
labelAmountByPeriod: labelAmountByPeriod,
|
||||
favourites: favourites,
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildFavouritesBody(
|
||||
BuildContext context,
|
||||
BankController bank,
|
||||
@@ -329,6 +495,7 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
: 'EUR');
|
||||
final txs = bank.transactions;
|
||||
final displayed = prefs.displayedOverviewFavourites;
|
||||
final agg = _work.value;
|
||||
|
||||
return ListView(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
@@ -399,6 +566,7 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
txs: txs,
|
||||
meta: meta,
|
||||
currency: currency,
|
||||
precomputed: agg?.favourites[displayed[i].id],
|
||||
),
|
||||
],
|
||||
],
|
||||
@@ -412,25 +580,30 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
required List<BankTransaction> txs,
|
||||
required TxMetaController meta,
|
||||
required String currency,
|
||||
_FavouriteAgg? precomputed,
|
||||
}) {
|
||||
final periods = _chartPeriodsFor(favourite.period, txs);
|
||||
Map<DateTime, _MonthBucket> monthly = const {};
|
||||
var labelSpend = const <_LabelSpend>[];
|
||||
Map<DateTime, Map<String, double>> labelAmountByPeriod = const {};
|
||||
final periods = precomputed?.periods ??
|
||||
_chartPeriodsFor(favourite.period, txs);
|
||||
Map<DateTime, _MonthBucket> monthly = precomputed?.monthly ?? const {};
|
||||
var labelSpend = precomputed?.labelSpend ?? const <_LabelSpend>[];
|
||||
Map<DateTime, Map<String, double>> labelAmountByPeriod =
|
||||
precomputed?.labelAmountByPeriod ?? const {};
|
||||
|
||||
if (favourite.metric == OverviewMetricMode.flow) {
|
||||
monthly = _flowTotals(txs, meta, periods, favourite.period);
|
||||
} else {
|
||||
final labels = _labelAggregates(
|
||||
txs,
|
||||
meta,
|
||||
periods,
|
||||
favourite.period,
|
||||
includedLabelIds: favourite.labelIds.toSet(),
|
||||
flow: favourite.flow,
|
||||
);
|
||||
labelSpend = labels.spend;
|
||||
labelAmountByPeriod = labels.amountByPeriod;
|
||||
if (precomputed == null) {
|
||||
if (favourite.metric == OverviewMetricMode.flow) {
|
||||
monthly = _flowTotals(txs, meta, periods, favourite.period);
|
||||
} else {
|
||||
final labels = _labelAggregates(
|
||||
txs,
|
||||
meta,
|
||||
periods,
|
||||
favourite.period,
|
||||
includedLabelIds: favourite.labelIds.toSet(),
|
||||
flow: favourite.flow,
|
||||
);
|
||||
labelSpend = labels.spend;
|
||||
labelAmountByPeriod = labels.amountByPeriod;
|
||||
}
|
||||
}
|
||||
|
||||
final periodTitle = favourite.period == OverviewPeriodMode.monthly
|
||||
@@ -530,28 +703,31 @@ class _OverviewScreenState extends State<OverviewScreen> {
|
||||
? bank.transactions.first.currency
|
||||
: 'EUR');
|
||||
final txs = bank.transactions;
|
||||
final periods = _chartPeriods(txs);
|
||||
final agg = _work.value;
|
||||
final periods = agg?.periods ?? _chartPeriods(txs);
|
||||
final historyPeriods = [...periods.reversed];
|
||||
|
||||
// Only aggregate what the active metric needs — toggling was scanning
|
||||
// all txs 3–4 times and resolving full meta each time.
|
||||
Map<DateTime, _MonthBucket> monthly = const {};
|
||||
var labelSpend = const <_LabelSpend>[];
|
||||
Map<DateTime, Map<String, double>> labelAmountByPeriod = const {};
|
||||
// Prefer deferred aggregates; fall back only if snapshot is missing.
|
||||
Map<DateTime, _MonthBucket> monthly = agg?.monthly ?? const {};
|
||||
var labelSpend = agg?.labelSpend ?? const <_LabelSpend>[];
|
||||
Map<DateTime, Map<String, double>> labelAmountByPeriod =
|
||||
agg?.labelAmountByPeriod ?? const {};
|
||||
|
||||
if (_metric == OverviewMetricMode.flow) {
|
||||
monthly = _flowTotals(txs, meta, periods, _period);
|
||||
} else {
|
||||
final labels = _labelAggregates(
|
||||
txs,
|
||||
meta,
|
||||
periods,
|
||||
_period,
|
||||
includedLabelIds: _includedLabelIds,
|
||||
flow: _labelFlow,
|
||||
);
|
||||
labelSpend = labels.spend;
|
||||
labelAmountByPeriod = labels.amountByPeriod;
|
||||
if (agg == null) {
|
||||
if (_metric == OverviewMetricMode.flow) {
|
||||
monthly = _flowTotals(txs, meta, periods, _period);
|
||||
} else {
|
||||
final labels = _labelAggregates(
|
||||
txs,
|
||||
meta,
|
||||
periods,
|
||||
_period,
|
||||
includedLabelIds: _includedLabelIds,
|
||||
flow: _labelFlow,
|
||||
);
|
||||
labelSpend = labels.spend;
|
||||
labelAmountByPeriod = labels.amountByPeriod;
|
||||
}
|
||||
}
|
||||
|
||||
final summaryFlow = _metric == OverviewMetricMode.flow
|
||||
|
||||
Reference in New Issue
Block a user