new favourites feature
This commit is contained in:
davmar
+230
-155
@@ -5,12 +5,15 @@ import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
import '../providers/bank_provider.dart';
|
||||
import '../providers/preferences_provider.dart';
|
||||
import '../providers/tx_meta_provider.dart';
|
||||
import '../utils/app_theme.dart';
|
||||
import '../utils/connect_bank.dart';
|
||||
import '../utils/helpers.dart';
|
||||
import '../utils/navigation.dart';
|
||||
import '../widgets/empty_state.dart';
|
||||
import '../widgets/home_filter_widget_card.dart';
|
||||
import '../widgets/home_widgets_sheet.dart';
|
||||
import '../widgets/loading_view.dart';
|
||||
import '../widgets/responsive_body.dart';
|
||||
import '../widgets/shell_tab_scope.dart';
|
||||
@@ -18,16 +21,23 @@ import '../widgets/skip_build_when_covered.dart';
|
||||
import 'transaction_detail_screen.dart';
|
||||
import 'transactions_screen.dart';
|
||||
|
||||
class HomeScreen extends StatelessWidget {
|
||||
class HomeScreen extends StatefulWidget {
|
||||
const HomeScreen({super.key});
|
||||
|
||||
static const tabIndex = 0;
|
||||
|
||||
@override
|
||||
State<HomeScreen> createState() => _HomeScreenState();
|
||||
}
|
||||
|
||||
class _HomeScreenState extends State<HomeScreen> {
|
||||
var _editingWidgets = false;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
// Inactive IndexedStack tabs must not watch providers — otherwise every
|
||||
// annotation save rebuilds Home while the user is on another tab.
|
||||
if (ShellTabScope.of(context) != tabIndex) {
|
||||
if (ShellTabScope.of(context) != HomeScreen.tabIndex) {
|
||||
return const SizedBox.expand();
|
||||
}
|
||||
|
||||
@@ -35,17 +45,31 @@ class HomeScreen extends StatelessWidget {
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(
|
||||
title: const Text('Home'),
|
||||
actions: bankAppBarActions(
|
||||
context: context,
|
||||
onRefresh: bank.refresh,
|
||||
refreshing: bank.isLoading,
|
||||
),
|
||||
title: Text(_editingWidgets ? 'Edit widgets' : 'Home'),
|
||||
actions: [
|
||||
if (bank.isLinked || bank.hasData)
|
||||
IconButton(
|
||||
tooltip: _editingWidgets ? 'Done' : 'Edit Home widgets',
|
||||
onPressed: () =>
|
||||
setState(() => _editingWidgets = !_editingWidgets),
|
||||
icon: Icon(
|
||||
_editingWidgets ? Icons.check : Icons.dashboard_customize_outlined,
|
||||
),
|
||||
),
|
||||
...bankAppBarActions(
|
||||
context: context,
|
||||
onRefresh: bank.refresh,
|
||||
refreshing: bank.isLoading,
|
||||
),
|
||||
],
|
||||
),
|
||||
body: RefreshIndicator(
|
||||
onRefresh: bank.refresh,
|
||||
child: ResponsiveBody(
|
||||
child: _HomeBody(bank: bank),
|
||||
child: _HomeBody(
|
||||
bank: bank,
|
||||
editingWidgets: _editingWidgets,
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
@@ -53,9 +77,13 @@ class HomeScreen extends StatelessWidget {
|
||||
}
|
||||
|
||||
class _HomeBody extends StatelessWidget {
|
||||
const _HomeBody({required this.bank});
|
||||
const _HomeBody({
|
||||
required this.bank,
|
||||
required this.editingWidgets,
|
||||
});
|
||||
|
||||
final BankController bank;
|
||||
final bool editingWidgets;
|
||||
|
||||
void _openTransactions(BuildContext context) {
|
||||
Navigator.of(context).push(
|
||||
@@ -68,6 +96,7 @@ class _HomeBody extends StatelessWidget {
|
||||
// Stay subscribed, but skip heavy scans while covered by another route
|
||||
// (e.g. transaction detail applying labels to many similar txs).
|
||||
context.watch<TxMetaController>();
|
||||
final prefs = context.watch<PreferencesController>();
|
||||
|
||||
if (bank.isLoading && bank.balance == null && !bank.hasData) {
|
||||
return const LoadingView(message: 'Checking bank link…');
|
||||
@@ -106,163 +135,204 @@ class _HomeBody extends StatelessWidget {
|
||||
|
||||
return SkipBuildWhenCovered(
|
||||
builder: (context) {
|
||||
final balance = bank.balance;
|
||||
final theme = Theme.of(context);
|
||||
final colors = theme.colorScheme;
|
||||
final meta = context.watch<TxMetaController>();
|
||||
final recent = bank.transactions.take(5).toList(growable: false);
|
||||
final categorized =
|
||||
meta.labeledTransactionCount(bank.transactions);
|
||||
final balance = bank.balance;
|
||||
final theme = Theme.of(context);
|
||||
final colors = theme.colorScheme;
|
||||
final meta = context.watch<TxMetaController>();
|
||||
final recent = bank.transactions.take(5).toList(growable: false);
|
||||
final categorized =
|
||||
meta.labeledTransactionCount(bank.transactions);
|
||||
final widgets = editingWidgets
|
||||
? prefs.homeFilterWidgets
|
||||
: prefs.displayedHomeFilterWidgets;
|
||||
|
||||
return ListView(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
padding: const EdgeInsets.only(top: 8, bottom: 32),
|
||||
children: [
|
||||
Material(
|
||||
color: Colors.transparent,
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
onTap: () => _openTransactions(context),
|
||||
child: Ink(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.all(24),
|
||||
decoration: BoxDecoration(
|
||||
return ListView(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
padding: const EdgeInsets.only(top: 8, bottom: 32),
|
||||
children: [
|
||||
Material(
|
||||
color: Colors.transparent,
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
gradient: LinearGradient(
|
||||
colors: [colors.primary, colors.tertiary],
|
||||
),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: colors.primary.withValues(alpha: 0.28),
|
||||
blurRadius: 20,
|
||||
offset: const Offset(0, 10),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Current balance',
|
||||
style: theme.textTheme.labelMedium?.copyWith(
|
||||
color: colors.onPrimary.withValues(alpha: 0.8),
|
||||
onTap: () => _openTransactions(context),
|
||||
child: Ink(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.all(24),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
gradient: LinearGradient(
|
||||
colors: [colors.primary, colors.tertiary],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
balance == null
|
||||
? '—'
|
||||
: formatMoney(balance.amount, balance.currency),
|
||||
style: theme.textTheme.headlineMedium?.copyWith(
|
||||
color: colors.onPrimary,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.receipt_long,
|
||||
size: 16,
|
||||
color: colors.onPrimary.withValues(alpha: 0.9),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Tap to view transactions',
|
||||
style: theme.textTheme.labelMedium?.copyWith(
|
||||
color: colors.onPrimary.withValues(alpha: 0.9),
|
||||
),
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
Icons.chevron_right,
|
||||
color: colors.onPrimary.withValues(alpha: 0.9),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: colors.primary.withValues(alpha: 0.28),
|
||||
blurRadius: 20,
|
||||
offset: const Offset(0, 10),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Current balance',
|
||||
style: theme.textTheme.labelMedium?.copyWith(
|
||||
color: colors.onPrimary.withValues(alpha: 0.8),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
balance == null
|
||||
? '—'
|
||||
: formatMoney(balance.amount, balance.currency),
|
||||
style: theme.textTheme.headlineMedium?.copyWith(
|
||||
color: colors.onPrimary,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.receipt_long,
|
||||
size: 16,
|
||||
color: colors.onPrimary.withValues(alpha: 0.9),
|
||||
),
|
||||
const SizedBox(width: 6),
|
||||
Expanded(
|
||||
child: Text(
|
||||
'Tap to view transactions',
|
||||
style: theme.textTheme.labelMedium?.copyWith(
|
||||
color:
|
||||
colors.onPrimary.withValues(alpha: 0.9),
|
||||
),
|
||||
),
|
||||
),
|
||||
Icon(
|
||||
Icons.chevron_right,
|
||||
color: colors.onPrimary.withValues(alpha: 0.9),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _StatChip(
|
||||
label: 'Transactions',
|
||||
value: '${bank.transactions.length}',
|
||||
icon: Icons.list_alt,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: _StatChip(
|
||||
label: 'Categorized',
|
||||
value: '$categorized',
|
||||
icon: Icons.label_outline,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
if (editingWidgets || widgets.isNotEmpty) ...[
|
||||
const SizedBox(height: 24),
|
||||
Row(
|
||||
children: [
|
||||
Text('Widgets', style: theme.textTheme.titleMedium),
|
||||
const Spacer(),
|
||||
if (editingWidgets)
|
||||
TextButton.icon(
|
||||
onPressed: () => showHomeWidgetsSheet(context),
|
||||
icon: const Icon(Icons.add, size: 18),
|
||||
label: const Text('Add'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
child: _StatChip(
|
||||
label: 'Transactions',
|
||||
value: '${bank.transactions.length}',
|
||||
icon: Icons.list_alt,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: _StatChip(
|
||||
label: 'Categorized',
|
||||
value: '$categorized',
|
||||
icon: Icons.label_outline,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
if (recent.isNotEmpty) ...[
|
||||
const SizedBox(height: 24),
|
||||
Row(
|
||||
children: [
|
||||
Text('Recent', style: theme.textTheme.titleMedium),
|
||||
const Spacer(),
|
||||
TextButton(
|
||||
onPressed: () => _openTransactions(context),
|
||||
child: const Text('See all'),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
if (widgets.isEmpty)
|
||||
Text(
|
||||
'No widgets yet. Tap Add to pin a transaction filter.',
|
||||
style: theme.textTheme.bodyMedium?.copyWith(
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
)
|
||||
else
|
||||
for (final widgetConfig in widgets) ...[
|
||||
HomeFilterWidgetCard(
|
||||
widgetConfig: widgetConfig,
|
||||
editing: editingWidgets,
|
||||
onRemove: editingWidgets
|
||||
? () => prefs.removeHomeFilterWidget(widgetConfig.id)
|
||||
: null,
|
||||
),
|
||||
const SizedBox(height: 10),
|
||||
],
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
for (final tx in recent)
|
||||
ListTile(
|
||||
contentPadding: EdgeInsets.zero,
|
||||
dense: true,
|
||||
leading: Builder(
|
||||
builder: (context) {
|
||||
final labels =
|
||||
meta.leafLabelsFor(meta.metaFor(tx));
|
||||
final label = labels.isEmpty ? null : labels.first;
|
||||
return Icon(
|
||||
label?.icon ?? Icons.receipt_long_outlined,
|
||||
color: label?.color,
|
||||
if (recent.isNotEmpty) ...[
|
||||
const SizedBox(height: 24),
|
||||
Row(
|
||||
children: [
|
||||
Text('Recent', style: theme.textTheme.titleMedium),
|
||||
const Spacer(),
|
||||
TextButton(
|
||||
onPressed: () => _openTransactions(context),
|
||||
child: const Text('See all'),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
for (final tx in recent)
|
||||
ListTile(
|
||||
contentPadding: EdgeInsets.zero,
|
||||
dense: true,
|
||||
leading: Builder(
|
||||
builder: (context) {
|
||||
final labels =
|
||||
meta.leafLabelsFor(meta.metaFor(tx));
|
||||
final label = labels.isEmpty ? null : labels.first;
|
||||
return Icon(
|
||||
label?.icon ?? Icons.receipt_long_outlined,
|
||||
color: label?.color,
|
||||
);
|
||||
},
|
||||
),
|
||||
title: Text(
|
||||
tx.description,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
subtitle: Text(formatIsoDate(tx.date)),
|
||||
trailing: Text(
|
||||
formatMoney(tx.amount, tx.currency),
|
||||
style: theme.textTheme.titleSmall?.copyWith(
|
||||
color: tx.amount >= 0
|
||||
? AppTheme.accent
|
||||
: AppTheme.expense,
|
||||
),
|
||||
),
|
||||
onTap: () {
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(
|
||||
builder: (_) => TransactionDetailScreen(tx: tx),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
title: Text(
|
||||
tx.description,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
],
|
||||
if (bank.error != null) ...[
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
bank.error!,
|
||||
style: theme.textTheme.bodyMedium
|
||||
?.copyWith(color: colors.error),
|
||||
),
|
||||
subtitle: Text(formatIsoDate(tx.date)),
|
||||
trailing: Text(
|
||||
formatMoney(tx.amount, tx.currency),
|
||||
style: theme.textTheme.titleSmall?.copyWith(
|
||||
color: tx.amount >= 0 ? AppTheme.accent : AppTheme.expense,
|
||||
),
|
||||
),
|
||||
onTap: () {
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(
|
||||
builder: (_) => TransactionDetailScreen(tx: tx),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
],
|
||||
if (bank.error != null) ...[
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
bank.error!,
|
||||
style: theme.textTheme.bodyMedium?.copyWith(color: colors.error),
|
||||
),
|
||||
],
|
||||
],
|
||||
);
|
||||
],
|
||||
],
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
@@ -297,8 +367,13 @@ class _StatChip extends StatelessWidget {
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
label,
|
||||
style: theme.textTheme.labelMedium?.copyWith(
|
||||
color: colors.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
Text(value, style: theme.textTheme.titleMedium),
|
||||
Text(label, style: theme.textTheme.labelMedium),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
Reference in New Issue
Block a user