From 386c5416588c9736b900de09c1ff470ed73cf439 Mon Sep 17 00:00:00 2001
From: afkarxyz <mzamzamafkarhadiq@gmail.com>
Date: Wed, 25 Mar 2026 19:56:23 +0700
Subject: [PATCH] .reorder audio tools

---
 frontend/src/components/AudioResamplerPage.tsx |  6 +++---
 frontend/src/components/DebugLoggerPage.tsx    | 13 ++++++++++++-
 frontend/src/components/HistoryPage.tsx        |  3 ++-
 frontend/src/components/Sidebar.tsx            | 10 +++++-----
 frontend/src/hooks/usePreview.ts               |  2 ++
 frontend/src/lib/preview.ts                    |  1 +
 6 files changed, 25 insertions(+), 10 deletions(-)
 create mode 100644 frontend/src/lib/preview.ts

diff --git a/frontend/src/components/AudioResamplerPage.tsx b/frontend/src/components/AudioResamplerPage.tsx
index 31a1861..3615b87 100644
--- a/frontend/src/components/AudioResamplerPage.tsx
+++ b/frontend/src/components/AudioResamplerPage.tsx
@@ -363,12 +363,12 @@ export function AudioResamplerPage() {
         }} style={{ "--wails-drop-target": "drop" } as React.CSSProperties}>
             {files.length === 0 ? (<>
                 <div className="mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-muted">
-                    <AudioLinesIcon size={32} className="text-primary"/>
+                    <Upload className="h-8 w-8 text-primary"/>
                 </div>
                 <p className="text-sm text-muted-foreground mb-4 text-center">
                     {isDragging
-                ? "Drop your FLAC files here"
-                : "Drag and drop FLAC files here, or click the button below to select"}
+                ? "Drop your audio files here"
+                : "Drag and drop audio files here, or click the button below to select"}
                 </p>
                 <div className="flex gap-3">
                     <Button onClick={handleSelectFiles} size="lg">
diff --git a/frontend/src/components/DebugLoggerPage.tsx b/frontend/src/components/DebugLoggerPage.tsx
index 4b94fc8..ec463cd 100644
--- a/frontend/src/components/DebugLoggerPage.tsx
+++ b/frontend/src/components/DebugLoggerPage.tsx
@@ -2,6 +2,7 @@ import { useState, useEffect, useRef } from "react";
 import { Trash2, Copy, Check, FileDown } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { logger, type LogEntry } from "@/lib/logger";
+import { useDownloadQueueData } from "@/hooks/useDownloadQueueData";
 import { ExportFailedDownloads } from "../../wailsjs/go/main/App";
 import { toastWithSound as toast } from "@/lib/toast-with-sound";
 const levelColors: Record<string, string> = {
@@ -23,6 +24,13 @@ export function DebugLoggerPage() {
     const [logs, setLogs] = useState<LogEntry[]>([]);
     const [copied, setCopied] = useState(false);
     const scrollRef = useRef<HTMLDivElement>(null);
+    const queueInfo = useDownloadQueueData();
+    const hasDownloadActivity = queueInfo.queue.length > 0 ||
+        queueInfo.queued_count > 0 ||
+        queueInfo.completed_count > 0 ||
+        queueInfo.failed_count > 0 ||
+        queueInfo.skipped_count > 0;
+    const canExportFailed = hasDownloadActivity && queueInfo.failed_count > 0;
     useEffect(() => {
         const unsubscribe = logger.subscribe(() => {
             setLogs(logger.getLogs());
@@ -54,6 +62,9 @@ export function DebugLoggerPage() {
         }
     };
     const handleExportFailed = async () => {
+        if (!canExportFailed) {
+            return;
+        }
         try {
             const message = await ExportFailedDownloads();
             if (message.startsWith("Successfully")) {
@@ -72,7 +83,7 @@ export function DebugLoggerPage() {
       <div className="flex items-center justify-between">
         <h1 className="text-2xl font-bold">Debug Logs</h1>
         <div className="flex items-center gap-2">
-          <Button variant="outline" size="sm" className="gap-1.5" onClick={handleExportFailed}>
+          <Button variant="outline" size="sm" className="gap-1.5" onClick={handleExportFailed} disabled={!canExportFailed}>
             <FileDown className="h-4 w-4"/>
             Export Failed
           </Button>
diff --git a/frontend/src/components/HistoryPage.tsx b/frontend/src/components/HistoryPage.tsx
index a5c488c..41e5ccf 100644
--- a/frontend/src/components/HistoryPage.tsx
+++ b/frontend/src/components/HistoryPage.tsx
@@ -9,6 +9,7 @@ import { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, Pagi
 import { GetDownloadHistory, ClearDownloadHistory, GetPreviewURL, GetFetchHistory, DeleteDownloadHistoryItem, DeleteFetchHistoryItem, ClearFetchHistoryByType } from "../../wailsjs/go/main/App";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { openExternal } from "@/lib/utils";
+import { SPOTIFY_PREVIEW_VOLUME } from "@/lib/preview";
 import { TidalIcon, QobuzIcon, AmazonIcon } from "./PlatformIcons";
 const formatDate = (timestamp: number) => {
     const date = new Date(timestamp * 1000);
@@ -191,7 +192,7 @@ export function HistoryPage({ onHistorySelect }: HistoryPageProps) {
             if (url) {
                 const audio = new Audio(url);
                 audioRef.current = audio;
-                audio.volume = 0.5;
+                audio.volume = SPOTIFY_PREVIEW_VOLUME;
                 audio.onended = () => setPlayingPreviewId(null);
                 audio.play();
                 setPlayingPreviewId(id);
diff --git a/frontend/src/components/Sidebar.tsx b/frontend/src/components/Sidebar.tsx
index 908253b..fcc7862 100644
--- a/frontend/src/components/Sidebar.tsx
+++ b/frontend/src/components/Sidebar.tsx
@@ -33,8 +33,8 @@ export function Sidebar({ currentPage, onPageChange }: SidebarProps) {
     const [isIssuesDialogOpen, setIsIssuesDialogOpen] = useState(false);
     const [hasIssueAgreement, setHasIssueAgreement] = useState(false);
     const analyzerIconRef = useRef<ActivityIconHandle>(null);
-    const converterIconRef = useRef<FileMusicIconHandle>(null);
     const resamplerIconRef = useRef<AudioLinesIconHandle>(null);
+    const converterIconRef = useRef<FileMusicIconHandle>(null);
     const fileManagerIconRef = useRef<FilePenIconHandle>(null);
     const handleIssuesDialogChange = (open: boolean) => {
         setIsIssuesDialogOpen(open);
@@ -116,14 +116,14 @@ export function Sidebar({ currentPage, onPageChange }: SidebarProps) {
                             <ActivityIcon ref={analyzerIconRef} size={16}/>
                             <span>Audio Quality Analyzer</span>
                         </DropdownMenuItem>
-                        <DropdownMenuItem onClick={() => onPageChange("audio-converter")} className="gap-3 cursor-pointer py-2 px-3" {...getAnimatedItemHandlers(converterIconRef)}>
-                            <FileMusicIcon ref={converterIconRef} size={16}/>
-                            <span>Audio Converter</span>
-                        </DropdownMenuItem>
                         <DropdownMenuItem onClick={() => onPageChange("audio-resampler")} className="gap-3 cursor-pointer py-2 px-3" {...getAnimatedItemHandlers(resamplerIconRef)}>
                             <AudioLinesIcon ref={resamplerIconRef} size={16}/>
                             <span>Audio Resampler</span>
                         </DropdownMenuItem>
+                        <DropdownMenuItem onClick={() => onPageChange("audio-converter")} className="gap-3 cursor-pointer py-2 px-3" {...getAnimatedItemHandlers(converterIconRef)}>
+                            <FileMusicIcon ref={converterIconRef} size={16}/>
+                            <span>Audio Converter</span>
+                        </DropdownMenuItem>
                         <DropdownMenuItem onClick={() => onPageChange("file-manager")} className="gap-3 cursor-pointer py-2 px-3" {...getAnimatedItemHandlers(fileManagerIconRef)}>
                             <FilePenIcon ref={fileManagerIconRef} size={16}/>
                             <span>File Manager</span>
diff --git a/frontend/src/hooks/usePreview.ts b/frontend/src/hooks/usePreview.ts
index 72c3abe..479346d 100644
--- a/frontend/src/hooks/usePreview.ts
+++ b/frontend/src/hooks/usePreview.ts
@@ -1,5 +1,6 @@
 import { useState, useEffect } from "react";
 import { GetPreviewURL } from "@/../wailsjs/go/main/App";
+import { SPOTIFY_PREVIEW_VOLUME } from "@/lib/preview";
 import { toast } from "sonner";
 export function usePreview() {
     const [loadingPreview, setLoadingPreview] = useState<string | null>(null);
@@ -38,6 +39,7 @@ export function usePreview() {
                 return;
             }
             const audio = new Audio(previewURL);
+            audio.volume = SPOTIFY_PREVIEW_VOLUME;
             audio.addEventListener("loadeddata", () => {
                 setLoadingPreview(null);
                 setPlayingTrack(trackId);
diff --git a/frontend/src/lib/preview.ts b/frontend/src/lib/preview.ts
new file mode 100644
index 0000000..a82621d
--- /dev/null
+++ b/frontend/src/lib/preview.ts
@@ -0,0 +1 @@
+export const SPOTIFY_PREVIEW_VOLUME = 1;