From 765a9d5b2ebbaf697be6a9ed2491ddbb87fba193 Mon Sep 17 00:00:00 2001
From: Jaret Burkett <jaretburkett@gmail.com>
Date: Fri, 10 Apr 2026 10:07:45 -0600
Subject: [PATCH] Add a download button to music samples in in the gear menu

---
 ui/src/components/SampleImageViewer.tsx | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/SampleImageViewer.tsx b/ui/src/components/SampleImageViewer.tsx
index ce29e381..ef5f2ed1 100644
--- a/ui/src/components/SampleImageViewer.tsx
+++ b/ui/src/components/SampleImageViewer.tsx
@@ -298,11 +298,22 @@ export default function SampleImageViewer({
                 </MenuButton>
                 <MenuItems
                   anchor="bottom end"
-                  className="bg-gray-900 border border-gray-700 rounded shadow-lg w-48 px-4 py-2 mt-1 z-50"
+                  className="bg-gray-900 border border-gray-700 rounded shadow-lg w-48 px-2 py-2 mt-1 z-50"
                 >
+                  {imgPath && isAudio(imgPath) && (
+                    <MenuItem>
+                      <a
+                        className="cursor-pointer px-4 py-1 hover:bg-gray-800 rounded block"
+                        href={`/api/img/${encodeURIComponent(imgPath)}`}
+                        download={imgPath.replace(/^.*[\\/]/, '')}
+                      >
+                        Download
+                      </a>
+                    </MenuItem>
+                  )}
                   <MenuItem>
                     <div
-                      className="cursor-pointer"
+                      className="cursor-pointer px-4 py-1 hover:bg-gray-800 rounded"
                       onClick={() => {
                         let message = `Are you sure you want to delete this sample? This action cannot be undone.`;
                         openConfirm({