feat(downloads): add download queue management and UI

src/routes/services/deezer/+page.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
   import { onMount } from 'svelte';
+  import { goto } from '$app/navigation';
   import { deezerAuth, loadDeezerAuth, saveArl, saveUser, clearDeezerAuth } from '$lib/stores/deezer';
   import { deezerAPI } from '$lib/services/deezer';
-  import { downloadTrack } from '$lib/services/deezer/downloader';
+  import { addToQueue } from '$lib/stores/downloadQueue';
   import { settings } from '$lib/stores/settings';
 
   let arlInput = $state('');
@@ -12,13 +13,13 @@
   let testingAuth = $state(false);
   let authTestResult = $state<string | null>(null);
 
-  // Track download test
+  // Track add to queue test
   let trackIdInput = $state('3135556');  // Default: Daft Punk - One More Time
   let isFetchingTrack = $state(false);
-  let isDownloading = $state(false);
+  let isAddingToQueue = $state(false);
   let trackInfo = $state<any>(null);
-  let downloadStatus = $state('');
-  let downloadError = $state('');
+  let queueStatus = $state('');
+  let queueError = $state('');
 
   onMount(async () => {
     await loadDeezerAuth();
@@ -86,12 +87,12 @@
 
   async function fetchTrackInfo() {
     if (!$deezerAuth.arl || !$deezerAuth.user) {
-      downloadError = 'Not logged in';
+      queueError = 'Not logged in';
       return;
     }
 
     isFetchingTrack = true;
-    downloadError = '';
+    queueError = '';
     trackInfo = null;
 
     try {
@@ -106,42 +107,28 @@
       trackInfo = trackData;
     } catch (error) {
       console.error('Fetch error:', error);
-      downloadError = error instanceof Error ? error.message : 'Failed to fetch track';
+      queueError = error instanceof Error ? error.message : 'Failed to fetch track';
     } finally {
       isFetchingTrack = false;
     }
   }
 
-  async function downloadTrackNow() {
+  async function addTrackToQueue() {
     if (!trackInfo) {
-      downloadError = 'Please fetch track info first';
+      queueError = 'Please fetch track info first';
       return;
     }
 
     if (!$settings.musicFolder) {
-      downloadError = 'Please set a music folder in Settings first';
+      queueError = 'Please set a music folder in Settings first';
       return;
     }
 
-    isDownloading = true;
-    downloadStatus = 'Getting download URL...';
-    downloadError = '';
+    isAddingToQueue = true;
+    queueStatus = '';
+    queueError = '';
 
     try {
-      const format = $deezerAuth.user!.can_stream_lossless ? 'FLAC' : 'MP3_320';
-      const downloadURL = await deezerAPI.getTrackDownloadUrl(
-        trackInfo.TRACK_TOKEN,
-        format,
-        $deezerAuth.user!.license_token!
-      );
-
-      if (!downloadURL) {
-        throw new Error('Could not get download URL');
-      }
-
-      downloadStatus = 'Downloading and decrypting...';
-      console.log('Download URL:', downloadURL);
-
       // Build track object
       const track = {
         id: trackInfo.SNG_ID,
@@ -151,7 +138,7 @@
         artists: [trackInfo.ART_NAME],
         album: trackInfo.ALB_TITLE,
         albumId: trackInfo.ALB_ID,
-        albumArtist: trackInfo.ART_NAME,  // Simplified for test
+        albumArtist: trackInfo.ART_NAME,
         albumArtistId: trackInfo.ART_ID,
         trackNumber: trackInfo.TRACK_NUMBER || 1,
         discNumber: trackInfo.DISK_NUMBER || 1,
@@ -162,23 +149,28 @@
         trackToken: trackInfo.TRACK_TOKEN
       };
 
-      // Download track
-      const filePath = await downloadTrack(
-        track,
-        downloadURL,
-        $settings.musicFolder,
-        format
-      );
+      // Add to queue
+      await addToQueue({
+        source: 'deezer',
+        type: 'track',
+        title: track.title,
+        artist: track.artist,
+        totalTracks: 1,
+        downloadObject: track
+      });
 
-      downloadStatus = `✓ Downloaded successfully to: ${filePath}`;
-      console.log('Download complete:', filePath);
+      queueStatus = '✓ Added to download queue!';
+
+      // Navigate to downloads page after brief delay
+      setTimeout(() => {
+        goto('/downloads');
+      }, 1000);
 
     } catch (error) {
-      console.error('Download error:', error);
-      downloadError = error instanceof Error ? error.message : 'Download failed';
-      downloadStatus = '';
+      console.error('Queue error:', error);
+      queueError = error instanceof Error ? error.message : 'Failed to add to queue';
     } finally {
-      isDownloading = false;
+      isAddingToQueue = false;
     }
   }
 </script>
@@ -285,13 +277,13 @@
       </div>
     </section>
 
-    <!-- Test Track Download -->
+    <!-- Add Track to Queue -->
     <section class="window test-section">
       <div class="title-bar">
-        <div class="title-bar-text">Test Track Download</div>
+        <div class="title-bar-text">Add Track to Download Queue</div>
       </div>
       <div class="window-body">
-        <p>Download a test track to verify decryption is working:</p>
+        <p>Add a track to the download queue:</p>
 
         <div class="field-row-stacked">
           <label for="track-id">Track ID (from Deezer URL)</label>
@@ -300,7 +292,7 @@
             type="text"
             bind:value={trackIdInput}
             placeholder="e.g., 3135556"
-            disabled={isFetchingTrack || isDownloading}
+            disabled={isFetchingTrack || isAddingToQueue}
           />
           <small class="help-text">Default: 3135556 (Daft Punk - One More Time)</small>
         </div>
@@ -313,31 +305,31 @@
           </div>
         {/if}
 
-        {#if downloadStatus}
+        {#if queueStatus}
           <div class="success-message">
-            {downloadStatus}
+            {queueStatus}
           </div>
         {/if}
 
-        {#if downloadError}
+        {#if queueError}
           <div class="error-message">
-            ⚠ {downloadError}
+            ⚠ {queueError}
           </div>
         {/if}
 
         <div class="button-row">
-          <button onclick={fetchTrackInfo} disabled={isFetchingTrack || isDownloading}>
+          <button onclick={fetchTrackInfo} disabled={isFetchingTrack || isAddingToQueue}>
             {isFetchingTrack ? 'Fetching...' : 'Fetch Track Info'}
           </button>
 
-          <button onclick={downloadTrackNow} disabled={!trackInfo || isDownloading || !$settings.musicFolder}>
-            {isDownloading ? 'Downloading...' : 'Download'}
+          <button onclick={addTrackToQueue} disabled={!trackInfo || isAddingToQueue || !$settings.musicFolder}>
+            {isAddingToQueue ? 'Adding...' : 'Add to Queue'}
           </button>
         </div>
 
         {#if !$settings.musicFolder}
           <p class="help-text" style="margin-top: 8px;">
-            ⚠ Please set a music folder in Settings before downloading.
+            ⚠ Please set a music folder in Settings before adding to queue.
           </p>
         {/if}
       </div>