Merge branch 'CW-301-desktop-side-bar-ui' of https://github.com/cake-tech/cake_wallet into CW-310-add-constraints-to-images-on-macos

 Conflicts:

	lib/src/screens/pin_code/pin_code_widget.dart

lib/router.dart

@@ -444,7 +444,10 @@ Route<dynamic> createRoute(RouteSettings settings) {
               ));
 
     case Routes.ioniaWelcomePage:
-      return CupertinoPageRoute<void>(builder: (_) => getIt.get<IoniaWelcomePage>());  
+      return CupertinoPageRoute<void>(
+        fullscreenDialog: true,
+        builder: (_) => getIt.get<IoniaWelcomePage>(),
+      );
     
     case Routes.ioniaLoginPage:
       return CupertinoPageRoute<void>( builder: (_) => getIt.get<IoniaLoginPage>());

lib/src/screens/dashboard/dashboard_page.dart

@@ -1,9 +1,7 @@
 import 'dart:async';
-import 'package:cake_wallet/di.dart';
 import 'package:cake_wallet/entities/main_actions.dart';
+import 'package:cake_wallet/src/screens/dashboard/desktop_dashboard_page.dart';
 import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_sidebar_wrapper.dart';
-import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_wallet_selection_dropdown.dart';
-import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_dashboard_view.dart';
 import 'package:cake_wallet/src/screens/dashboard/widgets/market_place_page.dart';
 import 'package:cake_wallet/generated/i18n.dart';
 import 'package:cake_wallet/routes.dart';
@@ -40,13 +38,19 @@ class DashboardPage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      body: DesktopSidebarWrapper(
+      body: ResponsiveLayoutUtil.instance.isMobile(context)
-        child: _DashboardPageView(
+          ? _DashboardPageView(
-          balancePage: balancePage,
+              balancePage: balancePage,
-          walletViewModel: walletViewModel,
+              walletViewModel: walletViewModel,
-          addressListViewModel: addressListViewModel,
+              addressListViewModel: addressListViewModel,
-        ),
+            )
-      ),
+          : DesktopSidebarWrapper(
+              child: DesktopDashboardPage(
+                balancePage: balancePage,
+                walletViewModel: walletViewModel,
+                addressListViewModel: addressListViewModel,
+              ),
+            ),
     );
   }
 }
