diff --git a/apps/web/src/features/uploads/QueueRows.tsx b/apps/web/src/features/uploads/QueueRows.tsx index ba3c16f..ecddbac 100644 --- a/apps/web/src/features/uploads/QueueRows.tsx +++ b/apps/web/src/features/uploads/QueueRows.tsx @@ -36,6 +36,16 @@ export function BatchCard({ const all = ids.every((id) => selected.has(id)); const size = files.reduce((n, f) => n + f.size_bytes, 0); const summary = batchSummary(files); + const metadata = first.metadata; + const albumArtist = metadata?.albumartist || metadata?.artist || ''; + const singleAlbum = releaseGroups.length === 1 ? releaseGroups[0] + : releaseGroups.length === 0 && metadata?.album && files.every((file) => + file.metadata?.album.trim().toLowerCase() === metadata.album.trim().toLowerCase() + && (file.metadata.albumartist || file.metadata.artist || '').trim().toLowerCase() === albumArtist.trim().toLowerCase()) + ? { artist: albumArtist, album: metadata.album } : undefined; + const albumTitle = singleAlbum?.album && singleAlbum.album.trim().toLowerCase() !== 'unknown album' + ? [singleAlbum.artist.trim().toLowerCase() === 'unknown artist' ? '' : singleAlbum.artist, singleAlbum.album].filter(Boolean).join(' — ') + : undefined; return (
@@ -45,7 +55,10 @@ export function BatchCard({ {selectable && ( onToggle(ids, e.target.checked)} /> )} - {first.author.username} + {albumTitle ?
+ {albumTitle} + {first.author.username} +
: {first.author.username}} {formatDateTime(first.created_at, i18n.language)} {t('uploads.batch_size', { count: files.length, size: formatBytes(size, i18n.language) })} {summary.formats.map(([format, count]) => `${count} × ${format || t('uploads.format_unknown')}`).join(' · ')} diff --git a/apps/web/src/pages/uploads/uploads.module.css b/apps/web/src/pages/uploads/uploads.module.css index e4390f9..e245b58 100644 --- a/apps/web/src/pages/uploads/uploads.module.css +++ b/apps/web/src/pages/uploads/uploads.module.css @@ -179,6 +179,9 @@ color: var(--text); } +.batchIdentity { display: flex; flex-direction: column; gap: 4px; min-width: 0; max-width: min(360px, 100%); } +.batchIdentity strong { color: var(--text); font-size: 14px; overflow-wrap: anywhere; } + .batchToggle { min-width: 44px; min-height: 44px; padding: 8px; } .batchExpanded { transform: rotate(90deg); }