diff --git a/lib/di.dart b/lib/di.dart index 0cce7abd3..37e547b93 100644 --- a/lib/di.dart +++ b/lib/di.dart @@ -7,6 +7,7 @@ import 'package:cake_wallet/ionia/ionia_anypay.dart'; import 'package:cake_wallet/ionia/ionia_gift_card.dart'; import 'package:cake_wallet/ionia/ionia_tip.dart'; import 'package:cake_wallet/src/screens/buy/onramper_page.dart'; +import 'package:cake_wallet/src/screens/dashboard/desktop_dashboard_page.dart'; import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_wallet_selection_dropdown.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/transactions_page.dart'; import 'package:cake_wallet/src/screens/settings/display_settings_page.dart'; @@ -368,7 +369,12 @@ Future setup( getIt.registerFactory(() => BalancePage(dashboardViewModel: getIt.get(), settingsStore: getIt.get())); - getIt.registerFactory(() => DashboardPage( balancePage: getIt.get(), walletViewModel: getIt.get(), addressListViewModel: getIt.get())); + getIt.registerFactory(() => DashboardPage( + balancePage: getIt.get(), + walletViewModel: getIt.get(), + addressListViewModel: getIt.get(), + desktopSidebarViewModel: getIt.get(), + )); getIt.registerFactory(() => TransactionsPage(dashboardViewModel: getIt.get())); getIt.registerFactory(() => ReceivePage( addressListViewModel: getIt.get())); diff --git a/lib/src/screens/dashboard/dashboard_page.dart b/lib/src/screens/dashboard/dashboard_page.dart index 4665751a7..0557f0415 100644 --- a/lib/src/screens/dashboard/dashboard_page.dart +++ b/lib/src/screens/dashboard/dashboard_page.dart @@ -25,21 +25,23 @@ import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:mobx/mobx.dart'; import 'package:smooth_page_indicator/smooth_page_indicator.dart'; import 'package:cake_wallet/main.dart'; +import 'package:cake_wallet/router.dart' as Router; class DashboardPage extends StatelessWidget { DashboardPage({ required this.balancePage, required this.walletViewModel, required this.addressListViewModel, + required this.desktopSidebarViewModel, }); final BalancePage balancePage; final DashboardViewModel walletViewModel; final WalletAddressListViewModel addressListViewModel; + final DesktopSidebarViewModel desktopSidebarViewModel; @override Widget build(BuildContext context) { - final desktopSidebarViewModel = getIt(); return Scaffold( body: ResponsiveLayoutUtil.instance.isMobile(context) ? _DashboardPageView( @@ -49,6 +51,7 @@ class DashboardPage extends StatelessWidget { ) : DesktopSidebarWrapper( desktopSidebarViewModel: desktopSidebarViewModel, + dashboardViewModel: walletViewModel, child: DesktopDashboardPage( desktopSidebarViewModel: desktopSidebarViewModel, balancePage: balancePage, diff --git a/lib/src/screens/dashboard/desktop_dashboard_page.dart b/lib/src/screens/dashboard/desktop_dashboard_page.dart index a5b5470e2..eb307e9ac 100644 --- a/lib/src/screens/dashboard/desktop_dashboard_page.dart +++ b/lib/src/screens/dashboard/desktop_dashboard_page.dart @@ -1,8 +1,8 @@ import 'dart:async'; +import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_dashboard_view.dart'; import 'package:cake_wallet/di.dart'; import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_wallet_selection_dropdown.dart'; import 'package:cake_wallet/generated/i18n.dart'; -import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/screens/yat_emoji_id.dart'; import 'package:cake_wallet/src/widgets/alert_with_one_action.dart'; import 'package:cake_wallet/themes/theme_base.dart'; @@ -12,9 +12,7 @@ import 'package:flutter/material.dart'; import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart'; import 'package:cake_wallet/src/screens/base_page.dart'; import 'package:cake_wallet/src/screens/dashboard/widgets/balance_page.dart'; -import 'package:cake_wallet/src/screens/dashboard/widgets/sync_indicator.dart'; import 'package:cake_wallet/view_model/wallet_address_list/wallet_address_list_view_model.dart'; -import 'package:flutter_mobx/flutter_mobx.dart'; import 'package:mobx/mobx.dart'; import 'package:cake_wallet/main.dart'; import 'package:cake_wallet/router.dart' as Router; @@ -36,63 +34,12 @@ class DesktopDashboardPage extends BasePage { @override Color get backgroundDarkColor => Colors.transparent; - @override - Widget Function(BuildContext, Widget) get rootWrapper => - (BuildContext context, Widget scaffold) => Container( - decoration: BoxDecoration( - gradient: LinearGradient(colors: [ - Theme.of(context).accentColor, - Theme.of(context).scaffoldBackgroundColor, - Theme.of(context).primaryColor, - ], begin: Alignment.topRight, end: Alignment.bottomLeft)), - child: scaffold); @override bool get resizeToAvoidBottomInset => false; - @override - Widget? leading(BuildContext context) => getIt(); - @override - Widget middle(BuildContext context) { - return SyncIndicator( - dashboardViewModel: walletViewModel, - onTap: () => Navigator.of(context, rootNavigator: true).pushNamed(Routes.connectionSync)); - } - @override - Widget trailing(BuildContext context) { - final selectedIconPath = 'assets/images/desktop_transactions_solid_icon.png'; - final unselectedIconPath = 'assets/images/desktop_transactions_outline_icon.png'; - - return InkWell( - onTap: () { - String? currentPath; - - desktopKey.currentState?.popUntil((route) { - currentPath = route.settings.name; - return true; - }); - - if (currentPath == Routes.transactionsPage) { - desktopSidebarViewModel.resetSidebar(); - return; - } - desktopSidebarViewModel.onPageChange(SidebarItem.transactions); - - desktopKey.currentState!.pushNamed(Routes.transactionsPage); - }, - child: Observer( - builder: (_) { - return Image.asset( - desktopSidebarViewModel.currentPage == SidebarItem.transactions - ? selectedIconPath - : unselectedIconPath, - ); - }, - ), - ); - } final BalancePage balancePage; final DashboardViewModel walletViewModel; diff --git a/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu.dart b/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu.dart index 569773bed..bc7c0af84 100644 --- a/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu.dart +++ b/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu.dart @@ -6,19 +6,21 @@ class SideMenu extends StatelessWidget { super.key, required this.topItems, required this.bottomItems, + required this.width, }); + final List topItems; final List bottomItems; + final double width; @override Widget build(BuildContext context) { return Container( color: Colors.black.withOpacity(0.1), - width: 76, + width: width, height: MediaQuery.of(context).size.height, child: Column( children: [ - SizedBox(height: 20), ...topItems, Spacer(), ...bottomItems, diff --git a/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu_item.dart b/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu_item.dart index f50cf6387..c7f388a92 100644 --- a/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu_item.dart +++ b/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu_item.dart @@ -12,9 +12,7 @@ class SideMenuItem extends StatelessWidget { final String iconPath; final bool isSelected; - @override - Widget build(BuildContext context) { - Color _setColor() { + Color _setColor(BuildContext context) { if (isSelected) { return Theme.of(context).primaryTextTheme.headline6!.color!; } else { @@ -22,6 +20,8 @@ class SideMenuItem extends StatelessWidget { } } + @override + Widget build(BuildContext context) { return InkWell( child: Padding( padding: EdgeInsets.all(20), @@ -30,7 +30,7 @@ class SideMenuItem extends StatelessWidget { fit: BoxFit.cover, height: 30, width: 30, - color: _setColor(), + color: _setColor(context), ), ), onTap: () => onTap.call(), diff --git a/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar_wrapper.dart b/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar_wrapper.dart index 81dd8243f..02b8ef62b 100644 --- a/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar_wrapper.dart +++ b/lib/src/screens/dashboard/desktop_widgets/desktop_sidebar_wrapper.dart @@ -1,23 +1,111 @@ +import 'package:cake_wallet/di.dart'; import 'package:cake_wallet/routes.dart'; import 'package:cake_wallet/src/screens/dashboard/desktop_dashboard_page.dart'; +import 'package:cake_wallet/src/screens/base_page.dart'; +import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_dashboard_view.dart'; import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu.dart'; import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu_item.dart'; +import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_wallet_selection_dropdown.dart'; +import 'package:cake_wallet/src/screens/dashboard/widgets/sync_indicator.dart'; +import 'package:cake_wallet/themes/theme_base.dart'; +import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart'; import 'package:cake_wallet/view_model/dashboard/desktop_sidebar_view_model.dart'; import 'package:flutter/material.dart'; -import 'package:cake_wallet/router.dart' as Router; import 'package:flutter_mobx/flutter_mobx.dart'; +import 'package:cake_wallet/router.dart' as Router; import 'package:mobx/mobx.dart'; -class DesktopSidebarWrapper extends StatelessWidget { +class DesktopSidebarWrapper extends BasePage { final Widget child; final DesktopSidebarViewModel desktopSidebarViewModel; + final DashboardViewModel dashboardViewModel; - const DesktopSidebarWrapper({required this.child, required this.desktopSidebarViewModel}); + DesktopSidebarWrapper({ + required this.child, + required this.desktopSidebarViewModel, + required this.dashboardViewModel, + }); @override - Widget build(BuildContext context) { - final pageController = PageController(); + Color get backgroundLightColor => + currentTheme.type == ThemeType.bright ? Colors.transparent : Colors.white; + @override + Color get backgroundDarkColor => Colors.transparent; + + final pageController = PageController(); + + final selectedIconPath = 'assets/images/desktop_transactions_solid_icon.png'; + final unselectedIconPath = 'assets/images/desktop_transactions_outline_icon.png'; + double get sideMenuWidth => 76.0; + + @override + Widget Function(BuildContext, Widget) get rootWrapper => + (BuildContext context, Widget scaffold) => Container( + decoration: BoxDecoration( + gradient: LinearGradient( + colors: [ + Theme.of(context).accentColor, + Theme.of(context).scaffoldBackgroundColor, + Theme.of(context).primaryColor, + ], + begin: Alignment.topRight, + end: Alignment.bottomLeft, + ), + ), + child: scaffold, + ); + + @override + Widget? leading(BuildContext context) => Padding( + padding: EdgeInsets.only(left: sideMenuWidth), + child: getIt(), + ); + + @override + Widget middle(BuildContext context) { + return SyncIndicator( + dashboardViewModel: dashboardViewModel, + onTap: () => Navigator.of(context, rootNavigator: true).pushNamed(Routes.connectionSync)); + } + + @override + Widget trailing(BuildContext context) { + return InkWell( + onTap: () { + String? currentPath; + + desktopKey.currentState?.popUntil((route) { + currentPath = route.settings.name; + return true; + }); + + switch (currentPath) { + case Routes.transactionsPage: + desktopSidebarViewModel.resetSidebar(); + break; + default: + desktopSidebarViewModel.resetSidebar(); + Future.delayed(Duration(milliseconds: 10), () { + desktopSidebarViewModel.onPageChange(SidebarItem.transactions); + desktopKey.currentState?.pushNamed(Routes.transactionsPage); + }); + } + }, + child: Observer( + builder: (_) { + return Image.asset( + desktopSidebarViewModel.currentPage == SidebarItem.transactions + ? selectedIconPath + : unselectedIconPath, + ); + }, + ), + ); + } + + @override + Widget body(BuildContext context) { reaction((_) => desktopSidebarViewModel.currentPage, (page) { String? currentPath; @@ -41,6 +129,7 @@ class DesktopSidebarWrapper extends StatelessWidget { children: [ Observer(builder: (_) { return SideMenu( + width: sideMenuWidth, topItems: [ SideMenuItem( iconPath: 'assets/images/wallet_outline.png', @@ -68,6 +157,7 @@ class DesktopSidebarWrapper extends StatelessWidget { children: [ child, Container( + padding: EdgeInsets.all(20), child: Navigator( initialRoute: Routes.support, onGenerateRoute: (settings) => Router.createRoute(settings), diff --git a/lib/src/screens/settings/desktop_settings/dashboard_settings_page.dart b/lib/src/screens/settings/desktop_settings/dashboard_settings_page.dart index c8e32f16f..69cd2ad27 100644 --- a/lib/src/screens/settings/desktop_settings/dashboard_settings_page.dart +++ b/lib/src/screens/settings/desktop_settings/dashboard_settings_page.dart @@ -16,14 +16,12 @@ class DesktopSettingsPage extends StatefulWidget { } class _DesktopSettingsPageState extends State { - int itemCount = SettingActions.all.length; + final int itemCount = SettingActions.all.length; int? currentPage; - bool isTapped = false; void _onItemChange(int index) { setState(() { currentPage = index; - isTapped = true; }); } @@ -54,7 +52,7 @@ class _DesktopSettingsPageState extends State { final isLastTile = index == itemCount; return SettingActionButton( isLastTile: isLastTile, - selectionActive: isTapped, + selectionActive: currentPage != null, isSelected: currentPage == index, isArrowVisible: true, onTap: () { diff --git a/lib/view_model/dashboard/desktop_sidebar_view_model.dart b/lib/view_model/dashboard/desktop_sidebar_view_model.dart index 516990d85..41a6881f7 100644 --- a/lib/view_model/dashboard/desktop_sidebar_view_model.dart +++ b/lib/view_model/dashboard/desktop_sidebar_view_model.dart @@ -3,13 +3,10 @@ import 'package:mobx/mobx.dart'; part 'desktop_sidebar_view_model.g.dart'; enum SidebarItem { - dashboard(0), - support(1), - settings(2), - transactions(3); - - final int value; - const SidebarItem(this.value); + dashboard, + support, + settings, + transactions; } class DesktopSidebarViewModel = DesktopSidebarViewModelBase with _$DesktopSidebarViewModel; @@ -23,6 +20,12 @@ abstract class DesktopSidebarViewModelBase with Store { @action void onPageChange(SidebarItem item) { + + if(currentPage == item){ + resetSidebar(); + + return; + } currentPage = item; }