Ecosystem/stack_wallet
1
0
Fork 0
mirror of https://github.com/cypherstack/stack_wallet.git synced 2025-03-21 22:58:49 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor desktop main menu and add WIP notifications view

Browse source
This commit is contained in:
julian 2022-11-14 09:50:58 -06:00
parent 5b47d5806d
commit 7cf3a8efba
4 changed files with 119 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
lib/pages_desktop_specific/home/desktop_home_view.dart
View file

@ -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_menu.dart';
import 'package:stackwallet/pages_desktop_specific/home/desktop_settings_view.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/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_about_view.dart';
import 'package:stackwallet/pages_desktop_specific/home/support_and_about_view/desktop_support_view.dart'; import 'package:stackwallet/pages_desktop_specific/home/support_and_about_view/desktop_support_view.dart';
import 'package:stackwallet/route_generator.dart'; import 'package:stackwallet/route_generator.dart';
@ -19,9 +20,9 @@ class DesktopHomeView extends ConsumerStatefulWidget {
} }
class _DesktopHomeViewState extends ConsumerState<DesktopHomeView> { class _DesktopHomeViewState extends ConsumerState<DesktopHomeView> {
int currentViewIndex = 0; DesktopMenuItemId currentViewKey = DesktopMenuItemId.myStack;
final List<Widget> contentViews = [ final Map<DesktopMenuItemId, Widget> contentViews = {
const Navigator( DesktopMenuItemId.myStack: const Navigator(
key: Key("desktopStackHomeKey"), key: Key("desktopStackHomeKey"),
onGenerateRoute: RouteGenerator.generateRoute, onGenerateRoute: RouteGenerator.generateRoute,
initialRoute: MyStackView.routeName, initialRoute: MyStackView.routeName,
@ -30,34 +31,36 @@ class _DesktopHomeViewState extends ConsumerState<DesktopHomeView> {
// // todo: exchange // // todo: exchange
// color: Colors.green, // color: Colors.green,
// ), // ),
Container( DesktopMenuItemId.notifications: const Navigator(
color: Colors.red, key: Key("desktopNotificationsHomeKey"),
onGenerateRoute: RouteGenerator.generateRoute,
initialRoute: DesktopNotificationsView.routeName,
), ),
const Navigator( DesktopMenuItemId.addressBook: const Navigator(
key: Key("desktopAddressBookHomeKey"), key: Key("desktopAddressBookHomeKey"),
onGenerateRoute: RouteGenerator.generateRoute, onGenerateRoute: RouteGenerator.generateRoute,
initialRoute: DesktopAddressBook.routeName, initialRoute: DesktopAddressBook.routeName,
), ),
const Navigator( DesktopMenuItemId.settings: const Navigator(
key: Key("desktopSettingHomeKey"), key: Key("desktopSettingHomeKey"),
onGenerateRoute: RouteGenerator.generateRoute, onGenerateRoute: RouteGenerator.generateRoute,
initialRoute: DesktopSettingsView.routeName, initialRoute: DesktopSettingsView.routeName,
), ),
const Navigator( DesktopMenuItemId.support: const Navigator(
key: Key("desktopSupportHomeKey"), key: Key("desktopSupportHomeKey"),
onGenerateRoute: RouteGenerator.generateRoute, onGenerateRoute: RouteGenerator.generateRoute,
initialRoute: DesktopSupportView.routeName, initialRoute: DesktopSupportView.routeName,
), ),
const Navigator( DesktopMenuItemId.about: const Navigator(
key: Key("desktopAboutHomeKey"), key: Key("desktopAboutHomeKey"),
onGenerateRoute: RouteGenerator.generateRoute, onGenerateRoute: RouteGenerator.generateRoute,
initialRoute: DesktopAboutView.routeName, initialRoute: DesktopAboutView.routeName,
), ),
]; };
void onMenuSelectionChanged(int newIndex) { void onMenuSelectionChanged(DesktopMenuItemId newKey) {
setState(() { setState(() {
currentViewIndex = newIndex; currentViewKey = newKey;
}); });
} }
@ -75,7 +78,7 @@ class _DesktopHomeViewState extends ConsumerState<DesktopHomeView> {
color: Theme.of(context).extension<StackColors>()!.background, color: Theme.of(context).extension<StackColors>()!.background,
), ),
Expanded( Expanded(
child: contentViews[currentViewIndex], child: contentViews[currentViewKey]!,
), ),
], ],
), ),

