stack_wallet/lib/pages/coin_control/coin_control_view.dart
2024-05-27 18:01:41 -06:00

780 lines
36 KiB
Dart

/*
* This file is part of Stack Wallet.
*
* Copyright (c) 2023 Cypher Stack
* All Rights Reserved.
* The code is distributed under GPLv3 license, see LICENSE file for details.
* Generated by Cypher Stack on 2023-05-26
*
*/
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:isar/isar.dart';
import 'package:tuple/tuple.dart';
import '../../db/isar/main_db.dart';
import '../../models/isar/models/isar_models.dart';
import '../../providers/global/wallets_provider.dart';
import '../../themes/stack_colors.dart';
import '../../utilities/amount/amount.dart';
import '../../utilities/amount/amount_formatter.dart';
import '../../utilities/assets.dart';
import '../../utilities/constants.dart';
import '../../utilities/text_styles.dart';
import '../../wallets/isar/providers/wallet_info_provider.dart';
import '../../wallets/wallet/wallet_mixin_interfaces/coin_control_interface.dart';
import '../../widgets/animated_widgets/rotate_icon.dart';
import '../../widgets/app_bar_field.dart';
import '../../widgets/background.dart';
import '../../widgets/custom_buttons/app_bar_icon_button.dart';
import '../../widgets/custom_buttons/dropdown_button.dart';
import '../../widgets/desktop/primary_button.dart';
import '../../widgets/desktop/secondary_button.dart';
import '../../widgets/expandable2.dart';
import '../../widgets/icon_widgets/x_icon.dart';
import '../../widgets/rounded_container.dart';
import '../../widgets/rounded_white_container.dart';
import '../../widgets/toggle.dart';
import 'utxo_card.dart';
import 'utxo_details_view.dart';
enum CoinControlViewType {
manage,
use;
}
class CoinControlView extends ConsumerStatefulWidget {
const CoinControlView({
super.key,
required this.walletId,
required this.type,
this.requestedTotal,
this.selectedUTXOs,
});
static const routeName = "/coinControl";
final String walletId;
final CoinControlViewType type;
final Amount? requestedTotal;
final Set<UTXO>? selectedUTXOs;
@override
ConsumerState<CoinControlView> createState() => _CoinControlViewState();
}
class _CoinControlViewState extends ConsumerState<CoinControlView> {
final searchController = TextEditingController();
final searchFocus = FocusNode();
bool _isSearching = false;
bool _showBlocked = false;
CCSortDescriptor _sort = CCSortDescriptor.age;
Map<String, List<Id>>? _map;
List<Id>? _list;
final Set<UTXO> _selectedAvailable = {};
final Set<UTXO> _selectedBlocked = {};
Future<void> _refreshBalance() async {
final coinControlInterface =
ref.read(pWallets).getWallet(widget.walletId) as CoinControlInterface;
await coinControlInterface.updateBalance();
}
@override
void initState() {
if (widget.selectedUTXOs != null) {
_selectedAvailable.addAll(widget.selectedUTXOs!);
}
searchController.addListener(() {
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
setState(() {});
});
});
super.initState();
}
@override
void dispose() {
searchController.dispose();
searchFocus.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
debugPrint("BUILD: $runtimeType");
final minConfirms = ref
.watch(pWallets)
.getWallet(widget.walletId)
.cryptoCurrency
.minConfirms;
final coin = ref.watch(pWalletCoin(widget.walletId));
final currentHeight = ref.watch(pWalletChainHeight(widget.walletId));
if (_sort == CCSortDescriptor.address && !_isSearching) {
_list = null;
_map = MainDB.instance.queryUTXOsGroupedByAddressSync(
walletId: widget.walletId,
filter: CCFilter.all,
sort: _sort,
searchTerm: "",
cryptoCurrency: coin,
);
} else {
_map = null;
_list = MainDB.instance.queryUTXOsSync(
walletId: widget.walletId,
filter: _isSearching
? CCFilter.all
: _showBlocked
? CCFilter.frozen
: CCFilter.available,
sort: _sort,
searchTerm: _isSearching ? searchController.text : "",
cryptoCurrency: coin,
);
}
return WillPopScope(
onWillPop: () async {
unawaited(_refreshBalance());
Navigator.of(context).pop(
widget.type == CoinControlViewType.use ? _selectedAvailable : null,
);
return false;
},
child: Background(
child: Scaffold(
backgroundColor:
Theme.of(context).extension<StackColors>()!.background,
appBar: AppBar(
automaticallyImplyLeading: false,
leading: _isSearching
? null
: widget.type == CoinControlViewType.use &&
_selectedAvailable.isNotEmpty
? AppBarIconButton(
icon: XIcon(
width: 24,
height: 24,
color: Theme.of(context)
.extension<StackColors>()!
.topNavIconPrimary,
),
onPressed: () {
setState(() {
_selectedAvailable.clear();
});
},
)
: AppBarBackButton(
onPressed: () {
unawaited(_refreshBalance());
Navigator.of(context).pop(
widget.type == CoinControlViewType.use
? _selectedAvailable
: null,
);
},
),
title: _isSearching
? AppBarSearchField(
controller: searchController,
focusNode: searchFocus,
)
: Text(
"Coin control",
style: STextStyles.navBarTitle(context),
),
titleSpacing: 0,
actions: _isSearching
? [
AspectRatio(
aspectRatio: 1,
child: AppBarIconButton(
size: 36,
icon: SvgPicture.asset(
Assets.svg.x,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.topNavIconPrimary,
),
onPressed: () {
// show search
setState(() {
_isSearching = false;
});
},
),
),
]
: [
AspectRatio(
aspectRatio: 1,
child: AppBarIconButton(
size: 36,
icon: SvgPicture.asset(
Assets.svg.search,
width: 20,
height: 20,
color: Theme.of(context)
.extension<StackColors>()!
.topNavIconPrimary,
),
onPressed: () {
// show search
setState(() {
_isSearching = true;
});
},
),
),
AspectRatio(
aspectRatio: 1,
child: JDropdownIconButton(
mobileAppBar: true,
groupValue: _sort,
items: CCSortDescriptor.values.toSet(),
onSelectionChanged: (CCSortDescriptor? newValue) {
if (newValue != null && newValue != _sort) {
setState(() {
_sort = newValue;
});
}
},
displayPrefix: "Sort by",
),
),
],
),
body: SafeArea(
child: Column(
children: [
Expanded(
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16,
),
child: Column(
children: [
const SizedBox(
height: 10,
),
if (!_isSearching)
RoundedWhiteContainer(
child: Text(
"This option allows you to control, freeze, and utilize "
"outputs at your discretion. Tap the output circle to "
"select.",
style: STextStyles.w500_14(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textSubtitle1,
),
),
),
if (!_isSearching)
const SizedBox(
height: 10,
),
if (!(_isSearching || _map != null))
SizedBox(
height: 48,
child: Toggle(
key: UniqueKey(),
onColor: Theme.of(context)
.extension<StackColors>()!
.popupBG,
onText: "Available outputs",
offColor: Theme.of(context)
.extension<StackColors>()!
.textFieldDefaultBG,
offText: "Frozen outputs",
isOn: _showBlocked,
onValueChanged: (value) {
setState(() {
_showBlocked = value;
});
},
decoration: BoxDecoration(
color: Colors.transparent,
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
),
),
),
if (!_isSearching)
const SizedBox(
height: 10,
),
if (_isSearching)
Expanded(
child: ListView.separated(
itemCount: _list!.length,
separatorBuilder: (context, _) => const SizedBox(
height: 10,
),
itemBuilder: (context, index) {
final utxo = MainDB.instance.isar.utxos
.where()
.idEqualTo(_list![index])
.findFirstSync()!;
final isSelected =
_selectedBlocked.contains(utxo) ||
_selectedAvailable.contains(utxo);
return UtxoCard(
key: Key(
"${utxo.walletId}_${utxo.id}_$isSelected",
),
walletId: widget.walletId,
utxo: utxo,
canSelect: widget.type ==
CoinControlViewType.manage ||
(widget.type == CoinControlViewType.use &&
!utxo.isBlocked &&
utxo.isConfirmed(
currentHeight,
minConfirms,
)),
initialSelectedState: isSelected,
onSelectedChanged: (value) {
if (value) {
utxo.isBlocked
? _selectedBlocked.add(utxo)
: _selectedAvailable.add(utxo);
} else {
utxo.isBlocked
? _selectedBlocked.remove(utxo)
: _selectedAvailable.remove(utxo);
}
setState(() {});
},
onPressed: () async {
final result =
await Navigator.of(context).pushNamed(
UtxoDetailsView.routeName,
arguments: Tuple2(
utxo.id,
widget.walletId,
),
);
if (mounted && result == "refresh") {
setState(() {});
}
},
);
},
),
),
if (!_isSearching)
_list != null
? Expanded(
child: ListView.separated(
itemCount: _list!.length,
separatorBuilder: (context, _) =>
const SizedBox(
height: 10,
),
itemBuilder: (context, index) {
final utxo = MainDB.instance.isar.utxos
.where()
.idEqualTo(_list![index])
.findFirstSync()!;
final isSelected = _showBlocked
? _selectedBlocked.contains(utxo)
: _selectedAvailable.contains(utxo);
return UtxoCard(
key: Key(
"${utxo.walletId}_${utxo.id}_$isSelected",
),
walletId: widget.walletId,
utxo: utxo,
canSelect: widget.type ==
CoinControlViewType.manage ||
(widget.type ==
CoinControlViewType.use &&
!_showBlocked &&
utxo.isConfirmed(
currentHeight,
minConfirms,
)),
initialSelectedState: isSelected,
onSelectedChanged: (value) {
if (value) {
_showBlocked
? _selectedBlocked.add(utxo)
: _selectedAvailable.add(utxo);
} else {
_showBlocked
? _selectedBlocked.remove(utxo)
: _selectedAvailable
.remove(utxo);
}
setState(() {});
},
onPressed: () async {
final result =
await Navigator.of(context)
.pushNamed(
UtxoDetailsView.routeName,
arguments: Tuple2(
utxo.id,
widget.walletId,
),
);
if (mounted && result == "refresh") {
setState(() {});
}
},
);
},
),
)
: Expanded(
child: ListView.separated(
itemCount: _map!.entries.length,
separatorBuilder: (context, _) =>
const SizedBox(
height: 10,
),
itemBuilder: (context, index) {
final entry =
_map!.entries.elementAt(index);
final _controller =
RotateIconController();
return Expandable2(
border: Theme.of(context)
.extension<StackColors>()!
.backgroundAppBar,
background: Theme.of(context)
.extension<StackColors>()!
.popupBG,
animationDurationMultiplier:
0.2 * entry.value.length,
onExpandWillChange: (state) {
if (state ==
Expandable2State.expanded) {
_controller.forward?.call();
} else {
_controller.reverse?.call();
}
},
header: RoundedContainer(
padding: const EdgeInsets.all(14),
color: Colors.transparent,
child: Row(
children: [
Expanded(
child: Column(
crossAxisAlignment:
CrossAxisAlignment.start,
children: [
Text(
entry.key,
style:
STextStyles.w600_14(
context,
),
),
const SizedBox(
height: 2,
),
Text(
"${entry.value.length} "
"output${entry.value.length > 1 ? "s" : ""}",
style:
STextStyles.w500_12(
context,
).copyWith(
color: Theme.of(context)
.extension<
StackColors>()!
.textSubtitle1,
),
),
],
),
),
RotateIcon(
animationDurationMultiplier:
0.2 * entry.value.length,
icon: SvgPicture.asset(
Assets.svg.chevronDown,
width: 14,
color: Theme.of(context)
.extension<StackColors>()!
.textSubtitle1,
),
curve: Curves.easeInOut,
controller: _controller,
),
],
),
),
children: entry.value.map(
(id) {
final utxo = MainDB
.instance.isar.utxos
.where()
.idEqualTo(id)
.findFirstSync()!;
final isSelected = _selectedBlocked
.contains(utxo) ||
_selectedAvailable
.contains(utxo);
return UtxoCard(
key: Key(
"${utxo.walletId}_${utxo.id}_$isSelected",
),
walletId: widget.walletId,
utxo: utxo,
canSelect: widget.type ==
CoinControlViewType
.manage ||
(widget.type ==
CoinControlViewType
.use &&
!utxo.isBlocked &&
utxo.isConfirmed(
currentHeight,
minConfirms,
)),
initialSelectedState: isSelected,
onSelectedChanged: (value) {
if (value) {
utxo.isBlocked
? _selectedBlocked
.add(utxo)
: _selectedAvailable
.add(utxo);
} else {
utxo.isBlocked
? _selectedBlocked
.remove(utxo)
: _selectedAvailable
.remove(utxo);
}
setState(() {});
},
onPressed: () async {
final result =
await Navigator.of(context)
.pushNamed(
UtxoDetailsView.routeName,
arguments: Tuple2(
utxo.id,
widget.walletId,
),
);
if (mounted &&
result == "refresh") {
setState(() {});
}
},
);
},
).toList(),
);
},
),
),
],
),
),
),
if (((_showBlocked && _selectedBlocked.isNotEmpty) ||
(!_showBlocked && _selectedAvailable.isNotEmpty)) &&
widget.type == CoinControlViewType.manage)
Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.backgroundAppBar,
boxShadow: [
Theme.of(context)
.extension<StackColors>()!
.standardBoxShadow,
],
),
child: Padding(
padding: const EdgeInsets.all(16),
child: SecondaryButton(
label: _showBlocked ? "Unfreeze" : "Freeze",
onPressed: () async {
if (_showBlocked) {
await MainDB.instance.putUTXOs(
_selectedBlocked
.map(
(e) => e.copyWith(
isBlocked: false,
),
)
.toList(),
);
_selectedBlocked.clear();
} else {
await MainDB.instance.putUTXOs(
_selectedAvailable
.map(
(e) => e.copyWith(
isBlocked: true,
),
)
.toList(),
);
_selectedAvailable.clear();
}
setState(() {});
},
),
),
),
if (!_showBlocked && widget.type == CoinControlViewType.use)
Container(
decoration: BoxDecoration(
color: Theme.of(context)
.extension<StackColors>()!
.backgroundAppBar,
boxShadow: [
Theme.of(context)
.extension<StackColors>()!
.standardBoxShadow,
],
),
child: Padding(
padding: const EdgeInsets.all(16),
child: Column(
children: [
RoundedWhiteContainer(
padding: const EdgeInsets.all(0),
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(12),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
"Selected amount",
style: STextStyles.w600_14(context),
),
Builder(
builder: (context) {
final int selectedSumInt =
_selectedAvailable.isEmpty
? 0
: _selectedAvailable
.map((e) => e.value)
.reduce(
(value, element) =>
value += element,
);
final selectedSum =
selectedSumInt.toAmountAsRaw(
fractionDigits: coin.fractionDigits,
);
return Text(
ref
.watch(pAmountFormatter(coin))
.format(selectedSum),
style: widget.requestedTotal == null
? STextStyles.w600_14(context)
: STextStyles.w600_14(context)
.copyWith(
color: selectedSum >=
widget
.requestedTotal!
? Theme.of(context)
.extension<
StackColors>()!
.accentColorGreen
: Theme.of(context)
.extension<
StackColors>()!
.accentColorRed,
),
);
},
),
],
),
),
if (widget.requestedTotal != null)
Container(
width: double.infinity,
height: 1.5,
color: Theme.of(context)
.extension<StackColors>()!
.backgroundAppBar,
),
if (widget.requestedTotal != null)
Padding(
padding: const EdgeInsets.all(12),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
"Amount to send",
style: STextStyles.w600_14(context),
),
Text(
ref
.watch(pAmountFormatter(coin))
.format(widget.requestedTotal!),
style: STextStyles.w600_14(context),
),
],
),
),
],
),
),
const SizedBox(
height: 12,
),
PrimaryButton(
label: "Use coins",
enabled: _selectedAvailable.isNotEmpty,
onPressed: () async {
if (searchFocus.hasFocus) {
searchFocus.unfocus();
}
Navigator.of(context).pop(
_selectedAvailable,
);
},
),
],
),
),
),
],
),
),
),
),
);
}
}