fix(playbutton_card): play and non play state correction

lib/components/album/album_card.dart

@@ -2,7 +2,6 @@ import 'package:fl_query_hooks/fl_query_hooks.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:platform_ui/platform_ui.dart';
 import 'package:spotify/spotify.dart';
 import 'package:spotube/components/shared/playbutton_card.dart';
 import 'package:spotube/hooks/use_breakpoint_value.dart';
@@ -10,7 +9,6 @@ import 'package:spotube/provider/playlist_queue_provider.dart';
 import 'package:spotube/provider/spotify_provider.dart';
 import 'package:spotube/utils/service_utils.dart';
 import 'package:spotube/utils/type_conversion_utils.dart';
-import 'package:fluent_ui/fluent_ui.dart' as fluent;
 
 enum AlbumType {
   album,
@@ -51,16 +49,17 @@ class AlbumCard extends HookConsumerWidget {
     final queryClient = useQueryClient();
     final query = queryClient
         .getQuery<List<TrackSimple>, dynamic>("album-tracks/${album.id}");
-    final tracks = useState(query?.data ?? album.tracks ?? <Track>[]);
-    bool isPlaylistPlaying = playlistNotifier.isPlayingPlaylist(tracks.value);
+    bool isPlaylistPlaying = useMemoized(
+      () =>
+          playlistNotifier.isPlayingPlaylist(query?.data ?? album.tracks ?? []),
+      [playlistNotifier, query?.data, album.tracks],
+    );
     final int marginH =
         useBreakpointValue(sm: 10, md: 15, lg: 20, xl: 20, xxl: 20);
 
     final updating = useState(false);
     final spotify = ref.watch(spotifyProvider);
 
-    final scaffold = ScaffoldMessenger.of(context);
-
     return PlaybuttonCard(
         imageUrl: TypeConversionUtils.image_X_UrlString(
           album.images,
@@ -68,7 +67,7 @@ class AlbumCard extends HookConsumerWidget {
         ),
         viewType: viewType,
         margin: EdgeInsets.symmetric(horizontal: marginH.toDouble()),
-        isPlaying: isPlaylistPlaying && playing,
+        isPlaying: isPlaylistPlaying,
         isLoading: isPlaylistPlaying && playlist?.isLoading == true,
         title: album.name!,
         description:
@@ -121,7 +120,6 @@ class AlbumCard extends HookConsumerWidget {
             playlistNotifier.add(
               fetchedTracks,
             );
-            tracks.value = fetchedTracks;
             if (context.mounted) {
               final snackbar = SnackBar(
                 content: Text("Added ${album.tracks?.length} tracks to queue"),

lib/components/playlist/playlist_card.dart

@@ -29,8 +29,12 @@ class PlaylistCard extends HookConsumerWidget {
     final query = queryBowl.getQuery<List<Track>, dynamic>(
       "playlist-tracks/${playlist.id}",
     );
-    final tracks = useState(query?.data ?? []);
-    bool isPlaylistPlaying = playlistNotifier.isPlayingPlaylist(tracks.value);
+    final tracks = useState<List<TrackSimple>?>(null);
+    bool isPlaylistPlaying = useMemoized(
+      () =>
+          playlistNotifier.isPlayingPlaylist(tracks.value ?? query?.data ?? []),
+      [playlistNotifier, tracks.value, query?.data],
+    );
 
     final int marginH =
         useBreakpointValue(sm: 10, md: 15, lg: 20, xl: 20, xxl: 20);
@@ -46,7 +50,7 @@ class PlaylistCard extends HookConsumerWidget {
         playlist.images,
         placeholder: ImagePlaceholder.collection,
       ),
-      isPlaying: isPlaylistPlaying && playing,
+      isPlaying: isPlaylistPlaying,
       isLoading: (isPlaylistPlaying && playlistQueue?.isLoading == true) ||
           updating.value,
       onTap: () {
@@ -95,7 +99,7 @@ class PlaylistCard extends HookConsumerWidget {
           tracks.value = fetchedTracks;
           if (context.mounted) {
             final snackbar = SnackBar(
-              content: Text("Added ${tracks.value.length} tracks to queue"),
+              content: Text("Added ${tracks.value?.length} tracks to queue"),
               action: SnackBarAction(
                 label: "Undo",
                 onPressed: () {

lib/pages/album/album.dart

@@ -58,7 +58,7 @@ class AlbumPage extends HookConsumerWidget {
 
     final isAlbumPlaying = useMemoized(
       () => playback.isPlayingPlaylist(tracksSnapshot.data ?? []),
-      [tracksSnapshot.data],
+      [playback, tracksSnapshot.data],
     );
     return TrackCollectionView(
       id: album.id!,

lib/pages/playlist/playlist.dart

@@ -43,6 +43,7 @@ class PlaylistView extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, ref) {
+    ref.watch(PlaylistQueueNotifier.provider);
     final playlistNotifier = ref.watch(PlaylistQueueNotifier.notifier);
 
     final breakpoint = useBreakpoints();
@@ -50,8 +51,10 @@ class PlaylistView extends HookConsumerWidget {
     final meSnapshot = useQueries.user.me(ref);
     final tracksSnapshot = useQueries.playlist.tracksOfQuery(ref, playlist.id!);
 
-    final isPlaylistPlaying =
-        playlistNotifier.isPlayingPlaylist(tracksSnapshot.data ?? []);
+    final isPlaylistPlaying = useMemoized(
+      () => playlistNotifier.isPlayingPlaylist(tracksSnapshot.data ?? []),
+      [playlistNotifier, tracksSnapshot.data],
+    );
 
     final titleImage = useMemoized(
         () => TypeConversionUtils.image_X_UrlString(

lib/provider/playlist_queue_provider.dart

@@ -480,13 +480,9 @@ class PlaylistQueueNotifier extends PersistedStateNotifier<PlaylistQueue?> {
   // utility
   bool isPlayingPlaylist(Iterable<TrackSimple> playlist) {
     if (!isLoaded || playlist.isEmpty) return false;
-    if (state!.isShuffled) {
-      final trackIds = state!.tempTracks.map((track) => track.id!);
-      return blacklist
-          .filter(playlist)
-          .every((track) => trackIds.contains(track.id!));
-    }
-    final trackIds = state!.tracks.map((track) => track.id!);
+
+    final trackIds = (state!.isShuffled ? state!.tempTracks : state!.tracks)
+        .map((track) => track.id!);
     return blacklist
         .filter(playlist)
         .every((track) => trackIds.contains(track.id!));