feat: download button on each track

lib/components/shared/themed_button_tab_bar.dart

@@ -6,7 +6,7 @@ import 'package:spotube/hooks/use_brightness_value.dart';
 import 'package:spotube/utils/platform.dart';
 
 class ThemedButtonsTabBar extends HookWidget implements PreferredSizeWidget {
-  final List<String> tabs;
+  final List<Widget> tabs;
   const ThemedButtonsTabBar({Key? key, required this.tabs}) : super(key: key);
 
   @override
@@ -48,9 +48,7 @@ class ThemedButtonsTabBar extends HookWidget implements PreferredSizeWidget {
         unselectedLabelStyle: theme.textTheme.labelLarge?.copyWith(
           color: theme.colorScheme.primary,
         ),
-        tabs: tabs.map((tab) {
+        tabs: tabs,
-          return Tab(text: "   $tab   ");
-        }).toList(),
       ),
     );
   }

lib/components/shared/track_table/track_options.dart

@@ -16,6 +16,7 @@ import 'package:spotube/extensions/context.dart';
 import 'package:spotube/models/local_track.dart';
 import 'package:spotube/provider/authentication_provider.dart';
 import 'package:spotube/provider/blacklist_provider.dart';
+import 'package:spotube/provider/download_manager_provider.dart';
 import 'package:spotube/provider/proxy_playlist/proxy_playlist_provider.dart';
 import 'package:spotube/services/mutations/mutations.dart';
 import 'package:spotube/utils/type_conversion_utils.dart';
@@ -31,6 +32,7 @@ enum TrackOptionValue {
   playNext,
   favorite,
   details,
+  download,
 }
 
 class TrackOptions extends HookConsumerWidget {
@@ -75,7 +77,8 @@ class TrackOptions extends HookConsumerWidget {
     final playback = ref.watch(ProxyPlaylistNotifier.notifier);
     final scaffoldMessenger = ScaffoldMessenger.of(context);
     final auth = ref.watch(AuthenticationNotifier.provider);
-
+    ref.watch(downloadManagerProvider);
+    final downloadManager = ref.watch(downloadManagerProvider.notifier);
     final blacklist = ref.watch(BlackListNotifier.provider);
 
     final favorites = useTrackToggleLike(track, ref);
@@ -171,6 +174,9 @@ class TrackOptions extends HookConsumerWidget {
                 builder: (context) => TrackDetailsDialog(track: track),
               );
               break;
+            case TrackOptionValue.download:
+              await downloadManager.enqueue(track);
+              break;
           }
         },
         icon: const Icon(SpotubeIcons.moreHorizontal),
@@ -256,12 +262,18 @@ class TrackOptions extends HookConsumerWidget {
                   value: TrackOptionValue.removeFromPlaylist,
                   leading: (removeTrack.isMutating || !removeTrack.hasData) &&
                           removingTrack.value == track.uri
-                      ? const Center(
+                      ? const CircularProgressIndicator()
-                          child: CircularProgressIndicator(),
-                        )
                       : const Icon(SpotubeIcons.removeFilled),
                   title: Text(context.l10n.remove_from_playlist),
                 ),
+              PopSheetEntry(
+                value: TrackOptionValue.download,
+                enabled: downloadManager.activeItem?.id != track.id!,
+                leading: downloadManager.activeItem?.id == track.id!
+                    ? const CircularProgressIndicator()
+                    : const Icon(SpotubeIcons.download),
+                title: Text(context.l10n.download_track),
+              ),
               PopSheetEntry(
                 value: TrackOptionValue.blacklist,
                 leading: const Icon(SpotubeIcons.playlistRemove),

lib/pages/home/home.dart

@@ -19,8 +19,8 @@ class HomePage extends HookConsumerWidget {
           leadingWidth: double.infinity,
           leading: ThemedButtonsTabBar(
             tabs: [
-              context.l10n.personalized,
+              Tab(text: "  ${context.l10n.personalized}  "),
-              context.l10n.genre,
+              Tab(text: "  ${context.l10n.genre}  "),
             ],
           ),
         ),

lib/pages/library/library.dart

@@ -9,11 +9,15 @@ import 'package:spotube/components/library/user_downloads.dart';
 import 'package:spotube/components/library/user_playlists.dart';
 import 'package:spotube/components/shared/themed_button_tab_bar.dart';
 import 'package:spotube/extensions/context.dart';
+import 'package:spotube/provider/download_manager_provider.dart';
 
 class LibraryPage extends HookConsumerWidget {
   const LibraryPage({Key? key}) : super(key: key);
   @override
   Widget build(BuildContext context, ref) {
+    final downloadingCount =
+        ref.watch(downloadManagerProvider.select((s) => s.length));
+
     return DefaultTabController(
       length: 5,
       child: SafeArea(
@@ -23,11 +27,17 @@ class LibraryPage extends HookConsumerWidget {
             centerTitle: true,
             leading: ThemedButtonsTabBar(
               tabs: [
-                context.l10n.playlists,
+                Tab(text: "  ${context.l10n.playlists}  "),
-                context.l10n.tracks,
+                Tab(text: "  ${context.l10n.tracks}  "),
-                context.l10n.downloads,
+                Tab(
-                context.l10n.artists,
+                  child: Badge(
-                context.l10n.albums,
+                    isLabelVisible: downloadingCount > 0,
+                    label: Text(downloadingCount.toString()),
+                    child: Text("  ${context.l10n.downloads}  "),
+                  ),
+                ),
+                Tab(text: "  ${context.l10n.artists}  "),
+                Tab(text: "  ${context.l10n.albums}  "),
               ],
             ),
             leadingWidth: double.infinity,

lib/pages/lyrics/lyrics.dart

@@ -46,8 +46,8 @@ class LyricsPage extends HookConsumerWidget {
 
     final tabbar = ThemedButtonsTabBar(
       tabs: [
-        context.l10n.synced,
+        Tab(text: "  ${context.l10n.synced}  "),
-        context.l10n.plain,
+        Tab(text: "  ${context.l10n.plain}  "),
       ],
     );