desktop main view wallets overview table list tweaks

This commit is contained in:
julian 2023-04-03 20:19:41 -06:00
parent 991ade962c
commit 96aa10653b
2 changed files with 142 additions and 181 deletions

View file

@ -22,32 +22,48 @@ class _MyWalletsState extends ConsumerState<MyWallets> {
.select((value) => value.showFavoriteWallets)); .select((value) => value.showFavoriteWallets));
return Padding( return Padding(
padding: const EdgeInsets.all(24), padding: const EdgeInsets.only(
top: 24,
left: 14,
right: 14,
bottom: 0,
),
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
if (showFavorites) const DesktopFavoriteWallets(), if (showFavorites)
Row( const Padding(
children: [ padding: EdgeInsets.symmetric(
Text( horizontal: 10,
"All wallets", ),
style: STextStyles.desktopTextExtraSmall(context).copyWith( child: DesktopFavoriteWallets(),
color: Theme.of(context) ),
.extension<StackColors>()! Padding(
.textFieldActiveSearchIconRight, padding: const EdgeInsets.all(
10,
),
child: Row(
children: [
Text(
"All wallets",
style: STextStyles.desktopTextExtraSmall(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textFieldActiveSearchIconRight,
),
), ),
), const Spacer(),
const Spacer(), CustomTextButton(
CustomTextButton( text: "Add new wallet",
text: "Add new wallet", onTap: () {
onTap: () { Navigator.of(
Navigator.of( context,
context, rootNavigator: true,
rootNavigator: true, ).pushNamed(AddWalletView.routeName);
).pushNamed(AddWalletView.routeName); },
}, ),
), ],
], ),
), ),
const SizedBox( const SizedBox(
height: 20, height: 20,

View file

@ -8,6 +8,7 @@ import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/format.dart'; import 'package:stackwallet/utilities/format.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/conditional_parent.dart';
import 'package:stackwallet/widgets/desktop/desktop_dialog.dart'; import 'package:stackwallet/widgets/desktop/desktop_dialog.dart';
import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart'; import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart';
@ -34,47 +35,104 @@ class _WalletTableState extends ConsumerState<WalletSummaryTable> {
final providers = providersByCoin[index].item2; final providers = providersByCoin[index].item2;
final coin = providersByCoin[index].item1; final coin = providersByCoin[index].item1;
return RoundedWhiteContainer( return ConditionalParent(
padding: const EdgeInsets.all(20), condition: index + 1 == providersByCoin.length,
onPressed: () { builder: (child) => const Padding(
showDialog<void>( padding: EdgeInsets.only(
context: context, bottom: 16,
builder: (_) => DesktopDialog( ),
maxHeight: 600, ),
maxWidth: 700, child: DesktopWalletSummaryRow(
child: Column( key: Key("DesktopWalletSummaryRow_key_${coin.name}"),
children: [ coin: coin,
Row( walletCount: providers.length,
mainAxisAlignment: MainAxisAlignment.spaceBetween, ),
children: [ );
Padding( },
padding: const EdgeInsets.only(left: 32), separatorBuilder: (_, __) => const SizedBox(
child: Text( height: 10,
"${coin.prettyName} (${coin.ticker}) wallets", ),
style: STextStyles.desktopH3(context), itemCount: providersByCoin.length,
), );
), }
const DesktopDialogCloseButton(), }
],
), class DesktopWalletSummaryRow extends StatefulWidget {
Expanded( const DesktopWalletSummaryRow({
child: Padding( Key? key,
padding: const EdgeInsets.only( required this.coin,
left: 32, required this.walletCount,
right: 32, }) : super(key: key);
bottom: 32,
), final Coin coin;
child: DesktopCoinWalletsDialog( final int walletCount;
coin: coin,
navigatorState: Navigator.of(context), @override
), State<DesktopWalletSummaryRow> createState() =>
), _DesktopWalletSummaryRowState();
), }
],
class _DesktopWalletSummaryRowState extends State<DesktopWalletSummaryRow> {
bool _hovering = false;
void _onPressed() {
showDialog<void>(
context: context,
builder: (_) => DesktopDialog(
maxHeight: 600,
maxWidth: 700,
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Padding(
padding: const EdgeInsets.only(left: 32),
child: Text(
"${widget.coin.prettyName} (${widget.coin.ticker}) wallets",
style: STextStyles.desktopH3(context),
),
),
const DesktopDialogCloseButton(),
],
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(
left: 32,
right: 32,
bottom: 32,
),
child: DesktopCoinWalletsDialog(
coin: widget.coin,
navigatorState: Navigator.of(context),
), ),
), ),
); ),
}, ],
),
),
);
}
@override
Widget build(BuildContext context) {
return MouseRegion(
onEnter: (_) => setState(
() => _hovering = true,
),
onExit: (_) => setState(
() => _hovering = false,
),
child: AnimatedScale(
scale: _hovering ? 1.00 : 0.98,
duration: const Duration(
milliseconds: 200,
),
child: RoundedWhiteContainer(
padding: const EdgeInsets.all(20),
hoverColor: Colors.transparent,
onPressed: _onPressed,
child: Row( child: Row(
children: [ children: [
Expanded( Expanded(
@ -82,7 +140,7 @@ class _WalletTableState extends ConsumerState<WalletSummaryTable> {
child: Row( child: Row(
children: [ children: [
SvgPicture.asset( SvgPicture.asset(
Assets.svg.iconFor(coin: providersByCoin[index].item1), Assets.svg.iconFor(coin: widget.coin),
width: 28, width: 28,
height: 28, height: 28,
), ),
@ -90,7 +148,7 @@ class _WalletTableState extends ConsumerState<WalletSummaryTable> {
width: 10, width: 10,
), ),
Text( Text(
providersByCoin[index].item1.prettyName, widget.coin.prettyName,
style: style:
STextStyles.desktopTextExtraSmall(context).copyWith( STextStyles.desktopTextExtraSmall(context).copyWith(
color: Theme.of(context) color: Theme.of(context)
@ -104,9 +162,9 @@ class _WalletTableState extends ConsumerState<WalletSummaryTable> {
Expanded( Expanded(
flex: 4, flex: 4,
child: Text( child: Text(
providers.length == 1 widget.walletCount == 1
? "${providers.length} wallet" ? "${widget.walletCount} wallet"
: "${providers.length} wallets", : "${widget.walletCount} wallets",
style: STextStyles.desktopTextExtraSmall(context).copyWith( style: STextStyles.desktopTextExtraSmall(context).copyWith(
color: Theme.of(context) color: Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
@ -117,129 +175,16 @@ class _WalletTableState extends ConsumerState<WalletSummaryTable> {
Expanded( Expanded(
flex: 6, flex: 6,
child: TablePriceInfo( child: TablePriceInfo(
coin: providersByCoin[index].item1, coin: widget.coin,
), ),
), ),
], ],
), ),
); ),
},
separatorBuilder: (_, __) => const SizedBox(
height: 10,
), ),
itemCount: providersByCoin.length,
); );
} }
} }
//
// class WalletSummaryTable extends ConsumerStatefulWidget {
// const WalletSummaryTable({Key? key}) : super(key: key);
//
// @override
// ConsumerState<WalletSummaryTable> createState() => _WalletTableState();
// }
//
// class _WalletTableState extends ConsumerState<WalletSummaryTable> {
// @override
// Widget build(BuildContext context) {
// debugPrint("BUILD: $runtimeType");
// final providersByCoin = ref.watch(
// walletsChangeNotifierProvider.select(
// (value) => value.getManagerProvidersByCoin(),
// ),
// );
//
// return TableView(
// rows: [
// for (int i = 0; i < providersByCoin.length; i++)
// Builder(
// key: Key("${providersByCoin[i].item1.name}_${runtimeType}_key"),
// builder: (context) {
// final providers = providersByCoin[i].item2;
//
// VoidCallback? expandOverride;
// if (providers.length == 1) {
// expandOverride = () async {
// final manager = ref.read(providers.first);
// if (manager.coin == Coin.monero ||
// manager.coin == Coin.wownero) {
// await manager.initializeExisting();
// }
// await Navigator.of(context).pushNamed(
// DesktopWalletView.routeName,
// arguments: manager.walletId,
// );
// };
// }
//
// return TableViewRow(
// expandOverride: expandOverride,
// padding: const EdgeInsets.symmetric(
// horizontal: 20,
// vertical: 16,
// ),
// decoration: BoxDecoration(
// color: Theme.of(context).extension<StackColors>()!.popupBG,
// borderRadius: BorderRadius.circular(
// Constants.size.circularBorderRadius,
// ),
// ),
// cells: [
// TableViewCell(
// flex: 4,
// child: Row(
// children: [
// SvgPicture.asset(
// Assets.svg.iconFor(coin: providersByCoin[i].item1),
// width: 28,
// height: 28,
// ),
// const SizedBox(
// width: 10,
// ),
// Text(
// providersByCoin[i].item1.prettyName,
// style: STextStyles.desktopTextExtraSmall(context)
// .copyWith(
// color: Theme.of(context)
// .extension<StackColors>()!
// .textDark,
// ),
// )
// ],
// ),
// ),
// TableViewCell(
// flex: 4,
// child: Text(
// providers.length == 1
// ? "${providers.length} wallet"
// : "${providers.length} wallets",
// style:
// STextStyles.desktopTextExtraSmall(context).copyWith(
// color: Theme.of(context)
// .extension<StackColors>()!
// .textSubtitle1,
// ),
// ),
// ),
// TableViewCell(
// flex: 6,
// child: TablePriceInfo(
// coin: providersByCoin[i].item1,
// ),
// ),
// ],
// expandingChild: CoinWalletsTable(
// coin: providersByCoin[i].item1,
// ),
// );
// },
// ),
// ],
// );
// }
// }
class TablePriceInfo extends ConsumerWidget { class TablePriceInfo extends ConsumerWidget {
const TablePriceInfo({Key? key, required this.coin}) : super(key: key); const TablePriceInfo({Key? key, required this.coin}) : super(key: key);