feat: implement library page with recent albums and navigation links

app/components/AudioPlayer.tsx

@@ -350,6 +350,7 @@ export const AudioPlayer: React.FC = () => {
   }, [currentTrack, isPlaying, isClient, playPreviousTrack, playNextTrack, onTrackPlay, onTrackPause]);
   
   const handleProgressClick = (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
+    e.stopPropagation(); // Prevent triggering fullscreen
     if (audioCurrent && currentTrack) {
       const rect = e.currentTarget.getBoundingClientRect();
       const clickX = e.clientX - rect.left;
@@ -499,15 +500,15 @@ export const AudioPlayer: React.FC = () => {
               </div>
             </div>
           </div>
-          
-          {/* Full Screen Player for mobile */}
-          <FullScreenPlayer 
-            isOpen={isFullScreen} 
-            onClose={() => setIsFullScreen(false)} 
-            onOpenQueue={handleOpenQueue}
-          />
         </div>
         
+        {/* Full Screen Player for mobile - rendered outside mini player */}
+        <FullScreenPlayer 
+          isOpen={isFullScreen} 
+          onClose={() => setIsFullScreen(false)} 
+          onOpenQueue={handleOpenQueue}
+        />
+        
         {/* Single audio element - shared across all UI states */}
         <audio ref={audioRef} hidden />
         <audio ref={preloadAudioRef} hidden preload="metadata" />

app/components/BottomNavigation.tsx

@@ -13,9 +13,7 @@ interface NavItem {
 const navigationItems: NavItem[] = [
   { href: '/', label: 'Home', icon: Home },
   { href: '/search', label: 'Search', icon: Search },
-  { href: '/library/albums', label: 'Albums', icon: Disc },
-  { href: '/library/artists', label: 'Artists', icon: Users },
-  { href: '/favorites', label: 'Favorites', icon: Heart },
+  { href: '/library', label: 'Library', icon: Music },
   { href: '/queue', label: 'Queue', icon: List },
 ];