mirror of
https://github.com/cypherstack/stack_wallet.git
synced 2024-12-23 11:59:30 +00:00
use simple setState for toggling between buy with crypto/fiat and store current selected crypto/fiat values in state vars and update ui accordingly
This commit is contained in:
parent
650ae9fe09
commit
9286ae9902
3 changed files with 90 additions and 124 deletions
|
@ -11,7 +11,6 @@ import 'package:stackwallet/models/buy/response_objects/quote.dart';
|
||||||
import 'package:stackwallet/pages/address_book_views/address_book_view.dart';
|
import 'package:stackwallet/pages/address_book_views/address_book_view.dart';
|
||||||
import 'package:stackwallet/pages/buy_view/buy_quote_preview.dart';
|
import 'package:stackwallet/pages/buy_view/buy_quote_preview.dart';
|
||||||
import 'package:stackwallet/pages/buy_view/sub_widgets/crypto_selection_view.dart';
|
import 'package:stackwallet/pages/buy_view/sub_widgets/crypto_selection_view.dart';
|
||||||
import 'package:stackwallet/pages/buy_view/sub_widgets/fiat_crypto_toggle.dart';
|
|
||||||
import 'package:stackwallet/pages/buy_view/sub_widgets/fiat_selection_view.dart';
|
import 'package:stackwallet/pages/buy_view/sub_widgets/fiat_selection_view.dart';
|
||||||
import 'package:stackwallet/pages/exchange_view/choose_from_stack_view.dart';
|
import 'package:stackwallet/pages/exchange_view/choose_from_stack_view.dart';
|
||||||
import 'package:stackwallet/providers/providers.dart';
|
import 'package:stackwallet/providers/providers.dart';
|
||||||
|
@ -352,9 +351,6 @@ class _BuyFormState extends ConsumerState<BuyForm> {
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
debugPrint("BUILD: $runtimeType");
|
debugPrint("BUILD: $runtimeType");
|
||||||
|
|
||||||
buyWithFiat = ref.watch(
|
|
||||||
prefsChangeNotifierProvider.select((value) => value.buyWithFiat));
|
|
||||||
|
|
||||||
return ConditionalParent(
|
return ConditionalParent(
|
||||||
condition: isDesktop,
|
condition: isDesktop,
|
||||||
builder: (child) => SizedBox(
|
builder: (child) => SizedBox(
|
||||||
|
@ -409,31 +405,34 @@ class _BuyFormState extends ConsumerState<BuyForm> {
|
||||||
.textFieldDefaultBG,
|
.textFieldDefaultBG,
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(12),
|
padding: const EdgeInsets.all(12),
|
||||||
child: Row(children: <Widget>[
|
child: Row(
|
||||||
SvgPicture.asset(
|
children: <Widget>[
|
||||||
Assets.svg.iconFor(
|
SvgPicture.asset(
|
||||||
coin: coinFromTickerCaseInsensitive("BTC"),
|
Assets.svg.iconFor(
|
||||||
|
coin: coinFromTickerCaseInsensitive("BTC"),
|
||||||
|
),
|
||||||
|
height: 18,
|
||||||
|
width: 18,
|
||||||
),
|
),
|
||||||
height: 18,
|
const SizedBox(
|
||||||
width: 18,
|
width: 10,
|
||||||
),
|
),
|
||||||
const SizedBox(
|
Expanded(
|
||||||
width: 10,
|
|
||||||
),
|
|
||||||
Expanded(
|
|
||||||
child: Text(
|
child: Text(
|
||||||
"BTC",
|
selectedCrypto?.ticker ?? "ERR",
|
||||||
style: STextStyles.largeMedium14(context),
|
style: STextStyles.largeMedium14(context),
|
||||||
)),
|
),
|
||||||
SvgPicture.asset(
|
),
|
||||||
Assets.svg.chevronDown,
|
SvgPicture.asset(
|
||||||
color: Theme.of(context)
|
Assets.svg.chevronDown,
|
||||||
.extension<StackColors>()!
|
color: Theme.of(context)
|
||||||
.buttonTextSecondaryDisabled,
|
.extension<StackColors>()!
|
||||||
width: 10,
|
.buttonTextSecondaryDisabled,
|
||||||
height: 5,
|
width: 10,
|
||||||
),
|
height: 5,
|
||||||
]),
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
@ -457,7 +456,6 @@ class _BuyFormState extends ConsumerState<BuyForm> {
|
||||||
SizedBox(
|
SizedBox(
|
||||||
height: isDesktop ? 10 : 4,
|
height: isDesktop ? 10 : 4,
|
||||||
),
|
),
|
||||||
|
|
||||||
MouseRegion(
|
MouseRegion(
|
||||||
cursor: SystemMouseCursors.click,
|
cursor: SystemMouseCursors.click,
|
||||||
onEnter: (_) => setState(() => _hovering2 = true),
|
onEnter: (_) => setState(() => _hovering2 = true),
|
||||||
|
@ -479,43 +477,46 @@ class _BuyFormState extends ConsumerState<BuyForm> {
|
||||||
.textFieldDefaultBG,
|
.textFieldDefaultBG,
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(12),
|
padding: const EdgeInsets.all(12),
|
||||||
child: Row(children: <Widget>[
|
child: Row(
|
||||||
RoundedContainer(
|
children: <Widget>[
|
||||||
radiusMultiplier: 0.5,
|
RoundedContainer(
|
||||||
padding: const EdgeInsets.symmetric(
|
radiusMultiplier: 0.5,
|
||||||
vertical: 2, horizontal: 4),
|
padding: const EdgeInsets.symmetric(
|
||||||
color: Theme.of(context)
|
vertical: 2, horizontal: 4),
|
||||||
.extension<StackColors>()!
|
color: Theme.of(context)
|
||||||
.highlight,
|
.extension<StackColors>()!
|
||||||
child: Text(
|
.highlight,
|
||||||
"\$",
|
|
||||||
style: STextStyles.itemSubtitle12(context),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
// SvgPicture.asset(
|
|
||||||
// Assets.svg.iconFor(
|
|
||||||
// coin: coinFromTickerCaseInsensitive("BTC"),
|
|
||||||
// ),
|
|
||||||
// height: 18,
|
|
||||||
// width: 18,
|
|
||||||
// ),
|
|
||||||
const SizedBox(
|
|
||||||
width: 10,
|
|
||||||
),
|
|
||||||
Expanded(
|
|
||||||
child: Text(
|
child: Text(
|
||||||
"USD",
|
"\$",
|
||||||
style: STextStyles.largeMedium14(context),
|
style: STextStyles.itemSubtitle12(context),
|
||||||
)),
|
),
|
||||||
SvgPicture.asset(
|
),
|
||||||
Assets.svg.chevronDown,
|
// SvgPicture.asset(
|
||||||
color: Theme.of(context)
|
// Assets.svg.iconFor(
|
||||||
.extension<StackColors>()!
|
// coin: coinFromTickerCaseInsensitive("BTC"),
|
||||||
.buttonTextSecondaryDisabled,
|
// ),
|
||||||
width: 10,
|
// height: 18,
|
||||||
height: 5,
|
// width: 18,
|
||||||
),
|
// ),
|
||||||
]),
|
const SizedBox(
|
||||||
|
width: 10,
|
||||||
|
),
|
||||||
|
Expanded(
|
||||||
|
child: Text(
|
||||||
|
selectedFiat?.ticker ?? "ERR",
|
||||||
|
style: STextStyles.largeMedium14(context),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
SvgPicture.asset(
|
||||||
|
Assets.svg.chevronDown,
|
||||||
|
color: Theme.of(context)
|
||||||
|
.extension<StackColors>()!
|
||||||
|
.buttonTextSecondaryDisabled,
|
||||||
|
width: 10,
|
||||||
|
height: 5,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
@ -534,12 +535,16 @@ class _BuyFormState extends ConsumerState<BuyForm> {
|
||||||
Theme.of(context).extension<StackColors>()!.textDark3,
|
Theme.of(context).extension<StackColors>()!.textDark3,
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const FiatCryptoToggle(),
|
BlueTextButton(
|
||||||
|
text: buyWithFiat ? "Use crypto amount" : "Use fiat amount",
|
||||||
|
onTap: () {
|
||||||
|
setState(() {
|
||||||
|
buyWithFiat = !buyWithFiat;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
)
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
// // these reads should be watch
|
|
||||||
// if (ref.watch(buyFormStateProvider).fromAmount != null &&
|
|
||||||
// ref.watch(buyFormStateProvider).fromAmount != Decimal.zero)
|
|
||||||
SizedBox(
|
SizedBox(
|
||||||
height: isDesktop ? 10 : 4,
|
height: isDesktop ? 10 : 4,
|
||||||
),
|
),
|
||||||
|
@ -560,13 +565,20 @@ class _BuyFormState extends ConsumerState<BuyForm> {
|
||||||
),
|
),
|
||||||
textAlign: TextAlign.right,
|
textAlign: TextAlign.right,
|
||||||
inputFormatters: [
|
inputFormatters: [
|
||||||
// TODO reactivate formatter
|
// regex to validate a crypto amount with 8 decimal places or
|
||||||
// regex to validate a crypto amount with 8 decimal places
|
// 2 if fiat
|
||||||
// TextInputFormatter.withFunction((oldValue, newValue) =>
|
TextInputFormatter.withFunction(
|
||||||
// RegExp(r'^([0-9]*[,.]?[0-9]{0,8}|[,.][0-9]{0,8})$')
|
(oldValue, newValue) {
|
||||||
// .hasMatch(newValue.text)
|
final regexString = buyWithFiat
|
||||||
// ? newValue
|
? r'^([0-9]*[,.]?[0-9]{0,2}|[,.][0-9]{0,2})$'
|
||||||
// : oldValue),
|
: r'^([0-9]*[,.]?[0-9]{0,8}|[,.][0-9]{0,8})$';
|
||||||
|
|
||||||
|
// return RegExp(r'^([0-9]*[,.]?[0-9]{0,8}|[,.][0-9]{0,8})$')
|
||||||
|
return RegExp(regexString).hasMatch(newValue.text)
|
||||||
|
? newValue
|
||||||
|
: oldValue;
|
||||||
|
},
|
||||||
|
),
|
||||||
],
|
],
|
||||||
decoration: InputDecoration(
|
decoration: InputDecoration(
|
||||||
contentPadding: const EdgeInsets.only(
|
contentPadding: const EdgeInsets.only(
|
||||||
|
@ -585,7 +597,9 @@ class _BuyFormState extends ConsumerState<BuyForm> {
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(12),
|
padding: const EdgeInsets.all(12),
|
||||||
child: Text(
|
child: Text(
|
||||||
"BTC",
|
buyWithFiat
|
||||||
|
? selectedFiat?.ticker ?? "ERR"
|
||||||
|
: selectedCrypto?.ticker ?? "ERR",
|
||||||
style: STextStyles.smallMed14(context).copyWith(
|
style: STextStyles.smallMed14(context).copyWith(
|
||||||
color: Theme.of(context)
|
color: Theme.of(context)
|
||||||
.extension<StackColors>()!
|
.extension<StackColors>()!
|
||||||
|
|
|
@ -1,28 +0,0 @@
|
||||||
import 'package:flutter/material.dart';
|
|
||||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
||||||
import 'package:stackwallet/providers/providers.dart';
|
|
||||||
import 'package:stackwallet/widgets/custom_buttons/blue_text_button.dart';
|
|
||||||
|
|
||||||
class FiatCryptoToggle extends ConsumerWidget {
|
|
||||||
const FiatCryptoToggle({
|
|
||||||
Key? key,
|
|
||||||
}) : super(key: key);
|
|
||||||
|
|
||||||
@override
|
|
||||||
Widget build(BuildContext context, WidgetRef ref) {
|
|
||||||
debugPrint("BUILD: $runtimeType");
|
|
||||||
|
|
||||||
return BlueTextButton(
|
|
||||||
text: ref.watch(
|
|
||||||
prefsChangeNotifierProvider.select((value) => value.buyWithFiat))
|
|
||||||
? "Use crypto amount"
|
|
||||||
: "Use fiat amount",
|
|
||||||
textSize: 14,
|
|
||||||
onTap: () {
|
|
||||||
final buyWithFiat = ref.read(prefsChangeNotifierProvider).buyWithFiat;
|
|
||||||
ref.read(prefsChangeNotifierProvider).buyWithFiat = !buyWithFiat;
|
|
||||||
// Navigator.of(context).pop();
|
|
||||||
},
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -38,7 +38,6 @@ class Prefs extends ChangeNotifier {
|
||||||
_startupWalletId = await _getStartupWalletId();
|
_startupWalletId = await _getStartupWalletId();
|
||||||
_externalCalls = await _getHasExternalCalls();
|
_externalCalls = await _getHasExternalCalls();
|
||||||
_familiarity = await _getHasFamiliarity();
|
_familiarity = await _getHasFamiliarity();
|
||||||
_buyWithFiat = await _getBuyWithFiat();
|
|
||||||
|
|
||||||
_initialized = true;
|
_initialized = true;
|
||||||
}
|
}
|
||||||
|
@ -351,25 +350,6 @@ class Prefs extends ChangeNotifier {
|
||||||
0;
|
0;
|
||||||
}
|
}
|
||||||
|
|
||||||
// buy with fiat (default) or crypto
|
|
||||||
bool _buyWithFiat = true;
|
|
||||||
bool get buyWithFiat => _buyWithFiat;
|
|
||||||
|
|
||||||
set buyWithFiat(bool buyWithFiat) {
|
|
||||||
if (this.buyWithFiat != buyWithFiat) {
|
|
||||||
DB.instance.put<dynamic>(
|
|
||||||
boxName: DB.boxNamePrefs, key: "buyWithFiat", value: buyWithFiat);
|
|
||||||
_buyWithFiat = buyWithFiat;
|
|
||||||
notifyListeners();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Future<bool> _getBuyWithFiat() async {
|
|
||||||
return await DB.instance.get<dynamic>(
|
|
||||||
boxName: DB.boxNamePrefs, key: "buyWithFiat") as bool? ??
|
|
||||||
true;
|
|
||||||
}
|
|
||||||
|
|
||||||
// show testnet coins
|
// show testnet coins
|
||||||
|
|
||||||
bool _showTestNetCoins = false;
|
bool _showTestNetCoins = false;
|
||||||
|
|
Loading…
Reference in a new issue