diff --git a/lib/pages_desktop_specific/home/desktop_home_view.dart b/lib/pages_desktop_specific/home/desktop_home_view.dart index 76645442d..c0b0145f7 100644 --- a/lib/pages_desktop_specific/home/desktop_home_view.dart +++ b/lib/pages_desktop_specific/home/desktop_home_view.dart @@ -4,6 +4,7 @@ import 'package:stackwallet/pages_desktop_specific/home/address_book_view/deskto import 'package:stackwallet/pages_desktop_specific/home/desktop_menu.dart'; import 'package:stackwallet/pages_desktop_specific/home/desktop_settings_view.dart'; import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/my_stack_view.dart'; +import 'package:stackwallet/pages_desktop_specific/home/notifications/desktop_notifications_view.dart'; import 'package:stackwallet/pages_desktop_specific/home/support_and_about_view/desktop_about_view.dart'; import 'package:stackwallet/pages_desktop_specific/home/support_and_about_view/desktop_support_view.dart'; import 'package:stackwallet/route_generator.dart'; @@ -19,9 +20,9 @@ class DesktopHomeView extends ConsumerStatefulWidget { } class _DesktopHomeViewState extends ConsumerState { - int currentViewIndex = 0; - final List contentViews = [ - const Navigator( + DesktopMenuItemId currentViewKey = DesktopMenuItemId.myStack; + final Map contentViews = { + DesktopMenuItemId.myStack: const Navigator( key: Key("desktopStackHomeKey"), onGenerateRoute: RouteGenerator.generateRoute, initialRoute: MyStackView.routeName, @@ -30,34 +31,36 @@ class _DesktopHomeViewState extends ConsumerState { // // todo: exchange // color: Colors.green, // ), - Container( - color: Colors.red, + DesktopMenuItemId.notifications: const Navigator( + key: Key("desktopNotificationsHomeKey"), + onGenerateRoute: RouteGenerator.generateRoute, + initialRoute: DesktopNotificationsView.routeName, ), - const Navigator( + DesktopMenuItemId.addressBook: const Navigator( key: Key("desktopAddressBookHomeKey"), onGenerateRoute: RouteGenerator.generateRoute, initialRoute: DesktopAddressBook.routeName, ), - const Navigator( + DesktopMenuItemId.settings: const Navigator( key: Key("desktopSettingHomeKey"), onGenerateRoute: RouteGenerator.generateRoute, initialRoute: DesktopSettingsView.routeName, ), - const Navigator( + DesktopMenuItemId.support: const Navigator( key: Key("desktopSupportHomeKey"), onGenerateRoute: RouteGenerator.generateRoute, initialRoute: DesktopSupportView.routeName, ), - const Navigator( + DesktopMenuItemId.about: const Navigator( key: Key("desktopAboutHomeKey"), onGenerateRoute: RouteGenerator.generateRoute, initialRoute: DesktopAboutView.routeName, ), - ]; + }; - void onMenuSelectionChanged(int newIndex) { + void onMenuSelectionChanged(DesktopMenuItemId newKey) { setState(() { - currentViewIndex = newIndex; + currentViewKey = newKey; }); } @@ -75,7 +78,7 @@ class _DesktopHomeViewState extends ConsumerState { color: Theme.of(context).extension()!.background, ), Expanded( - child: contentViews[currentViewIndex], + child: contentViews[currentViewKey]!, ), ], ), diff --git a/lib/pages_desktop_specific/home/desktop_menu.dart b/lib/pages_desktop_specific/home/desktop_menu.dart index 800a8416e..cfa1a0ff0 100644 --- a/lib/pages_desktop_specific/home/desktop_menu.dart +++ b/lib/pages_desktop_specific/home/desktop_menu.dart @@ -8,13 +8,23 @@ import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart'; +enum DesktopMenuItemId { + myStack, + exchange, + notifications, + addressBook, + settings, + support, + about, +} + class DesktopMenu extends ConsumerStatefulWidget { const DesktopMenu({ Key? key, required this.onSelectionChanged, }) : super(key: key); - final void Function(int)? onSelectionChanged; + final void Function(DesktopMenuItemId)? onSelectionChanged; @override ConsumerState createState() => _DesktopMenuState(); @@ -25,13 +35,13 @@ class _DesktopMenuState extends ConsumerState { static const minimizedWidth = 72.0; double _width = expandedWidth; - int selectedMenuItem = 0; + DesktopMenuItemId selectedMenuItem = DesktopMenuItemId.myStack; - void updateSelectedMenuItem(int index) { + void updateSelectedMenuItem(DesktopMenuItemId idKey) { setState(() { - selectedMenuItem = index; + selectedMenuItem = idKey; }); - widget.onSelectionChanged?.call(index); + widget.onSelectionChanged?.call(idKey); } void toggleMinimize() { @@ -85,7 +95,7 @@ class _DesktopMenuState extends ConsumerState { Assets.svg.walletDesktop, width: 20, height: 20, - color: 0 == selectedMenuItem + color: DesktopMenuItemId.myStack == selectedMenuItem ? Theme.of(context) .extension()! .textDark @@ -95,7 +105,7 @@ class _DesktopMenuState extends ConsumerState { .withOpacity(0.8), ), label: "My Stack", - value: 0, + value: DesktopMenuItemId.myStack, group: selectedMenuItem, onChanged: updateSelectedMenuItem, iconOnly: _width == minimizedWidth, @@ -108,7 +118,7 @@ class _DesktopMenuState extends ConsumerState { // Assets.svg.exchangeDesktop, // width: 20, // height: 20, - // color: 1 == selectedMenuItem + // color: DesktopMenuItemId.exchange == selectedMenuItem // ? Theme.of(context) // .extension()! // .textDark @@ -118,7 +128,7 @@ class _DesktopMenuState extends ConsumerState { // .withOpacity(0.8), // ), // label: "Exchange", - // value: 1, + // value: DesktopMenuItemId.exchange, // group: selectedMenuItem, // onChanged: updateSelectedMenuItem, // iconOnly: _width == minimizedWidth, @@ -131,17 +141,18 @@ class _DesktopMenuState extends ConsumerState { Assets.svg.bell, width: 20, height: 20, - color: 2 == selectedMenuItem - ? Theme.of(context) - .extension()! - .textDark - : Theme.of(context) - .extension()! - .textDark - .withOpacity(0.8), + color: + DesktopMenuItemId.notifications == selectedMenuItem + ? Theme.of(context) + .extension()! + .textDark + : Theme.of(context) + .extension()! + .textDark + .withOpacity(0.8), ), label: "Notifications", - value: 2, + value: DesktopMenuItemId.notifications, group: selectedMenuItem, onChanged: updateSelectedMenuItem, iconOnly: _width == minimizedWidth, @@ -154,7 +165,7 @@ class _DesktopMenuState extends ConsumerState { Assets.svg.addressBookDesktop, width: 20, height: 20, - color: 3 == selectedMenuItem + color: DesktopMenuItemId.addressBook == selectedMenuItem ? Theme.of(context) .extension()! .textDark @@ -164,7 +175,7 @@ class _DesktopMenuState extends ConsumerState { .withOpacity(0.8), ), label: "Address Book", - value: 3, + value: DesktopMenuItemId.addressBook, group: selectedMenuItem, onChanged: updateSelectedMenuItem, iconOnly: _width == minimizedWidth, @@ -177,7 +188,7 @@ class _DesktopMenuState extends ConsumerState { Assets.svg.gear, width: 20, height: 20, - color: 4 == selectedMenuItem + color: DesktopMenuItemId.settings == selectedMenuItem ? Theme.of(context) .extension()! .textDark @@ -187,7 +198,7 @@ class _DesktopMenuState extends ConsumerState { .withOpacity(0.8), ), label: "Settings", - value: 4, + value: DesktopMenuItemId.settings, group: selectedMenuItem, onChanged: updateSelectedMenuItem, iconOnly: _width == minimizedWidth, @@ -200,7 +211,7 @@ class _DesktopMenuState extends ConsumerState { Assets.svg.messageQuestion, width: 20, height: 20, - color: 5 == selectedMenuItem + color: DesktopMenuItemId.support == selectedMenuItem ? Theme.of(context) .extension()! .textDark @@ -210,7 +221,7 @@ class _DesktopMenuState extends ConsumerState { .withOpacity(0.8), ), label: "Support", - value: 5, + value: DesktopMenuItemId.support, group: selectedMenuItem, onChanged: updateSelectedMenuItem, iconOnly: _width == minimizedWidth, @@ -223,7 +234,7 @@ class _DesktopMenuState extends ConsumerState { Assets.svg.aboutDesktop, width: 20, height: 20, - color: 6 == selectedMenuItem + color: DesktopMenuItemId.about == selectedMenuItem ? Theme.of(context) .extension()! .textDark @@ -233,7 +244,7 @@ class _DesktopMenuState extends ConsumerState { .withOpacity(0.8), ), label: "About", - value: 6, + value: DesktopMenuItemId.about, group: selectedMenuItem, onChanged: updateSelectedMenuItem, iconOnly: _width == minimizedWidth, diff --git a/lib/pages_desktop_specific/home/notifications/desktop_notifications_view.dart b/lib/pages_desktop_specific/home/notifications/desktop_notifications_view.dart new file mode 100644 index 000000000..c8e688aa6 --- /dev/null +++ b/lib/pages_desktop_specific/home/notifications/desktop_notifications_view.dart @@ -0,0 +1,59 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:stackwallet/notifications/notification_card.dart'; +import 'package:stackwallet/providers/providers.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/theme/stack_colors.dart'; +import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart'; +import 'package:stackwallet/widgets/desktop/desktop_scaffold.dart'; +import 'package:stackwallet/widgets/rounded_white_container.dart'; + +class DesktopNotificationsView extends ConsumerStatefulWidget { + const DesktopNotificationsView({Key? key}) : super(key: key); + + static const String routeName = "/desktopNotifications"; + + @override + ConsumerState createState() => + _DesktopNotificationsViewState(); +} + +class _DesktopNotificationsViewState + extends ConsumerState { + @override + Widget build(BuildContext context) { + final notifications = + ref.watch(notificationsProvider.select((value) => value.notifications)); + + return DesktopScaffold( + background: Theme.of(context).extension()!.background, + appBar: DesktopAppBar( + isCompactHeight: true, + leading: Padding( + padding: const EdgeInsets.only(left: 24), + child: Text( + "Notifications", + style: STextStyles.desktopH3(context), + ), + ), + ), + body: notifications.isEmpty + ? RoundedWhiteContainer( + child: Center( + child: Text( + "Notifications will appear here", + style: STextStyles.desktopTextExtraExtraSmall(context), + ), + ), + ) + : ListView.builder( + itemCount: notifications.length, + itemBuilder: (context, index) { + return NotificationCard( + notification: notifications[index], + ); + }, + ), + ); + } +} diff --git a/lib/route_generator.dart b/lib/route_generator.dart index f3e37e383..d7865d013 100644 --- a/lib/route_generator.dart +++ b/lib/route_generator.dart @@ -93,6 +93,7 @@ import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/my_stack_v import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/wallet_view/desktop_wallet_view.dart'; import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/wallet_view/sub_widgets/qr_code_desktop_popup_content.dart'; import 'package:stackwallet/pages_desktop_specific/home/my_stack_view/wallet_view/sub_widgets/wallet_keys_desktop_popup.dart'; +import 'package:stackwallet/pages_desktop_specific/home/notifications/desktop_notifications_view.dart'; import 'package:stackwallet/pages_desktop_specific/home/settings_menu/advanced_settings/advanced_settings.dart'; import 'package:stackwallet/pages_desktop_specific/home/settings_menu/appearance_settings.dart'; import 'package:stackwallet/pages_desktop_specific/home/settings_menu/backup_and_restore/backup_and_restore_settings.dart'; @@ -1012,6 +1013,12 @@ class RouteGenerator { builder: (_) => const DesktopHomeView(), settings: RouteSettings(name: settings.name)); + case DesktopNotificationsView.routeName: + return getRoute( + shouldUseMaterialRoute: useMaterialPageRoute, + builder: (_) => const DesktopNotificationsView(), + settings: RouteSettings(name: settings.name)); + case DesktopSettingsView.routeName: return getRoute( shouldUseMaterialRoute: useMaterialPageRoute,