Bump version to 1.8.0

- Keep keyboard open while typing and searching
- Improved logging system with levels and bug report sharing

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

README.md

@@ -87,6 +87,8 @@ Ensemble supports multiple authentication methods:
 - Network connectivity to your Music Assistant server
 - Android device (Android 5.0+)
 
+> **Note:** Local device playback (streaming to your phone) is not currently supported on Music Assistant beta 20+. This is due to MA replacing the built-in player with Sendspin. Support will be added once Sendspin is more stable. Remote control of other players works fine.
+
 ## About Music Assistant
 
 Ensemble is a mobile client for [Music Assistant](https://music-assistant.io/), an open-source music library manager that integrates with various music sources and streaming providers.

lib/main.dart

@@ -3,6 +3,7 @@ import 'package:flutter/services.dart';
 import 'package:provider/provider.dart';
 import 'package:audio_service/audio_service.dart';
 import 'providers/music_assistant_provider.dart';
+import 'providers/navigation_provider.dart';
 import 'screens/home_screen.dart';
 import 'screens/login_screen.dart';
 import 'services/settings_service.dart';
@@ -85,6 +86,18 @@ class _MusicAssistantAppState extends State<MusicAssistantApp> with WidgetsBindi
     super.dispose();
   }
 
+  @override
+  Future<bool> didPopRoute() async {
+    // Intercept back button at app level - runs BEFORE Navigator processes it
+    // If player is expanded, collapse it and consume the back gesture
+    if (GlobalPlayerOverlay.isPlayerExpanded) {
+      GlobalPlayerOverlay.collapsePlayer();
+      return true; // We handled it, don't let Navigator process it
+    }
+    // Let Navigator handle the back gesture normally
+    return super.didPopRoute();
+  }
+
   @override
   void didChangeAppLifecycleState(AppLifecycleState state) {
     super.didChangeAppLifecycleState(state);
@@ -134,6 +147,7 @@ class _MusicAssistantAppState extends State<MusicAssistantApp> with WidgetsBindi
                 lightColorScheme: lightColorScheme,
                 darkColorScheme: darkColorScheme,
                 child: MaterialApp(
+                  navigatorKey: navigationProvider.navigatorKey,
                   title: 'Ensemble',
                   debugShowCheckedModeBanner: false,
                   themeMode: themeProvider.themeMode,

lib/providers/music_assistant_provider.dart

@@ -141,7 +141,8 @@ class MusicAssistantProvider with ChangeNotifier {
       _serverUrl = serverUrl;
       await SettingsService.setServerUrl(serverUrl);
 
-      await _api?.disconnect();
+      // Dispose the old API to stop any pending reconnects
+      _api?.dispose();
 
       _api = MusicAssistantAPI(serverUrl, _authManager);
 
@@ -1568,6 +1569,18 @@ class MusicAssistantProvider with ChangeNotifier {
     }
   }
 
+  Future<void> playArtistRadio(String playerId, Artist artist) async {
+    try {
+      await _api?.playArtistRadio(playerId, artist);
+    } catch (e) {
+      final errorInfo = ErrorHandler.handleError(e, context: 'Play artist radio');
+      _error = errorInfo.userMessage;
+      ErrorHandler.logError('Play artist radio', e);
+      notifyListeners();
+      rethrow;
+    }
+  }
+
   Future<String?> getCurrentStreamUrl(String playerId) async {
     return await _api?.getCurrentStreamUrl(playerId);
   }

lib/screens/album_details_screen.dart

@@ -43,8 +43,43 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
     super.initState();
     _isFavorite = widget.album.favorite ?? false;
     _loadTracks();
-    _extractColors();
     _loadAlbumDescription();
+    _refreshFavoriteStatus();
+
+    // CRITICAL FIX: Defer color extraction until after the transition completes
+    // This prevents expensive palette extraction during hero animation
+    // Wait for the first frame to be painted, then extract colors
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      // Add small delay to ensure transition is complete
+      Future.delayed(const Duration(milliseconds: 350), () {
+        if (mounted) {
+          _extractColors();
+        }
+      });
+    });
+  }
+
+  Future<void> _refreshFavoriteStatus() async {
+    final maProvider = context.read<MusicAssistantProvider>();
+    if (maProvider.api == null) return;
+
+    // Need a URI to fetch fresh album data
+    final albumUri = widget.album.uri;
+    if (albumUri == null || albumUri.isEmpty) {
+      _logger.log('Cannot refresh favorite status: album has no URI');
+      return;
+    }
+
+    try {
+      final freshAlbum = await maProvider.api!.getAlbumByUri(albumUri);
+      if (freshAlbum != null && mounted) {
+        setState(() {
+          _isFavorite = freshAlbum.favorite ?? false;
+        });
+      }
+    } catch (e) {
+      _logger.log('Error refreshing favorite status: $e');
+    }
   }
 
   Future<void> _extractColors() async {
@@ -128,6 +163,9 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
         _isFavorite = newState;
       });
 
