Implemented attachment file download function

frontend/app/projects/[projectId]/folders/[folderId]/cases/[caseId]/case-attachments-editor.tsx

@@ -4,11 +4,16 @@ import { Trash, ArrowDownToLine } from "lucide-react";
 
 type Props = {
   attachments: AttachmentType[];
+  onAttachmentDownload: (
+    attachmentId: number,
+    downloadFileName: string
+  ) => void;
   onAttachmentDelete: (attachmentId: number) => void;
 };
 
 export default function CaseAttachmentsEditor({
   attachments = [],
+  onAttachmentDownload,
   onAttachmentDelete,
 }: Props) {
   let images = [];
@@ -70,7 +75,7 @@ export default function CaseAttachmentsEditor({
                     isIconOnly
                     size="sm"
                     className="bg-transparent rounded-full"
-                    onPress={() => console.log("download")}
+                    onPress={() => onAttachmentDownload(file.id, file.title)}
                   >
                     <ArrowDownToLine size={16} />
                   </Button>

frontend/app/projects/[projectId]/folders/[folderId]/cases/[caseId]/case-editor.tsx

@@ -22,6 +22,7 @@ import {
   fetchDeleteStep,
   updateCase,
   fetchCreateAttachments,
+  fetchDownloadAttachment,
   fetchDeleteAttachment,
 } from "./caseControl";
 
@@ -370,6 +371,9 @@ export default function CaseEditor({
         <h6>Attachments</h6>
         <CaseAttachmentsEditor
           attachments={testCase.Attachments}
+          onAttachmentDownload={(attachmentId: number, downloadFileName: string) =>
+            fetchDownloadAttachment(attachmentId, downloadFileName)
+          }
           onAttachmentDelete={onAttachmentDelete}
         />
         <div

frontend/app/projects/[projectId]/folders/[folderId]/cases/[caseId]/caseControl.ts

@@ -129,6 +129,40 @@ async function fetchCreateAttachments(caseId: number, files: File[]) {
   }
 }
 
+/**
+ * download attachment
+ */
+async function fetchDownloadAttachment(attachmentId: number, downloadFileName: string) {
+  const fetchOptions = {
+    method: "GET",
+    headers: {
+      "Content-Type": "application/json",
+    },
+  };
+
+  const url = `${apiServer}/attachments/download/${attachmentId}`;
+
+  try {
+    const response = await fetch(url, fetchOptions);
+    if (!response.ok) {
+      throw new Error(`HTTP error! Status: ${response.status}`);
+    }
+
+    const blob = await response.blob();
+    const downloadUrl = window.URL.createObjectURL(blob);
+
+    const link = document.createElement("a");
+    link.href = downloadUrl;
+    link.download = downloadFileName;
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+  } catch (error) {
+    console.error("Error downloading file:", error);
+    throw error;
+  }
+}
+
 /**
  * delete attachment
  */
@@ -148,7 +182,7 @@ async function fetchDeleteAttachment(attachmentId: number) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
   } catch (error) {
-    console.error("Error deleting project:", error);
+    console.error("Error deleting file:", error);
     throw error;
   }
 }
@@ -159,5 +193,6 @@ export {
   fetchDeleteStep,
   updateCase,
   fetchCreateAttachments,
+  fetchDownloadAttachment,
   fetchDeleteAttachment,
 };