feat: add search filter bar to playlist detail and favorites views

src/views.js

@@ -557,11 +557,22 @@ export async function loadPlaylistDetail(pl) {
     };
     sl.innerHTML = '';
     sl.classList.add('pl-draggable');
+    const plSearch = document.getElementById('playlist-search');
+    if (plSearch) plSearch.value = '';
     songs.forEach((s,i) => sl.appendChild(makeSongItem(s, i, songs, { noArtistLink: true, noAlbumLink: true })));
     _initPlaylistDragDrop(sl, songs, S._currentPlaylist);
   } catch(e) { sl.innerHTML = `<p style="color:var(--danger)">${e.message}</p>`; }
 }
 
+export function filterPlaylist(val) {
+  const q = val.trim().toLowerCase();
+  document.querySelectorAll('#playlist-songs .song-item').forEach(item => {
+    const title  = (item.querySelector('.song-title')?.textContent  || '').toLowerCase();
+    const artist = (item.querySelector('.song-artist')?.textContent || '').toLowerCase();
+    item.style.display = (!q || title.includes(q) || artist.includes(q)) ? '' : 'none';
+  });
+}
+
 function _initPlaylistDragDrop(container, songs, pl) {
   let dragSrc = null;
   let saveTimer = null;
@@ -645,6 +656,8 @@ export async function loadStarred(sort = _starredSort) {
     c.classList.toggle('active', c.dataset.sort === sort));
   const el = document.getElementById('starred-songs');
   el.innerHTML = '<div class="spinner"></div>';
+  const searchEl = document.getElementById('starred-search');
+  if (searchEl) searchEl.value = '';
   try {
     const r = await api('getStarred2');
     let songs = (r.starred2?.song || []).map(s => ({...s, _starred: true}));
@@ -659,6 +672,15 @@ export async function loadStarred(sort = _starredSort) {
   } catch(e) { el.innerHTML = `<p style="color:var(--danger)">${e.message}</p>`; }
 }
 
+export function filterStarred(val) {
+  const q = val.trim().toLowerCase();
+  document.querySelectorAll('#starred-songs .song-item').forEach(item => {
+    const title  = (item.querySelector('.song-title')?.textContent  || '').toLowerCase();
+    const artist = (item.querySelector('.song-artist')?.textContent || '').toLowerCase();
+    item.style.display = (!q || title.includes(q) || artist.includes(q)) ? '' : 'none';
+  });
+}
+
 export async function loadRandom() {
   const el = document.getElementById('random-songs');
   el.innerHTML = '<div class="spinner"></div>';