v5.7

frontend/src/App.tsx

@@ -24,6 +24,7 @@ import { TrackInfo } from "@/components/TrackInfo";
 import { AlbumInfo } from "@/components/AlbumInfo";
 import { PlaylistInfo } from "@/components/PlaylistInfo";
 import { ArtistInfo } from "@/components/ArtistInfo";
+import { DownloadProgressToast } from "@/components/DownloadProgressToast";
 
 // Hooks
 import { useDownload } from "@/hooks/useDownload";
@@ -261,6 +262,9 @@ function App() {
       <div className="min-h-screen bg-background p-4 md:p-8">
         <div className="max-w-4xl mx-auto space-y-6">
           <Header version={CURRENT_VERSION} hasUpdate={hasUpdate} />
+          
+          {/* Download Progress Toast */}
+          <DownloadProgressToast />
 
           {/* Timeout Dialog */}
           <Dialog

frontend/src/components/DownloadProgressToast.tsx

@@ -0,0 +1,23 @@
+import { useDownloadProgress } from "@/hooks/useDownloadProgress";
+import { Download } from "lucide-react";
+
+export function DownloadProgressToast() {
+  const progress = useDownloadProgress();
+
+  if (!progress.is_downloading) {
+    return null;
+  }
+
+  return (
+    <div className="fixed top-4 left-4 z-50 animate-in slide-in-from-left-5 data-[state=closed]:animate-out data-[state=closed]:slide-out-to-left-5">
+      <div className="bg-background border rounded-lg shadow-lg p-3">
+        <div className="flex items-center gap-2">
+          <Download className="h-4 w-4 text-primary animate-bounce" />
+          <p className="text-sm font-medium">
+            {progress.mb_downloaded.toFixed(2)} MB
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+}

frontend/src/components/Header.tsx

@@ -49,7 +49,7 @@ export function Header({ version, hasUpdate }: HeaderProps) {
           </div>
         </div>
         <p className="text-muted-foreground">
-          Get Spotify tracks in true FLAC from Tidal/Deezer — no account required.
+          Get Spotify tracks in true FLAC from Tidal, Deezer & Qobuz — no account required.
         </p>
       </div>
       <div className="absolute right-0 top-0 flex gap-2">

frontend/src/hooks/useDownloadProgress.ts

@@ -0,0 +1,42 @@
+import { useState, useEffect, useRef } from "react";
+import { GetDownloadProgress } from "../../wailsjs/go/main/App";
+
+export interface DownloadProgressInfo {
+  is_downloading: boolean;
+  mb_downloaded: number;
+}
+
+export function useDownloadProgress() {
+  const [progress, setProgress] = useState<DownloadProgressInfo>({
+    is_downloading: false,
+    mb_downloaded: 0,
+  });
+  const intervalRef = useRef<number | null>(null);
+
+  useEffect(() => {
+    // Poll progress every 200ms for smooth updates
+    const pollProgress = async () => {
+      try {
+        const progressInfo = await GetDownloadProgress();
+        setProgress(progressInfo);
+      } catch (error) {
+        console.error("Failed to get download progress:", error);
+      }
+    };
+
+    // Start polling
+    intervalRef.current = window.setInterval(pollProgress, 200);
+
+    // Initial fetch
+    pollProgress();
+
+    // Cleanup
+    return () => {
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+      }
+    };
+  }, []);
+
+  return progress;
+}