@@ -84,15 +88,6 @@ class _DashboardPageView extends BasePage {
   @override
   Widget get endDrawer => MenuWidget(walletViewModel);
 
-  @override
-  Widget? leading(BuildContext context) {
-    if (!ResponsiveLayoutUtil.instance.isMobile(context)) {
-      return getIt<DesktopWalletSelectionDropDown>();
-    }
-
-    return null;
-  }
-
   @override
   Widget middle(BuildContext context) {
     return SyncIndicator(
@@ -128,9 +123,6 @@ class _DashboardPageView extends BasePage {
   @override
   Widget body(BuildContext context) {
     _setEffects(context);
-    if (!ResponsiveLayoutUtil.instance.isMobile(context)) {
-      return DesktopDashboardView(balancePage);
-    }
 
     return SafeArea(
         minimum: EdgeInsets.only(bottom: 24),

lib/src/screens/dashboard/desktop_dashboard_page.dart

@@ -0,0 +1,125 @@
+import 'dart:async';
+import 'package:cake_wallet/di.dart';
+import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_wallet_selection_dropdown.dart';
+import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_dashboard_view.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';
+import 'package:cake_wallet/utils/show_pop_up.dart';
+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:mobx/mobx.dart';
+import 'package:cake_wallet/main.dart';
+
+class DesktopDashboardPage extends BasePage {
+  DesktopDashboardPage({
+    required this.balancePage,
+    required this.walletViewModel,
+    required this.addressListViewModel,
+  });
+
+  @override
+  Color get backgroundLightColor =>
+      currentTheme.type == ThemeType.bright ? Colors.transparent : Colors.white;
+
+  @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<DesktopWalletSelectionDropDown>();
+
+  @override
+  Widget middle(BuildContext context) {
+    return SyncIndicator(
+        dashboardViewModel: walletViewModel,
+        onTap: () => Navigator.of(context, rootNavigator: true).pushNamed(Routes.connectionSync));
+  }
+
+  @override
+  Widget trailing(BuildContext context) {
+    return Image.asset('assets/images/menu.png',
+        color: Theme.of(context).accentTextTheme.headline2!.backgroundColor!);
+  }
+
+  final BalancePage balancePage;
+  final DashboardViewModel walletViewModel;
+  final WalletAddressListViewModel addressListViewModel;
+
+  bool _isEffectsInstalled = false;
+  StreamSubscription<bool>? _onInactiveSub;
+
+  @override
+  Widget body(BuildContext context) {
+    _setEffects(context);
+
+    return DesktopDashboardView(balancePage);
+  }
+
+  void _setEffects(BuildContext context) async {
+    if (_isEffectsInstalled) {
+      return;
+    }
+    _isEffectsInstalled = true;
+
+    autorun((_) async {
+      if (!walletViewModel.isOutdatedElectrumWallet) {
+        return;
+      }
+
+      await Future<void>.delayed(Duration(seconds: 1));
+      await showPopUp<void>(
+          context: context,
+          builder: (BuildContext context) {
+            return AlertWithOneAction(
+                alertTitle: S.of(context).pre_seed_title,
+                alertContent: S.of(context).outdated_electrum_wallet_description,
+                buttonText: S.of(context).understand,
+                buttonAction: () => Navigator.of(context).pop());
+          });
+    });
+
+    var needToPresentYat = false;
+    var isInactive = false;
+
+    _onInactiveSub = rootKey.currentState!.isInactive.listen((inactive) {
+      isInactive = inactive;
+
+      if (needToPresentYat) {
+        Future<void>.delayed(Duration(milliseconds: 500)).then((_) {
+          showPopUp<void>(
+              context: navigatorKey.currentContext!,
+              builder: (_) => YatEmojiId(walletViewModel.yatStore.emoji));
+          needToPresentYat = false;
+        });
+      }
+    });
+
+    walletViewModel.yatStore.emojiIncommingStream.listen((String emoji) {
+      if (!_isEffectsInstalled || emoji.isEmpty) {
+        return;
+      }
+
+      needToPresentYat = true;
+    });
+  }
+}

lib/src/screens/dashboard/desktop_widgets/desktop_dashboard_actions.dart

@@ -1,7 +1,9 @@
 import 'package:cake_wallet/entities/main_actions.dart';
 import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_action_button.dart';
+import 'package:cake_wallet/src/screens/dashboard/widgets/market_place_page.dart';
 import 'package:cake_wallet/view_model/dashboard/dashboard_view_model.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_mobx/flutter_mobx.dart';
 
 class DesktopDashboardActions extends StatelessWidget {
   final DashboardViewModel dashboardViewModel;
@@ -10,62 +12,69 @@ class DesktopDashboardActions extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Column(
+    return Observer(
-      children: [
+      builder: (_) {
-        const SizedBox(height: 16),
+        return Column(
-        DesktopActionButton(
-          title: MainActions.exchangeAction.name(context),
-          image: MainActions.exchangeAction.image,
-          canShow: MainActions.exchangeAction.canShow?.call(dashboardViewModel),
-          isEnabled: MainActions.exchangeAction.isEnabled?.call(dashboardViewModel),
-          onTap: () async => await MainActions.exchangeAction.onTap(context, dashboardViewModel),
-        ),
-        Row(
           children: [
-            Expanded(
+            const SizedBox(height: 16),
-              child: DesktopActionButton(
+            DesktopActionButton(
-                title: MainActions.receiveAction.name(context),
+              title: MainActions.exchangeAction.name(context),
-                image: MainActions.receiveAction.image,
+              image: MainActions.exchangeAction.image,
-                canShow: MainActions.receiveAction.canShow?.call(dashboardViewModel),
+              canShow: MainActions.exchangeAction.canShow?.call(dashboardViewModel),
-                isEnabled: MainActions.receiveAction.isEnabled?.call(dashboardViewModel),
+              isEnabled: MainActions.exchangeAction.isEnabled?.call(dashboardViewModel),
-                onTap: () async =>
+              onTap: () async => await MainActions.exchangeAction.onTap(context, dashboardViewModel),
-                    await MainActions.receiveAction.onTap(context, dashboardViewModel),
+            ),
-              ),
+            Row(
+              children: [
+                Expanded(
+                  child: DesktopActionButton(
+                    title: MainActions.receiveAction.name(context),
+                    image: MainActions.receiveAction.image,
+                    canShow: MainActions.receiveAction.canShow?.call(dashboardViewModel),
+                    isEnabled: MainActions.receiveAction.isEnabled?.call(dashboardViewModel),
+                    onTap: () async =>
+                        await MainActions.receiveAction.onTap(context, dashboardViewModel),
+                  ),
+                ),
+                Expanded(
+                  child: DesktopActionButton(
+                    title: MainActions.sendAction.name(context),
+                    image: MainActions.sendAction.image,
+                    canShow: MainActions.sendAction.canShow?.call(dashboardViewModel),
+                    isEnabled: MainActions.sendAction.isEnabled?.call(dashboardViewModel),
+                    onTap: () async => await MainActions.sendAction.onTap(context, dashboardViewModel),
+                  ),
+                ),
+              ],
+            ),
+            Row(
+              children: [
+                Expanded(
+                  child: DesktopActionButton(
+                    title: MainActions.buyAction.name(context),
+                    image: MainActions.buyAction.image,
+                    canShow: MainActions.buyAction.canShow?.call(dashboardViewModel),
+                    isEnabled: MainActions.buyAction.isEnabled?.call(dashboardViewModel),
+                    onTap: () async => await MainActions.buyAction.onTap(context, dashboardViewModel),
+                  ),
+                ),
+                Expanded(
+                  child: DesktopActionButton(
+                    title: MainActions.sellAction.name(context),
+                    image: MainActions.sellAction.image,
+                    canShow: MainActions.sellAction.canShow?.call(dashboardViewModel),
+                    isEnabled: MainActions.sellAction.isEnabled?.call(dashboardViewModel),
+                    onTap: () async => await MainActions.sellAction.onTap(context, dashboardViewModel),
+                  ),
+                ),
+              ],
             ),
             Expanded(
-              child: DesktopActionButton(
+              child: MarketPlacePage(dashboardViewModel: dashboardViewModel),
-                title: MainActions.sendAction.name(context),
-                image: MainActions.sendAction.image,
-                canShow: MainActions.sendAction.canShow?.call(dashboardViewModel),
-                isEnabled: MainActions.sendAction.isEnabled?.call(dashboardViewModel),
-                onTap: () async => await MainActions.sendAction.onTap(context, dashboardViewModel),
-              ),
             ),
           ],
-        ),
+        );
-        Row(
+      }
-          children: [
-            Expanded(
-              child: DesktopActionButton(
-                title: MainActions.buyAction.name(context),
-                image: MainActions.buyAction.image,
-                canShow: MainActions.buyAction.canShow?.call(dashboardViewModel),
-                isEnabled: MainActions.buyAction.isEnabled?.call(dashboardViewModel),
-                onTap: () async => await MainActions.buyAction.onTap(context, dashboardViewModel),
-              ),
-            ),
-            Expanded(
-              child: DesktopActionButton(
-                title: MainActions.sellAction.name(context),
-                image: MainActions.sellAction.image,
-                canShow: MainActions.sellAction.canShow?.call(dashboardViewModel),
-                isEnabled: MainActions.sellAction.isEnabled?.call(dashboardViewModel),
-                onTap: () async => await MainActions.sellAction.onTap(context, dashboardViewModel),
-              ),
-            ),
-          ],
-        ),
-      ],
     );
   }
 }

lib/src/screens/dashboard/desktop_widgets/desktop_sidebar_wrapper.dart

@@ -2,7 +2,6 @@ import 'package:cake_wallet/routes.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_controller.dart';
 import 'package:cake_wallet/src/screens/dashboard/desktop_widgets/desktop_sidebar/side_menu_item.dart';
-import 'package:cake_wallet/utils/responsive_layout_util.dart';
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/router.dart' as Router;
 
@@ -18,6 +17,7 @@ class DesktopSidebarWrapper extends StatefulWidget {
 class _DesktopSidebarWrapperState extends State<DesktopSidebarWrapper> {
   final page = PageController();
   final sideMenu = SideMenuController();
+
   @override
   void initState() {
     SideMenuGlobal.controller = sideMenu;
@@ -29,10 +29,6 @@ class _DesktopSidebarWrapperState extends State<DesktopSidebarWrapper> {
 
   @override
   Widget build(BuildContext context) {
-    if (ResponsiveLayoutUtil.instance.isMobile(context)) {
-      return widget.child;
-    }
-
     return Row(
       crossAxisAlignment: CrossAxisAlignment.start,
       children: [

lib/src/screens/pin_code/pin_code_widget.dart

@@ -2,6 +2,7 @@ import 'package:cake_wallet/utils/show_bar.dart';
 import 'package:another_flushbar/flushbar.dart';
 import 'package:flutter/material.dart';
 import 'package:cake_wallet/generated/i18n.dart';
+import 'package:flutter/services.dart';
 
 class PinCodeWidget extends StatefulWidget {
   PinCodeWidget({
@@ -115,11 +116,25 @@ class PinCodeState<T extends PinCodeWidget> extends State<T> {
       color: Theme.of(context).primaryTextTheme!.headline6!.color!,
     );
 
-    return Container(
+    return RawKeyboardListener(
-      color: Theme.of(context).backgroundColor,
+      focusNode: FocusNode(),
-      padding: EdgeInsets.only(left: 40.0, right: 40.0, bottom: 40.0),
+      autofocus: true,
-      child: Column(
+      onKey: (keyEvent) {
-        children: <Widget>[
+        if (keyEvent is RawKeyDownEvent) {
+          if (keyEvent.logicalKey.keyLabel == "Backspace") {
+            _pop();
+            return;
+          }
+          int? number = int.tryParse(keyEvent.character ?? '');
+          if (number != null) {
+            _push(number);
+          }
+        }
+      },
+      child: Container(
+        color: Theme.of(context).backgroundColor,
+        padding: EdgeInsets.only(left: 40.0, right: 40.0, bottom: 40.0),
+        child: Column(children: <Widget>[
           Spacer(flex: 2),
           Text(title,
               style: TextStyle(
@@ -232,9 +247,10 @@ class PinCodeState<T extends PinCodeWidget> extends State<T> {
                                 margin: EdgeInsets.only(left: marginLeft, right: marginRight),
                                 child: TextButton(
                                   onPressed: () => _pop(),
-                                  // FIX-ME: Style
+    style: TextButton.styleFrom(
-                                  //color: Theme.of(context).backgroundColor,
+    backgroundColor: Theme.of(context).backgroundColor,
-                                  //shape: CircleBorder(),
+    shape: CircleBorder(),
+    ),
                                   child: deleteIconImage,
                                 ),
                               );
@@ -246,9 +262,10 @@ class PinCodeState<T extends PinCodeWidget> extends State<T> {
                               margin: EdgeInsets.only(left: marginLeft, right: marginRight),
                               child: TextButton(
                                 onPressed: () => _push(index),
-                                // FIX-ME: Style
+    style: TextButton.styleFrom(
-                                //color: Theme.of(context).backgroundColor,
+    backgroundColor: Theme.of(context).backgroundColor,
-                                //shape: CircleBorder(),
+    shape: CircleBorder(),
+    ),
                                 child: Text('$index',
                                     style: TextStyle(
                                         fontSize: 30.0,

lib/src/widgets/market_place_item.dart

@@ -17,6 +17,9 @@ class MarketPlaceItem extends StatelessWidget {
   Widget build(BuildContext context) {
     return InkWell(
       onTap: onTap,
+      hoverColor: Colors.transparent,
+      splashColor: Colors.transparent,
+      highlightColor: Colors.transparent,
       child: Stack(
         children: [
           Container(

lib/src/widgets/nav_bar.dart

@@ -66,14 +66,17 @@ class NavBar extends StatelessWidget implements ObstructingPreferredSizeWidget {
     if (!ResponsiveLayoutUtil.instance.isMobile(context)) {
       return PreferredSize(
         preferredSize: Size.fromHeight(height),
-        child: Row(
+        child: Padding(
-          mainAxisSize: MainAxisSize.max,
+          padding: const EdgeInsetsDirectional.only(end: 24),
-          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          child: Row(
-          children: [
+            mainAxisSize: MainAxisSize.max,
-            if (leading != null) Flexible(child: leading!),
+            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-            if (middle != null) middle!,
+            children: [
-            if (trailing != null) trailing!,
+              if (leading != null) Flexible(child: leading!),
-          ],
+              if (middle != null) middle!,
+              trailing ?? const SizedBox(),
+            ],
+          ),
         ),
       );
     }