feat: add sort filter chips to albums and favorites views

src/main.js

@@ -15,7 +15,7 @@ import {
   navigate, _navGoBack, _navLoad, onLocalSearch, onMobileSearch,
   onGlobalSearch, s_goArtist, s_goAlbum, playerBarGoArtist, playerBarGoAlbum,
   searchSimilarArtist, searchAndPreview, loadItunesAlbum, expandArtistBio,
-  loadRandom,
+  loadAlbums, loadStarred, loadRandom,
 } from './views.js';
 import { loadSpotifyImporter, resolveSpotifyLink, clearSpotifyPreview, spotifyDlAll } from './spotify.js';
 import {
@@ -282,7 +282,7 @@ Object.assign(window, {
   openSettings, closeSettings, saveSettings, confirmDisconnect, checkBackend,
   openSidebar, closeSidebar, switchNavMode, showCtxMenu,
   // Views
-  loadRandom, loadSpotifyImporter, resolveSpotifyLink, clearSpotifyPreview, spotifyDlAll,
+  loadAlbums, loadStarred, loadRandom, loadSpotifyImporter, resolveSpotifyLink, clearSpotifyPreview, spotifyDlAll,
   executeSpotifyDownload,
   openPlModal, closePlModal, addSongsToPlaylist, createAndAddPlaylist, createPlaylistPrompt,
   showSongInfo, closeInfoModal,

src/views.js

@@ -154,11 +154,16 @@ export async function loadArtists() {
 }
 
 // ─── ALBUMS ───
-export async function loadAlbums() {
+let _albumSort = 'alphabeticalByName';
+
+export async function loadAlbums(type = _albumSort) {
+  _albumSort = type;
+  document.querySelectorAll('#albums-sort-chips .sort-chip').forEach(c =>
+    c.classList.toggle('active', c.dataset.sort === type));
   const g = document.getElementById('albums-grid');
   g.innerHTML = '<div class="spinner"></div>';
   try {
-    const r = await api('getAlbumList2', '&type=alphabeticalByName&size=500');
+    const r = await api('getAlbumList2', `&type=${type}&size=500`);
     g.innerHTML = '';
     (r.albumList2?.album || []).forEach(a => g.appendChild(makeAlbumCard(a)));
   } catch(e) { g.innerHTML = `<p style="color:var(--danger)">${e.message}</p>`; }
@@ -632,12 +637,22 @@ export async function quickPlayAlbum(a) {
 }
 
 // ─── STARRED / RANDOM ───
-export async function loadStarred() {
+let _starredSort = 'newest';
+
+export async function loadStarred(sort = _starredSort) {
+  _starredSort = sort;
+  document.querySelectorAll('#starred-sort-chips .sort-chip').forEach(c =>
+    c.classList.toggle('active', c.dataset.sort === sort));
   const el = document.getElementById('starred-songs');
   el.innerHTML = '<div class="spinner"></div>';
   try {
     const r = await api('getStarred2');
-    const songs = (r.starred2?.song || []).map(s => ({...s,_starred:true}));
+    let songs = (r.starred2?.song || []).map(s => ({...s, _starred: true}));
+    if      (sort === 'newest') songs.sort((a, b) => new Date(b.starred||0) - new Date(a.starred||0));
+    else if (sort === 'oldest') songs.sort((a, b) => new Date(a.starred||0) - new Date(b.starred||0));
+    else if (sort === 'az')     songs.sort((a, b) => (a.title||'').localeCompare(b.title||''));
+    else if (sort === 'artist') songs.sort((a, b) => (a.artist||'').localeCompare(b.artist||''));
+    else if (sort === 'plays')  songs.sort((a, b) => (b.playCount||0) - (a.playCount||0));
     el.innerHTML = '';
     if(!songs.length) { el.innerHTML = '<div class="empty-state"><div class="icon">⭐</div><p>Noch keine Favoriten</p></div>'; return; }
     songs.forEach((s,i) => el.appendChild(makeSongItem(s, i, songs)));