From 934cdcc917b032af961e78d49012f3f784221244 Mon Sep 17 00:00:00 2001 From: julian Date: Thu, 27 Oct 2022 13:26:55 -0600 Subject: [PATCH] WIP: desktop transactions list --- .../sub_widgets/transactions_list.dart | 167 ++++++++++-------- .../wallet_view/desktop_wallet_view.dart | 28 ++- lib/widgets/trade_card.dart | 3 +- lib/widgets/transaction_card.dart | 32 +++- 4 files changed, 140 insertions(+), 90 deletions(-) diff --git a/lib/pages/wallet_view/sub_widgets/transactions_list.dart b/lib/pages/wallet_view/sub_widgets/transactions_list.dart index 2246882ab..d23d3082f 100644 --- a/lib/pages/wallet_view/sub_widgets/transactions_list.dart +++ b/lib/pages/wallet_view/sub_widgets/transactions_list.dart @@ -10,6 +10,7 @@ import 'package:stackwallet/providers/global/wallets_provider.dart'; import 'package:stackwallet/services/coins/manager.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/loading_indicator.dart'; import 'package:stackwallet/widgets/trade_card.dart'; import 'package:stackwallet/widgets/transaction_card.dart'; @@ -67,6 +68,65 @@ class _TransactionsListState extends ConsumerState { ); } + Widget itemBuilder( + BuildContext context, Transaction tx, BorderRadius? radius) { + final matchingTrades = ref + .read(tradesServiceProvider) + .trades + .where((e) => e.payInTxid == tx.txid || e.payOutTxid == tx.txid); + if (tx.txType == "Sent" && matchingTrades.isNotEmpty) { + final trade = matchingTrades.first; + return Container( + decoration: BoxDecoration( + color: Theme.of(context).extension()!.popupBG, + borderRadius: radius, + ), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + TransactionCard( + // this may mess with combined firo transactions + key: Key(tx.toString()), // + transaction: tx, + walletId: widget.walletId, + ), + TradeCard( + // this may mess with combined firo transactions + key: Key(tx.toString() + trade.uuid), // + trade: trade, + onTap: () { + unawaited( + Navigator.of(context).pushNamed( + TradeDetailsView.routeName, + arguments: Tuple4( + trade.tradeId, + tx, + widget.walletId, + ref.read(managerProvider).walletName, + ), + ), + ); + }, + ) + ], + ), + ); + } else { + return Container( + decoration: BoxDecoration( + color: Theme.of(context).extension()!.popupBG, + borderRadius: radius, + ), + child: TransactionCard( + // this may mess with combined firo transactions + key: Key(tx.toString()), // + transaction: tx, + walletId: widget.walletId, + ), + ); + } + } + @override void initState() { managerProvider = widget.managerProvider; @@ -119,77 +179,42 @@ class _TransactionsListState extends ConsumerState { unawaited(ref.read(managerProvider).refresh()); } }, - child: ListView.builder( - itemCount: list.length, - itemBuilder: (context, index) { - BorderRadius? radius; - if (index == list.length - 1) { - radius = _borderRadiusLast; - } else if (index == 0) { - radius = _borderRadiusFirst; - } - final tx = list[index]; - - final matchingTrades = ref - .read(tradesServiceProvider) - .trades - .where((e) => - e.payInTxid == tx.txid || e.payOutTxid == tx.txid); - if (tx.txType == "Sent" && matchingTrades.isNotEmpty) { - final trade = matchingTrades.first; - return Container( - decoration: BoxDecoration( - color: - Theme.of(context).extension()!.popupBG, - borderRadius: radius, - ), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - TransactionCard( - // this may mess with combined firo transactions - key: Key(tx.toString()), // - transaction: tx, - walletId: widget.walletId, - ), - TradeCard( - // this may mess with combined firo transactions - key: Key(tx.toString() + trade.uuid), // - trade: trade, - onTap: () { - unawaited( - Navigator.of(context).pushNamed( - TradeDetailsView.routeName, - arguments: Tuple4( - trade.tradeId, - tx, - widget.walletId, - ref.read(managerProvider).walletName, - ), - ), - ); - }, - ) - ], - ), - ); - } else { - return Container( - decoration: BoxDecoration( - color: - Theme.of(context).extension()!.popupBG, - borderRadius: radius, - ), - child: TransactionCard( - // this may mess with combined firo transactions - key: Key(tx.toString()), // - transaction: tx, - walletId: widget.walletId, - ), - ); - } - }, - ), + child: Util.isDesktop + ? ListView.separated( + itemBuilder: (context, index) { + BorderRadius? radius; + if (index == list.length - 1) { + radius = _borderRadiusLast; + } else if (index == 0) { + radius = _borderRadiusFirst; + } + final tx = list[index]; + return itemBuilder(context, tx, radius); + }, + separatorBuilder: (context, index) { + return Container( + width: double.infinity, + height: 2, + color: Theme.of(context) + .extension()! + .background, + ); + }, + itemCount: list.length, + ) + : ListView.builder( + itemCount: list.length, + itemBuilder: (context, index) { + BorderRadius? radius; + if (index == list.length - 1) { + radius = _borderRadiusLast; + } else if (index == 0) { + radius = _borderRadiusFirst; + } + final tx = list[index]; + return itemBuilder(context, tx, radius); + }, + ), ); } }, diff --git a/lib/pages_desktop_specific/home/my_stack_view/wallet_view/desktop_wallet_view.dart b/lib/pages_desktop_specific/home/my_stack_view/wallet_view/desktop_wallet_view.dart index 76650e2c0..baa91b3f8 100644 --- a/lib/pages_desktop_specific/home/my_stack_view/wallet_view/desktop_wallet_view.dart +++ b/lib/pages_desktop_specific/home/my_stack_view/wallet_view/desktop_wallet_view.dart @@ -7,6 +7,7 @@ import 'package:flutter_svg/svg.dart'; import 'package:stackwallet/pages/exchange_view/sub_widgets/exchange_rate_sheet.dart'; import 'package:stackwallet/pages/exchange_view/wallet_initiated_exchange_view.dart'; import 'package:stackwallet/pages/settings_views/wallet_settings_view/wallet_network_settings_view/wallet_network_settings_view.dart'; +import 'package:stackwallet/pages/wallet_view/sub_widgets/transactions_list.dart'; import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/wallet_view/desktop_wallet_summary.dart'; import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/wallet_view/receive/desktop_receive.dart'; import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/wallet_view/send/desktop_send.dart'; @@ -324,8 +325,10 @@ class _DesktopWalletViewState extends ConsumerState { const SizedBox( width: 16, ), - const Expanded( - child: RecentDesktopTransactions(), + Expanded( + child: RecentDesktopTransactions( + walletId: walletId, + ), ), ], ), @@ -543,15 +546,21 @@ class _SendReceiveTabMenuState extends State { } } -class RecentDesktopTransactions extends StatefulWidget { - const RecentDesktopTransactions({Key? key}) : super(key: key); +class RecentDesktopTransactions extends ConsumerStatefulWidget { + const RecentDesktopTransactions({ + Key? key, + required this.walletId, + }) : super(key: key); + + final String walletId; @override - State createState() => + ConsumerState createState() => _RecentDesktopTransactionsState(); } -class _RecentDesktopTransactionsState extends State { +class _RecentDesktopTransactionsState + extends ConsumerState { @override Widget build(BuildContext context) { return Column( @@ -579,9 +588,10 @@ class _RecentDesktopTransactionsState extends State { height: 16, ), Expanded( - child: RoundedWhiteContainer( - padding: const EdgeInsets.all(0), - child: Container(), + child: TransactionsList( + managerProvider: ref.watch(walletsChangeNotifierProvider + .select((value) => value.getManagerProvider(widget.walletId))), + walletId: widget.walletId, ), ), ], diff --git a/lib/widgets/trade_card.dart b/lib/widgets/trade_card.dart index ba07b9576..0ac8e9346 100644 --- a/lib/widgets/trade_card.dart +++ b/lib/widgets/trade_card.dart @@ -7,6 +7,7 @@ import 'package:stackwallet/models/exchange/response_objects/trade.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; class TradeCard extends ConsumerWidget { @@ -84,7 +85,7 @@ class TradeCard extends ConsumerWidget { style: STextStyles.itemSubtitle12(context), ), Text( - "${Decimal.tryParse(trade.payInAmount) ?? "..."} ${trade.payInCurrency.toUpperCase()}", + "${Util.isDesktop ? "-" : ""}${Decimal.tryParse(trade.payInAmount) ?? "..."} ${trade.payInCurrency.toUpperCase()}", style: STextStyles.itemSubtitle12(context), ), ], diff --git a/lib/widgets/transaction_card.dart b/lib/widgets/transaction_card.dart index cb737ae08..de0447684 100644 --- a/lib/widgets/transaction_card.dart +++ b/lib/widgets/transaction_card.dart @@ -13,6 +13,7 @@ import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart'; +import 'package:stackwallet/utilities/util.dart'; import 'package:tuple/tuple.dart'; class TransactionCard extends ConsumerStatefulWidget { @@ -100,6 +101,17 @@ class _TransactionCardState extends ConsumerState { .select((value) => value.getPrice(coin))) .item1; + late final String prefix; + if (Util.isDesktop) { + if (_transaction.txType == "Sent") { + prefix = "-"; + } else if (_transaction.txType == "Received") { + prefix = "+"; + } + } else { + prefix = ""; + } + return Material( color: Theme.of(context).extension()!.popupBG, elevation: 0, @@ -126,14 +138,16 @@ class _TransactionCardState extends ConsumerState { )); return; } - unawaited(Navigator.of(context).pushNamed( - TransactionDetailsView.routeName, - arguments: Tuple3( - _transaction, - coin, - walletId, + unawaited( + Navigator.of(context).pushNamed( + TransactionDetailsView.routeName, + arguments: Tuple3( + _transaction, + coin, + walletId, + ), ), - )); + ); }, child: Padding( padding: const EdgeInsets.all(8), @@ -176,7 +190,7 @@ class _TransactionCardState extends ConsumerState { ? (_transaction.amount ~/ 1000) : _transaction.amount; return Text( - "${Format.satoshiAmountToPrettyString(amount, locale)} ${coin.ticker}", + "$prefix${Format.satoshiAmountToPrettyString(amount, locale)} ${coin.ticker}", style: STextStyles.itemSubtitle12_600(context), ); @@ -223,7 +237,7 @@ class _TransactionCardState extends ConsumerState { } return Text( - "${Format.localizedStringAsFixed( + "$prefix${Format.localizedStringAsFixed( value: Format.satoshisToAmount(value) * price, locale: locale,