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

Fix wishlist button intermittently not navigating to page

Browse source 
The active-process check could hang or return stale data, making the
button feel unresponsive. Added 2-second timeout with AbortController,
fast path for already-visible client process, and graceful fallback to
navigateToPage on rehydration failure or timeout.
This commit is contained in:
Broque Thomas 2026-04-16 15:39:19 -07:00
parent baed8ed8b6
commit cd157fc692
1 changed files with 19 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
webui/static/script.js
View file

@ -2820,34 +2820,39 @@ function initializeWatchlist() {
watchlistButton.addEventListener('click', () => navigateToPage('watchlist')); watchlistButton.addEventListener('click', () => navigateToPage('watchlist'));
} }
// Wishlist button: check for active download process first, otherwise navigate to page // Wishlist button: quick check for active download, otherwise navigate to page
const wishlistButton = document.getElementById('wishlist-button'); const wishlistButton = document.getElementById('wishlist-button');
if (wishlistButton) { if (wishlistButton) {
wishlistButton.addEventListener('click', async () => { wishlistButton.addEventListener('click', async () => {
// Fast path: check if we already know about an active wishlist process
const clientProcess = activeDownloadProcesses['wishlist'];
if (clientProcess && clientProcess.modalElement && document.body.contains(clientProcess.modalElement)) {
clientProcess.modalElement.style.display = 'flex';
WishlistModalState.setVisible();
return;
}
// Slow path: ask the server (with timeout to prevent button feeling dead)
try { try {
const resp = await fetch('/api/active-processes'); const controller = new AbortController();
const timeout = setTimeout(() => controller.abort(), 2000);
const resp = await fetch('/api/active-processes', { signal: controller.signal });
clearTimeout(timeout);
if (resp.ok) { if (resp.ok) {
const data = await resp.json(); const data = await resp.json();
const serverProcess = (data.active_processes || []).find(p => p.playlist_id === 'wishlist'); const serverProcess = (data.active_processes || []).find(p => p.playlist_id === 'wishlist');
if (serverProcess) { if (serverProcess) {
// Active wishlist download — show the download progress modal try {
WishlistModalState.clearUserClosed(); WishlistModalState.clearUserClosed();
const clientProcess = activeDownloadProcesses['wishlist'];
const needsRehydration = !clientProcess ||
clientProcess.batchId !== serverProcess.batch_id ||
!clientProcess.modalElement ||
!document.body.contains(clientProcess.modalElement);
if (needsRehydration) {
await rehydrateModal(serverProcess, true); await rehydrateModal(serverProcess, true);
} else { } catch (e) {
clientProcess.modalElement.style.display = 'flex'; console.debug('Rehydration failed, navigating to page:', e);
WishlistModalState.setVisible(); navigateToPage('wishlist');
} }
return; return;
} }
} }
} catch (e) { } catch (e) {
console.debug('Could not check active processes:', e); // Timeout or network error — just navigate
} }
navigateToPage('wishlist'); navigateToPage('wishlist');
}); });