Add lyrics completion bar per playlist showing percentage of tracks with cached lyrics
Some checks failed
CI / build-and-test (push) Has been cancelled

This commit is contained in:
2026-02-05 12:44:11 -05:00
parent 9abb53de1a
commit 328a6a0eea
2 changed files with 60 additions and 1 deletions

View File

@@ -662,13 +662,14 @@
<th>Spotify ID</th>
<th>Tracks</th>
<th>Completion</th>
<th>Lyrics</th>
<th>Cache Age</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="playlist-table-body">
<tr>
<td colspan="6" class="loading">
<td colspan="7" class="loading">
<span class="spinner"></span> Loading playlists...
</td>
</tr>
@@ -1271,6 +1272,16 @@
<span style="font-size:0.85rem;color:${completionColor};font-weight:500;min-width:40px;">${completionPct}%</span>
</div>
</td>
<td>
${p.lyricsTotal > 0 ? `
<div style="display:flex;align-items:center;gap:8px;">
<div style="flex:1;background:var(--bg-tertiary);height:12px;border-radius:6px;overflow:hidden;">
<div style="width:${p.lyricsPercentage}%;height:100%;background:${p.lyricsPercentage === 100 ? '#10b981' : '#3b82f6'};transition:width 0.3s;" title="${p.lyricsCached} lyrics cached"></div>
</div>
<span style="font-size:0.85rem;color:var(--text-secondary);font-weight:500;min-width:40px;">${p.lyricsPercentage}%</span>
</div>
` : '<span style="color:var(--text-secondary);font-size:0.85rem;">-</span>'}
</td>
<td class="cache-age">${p.cacheAge || '-'}</td>
<td>
<button onclick="matchPlaylistTracks('${escapeJs(p.name)}')">Match Tracks</button>