+      // Invalidate home cache so the home screen shows updated favorite status
+      maProvider.invalidateHomeCache();
+
       if (mounted) {
         ScaffoldMessenger.of(context).showSnackBar(
           SnackBar(
@@ -151,6 +189,92 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
     }
   }
 
+  Future<void> _toggleTrackFavorite(int trackIndex) async {
+    if (trackIndex < 0 || trackIndex >= _tracks.length) return;
+
+    final track = _tracks[trackIndex];
+    final maProvider = context.read<MusicAssistantProvider>();
+    if (maProvider.api == null) return;
+
+    final currentFavorite = track.favorite ?? false;
+
+    try {
+      if (currentFavorite) {
+        // Remove from favorites - need library_item_id
+        int? libraryItemId;
+        if (track.provider == 'library') {
+          libraryItemId = int.tryParse(track.itemId);
+        } else if (track.providerMappings != null) {
+          final libraryMapping = track.providerMappings!.firstWhere(
+            (m) => m.providerInstance == 'library',
+            orElse: () => track.providerMappings!.first,
+          );
+          if (libraryMapping.providerInstance == 'library') {
+            libraryItemId = int.tryParse(libraryMapping.itemId);
+          }
+        }
+
+        if (libraryItemId != null) {
+          await maProvider.api!.removeFromFavorites('track', libraryItemId);
+        }
+      } else {
+        // Add to favorites
+        String actualProvider = track.provider;
+        String actualItemId = track.itemId;
+
+        if (track.providerMappings != null && track.providerMappings!.isNotEmpty) {
+          final mapping = track.providerMappings!.firstWhere(
+            (m) => m.available && m.providerInstance != 'library',
+            orElse: () => track.providerMappings!.firstWhere(
+              (m) => m.available,
+              orElse: () => track.providerMappings!.first,
+            ),
+          );
+          actualProvider = mapping.providerInstance;
+          actualItemId = mapping.itemId;
+        }
+
+        await maProvider.api!.addToFavorites('track', actualItemId, actualProvider);
+      }
+
+      // Update local state - create new track with toggled favorite
+      setState(() {
+        _tracks[trackIndex] = Track(
+          itemId: track.itemId,
+          provider: track.provider,
+          name: track.name,
+          uri: track.uri,
+          favorite: !currentFavorite,
+          artists: track.artists,
+          album: track.album,
+          duration: track.duration,
+          providerMappings: track.providerMappings,
+        );
+      });
+
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text(
+              !currentFavorite ? 'Added to favorites' : 'Removed from favorites',
+            ),
+            duration: const Duration(seconds: 1),
+          ),
+        );
+      }
+    } catch (e) {
+      _logger.log('Error toggling track favorite: $e');
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text('Failed to update favorite: $e'),
+            duration: const Duration(seconds: 2),
+          ),
+        );
+      }
+    }
+  }
+
   Future<void> _loadTracks() async {
     final provider = context.read<MusicAssistantProvider>();
     final tracks = await provider.getAlbumTracksWithCache(
@@ -417,18 +541,32 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
 
   @override
   Widget build(BuildContext context) {
-    final maProvider = context.watch<MusicAssistantProvider>();
-    final themeProvider = context.watch<ThemeProvider>();
-    final imageUrl = maProvider.getImageUrl(widget.album, size: 512);
-    
+    // CRITICAL FIX: Use select() instead of watch() to reduce rebuilds
+    // Only rebuild when specific properties change, not on every provider update
+    final imageUrl = context.select<MusicAssistantProvider, String?>(
+      (provider) => provider.getImageUrl(widget.album, size: 512),
+    );
+    final adaptiveTheme = context.select<ThemeProvider, bool>(
+      (provider) => provider.adaptiveTheme,
+    );
+    final adaptiveLightScheme = context.select<ThemeProvider, ColorScheme?>(
+      (provider) => provider.adaptiveLightScheme,
+    );
+    final adaptiveDarkScheme = context.select<ThemeProvider, ColorScheme?>(
+      (provider) => provider.adaptiveDarkScheme,
+    );
+
     // Determine if we should use adaptive theme colors
-    final useAdaptiveTheme = themeProvider.adaptiveTheme;
     final isDark = Theme.of(context).brightness == Brightness.dark;
 
-    // Get the color scheme to use
+    // Get the color scheme to use - prefer local state over provider
+    // Local state (_darkColorScheme/_lightColorScheme) is set by _extractColors()
     ColorScheme? adaptiveScheme;
-    if (useAdaptiveTheme) {
-      adaptiveScheme = isDark ? _darkColorScheme : _lightColorScheme;
+    if (adaptiveTheme) {
+      // Use local state first (from _extractColors), fallback to provider
+      adaptiveScheme = isDark
+        ? (_darkColorScheme ?? adaptiveDarkScheme)
+        : (_lightColorScheme ?? adaptiveLightScheme);
     }
 
     // Use adaptive scheme if available, otherwise use global theme
@@ -748,39 +886,60 @@ class _AlbumDetailsScreenState extends State<AlbumDetailsScreen> with SingleTick
                         curve: Curves.easeInOut,
                         child: isExpanded
                             ? Padding(
-                                padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
+                                padding: const EdgeInsets.only(right: 16.0, bottom: 12.0, top: 4.0),
                                 child: Row(
+                                  mainAxisAlignment: MainAxisAlignment.end,
                                   children: [
-                                    Expanded(
-                                      child: SizedBox(
-                                        height: 48,
-                                        child: FilledButton.tonal(
-                                          onPressed: () => _showPlayRadioMenu(context, index),
-                                          style: FilledButton.styleFrom(
-                                            backgroundColor: colorScheme.tertiaryContainer,
-                                            foregroundColor: colorScheme.onTertiaryContainer,
-                                            shape: RoundedRectangleBorder(
-                                              borderRadius: BorderRadius.circular(12),
-                                            ),
+                                    // Radio button
+                                    SizedBox(
+                                      height: 44,
+                                      width: 44,
+                                      child: FilledButton.tonal(
+                                        onPressed: () => _showPlayRadioMenu(context, index),
+                                        style: FilledButton.styleFrom(
+                                          padding: EdgeInsets.zero,
+                                          shape: RoundedRectangleBorder(
+                                            borderRadius: BorderRadius.circular(12),
                                           ),
-                                          child: const Text('Start radio'),
                                         ),
+                                        child: const Icon(Icons.radio, size: 20),
                                       ),
                                     ),
-                                    const SizedBox(width: 12),
-                                    Expanded(
-                                      child: SizedBox(
-                                        height: 48,
-                                        child: FilledButton.tonal(
-                                          onPressed: () => _addTrackToQueue(context, index),
-                                          style: FilledButton.styleFrom(
-                                            backgroundColor: colorScheme.secondaryContainer,
-                                            foregroundColor: colorScheme.onSecondaryContainer,
-                                            shape: RoundedRectangleBorder(
-                                              borderRadius: BorderRadius.circular(12),
-                                            ),
+                                    const SizedBox(width: 10),
+                                    // Add to queue button
+                                    SizedBox(
+                                      height: 44,
+                                      width: 44,
+                                      child: FilledButton.tonal(
+                                        onPressed: () => _addTrackToQueue(context, index),
+                                        style: FilledButton.styleFrom(
+                                          padding: EdgeInsets.zero,
+                                          shape: RoundedRectangleBorder(
+                                            borderRadius: BorderRadius.circular(12),
                                           ),
-                                          child: const Text('Add to queue'),
+                                        ),
+                                        child: const Icon(Icons.playlist_add, size: 20),
+                                      ),
+                                    ),
+                                    const SizedBox(width: 10),
+                                    // Favorite button
+                                    SizedBox(
+                                      height: 44,
+                                      width: 44,
+                                      child: FilledButton.tonal(
+                                        onPressed: () => _toggleTrackFavorite(index),
+                                        style: FilledButton.styleFrom(
+                                          padding: EdgeInsets.zero,
+                                          shape: RoundedRectangleBorder(
+                                            borderRadius: BorderRadius.circular(22),
+                                          ),
+                                        ),
+                                        child: Icon(
+                                          track.favorite == true ? Icons.favorite : Icons.favorite_border,
+                                          size: 20,
+                                          color: track.favorite == true
+                                              ? colorScheme.error
+                                              : colorScheme.onSurfaceVariant,
                                         ),
                                       ),
                                     ),

lib/screens/artist_details_screen.dart

@@ -31,6 +31,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
   List<Album> _albums = [];
   List<Album> _providerAlbums = [];
   bool _isLoading = true;
+  bool _isFavorite = false;
   ColorScheme? _lightColorScheme;
   ColorScheme? _darkColorScheme;
   bool _isDescriptionExpanded = false;
@@ -42,9 +43,265 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
   @override
   void initState() {
     super.initState();
+    _isFavorite = widget.artist.favorite ?? false;
     _loadArtistAlbums();
-    _loadArtistImage();
     _loadArtistDescription();
+    _refreshFavoriteStatus();
+
+    // CRITICAL FIX: Defer image loading and color extraction until after transition
+    // This prevents expensive operations during hero animation
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      Future.delayed(const Duration(milliseconds: 350), () {
+        if (mounted) {
+          _loadArtistImage();
+          // Note: _extractColors is called by _loadArtistImage after image loads
+        }
+      });
+    });
+  }
+
+  Future<void> _refreshFavoriteStatus() async {
+    final maProvider = context.read<MusicAssistantProvider>();
+    if (maProvider.api == null) return;
+
+    final artistUri = widget.artist.uri;
+    if (artistUri == null || artistUri.isEmpty) {
+      _logger.log('Cannot refresh favorite status: artist has no URI');
+      return;
+    }
+
+    try {
+      final freshArtist = await maProvider.api!.getArtistByUri(artistUri);
+      if (freshArtist != null && mounted) {
+        setState(() {
+          _isFavorite = freshArtist.favorite ?? false;
+        });
+      }
+    } catch (e) {
+      _logger.log('Error refreshing artist favorite status: $e');
+    }
+  }
+
+  Future<void> _toggleFavorite() async {
+    final maProvider = context.read<MusicAssistantProvider>();
+    if (maProvider.api == null) return;
+
+    try {
+      final newState = !_isFavorite;
+
+      if (newState) {
+        String actualProvider = widget.artist.provider;
+        String actualItemId = widget.artist.itemId;
+
+        if (widget.artist.providerMappings != null && widget.artist.providerMappings!.isNotEmpty) {
+          final mapping = widget.artist.providerMappings!.firstWhere(
+            (m) => m.available && m.providerInstance != 'library',
+            orElse: () => widget.artist.providerMappings!.firstWhere(
+              (m) => m.available,
+              orElse: () => widget.artist.providerMappings!.first,
+            ),
+          );
+          actualProvider = mapping.providerInstance;
+          actualItemId = mapping.itemId;
+        }
+
+        _logger.log('Adding artist to favorites: provider=$actualProvider, itemId=$actualItemId');
+        await maProvider.api!.addToFavorites('artist', actualItemId, actualProvider);
+      } else {
+        int? libraryItemId;
+
+        if (widget.artist.provider == 'library') {
+          libraryItemId = int.tryParse(widget.artist.itemId);
+        } else if (widget.artist.providerMappings != null) {
+          final libraryMapping = widget.artist.providerMappings!.firstWhere(
+            (m) => m.providerInstance == 'library',
+            orElse: () => widget.artist.providerMappings!.first,
+          );
+          if (libraryMapping.providerInstance == 'library') {
+            libraryItemId = int.tryParse(libraryMapping.itemId);
+          }
+        }
+
+        if (libraryItemId == null) {
+          _logger.log('Error: Could not determine library_item_id for removal');
+          throw Exception('Could not determine library ID for this artist');
+        }
+
+        _logger.log('Removing artist from favorites: libraryItemId=$libraryItemId');
+        await maProvider.api!.removeFromFavorites('artist', libraryItemId);
+      }
+
+      setState(() {
+        _isFavorite = newState;
+      });
+
+      maProvider.invalidateHomeCache();
+
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text(
+              _isFavorite ? 'Added to favorites' : 'Removed from favorites',
+            ),
+            duration: const Duration(seconds: 1),
+          ),
+        );
+      }
+    } catch (e) {
+      _logger.log('Error toggling artist favorite: $e');
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text('Failed to update favorite: $e'),
+            duration: const Duration(seconds: 2),
+          ),
+        );
+      }
+    }
+  }
+
+  Future<void> _startArtistRadio() async {
+    final maProvider = context.read<MusicAssistantProvider>();
+    final selectedPlayer = maProvider.selectedPlayer;
+
+    if (selectedPlayer == null) {
+      ScaffoldMessenger.of(context).showSnackBar(
+        const SnackBar(content: Text('No player selected')),
+      );
+      return;
+    }
+
+    try {
+      await maProvider.playArtistRadio(selectedPlayer.playerId, widget.artist);
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text('Starting ${widget.artist.name} radio'),
+            duration: const Duration(seconds: 1),
+          ),
+        );
+      }
+    } catch (e) {
+      _logger.log('Error starting artist radio: $e');
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text('Failed to start radio: $e'),
+            backgroundColor: Colors.red,
+          ),
+        );
+      }
+    }
+  }
+
+  void _showPlayOnMenu(BuildContext context) {
+    final maProvider = context.read<MusicAssistantProvider>();
+    final players = maProvider.availablePlayers;
+    final colorScheme = Theme.of(context).colorScheme;
+
+    showModalBottomSheet(
+      context: context,
+      backgroundColor: colorScheme.surface,
+      shape: const RoundedRectangleBorder(
+        borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
+      ),
+      builder: (context) => Padding(
+        padding: const EdgeInsets.all(16.0),
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              'Start ${widget.artist.name} radio on...',
+              style: Theme.of(context).textTheme.titleLarge,
+            ),
+            const SizedBox(height: 16),
+            if (players.isEmpty)
+              const Padding(
+                padding: EdgeInsets.all(32.0),
+                child: Text('No players available'),
+              )
+            else
+              Flexible(
+                child: ListView.builder(
+                  shrinkWrap: true,
+                  itemCount: players.length,
+                  itemBuilder: (context, index) {
+                    final player = players[index];
+                    return ListTile(
+                      leading: Icon(
+                        Icons.speaker,
+                        color: colorScheme.onSurface,
+                      ),
+                      title: Text(player.name),
+                      onTap: () async {
+                        Navigator.pop(context);
+                        try {
+                          await maProvider.playArtistRadio(player.playerId, widget.artist);
+                          if (mounted) {
+                            ScaffoldMessenger.of(context).showSnackBar(
+                              SnackBar(
+                                content: Text('Starting ${widget.artist.name} radio on ${player.name}'),
+                                duration: const Duration(seconds: 1),
+                              ),
+                            );
+                          }
+                        } catch (e) {
+                          _logger.log('Error starting artist radio on player: $e');
+                          if (mounted) {
+                            ScaffoldMessenger.of(context).showSnackBar(
+                              SnackBar(
+                                content: Text('Failed to start radio: $e'),
+                                backgroundColor: Colors.red,
+                              ),
+                            );
+                          }
+                        }
+                      },
+                    );
+                  },
+                ),
+              ),
+            const SizedBox(height: 16),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Future<void> _addArtistRadioToQueue() async {
+    final maProvider = context.read<MusicAssistantProvider>();
+    final selectedPlayer = maProvider.selectedPlayer;
+
+    if (selectedPlayer == null) {
+      ScaffoldMessenger.of(context).showSnackBar(
+        const SnackBar(content: Text('No player selected')),
+      );
+      return;
+    }
+
+    try {
+      // For adding to queue with radio mode, we use radio_mode but with 'add' option
+      await maProvider.api?.playArtistRadioToQueue(selectedPlayer.playerId, widget.artist);
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text('Added ${widget.artist.name} radio to queue'),
+            duration: const Duration(seconds: 1),
+          ),
+        );
+      }
+    } catch (e) {
+      _logger.log('Error adding artist radio to queue: $e');
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text('Failed to add to queue: $e'),
+            backgroundColor: Colors.red,
+          ),
+        );
+      }
+    }
   }
 
   Future<void> _loadArtistImage() async {
@@ -113,16 +370,30 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
   
   @override
   Widget build(BuildContext context) {
-    final maProvider = context.watch<MusicAssistantProvider>();
-    final themeProvider = context.watch<ThemeProvider>();
+    // CRITICAL FIX: Use select() instead of watch() to reduce rebuilds
+    // Only rebuild when specific properties change, not on every provider update
+    final adaptiveTheme = context.select<ThemeProvider, bool>(
+      (provider) => provider.adaptiveTheme,
+    );
+    final adaptiveLightScheme = context.select<ThemeProvider, ColorScheme?>(
+      (provider) => provider.adaptiveLightScheme,
+    );
+    final adaptiveDarkScheme = context.select<ThemeProvider, ColorScheme?>(
+      (provider) => provider.adaptiveDarkScheme,
+    );
+
     // Use the loaded image URL (with fallback) instead of directly from MA
     final imageUrl = _artistImageUrl;
 
-    final useAdaptiveTheme = themeProvider.adaptiveTheme;
     final isDark = Theme.of(context).brightness == Brightness.dark;
+
+    // Get the color scheme to use - prefer local state over provider
     ColorScheme? adaptiveScheme;
-    if (useAdaptiveTheme) {
-      adaptiveScheme = isDark ? _darkColorScheme : _lightColorScheme;
+    if (adaptiveTheme) {
+      // Use local state first (from _extractColors), fallback to provider
+      adaptiveScheme = isDark
+        ? (_darkColorScheme ?? adaptiveDarkScheme)
+        : (_lightColorScheme ?? adaptiveLightScheme);
     }
     final colorScheme = adaptiveScheme ?? Theme.of(context).colorScheme;
     final textTheme = Theme.of(context).textTheme;
@@ -226,6 +497,89 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                     ),
                     const SizedBox(height: 8),
                   ],
+                  // Action Buttons Row
+                  Row(
+                    children: [
+                      // Main Radio Button
+                      Expanded(
+                        flex: 2,
+                        child: SizedBox(
+                          height: 50,
+                          child: ElevatedButton.icon(
+                            onPressed: _startArtistRadio,
+                            icon: const Icon(Icons.radio),
+                            label: const Text('Radio'),
+                            style: ElevatedButton.styleFrom(
+                              backgroundColor: colorScheme.primary,
+                              foregroundColor: colorScheme.onPrimary,
+                              shape: RoundedRectangleBorder(
+                                borderRadius: BorderRadius.circular(12),
+                              ),
+                            ),
+                          ),
+                        ),
+                      ),
+                      const SizedBox(width: 12),
+
+                      // "Play on..." Button (Square)
+                      SizedBox(
+                        height: 50,
+                        width: 50,
+                        child: FilledButton.tonal(
+                          onPressed: () => _showPlayOnMenu(context),
+                          style: FilledButton.styleFrom(
+                            padding: EdgeInsets.zero,
+                            shape: RoundedRectangleBorder(
+                              borderRadius: BorderRadius.circular(12),
+                            ),
+                          ),
+                          child: const Icon(Icons.speaker_group_outlined),
+                        ),
+                      ),
+
+                      const SizedBox(width: 12),
+
+                      // "Add to Queue" Button (Square)
+                      SizedBox(
+                        height: 50,
+                        width: 50,
+                        child: FilledButton.tonal(
+                          onPressed: _addArtistRadioToQueue,
+                          style: FilledButton.styleFrom(
+                            padding: EdgeInsets.zero,
+                            shape: RoundedRectangleBorder(
+                              borderRadius: BorderRadius.circular(12),
+                            ),
+                          ),
+                          child: const Icon(Icons.playlist_add),
+                        ),
+                      ),
+
+                      const SizedBox(width: 12),
+
+                      // Favorite Button
+                      SizedBox(
+                        height: 50,
+                        width: 50,
+                        child: FilledButton.tonal(
+                          onPressed: _toggleFavorite,
+                          style: FilledButton.styleFrom(
+                            padding: EdgeInsets.zero,
+                            shape: RoundedRectangleBorder(
+                              borderRadius: BorderRadius.circular(25),
+                            ),
+                          ),
+                          child: Icon(
+                            _isFavorite ? Icons.favorite : Icons.favorite_border,
+                            color: _isFavorite
+                                ? colorScheme.error
+                                : colorScheme.onSurfaceVariant,
+                          ),
+                        ),
+                      ),
+                    ],
+                  ),
+                  const SizedBox(height: 16),
                 ],
               ),
             ),
@@ -275,7 +629,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                   delegate: SliverChildBuilderDelegate(
                     (context, index) {
                       final album = _albums[index];
-                      return _buildAlbumCard(album, maProvider);
+                      return _buildAlbumCard(album);
                     },
                     childCount: _albums.length,
                   ),
@@ -309,7 +663,7 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
                   delegate: SliverChildBuilderDelegate(
                     (context, index) {
                       final album = _providerAlbums[index];
-                      return _buildAlbumCard(album, maProvider);
+                      return _buildAlbumCard(album);
                     },
                     childCount: _providerAlbums.length,
                   ),
@@ -324,8 +678,10 @@ class _ArtistDetailsScreenState extends State<ArtistDetailsScreen> {
     );
   }
 
