restyle coin and fiat selection widgets

and:
 - available -> supported
 - do not load simplex data on desktop menu item action
This commit is contained in:
sneurlax 2023-01-13 13:14:56 -06:00
parent 44d3c26385
commit 61c971973c
6 changed files with 182 additions and 54 deletions

View file

@ -2,7 +2,7 @@
// import 'package:stackwallet/models/buy/response_objects/fiat.dart'; // import 'package:stackwallet/models/buy/response_objects/fiat.dart';
// import 'package:stackwallet/models/buy/response_objects/pair.dart'; // import 'package:stackwallet/models/buy/response_objects/pair.dart';
class SimplexAvailableCurrencies { class SimplexSupportedCurrencies {
dynamic supportedCryptos = []; dynamic supportedCryptos = [];
dynamic supportedFiats = []; dynamic supportedFiats = [];

View file

@ -1,6 +1,7 @@
import 'package:decimal/decimal.dart'; import 'package:decimal/decimal.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/models/buy/response_objects/crypto.dart'; import 'package:stackwallet/models/buy/response_objects/crypto.dart';
import 'package:stackwallet/models/buy/response_objects/fiat.dart'; import 'package:stackwallet/models/buy/response_objects/fiat.dart';
import 'package:stackwallet/models/buy/response_objects/pair.dart'; import 'package:stackwallet/models/buy/response_objects/pair.dart';
@ -8,6 +9,7 @@ import 'package:stackwallet/pages/buy_view/sub_widgets/crypto_selection_view.dar
import 'package:stackwallet/pages/buy_view/sub_widgets/fiat_crypto_toggle.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/providers/providers.dart'; import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/enums/coin_enum.dart'; import 'package:stackwallet/utilities/enums/coin_enum.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
@ -15,6 +17,7 @@ import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/utilities/util.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_container.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart';
import 'package:stackwallet/widgets/textfields/buy_textfield.dart'; import 'package:stackwallet/widgets/textfields/buy_textfield.dart';
@ -43,6 +46,8 @@ class _BuyFormState extends ConsumerState<BuyForm> {
final FocusNode _cryptoFocusNode = FocusNode(); final FocusNode _cryptoFocusNode = FocusNode();
bool buyWithFiat = true; bool buyWithFiat = true;
bool _hovering1 = false;
bool _hovering2 = false;
void fiatFieldOnChanged(String value) async { void fiatFieldOnChanged(String value) async {
if (_fiatFocusNode.hasFocus) { if (_fiatFocusNode.hasFocus) {
@ -80,6 +85,7 @@ class _BuyFormState extends ConsumerState<BuyForm> {
void selectCrypto() async { void selectCrypto() async {
final fromTicker = ref.read(buyFormStateProvider).fromTicker ?? "-"; final fromTicker = ref.read(buyFormStateProvider).fromTicker ?? "-";
final supportedCoins = ref.watch(addWalletSelectedCoinStateProvider);
// ref.read(estimatedRateExchangeFormProvider).from?.ticker ?? "-"; // ref.read(estimatedRateExchangeFormProvider).from?.ticker ?? "-";
// if (walletInitiated && // if (walletInitiated &&
@ -488,30 +494,91 @@ class _BuyFormState extends ConsumerState<BuyForm> {
SizedBox( SizedBox(
height: isDesktop ? 10 : 4, height: isDesktop ? 10 : 4,
), ),
BuyTextField(
controller: _cryptoController, // textStyle: STextStyles.smallMed14(context).copyWith(
focusNode: _cryptoFocusNode, // color: Theme.of(context).extension<StackColors>()!.textDark,
textStyle: STextStyles.smallMed14(context).copyWith( // ),
color: Theme.of(context).extension<StackColors>()!.textDark, // buttonColor:
// Theme.of(context).extension<StackColors>()!.buttonBackSecondary,
// borderRadius: Constants.size.circularBorderRadius,
// background:
// Theme.of(context).extension<StackColors>()!.textFieldDefaultBG,
MouseRegion(
cursor: SystemMouseCursors.click,
onEnter: (_) => setState(() => _hovering1 = true),
onExit: (_) => setState(() => _hovering1 = false),
child: GestureDetector(
onTap: () {
selectCrypto();
},
child: RoundedContainer(
padding: const EdgeInsets.symmetric(vertical: 6, horizontal: 6),
color: _hovering1
? Theme.of(context)
.extension<StackColors>()!
.highlight
.withOpacity(_hovering1 ? 0.3 : 0)
: Theme.of(context)
.extension<StackColors>()!
.textFieldDefaultBG,
child: Padding(
padding: const EdgeInsets.all(12),
child: Row(children: <Widget>[
SvgPicture.asset(
Assets.svg.iconFor(
coin: coinFromTickerCaseInsensitive("BTC"),
),
height: 18,
width: 18,
),
const SizedBox(
width: 10,
),
Expanded(
child: Text(
"BTC",
style: STextStyles.largeMedium14(context),
)),
SvgPicture.asset(
Assets.svg.chevronDown,
color: Theme.of(context)
.extension<StackColors>()!
.buttonTextSecondaryDisabled,
width: 10,
height: 5,
),
]),
),
),
), ),
buttonColor:
Theme.of(context).extension<StackColors>()!.buttonBackSecondary,
borderRadius: Constants.size.circularBorderRadius,
background:
Theme.of(context).extension<StackColors>()!.textFieldDefaultBG,
onTap: () {
if (_cryptoController.text == "-") {
_cryptoController.text = "";
}
},
onChanged: cryptoFieldOnChanged,
onButtonTap: selectCrypto,
isWalletCoin: isWalletCoin(coin, true),
image: _fetchIconUrlFromTicker(ref
.watch(buyFormStateProvider.select((value) => value.fromTicker))),
ticker: ref
.watch(buyFormStateProvider.select((value) => value.fromTicker)),
), ),
// BuyTextField(
// //BuyCurrencySelect(
// controller: _cryptoController,
// focusNode: _cryptoFocusNode,
// textStyle: STextStyles.smallMed14(context).copyWith(
// color: Theme.of(context).extension<StackColors>()!.textDark,
// ),
// buttonColor:
// Theme.of(context).extension<StackColors>()!.buttonBackSecondary,
// borderRadius: Constants.size.circularBorderRadius,
// background:
// Theme.of(context).extension<StackColors>()!.textFieldDefaultBG,
// onTap: () {
// if (_cryptoController.text == "-") {
// _cryptoController.text = "";
// }
// },
// onChanged: cryptoFieldOnChanged,
// onButtonTap: selectCrypto,
// isWalletCoin: isWalletCoin(coin, true),
// image: _fetchIconUrlFromTicker(ref
// .watch(buyFormStateProvider.select((value) => value.fromTicker))),
// ticker: ref
// .watch(buyFormStateProvider.select((value) => value.fromTicker)),
// ),
SizedBox( SizedBox(
height: isDesktop ? 20 : 12, height: isDesktop ? 20 : 12,
), ),
@ -530,32 +597,95 @@ class _BuyFormState extends ConsumerState<BuyForm> {
SizedBox( SizedBox(
height: isDesktop ? 10 : 4, height: isDesktop ? 10 : 4,
), ),
BuyTextField(
controller: _fiatController, MouseRegion(
focusNode: _fiatFocusNode, cursor: SystemMouseCursors.click,
textStyle: STextStyles.smallMed14(context).copyWith( onEnter: (_) => setState(() => _hovering2 = true),
color: Theme.of(context).extension<StackColors>()!.textDark, onExit: (_) => setState(() => _hovering2 = false),
child: GestureDetector(
onTap: () {
selectFiat();
},
child: RoundedContainer(
padding: const EdgeInsets.symmetric(vertical: 3, horizontal: 6),
color: _hovering2
? Theme.of(context)
.extension<StackColors>()!
.highlight
.withOpacity(_hovering2 ? 0.3 : 0)
: Theme.of(context)
.extension<StackColors>()!
.textFieldDefaultBG,
child: Padding(
padding: const EdgeInsets.all(12),
child: Row(children: <Widget>[
RoundedContainer(
radiusMultiplier: 0.5,
padding:
const EdgeInsets.symmetric(vertical: 2, horizontal: 4),
color:
Theme.of(context).extension<StackColors>()!.highlight,
child: Text(
"\$",
style: STextStyles.itemSubtitle12(context),
),
),
// SvgPicture.asset(
// Assets.svg.iconFor(
// coin: coinFromTickerCaseInsensitive("BTC"),
// ),
// height: 18,
// width: 18,
// ),
const SizedBox(
width: 10,
),
Expanded(
child: Text(
"USD",
style: STextStyles.largeMedium14(context),
)),
SvgPicture.asset(
Assets.svg.chevronDown,
color: Theme.of(context)
.extension<StackColors>()!
.buttonTextSecondaryDisabled,
width: 10,
height: 5,
),
]),
),
),
), ),
buttonColor:
Theme.of(context).extension<StackColors>()!.buttonBackSecondary,
borderRadius: Constants.size.circularBorderRadius,
background:
Theme.of(context).extension<StackColors>()!.textFieldDefaultBG,
onTap: () {
if (_fiatController.text == "-") {
_fiatController.text = "";
}
},
onChanged: fiatFieldOnChanged,
onButtonTap: selectFiat,
isWalletCoin: isWalletCoin(coin, true),
image: _fetchIconUrlFromTicker(ref
.watch(buyFormStateProvider.select((value) => value.fromTicker))),
ticker: ref
.watch(buyFormStateProvider.select((value) => value.fromTicker)),
), ),
// BuyTextField(
// //)BuyCurrencySelect(
// controller: _fiatController,
// focusNode: _fiatFocusNode,
// textStyle: STextStyles.smallMed14(context).copyWith(
// color: Theme.of(context).extension<StackColors>()!.textDark,
// ),
// buttonColor:
// Theme.of(context).extension<StackColors>()!.buttonBackSecondary,
// borderRadius: Constants.size.circularBorderRadius,
// background:
// Theme.of(context).extension<StackColors>()!.textFieldDefaultBG,
// onTap: () {
// if (_fiatController.text == "-") {
// _fiatController.text = "";
// }
// },
// onChanged: fiatFieldOnChanged,
// onButtonTap: selectFiat,
// isWalletCoin: isWalletCoin(coin, true),
// image: _fetchIconUrlFromTicker(ref
// .watch(buyFormStateProvider.select((value) => value.fromTicker))),
// ticker: ref
// .watch(buyFormStateProvider.select((value) => value.fromTicker)),
// ),
SizedBox( SizedBox(
height: isDesktop ? 20 : 12, height: isDesktop ? 10 : 4,
), ),
Row( Row(
crossAxisAlignment: CrossAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end,

View file

@ -167,9 +167,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
icon: const DesktopBuyIcon(), icon: const DesktopBuyIcon(),
label: "Buy crypto", label: "Buy crypto",
value: DesktopMenuItemId.buy, value: DesktopMenuItemId.buy,
onChanged: (_) { onChanged: updateSelectedMenuItem,
_buyDataLoadingService.loadAll(ref);
},
controller: controllers[2], controller: controllers[2],
), ),
const SizedBox( const SizedBox(

View file

@ -1,6 +1,6 @@
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:stackwallet/models/buy/simplex/simplex_supported_currencies.dart'; import 'package:stackwallet/models/buy/simplex/simplex_supported_currencies.dart';
final availableSimplexCurrenciesProvider = Provider<SimplexAvailableCurrencies>( final supportedSimplexCurrenciesProvider = Provider<SimplexSupportedCurrencies>(
(ref) => SimplexAvailableCurrencies(), (ref) => SimplexSupportedCurrencies(),
); );

View file

@ -1,4 +1,4 @@
export './buy/available_simplex_currencies_provider.dart'; export './buy/simplex_supported_currencies_provider.dart';
export './buy/buy_form_state_provider.dart'; export './buy/buy_form_state_provider.dart';
export './buy/simplex_initial_load_status.dart'; export './buy/simplex_initial_load_status.dart';
export './exchange/available_changenow_currencies_provider.dart'; export './exchange/available_changenow_currencies_provider.dart';

View file

@ -31,7 +31,7 @@ class BuyDataLoadingService {
if (response['supportedCryptos'] != null) { if (response['supportedCryptos'] != null) {
print(response['supportedCryptos']); print(response['supportedCryptos']);
ref ref
.read(availableSimplexCurrenciesProvider) .read(supportedSimplexCurrenciesProvider)
.updateSupportedCryptos(response['supportedCryptos']!); .updateSupportedCryptos(response['supportedCryptos']!);
} else { } else {
error = true; error = true;
@ -43,7 +43,7 @@ class BuyDataLoadingService {
if (response['supportedFiats'] != null) { if (response['supportedFiats'] != null) {
print(response['supportedFiats']); print(response['supportedFiats']);
ref ref
.read(availableSimplexCurrenciesProvider) .read(supportedSimplexCurrenciesProvider)
.updateSupportedFiats(response['supportedFiats']!); .updateSupportedFiats(response['supportedFiats']!);
} else { } else {
error = true; error = true;