From 94129d30996e90ae762ac26843f35d1614070e7e Mon Sep 17 00:00:00 2001
From: Broque Thomas <26755000+Nezreka@users.noreply.github.com>
Date: Sat, 23 May 2026 15:15:28 -0700
Subject: [PATCH] Clarify hybrid source album behavior

Add dynamic level badges to the hybrid source order settings. The first enabled source shows Album-level only when it supports album-bundle downloads; every other source shows Track-level to make fallback behavior visible.

Update the helper copy and badge styling so users can understand why putting Soulseek, Torrent, or Usenet first changes album-download behavior.
---
 webui/index.html         |  1 +
 webui/static/settings.js |  9 +++++++++
 webui/static/style.css   | 17 +++++++++++++++++
 3 files changed, 27 insertions(+)

diff --git a/webui/index.html b/webui/index.html
index 7ff29dc5..b22dd056 100644
--- a/webui/index.html
+++ b/webui/index.html
@@ -4372,6 +4372,7 @@
                                 <div id="hybrid-settings-container" style="display: none;">
                                     <div class="setting-help-text">
                                         Drag to reorder source priority. Enable sources you want to use. Downloads try each enabled source in order.
+                                        The first source can use album-level downloads when supported; later sources stay track-level fallback.
                                     </div>
                                     <div class="hybrid-source-list" id="hybrid-source-list">
                                         <!-- Populated by JS -->
diff --git a/webui/static/settings.js b/webui/static/settings.js
index 0d3888c1..7c3a127d 100644
--- a/webui/static/settings.js
+++ b/webui/static/settings.js
@@ -600,6 +600,7 @@ const HYBRID_SOURCES = [
     { id: 'torrent', name: 'Torrent', icon: null, emoji: '🧲' },
     { id: 'usenet', name: 'Usenet', icon: null, emoji: '📰' },
 ];
+const ALBUM_LEVEL_HYBRID_SOURCES = new Set(['soulseek', 'torrent', 'usenet']);
 
 let _hybridSourceOrder = ['soulseek', 'youtube'];
 let _hybridSourceEnabled = { soulseek: true, youtube: true, tidal: false, qobuz: false, hifi: false, deezer_dl: false, amazon: false, lidarr: false, soundcloud: false, torrent: false, usenet: false };
@@ -625,6 +626,13 @@ function buildHybridSourceList() {
         const enabled = _hybridSourceEnabled[srcId] !== false;
         const isInOrder = _hybridSourceOrder.includes(srcId);
         const priorityNum = isInOrder && enabled ? _hybridSourceOrder.indexOf(srcId) + 1 : '';
+        const canOwnAlbum = enabled && priorityNum === 1 && ALBUM_LEVEL_HYBRID_SOURCES.has(srcId);
+        const sourceLevel = canOwnAlbum ? 'Album-level' : 'Track-level';
+        const sourceLevelClass = canOwnAlbum ? 'album' : 'track';
+        const sourceLevelTitle = canOwnAlbum
+            ? 'This first source can download a whole album release before per-track fallback.'
+            : 'This source runs as per-track fallback in the current hybrid order.';
+        const sourceLevelBadge = `<span class="hybrid-source-badge hybrid-source-badge-${sourceLevelClass}" title="${sourceLevelTitle}">${sourceLevel}</span>`;
 
         const item = document.createElement('div');
         item.className = `hybrid-source-item${enabled ? '' : ' disabled'}`;
@@ -641,6 +649,7 @@ function buildHybridSourceList() {
                 : `<span class="hybrid-source-icon emoji-icon">${src.emoji}</span>`
             }
             <span class="hybrid-source-name">${src.name}</span>
+            ${sourceLevelBadge}
             <span class="hybrid-source-priority">${priorityNum}</span>
             <label class="hybrid-source-toggle">
                 <input type="checkbox" ${enabled ? 'checked' : ''} onchange="toggleHybridSource('${srcId}', this.checked)">
diff --git a/webui/static/style.css b/webui/static/style.css
index a6ef10e9..cb2d5bf4 100644
--- a/webui/static/style.css
+++ b/webui/static/style.css
@@ -52933,6 +52933,23 @@ tr.tag-diff-same {
     color: rgba(255, 255, 255, 0.85);
     font-weight: 500;
 }
+.hybrid-source-badge {
+    flex-shrink: 0;
+    font-size: 0.68em;
+    line-height: 1;
+    font-weight: 700;
+    letter-spacing: 0.01em;
+    padding: 4px 7px;
+    border-radius: 6px;
+    border: 1px solid rgba(125, 211, 252, 0.24);
+    background: rgba(125, 211, 252, 0.1);
+    color: #7dd3fc;
+}
+.hybrid-source-badge-track {
+    border-color: rgba(255, 255, 255, 0.12);
+    background: rgba(255, 255, 255, 0.05);
+    color: rgba(255, 255, 255, 0.48);
+}
 .hybrid-source-priority {
     font-size: 0.75em;
     color: rgba(255, 255, 255, 0.3);