63
lib/pages_desktop_specific/home/desktop_menu.dart
View file

@ -8,13 +8,23 @@ import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
enum DesktopMenuItemId {
myStack,
exchange,
notifications,
addressBook,
settings,
support,
about,
}
class DesktopMenu extends ConsumerStatefulWidget { class DesktopMenu extends ConsumerStatefulWidget {
const DesktopMenu({ const DesktopMenu({
Key? key, Key? key,
required this.onSelectionChanged, required this.onSelectionChanged,
}) : super(key: key); }) : super(key: key);
final void Function(int)? onSelectionChanged; final void Function(DesktopMenuItemId)? onSelectionChanged;
@override @override
ConsumerState<DesktopMenu> createState() => _DesktopMenuState(); ConsumerState<DesktopMenu> createState() => _DesktopMenuState();
@ -25,13 +35,13 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
static const minimizedWidth = 72.0; static const minimizedWidth = 72.0;
double _width = expandedWidth; double _width = expandedWidth;
int selectedMenuItem = 0; DesktopMenuItemId selectedMenuItem = DesktopMenuItemId.myStack;
void updateSelectedMenuItem(int index) { void updateSelectedMenuItem(DesktopMenuItemId idKey) {
setState(() { setState(() {
selectedMenuItem = index; selectedMenuItem = idKey;
}); });
widget.onSelectionChanged?.call(index); widget.onSelectionChanged?.call(idKey);
} }
void toggleMinimize() { void toggleMinimize() {
@ -85,7 +95,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
Assets.svg.walletDesktop, Assets.svg.walletDesktop,
width: 20, width: 20,
height: 20, height: 20,
color: 0 == selectedMenuItem color: DesktopMenuItemId.myStack == selectedMenuItem
? Theme.of(context) ? Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.textDark .textDark
@ -95,7 +105,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
.withOpacity(0.8), .withOpacity(0.8),
), ),
label: "My Stack", label: "My Stack",
value: 0, value: DesktopMenuItemId.myStack,
group: selectedMenuItem, group: selectedMenuItem,
onChanged: updateSelectedMenuItem, onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth, iconOnly: _width == minimizedWidth,
@ -108,7 +118,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
// Assets.svg.exchangeDesktop, // Assets.svg.exchangeDesktop,
// width: 20, // width: 20,
// height: 20, // height: 20,
// color: 1 == selectedMenuItem // color: DesktopMenuItemId.exchange == selectedMenuItem
// ? Theme.of(context) // ? Theme.of(context)
// .extension<StackColors>()! // .extension<StackColors>()!
// .textDark // .textDark
@ -118,7 +128,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
// .withOpacity(0.8), // .withOpacity(0.8),
// ), // ),
// label: "Exchange", // label: "Exchange",
// value: 1, // value: DesktopMenuItemId.exchange,
// group: selectedMenuItem, // group: selectedMenuItem,
// onChanged: updateSelectedMenuItem, // onChanged: updateSelectedMenuItem,
// iconOnly: _width == minimizedWidth, // iconOnly: _width == minimizedWidth,
@ -131,17 +141,18 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
Assets.svg.bell, Assets.svg.bell,
width: 20, width: 20,
height: 20, height: 20,
color: 2 == selectedMenuItem color:
? Theme.of(context) DesktopMenuItemId.notifications == selectedMenuItem
.extension<StackColors>()! ? Theme.of(context)
.textDark .extension<StackColors>()!
: Theme.of(context) .textDark
.extension<StackColors>()! : Theme.of(context)
.textDark .extension<StackColors>()!
.withOpacity(0.8), .textDark
.withOpacity(0.8),
), ),
label: "Notifications", label: "Notifications",
value: 2, value: DesktopMenuItemId.notifications,
group: selectedMenuItem, group: selectedMenuItem,
onChanged: updateSelectedMenuItem, onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth, iconOnly: _width == minimizedWidth,
@ -154,7 +165,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
Assets.svg.addressBookDesktop, Assets.svg.addressBookDesktop,
width: 20, width: 20,
height: 20, height: 20,
color: 3 == selectedMenuItem color: DesktopMenuItemId.addressBook == selectedMenuItem
? Theme.of(context) ? Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.textDark .textDark
@ -164,7 +175,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
.withOpacity(0.8), .withOpacity(0.8),
), ),
label: "Address Book", label: "Address Book",
value: 3, value: DesktopMenuItemId.addressBook,
group: selectedMenuItem, group: selectedMenuItem,
onChanged: updateSelectedMenuItem, onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth, iconOnly: _width == minimizedWidth,
@ -177,7 +188,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
Assets.svg.gear, Assets.svg.gear,
width: 20, width: 20,
height: 20, height: 20,
color: 4 == selectedMenuItem color: DesktopMenuItemId.settings == selectedMenuItem
? Theme.of(context) ? Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.textDark .textDark
@ -187,7 +198,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
.withOpacity(0.8), .withOpacity(0.8),
), ),
label: "Settings", label: "Settings",
value: 4, value: DesktopMenuItemId.settings,
group: selectedMenuItem, group: selectedMenuItem,
onChanged: updateSelectedMenuItem, onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth, iconOnly: _width == minimizedWidth,
@ -200,7 +211,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
Assets.svg.messageQuestion, Assets.svg.messageQuestion,
width: 20, width: 20,
height: 20, height: 20,
color: 5 == selectedMenuItem color: DesktopMenuItemId.support == selectedMenuItem
? Theme.of(context) ? Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.textDark .textDark
@ -210,7 +221,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
.withOpacity(0.8), .withOpacity(0.8),
), ),
label: "Support", label: "Support",
value: 5, value: DesktopMenuItemId.support,
group: selectedMenuItem, group: selectedMenuItem,
onChanged: updateSelectedMenuItem, onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth, iconOnly: _width == minimizedWidth,
@ -223,7 +234,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
Assets.svg.aboutDesktop, Assets.svg.aboutDesktop,
width: 20, width: 20,
height: 20, height: 20,
color: 6 == selectedMenuItem color: DesktopMenuItemId.about == selectedMenuItem
? Theme.of(context) ? Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.textDark .textDark
@ -233,7 +244,7 @@ class _DesktopMenuState extends ConsumerState<DesktopMenu> {
.withOpacity(0.8), .withOpacity(0.8),
), ),
label: "About", label: "About",
value: 6, value: DesktopMenuItemId.about,
group: selectedMenuItem, group: selectedMenuItem,
onChanged: updateSelectedMenuItem, onChanged: updateSelectedMenuItem,
iconOnly: _width == minimizedWidth, iconOnly: _width == minimizedWidth,

