From 4211307f31bb9a8d0748e19340fb5a3b8b844516 Mon Sep 17 00:00:00 2001 From: redDwarf03 Date: Thu, 31 Oct 2024 16:27:06 +0100 Subject: [PATCH] chore: :recycle: Refactor main_appbar --- lib/domain/models/settings.dart | 2 + lib/ui/views/main/components/main_appbar.dart | 236 ++---------------- .../main/components/main_appbar_account.dart | 154 ++++++++++++ .../main/components/main_appbar_basic.dart | 22 ++ .../components/main_appbar_transactions.dart | 50 ++++ 5 files changed, 249 insertions(+), 215 deletions(-) create mode 100644 lib/ui/views/main/components/main_appbar_account.dart create mode 100644 lib/ui/views/main/components/main_appbar_basic.dart create mode 100644 lib/ui/views/main/components/main_appbar_transactions.dart diff --git a/lib/domain/models/settings.dart b/lib/domain/models/settings.dart index 4a50eebb5..b98a83862 100644 --- a/lib/domain/models/settings.dart +++ b/lib/domain/models/settings.dart @@ -7,6 +7,8 @@ import 'package:freezed_annotation/freezed_annotation.dart'; part 'settings.freezed.dart'; +enum MainScreenTab { accountTab, transactionTab, swapTab, earnTab, bridgeTab } + @freezed class Settings with _$Settings { const factory Settings({ diff --git a/lib/ui/views/main/components/main_appbar.dart b/lib/ui/views/main/components/main_appbar.dart index d8dacdce9..6e8dc3801 100644 --- a/lib/ui/views/main/components/main_appbar.dart +++ b/lib/ui/views/main/components/main_appbar.dart @@ -1,30 +1,23 @@ /// SPDX-License-Identifier: AGPL-3.0-or-later import 'dart:ui'; -import 'package:aewallet/application/account/providers.dart'; import 'package:aewallet/application/connectivity_status.dart'; -import 'package:aewallet/application/session/session.dart'; import 'package:aewallet/application/settings/settings.dart'; +import 'package:aewallet/domain/models/settings.dart'; import 'package:aewallet/ui/menu/settings/settings_sheet.dart'; import 'package:aewallet/ui/themes/archethic_theme.dart'; -import 'package:aewallet/ui/themes/archethic_theme_base.dart'; import 'package:aewallet/ui/themes/styles.dart'; -import 'package:aewallet/ui/util/ui_util.dart'; -import 'package:aewallet/ui/views/accounts/layouts/account_list.dart'; -import 'package:aewallet/ui/views/accounts/layouts/components/add_account_button.dart'; import 'package:aewallet/ui/views/aeswap_swap/layouts/components/swap_icon_refresh.dart'; +import 'package:aewallet/ui/views/main/components/main_appbar_account.dart'; +import 'package:aewallet/ui/views/main/components/main_appbar_basic.dart'; +import 'package:aewallet/ui/views/main/components/main_appbar_transactions.dart'; import 'package:aewallet/ui/widgets/components/icon_network_warning.dart'; -import 'package:archethic_dapp_framework_flutter/archethic_dapp_framework_flutter.dart' - as aedappfm; -import 'package:auto_size_text/auto_size_text.dart'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; -import 'package:flutter_animate/flutter_animate.dart'; import 'package:flutter_gen/gen_l10n/localizations.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:go_router/go_router.dart'; import 'package:material_symbols_icons/symbols.dart'; -import 'package:modal_bottom_sheet/modal_bottom_sheet.dart'; class MainAppBar extends ConsumerWidget implements PreferredSizeWidget { const MainAppBar({super.key}); @@ -63,8 +56,10 @@ class MainAppBar extends ConsumerWidget implements PreferredSizeWidget { }, ), actions: [ - if (preferences.mainScreenCurrentPage == 0 || - preferences.mainScreenCurrentPage == 1) + if (preferences.mainScreenCurrentPage == + MainScreenTab.accountTab.index || + preferences.mainScreenCurrentPage == + MainScreenTab.transactionTab.index) IconButton( icon: Icon( preferences.showBalances @@ -81,216 +76,27 @@ class MainAppBar extends ConsumerWidget implements PreferredSizeWidget { .setShowBalances(!preferences.showBalances); }, ) - else if (preferences.mainScreenCurrentPage == 2) + else if (preferences.mainScreenCurrentPage == + MainScreenTab.swapTab.index) const SwapTokenIconRefresh(), if (connectivityStatusProvider == ConnectivityStatus.isDisconnected) const IconNetworkWarning(), ], - title: preferences.mainScreenCurrentPage == 0 - ? _accountTab(context, ref) - : preferences.mainScreenCurrentPage == 1 - ? _transactionsTab(context, ref) - : preferences.mainScreenCurrentPage == 2 - ? FittedBox( - fit: BoxFit.fitWidth, - child: AutoSizeText( - localizations.swapHeader, - style: ArchethicThemeStyles.textStyleSize24W700Primary, - ), - ) - .animate() - .fade(duration: const Duration(milliseconds: 300)) - : preferences.mainScreenCurrentPage == 3 - ? FittedBox( - fit: BoxFit.fitWidth, - child: AutoSizeText( - localizations.aeSwapEarnHeader, - style: - ArchethicThemeStyles.textStyleSize24W700Primary, - ), - ) - .animate() - .fade(duration: const Duration(milliseconds: 300)) - : FittedBox( - fit: BoxFit.fitWidth, - child: AutoSizeText( - localizations.aeBridgeHeader, - style: - ArchethicThemeStyles.textStyleSize24W700Primary, - ), - ) - .animate() - .fade(duration: const Duration(milliseconds: 300)), + title: preferences.mainScreenCurrentPage == MainScreenTab.accountTab.index + ? const MainAppBarAccount() + : preferences.mainScreenCurrentPage == + MainScreenTab.transactionTab.index + ? const MainAppBarTransactions() + : preferences.mainScreenCurrentPage == MainScreenTab.swapTab.index + ? MainAppBarBasic(header: localizations.swapHeader) + : preferences.mainScreenCurrentPage == + MainScreenTab.earnTab.index + ? MainAppBarBasic(header: localizations.aeSwapEarnHeader) + : MainAppBarBasic(header: localizations.aeBridgeHeader), backgroundColor: Colors.transparent, elevation: 0, centerTitle: true, iconTheme: IconThemeData(color: ArchethicTheme.text), ); } - - Widget _accountTab(BuildContext context, WidgetRef ref) { - final localizations = AppLocalizations.of(context)!; - final keychain = ref.watch( - sessionNotifierProvider.select( - (value) => value.loggedIn?.wallet.appKeychain, - ), - ); - final selectedAccount = ref - .watch( - AccountProviders.accounts, - ) - .valueOrNull - ?.selectedAccount; - return FittedBox( - fit: BoxFit.fitWidth, - child: InkWell( - onTap: () async { - await showCupertinoModalBottomSheet( - context: context, - builder: (BuildContext context) { - return FractionallySizedBox( - heightFactor: 1, - child: Scaffold( - backgroundColor: - aedappfm.AppThemeBase.sheetBackground.withOpacity(0.2), - body: Stack( - children: [ - Container( - padding: const EdgeInsets.symmetric( - horizontal: 15, - ), - child: Column( - children: [ - Padding( - padding: const EdgeInsets.only(top: 15), - child: InkWell( - onTap: () { - Clipboard.setData( - ClipboardData( - text: - keychain?.address.toUpperCase() ?? '', - ), - ); - UIUtil.showSnackbar( - localizations.keychainAddressCopied, - context, - ref, - ArchethicTheme.text, - ArchethicTheme.snackBarShadow, - icon: Symbols.info, - ); - }, - child: Text( - localizations.accountsHeader, - style: ArchethicThemeStyles - .textStyleSize16W600Primary, - ), - ), - ), - Padding( - padding: - const EdgeInsets.only(top: 10, bottom: 5), - child: RichText( - text: TextSpan( - children: [ - const WidgetSpan( - child: Icon(Icons.info, size: 16), - ), - TextSpan( - text: - ' ${localizations.accountsListWarningRemoveAccount}', - style: ArchethicThemeStyles - .textStyleSize12W100Primary, - ), - TextSpan( - text: - ' (${localizations.accountsListWarningRemoveAccountConfirmRequired})', - style: ArchethicThemeStyles - .textStyleSize12W100Primary - .copyWith( - fontStyle: FontStyle.italic, - ), - ), - ], - ), - ), - ), - const AccountsList(), - ], - ), - ), - Align( - alignment: Alignment.bottomCenter, - child: Padding( - padding: EdgeInsets.only( - bottom: MediaQuery.of(context).padding.bottom + 20, - ), - child: const Row( - children: [ - AddAccountButton(), - ], - ), - ), - ), - ], - ), - ), - ); - }, - ); - }, - child: Row( - children: [ - Text( - selectedAccount?.nameDisplayed ?? ' ', - style: ArchethicThemeStyles.textStyleSize24W700Primary.copyWith( - color: aedappfm.AppThemeBase.secondaryColor, - ), - ), - const SizedBox( - width: 5, - ), - Icon( - Symbols.keyboard_arrow_down, - color: ArchethicThemeBase.neutral0, - ), - ], - ), - ), - ).animate().fade(duration: const Duration(milliseconds: 300)); - } - - Widget _transactionsTab(BuildContext context, WidgetRef ref) { - final localizations = AppLocalizations.of(context)!; - final keychain = ref.watch( - sessionNotifierProvider.select( - (value) => value.loggedIn?.wallet.appKeychain, - ), - ); - - return InkWell( - onTap: () { - Clipboard.setData( - ClipboardData( - text: keychain?.address.toUpperCase() ?? '', - ), - ); - UIUtil.showSnackbar( - localizations.addressCopied, - context, - ref, - ArchethicTheme.text, - ArchethicTheme.snackBarShadow, - icon: Symbols.info, - ); - }, - child: FittedBox( - fit: BoxFit.fitWidth, - child: AutoSizeText( - localizations.transactionHeader, - style: ArchethicThemeStyles.textStyleSize24W700Primary, - ), - ).animate().fade(duration: const Duration(milliseconds: 300)), - ); - } } diff --git a/lib/ui/views/main/components/main_appbar_account.dart b/lib/ui/views/main/components/main_appbar_account.dart new file mode 100644 index 000000000..70498b8e5 --- /dev/null +++ b/lib/ui/views/main/components/main_appbar_account.dart @@ -0,0 +1,154 @@ +import 'package:aewallet/application/account/providers.dart'; +import 'package:aewallet/application/session/session.dart'; +import 'package:aewallet/ui/themes/archethic_theme.dart'; +import 'package:aewallet/ui/themes/archethic_theme_base.dart'; +import 'package:aewallet/ui/themes/styles.dart'; +import 'package:aewallet/ui/util/ui_util.dart'; +import 'package:aewallet/ui/views/accounts/layouts/account_list.dart'; +import 'package:aewallet/ui/views/accounts/layouts/components/add_account_button.dart'; +import 'package:archethic_dapp_framework_flutter/archethic_dapp_framework_flutter.dart' + as aedappfm; +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; +import 'package:flutter_animate/flutter_animate.dart'; +import 'package:flutter_gen/gen_l10n/localizations.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:material_symbols_icons/symbols.dart'; +import 'package:modal_bottom_sheet/modal_bottom_sheet.dart'; + +class MainAppBarAccount extends ConsumerWidget { + const MainAppBarAccount({super.key}); + + @override + Widget build(BuildContext context, WidgetRef ref) { + final localizations = AppLocalizations.of(context)!; + final keychain = ref.watch( + sessionNotifierProvider.select( + (value) => value.loggedIn?.wallet.appKeychain, + ), + ); + final selectedAccount = ref + .watch( + AccountProviders.accounts, + ) + .valueOrNull + ?.selectedAccount; + return FittedBox( + fit: BoxFit.fitWidth, + child: InkWell( + onTap: () async { + await showCupertinoModalBottomSheet( + context: context, + builder: (BuildContext context) { + return FractionallySizedBox( + heightFactor: 1, + child: Scaffold( + backgroundColor: + aedappfm.AppThemeBase.sheetBackground.withOpacity(0.2), + body: Stack( + children: [ + Container( + padding: const EdgeInsets.symmetric( + horizontal: 15, + ), + child: Column( + children: [ + Padding( + padding: const EdgeInsets.only(top: 15), + child: InkWell( + onTap: () { + Clipboard.setData( + ClipboardData( + text: + keychain?.address.toUpperCase() ?? '', + ), + ); + UIUtil.showSnackbar( + localizations.keychainAddressCopied, + context, + ref, + ArchethicTheme.text, + ArchethicTheme.snackBarShadow, + icon: Symbols.info, + ); + }, + child: Text( + localizations.accountsHeader, + style: ArchethicThemeStyles + .textStyleSize16W600Primary, + ), + ), + ), + Padding( + padding: + const EdgeInsets.only(top: 10, bottom: 5), + child: RichText( + text: TextSpan( + children: [ + const WidgetSpan( + child: Icon(Icons.info, size: 16), + ), + TextSpan( + text: + ' ${localizations.accountsListWarningRemoveAccount}', + style: ArchethicThemeStyles + .textStyleSize12W100Primary, + ), + TextSpan( + text: + ' (${localizations.accountsListWarningRemoveAccountConfirmRequired})', + style: ArchethicThemeStyles + .textStyleSize12W100Primary + .copyWith( + fontStyle: FontStyle.italic, + ), + ), + ], + ), + ), + ), + const AccountsList(), + ], + ), + ), + Align( + alignment: Alignment.bottomCenter, + child: Padding( + padding: EdgeInsets.only( + bottom: MediaQuery.of(context).padding.bottom + 20, + ), + child: const Row( + children: [ + AddAccountButton(), + ], + ), + ), + ), + ], + ), + ), + ); + }, + ); + }, + child: Row( + children: [ + Text( + selectedAccount?.nameDisplayed ?? ' ', + style: ArchethicThemeStyles.textStyleSize24W700Primary.copyWith( + color: aedappfm.AppThemeBase.secondaryColor, + ), + ), + const SizedBox( + width: 5, + ), + Icon( + Symbols.keyboard_arrow_down, + color: ArchethicThemeBase.neutral0, + ), + ], + ), + ), + ).animate().fade(duration: const Duration(milliseconds: 300)); + } +} diff --git a/lib/ui/views/main/components/main_appbar_basic.dart b/lib/ui/views/main/components/main_appbar_basic.dart new file mode 100644 index 000000000..23b702647 --- /dev/null +++ b/lib/ui/views/main/components/main_appbar_basic.dart @@ -0,0 +1,22 @@ +import 'package:aewallet/ui/themes/styles.dart'; +import 'package:auto_size_text/auto_size_text.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_animate/flutter_animate.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; + +class MainAppBarBasic extends ConsumerWidget { + const MainAppBarBasic({required this.header, super.key}); + + final String header; + + @override + Widget build(BuildContext context, WidgetRef ref) { + return FittedBox( + fit: BoxFit.fitWidth, + child: AutoSizeText( + header, + style: ArchethicThemeStyles.textStyleSize24W700Primary, + ), + ).animate().fade(duration: const Duration(milliseconds: 300)); + } +} diff --git a/lib/ui/views/main/components/main_appbar_transactions.dart b/lib/ui/views/main/components/main_appbar_transactions.dart new file mode 100644 index 000000000..a160251b4 --- /dev/null +++ b/lib/ui/views/main/components/main_appbar_transactions.dart @@ -0,0 +1,50 @@ +import 'package:aewallet/application/session/session.dart'; +import 'package:aewallet/ui/themes/archethic_theme.dart'; +import 'package:aewallet/ui/themes/styles.dart'; +import 'package:aewallet/ui/util/ui_util.dart'; +import 'package:auto_size_text/auto_size_text.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter/services.dart'; +import 'package:flutter_animate/flutter_animate.dart'; +import 'package:flutter_gen/gen_l10n/localizations.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:material_symbols_icons/symbols.dart'; + +class MainAppBarTransactions extends ConsumerWidget { + const MainAppBarTransactions({super.key}); + + @override + Widget build(BuildContext context, WidgetRef ref) { + final localizations = AppLocalizations.of(context)!; + final keychain = ref.watch( + sessionNotifierProvider.select( + (value) => value.loggedIn?.wallet.appKeychain, + ), + ); + + return InkWell( + onTap: () { + Clipboard.setData( + ClipboardData( + text: keychain?.address.toUpperCase() ?? '', + ), + ); + UIUtil.showSnackbar( + localizations.keychainAddressCopied, + context, + ref, + ArchethicTheme.text, + ArchethicTheme.snackBarShadow, + icon: Symbols.info, + ); + }, + child: FittedBox( + fit: BoxFit.fitWidth, + child: AutoSizeText( + localizations.transactionHeader, + style: ArchethicThemeStyles.textStyleSize24W700Primary, + ), + ).animate().fade(duration: const Duration(milliseconds: 300)), + ); + } +}