-  Widget _buildAlbumCard(Album album, MusicAssistantProvider provider) {
-    final imageUrl = provider.getImageUrl(album, size: 256);
+  Widget _buildAlbumCard(Album album) {
+    // Use read instead of passing provider to avoid rebuild dependencies
+    final maProvider = context.read<MusicAssistantProvider>();
+    final imageUrl = maProvider.getImageUrl(album, size: 256);
     final colorScheme = Theme.of(context).colorScheme;
     final textTheme = Theme.of(context).textTheme;
     const String heroSuffix = 'artist_albums';

lib/screens/debug_log_screen.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:provider/provider.dart';
+import 'package:share_plus/share_plus.dart';
 import '../services/debug_logger.dart';
 import '../providers/music_assistant_provider.dart';
 import '../widgets/global_player_overlay.dart';
@@ -15,6 +16,8 @@ class DebugLogScreen extends StatefulWidget {
 class _DebugLogScreenState extends State<DebugLogScreen> {
   final _logger = DebugLogger();
   final _scrollController = ScrollController();
+  LogLevel _filterLevel = LogLevel.debug; // Show all by default
+  bool _isGeneratingReport = false;
 
   @override
   void initState() {
@@ -33,17 +36,37 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
     super.dispose();
   }
 
+  List<LogEntry> get _filteredEntries =>
+      _logger.entries.where((e) => e.level.index >= _filterLevel.index).toList();
+
   void _copyLogs() {
     Clipboard.setData(ClipboardData(text: _logger.getAllLogs()));
     ScaffoldMessenger.of(context).showSnackBar(
       const SnackBar(
-        content: Text('Logs copied to clipboard!'),
+        content: Text('Logs copied to clipboard'),
         backgroundColor: Colors.green,
         duration: Duration(seconds: 2),
       ),
     );
   }
 
+  Future<void> _shareBugReport() async {
+    setState(() => _isGeneratingReport = true);
+
+    try {
+      final report = await _logger.generateBugReport();
+
+      await Share.share(
+        report,
+        subject: 'Ensemble Bug Report',
+      );
+    } finally {
+      if (mounted) {
+        setState(() => _isGeneratingReport = false);
+      }
+    }
+  }
+
   void _clearLogs() {
     setState(() {
       _logger.clear();
@@ -216,16 +239,39 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
         ),
         centerTitle: true,
         actions: [
+          // Share bug report button
+          _isGeneratingReport
+              ? const Padding(
+                  padding: EdgeInsets.all(12),
+                  child: SizedBox(
+                    width: 24,
+                    height: 24,
+                    child: CircularProgressIndicator(
+                      strokeWidth: 2,
+                      color: Colors.white,
+                    ),
+                  ),
+                )
+              : IconButton(
+                  icon: const Icon(Icons.share_rounded),
+                  onPressed: _shareBugReport,
+                  color: Colors.white,
+                  tooltip: 'Share bug report',
+                ),
           PopupMenuButton<String>(
             icon: const Icon(Icons.more_vert, color: Colors.white),
-            tooltip: 'Player tools',
+            tooltip: 'More options',
             onSelected: (value) async {
               switch (value) {
                 case 'show_players':
                   _showAllPlayers();
                   break;
-                // NOTE: Ghost cleanup and repair options removed - MA APIs don't work
-                // reliably and caused corrupt entries. See PLAYER_LIFECYCLE_GUIDE.md
+                case 'copy_logs':
+                  _copyLogs();
+                  break;
+                case 'clear_logs':
+                  _clearLogs();
+                  break;
               }
             },
             itemBuilder: (context) => [
@@ -237,49 +283,61 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
                   dense: true,
                 ),
               ),
+              const PopupMenuItem(
+                value: 'copy_logs',
+                child: ListTile(
+                  leading: Icon(Icons.copy_rounded),
+                  title: Text('Copy Logs'),
+                  dense: true,
+                ),
+              ),
+              const PopupMenuItem(
+                value: 'clear_logs',
+                child: ListTile(
+                  leading: Icon(Icons.delete_rounded),
+                  title: Text('Clear Logs'),
+                  dense: true,
+                ),
+              ),
             ],
           ),
-          IconButton(
-            icon: const Icon(Icons.copy_rounded),
-            onPressed: _copyLogs,
-            color: Colors.white,
-            tooltip: 'Copy logs',
-          ),
-          IconButton(
-            icon: const Icon(Icons.delete_rounded),
-            onPressed: _clearLogs,
-            color: Colors.white,
-            tooltip: 'Clear logs',
-          ),
         ],
       ),
       body: Column(
         children: [
+          // Filter chips and stats
           Container(
-            padding: const EdgeInsets.all(16),
+            padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
             color: Colors.white.withOpacity(0.05),
-            child: Row(
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
               children: [
-                const Icon(
-                  Icons.info_outline_rounded,
-                  color: Colors.white70,
-                  size: 16,
-                ),
-                const SizedBox(width: 8),
-                Expanded(
-                  child: Text(
-                    'Last ${_logger.logs.length} log entries',
-                    style: const TextStyle(
-                      color: Colors.white70,
-                      fontSize: 12,
-                    ),
+                // Level filter chips
+                SingleChildScrollView(
+                  scrollDirection: Axis.horizontal,
+                  child: Row(
+                    children: [
+                      _buildFilterChip('All', LogLevel.debug),
+                      const SizedBox(width: 8),
+                      _buildFilterChip('Info+', LogLevel.info),
+                      const SizedBox(width: 8),
+                      _buildFilterChip('Warnings', LogLevel.warning),
+                      const SizedBox(width: 8),
+                      _buildFilterChip('Errors', LogLevel.error),
+                    ],
                   ),
                 ),
+                const SizedBox(height: 8),
+                // Stats
+                Text(
+                  'Showing ${_filteredEntries.length} of ${_logger.entries.length} entries',
+                  style: const TextStyle(color: Colors.white54, fontSize: 11),
+                ),
               ],
             ),
           ),
           Expanded(
-            child: _logger.logs.isEmpty
+            child: _filteredEntries.isEmpty
                 ? const Center(
                     child: Text(
                       'No logs yet',
@@ -291,43 +349,11 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
                   )
                 : ListView.builder(
                     controller: _scrollController,
-                    padding: EdgeInsets.fromLTRB(8, 8, 8, BottomSpacing.navBarOnly + 56), // Extra space for FAB
-                    itemCount: _logger.logs.length,
+                    padding: EdgeInsets.fromLTRB(8, 8, 8, BottomSpacing.navBarOnly + 56),
+                    itemCount: _filteredEntries.length,
                     itemBuilder: (context, index) {
-                      final log = _logger.logs[index];
-                      final isError = log.contains('Error') ||
-                          log.contains('error') ||
-                          log.contains('ERROR') ||
-                          log.contains('failed') ||
-                          log.contains('Failed');
-
-                      return Container(
-                        margin: const EdgeInsets.only(bottom: 4),
-                        padding: const EdgeInsets.symmetric(
-                          horizontal: 12,
-                          vertical: 8,
-                        ),
-                        decoration: BoxDecoration(
-                          color: isError
-                              ? Colors.red.withOpacity(0.1)
-                              : Colors.white.withOpacity(0.03),
-                          borderRadius: BorderRadius.circular(4),
-                          border: Border.all(
-                            color: isError
-                                ? Colors.red.withOpacity(0.3)
-                                : Colors.white.withOpacity(0.1),
-                          ),
-                        ),
-                        child: Text(
-                          log,
-                          style: TextStyle(
-                            color: isError ? Colors.red[300] : Colors.white70,
-                            fontSize: 11,
-                            fontFamily: 'monospace',
-                            height: 1.4,
-                          ),
-                        ),
-                      );
+                      final entry = _filteredEntries[index];
+                      return _buildLogEntry(entry);
                     },
                   ),
           ),
@@ -353,4 +379,68 @@ class _DebugLogScreenState extends State<DebugLogScreen> {
       ),
     );
   }
+
+  Widget _buildFilterChip(String label, LogLevel level) {
+    final isSelected = _filterLevel == level;
+    return FilterChip(
+      label: Text(label),
+      selected: isSelected,
+      showCheckmark: false,
+      onSelected: (_) {
+        setState(() {
+          _filterLevel = level;
+        });
+      },
+      backgroundColor: Colors.white.withOpacity(0.1),
+      selectedColor: _getLevelColor(level).withOpacity(0.3),
+      labelStyle: TextStyle(
+        color: isSelected ? _getLevelColor(level) : Colors.white70,
+        fontWeight: isSelected ? FontWeight.bold : FontWeight.normal,
+        fontSize: 12,
+      ),
+      side: BorderSide(
+        color: isSelected ? _getLevelColor(level) : Colors.transparent,
+      ),
+    );
+  }
+
+  Widget _buildLogEntry(LogEntry entry) {
+    final color = _getLevelColor(entry.level);
+
+    return Container(
+      margin: const EdgeInsets.only(bottom: 4),
+      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
+      decoration: BoxDecoration(
+        color: color.withOpacity(0.1),
+        borderRadius: BorderRadius.circular(4),
+        border: Border.all(color: color.withOpacity(0.3)),
+      ),
+      child: Text(
+        entry.formatted,
+        style: TextStyle(
+          color: entry.level == LogLevel.error
+              ? Colors.red[300]
+              : entry.level == LogLevel.warning
+                  ? Colors.orange[300]
+                  : Colors.white70,
+          fontSize: 11,
+          fontFamily: 'monospace',
+          height: 1.4,
+        ),
+      ),
+    );
+  }
+
+  Color _getLevelColor(LogLevel level) {
+    switch (level) {
+      case LogLevel.debug:
+        return Colors.grey;
+      case LogLevel.info:
+        return Colors.blue;
+      case LogLevel.warning:
+        return Colors.orange;
+      case LogLevel.error:
+        return Colors.red;
+    }
+  }
 }

lib/screens/new_library_screen.dart

@@ -27,11 +27,16 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
     with SingleTickerProviderStateMixin, RestorationMixin {
   late TabController _tabController;
   List<Playlist> _playlists = [];
+  List<Track> _favoriteTracks = [];
   bool _isLoadingPlaylists = true;
+  bool _isLoadingTracks = false;
+  bool _showFavoritesOnly = false;
 
   // Restoration: Remember selected tab across app restarts
   final RestorableInt _selectedTabIndex = RestorableInt(0);
 
+  int get _tabCount => _showFavoritesOnly ? 4 : 3;
+
   @override
   String? get restorationId => 'new_library_screen';
 
@@ -39,7 +44,8 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
   void restoreState(RestorationBucket? oldBucket, bool initialRestore) {
     registerForRestoration(_selectedTabIndex, 'selected_tab_index');
     // Apply restored tab index after TabController is created
-    if (_tabController.index != _selectedTabIndex.value) {
+    if (_tabController.index != _selectedTabIndex.value &&
+        _selectedTabIndex.value < _tabController.length) {
       _tabController.index = _selectedTabIndex.value;
     }
   }
@@ -47,12 +53,24 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
   @override
   void initState() {
     super.initState();
-    _tabController = TabController(length: 3, vsync: this);
+    _tabController = TabController(length: _tabCount, vsync: this);
     // Listen to tab changes to persist selection
     _tabController.addListener(_onTabChanged);
     _loadPlaylists();
   }
 
+  void _recreateTabController() {
+    final oldIndex = _tabController.index;
+    _tabController.removeListener(_onTabChanged);
+    _tabController.dispose();
+    _tabController = TabController(length: _tabCount, vsync: this);
+    _tabController.addListener(_onTabChanged);
+    // Restore to previous index if valid, otherwise default to 0
+    if (oldIndex < _tabCount) {
+      _tabController.index = oldIndex;
+    }
+  }
+
   void _onTabChanged() {
     if (!_tabController.indexIsChanging) {
       _selectedTabIndex.value = _tabController.index;
@@ -67,10 +85,13 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
     super.dispose();
   }
 
-  Future<void> _loadPlaylists() async {
+  Future<void> _loadPlaylists({bool? favoriteOnly}) async {
     final maProvider = context.read<MusicAssistantProvider>();
     if (maProvider.api != null) {
-      final playlists = await maProvider.api!.getPlaylists(limit: 100);
+      final playlists = await maProvider.api!.getPlaylists(
+        limit: 100,
+        favoriteOnly: favoriteOnly,
+      );
       if (mounted) {
         setState(() {
           _playlists = playlists;
@@ -86,6 +107,47 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
     }
   }
 
+  Future<void> _loadFavoriteTracks() async {
+    if (_isLoadingTracks) return;
+
+    setState(() {
+      _isLoadingTracks = true;
+    });
+
+    final maProvider = context.read<MusicAssistantProvider>();
+    if (maProvider.api != null) {
+      final tracks = await maProvider.api!.getTracks(
+        limit: 500,
+        favoriteOnly: true,
+      );
+      if (mounted) {
+        setState(() {
+          _favoriteTracks = tracks;
+          _isLoadingTracks = false;
+        });
+      }
+    } else {
+      if (mounted) {
+        setState(() {
+          _isLoadingTracks = false;
+        });
+      }
+    }
+  }
+
+  void _toggleFavoritesMode(bool value) {
+    setState(() {
+      _showFavoritesOnly = value;
+      _recreateTabController();
+    });
+    if (value) {
+      _loadPlaylists(favoriteOnly: true);
+      _loadFavoriteTracks();
+    } else {
+      _loadPlaylists();
+    }
+  }
+
   @override
   Widget build(BuildContext context) {
     // Use Selector for targeted rebuilds - only rebuild when connection state changes
@@ -125,15 +187,40 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
           appBar: AppBar(
             backgroundColor: Colors.transparent,
             elevation: 0,
-            title: Text(
-              'Library',
-              style: textTheme.titleLarge?.copyWith(
-                color: colorScheme.onBackground,
-                fontWeight: FontWeight.w300,
-              ),
+            titleSpacing: 16,
+            title: Row(
+              children: [
+                // Favorites toggle with label
+                GestureDetector(
+                  onTap: () => _toggleFavoritesMode(!_showFavoritesOnly),
+                  child: Row(
+                    mainAxisSize: MainAxisSize.min,
+                    children: [
+                      Switch(
+                        value: _showFavoritesOnly,
+                        onChanged: _toggleFavoritesMode,
+                        activeColor: colorScheme.primary,
+                        materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
+                      ),
+                      const SizedBox(width: 4),
+                      Text(
+                        'Favourites',
+                        style: textTheme.titleMedium?.copyWith(
+                          color: _showFavoritesOnly
+                              ? colorScheme.primary
+                              : colorScheme.onSurface.withOpacity(0.7),
+                          fontWeight: _showFavoritesOnly ? FontWeight.w500 : FontWeight.w400,
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+              ],
             ),
-            centerTitle: true,
-            actions: const [PlayerSelector()],
+            centerTitle: false,
+            actions: const [
+              PlayerSelector(),
+            ],
             bottom: TabBar(
               controller: _tabController,
               labelColor: colorScheme.primary,
@@ -142,10 +229,11 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
               indicatorWeight: 3,
               labelStyle: const TextStyle(fontWeight: FontWeight.w600, fontSize: 14),
               unselectedLabelStyle: const TextStyle(fontWeight: FontWeight.w400, fontSize: 14),
-              tabs: const [
-                Tab(text: 'Artists'),
-                Tab(text: 'Albums'),
-                Tab(text: 'Playlists'),
+              tabs: [
+                const Tab(text: 'Artists'),
+                const Tab(text: 'Albums'),
+                if (_showFavoritesOnly) const Tab(text: 'Tracks'),
+                const Tab(text: 'Playlists'),
               ],
             ),
           ),
@@ -154,6 +242,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
             children: [
               _buildArtistsTab(context),
               _buildAlbumsTab(context),
+              if (_showFavoritesOnly) _buildTracksTab(context),
               _buildPlaylistsTab(context),
             ],
           ),
@@ -168,14 +257,26 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
     return Selector<MusicAssistantProvider, (List<Artist>, bool)>(
       selector: (_, provider) => (provider.artists, provider.isLoading),
       builder: (context, data, _) {
-        final (artists, isLoading) = data;
+        final (allArtists, isLoading) = data;
         final colorScheme = Theme.of(context).colorScheme;
 
         if (isLoading) {
           return Center(child: CircularProgressIndicator(color: colorScheme.primary));
         }
 
+        // Filter by favorites if enabled
+        final artists = _showFavoritesOnly
+            ? allArtists.where((a) => a.favorite == true).toList()
+            : allArtists;
+
         if (artists.isEmpty) {
+          if (_showFavoritesOnly) {
+            return EmptyState.custom(
+              icon: Icons.favorite_border,
+              title: 'No favorite artists',
+              subtitle: 'Tap the heart on an artist to add them to favorites',
+            );
+          }
           return EmptyState.artists(
             onRefresh: () => context.read<MusicAssistantProvider>().loadLibrary(),
           );
@@ -186,7 +287,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
           backgroundColor: colorScheme.surface,
           onRefresh: () async => context.read<MusicAssistantProvider>().loadLibrary(),
           child: ListView.builder(
-            key: const PageStorageKey<String>('library_artists_list'),
+            key: PageStorageKey<String>('library_artists_list_${_showFavoritesOnly ? 'fav' : 'all'}'),
             cacheExtent: 500, // Prebuild items off-screen for smoother scrolling
             itemCount: artists.length,
             padding: EdgeInsets.only(left: 8, right: 8, top: 8, bottom: BottomSpacing.navBarOnly),
@@ -261,14 +362,26 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
     return Selector<MusicAssistantProvider, (List<Album>, bool)>(
       selector: (_, provider) => (provider.albums, provider.isLoading),
       builder: (context, data, _) {
-        final (albums, isLoading) = data;
+        final (allAlbums, isLoading) = data;
         final colorScheme = Theme.of(context).colorScheme;
 
         if (isLoading) {
           return Center(child: CircularProgressIndicator(color: colorScheme.primary));
         }
 
+        // Filter by favorites if enabled
+        final albums = _showFavoritesOnly
+            ? allAlbums.where((a) => a.favorite == true).toList()
+            : allAlbums;
+
         if (albums.isEmpty) {
+          if (_showFavoritesOnly) {
+            return EmptyState.custom(
+              icon: Icons.favorite_border,
+              title: 'No favorite albums',
+              subtitle: 'Tap the heart on an album to add it to favorites',
+            );
+          }
           return EmptyState.albums(
             onRefresh: () => context.read<MusicAssistantProvider>().loadLibrary(),
           );
@@ -279,7 +392,7 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
           backgroundColor: colorScheme.surface,
           onRefresh: () async => context.read<MusicAssistantProvider>().loadLibrary(),
           child: GridView.builder(
-            key: const PageStorageKey<String>('library_albums_grid'),
+            key: PageStorageKey<String>('library_albums_grid_${_showFavoritesOnly ? 'fav' : 'all'}'),
             cacheExtent: 500, // Prebuild items off-screen for smoother scrolling
             padding: EdgeInsets.only(left: 16, right: 16, top: 16, bottom: BottomSpacing.navBarOnly),
             gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
@@ -312,15 +425,22 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
     }
 
     if (_playlists.isEmpty) {
-      return EmptyState.playlists(onRefresh: _loadPlaylists);
+      if (_showFavoritesOnly) {
+        return EmptyState.custom(
+          icon: Icons.favorite_border,
+          title: 'No favorite playlists',
+          subtitle: 'Tap the heart on a playlist to add it to favorites',
+        );
+      }
+      return EmptyState.playlists(onRefresh: () => _loadPlaylists());
     }
 
     return RefreshIndicator(
       color: colorScheme.primary,
       backgroundColor: colorScheme.surface,
-      onRefresh: _loadPlaylists,
+      onRefresh: () => _loadPlaylists(favoriteOnly: _showFavoritesOnly ? true : null),
       child: ListView.builder(
-        key: const PageStorageKey<String>('library_playlists_list'),
+        key: PageStorageKey<String>('library_playlists_list_${_showFavoritesOnly ? 'fav' : 'all'}'),
         cacheExtent: 500, // Prebuild items off-screen for smoother scrolling
         itemCount: _playlists.length,
         padding: EdgeInsets.only(left: 8, right: 8, top: 8, bottom: BottomSpacing.navBarOnly),
@@ -388,4 +508,116 @@ class _NewLibraryScreenState extends State<NewLibraryScreen>
     );
   }
 
+  // ============ TRACKS TAB (favorites only) ============
+  Widget _buildTracksTab(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+
+    if (_isLoadingTracks) {
+      return Center(child: CircularProgressIndicator(color: colorScheme.primary));
+    }
+
+    if (_favoriteTracks.isEmpty) {
+      return EmptyState.custom(
+        icon: Icons.favorite_border,
+        title: 'No favorite tracks',
+        subtitle: 'Long-press a track and tap the heart to add it to favorites',
+      );
+    }
+
+    // Sort tracks by artist name, then track name
+    final sortedTracks = List<Track>.from(_favoriteTracks)
+      ..sort((a, b) {
+        final artistCompare = a.artistsString.compareTo(b.artistsString);
+        if (artistCompare != 0) return artistCompare;
+        return a.name.compareTo(b.name);
+      });
+
+    return RefreshIndicator(
+      color: colorScheme.primary,
+      backgroundColor: colorScheme.surface,
+      onRefresh: _loadFavoriteTracks,
+      child: ListView.builder(
+        key: const PageStorageKey<String>('library_tracks_list'),
+        cacheExtent: 500,
+        padding: EdgeInsets.only(left: 8, right: 8, top: 8, bottom: BottomSpacing.navBarOnly),
+        itemCount: sortedTracks.length,
+        itemBuilder: (context, index) {
+          final track = sortedTracks[index];
+          return _buildTrackTile(context, track);
+        },
+      ),
+    );
+  }
+
+  Widget _buildTrackTile(BuildContext context, Track track) {
+    final maProvider = context.read<MusicAssistantProvider>();
+    final colorScheme = Theme.of(context).colorScheme;
+    final textTheme = Theme.of(context).textTheme;
+
+    // Get image URL from track itself
+    final imageUrl = maProvider.api?.getImageUrl(track, size: 128);
+
+    return ListTile(
+      contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
+      leading: Container(
+        width: 48,
+        height: 48,
+        decoration: BoxDecoration(
+          color: colorScheme.surfaceVariant,
+          borderRadius: BorderRadius.circular(6),
+          image: imageUrl != null
+              ? DecorationImage(
+                  image: CachedNetworkImageProvider(imageUrl),
+                  fit: BoxFit.cover,
+                )
+              : null,
+        ),
+        child: imageUrl == null
+            ? Icon(Icons.music_note, color: colorScheme.onSurfaceVariant, size: 24)
+            : null,
+      ),
+      title: Text(
+        track.artistsString,
+        style: textTheme.bodyMedium?.copyWith(
+          color: colorScheme.onSurface,
+          fontWeight: FontWeight.w500,
+        ),
+        maxLines: 1,
+        overflow: TextOverflow.ellipsis,
+      ),
+      subtitle: Text(
+        track.name,
+        style: textTheme.bodySmall?.copyWith(
+          color: colorScheme.onSurface.withOpacity(0.7),
+        ),
+        maxLines: 1,
+        overflow: TextOverflow.ellipsis,
+      ),
+      trailing: const Icon(
+        Icons.favorite,
+        color: Colors.red,
+        size: 20,
+      ),
+      onTap: () async {
+        final player = maProvider.selectedPlayer;
+        if (player == null) {
+          ScaffoldMessenger.of(context).showSnackBar(
+            const SnackBar(content: Text('No player selected')),
+          );
+          return;
+        }
+
+        try {
+          // Start radio from this track
+          await maProvider.api?.playRadio(player.playerId, track);
+        } catch (e) {
+          if (mounted) {
+            ScaffoldMessenger.of(context).showSnackBar(
+              SnackBar(content: Text('Failed to start radio: $e')),
+            );
+          }
+        }
+      },
+    );
+  }
 }

lib/screens/playlist_details_screen.dart

@@ -2,6 +2,9 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import '../models/media_item.dart';
 import '../providers/music_assistant_provider.dart';
+import '../services/debug_logger.dart';
+
+final _playlistLogger = DebugLogger();
 
 class PlaylistDetailsScreen extends StatefulWidget {
   final Playlist playlist;
@@ -61,11 +64,11 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
         return;
       }
 
-      print('🎵 Queueing playlist on ${player.name}: ${player.playerId}');
+      _playlistLogger.info('Queueing playlist on ${player.name}', context: 'Playlist');
 
       // Queue all tracks via Music Assistant
       await maProvider.playTracks(player.playerId, _tracks, startIndex: 0);
-      print('✓ Playlist queued on ${player.name}');
+      _playlistLogger.info('Playlist queued successfully', context: 'Playlist');
 
       if (mounted) {
         ScaffoldMessenger.of(context).showSnackBar(
@@ -76,7 +79,7 @@ class _PlaylistDetailsScreenState extends State<PlaylistDetailsScreen> {
         );
       }
     } catch (e) {
-      print('Error playing playlist: $e');
+      _playlistLogger.error('Error playing playlist', context: 'Playlist', error: e);
       _showError('Error playing playlist: $e');
     }
   }

lib/screens/search_screen.dart

@@ -100,11 +100,11 @@ class SearchScreenState extends State<SearchScreen> {
   void _onSearchChanged(String query) {
     _debounceTimer?.cancel();
     _debounceTimer = Timer(Timings.searchDebounce, () {
-      _performSearch(query);
+      _performSearch(query, keepFocus: true);
     });
   }
 
-  Future<void> _performSearch(String query) async {
+  Future<void> _performSearch(String query, {bool keepFocus = false}) async {
     if (query.isEmpty) {
       setState(() {
         _searchResults = {'artists': [], 'albums': [], 'tracks': []};
@@ -129,6 +129,10 @@ class SearchScreenState extends State<SearchScreen> {
           _isSearching = false;
           _hasSearched = true;
         });
+        // Keep keyboard open if user is still typing
+        if (keepFocus && _focusNode.hasFocus) {
+          _focusNode.requestFocus();
+        }
       }
     } catch (e) {
       _logger.log('Search error: $e');
@@ -138,6 +142,9 @@ class SearchScreenState extends State<SearchScreen> {
           _hasSearched = true;
           _searchError = 'Search failed. Please check your connection.';
         });
+        if (keepFocus && _focusNode.hasFocus) {
+          _focusNode.requestFocus();
+        }
       }
     }
   }
@@ -157,6 +164,7 @@ class SearchScreenState extends State<SearchScreen> {
           focusNode: _focusNode,
           style: TextStyle(color: colorScheme.onSurface),
           cursorColor: colorScheme.primary,
+          textInputAction: TextInputAction.search,
           decoration: InputDecoration(
             hintText: 'Search music...',
             hintStyle: TextStyle(color: colorScheme.onSurface.withOpacity(0.5)),
@@ -166,15 +174,20 @@ class SearchScreenState extends State<SearchScreen> {
                     icon: Icon(Icons.clear_rounded, color: colorScheme.onSurface.withOpacity(0.5)),
                     onPressed: () {
                       _searchController.clear();
-                      _performSearch('');
+                      setState(() {
+                        _searchResults = {'artists': [], 'albums': [], 'tracks': []};
+                        _hasSearched = false;
+                        _searchError = null;
+                      });
                     },
                   )
                 : null,
           ),
           onChanged: (value) {
+            setState(() {}); // Update clear button visibility
             _onSearchChanged(value);
           },
-          onSubmitted: _performSearch,
+          onSubmitted: (query) => _performSearch(query),
         ),
       ),
       body: !maProvider.isConnected

lib/services/animation_debugger.dart

@@ -0,0 +1,236 @@
+import 'dart:collection';
+import 'package:flutter/material.dart';
+import 'package:flutter/scheduler.dart';
+import 'debug_logger.dart';
+
+/// Comprehensive animation debugging utility for diagnosing jank and performance issues.
+///
+/// Usage:
+/// 1. Call AnimationDebugger.startSession('playerExpand') at animation start
+/// 2. Call AnimationDebugger.recordFrame() in animation listener (every frame)
+/// 3. Call AnimationDebugger.endSession() when animation completes
+/// 4. Logs will show frame timing, jank detection, and summary stats
+class AnimationDebugger {
+  static final _logger = DebugLogger();
+  static bool _enabled = true;
+
+  // Session tracking
+  static String? _currentSession;
+  static int _frameCount = 0;
+  static final List<_FrameData> _frames = [];
+  static DateTime? _sessionStart;
+  static double? _lastAnimationValue;
+
+  // Scheduler binding for frame timing
+  static Duration? _lastFrameTime;
+
+  /// Enable or disable animation debugging
+  static void setEnabled(bool enabled) {
+    _enabled = enabled;
+  }
+
+  /// Start a new animation debugging session
+  static void startSession(String name) {
+    if (!_enabled) return;
+
+    _currentSession = name;
+    _frameCount = 0;
+    _frames.clear();
+    _sessionStart = DateTime.now();
+    _lastFrameTime = null;
+    _lastAnimationValue = null;
+
+    // Listen to frame timing
+    SchedulerBinding.instance.addPostFrameCallback(_onFirstFrame);
+
+    _logger.log('🎬 ANIM[$name] START');
+  }
+
+  static void _onFirstFrame(Duration timestamp) {
+    _lastFrameTime = timestamp;
+  }
+
+  /// Record a frame during animation
+  /// [animationValue] - current animation progress (0.0 to 1.0)
+  /// [context] - optional context string for this frame
+  static void recordFrame(double animationValue, {String? context}) {
+    if (!_enabled || _currentSession == null) return;
+
+    final now = DateTime.now();
+    final frameTime = SchedulerBinding.instance.currentFrameTimeStamp;
+
+    Duration? frameDuration;
+    if (_lastFrameTime != null) {
+      frameDuration = frameTime - _lastFrameTime!;
+    }
+    _lastFrameTime = frameTime;
+
+    // Calculate animation delta
+    double? animationDelta;
+    if (_lastAnimationValue != null) {
+      animationDelta = (animationValue - _lastAnimationValue!).abs();
+    }
+    _lastAnimationValue = animationValue;
+
+    final frame = _FrameData(
+      frameNumber: _frameCount,
+      timestamp: now,
+      frameDuration: frameDuration,
+      animationValue: animationValue,
+      animationDelta: animationDelta,
+      context: context,
+    );
+
+    _frames.add(frame);
+    _frameCount++;
+
+    // Log jank immediately (frames > 16.67ms for 60fps)
+    if (frameDuration != null && frameDuration.inMicroseconds > 16667) {
+      final ms = frameDuration.inMicroseconds / 1000;
+      _logger.log('🔴 ANIM[$_currentSession] JANK frame $_frameCount: ${ms.toStringAsFixed(2)}ms (>${(ms/16.67).toStringAsFixed(1)}x target)');
+    }
+  }
+
+  /// Record a build/layout event during animation
+  static void recordBuild(String widgetName) {
+    if (!_enabled || _currentSession == null) return;
+    _logger.log('🔨 ANIM[$_currentSession] BUILD: $widgetName at frame $_frameCount');
+  }
+
+  /// End the current session and log summary
+  static void endSession() {
+    if (!_enabled || _currentSession == null) return;
+
+    final sessionName = _currentSession!;
+    final totalDuration = DateTime.now().difference(_sessionStart!);
+
+    // Calculate statistics
+    int jankFrames = 0;
+    int severeJankFrames = 0;
+    double maxFrameMs = 0;
+    double totalFrameMs = 0;
+    int measuredFrames = 0;
+
+    for (final frame in _frames) {
+      if (frame.frameDuration != null) {
+        final ms = frame.frameDuration!.inMicroseconds / 1000;
+        totalFrameMs += ms;
+        measuredFrames++;
+
+        if (ms > maxFrameMs) maxFrameMs = ms;
+        if (ms > 16.67) jankFrames++;
+        if (ms > 33.33) severeJankFrames++; // Dropped more than 1 frame
+      }
+    }
+
+    final avgFrameMs = measuredFrames > 0 ? totalFrameMs / measuredFrames : 0;
+    final effectiveFps = avgFrameMs > 0 ? 1000 / avgFrameMs : 0;
+
+    // Build summary
+    final buffer = StringBuffer();
+    buffer.writeln('');
+    buffer.writeln('═══════════════════════════════════════');
+    buffer.writeln('🎬 ANIMATION SUMMARY: $sessionName');
+    buffer.writeln('═══════════════════════════════════════');
+    buffer.writeln('Duration: ${totalDuration.inMilliseconds}ms');
+    buffer.writeln('Total frames: $_frameCount');
+    buffer.writeln('Measured frames: $measuredFrames');
+    buffer.writeln('Average frame: ${avgFrameMs.toStringAsFixed(2)}ms');
+    buffer.writeln('Max frame: ${maxFrameMs.toStringAsFixed(2)}ms');
+    buffer.writeln('Effective FPS: ${effectiveFps.toStringAsFixed(1)}');
+    buffer.writeln('Jank frames (>16.67ms): $jankFrames (${measuredFrames > 0 ? (jankFrames * 100 / measuredFrames).toStringAsFixed(1) : 0}%)');
+    buffer.writeln('Severe jank (>33.33ms): $severeJankFrames');
+
+    // List worst frames
+    if (_frames.isNotEmpty) {
+      final sortedFrames = List<_FrameData>.from(_frames)
+        ..sort((a, b) {
+          final aMs = a.frameDuration?.inMicroseconds ?? 0;
+          final bMs = b.frameDuration?.inMicroseconds ?? 0;
+          return bMs.compareTo(aMs);
+        });
+
+      final worstFrames = sortedFrames.take(5).where((f) => f.frameDuration != null && f.frameDuration!.inMicroseconds > 16667).toList();
+
+      if (worstFrames.isNotEmpty) {
+        buffer.writeln('');
+        buffer.writeln('Worst frames:');
+        for (final frame in worstFrames) {
+          final ms = frame.frameDuration!.inMicroseconds / 1000;
+          buffer.writeln('  Frame ${frame.frameNumber}: ${ms.toStringAsFixed(2)}ms (anim=${frame.animationValue.toStringAsFixed(3)})');
+        }
+      }
+    }
+
+    buffer.writeln('═══════════════════════════════════════');
+
+    _logger.log(buffer.toString());
+
+    // Reset
+    _currentSession = null;
+    _frames.clear();
+    _sessionStart = null;
+    _lastAnimationValue = null;
+  }
+
+  /// Log a one-off animation event (for Hero transitions, page transitions, etc.)
+  static void logEvent(String event, {String? details}) {
+    if (!_enabled) return;
+    final detailStr = details != null ? ' - $details' : '';
+    _logger.log('🎬 ANIM_EVENT: $event$detailStr');
+  }
+
+  /// Log frame callback timing (call this from addPostFrameCallback)
+  static void logPostFrame(String context) {
+    if (!_enabled) return;
+    final frameTime = SchedulerBinding.instance.currentFrameTimeStamp;
+    _logger.log('📐 POST_FRAME[$context]: ${frameTime.inMilliseconds}ms');
+  }
+
+  /// Create a HeroFlightShuttleBuilder that logs Hero animation progress
+  static HeroFlightShuttleBuilder createHeroDebugShuttle(String heroTag) {
+    return (
+      BuildContext flightContext,
+      Animation<double> animation,
+      HeroFlightDirection flightDirection,
+      BuildContext fromHeroContext,
+      BuildContext toHeroContext,
+    ) {
+      // Log Hero flight start
+      if (animation.value < 0.1) {
+        logEvent('Hero flight START', details: 'tag=$heroTag, direction=${flightDirection.name}');
+      }
+
+      // Add listener for completion (one-shot)
+      void onComplete(AnimationStatus status) {
+        if (status == AnimationStatus.completed || status == AnimationStatus.dismissed) {
+          logEvent('Hero flight END', details: 'tag=$heroTag, status=${status.name}');
+          animation.removeStatusListener(onComplete);
+        }
+      }
+      animation.addStatusListener(onComplete);
+
+      // Return default shuttle (the toHero's child)
+      final Hero toHero = toHeroContext.widget as Hero;
+      return toHero.child;
+    };
+  }
+}
+
+class _FrameData {
+  final int frameNumber;
+  final DateTime timestamp;
+  final Duration? frameDuration;
+  final double animationValue;
+  final double? animationDelta;
+  final String? context;
+
+  _FrameData({
+    required this.frameNumber,
+    required this.timestamp,
+    this.frameDuration,
+    required this.animationValue,
+    this.animationDelta,
+    this.context,
+  });
+}

lib/services/debug_logger.dart

@@ -1,32 +1,185 @@
+import 'dart:io';
 import 'package:flutter/foundation.dart';
+import 'package:package_info_plus/package_info_plus.dart';
+import 'package:device_info_plus/device_info_plus.dart';
+
+/// Log levels for filtering and display
+enum LogLevel {
+  debug,  // Verbose debugging info (hidden by default)
+  info,   // General information
+  warning, // Potential issues
+  error,  // Errors and failures
+}
+
+class LogEntry {
+  final DateTime timestamp;
+  final LogLevel level;
+  final String message;
+  final String? context;
+
+  LogEntry({
+    required this.timestamp,
+    required this.level,
+    required this.message,
+    this.context,
+  });
+
+  String get formatted {
+    final time = timestamp.toIso8601String().substring(11, 23);
+    final levelStr = level.name.toUpperCase().padRight(5);
+    final contextStr = context != null ? '[$context] ' : '';
+    return '[$time] $levelStr $contextStr$message';
+  }
+}
 
 class DebugLogger {
   static final DebugLogger _instance = DebugLogger._internal();
   factory DebugLogger() => _instance;
   DebugLogger._internal();
 
-  final List<String> _logs = [];
-  final _maxLogs = 500;
+  final List<LogEntry> _entries = [];
+  final _maxLogs = 1000;
 
-  List<String> get logs => List.unmodifiable(_logs);
+  // Minimum level to display in debug console (debug builds show all)
+  LogLevel _minConsoleLevel = kDebugMode ? LogLevel.debug : LogLevel.info;
 
-  void log(String message) {
-    final timestamp = DateTime.now().toIso8601String().substring(11, 23);
-    final logMessage = '[$timestamp] $message';
+  List<LogEntry> get entries => List.unmodifiable(_entries);
 
-    debugPrint(logMessage);
+  /// Legacy getter for backward compatibility
+  List<String> get logs => _entries.map((e) => e.formatted).toList();
 
-    _logs.add(logMessage);
-    if (_logs.length > _maxLogs) {
-      _logs.removeAt(0);
+  void _addEntry(LogLevel level, String message, {String? context}) {
+    final entry = LogEntry(
+      timestamp: DateTime.now(),
+      level: level,
+      message: message,
+      context: context,
+    );
+
+    // Always store in memory
+    _entries.add(entry);
+    if (_entries.length > _maxLogs) {
+      _entries.removeAt(0);
+    }
+
+    // Only print to console if above minimum level
+    if (level.index >= _minConsoleLevel.index) {
+      debugPrint(entry.formatted);
     }
   }
 
+  /// Debug level - verbose info for development
+  void debug(String message, {String? context}) {
+    _addEntry(LogLevel.debug, message, context: context);
+  }
+
+  /// Info level - general operational info
+  void info(String message, {String? context}) {
+    _addEntry(LogLevel.info, message, context: context);
+  }
+
+  /// Warning level - potential issues
+  void warning(String message, {String? context}) {
+    _addEntry(LogLevel.warning, message, context: context);
+  }
+
+  /// Error level - failures and errors
+  void error(String message, {String? context, Object? error, StackTrace? stackTrace}) {
+    var fullMessage = message;
+    if (error != null) {
+      fullMessage += ': $error';
+    }
+    _addEntry(LogLevel.error, fullMessage, context: context);
+    if (stackTrace != null && kDebugMode) {
+      debugPrint('Stack trace: $stackTrace');
+    }
+  }
+
+  /// Legacy method for backward compatibility
+  void log(String message) {
+    _addEntry(LogLevel.info, message);
+  }
+
   void clear() {
-    _logs.clear();
+    _entries.clear();
   }
 
   String getAllLogs() {
-    return _logs.join('\n');
+    return _entries.map((e) => e.formatted).join('\n');
+  }
+
+  /// Get logs filtered by minimum level
+  String getLogsFiltered({LogLevel minLevel = LogLevel.info}) {
+    return _entries
+        .where((e) => e.level.index >= minLevel.index)
+        .map((e) => e.formatted)
+        .join('\n');
+  }
+
+  /// Generate a formatted bug report with device info
+  Future<String> generateBugReport() async {
+    final buffer = StringBuffer();
+
+    buffer.writeln('═══════════════════════════════════════');
+    buffer.writeln('ENSEMBLE BUG REPORT');
+    buffer.writeln('Generated: ${DateTime.now().toIso8601String()}');
+    buffer.writeln('═══════════════════════════════════════');
+    buffer.writeln();
+
+    // App info
+    try {
+      final packageInfo = await PackageInfo.fromPlatform();
+      buffer.writeln('APP INFO:');
+      buffer.writeln('  Version: ${packageInfo.version} (${packageInfo.buildNumber})');
+      buffer.writeln('  Package: ${packageInfo.packageName}');
+      buffer.writeln();
+    } catch (e) {
+      buffer.writeln('APP INFO: Unable to retrieve');
+      buffer.writeln();
+    }
+
+    // Device info
+    try {
+      final deviceInfo = DeviceInfoPlugin();
+      if (Platform.isAndroid) {
+        final android = await deviceInfo.androidInfo;
+        buffer.writeln('DEVICE INFO:');
+        buffer.writeln('  Model: ${android.manufacturer} ${android.model}');
+        buffer.writeln('  Android: ${android.version.release} (SDK ${android.version.sdkInt})');
+        buffer.writeln('  Device: ${android.device}');
+        buffer.writeln();
+      } else if (Platform.isIOS) {
+        final ios = await deviceInfo.iosInfo;
+        buffer.writeln('DEVICE INFO:');
+        buffer.writeln('  Model: ${ios.model}');
+        buffer.writeln('  iOS: ${ios.systemVersion}');
+        buffer.writeln('  Name: ${ios.name}');
+        buffer.writeln();
+      }
+    } catch (e) {
+      buffer.writeln('DEVICE INFO: Unable to retrieve');
+      buffer.writeln();
+    }
+
+    // Log statistics
+    final errorCount = _entries.where((e) => e.level == LogLevel.error).length;
+    final warningCount = _entries.where((e) => e.level == LogLevel.warning).length;
+    buffer.writeln('LOG SUMMARY:');
+    buffer.writeln('  Total entries: ${_entries.length}');
+    buffer.writeln('  Errors: $errorCount');
+    buffer.writeln('  Warnings: $warningCount');
+    buffer.writeln();
+
+    buffer.writeln('═══════════════════════════════════════');
+    buffer.writeln('LOGS (newest first):');
+    buffer.writeln('═══════════════════════════════════════');
+    buffer.writeln();
+
+    // Add logs in reverse order (newest first) for easier reading
+    for (final entry in _entries.reversed) {
+      buffer.writeln(entry.formatted);
+    }
+
+    return buffer.toString();
   }
 }

lib/services/metadata_service.dart

@@ -1,8 +1,10 @@
 import 'dart:convert';
 import 'package:http/http.dart' as http;
+import 'debug_logger.dart';
 import 'settings_service.dart';
 
 class MetadataService {
+  static final _logger = DebugLogger();
   // Cache to avoid repeated API calls for the same artist/album
   static final Map<String, String> _cache = {};
 
@@ -152,7 +154,7 @@ class MetadataService {
         }
       }
     } catch (e) {
-      print('⚠️ Last.fm API error: $e');
+      _logger.warning('Last.fm API error: $e', context: 'Metadata');
     }
     return null;
   }
@@ -185,7 +187,7 @@ class MetadataService {
         }
       }
     } catch (e) {
-      print('⚠️ TheAudioDB API error: $e');
+      _logger.warning('TheAudioDB API error: $e', context: 'Metadata');
     }
     return null;
   }
@@ -241,7 +243,7 @@ class MetadataService {
         }
       }
     } catch (e) {
-      print('⚠️ Deezer artist image error: $e');
+      _logger.warning('Deezer artist image error: $e', context: 'Metadata');
     }
 
     // Cache the null result to avoid repeated failed lookups

lib/services/music_assistant_api.dart

@@ -63,15 +63,24 @@ class MusicAssistantAPI {
 
   // Guard to prevent multiple simultaneous connection attempts
   Completer<void>? _connectionInProgress;
+  bool _isDisposed = false;
 
   Future<void> connect() async {
-    // If already connected, nothing to do
-    if (_currentState == MAConnectionState.connected) {
+    // If disposed, don't try to connect
+    if (_isDisposed) {
+      _logger.log('Connection: API disposed, skipping connect');
+      return;
+    }
+
+    // If already connected or authenticated, nothing to do
+    if (_currentState == MAConnectionState.connected ||
+        _currentState == MAConnectionState.authenticated) {
+      _logger.log('Connection: Already connected, skipping');
       return;
     }
 
     // If connection is in progress, wait for it instead of starting another
-    if (_connectionInProgress != null) {
+    if (_connectionInProgress != null && !_connectionInProgress!.isCompleted) {
       _logger.log('Connection already in progress, waiting...');
       return _connectionInProgress!.future;
     }
@@ -611,13 +620,14 @@ class MusicAssistantAPI {
     }
   }
 
-  Future<Album?> getAlbumDetails(String provider, String itemId) async {
+  /// Get album details by URI
+  /// Use the album's uri field (e.g., "library://album/123" or "spotify://album/xyz")
+  Future<Album?> getAlbumByUri(String uri) async {
     try {
       final response = await _sendCommand(
-        'music/album',
+        'music/item_by_uri',
         args: {
-          'provider': provider,
-          'item_id': itemId,
+          'uri': uri,
         },
       );
 
@@ -626,7 +636,27 @@ class MusicAssistantAPI {
 
       return Album.fromJson(result as Map<String, dynamic>);
     } catch (e) {
-      _logger.log('Error getting album details: $e');
+      _logger.log('Error getting album by URI: $e');
+      return null;
+    }
+  }
+
+  /// Get artist details by URI
+  Future<Artist?> getArtistByUri(String uri) async {
+    try {
+      final response = await _sendCommand(
+        'music/item_by_uri',
+        args: {
+          'uri': uri,
+        },
+      );
+
+      final result = response['result'];
+      if (result == null) return null;
+
+      return Artist.fromJson(result as Map<String, dynamic>);
+    } catch (e) {
+      _logger.log('Error getting artist by URI: $e');
       return null;
     }
   }
@@ -1045,12 +1075,14 @@ class MusicAssistantAPI {
   }
 
   /// Play radio based on a track (generates similar tracks)
+  /// Prefers streaming provider URIs (Spotify, Tidal, etc.) for better recommendations
   Future<void> playRadio(String playerId, Track track) async {
     return await RetryHelper.retryCritical(
       operation: () async {
-        // Try using library URI if available, otherwise use provider URI
-        final libraryUri = track.uri;
-        final trackUri = libraryUri ?? _buildTrackUri(track);
+        // For radio mode, prefer streaming providers (Spotify, Tidal, etc.)
+        // as they provide better dynamic track recommendations
+        final trackUri = _buildRadioUri(track);
+        _logger.log('Radio: Starting with URI $trackUri');
 
         final args = {
           'queue_id': playerId,
@@ -1059,7 +1091,6 @@ class MusicAssistantAPI {
           'radio_mode': true, // Enable radio mode for similar tracks
         };
 
-
         await _sendCommand(
           'player_queues/play_media',
           args: args,
@@ -1069,6 +1100,114 @@ class MusicAssistantAPI {
     );
   }
 
+  /// Build URI for radio mode, preferring streaming providers for better recommendations
+  /// Priority: Spotify > Tidal > Deezer > Apple > YTM > Subsonic > any available > library
+  /// Note: Qobuz does NOT support radio mode (no dynamic_tracks API)
+  String _buildRadioUri(Track track) {
+    if (track.providerMappings != null && track.providerMappings!.isNotEmpty) {
+      // Providers that support dynamic radio recommendations (in priority order)
+      // Qobuz is excluded - it doesn't support similar tracks API
+      const radioProviders = ['spotify', 'tidal', 'deezer', 'apple', 'ytmusic', 'subsonic', 'opensubsonic'];
+
+      // Try to find a streaming provider first
+      for (final providerPrefix in radioProviders) {
+        final mapping = track.providerMappings!.firstWhere(
+          (m) => m.available && m.providerInstance.toLowerCase().startsWith(providerPrefix),
+          orElse: () => ProviderMapping(providerInstance: '', providerDomain: '', itemId: '', available: false),
+        );
+        if (mapping.providerInstance.isNotEmpty) {
+          return '${mapping.providerInstance}://track/${mapping.itemId}';
+        }
+      }
+
+      // Fall back to any available provider (but not library)
+      final nonLibraryMapping = track.providerMappings!.firstWhere(
+        (m) => m.available && m.providerInstance != 'library',
+        orElse: () => ProviderMapping(providerInstance: '', providerDomain: '', itemId: '', available: false),
+      );
+      if (nonLibraryMapping.providerInstance.isNotEmpty) {
+        return '${nonLibraryMapping.providerInstance}://track/${nonLibraryMapping.itemId}';
+      }
+    }
+
+    // Last resort: use library URI or build from top-level provider
+    return track.uri ?? _buildTrackUri(track);
+  }
+
+  /// Play radio based on an artist (generates tracks from and similar to the artist)
+  /// Prefers streaming provider URIs (Spotify, Tidal, etc.) for better recommendations
+  Future<void> playArtistRadio(String playerId, Artist artist) async {
+    return await RetryHelper.retryCritical(
+      operation: () async {
+        final artistUri = _buildArtistRadioUri(artist);
+        _logger.log('Radio: Starting artist radio with URI $artistUri');
+
+        final args = {
+          'queue_id': playerId,
+          'media': [artistUri],
+          'option': 'replace',
+          'radio_mode': true,
+        };
+
+        await _sendCommand(
+          'player_queues/play_media',
+          args: args,
+        );
+      },
+    );
+  }
+
+  /// Add artist radio to queue (instead of replacing)
+  Future<void> playArtistRadioToQueue(String playerId, Artist artist) async {
+    return await RetryHelper.retryCritical(
+      operation: () async {
+        final artistUri = _buildArtistRadioUri(artist);
+        _logger.log('Radio: Adding artist radio to queue with URI $artistUri');
+
+        final args = {
+          'queue_id': playerId,
+          'media': [artistUri],
+          'option': 'add',  // Add to queue instead of replace
+          'radio_mode': true,
+        };
+
+        await _sendCommand(
+          'player_queues/play_media',
+          args: args,
+        );
+      },
+    );
+  }
+
+  /// Build URI for artist radio mode, preferring streaming providers
+  /// Note: Qobuz does NOT support radio mode (no dynamic_tracks API)
+  String _buildArtistRadioUri(Artist artist) {
+    if (artist.providerMappings != null && artist.providerMappings!.isNotEmpty) {
+      // Qobuz is excluded - it doesn't support similar tracks API
+      const radioProviders = ['spotify', 'tidal', 'deezer', 'apple', 'ytmusic', 'subsonic', 'opensubsonic'];
+
+      for (final providerPrefix in radioProviders) {
+        final mapping = artist.providerMappings!.firstWhere(
+          (m) => m.available && m.providerInstance.toLowerCase().startsWith(providerPrefix),
+          orElse: () => ProviderMapping(providerInstance: '', providerDomain: '', itemId: '', available: false),
+        );
+        if (mapping.providerInstance.isNotEmpty) {
+          return '${mapping.providerInstance}://artist/${mapping.itemId}';
+        }
+      }
+
+      final nonLibraryMapping = artist.providerMappings!.firstWhere(
+        (m) => m.available && m.providerInstance != 'library',
+        orElse: () => ProviderMapping(providerInstance: '', providerDomain: '', itemId: '', available: false),
+      );
+      if (nonLibraryMapping.providerInstance.isNotEmpty) {
+        return '${nonLibraryMapping.providerInstance}://artist/${nonLibraryMapping.itemId}';
+      }
+    }
+
+    return artist.uri ?? '${artist.provider}://artist/${artist.itemId}';
+  }
+
   /// Build track URI from provider mappings
   String _buildTrackUri(Track track) {
     // Use provider mappings to get the actual provider instance
@@ -1975,13 +2114,39 @@ class MusicAssistantAPI {
   }
 
   Future<void> _reconnect() async {
+    // Don't reconnect if disposed
+    if (_isDisposed) {
+      _logger.log('Reconnect: API disposed, skipping');
+      return;
+    }
+
+    // Don't reconnect if already connected or connecting
+    if (_currentState == MAConnectionState.connected ||
+        _currentState == MAConnectionState.authenticated ||
+        _currentState == MAConnectionState.connecting) {
+      _logger.log('Reconnect: Already connected/connecting, skipping');
+      return;
+    }
+
+    // Don't reconnect if another connection is in progress
+    if (_connectionInProgress != null && !_connectionInProgress!.isCompleted) {
+      _logger.log('Reconnect: Connection already in progress, skipping');
+      return;
+    }
+
     await Future.delayed(Timings.reconnectDelay);
-    if (_currentState != MAConnectionState.connected) {
-      try {
-        await connect();
-      } catch (e) {
-        _logger.log('Reconnection failed: $e');
-      }
+
+    // Check again after delay
+    if (_isDisposed ||
+        _currentState == MAConnectionState.connected ||
+        _currentState == MAConnectionState.authenticated) {
+      return;
+    }
+
+    try {
+      await connect();
+    } catch (e) {
+      _logger.log('Reconnection failed: $e');
     }
   }
 
@@ -1994,7 +2159,13 @@ class MusicAssistantAPI {
   }
 
   void dispose() {
+    _isDisposed = true;
     _stopHeartbeat();
+    // Complete any pending connection to prevent hanging futures
+    if (_connectionInProgress != null && !_connectionInProgress!.isCompleted) {
+      _connectionInProgress!.completeError(Exception('API disposed'));
+    }
+    _connectionInProgress = null;
     disconnect();
     _connectionStateController.close();
     for (final stream in _eventStreams.values) {

lib/theme/palette_helper.dart

@@ -1,5 +1,8 @@
 import 'package:flutter/material.dart';
 import 'package:palette_generator/palette_generator.dart';
+import '../services/debug_logger.dart';
+
+final _logger = DebugLogger();
 
 /// Extracted adaptive colors from album art
 class AdaptiveColors {
@@ -40,7 +43,7 @@ class PaletteHelper {
       );
       return palette;
     } catch (e) {
-      print('⚠️ Failed to extract palette: $e');
+      _logger.warning('Failed to extract palette: $e', context: 'Palette');
       return null;
     }
   }

lib/theme/system_theme_helper.dart

@@ -1,5 +1,8 @@
 import 'package:flutter/material.dart';
 import 'package:dynamic_color/dynamic_color.dart';
+import '../services/debug_logger.dart';
+
+final _systemThemeLogger = DebugLogger();
 
 class SystemThemeHelper {
   /// Attempts to get system color schemes from the device (Android 12+)
@@ -35,7 +38,7 @@ class SystemThemeHelper {
         }
       }
     } catch (e) {
-      print('⚠️ Failed to get system colors: $e');
+      _systemThemeLogger.warning('Failed to get system colors: $e', context: 'Theme');
     }
 
     return null;

lib/theme/theme_provider.dart

@@ -2,8 +2,11 @@ import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:cached_network_image/cached_network_image.dart';
 import '../services/settings_service.dart';
+import '../services/debug_logger.dart';
 import 'palette_helper.dart';
 
+final _themeLogger = DebugLogger();
+
 /// Global function to update adaptive colors from an image URL
 /// This can be called from anywhere in the app (e.g., when tapping an album/artist)
 Future<void> updateAdaptiveColorsFromImage(BuildContext context, String? imageUrl) async {
@@ -17,7 +20,7 @@ Future<void> updateAdaptiveColorsFromImage(BuildContext context, String? imageUr
     }
   } catch (e) {
     // Silently fail - colors will update when track plays
-    print('Failed to extract colors on tap: $e');
+    _themeLogger.debug('Failed to extract colors on tap: $e', context: 'Theme');
   }
 }
 

lib/widgets/artist_card.dart

@@ -7,6 +7,7 @@ import '../constants/hero_tags.dart';
 import '../theme/theme_provider.dart';
 import '../utils/page_transitions.dart';
 import '../services/metadata_service.dart';
+import '../services/debug_logger.dart';
 
 class ArtistCard extends StatefulWidget {
   final Artist artist;
@@ -25,6 +26,7 @@ class ArtistCard extends StatefulWidget {
 }
 
 class _ArtistCardState extends State<ArtistCard> {
+  static final _logger = DebugLogger();
   String? _fallbackImageUrl;
   bool _triedFallback = false;
 
@@ -43,10 +45,8 @@ class _ArtistCardState extends State<ArtistCard> {
     // Try to fetch fallback image if MA doesn't have one and we haven't tried yet
     if (maImageUrl == null && !_triedFallback) {
       _triedFallback = true;
-      print('🎨 No MA image for "${widget.artist.name}", trying fallback...');
+      _logger.debug('No MA image for "${widget.artist.name}", trying fallback', context: 'ArtistCard');
       _fetchFallbackImage();
-    } else if (maImageUrl != null && !_triedFallback) {
-      print('🎨 MA has image for "${widget.artist.name}": $maImageUrl');
     }
 
     return RepaintBoundary(
@@ -117,8 +117,8 @@ class _ArtistCardState extends State<ArtistCard> {
 
   Future<void> _fetchFallbackImage() async {
     final fallbackUrl = await MetadataService.getArtistImageUrl(widget.artist.name);
-    print('🎨 Fallback result for "${widget.artist.name}": $fallbackUrl');
     if (fallbackUrl != null && mounted) {
+      _logger.debug('Found fallback image for "${widget.artist.name}"', context: 'ArtistCard');
       setState(() {
         _fallbackImageUrl = fallbackUrl;
       });

lib/widgets/common/empty_state.dart

@@ -64,6 +64,20 @@ class EmptyState extends StatelessWidget {
         message: 'No results found',
       );
 
+  /// Creates a custom empty state with title and subtitle
+  factory EmptyState.custom({
+    required IconData icon,
+    required String title,
+    String? subtitle,
+    VoidCallback? onRefresh,
+  }) =>
+      _CustomEmptyState(
+        icon: icon,
+        title: title,
+        subtitle: subtitle,
+        onRefresh: onRefresh,
+      );
+
   @override
   Widget build(BuildContext context) {
     final colorScheme = Theme.of(context).colorScheme;
@@ -106,3 +120,71 @@ class EmptyState extends StatelessWidget {
     );
   }
 }
+
+/// A custom empty state with title and optional subtitle
+class _CustomEmptyState extends EmptyState {
+  final String title;
+  final String? subtitle;
+  final VoidCallback? onRefresh;
+
+  const _CustomEmptyState({
+    required super.icon,
+    required this.title,
+    this.subtitle,
+    this.onRefresh,
+  }) : super(message: title);
+
+  @override
+  Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+
+    return Center(
+      child: Padding(
+        padding: Spacing.paddingAll24,
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            Icon(
+              icon,
+              size: iconSize,
+              color: colorScheme.onSurface.withOpacity(0.38),
+            ),
+            Spacing.vGap16,
+            Text(
+              title,
+              style: TextStyle(
+                color: colorScheme.onSurface.withOpacity(0.6),
+                fontSize: 16,
+                fontWeight: FontWeight.w500,
+              ),
+              textAlign: TextAlign.center,
+            ),
+            if (subtitle != null) ...[
+              Spacing.vGap8,
+              Text(
+                subtitle!,
+                style: TextStyle(
+                  color: colorScheme.onSurface.withOpacity(0.4),
+                  fontSize: 14,
+                ),
+                textAlign: TextAlign.center,
+              ),
+            ],
+            if (onRefresh != null) ...[
+              Spacing.vGap24,
+              ElevatedButton.icon(
+                onPressed: onRefresh,
+                icon: const Icon(Icons.refresh_rounded),
+                label: const Text('Refresh'),
+                style: ElevatedButton.styleFrom(
+                  backgroundColor: colorScheme.surfaceVariant,
+                  foregroundColor: colorScheme.onSurfaceVariant,
+                ),
+              ),
+            ],
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/widgets/expandable_player.dart

@@ -7,6 +7,7 @@ import 'package:cached_network_image/cached_network_image.dart';
 import '../constants/timings.dart';
 import '../providers/music_assistant_provider.dart';
 import '../models/player.dart';
+import '../services/animation_debugger.dart';
 import '../theme/palette_helper.dart';
 import '../theme/theme_provider.dart';
 import 'animated_icon_button.dart';
@@ -81,6 +82,15 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
   // When true, we hide main content and show peek content at center
   bool _inTransition = false;
 
+  // Track favorite state for current track
+  bool _isCurrentTrackFavorite = false;
+  String? _lastTrackUri; // Track which track we last checked favorite status for
+
+  // Cached title height to avoid TextPainter.layout() every animation frame
+  double? _cachedExpandedTitleHeight;
+  String? _lastMeasuredTrackName;
+  double? _lastMeasuredTitleWidth;
+
   @override
   void initState() {
     super.initState();
@@ -97,6 +107,9 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
     // Notify listeners of expansion progress changes
     _controller.addListener(_notifyExpansionProgress);
 
+    // Animation debugging - record every frame
+    _controller.addListener(_recordAnimationFrame);
+
     // Queue panel animation
     _queuePanelController = AnimationController(
       duration: const Duration(milliseconds: 300),
@@ -164,15 +177,25 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
     super.dispose();
   }
 
+  void _recordAnimationFrame() {
+    AnimationDebugger.recordFrame(_controller.value);
+  }
+
   void expand() {
-    _controller.forward();
+    AnimationDebugger.startSession('playerExpand');
+    _controller.forward().then((_) {
+      AnimationDebugger.endSession();
+    });
   }
 
   void collapse() {
+    AnimationDebugger.startSession('playerCollapse');
     // Instantly hide queue panel when collapsing to avoid visual glitches
     // during Android's predictive back gesture
     _queuePanelController.value = 0;
-    _controller.reverse();
+    _controller.reverse().then((_) {
+      AnimationDebugger.endSession();
+    });
   }
 
   bool get isExpanded => _controller.value > 0.5;
@@ -283,6 +306,64 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
 
   bool get isQueuePanelOpen => _queuePanelController.value > 0.5;
 
+  /// Update favorite status when track changes
+  void _updateFavoriteStatus(dynamic currentTrack) {
+    if (currentTrack == null) {
+      _isCurrentTrackFavorite = false;
+      _lastTrackUri = null;
+      return;
+    }
+
+    final trackUri = currentTrack.uri as String?;
+    if (trackUri != _lastTrackUri) {
+      _lastTrackUri = trackUri;
+      _isCurrentTrackFavorite = currentTrack.favorite == true;
+    }
+  }
+
+  /// Toggle favorite status for current track
+  Future<void> _toggleCurrentTrackFavorite(dynamic currentTrack) async {
+    if (currentTrack == null) return;
+
+    final maProvider = context.read<MusicAssistantProvider>();
+    if (maProvider.api == null) return;
+
+    try {
+      if (_isCurrentTrackFavorite) {
+        // Remove from favorites
+        final libraryItemId = currentTrack.itemId;
+        if (libraryItemId is int) {
+          await maProvider.api!.removeFromFavorites('track', libraryItemId);
+        } else if (libraryItemId is String) {
+          final parsed = int.tryParse(libraryItemId);
+          if (parsed != null) {
+            await maProvider.api!.removeFromFavorites('track', parsed);
+          }
+        }
+      } else {
+        // Add to favorites
+        final provider = currentTrack.provider as String? ?? 'library';
+        final itemId = currentTrack.itemId?.toString() ?? '';
+        await maProvider.api!.addToFavorites('track', itemId, provider);
+      }
+
+      // Toggle local state
+      setState(() {
+        _isCurrentTrackFavorite = !_isCurrentTrackFavorite;
+      });
+    } catch (e) {
+      // Show error feedback
+      if (mounted) {
+        ScaffoldMessenger.of(context).showSnackBar(
+          SnackBar(
+            content: Text('Failed to update favorite: $e'),
+            duration: const Duration(seconds: 2),
+          ),
+        );
+      }
+    }
+  }
+
   /// Get available players sorted alphabetically (consistent with device selector)
   List<dynamic> _getAvailablePlayersSorted(MusicAssistantProvider maProvider) {
     // Use the provider's already-sorted list, filter for available only
@@ -612,6 +693,9 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
           _extractColors(imageUrl);
         }
 
+        // Update favorite status when track changes
+        _updateFavoriteStatus(currentTrack);
+
         return AnimatedBuilder(
           animation: Listenable.merge([_expandAnimation, _queuePanelAnimation]),
           builder: (context, _) {
@@ -821,19 +905,27 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
     final expandedTitleWidth = screenSize.width - (contentPadding * 2);
     final titleWidth = _lerpDouble(collapsedTitleWidth, expandedTitleWidth, t);
 
-    // Measure actual title height for dynamic layout
+    // Measure actual title height for dynamic layout (CACHED to avoid layout every frame)
     final titleStyle = TextStyle(
       fontSize: 24.0,
       fontWeight: FontWeight.w600,
       letterSpacing: -0.5,
       height: 1.2,
     );
-    final titlePainter = TextPainter(
-      text: TextSpan(text: currentTrack.name, style: titleStyle),
-      maxLines: 2,
-      textDirection: TextDirection.ltr,
-    )..layout(maxWidth: expandedTitleWidth);
-    final expandedTitleHeight = titlePainter.height;
+    // Only recalculate if track name or width changed
+    if (_lastMeasuredTrackName != currentTrack.name ||
+        _lastMeasuredTitleWidth != expandedTitleWidth ||
+        _cachedExpandedTitleHeight == null) {
+      final titlePainter = TextPainter(
+        text: TextSpan(text: currentTrack.name, style: titleStyle),
+        maxLines: 2,
+        textDirection: TextDirection.ltr,
+      )..layout(maxWidth: expandedTitleWidth);
+      _cachedExpandedTitleHeight = titlePainter.height;
+      _lastMeasuredTrackName = currentTrack.name;
+      _lastMeasuredTitleWidth = expandedTitleWidth;
+    }
+    final expandedTitleHeight = _cachedExpandedTitleHeight!;
 
     // Calculate track info block height (title + gap + artist + gap + album)
     final titleToArtistGap = 12.0;
@@ -992,53 +1084,57 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
 
                 // Album art - with slide animation when collapsed
                 // Hidden during transition to prevent flash (peek content shows instead)
-                Positioned(
-                  left: artLeft + miniPlayerSlideOffset,
-                  top: artTop,
-                  child: Opacity(
-                    opacity: _inTransition && t < 0.1 ? 0.0 : 1.0,
+                // GPU PERF: Use conditional instead of Opacity to avoid saveLayer
+                if (!(_inTransition && t < 0.1))
+                  Positioned(
+                    left: artLeft + miniPlayerSlideOffset,
+                    top: artTop,
                     child: Container(
                       width: artSize,
                       height: artSize,
                       decoration: BoxDecoration(
                         borderRadius: BorderRadius.circular(artBorderRadius),
+                        // GPU PERF: Fixed blur/offset, only animate shadow opacity
                         boxShadow: t > 0.3
                             ? [
                                 BoxShadow(
-                                  color: Colors.black.withOpacity(0.3 * t),
-                                  blurRadius: 24 * t,
-                                  offset: Offset(0, 8 * t),
+                                  color: Colors.black.withOpacity(0.25 * ((t - 0.3) / 0.7).clamp(0.0, 1.0)),
+                                  blurRadius: 20,
+                                  offset: const Offset(0, 8),
                                 ),
                               ]
                             : null,
                       ),
-                      child: ClipRRect(
-                        borderRadius: BorderRadius.circular(artBorderRadius),
-                        child: imageUrl != null
-                            ? CachedNetworkImage(
-                                imageUrl: imageUrl,
-                                fit: BoxFit.cover,
-                                memCacheWidth: t > 0.5 ? 1024 : 256,
-                                memCacheHeight: t > 0.5 ? 1024 : 256,
-                                fadeInDuration: Duration.zero,
-                                fadeOutDuration: Duration.zero,
-                                placeholderFadeInDuration: Duration.zero,
-                                placeholder: (_, __) => _buildPlaceholderArt(colorScheme, t),
-                                errorWidget: (_, __, ___) => _buildPlaceholderArt(colorScheme, t),
-                              )
-                            : _buildPlaceholderArt(colorScheme, t),
+                      // Use RepaintBoundary to isolate art repaints during animation
+                      child: RepaintBoundary(
+                        child: ClipRRect(
+                          borderRadius: BorderRadius.circular(artBorderRadius),
+                          child: imageUrl != null
+                              ? CachedNetworkImage(
+                                  imageUrl: imageUrl,
+                                  fit: BoxFit.cover,
+                                  // Fixed cache size to avoid mid-animation cache thrashing
+                                  memCacheWidth: 512,
+                                  memCacheHeight: 512,
+                                  fadeInDuration: Duration.zero,
+                                  fadeOutDuration: Duration.zero,
+                                  placeholderFadeInDuration: Duration.zero,
+                                  placeholder: (_, __) => _buildPlaceholderArt(colorScheme, t),
+                                  errorWidget: (_, __, ___) => _buildPlaceholderArt(colorScheme, t),
+                                )
+                              : _buildPlaceholderArt(colorScheme, t),
+                        ),
                       ),
                     ),
                   ),
-                ),
 
                 // Track title - with slide animation when collapsed
                 // Hidden during transition to prevent flash
-                Positioned(
-                  left: titleLeft + miniPlayerSlideOffset,
-                  top: titleTop,
-                  child: Opacity(
-                    opacity: _inTransition && t < 0.1 ? 0.0 : 1.0,
+                // GPU PERF: Use conditional instead of Opacity to avoid saveLayer
+                if (!(_inTransition && t < 0.1))
+                  Positioned(
+                    left: titleLeft + miniPlayerSlideOffset,
+                    top: titleTop,
                     child: SizedBox(
                       width: titleWidth,
                       child: Text(
@@ -1056,15 +1152,14 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                       ),
                     ),
                   ),
-                ),
 
                 // Artist name - with slide animation when collapsed
                 // Hidden during transition to prevent flash
-                Positioned(
-                  left: titleLeft + miniPlayerSlideOffset,
-                  top: artistTop,
-                  child: Opacity(
-                    opacity: _inTransition && t < 0.1 ? 0.0 : 1.0,
+                // GPU PERF: Use conditional instead of Opacity to avoid saveLayer
+                if (!(_inTransition && t < 0.1))
+                  Positioned(
+                    left: titleLeft + miniPlayerSlideOffset,
+                    top: artistTop,
                     child: SizedBox(
                       width: titleWidth,
                       child: Text(
@@ -1080,38 +1175,40 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                       ),
                     ),
                   ),
-                ),
 
                 // Album name (expanded only)
+                // GPU PERF: Use color alpha instead of Opacity widget
                 if (currentTrack.album != null && t > 0.3)
                   Positioned(
                     left: contentPadding,
                     right: contentPadding,
                     top: _lerpDouble(artistTop + 24, expandedAlbumTop, t),
-                    child: Opacity(
-                      opacity: ((t - 0.3) / 0.7).clamp(0.0, 1.0),
-                      child: Text(
-                        currentTrack.album!.name,
-                        style: TextStyle(
-                          color: textColor.withOpacity(0.45),
-                          fontSize: 15, // Increased from 13 to 15
-                          fontWeight: FontWeight.w300,
-                        ),
-                        textAlign: TextAlign.center,
-                        maxLines: 1,
-                        overflow: TextOverflow.ellipsis,
+                    child: Text(
+                      currentTrack.album!.name,
+                      style: TextStyle(
+                        color: textColor.withOpacity(0.45 * ((t - 0.3) / 0.7).clamp(0.0, 1.0)),
+                        fontSize: 15,
+                        fontWeight: FontWeight.w300,
                       ),
+                      textAlign: TextAlign.center,
+                      maxLines: 1,
+                      overflow: TextOverflow.ellipsis,
                     ),
                   ),
 
                 // Progress bar (expanded only)
+                // GPU PERF: Use FadeTransition instead of Opacity
                 if (t > 0.5 && currentTrack.duration != null)
                   Positioned(
                     left: contentPadding,
                     right: contentPadding,
                     top: expandedProgressTop,
-                    child: Opacity(
-                      opacity: expandedElementsOpacity,
+                    child: FadeTransition(
+                      opacity: _expandAnimation.drive(
+                        Tween(begin: 0.0, end: 1.0).chain(
+                          CurveTween(curve: const Interval(0.5, 1.0, curve: Curves.easeIn)),
+                        ),
+                      ),
                       child: ValueListenableBuilder<int>(
                         valueListenable: _progressNotifier,
                         builder: (context, elapsedTime, child) {
@@ -1202,14 +1299,13 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                     mainAxisAlignment: t > 0.5 ? MainAxisAlignment.center : MainAxisAlignment.end,
                     children: [
                       // Shuffle (expanded only)
-                      if (t > 0.5)
-                        Opacity(
-                          opacity: expandedElementsOpacity,
-                          child: _buildSecondaryButton(
-                            icon: Icons.shuffle_rounded,
-                            color: _queue?.shuffle == true ? primaryColor : textColor.withOpacity(0.5),
-                            onPressed: _isLoadingQueue ? null : _toggleShuffle,
-                          ),
+                      // GPU PERF: Use color alpha instead of Opacity
+                      if (t > 0.5 && expandedElementsOpacity > 0.1)
+                        _buildSecondaryButton(
+                          icon: Icons.shuffle_rounded,
+                          color: (_queue?.shuffle == true ? primaryColor : textColor.withOpacity(0.5))
+                              .withOpacity(expandedElementsOpacity),
+                          onPressed: _isLoadingQueue ? null : _toggleShuffle,
                         ),
                       if (t > 0.5) SizedBox(width: _lerpDouble(0, 20, t)),
 
@@ -1247,85 +1343,109 @@ class ExpandablePlayerState extends State<ExpandablePlayer>
                       ),
 
                       // Repeat (expanded only)
+                      // GPU PERF: Use color alpha instead of Opacity
                       if (t > 0.5) SizedBox(width: _lerpDouble(0, 20, t)),
-                      if (t > 0.5)
-                        Opacity(
-                          opacity: expandedElementsOpacity,
-                          child: _buildSecondaryButton(
-                            icon: _queue?.repeatMode == 'one' ? Icons.repeat_one_rounded : Icons.repeat_rounded,
-                            color: _queue?.repeatMode != null && _queue!.repeatMode != 'off'
-                                ? primaryColor
-                                : textColor.withOpacity(0.5),
-                            onPressed: _isLoadingQueue ? null : _cycleRepeat,
-                          ),
+                      if (t > 0.5 && expandedElementsOpacity > 0.1)
+                        _buildSecondaryButton(
+                          icon: _queue?.repeatMode == 'one' ? Icons.repeat_one_rounded : Icons.repeat_rounded,
+                          color: (_queue?.repeatMode != null && _queue!.repeatMode != 'off'
+                                  ? primaryColor
+                                  : textColor.withOpacity(0.5))
+                              .withOpacity(expandedElementsOpacity),
+                          onPressed: _isLoadingQueue ? null : _cycleRepeat,
                         ),
                     ],
                   ),
                 ),
 
                 // Volume control (expanded only)
+                // GPU PERF: Use FadeTransition instead of Opacity
                 if (t > 0.5)
                   Positioned(
                     left: 48,
                     right: 48,
                     top: volumeTop,
-                    child: Opacity(
-                      opacity: expandedElementsOpacity,
+                    child: FadeTransition(
+                      opacity: _expandAnimation.drive(
+                        Tween(begin: 0.0, end: 1.0).chain(
+                          CurveTween(curve: const Interval(0.5, 1.0, curve: Curves.easeIn)),
+                        ),
+                      ),
                       child: const VolumeControl(compact: false),
                     ),
                   ),
 
                 // Collapse button (expanded only)
+                // GPU PERF: Use icon color alpha instead of Opacity
                 if (t > 0.3)
                   Positioned(
                     top: topPadding + 4,
                     left: 4,
-                    child: Opacity(
-                      opacity: ((t - 0.3) / 0.7).clamp(0.0, 1.0),
-                      child: IconButton(
-                        icon: Icon(Icons.keyboard_arrow_down_rounded, color: textColor, size: 28),
-                        onPressed: collapse,
-                        padding: const EdgeInsets.all(12),
+                    child: IconButton(
+                      icon: Icon(
+                        Icons.keyboard_arrow_down_rounded,
+                        color: textColor.withOpacity(((t - 0.3) / 0.7).clamp(0.0, 1.0)),
+                        size: 28,
                       ),
+                      onPressed: collapse,
+                      padding: const EdgeInsets.all(12),
+                    ),
+                  ),
+
+                // Favorite button (expanded only) - hide when queue panel is open
+                // GPU PERF: Use icon color alpha instead of Opacity
+                if (t > 0.3 && queueT < 0.5)
+                  Positioned(
+                    top: topPadding + 4,
+                    right: 52,
+                    child: IconButton(
+                      icon: Icon(
+                        _isCurrentTrackFavorite ? Icons.favorite : Icons.favorite_border,
+                        color: (_isCurrentTrackFavorite ? Colors.red : textColor)
+                            .withOpacity(((t - 0.3) / 0.7).clamp(0.0, 1.0) * (1 - queueT * 2).clamp(0.0, 1.0)),
+                        size: 24,
+                      ),
+                      onPressed: () => _toggleCurrentTrackFavorite(currentTrack),
+                      padding: const EdgeInsets.all(12),
                     ),
                   ),
 
                 // Queue button (expanded only) - hide when queue panel is open
+                // GPU PERF: Use icon color alpha instead of Opacity
                 if (t > 0.3 && queueT < 0.5)
                   Positioned(
                     top: topPadding + 4,
                     right: 4,
-                    child: Opacity(
-                      opacity: ((t - 0.3) / 0.7).clamp(0.0, 1.0) * (1 - queueT * 2).clamp(0.0, 1.0),
-                      child: IconButton(
-                        icon: Icon(Icons.queue_music_rounded, color: textColor, size: 24),
-                        onPressed: _toggleQueuePanel,
-                        padding: const EdgeInsets.all(12),
+                    child: IconButton(
+                      icon: Icon(
+                        Icons.queue_music_rounded,
+                        color: textColor.withOpacity(((t - 0.3) / 0.7).clamp(0.0, 1.0) * (1 - queueT * 2).clamp(0.0, 1.0)),
+                        size: 24,
                       ),
+                      onPressed: _toggleQueuePanel,
+                      padding: const EdgeInsets.all(12),
                     ),
                   ),
 
                 // Player name (expanded only)
+                // GPU PERF: Use text color alpha instead of Opacity
                 if (t > 0.5)
                   Positioned(
                     top: topPadding + 12,
                     left: 56,
                     right: 56,
                     child: IgnorePointer(
-                      child: Opacity(
-                        opacity: ((t - 0.5) / 0.5).clamp(0.0, 1.0),
-                        child: Text(
-                          selectedPlayer.name,
-                          style: TextStyle(
-                            color: textColor.withOpacity(0.6),
-                            fontSize: 15, // Increased from 13 to 15
-                            fontWeight: FontWeight.w500,
-                            letterSpacing: 0.2,
-                          ),
-                          textAlign: TextAlign.center,
-                          maxLines: 1,
-                          overflow: TextOverflow.ellipsis,
+                      child: Text(
+                        selectedPlayer.name,
+                        style: TextStyle(
+                          color: textColor.withOpacity(0.6 * ((t - 0.5) / 0.5).clamp(0.0, 1.0)),
+                          fontSize: 15,
+                          fontWeight: FontWeight.w500,
+                          letterSpacing: 0.2,
                         ),
+                        textAlign: TextAlign.center,
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
                       ),
                     ),
                   ),

lib/widgets/global_player_overlay.dart

@@ -149,19 +149,65 @@ class _GlobalPlayerOverlayState extends State<GlobalPlayerOverlay>
                     navSelectedColor = hsl.withLightness((hsl.lightness - 0.3).clamp(0.2, 1.0)).toColor();
                   }
 
+                  // Base background: use adaptive surface color if available, otherwise default surface
+                  final baseBgColor = (themeProvider.adaptiveTheme && themeProvider.adaptiveSurfaceColor != null)
+                      ? themeProvider.adaptiveSurfaceColor!
+                      : colorScheme.surface;
+
                   return ValueListenableBuilder<PlayerExpansionState>(
                     valueListenable: playerExpansionNotifier,
-                    builder: (context, expansionState, child) {
-                      // Base background: use adaptive surface color if available, otherwise default surface
-                      final baseBgColor = (themeProvider.adaptiveTheme && themeProvider.adaptiveSurfaceColor != null)
-                          ? themeProvider.adaptiveSurfaceColor!
-                          : colorScheme.surface;
-
-                      // Lerp between base color and player background when expanded
+                    // Pass BottomNavigationBar as child to avoid rebuilding it every frame
+                    child: BottomNavigationBar(
+                      currentIndex: navigationProvider.selectedIndex,
+                      onTap: (index) {
+                        if (GlobalPlayerOverlay.isPlayerExpanded) {
+                          GlobalPlayerOverlay.collapsePlayer();
+                        }
+                        navigationProvider.navigatorKey.currentState?.popUntil((route) => route.isFirst);
+                        if (index == 3) {
+                          GlobalPlayerOverlay.hidePlayer();
+                        } else if (navigationProvider.selectedIndex == 3) {
+                          GlobalPlayerOverlay.showPlayer();
+                        }
+                        navigationProvider.setSelectedIndex(index);
+                      },
+                      backgroundColor: Colors.transparent,
+                      selectedItemColor: navSelectedColor,
+                      unselectedItemColor: colorScheme.onSurface.withOpacity(0.54),
+                      elevation: 0,
+                      type: BottomNavigationBarType.fixed,
+                      selectedFontSize: 12,
+                      unselectedFontSize: 12,
+                      items: const [
+                        BottomNavigationBarItem(
+                          icon: Icon(Icons.home_outlined),
+                          activeIcon: Icon(Icons.home_rounded),
+                          label: 'Home',
+                        ),
+                        BottomNavigationBarItem(
+                          icon: Icon(Icons.library_music_outlined),
+                          activeIcon: Icon(Icons.library_music_rounded),
+                          label: 'Library',
+                        ),
+                        BottomNavigationBarItem(
+                          icon: Icon(Icons.search_rounded),
+                          activeIcon: Icon(Icons.search_rounded),
+                          label: 'Search',
+                        ),
+                        BottomNavigationBarItem(
+                          icon: Icon(Icons.settings_outlined),
+                          activeIcon: Icon(Icons.settings_rounded),
+                          label: 'Settings',
+                        ),
+                      ],
+                    ),
+                    builder: (context, expansionState, navBar) {
+                      // Only compute colors during animation - this is the hot path
                       final navBgColor = expansionState.progress > 0 && expansionState.backgroundColor != null
                           ? Color.lerp(baseBgColor, expansionState.backgroundColor, expansionState.progress)!
                           : baseBgColor;
 
+                      // Use AnimatedContainer for smoother transitions instead of rebuilding
                       return Container(
                         decoration: BoxDecoration(
                           color: navBgColor,
@@ -175,56 +221,7 @@ class _GlobalPlayerOverlayState extends State<GlobalPlayerOverlay>
                                 ]
                               : null,
                         ),
-                        child: BottomNavigationBar(
-                          currentIndex: navigationProvider.selectedIndex,
-                          onTap: (index) {
-                            // Collapse player if expanded
-                            if (GlobalPlayerOverlay.isPlayerExpanded) {
-                              GlobalPlayerOverlay.collapsePlayer();
-                            }
-
-                            // Pop any pushed routes (album/artist details) first
-                            navigationProvider.navigatorKey.currentState?.popUntil((route) => route.isFirst);
-
-                            // Hide mini player on Settings screen, show on other screens
-                            if (index == 3) {
-                              GlobalPlayerOverlay.hidePlayer();
-                            } else if (navigationProvider.selectedIndex == 3) {
-                              GlobalPlayerOverlay.showPlayer();
-                            }
-
-                            navigationProvider.setSelectedIndex(index);
-                          },
-                          backgroundColor: Colors.transparent,
-                          selectedItemColor: navSelectedColor,
-                          unselectedItemColor: colorScheme.onSurface.withOpacity(0.54),
-                          elevation: 0,
-                          type: BottomNavigationBarType.fixed,
-                          selectedFontSize: 12,
-                          unselectedFontSize: 12,
-                          items: const [
-                            BottomNavigationBarItem(
-                              icon: Icon(Icons.home_outlined),
-                              activeIcon: Icon(Icons.home_rounded),
-                              label: 'Home',
-                            ),
-                            BottomNavigationBarItem(
-                              icon: Icon(Icons.library_music_outlined),
-                              activeIcon: Icon(Icons.library_music_rounded),
-                              label: 'Library',
-                            ),
-                            BottomNavigationBarItem(
-                              icon: Icon(Icons.search_rounded),
-                              activeIcon: Icon(Icons.search_rounded),
-                              label: 'Search',
-                            ),
-                            BottomNavigationBarItem(
-                              icon: Icon(Icons.settings_outlined),
-                              activeIcon: Icon(Icons.settings_rounded),
-                              label: 'Settings',
-                            ),
-                          ],
-                        ),
+                        child: navBar, // Reuse pre-built navigation bar
                       );
                     },
                   );
@@ -234,17 +231,22 @@ class _GlobalPlayerOverlayState extends State<GlobalPlayerOverlay>
           ),
         ),
         // Global player overlay - slides down when hidden, renders ON TOP of bottom nav
-        AnimatedBuilder(
-          animation: _slideAnimation,
-          builder: (context, child) {
-            return Consumer<MusicAssistantProvider>(
-              builder: (context, maProvider, _) {
-                // Only show player if connected and has a selected player
-                // Mini player is now permanent - shows device selector even without a track
-                if (!maProvider.isConnected ||
-                    maProvider.selectedPlayer == null) {
-                  return const SizedBox.shrink();
-                }
+        // Use Selector instead of Consumer to avoid rebuilds during animation
+        Selector<MusicAssistantProvider, ({bool isConnected, bool hasPlayer})>(
+          selector: (_, provider) => (
+            isConnected: provider.isConnected,
+            hasPlayer: provider.selectedPlayer != null,
+          ),
+          builder: (context, state, child) {
+            // Only show player if connected and has a selected player
+            if (!state.isConnected || !state.hasPlayer) {
+              return const SizedBox.shrink();
+            }
+            return AnimatedBuilder(
+              animation: _slideAnimation,
+              child: ExpandablePlayer(key: globalPlayerKey, slideOffset: 0),
+              builder: (context, staticChild) {
+                // Only slideOffset changes during animation, player widget stays same
                 return ExpandablePlayer(
                   key: globalPlayerKey,
                   slideOffset: _slideAnimation.value,

pubspec.yaml

@@ -1,7 +1,7 @@
 name: ensemble
 description: A minimalistic Music Assistant client built with Flutter
 publish_to: 'none'
-version: 1.6.1+8
+version: 1.8.0+9
 
 environment:
   sdk: '>=3.0.0 <4.0.0'
@@ -28,6 +28,9 @@ dependencies:
 
   # Utilities
   uuid: ^4.2.1
+  package_info_plus: ^8.0.0
+  device_info_plus: ^10.1.0
+  share_plus: ^9.0.0
 
   # Audio - Local Playback
   just_audio: ^0.9.36