WebUI: fix empty Quality Profile tile — gate whole tile, not inner group

The Quality Profile tile expanded to an empty body: settings.js
updateSourceVisibility toggled only the inner #quality-profile-section
(Soulseek-only + downloads-tab gate), leaving the new collapsible tile's
header/body visible with hidden contents. Wrap the tile in
#quality-profile-tile and gate that wrapper as a unit instead, so the whole
tile shows (Soulseek active) or hides (otherwise) — no empty shell.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
dev 2026-06-05 22:15:04 +02:00
parent 63036a41ee
commit 81291c198b
2 changed files with 12 additions and 5 deletions

View file

@ -4967,7 +4967,11 @@
</div>
<!-- ═══ QUALITY PROFILE ═══ -->
<div class="settings-section-header collapsed" data-stg="downloads" onclick="this.classList.toggle('collapsed'); const b=this.nextElementSibling; b.classList.toggle('collapsed'); b.style.display=b.classList.contains('collapsed')?'none':''">
<!-- Whole tile is gated as a unit (Soulseek-only + downloads tab)
by settings.js updateSourceVisibility — gating only the inner
group would leave an empty expandable shell. -->
<div id="quality-profile-tile" data-stg="downloads">
<div class="settings-section-header collapsed" onclick="this.classList.toggle('collapsed'); const b=this.nextElementSibling; b.classList.toggle('collapsed'); b.style.display=b.classList.contains('collapsed')?'none':''">
<span class="settings-section-arrow">&#9660;</span>
<h3>Quality Profile</h3>
<span class="settings-section-hint">Format priorities, bitrate, bit depth</span>
@ -5156,6 +5160,7 @@
</div>
</div><!-- end Quality Profile body -->
</div><!-- end Quality Profile tile -->
<!-- ═══ RETRY LOGIC ═══ -->
<div class="settings-section-header collapsed" data-stg="downloads" onclick="this.classList.toggle('collapsed'); const b=this.nextElementSibling; b.classList.toggle('collapsed'); b.style.display=b.classList.contains('collapsed')?'none':''">

View file

@ -1711,12 +1711,14 @@ function updateDownloadSourceUI() {
prowlarrRedirect.style.display = showProwlarr ? 'block' : 'none';
}
// Quality profile is Soulseek-only and downloads-tab-only
const qualityProfileSection = document.getElementById('quality-profile-section');
if (qualityProfileSection) {
// Quality profile is Soulseek-only and downloads-tab-only. Gate the whole
// collapsible tile (header + body) — gating just the inner #quality-profile-section
// left the tile header expandable to an empty body.
const qualityProfileTile = document.getElementById('quality-profile-tile');
if (qualityProfileTile) {
const activeTab = document.querySelector('.stg-tab.active');
const onDownloadsTab = activeTab && activeTab.dataset.tab === 'downloads';
qualityProfileSection.style.display = (activeSources.has('soulseek') && onDownloadsTab) ? '' : 'none';
qualityProfileTile.style.display = (activeSources.has('soulseek') && onDownloadsTab) ? '' : 'none';
}
if (activeSources.has('tidal')) {