From 61c971973c8499b417a4602742fd72989ca0af93 Mon Sep 17 00:00:00 2001 From: sneurlax Date: Fri, 13 Jan 2023 13:14:56 -0600 Subject: [PATCH] restyle coin and fiat selection widgets and: - available -> supported - do not load simplex data on desktop menu item action --- .../simplex/simplex_supported_currencies.dart | 2 +- lib/pages/buy_view/buy_form.dart | 220 ++++++++++++++---- lib/pages_desktop_specific/desktop_menu.dart | 4 +- ...implex_supported_currencies_provider.dart} | 4 +- lib/providers/providers.dart | 2 +- .../buy/buy_data_loading_service.dart | 4 +- 6 files changed, 182 insertions(+), 54 deletions(-) rename lib/providers/buy/{available_simplex_currencies_provider.dart => simplex_supported_currencies_provider.dart} (54%) diff --git a/lib/models/buy/simplex/simplex_supported_currencies.dart b/lib/models/buy/simplex/simplex_supported_currencies.dart index 9f961ff0e..48f30809d 100644 --- a/lib/models/buy/simplex/simplex_supported_currencies.dart +++ b/lib/models/buy/simplex/simplex_supported_currencies.dart @@ -2,7 +2,7 @@ // import 'package:stackwallet/models/buy/response_objects/fiat.dart'; // import 'package:stackwallet/models/buy/response_objects/pair.dart'; -class SimplexAvailableCurrencies { +class SimplexSupportedCurrencies { dynamic supportedCryptos = []; dynamic supportedFiats = []; diff --git a/lib/pages/buy_view/buy_form.dart b/lib/pages/buy_view/buy_form.dart index 68996e672..6bfbe62d4 100644 --- a/lib/pages/buy_view/buy_form.dart +++ b/lib/pages/buy_view/buy_form.dart @@ -1,6 +1,7 @@ import 'package:decimal/decimal.dart'; import 'package:flutter/material.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/fiat.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_selection_view.dart'; import 'package:stackwallet/providers/providers.dart'; +import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/enums/coin_enum.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/widgets/desktop/desktop_dialog.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/textfields/buy_textfield.dart'; @@ -43,6 +46,8 @@ class _BuyFormState extends ConsumerState { final FocusNode _cryptoFocusNode = FocusNode(); bool buyWithFiat = true; + bool _hovering1 = false; + bool _hovering2 = false; void fiatFieldOnChanged(String value) async { if (_fiatFocusNode.hasFocus) { @@ -80,6 +85,7 @@ class _BuyFormState extends ConsumerState { void selectCrypto() async { final fromTicker = ref.read(buyFormStateProvider).fromTicker ?? "-"; + final supportedCoins = ref.watch(addWalletSelectedCoinStateProvider); // ref.read(estimatedRateExchangeFormProvider).from?.ticker ?? "-"; // if (walletInitiated && @@ -488,30 +494,91 @@ class _BuyFormState extends ConsumerState { SizedBox( height: isDesktop ? 10 : 4, ), - BuyTextField( - controller: _cryptoController, - focusNode: _cryptoFocusNode, - textStyle: STextStyles.smallMed14(context).copyWith( - color: Theme.of(context).extension()!.textDark, + + // textStyle: STextStyles.smallMed14(context).copyWith( + // color: Theme.of(context).extension()!.textDark, + // ), + // buttonColor: + // Theme.of(context).extension()!.buttonBackSecondary, + // borderRadius: Constants.size.circularBorderRadius, + // background: + // Theme.of(context).extension()!.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()! + .highlight + .withOpacity(_hovering1 ? 0.3 : 0) + : Theme.of(context) + .extension()! + .textFieldDefaultBG, + child: Padding( + padding: const EdgeInsets.all(12), + child: Row(children: [ + 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()! + .buttonTextSecondaryDisabled, + width: 10, + height: 5, + ), + ]), + ), + ), ), - buttonColor: - Theme.of(context).extension()!.buttonBackSecondary, - borderRadius: Constants.size.circularBorderRadius, - background: - Theme.of(context).extension()!.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()!.textDark, + // ), + // buttonColor: + // Theme.of(context).extension()!.buttonBackSecondary, + // borderRadius: Constants.size.circularBorderRadius, + // background: + // Theme.of(context).extension()!.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( height: isDesktop ? 20 : 12, ), @@ -530,32 +597,95 @@ class _BuyFormState extends ConsumerState { SizedBox( height: isDesktop ? 10 : 4, ), - BuyTextField( - controller: _fiatController, - focusNode: _fiatFocusNode, - textStyle: STextStyles.smallMed14(context).copyWith( - color: Theme.of(context).extension()!.textDark, + + MouseRegion( + cursor: SystemMouseCursors.click, + onEnter: (_) => setState(() => _hovering2 = true), + onExit: (_) => setState(() => _hovering2 = false), + child: GestureDetector( + onTap: () { + selectFiat(); + }, + child: RoundedContainer( + padding: const EdgeInsets.symmetric(vertical: 3, horizontal: 6), + color: _hovering2 + ? Theme.of(context) + .extension()! + .highlight + .withOpacity(_hovering2 ? 0.3 : 0) + : Theme.of(context) + .extension()! + .textFieldDefaultBG, + child: Padding( + padding: const EdgeInsets.all(12), + child: Row(children: [ + RoundedContainer( + radiusMultiplier: 0.5, + padding: + const EdgeInsets.symmetric(vertical: 2, horizontal: 4), + color: + Theme.of(context).extension()!.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()! + .buttonTextSecondaryDisabled, + width: 10, + height: 5, + ), + ]), + ), + ), ), - buttonColor: - Theme.of(context).extension()!.buttonBackSecondary, - borderRadius: Constants.size.circularBorderRadius, - background: - Theme.of(context).extension()!.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()!.textDark, + // ), + // buttonColor: + // Theme.of(context).extension()!.buttonBackSecondary, + // borderRadius: Constants.size.circularBorderRadius, + // background: + // Theme.of(context).extension()!.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( - height: isDesktop ? 20 : 12, + height: isDesktop ? 10 : 4, ), Row( crossAxisAlignment: CrossAxisAlignment.end, diff --git a/lib/pages_desktop_specific/desktop_menu.dart b/lib/pages_desktop_specific/desktop_menu.dart index 58b8ed673..12058e635 100644 --- a/lib/pages_desktop_specific/desktop_menu.dart +++ b/lib/pages_desktop_specific/desktop_menu.dart @@ -167,9 +167,7 @@ class _DesktopMenuState extends ConsumerState { icon: const DesktopBuyIcon(), label: "Buy crypto", value: DesktopMenuItemId.buy, - onChanged: (_) { - _buyDataLoadingService.loadAll(ref); - }, + onChanged: updateSelectedMenuItem, controller: controllers[2], ), const SizedBox( diff --git a/lib/providers/buy/available_simplex_currencies_provider.dart b/lib/providers/buy/simplex_supported_currencies_provider.dart similarity index 54% rename from lib/providers/buy/available_simplex_currencies_provider.dart rename to lib/providers/buy/simplex_supported_currencies_provider.dart index 14c43ef5b..17c27f9bd 100644 --- a/lib/providers/buy/available_simplex_currencies_provider.dart +++ b/lib/providers/buy/simplex_supported_currencies_provider.dart @@ -1,6 +1,6 @@ import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:stackwallet/models/buy/simplex/simplex_supported_currencies.dart'; -final availableSimplexCurrenciesProvider = Provider( - (ref) => SimplexAvailableCurrencies(), +final supportedSimplexCurrenciesProvider = Provider( + (ref) => SimplexSupportedCurrencies(), ); diff --git a/lib/providers/providers.dart b/lib/providers/providers.dart index ac95be26e..2cab572ae 100644 --- a/lib/providers/providers.dart +++ b/lib/providers/providers.dart @@ -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/simplex_initial_load_status.dart'; export './exchange/available_changenow_currencies_provider.dart'; diff --git a/lib/services/buy/buy_data_loading_service.dart b/lib/services/buy/buy_data_loading_service.dart index 416d2a72f..d012f5f6d 100644 --- a/lib/services/buy/buy_data_loading_service.dart +++ b/lib/services/buy/buy_data_loading_service.dart @@ -31,7 +31,7 @@ class BuyDataLoadingService { if (response['supportedCryptos'] != null) { print(response['supportedCryptos']); ref - .read(availableSimplexCurrenciesProvider) + .read(supportedSimplexCurrenciesProvider) .updateSupportedCryptos(response['supportedCryptos']!); } else { error = true; @@ -43,7 +43,7 @@ class BuyDataLoadingService { if (response['supportedFiats'] != null) { print(response['supportedFiats']); ref - .read(availableSimplexCurrenciesProvider) + .read(supportedSimplexCurrenciesProvider) .updateSupportedFiats(response['supportedFiats']!); } else { error = true;