59
lib/pages_desktop_specific/home/notifications/desktop_notifications_view.dart Normal file
View file

@ -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<DesktopNotificationsView> createState() =>
_DesktopNotificationsViewState();
}
class _DesktopNotificationsViewState
extends ConsumerState<DesktopNotificationsView> {
@override
Widget build(BuildContext context) {
final notifications =
ref.watch(notificationsProvider.select((value) => value.notifications));
return DesktopScaffold(
background: Theme.of(context).extension<StackColors>()!.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],
);
},
),
);
}
}

7
lib/route_generator.dart
View file

@ -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/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/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/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/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/appearance_settings.dart';
import 'package:stackwallet/pages_desktop_specific/home/settings_menu/backup_and_restore/backup_and_restore_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(), builder: (_) => const DesktopHomeView(),
settings: RouteSettings(name: settings.name)); settings: RouteSettings(name: settings.name));
case DesktopNotificationsView.routeName:
return getRoute(
shouldUseMaterialRoute: useMaterialPageRoute,
builder: (_) => const DesktopNotificationsView(),
settings: RouteSettings(name: settings.name));
case DesktopSettingsView.routeName: case DesktopSettingsView.routeName:
return getRoute( return getRoute(
shouldUseMaterialRoute: useMaterialPageRoute, shouldUseMaterialRoute: useMaterialPageRoute,