import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:stackwallet/pages_desktop_specific/desktop_menu_item.dart'; import 'package:stackwallet/providers/desktop/current_desktop_menu_item.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/widgets/desktop/living_stack_icon.dart'; enum DesktopMenuItemId { myStack, exchange, buy, notifications, addressBook, settings, support, about, } class DesktopMenu extends ConsumerStatefulWidget { const DesktopMenu({ Key? key, this.onSelectionChanged, this.onSelectionWillChange, }) : super(key: key); final void Function(DesktopMenuItemId)? onSelectionChanged; final void Function(DesktopMenuItemId)? onSelectionWillChange; @override ConsumerState createState() => _DesktopMenuState(); } class _DesktopMenuState extends ConsumerState { static const expandedWidth = 225.0; static const minimizedWidth = 72.0; final Duration duration = const Duration(milliseconds: 250); late final List controllers; double _width = expandedWidth; // final _buyDataLoadingService = BuyDataLoadingService(); void updateSelectedMenuItem(DesktopMenuItemId idKey) { widget.onSelectionWillChange?.call(idKey); ref.read(currentDesktopMenuItemProvider.state).state = idKey; widget.onSelectionChanged?.call(idKey); } void toggleMinimize() { final expanded = _width == expandedWidth; for (var e in controllers) { e.toggle?.call(); } setState(() { _width = expanded ? minimizedWidth : expandedWidth; }); } @override void initState() { controllers = [ DMIController(), DMIController(), DMIController(), DMIController(), DMIController(), DMIController(), DMIController(), DMIController(), DMIController(), ]; super.initState(); } @override void dispose() { for (var e in controllers) { e.dispose(); } super.dispose(); } @override Widget build(BuildContext context) { return Material( color: Theme.of(context).extension()!.popupBG, child: AnimatedContainer( width: _width, duration: duration, child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ const SizedBox( height: 25, ), AnimatedContainer( duration: duration, width: _width == expandedWidth ? 70 : 32, child: LivingStackIcon( onPressed: toggleMinimize, ), ), const SizedBox( height: 10, ), AnimatedOpacity( duration: duration, opacity: _width == expandedWidth ? 1 : 0, child: SizedBox( height: 28, child: Text( "Stack Wallet", style: STextStyles.desktopH2(context).copyWith( fontSize: 18, height: 23.4 / 18, ), ), ), ), const SizedBox( height: 60, ), Expanded( child: AnimatedContainer( duration: duration, width: _width == expandedWidth ? _width - 32 // 16 padding on either side : _width - 16, // 8 padding on either side child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ DesktopMenuItem( duration: duration, icon: const DesktopMyStackIcon(), label: "My Stack", value: DesktopMenuItemId.myStack, onChanged: updateSelectedMenuItem, controller: controllers[0], ), const SizedBox( height: 2, ), DesktopMenuItem( duration: duration, icon: const DesktopExchangeIcon(), label: "Exchange", value: DesktopMenuItemId.exchange, onChanged: updateSelectedMenuItem, controller: controllers[1], ), const SizedBox( height: 2, ), DesktopMenuItem( duration: duration, icon: const DesktopBuyIcon(), label: "Buy crypto", value: DesktopMenuItemId.buy, onChanged: updateSelectedMenuItem, controller: controllers[2], ), const SizedBox( height: 2, ), DesktopMenuItem( duration: duration, icon: const DesktopNotificationsIcon(), label: "Notifications", value: DesktopMenuItemId.notifications, onChanged: updateSelectedMenuItem, controller: controllers[3], ), const SizedBox( height: 2, ), DesktopMenuItem( duration: duration, icon: const DesktopAddressBookIcon(), label: "Address Book", value: DesktopMenuItemId.addressBook, onChanged: updateSelectedMenuItem, controller: controllers[4], ), const SizedBox( height: 2, ), DesktopMenuItem( duration: duration, icon: const DesktopSettingsIcon(), label: "Settings", value: DesktopMenuItemId.settings, onChanged: updateSelectedMenuItem, controller: controllers[5], ), const SizedBox( height: 2, ), DesktopMenuItem( duration: duration, icon: const DesktopSupportIcon(), label: "Support", value: DesktopMenuItemId.support, onChanged: updateSelectedMenuItem, controller: controllers[6], ), const SizedBox( height: 2, ), DesktopMenuItem( duration: duration, icon: const DesktopAboutIcon(), label: "About", value: DesktopMenuItemId.about, onChanged: updateSelectedMenuItem, controller: controllers[7], ), const Spacer(), DesktopMenuItem( duration: duration, labelLength: 123, icon: const DesktopExitIcon(), label: "Exit", value: 7, onChanged: (_) { // todo: save stuff/ notify before exit? // exit(0); SystemNavigator.pop(); }, controller: controllers[8], ), ], ), ), ), Row( children: [ const Spacer(), IconButton( splashRadius: 18, onPressed: toggleMinimize, icon: SvgPicture.asset( Assets.svg.minimize, height: 12, width: 12, ), ), ], ), ], ), ), ); } }