diff --git a/webui/src/routes/import/-ui/import-page.module.css b/webui/src/routes/import/-ui/import-page.module.css
index 2f7e71b9..db15a907 100644
--- a/webui/src/routes/import/-ui/import-page.module.css
+++ b/webui/src/routes/import/-ui/import-page.module.css
@@ -969,19 +969,12 @@
color: #ef4444;
}
-/* ========================================
- END IMPORT PAGE
- .importPageFileChip {
- cursor: pointer;
- }
-
- .importPageMatchRow {
- cursor: pointer;
- }
-}
-
-/* Import Page — small screen */
@media (max-width: 768px) {
+ .importPageFileChip,
+ .importPageMatchRow {
+ cursor: pointer;
+ }
+
.importPageContainer {
padding: 16px;
}
diff --git a/webui/static/init.js b/webui/static/init.js
index 6b760b0c..10a047b4 100644
--- a/webui/static/init.js
+++ b/webui/static/init.js
@@ -2420,9 +2420,6 @@ async function loadPageData(pageId) {
loadApiKeys();
loadBlacklistCount();
break;
- case 'import':
- initializeImportPage();
- break;
case 'hydrabase':
// Check connection status and pre-fill saved credentials
try {
diff --git a/webui/static/mobile.css b/webui/static/mobile.css
index 043ea773..bd81ae64 100644
--- a/webui/static/mobile.css
+++ b/webui/static/mobile.css
@@ -2312,86 +2312,9 @@
opacity: 0.7;
transition: opacity 0.1s ease;
}
-
- /* Import Page - Touch fallback */
- .import-page-file-chip {
- cursor: pointer;
- }
-
- .import-page-match-row {
- cursor: pointer;
- }
}
-/* Import Page — small screen */
@media (max-width: 768px) {
- .import-page-container {
- padding: 16px;
- }
-
- .import-page-title {
- font-size: 22px;
- }
-
- .import-page-album-grid {
- grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
- gap: 10px;
- }
-
- .import-page-album-hero {
- flex-direction: column;
- text-align: center;
- }
-
- .import-page-album-hero img {
- width: 100px;
- height: 100px;
- }
-
- .import-page-match-row {
- grid-template-columns: 28px 1fr;
- gap: 8px;
- }
-
- .import-page-match-file {
- grid-column: 1 / -1;
- padding-left: 28px;
- }
-
- .import-page-match-unmatch {
- grid-column: 1 / -1;
- justify-self: end;
- }
-
- .import-page-singles-header {
- flex-direction: column;
- align-items: flex-start;
- }
-
- .import-page-singles-actions {
- width: 100%;
- flex-wrap: wrap;
- }
-
- .import-page-single-item {
- grid-template-columns: 28px 1fr;
- }
-
- .import-page-single-actions {
- grid-column: 1 / -1;
- justify-self: end;
- }
-
- .import-page-single-search-panel {
- padding-left: 0;
- }
-
- .import-page-staging-bar {
- flex-direction: column;
- gap: 4px;
- align-items: flex-start;
- }
-
/* Profile Picker - Mobile */
.profile-picker-grid {
gap: 20px;
diff --git a/webui/static/stats-automations.js b/webui/static/stats-automations.js
index 68772b35..9723c549 100644
--- a/webui/static/stats-automations.js
+++ b/webui/static/stats-automations.js
@@ -1,1377 +1,3 @@
-// IMPORT PAGE (full page, replaces old modal)
-// ===================================================================
-
-let importJobIdCounter = 0;
-
-const importPageState = {
- stagingFiles: [],
- selectedSingles: new Set(),
- albumData: null, // response from /api/import/album/match
- matchOverrides: {}, // { trackIndex: stagingFileIndex } — manual drag-drop overrides
- singlesManualMatches: {}, // { stagingFileIndex: { id, name, artist, album, ... } }
- initialized: false,
- activeTab: 'album',
- tapSelectedChip: null, // for mobile tap-to-assign fallback
- // Album lookup cache for click handlers. Populated by suggestions /
- // search renderers; read by importPageSelectAlbum so the match POST
- // can include `source` + `name` + `artist` (without these, backend
- // can't look up cross-source IDs and falls back to a broken
- // "Unknown Artist / album_id as title / 0 tracks" placeholder —
- // github issue #524).
- _albumLookup: {}, // { albumId: { id, name, artist, source } }
-};
-
-// --- Initialization ---
-
-function initializeImportPage() {
- if (!importPageState.initialized) {
- importPageState.initialized = true;
- importPageRefreshStaging();
- importPageLoadAutoGroups();
- importPageLoadSuggestions();
- }
-}
-
-async function importPageRefreshStaging() {
- // Clear finished jobs from the queue
- importPageClearFinishedJobs();
-
- try {
- const resp = await fetch('/api/import/staging/files');
- const data = await resp.json();
- if (!data.success) {
- document.getElementById('import-page-staging-path').textContent = `Import folder: error`;
- return;
- }
-
- importPageState.stagingFiles = data.files || [];
- document.getElementById('import-page-staging-path').textContent = `Import: ${data.staging_path || 'Not configured'}`;
-
- const totalSize = importPageState.stagingFiles.reduce((s, f) => s + (f.size || 0), 0);
- const sizeStr = totalSize > 1073741824 ? `${(totalSize / 1073741824).toFixed(1)} GB`
- : totalSize > 1048576 ? `${(totalSize / 1048576).toFixed(0)} MB`
- : `${(totalSize / 1024).toFixed(0)} KB`;
- document.getElementById('import-page-staging-stats').textContent =
- `${importPageState.stagingFiles.length} file${importPageState.stagingFiles.length !== 1 ? 's' : ''}${totalSize ? ' · ' + sizeStr : ''}`;
-
- // Refresh the current tab view after data is loaded
- if (importPageState.activeTab === 'singles') {
- importPageRenderSinglesList();
- } else if (importPageState.activeTab === 'album') {
- importPageLoadAutoGroups();
- }
- // Always refresh suggestions and groups in background
- importPageLoadSuggestions();
- } catch (err) {
- console.error('Failed to refresh staging:', err);
- }
-}
-
-function importPageSwitchTab(tab) {
- importPageState.activeTab = tab;
- document.getElementById('import-page-tab-album').classList.toggle('active', tab === 'album');
- document.getElementById('import-page-tab-singles').classList.toggle('active', tab === 'singles');
- document.getElementById('import-page-tab-auto')?.classList.toggle('active', tab === 'auto');
- document.getElementById('import-page-album-content').classList.toggle('active', tab === 'album');
- document.getElementById('import-page-singles-content')?.classList.toggle('active', tab === 'singles');
- document.getElementById('import-page-auto-content')?.classList.toggle('active', tab === 'auto');
-
- if (tab === 'singles' && importPageState.stagingFiles.length > 0) {
- importPageRenderSinglesList();
- }
- if (tab === 'auto') {
- _autoImportLoadStatus();
- _autoImportLoadResults();
- _autoImportStartPolling();
- } else {
- _autoImportStopPolling();
- }
-}
-
-// ── Auto-Import Tab ──
-let _autoImportPollInterval = null;
-let _autoImportFilter = 'all';
-let _autoImportLastStatus = null;
-
-function _autoImportStartPolling() {
- _autoImportStopPolling();
- _autoImportPollInterval = setInterval(async () => {
- if (importPageState.activeTab === 'auto') {
- await _autoImportLoadStatus();
- _autoImportLoadResults();
- }
- }, 5000);
-}
-
-function _autoImportStopPolling() {
- if (_autoImportPollInterval) { clearInterval(_autoImportPollInterval); _autoImportPollInterval = null; }
-}
-
-async function _autoImportToggle(enabled) {
- // Optimistically update toggle state so it doesn't flicker
- const toggle = document.getElementById('auto-import-enabled');
- if (toggle) toggle.checked = enabled;
- const statusText = document.getElementById('auto-import-status-text');
- if (statusText) statusText.textContent = enabled ? 'Starting...' : 'Stopping...';
-
- try {
- const res = await fetch('/api/auto-import/toggle', {
- method: 'POST', headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ enabled })
- });
- const data = await res.json();
- if (data.success) {
- showToast(enabled ? 'Auto-import enabled' : 'Auto-import disabled', 'success');
- _autoImportLoadStatus();
- } else {
- // Revert on failure
- if (toggle) toggle.checked = !enabled;
- }
- } catch (e) {
- showToast('Error: ' + e.message, 'error');
- if (toggle) toggle.checked = !enabled;
- }
-}
-
-async function _autoImportLoadStatus() {
- try {
- const res = await fetch('/api/auto-import/status');
- const data = await res.json();
- if (!data.success) return;
- _autoImportLastStatus = data;
-
- const toggle = document.getElementById('auto-import-enabled');
- const statusText = document.getElementById('auto-import-status-text');
- const settingsRow = document.getElementById('auto-import-settings-row');
- const scanNowBtn = document.getElementById('auto-import-scan-now');
- const progressEl = document.getElementById('auto-import-progress');
- const progressText = document.getElementById('auto-import-progress-text');
-
- if (toggle) toggle.checked = data.running;
- if (settingsRow) settingsRow.style.display = data.running ? '' : 'none';
- if (scanNowBtn) scanNowBtn.style.display = data.running ? '' : 'none';
-
- // Live scan + per-track processing progress.
- // `active_imports` (added when the worker switched to a bounded
- // executor pool) is the source of truth; multiple albums can be
- // in flight at once. Render each one on its own line; fall back
- // to the legacy single-line summary for older backend payloads.
- if (progressEl) {
- const active = Array.isArray(data.active_imports) ? data.active_imports : [];
- if (active.length > 0) {
- progressEl.style.display = '';
- if (progressText) {
- const lines = active.map(a => {
- const folder = a.folder_name || '...';
- const idx = a.track_index || 0;
- const total = a.track_total || 0;
- const trackName = a.track_name || '';
- if (a.status === 'processing' && total > 0) {
- return `${folder} — track ${idx}/${total}: ${trackName}`;
- }
- if (a.status === 'matching') return `${folder} — matching tracks…`;
- if (a.status === 'identifying') return `${folder} — identifying…`;
- return `${folder} — queued`;
- });
- progressText.textContent = lines.length === 1
- ? `Processing ${lines[0]}`
- : `Processing ${lines.length} imports:\n${lines.join('\n')}`;
- }
- } else if (data.current_status === 'scanning') {
- progressEl.style.display = '';
- if (progressText) {
- const stats = data.stats || {};
- progressText.textContent = `Scanning… (${stats.scanned || 0} processed)`;
- }
- } else {
- progressEl.style.display = 'none';
- }
- }
-
- if (statusText) {
- if (data.paused) statusText.textContent = 'Paused';
- else if (data.current_status === 'processing') statusText.textContent = 'Processing...';
- else if (data.current_status === 'scanning') statusText.textContent = 'Scanning...';
- else if (data.running) {
- // Show last scan time
- let watchText = 'Watching';
- if (data.last_scan_time) {
- try {
- const lastScan = new Date(data.last_scan_time);
- const diffS = Math.floor((Date.now() - lastScan) / 1000);
- if (diffS < 60) watchText = `Watching (scanned ${diffS}s ago)`;
- else if (diffS < 3600) watchText = `Watching (scanned ${Math.floor(diffS / 60)}m ago)`;
- } catch (e) {}
- }
- statusText.textContent = watchText;
- } else statusText.textContent = 'Disabled';
- const _runningClass = data.current_status === 'scanning'
- ? 'scanning'
- : data.current_status === 'processing'
- ? 'processing'
- : 'active';
- statusText.className = 'auto-import-status ' + (data.running ? _runningClass : 'disabled');
- }
- } catch (e) {}
-}
-
-async function _autoImportLoadResults() {
- const container = document.getElementById('auto-import-results');
- if (!container) return;
- try {
- const res = await fetch('/api/auto-import/results?limit=100');
- const data = await res.json();
- if (!data.success || !data.results || data.results.length === 0) {
- if (!container.querySelector('.auto-import-card')) {
- container.innerHTML = `
-
No imports yet. Drop album folders or single tracks into your import folder.
-
-
-
-
`;
- }
-
- // Expanded track list (hidden by default)
- let trackListHtml = '';
- if (trackDetails.length > 0) {
- trackListHtml = `
-
- ${trackDetails.map((t, tIdx) => {
- const tConfClass = t.confidence >= 90 ? 'high' : t.confidence >= 70 ? 'medium' : 'low';
- // 1-based liveTrackIdx — current row glows, prior rows dim as "done".
- let rowState = '';
- if (isLiveProcessing && liveTrackIdx > 0) {
- if (tIdx + 1 === liveTrackIdx) rowState = ' auto-import-track-row-active';
- else if (tIdx + 1 < liveTrackIdx) rowState = ' auto-import-track-row-done';
- }
- return `
- ${escapeHtml(t.name)}
- ${escapeHtml(t.file)}
- ${t.confidence}%
-
`;
- }).join('')}
-
-
-
- ${r.image_url ? `
\uD83D\uDCBF
` : `
\uD83D\uDCBF
`}
-
-
-
${escapeHtml(r.album_name || r.folder_name)}
-
${escapeHtml(r.artist_name || 'Unknown Artist')}
-
- ${matchSummary}
- ${methodLabel ? `${methodLabel}` : ''}
- ${timeAgo ? `${timeAgo}` : ''}
-
- ${r.error_message ? `
${escapeHtml(r.error_message)}
` : ''}
-
-
-
${statusIcon} ${statusLabel}
-
-
${confPct}% confidence
- ${actions}
-
-
-
${escapeHtml(r.folder_name)}
- ${trackListHtml}
-
- Auto-Detected Albums
-
-
- ${data.groups.map((g, idx) => `
-
-
- ${g.file_count}
-
-
-
${_esc(g.album)}
-
${_esc(g.artist)} · ${g.file_count} tracks
-
-
- `).join('')}
-
Searching...
';
-
- try {
- const resp = await fetch(`/api/import/search/albums?q=${encodeURIComponent(query)}&limit=12`);
- const data = await resp.json();
-
- if (data.success && data.albums && data.albums.length > 0) {
- // Store file_paths filter so match only includes this group's files
- importPageState._autoGroupFilePaths = group.file_paths;
-
- // Render results — user picks the right album
- const banner = _renderImportFallbackBanner(data.albums, data.primary_source);
- grid.innerHTML = banner + data.albums.map(a => _renderSuggestionCard(a, data.primary_source)).join('');
- } else {
- grid.innerHTML = 'No albums found — try searching manually
';
- }
- } catch (err) {
- console.error('Auto-group search failed:', err);
- if (grid) grid.innerHTML = 'Search failed
';
- }
-}
-
-// --- Album Tab: Suggestions (server-side cache, just fetch and render) ---
-
-async function importPageLoadSuggestions() {
- const section = document.getElementById('import-page-suggestions');
- const grid = document.getElementById('import-page-suggestions-grid');
- if (!section || !grid) return;
-
- try {
- const resp = await fetch('/api/import/staging/suggestions');
- if (!resp.ok) return;
- const data = await resp.json();
-
- if (!data.success || !data.suggestions || data.suggestions.length === 0) {
- if (!data.ready) {
- // Server is still building cache — show placeholder, retry shortly
- section.style.display = '';
- grid.innerHTML = 'Loading suggestions...
';
- setTimeout(() => importPageLoadSuggestions(), 3000);
- } else {
- section.style.display = 'none';
- grid.innerHTML = '';
- }
- return;
- }
-
- section.style.display = '';
- const banner = _renderImportFallbackBanner(data.suggestions, data.primary_source);
- grid.innerHTML = banner + data.suggestions.map(a => _renderSuggestionCard(a, data.primary_source)).join('');
- } catch (err) {
- // Network error or server not ready — fail silently
- console.warn('Failed to load import suggestions:', err);
- }
-}
-
-function _renderSuggestionCard(a, primarySource) {
- // Cache the album lookup so importPageSelectAlbum can pull source +
- // name + artist on click (the onclick can only carry the ID string
- // — see github issue #524 root cause).
- importPageState._albumLookup[a.id] = {
- id: a.id, name: a.name || '', artist: a.artist || '', source: a.source || '',
- };
- // Surface the served source when it differs from the user's configured
- // primary — the search route silently falls through to the next source
- // in METADATA_SOURCE_PRIORITY when the primary returns nothing
- // (intentional design, see core/auto_import_worker.py:1316). Without
- // this badge the user has no idea their MusicBrainz / Discogs choice
- // got bypassed (github issue #681).
- const sourceBadge = (a.source && primarySource && a.source !== primarySource)
- ? `via ${_esc((SOURCE_LABELS[a.source] || {}).text || a.source)}
`
- : '';
- const metaParts = [
- `${a.total_tracks || 0} tracks`,
- a.release_date ? a.release_date.substring(0, 4) : '',
- a.format || '',
- a.country || '',
- a.disambiguation || '',
- ].filter(Boolean);
- const details = [a.status || '', a.label || ''].filter(Boolean);
- const detailsLine = details.length
- ? `${_esc(details.join(' · '))}
`
- : '';
- return `
-
-
${_esc(a.name)}
-
${_esc(a.artist)}
-
${_esc(metaParts.join(' · '))}
- ${detailsLine}
- ${sourceBadge}
-
Showing ${_esc(servedLabel)} results — not from your primary source (${_esc(primaryLabel)}).
`;
-}
-
-// --- Album Tab: Search ---
-
-async function importPageSearchAlbum() {
- const query = document.getElementById('import-page-album-search-input').value.trim();
- if (!query) return;
-
- document.getElementById('import-page-suggestions').style.display = 'none';
- const groupsEl = document.getElementById('import-page-auto-groups');
- if (groupsEl) groupsEl.style.display = 'none';
- const grid = document.getElementById('import-page-album-results');
- grid.innerHTML = 'Searching...
';
-
- try {
- const resp = await fetch(`/api/import/search/albums?q=${encodeURIComponent(query)}&limit=12`);
- const data = await resp.json();
- if (!data.success || !data.albums.length) {
- grid.innerHTML = 'No albums found
';
- return;
- }
- const banner = _renderImportFallbackBanner(data.albums, data.primary_source);
- grid.innerHTML = banner + data.albums.map(a => _renderSuggestionCard(a, data.primary_source)).join('');
- document.getElementById('import-page-album-clear-btn').classList.remove('hidden');
- } catch (err) {
- grid.innerHTML = `Error: ${err.message}
`;
- }
-}
-
-// --- Album Tab: Select Album & Match ---
-
-async function importPageSelectAlbum(albumId) {
- document.getElementById('import-page-album-search-section').classList.add('hidden');
- document.getElementById('import-page-album-match-section').classList.remove('hidden');
-
- const matchList = document.getElementById('import-page-match-list');
- matchList.innerHTML = 'Matching files to tracklist...
';
-
- try {
- // Include file_paths filter if matching from an auto-group.
- // CRITICAL: include source + album_name + album_artist from the
- // search/suggestion result. Without `source`, the backend can't
- // route the lookup to the metadata source the album_id came
- // from — for example a Deezer album_id needs Deezer's get_album
- // call. Cross-source lookup fails silently, returns the
- // failure-fallback dict with album_id-as-name + Unknown Artist
- // + 0 tracks, then the import flow writes that broken metadata
- // to the library DB (github issue #524).
- const cached = importPageState._albumLookup[albumId] || {};
- const matchBody = {
- album_id: albumId,
- source: cached.source || '',
- album_name: cached.name || '',
- album_artist: cached.artist || '',
- };
- if (importPageState._autoGroupFilePaths) {
- matchBody.file_paths = importPageState._autoGroupFilePaths;
- importPageState._autoGroupFilePaths = null; // clear after use
- }
- const resp = await fetch('/api/import/album/match', {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify(matchBody)
- });
- const data = await resp.json();
- if (!data.success) {
- matchList.innerHTML = `Error: ${data.error}
`;
- return;
- }
-
- importPageState.albumData = data;
- importPageState.matchOverrides = {};
-
- // Render hero
- const album = data.album;
- const heroMetaParts = [
- `${album.total_tracks || 0} tracks`,
- album.release_date ? album.release_date.substring(0, 4) : '',
- album.format || '',
- album.country || '',
- album.disambiguation || '',
- ].filter(Boolean);
- document.getElementById('import-page-album-hero').innerHTML = `
- 
-
-
${_esc(album.name)}
-
${_esc(album.artist)}
-
${_esc(heroMetaParts.join(' · '))}
-
Error: ${err.message}
`;
- }
-}
-
-function importPageRenderMatchList() {
- const data = importPageState.albumData;
- if (!data) return;
-
- const matchList = document.getElementById('import-page-match-list');
- const overrides = importPageState.matchOverrides;
-
- // Build effective matches: auto-match overridden by manual overrides
- // Also track which staging files are used (auto or override)
- const usedStagingFiles = new Set();
-
- // First pass: collect overridden indices
- Object.values(overrides).forEach(sfIdx => usedStagingFiles.add(sfIdx));
-
- // Build rows
- let matchedCount = 0;
- const rows = data.matches.map((m, idx) => {
- const trackInfo = _importPageGetTrackDisplayInfo(m, idx);
- let file = null;
- let confidence = m.confidence;
- let isOverride = false;
-
- if (overrides.hasOwnProperty(idx)) {
- const sfIdx = overrides[idx];
- if (sfIdx === -1) {
- // Forcibly unmatched — no file
- file = null;
- } else {
- // Manual override
- file = importPageState.stagingFiles[sfIdx] || null;
- confidence = 1.0;
- isOverride = true;
- usedStagingFiles.add(sfIdx);
- }
- } else if (m.staging_file) {
- file = m.staging_file;
- // Check if this file was reassigned to another track via override
- const autoFileName = m.staging_file.filename;
- const reassigned = Object.entries(overrides).some(([tIdx, sfIdx]) => {
- const sf = importPageState.stagingFiles[sfIdx];
- return sf && sf.filename === autoFileName && parseInt(tIdx) !== idx;
- });
- if (!reassigned) {
- usedStagingFiles.add(-1); // placeholder — auto-matched file
- } else {
- file = null; // file was reassigned elsewhere
- }
- }
-
- if (file) matchedCount++;
- const confPercent = Math.round(confidence * 100);
- const confClass = confidence >= 0.7 ? '' : 'low';
-
- return `
-
- ${trackInfo.displayTrackNumber}
- ${_esc(trackInfo.name)}
-
- ${file
- ? `${_esc(file.filename)}
- ${confPercent}%`
- : `Drop a file here`}
-
- ${file ? `` : ''}
-
- `;
- });
-
- matchList.innerHTML = rows.join('');
-
- // Unmatched file pool
- const unmatchedFiles = [];
- importPageState.stagingFiles.forEach((f, i) => {
- // Check if used by override
- if (Object.values(overrides).includes(i)) return;
- // Check if used by auto-match (not overridden away)
- const autoUsed = data.matches.some((m, mIdx) => {
- if (overrides.hasOwnProperty(mIdx)) return false;
- return m.staging_file && m.staging_file.filename === f.filename;
- });
- if (autoUsed) return;
- unmatchedFiles.push({ file: f, index: i });
- });
-
- const poolChips = document.getElementById('import-page-pool-chips');
- document.getElementById('import-page-unmatched-count').textContent = unmatchedFiles.length;
-
- if (unmatchedFiles.length === 0) {
- poolChips.innerHTML = 'All files matched';
- } else {
- poolChips.innerHTML = unmatchedFiles.map(({ file, index }) => `
-
- ${_esc(file.filename)}
-
- `).join('');
- }
-
- // Stats & button
- document.getElementById('import-page-match-stats').textContent = `${matchedCount} of ${data.matches.length} tracks matched`;
- const processBtn = document.getElementById('import-page-album-process-btn');
- processBtn.disabled = matchedCount === 0;
- processBtn.textContent = `Process ${matchedCount} Track${matchedCount !== 1 ? 's' : ''}`;
-}
-
-function _importPageGetTrackDisplayInfo(item, index) {
- const track = item?.track || item?.spotify_track || {};
- const rawTrackNumber = track.track_number ?? track.trackNumber ?? null;
- const trackNumber = rawTrackNumber === null || rawTrackNumber === undefined || rawTrackNumber === ''
- ? null
- : String(rawTrackNumber).split('/')[0].trim();
-
- return {
- track,
- name: track.name || track.title || `Track ${index + 1}`,
- trackNumber,
- displayTrackNumber: trackNumber || String(index + 1),
- };
-}
-
-// --- Album Tab: Drag and Drop ---
-
-function importPageStartDrag(event, stagingFileIndex) {
- event.dataTransfer.setData('text/plain', stagingFileIndex.toString());
- event.dataTransfer.effectAllowed = 'move';
-}
-
-function importPageHandleDragOver(event) {
- event.preventDefault();
- event.dataTransfer.dropEffect = 'move';
- event.currentTarget.classList.add('drag-over');
- // Remove drag-over from others
- document.querySelectorAll('.import-page-match-row.drag-over').forEach(el => {
- if (el !== event.currentTarget) el.classList.remove('drag-over');
- });
-}
-
-function importPageHandleDrop(event, trackIndex) {
- event.preventDefault();
- event.currentTarget.classList.remove('drag-over');
- const stagingFileIndex = parseInt(event.dataTransfer.getData('text/plain'));
- if (isNaN(stagingFileIndex)) return;
-
- // Remove this staging file from any other track it was assigned to
- Object.keys(importPageState.matchOverrides).forEach(k => {
- if (importPageState.matchOverrides[k] === stagingFileIndex) {
- delete importPageState.matchOverrides[k];
- }
- });
-
- importPageState.matchOverrides[trackIndex] = stagingFileIndex;
- importPageState.tapSelectedChip = null;
- importPageRenderMatchList();
-}
-
-// Mobile tap-to-assign fallback
-function importPageTapSelectChip(stagingFileIndex) {
- if (importPageState.tapSelectedChip === stagingFileIndex) {
- importPageState.tapSelectedChip = null;
- } else {
- importPageState.tapSelectedChip = stagingFileIndex;
- }
- importPageRenderMatchList();
-}
-
-function importPageTapAssign(trackIndex) {
- if (importPageState.tapSelectedChip === null) return;
- const stagingFileIndex = importPageState.tapSelectedChip;
-
- // Remove from any other track
- Object.keys(importPageState.matchOverrides).forEach(k => {
- if (importPageState.matchOverrides[k] === stagingFileIndex) {
- delete importPageState.matchOverrides[k];
- }
- });
-
- importPageState.matchOverrides[trackIndex] = stagingFileIndex;
- importPageState.tapSelectedChip = null;
- importPageRenderMatchList();
-}
-
-function importPageUnmatchTrack(trackIndex) {
- delete importPageState.matchOverrides[trackIndex];
- // Also remove auto-match by setting override to -1 special value? No — just delete override and let auto-match stay.
- // Actually, to truly unmatch: we need to suppress the auto-match too.
- // We'll use a sentinel: override = -1 means "forcibly unmatched"
- const m = importPageState.albumData?.matches[trackIndex];
- if (m && m.staging_file) {
- importPageState.matchOverrides[trackIndex] = -1; // sentinel: force no match
- }
- importPageRenderMatchList();
-}
-
-function importPageAutoRematch() {
- importPageState.matchOverrides = {};
- importPageState.tapSelectedChip = null;
- importPageRenderMatchList();
-}
-
-// --- Album Tab: Process ---
-
-function importPageProcessAlbum() {
- const data = importPageState.albumData;
- if (!data) return;
-
- // Build effective matches with overrides applied
- const overrides = importPageState.matchOverrides;
- const effectiveMatches = [];
- data.matches.forEach((m, idx) => {
- if (overrides.hasOwnProperty(idx)) {
- if (overrides[idx] === -1) return; // forcibly unmatched — skip
- const sf = importPageState.stagingFiles[overrides[idx]];
- effectiveMatches.push({ ...m, staging_file: sf, confidence: 1.0 });
- } else if (m.staging_file !== null) {
- effectiveMatches.push(m);
- }
- });
-
- if (effectiveMatches.length === 0) return;
-
- // Add to queue and reset search immediately so user can queue more
- const album = data.album;
- _importQueueAdd({
- type: 'album',
- label: album.name,
- sublabel: `${album.artist} · ${effectiveMatches.length} tracks`,
- imageUrl: album.image_url,
- items: effectiveMatches,
- albumData: album,
- });
-
- importPageResetAlbumSearch();
-}
-
-function importPageResetAlbumSearch() {
- importPageState.albumData = null;
- importPageState.matchOverrides = {};
- importPageState.tapSelectedChip = null;
- importPageState._autoGroupFilePaths = null;
-
- document.getElementById('import-page-album-search-section').classList.remove('hidden');
- document.getElementById('import-page-album-match-section').classList.add('hidden');
-
- // Clear search
- document.getElementById('import-page-album-results').innerHTML = '';
- document.getElementById('import-page-album-search-input').value = '';
- document.getElementById('import-page-album-clear-btn').classList.add('hidden');
-
- // Re-show auto-groups
- const groupsEl = document.getElementById('import-page-auto-groups');
- if (groupsEl) groupsEl.style.display = '';
-
- // Refresh suggestions & staging
- importPageLoadAutoGroups();
- importPageLoadSuggestions();
- importPageRefreshStaging();
-}
-
-// --- Singles Tab ---
-
-function importPageRenderSinglesList() {
- const list = document.getElementById('import-page-singles-list');
- const files = importPageState.stagingFiles;
-
- if (files.length === 0) {
- list.innerHTML = 'No audio files found in import folder
';
- return;
- }
-
- list.innerHTML = files.map((f, i) => {
- const isSelected = importPageState.selectedSingles.has(i);
- const manualMatch = importPageState.singlesManualMatches[i];
- const searchOpen = document.querySelector(`[data-singles-search="${i}"]`);
-
- let html = `
-
-
-
-
${_esc(f.filename)}
-
- ${f.title ? `${_esc(f.title)}` : ''}
- ${f.artist ? `${_esc(f.artist)}` : ''}
- ${f.extension ? `${f.extension}` : ''}
-
- ${manualMatch ? `
-
- ✓ ${_esc(manualMatch.name)} - ${_esc(manualMatch.artist)}
- change
-
- ` : ''}
-
-
-
-
-
-
-
-
-
- `;
- item.appendChild(panel);
-
- // Auto-search
- const input = panel.querySelector('input');
- input.focus();
- if (defaultQuery) {
- importPageSearchSingleTrack(fileIdx, defaultQuery);
- }
-}
-
-async function importPageSearchSingleTrack(fileIdx, query) {
- if (!query || !query.trim()) return;
-
- const resultsDiv = document.getElementById(`import-single-results-${fileIdx}`);
- if (!resultsDiv) return;
- resultsDiv.innerHTML = 'Searching...
';
-
- try {
- const resp = await fetch(`/api/import/search/tracks?q=${encodeURIComponent(query.trim())}&limit=6`);
- const data = await resp.json();
- if (!data.success || !data.tracks.length) {
- resultsDiv.innerHTML = 'No results found
';
- return;
- }
- // Store results in a temp cache so we can reference by index
- window._importSingleSearchResults = window._importSingleSearchResults || {};
- window._importSingleSearchResults[fileIdx] = data.tracks;
-
- resultsDiv.innerHTML = data.tracks.map((t, tIdx) => {
- const dur = t.duration_ms ? `${Math.floor(t.duration_ms / 60000)}:${String(Math.floor((t.duration_ms % 60000) / 1000)).padStart(2, '0')}` : '';
- return `
-
- ${t.image_url ? `
` : ''}
-
-
${_esc(t.name)} - ${_esc(t.artist)}
-
${_esc(t.album)}${dur ? ' · ' + dur : ''}
-
-
-
Error: ${err.message}
`;
- }
-}
-
-function importPageSelectSingleMatch(fileIdx, trackIdx) {
- const trackData = window._importSingleSearchResults?.[fileIdx]?.[trackIdx];
- if (!trackData) return;
- importPageState.singlesManualMatches[fileIdx] = trackData;
-
- // Auto-select this file
- importPageState.selectedSingles.add(fileIdx);
-
- // Close search panel and re-render this item
- importPageRenderSinglesList();
-}
-
-// --- Singles Tab: Process ---
-
-function importPageProcessSingles() {
- if (importPageState.selectedSingles.size === 0) return;
-
- const filesToProcess = Array.from(importPageState.selectedSingles).map(i => {
- const f = importPageState.stagingFiles[i];
- const manualMatch = importPageState.singlesManualMatches[i];
- if (manualMatch) {
- return { ...f, manual_match: manualMatch };
- }
- return f;
- });
-
- // Add to queue and reset immediately
- _importQueueAdd({
- type: 'singles',
- label: `${filesToProcess.length} Single${filesToProcess.length !== 1 ? 's' : ''}`,
- sublabel: filesToProcess.map(f => f.title || f.filename).slice(0, 3).join(', ') + (filesToProcess.length > 3 ? '...' : ''),
- imageUrl: null,
- items: filesToProcess,
- });
-
- importPageState.selectedSingles.clear();
- importPageState.singlesManualMatches = {};
- importPageUpdateSinglesProcessButton();
- importPageRefreshStaging();
-}
-
-// --- Processing Queue ---
-
-const _importQueue = []; // { id, type, label, sublabel, imageUrl, status, processed, total, errors }
-
-function _importQueueAdd(job) {
- const id = ++importJobIdCounter;
- const entry = {
- id,
- type: job.type,
- label: job.label,
- sublabel: job.sublabel,
- imageUrl: job.imageUrl,
- status: 'running', // running | done | error
- processed: 0,
- total: job.items.length,
- errors: [],
- };
- _importQueue.push(entry);
- _importQueueRender();
-
- // Fire and forget — runs in background
- _importQueueRunJob(entry, job);
-}
-
-async function _importQueueRunJob(entry, job) {
- for (let i = 0; i < job.items.length; i++) {
- const itemName = job.type === 'album'
- ? _importPageGetTrackDisplayInfo(job.items[i], i).name
- : (job.items[i].title || job.items[i].filename || `File ${i + 1}`);
-
- // Update status with current track info
- entry.sublabel = `Processing ${i + 1}/${job.items.length}: ${itemName}`;
- _importQueueRender();
-
- try {
- let resp;
- if (job.type === 'album') {
- resp = await fetch('/api/import/album/process', {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({
- album: job.albumData,
- matches: [job.items[i]]
- })
- });
- } else {
- resp = await fetch('/api/import/singles/process', {
- method: 'POST',
- headers: { 'Content-Type': 'application/json' },
- body: JSON.stringify({ files: [job.items[i]] })
- });
- }
-
- if (!resp.ok) throw new Error(`HTTP ${resp.status}`);
- const data = await resp.json();
- if (data.success) entry.processed += (data.processed || 0);
- if (data.errors && data.errors.length > 0) entry.errors.push(...data.errors);
- } catch (err) {
- entry.errors.push(`${itemName}: ${err.message}`);
- }
-
- _importQueueRender();
- }
-
- entry.status = entry.errors.length > 0 && entry.processed === 0 ? 'error' : 'done';
- _importQueueRender();
-
- // Refresh staging and suggestions since files moved
- importPageRefreshStaging();
- importPageLoadSuggestions();
-}
-
-function _importQueueRender() {
- const container = document.getElementById('import-page-queue');
- const list = document.getElementById('import-page-queue-list');
- const clearBtn = document.getElementById('import-page-queue-clear');
- if (!container || !list) return;
-
- if (_importQueue.length === 0) {
- container.classList.add('hidden');
- return;
- }
-
- container.classList.remove('hidden');
-
- // Show clear button only if there are finished jobs
- const hasFinished = _importQueue.some(j => j.status !== 'running');
- clearBtn.style.display = hasFinished ? '' : 'none';
-
- list.innerHTML = _importQueue.map(j => {
- const pct = j.total > 0 ? Math.round((j.processed / j.total) * 100) : 0;
- const fillClass = j.status === 'error' ? 'error' : '';
- let statusText, statusClass;
- if (j.status === 'running') {
- statusText = `${j.processed}/${j.total}`;
- statusClass = '';
- } else if (j.status === 'done') {
- statusText = j.errors.length > 0 ? `${j.processed}/${j.total} (${j.errors.length} err)` : 'Done';
- statusClass = j.errors.length > 0 ? 'error' : 'done';
- } else {
- statusText = 'Failed';
- statusClass = 'error';
- }
-
- return `
-
- ${j.imageUrl
- ? `
`
- : `
♪
`}
-
-
${_esc(j.label)}
-
${_esc(j.sublabel)}
-
-
-