add watchlist indicator to artists listed on the library page that are in the user watchlist

database/music_database.py

@@ -4082,10 +4082,16 @@ class MusicDatabase:
                         a.genres,
                         a.musicbrainz_id,
                         COUNT(DISTINCT al.id) as album_count,
-                        COUNT(DISTINCT t.id) as track_count
+                        COUNT(DISTINCT t.id) as track_count,
+                        MAX(CASE WHEN wa.id IS NOT NULL THEN 1 ELSE 0 END) as is_watched
                     FROM artists a
                     LEFT JOIN albums al ON a.id = al.artist_id
                     LEFT JOIN tracks t ON al.id = t.album_id
+                    LEFT JOIN watchlist_artists wa ON (
+                        (a.spotify_artist_id IS NOT NULL AND a.spotify_artist_id = wa.spotify_artist_id)
+                        OR (a.itunes_artist_id IS NOT NULL AND a.itunes_artist_id = wa.itunes_artist_id)
+                        OR LOWER(a.name) = LOWER(wa.artist_name)
+                    )
                     WHERE {where_clause}
                     GROUP BY a.id, a.name, a.thumb_url, a.genres, a.musicbrainz_id
                     ORDER BY a.name COLLATE NOCASE
@@ -4126,7 +4132,8 @@ class MusicDatabase:
                         'genres': artist.genres,
                         'musicbrainz_id': row['musicbrainz_id'],
                         'album_count': row['album_count'] or 0,
-                        'track_count': row['track_count'] or 0
+                        'track_count': row['track_count'] or 0,
+                        'is_watched': bool(row['is_watched'])
                     }
                     artists.append(artist_data)
 

webui/static/script.js

@@ -25478,6 +25478,16 @@ function createLibraryArtistCard(artist) {
         card.appendChild(mbIcon);
     }
 
+    // Add watchlist indicator if artist is on the watchlist
+    if (artist.is_watched) {
+        const watchIcon = document.createElement('div');
+        watchIcon.className = 'watchlist-card-icon';
+        watchIcon.title = 'On your watchlist';
+        watchIcon.style.top = artist.musicbrainz_id ? '40px' : '8px';
+        watchIcon.textContent = '👁️';
+        card.appendChild(watchIcon);
+    }
+
     // Create image element
     const imageContainer = document.createElement("div");
     imageContainer.className = "library-artist-image";

webui/static/style.css

@@ -21980,6 +21980,25 @@ body {
     opacity: 1 !important;
 }
 
+.watchlist-card-icon {
+    position: absolute;
+    right: 8px;
+    width: 28px;
+    height: 28px;
+    background: rgba(0, 0, 0, 0.6);
+    backdrop-filter: blur(4px);
+    border: 1px solid rgba(29, 185, 84, 0.4);
+    border-radius: 4px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    opacity: 0.9;
+    z-index: 100;
+    font-size: 14px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
+    pointer-events: none;
+}
+
 /* ============================= */
 /* IMPORT MODAL                  */
 /* ============================= */