danvics/soulsync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Add View Discography button to watchlist artist detail overlay

Browse source 
Clicking the button closes the watchlist modal and navigates to the
Artists page with the artist's discography loaded. Uses the correct
source ID based on the active metadata source (Spotify/Deezer/iTunes).
This commit is contained in:
Broque Thomas 2026-03-26 08:01:31 -07:00
parent f6709c7cc3
commit 77b6d4927c
2 changed files with 44 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
webui/static/script.js
View file

@ -36806,7 +36806,7 @@ async function openWatchlistArtistDetailView(artistId, artistName) {
return;
}
const { config, artist, recent_releases } = data;
const { config, artist, recent_releases, spotify_artist_id, itunes_artist_id, deezer_artist_id } = data;
// Remove existing overlay if any
const existing = document.querySelector('.watchlist-artist-detail-overlay');
@ -36917,6 +36917,7 @@ async function openWatchlistArtistDetailView(artistId, artistName) {
</div>
<div class="watchlist-detail-actions">
<button class="watchlist-detail-discog-btn watchlist-detail-discog-action">View Discography</button>
<button class="watchlist-detail-settings-btn watchlist-detail-settings-action">Settings</button>
<button class="watchlist-detail-remove-btn watchlist-detail-remove-action">Remove from Watchlist</button>
</div>
@ -36928,6 +36929,35 @@ async function openWatchlistArtistDetailView(artistId, artistName) {
closeWatchlistArtistDetailView();
});
overlay.querySelector('.watchlist-detail-discog-action').addEventListener('click', () => {
// Use the ID matching the active metadata source
let discogId, source;
const activeSrc = (currentMusicSourceName || '').toLowerCase();
if (activeSrc.includes('spotify') && spotify_artist_id) {
discogId = spotify_artist_id; source = 'spotify';
} else if (activeSrc.includes('deezer') && deezer_artist_id) {
discogId = deezer_artist_id; source = 'deezer';
} else if (itunes_artist_id) {
discogId = itunes_artist_id; source = 'itunes';
} else {
discogId = spotify_artist_id || deezer_artist_id || itunes_artist_id;
source = spotify_artist_id ? 'spotify' : deezer_artist_id ? 'deezer' : 'itunes';
}
if (discogId) {
// Close watchlist modal + detail overlay
closeWatchlistArtistDetailView();
closeWatchlistModal();
// Navigate to Artists page and load discography
navigateToPage('artists');
setTimeout(() => {
selectArtistForDetail(
{ id: discogId, name: artistName, image_url: artist.image_url || '' },
{ source: source }
);
}, 200);
}
});
overlay.querySelector('.watchlist-detail-settings-action').addEventListener('click', () => {
// Remove overlay immediately so it doesn't block the config modal
const detailOverlay = document.querySelector('.watchlist-artist-detail-overlay');

16
webui/static/style.css
View file

@ -13452,13 +13452,23 @@ body.helper-mode-active #dashboard-activity-feed:hover {
transform: scale(0.98);
}
.watchlist-detail-settings-btn {
background: rgba(var(--accent-rgb), 0.15);
.watchlist-detail-discog-btn {
background: rgba(var(--accent-rgb), 0.2);
color: rgb(var(--accent-rgb));
font-weight: 600;
}
.watchlist-detail-discog-btn:hover {
background: rgba(var(--accent-rgb), 0.35);
}
.watchlist-detail-settings-btn {
background: rgba(255, 255, 255, 0.06);
color: rgba(255, 255, 255, 0.7);
}
.watchlist-detail-settings-btn:hover {
background: rgba(var(--accent-rgb), 0.25);
background: rgba(255, 255, 255, 0.12);
}
.watchlist-detail-remove-btn {