DownloadImageButton

src/components/Buttons.tsx

@@ -72,17 +72,40 @@ const handleDownload = () => {
         console.error("Error fetching the file:", error);
     });
 };
+};
+
+export const DownloadImageButton = ({ url, fileName, children}: {url: string, fileName: string, children: React.ReactNode}) => {
+  const handleDownload = () => {
+      fetch(url)
+      .then((response) => response.blob())
+      .then((blob) => {
+          const url = window.URL.createObjectURL(new Blob([blob]));
+          const link = document.createElement("a");
+          link.href = url;
+          link.download = fileName || "downloaded-file";
+          document.body.appendChild(link);
+  
+          link.click();
+  
+          document.body.removeChild(link);
+          window.URL.revokeObjectURL(url);
+      })
+      .catch((error) => {
+          console.error("Error fetching the file:", error);
+      });
+  };
   
 return (
 
     <a type="button" onClick={handleDownload} className="download-butt">
-        Download
+        {children}
     </a>
 
 );
 };
 
 
+
 export function TabButtonRow({data, classy, opentype, closing}: {data: Array<TabDatensatz>, classy?: string, opentype: string, closing: string}){
   let rows = []
   for ( let i = 0;  i < data.length; i++ ){