fix(playbutton): playing state is not updating when playlist is actually playing

README.md

@@ -85,7 +85,7 @@ I'm always releasing newer versions of binary of the software each 2-3 month wit
 > **Note!:** If you don't understand this download table. You can read [installation instructions][wiki-installation-instructions] from the wiki
 
 ## Nightly Builds
-Get the latest nightly builds of Spotube [here](https://nightly.link/KRTirtho/spotube/workflows/spotube-nightly/build)
+Get the latest nightly builds of Spotube [here](https://github.com/KRTirtho/spotube/releases/tag/nightly)
 
 # TODO:
 - [ ] Windows OS Media Control & Media Keys Support

lib/components/playlist/playlist_card.dart

@@ -5,11 +5,12 @@ import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:spotify/spotify.dart';
 import 'package:spotube/components/shared/playbutton_card.dart';
 import 'package:spotube/hooks/use_breakpoint_value.dart';
-import 'package:spotube/provider/spotify_provider.dart';
 import 'package:spotube/provider/playlist_queue_provider.dart';
+import 'package:spotube/provider/spotify_provider.dart';
 import 'package:spotube/services/queries/queries.dart';
 import 'package:spotube/utils/service_utils.dart';
 import 'package:spotube/utils/type_conversion_utils.dart';
+import 'package:uuid/uuid.dart';
 
 class PlaylistCard extends HookConsumerWidget {
   final PlaylistSimple playlist;
@@ -24,12 +25,12 @@ class PlaylistCard extends HookConsumerWidget {
     final playlistQueue = ref.watch(PlaylistQueueNotifier.provider);
     final playlistNotifier = ref.watch(PlaylistQueueNotifier.notifier);
     final playing = useStream(PlaylistQueueNotifier.playing).data ?? false;
-    final tracks = QueryBowl.of(context)
+    final queryBowl = QueryBowl.of(context);
-            .getQuery<List<Track>, SpotifyApi>(
+    final query = queryBowl.getQuery<List<Track>, SpotifyApi>(
-                Queries.playlist.tracksOf(playlist.id!).queryKey)
+      Queries.playlist.tracksOf(playlist.id!).queryKey,
-            ?.data ??
+    );
-        [];
+    final tracks = useState(query?.data ?? []);
-    bool isPlaylistPlaying = playlistNotifier.isPlayingPlaylist(tracks);
+    bool isPlaylistPlaying = playlistNotifier.isPlayingPlaylist(tracks.value);
 
     final int marginH =
         useBreakpointValue(sm: 10, md: 15, lg: 20, xl: 20, xxl: 20);
@@ -56,20 +57,18 @@ class PlaylistCard extends HookConsumerWidget {
         } else if (isPlaylistPlaying && !playing) {
           return playlistNotifier.resume();
         }
-        SpotifyApi spotifyApi = ref.read(spotifyProvider);
 
-        List<Track> tracks = (playlist.id != "user-liked-tracks"
+        List<Track> fetchedTracks = await queryBowl.fetchQuery(
-                ? await spotifyApi.playlists
+              key: ValueKey(const Uuid().v4()),
-                    .getTracksByPlaylistId(playlist.id!)
+              Queries.playlist.tracksOf(playlist.id!),
-                    .all()
+              externalData: ref.read(spotifyProvider),
-                : await spotifyApi.tracks.me.saved
+            ) ??
-                    .all()
+            [];
-                    .then((tracks) => tracks.map((e) => e.track!)))
-            .toList();
 
-        if (tracks.isEmpty) return;
+        if (fetchedTracks.isEmpty) return;
 
-        await playlistNotifier.loadAndPlay(tracks);
+        await playlistNotifier.loadAndPlay(fetchedTracks);
+        tracks.value = fetchedTracks;
       },
     );
   }

lib/pages/artist/artist.dart

@@ -286,6 +286,11 @@ class ArtistPage extends HookConsumerWidget {
                         externalData: spotify,
                       );
 
+                      final isPlaylistPlaying =
+                          playlistNotifier.isPlayingPlaylist(
+                        topTracksQuery.data ?? <Track>[],
+                      );
+
                       if (topTracksQuery.isLoading || !topTracksQuery.hasData) {
                         return const PlatformCircularProgressIndicator();
                       } else if (topTracksQuery.hasError) {
@@ -296,10 +301,7 @@ class ArtistPage extends HookConsumerWidget {
 
                       final topTracks = topTracksQuery.data!;
 
-                      final isPlaylistPlaying = useMemoized(() {
+                      void playPlaylist(List<Track> tracks,
-                        return playlistNotifier.isPlayingPlaylist(topTracks);
-                      }, [topTracks]);
-                      playPlaylist(List<Track> tracks,
                           {Track? currentTrack}) async {
                         currentTrack ??= tracks.first;
                         if (!isPlaylistPlaying) {
@@ -321,22 +323,16 @@ class ArtistPage extends HookConsumerWidget {
                               style:
                                   PlatformTheme.of(context).textTheme?.headline,
                             ),
-                            Container(
+                            PlatformIconButton(
-                              margin: const EdgeInsets.symmetric(horizontal: 5),
+                              icon: Icon(
-                              decoration: BoxDecoration(
+                                isPlaylistPlaying
-                                color: PlatformTheme.of(context).primaryColor,
+                                    ? SpotubeIcons.stop
-                                borderRadius: BorderRadius.circular(50),
+                                    : SpotubeIcons.play,
-                              ),
+                                color: Colors.white,
-                              child: PlatformIconButton(
-                                icon: Icon(
-                                  isPlaylistPlaying
-                                      ? SpotubeIcons.stop
-                                      : SpotubeIcons.play,
-                                  color: Colors.white,
-                                ),
-                                onPressed: () =>
-                                    playPlaylist(topTracks.toList()),
                               ),
+                              backgroundColor:
+                                  PlatformTheme.of(context).primaryColor,
+                              onPressed: () => playPlaylist(topTracks.toList()),
                             )
                           ],
                         ),

lib/pages/playlist/playlist.dart

@@ -45,7 +45,6 @@ class PlaylistView extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, ref) {
-    final playlistQueue = ref.watch(PlaylistQueueNotifier.provider);
     final playlistNotifier = ref.watch(PlaylistQueueNotifier.notifier);
     SpotifyApi spotify = ref.watch(spotifyProvider);