diff --git a/index.html b/index.html index 1c9da6b..ae79a18 100644 --- a/index.html +++ b/index.html @@ -110,6 +110,10 @@

Recent Albums

+
+

Recent Playlists

+
+

Recent Artists

diff --git a/js/storage.js b/js/storage.js index 58660e4..88d9a69 100644 --- a/js/storage.js +++ b/js/storage.js @@ -193,9 +193,11 @@ export const recentActivityManager = { _get() { try { const data = localStorage.getItem(this.STORAGE_KEY); - return data ? JSON.parse(data) : { artists: [], albums: [] }; + const parsed = data ? JSON.parse(data) : { artists: [], albums: [], playlists: [] }; + if (!parsed.playlists) parsed.playlists = []; + return parsed; } catch (e) { - return { artists: [], albums: [] }; + return { artists: [], albums: [], playlists: [] }; } }, @@ -221,6 +223,10 @@ export const recentActivityManager = { addAlbum(album) { this._add('albums', album); + }, + + addPlaylist(playlist) { + this._add('playlists', playlist); } }; diff --git a/js/ui.js b/js/ui.js index d90039d..4d55efe 100644 --- a/js/ui.js +++ b/js/ui.js @@ -206,6 +206,7 @@ export class UIRenderer { const albumsContainer = document.getElementById('home-recent-albums'); const artistsContainer = document.getElementById('home-recent-artists'); + const playlistsContainer = document.getElementById('home-recent-playlists'); albumsContainer.innerHTML = recents.albums.length ? recents.albums.map(album => this.createAlbumCardHTML(album)).join('') @@ -214,6 +215,12 @@ export class UIRenderer { artistsContainer.innerHTML = recents.artists.length ? recents.artists.map(artist => this.createArtistCardHTML(artist)).join('') : createPlaceholder("You haven't viewed any artists yet. Search for music to get started!"); + + if (playlistsContainer) { + playlistsContainer.innerHTML = recents.playlists && recents.playlists.length + ? recents.playlists.map(playlist => this.createPlaylistCardHTML(playlist)).join('') + : createPlaceholder("You haven't viewed any playlists yet. Search for music to get started!"); + } } async renderSearchPage(query) { @@ -427,10 +434,11 @@ async renderPlaylistPage(playlistId) { `; - this.renderListWithTracks(tracklistContainer, tracks, true); - - document.title = `${playlist.title} - Monochrome`; - } catch (error) { + this.renderListWithTracks(tracklistContainer, tracks, true); + + recentActivityManager.addPlaylist(playlist); + + document.title = `${playlist.title || 'Artist Mix'} - Monochrome`; } catch (error) { console.error("Failed to load playlist:", error); tracklistContainer.innerHTML = createPlaceholder(`Could not load playlist details. ${error.message}`); }