kitty/spotube
1
0
Fork 0
mirror of https://github.com/KRTirtho/spotube.git synced 2025-09-13 07:55:18 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

refactor: use shadcn NavigationBar for mobile navigation bar

Browse Source
This commit is contained in:
Kingkor Roy Tirtho 2024-12-21 09:28:55 +06:00
parent 5ad151932a
commit e73d2d06d8
1 changed files with 17 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
lib/modules/root/spotube_navigation_bar.dart
View File

@ -1,10 +1,8 @@
import 'dart:ui'; import 'package:flutter/material.dart' show Badge;
import 'package:curved_navigation_bar/curved_navigation_bar.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:go_router/go_router.dart'; import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:shadcn_flutter/shadcn_flutter.dart';
import 'package:spotube/collections/side_bar_tiles.dart'; import 'package:spotube/collections/side_bar_tiles.dart';
import 'package:spotube/extensions/constrains.dart'; import 'package:spotube/extensions/constrains.dart';
@ -25,7 +23,6 @@ class SpotubeNavigationBar extends HookConsumerWidget {
@override @override
Widget build(BuildContext context, ref) { Widget build(BuildContext context, ref) {
final theme = Theme.of(context);
final routerState = GoRouterState.of(context); final routerState = GoRouterState.of(context);
final downloadCount = ref.watch(downloadManagerProvider).$downloadCount; final downloadCount = ref.watch(downloadManagerProvider).$downloadCount;
@ -33,11 +30,6 @@ class SpotubeNavigationBar extends HookConsumerWidget {
final layoutMode = final layoutMode =
ref.watch(userPreferencesProvider.select((s) => s.layoutMode)); ref.watch(userPreferencesProvider.select((s) => s.layoutMode));
final buttonColor = useBrightnessValue(
theme.colorScheme.inversePrimary,
theme.colorScheme.primary.withOpacity(0.2),
);
final navbarTileList = useMemoized( final navbarTileList = useMemoized(
() => getNavbarTileList(context.l10n), () => getNavbarTileList(context.l10n),
[context.l10n], [context.l10n],
@ -61,42 +53,21 @@ class SpotubeNavigationBar extends HookConsumerWidget {
return AnimatedContainer( return AnimatedContainer(
duration: const Duration(milliseconds: 100), duration: const Duration(milliseconds: 100),
height: panelHeight, child: NavigationBar(
child: ClipRect( index: selectedIndex,
child: BackdropFilter( onSelected: (i) {
filter: ImageFilter.blur(sigmaX: 15, sigmaY: 15), ServiceUtils.navigateNamed(context, navbarTileList[i].name);
child: CurvedNavigationBar( },
backgroundColor: children: [
theme.colorScheme.secondaryContainer.withOpacity(0.72), for (final tile in navbarTileList)
buttonBackgroundColor: buttonColor, NavigationButton(
color: theme.colorScheme.surface, child: Badge(
height: panelHeight, isLabelVisible: tile.id == "library" && downloadCount > 0,
animationDuration: const Duration(milliseconds: 350), label: Text(downloadCount.toString()),
items: navbarTileList.map( child: Icon(tile.icon),
(e) { ),
/// Using this [Builder] as an workaround for the first item's )
/// icon color not updating unless navigating to another page ],
return Builder(builder: (context) {
return MouseRegion(
cursor: SystemMouseCursors.click,
child: Badge(
isLabelVisible: e.id == "library" && downloadCount > 0,
label: Text(downloadCount.toString()),
child: Icon(
e.icon,
color: Theme.of(context).colorScheme.primary,
),
),
);
});
},
).toList(),
index: selectedIndex,
onTap: (i) {
ServiceUtils.navigateNamed(context, navbarTileList[i].name);
},
),
),
), ),
); );
} }