diff --git a/webui/index.html b/webui/index.html index 4e5d3afc..e3c1b192 100644 --- a/webui/index.html +++ b/webui/index.html @@ -279,9 +279,9 @@

Service Status

-
+
- Spotify + Spotify
@@ -616,14 +616,14 @@

Service Status

-
+
- Spotify + Spotify ● + id="metadata-source-status-indicator">●
-

Disconnected

-

Response: --

+

Disconnected

+

Response: --

diff --git a/webui/static/core.js b/webui/static/core.js index 27b90003..3852fda7 100644 --- a/webui/static/core.js +++ b/webui/static/core.js @@ -484,11 +484,11 @@ function handleServiceStatusUpdate(data) { } // Same logic as fetchAndUpdateServiceStatus response handler - updateServiceStatus('spotify', data.metadata_source, data.spotify); + updateServiceStatus('metadata-source', data.metadata_source, data.spotify); updateServiceStatus('media-server', data.media_server); updateServiceStatus('soulseek', data.soulseek); - updateSidebarServiceStatus('spotify', data.metadata_source, data.spotify); + updateSidebarServiceStatus('metadata-source', data.metadata_source, data.spotify); updateSidebarServiceStatus('media-server', data.media_server); updateSidebarServiceStatus('soulseek', data.soulseek); diff --git a/webui/static/helper.js b/webui/static/helper.js index a8f97688..76088a39 100644 --- a/webui/static/helper.js +++ b/webui/static/helper.js @@ -173,7 +173,7 @@ const HELPER_CONTENT = { title: 'Support & Community', description: 'Links to the SoulSync community Discord, GitHub issues for bug reports, and documentation resources.', }, - '#spotify-indicator': { + '#metadata-source-indicator': { title: 'Metadata Source', description: 'Connection status of your primary metadata source. This service provides artist, album, and track information for searches, enrichment, and discovery.', tips: [ @@ -236,7 +236,7 @@ const HELPER_CONTENT = { // ─── DASHBOARD: SERVICE CARDS ─────────────────────────────────── - '#spotify-service-card': { + '#metadata-source-service-card': { title: 'Metadata Source Status', description: 'Detailed connection info for your active metadata source. Shows connection state, response latency, and allows manual connection testing.', tips: [ @@ -2375,7 +2375,7 @@ const HELPER_TOURS = { { page: 'dashboard', selector: '#wishlist-button', title: 'Wishlist', description: 'Tracks queued for download. Failed downloads, watchlist discoveries, and manual additions all land here for retry.' }, // Service cards - { page: 'dashboard', selector: '#spotify-service-card', title: 'Metadata Source', description: 'Shows your metadata source connection (Spotify, iTunes, or Deezer). This determines where album, artist, and track info comes from. Click "Test Connection" to verify.' }, + { page: 'dashboard', selector: '#metadata-source-service-card', title: 'Metadata Source', description: 'Shows your metadata source connection (Spotify, iTunes, or Deezer). This determines where album, artist, and track info comes from. Click "Test Connection" to verify.' }, { page: 'dashboard', selector: '#media-server-service-card', title: 'Media Server', description: 'Your media server (Plex, Jellyfin, or Navidrome). This is where your music library lives. SoulSync reads your collection and sends downloads here.' }, { page: 'dashboard', selector: '#soulseek-service-card', title: 'Download Source', description: 'Your primary download source status. In hybrid mode, shows the first source in your priority chain.' }, @@ -4336,7 +4336,7 @@ function _updateHelperBadge() { const TROUBLESHOOT_RULES = [ { - selector: '#spotify-service-card .status-dot.disconnected, #spotify-service-card .status-dot.error', + selector: '#metadata-source-service-card .service-card-indicator.disconnected, #metadata-source-service-card .service-card-indicator.error', title: 'Metadata Source Disconnected', steps: [ 'Go to Settings → Connections and verify your API credentials', @@ -4347,7 +4347,7 @@ const TROUBLESHOOT_RULES = [ action: { label: 'Open Settings', fn: () => navigateToPage('settings') } }, { - selector: '#media-server-service-card .status-dot.disconnected, #media-server-service-card .status-dot.error', + selector: '#media-server-service-card .service-card-indicator.disconnected, #media-server-service-card .service-card-indicator.error', title: 'Media Server Disconnected', steps: [ 'Check that your media server (Plex/Jellyfin/Navidrome) is running', @@ -4358,7 +4358,7 @@ const TROUBLESHOOT_RULES = [ action: { label: 'Open Settings', fn: () => navigateToPage('settings') } }, { - selector: '#soulseek-service-card .status-dot.disconnected, #soulseek-service-card .status-dot.error', + selector: '#soulseek-service-card .service-card-indicator.disconnected, #soulseek-service-card .service-card-indicator.error', title: 'Download Source Disconnected', steps: [ 'Verify your Soulseek/download client is running and reachable', diff --git a/webui/static/shared-helpers.js b/webui/static/shared-helpers.js index 0dc1b086..8b8e7388 100644 --- a/webui/static/shared-helpers.js +++ b/webui/static/shared-helpers.js @@ -3156,12 +3156,12 @@ async function fetchAndUpdateServiceStatus() { } // Update service status indicators and text (dashboard) - updateServiceStatus('spotify', data.metadata_source, data.spotify); + updateServiceStatus('metadata-source', data.metadata_source, data.spotify); updateServiceStatus('media-server', data.media_server); updateServiceStatus('soulseek', data.soulseek); // Update sidebar service status indicators - updateSidebarServiceStatus('spotify', data.metadata_source, data.spotify); + updateSidebarServiceStatus('metadata-source', data.metadata_source, data.spotify); updateSidebarServiceStatus('media-server', data.media_server); updateSidebarServiceStatus('soulseek', data.soulseek); @@ -3286,7 +3286,7 @@ function updateServiceStatus(service, statusData, spotifyStatus = null) { const statusText = document.getElementById(`${service}-status-text`); if (indicator && statusText) { - if (service === 'spotify') { + if (service === 'metadata-source') { const presentation = getMetadataSourcePresentation(statusData || {}, spotifyStatus || {}); indicator.className = `service-card-indicator ${presentation.statusClass}`; statusText.textContent = presentation.statusText; @@ -3305,8 +3305,8 @@ function updateServiceStatus(service, statusData, spotifyStatus = null) { } // Update music source title based on active source - if (service === 'spotify' && statusData.source) { - const musicSourceTitleElement = document.getElementById('music-source-title'); + if (service === 'metadata-source' && statusData.source) { + const musicSourceTitleElement = document.getElementById('metadata-source-title'); if (musicSourceTitleElement) { const sourceName = getMetadataSourceLabel(statusData.source); musicSourceTitleElement.textContent = sourceName; @@ -3326,7 +3326,7 @@ function updateServiceStatus(service, statusData, spotifyStatus = null) { syncPrimaryMetadataSourceAvailability(spotifyStatus); - const responseTimeElement = document.getElementById('spotify-response-time'); + const responseTimeElement = document.getElementById('metadata-source-response-time'); if (responseTimeElement) { const responseTime = statusData.response_time; responseTimeElement.textContent = responseTime !== undefined && responseTime !== null @@ -3334,7 +3334,7 @@ function updateServiceStatus(service, statusData, spotifyStatus = null) { : 'Response: --'; } - const testButton = document.querySelector('#spotify-service-card .service-card-button'); + const testButton = document.querySelector('#metadata-source-service-card .service-card-button'); if (testButton) { const source = statusData.source || 'spotify'; testButton.setAttribute('onclick', `testDashboardConnection('${source}')`); @@ -3357,7 +3357,7 @@ function updateSidebarServiceStatus(service, statusData, spotifyStatus = null) { const nameElement = indicator.querySelector('.status-name'); if (dot) { - if (service === 'spotify') { + if (service === 'metadata-source') { const presentation = getMetadataSourcePresentation(statusData || {}, spotifyStatus || {}); dot.className = `status-dot ${presentation.dotClass}`; dot.title = presentation.dotTitle; @@ -3377,8 +3377,8 @@ function updateSidebarServiceStatus(service, statusData, spotifyStatus = null) { } // Update music source name in sidebar based on active source - if (service === 'spotify' && statusData.source) { - const musicSourceNameElement = document.getElementById('music-source-name'); + if (service === 'metadata-source' && statusData.source) { + const musicSourceNameElement = document.getElementById('metadata-source-name'); if (musicSourceNameElement) { const sourceName = getMetadataSourceLabel(statusData.source); musicSourceNameElement.textContent = sourceName;