feat: add new component download icon button

ui/components/scans/table/scans/column-get-scans.tsx

@@ -2,16 +2,13 @@
 
 import { Tooltip } from "@nextui-org/react";
 import { ColumnDef } from "@tanstack/react-table";
-import { DownloadIcon } from "lucide-react";
 import { useSearchParams } from "next/navigation";
 
 import { InfoIcon } from "@/components/icons";
-import { toast } from "@/components/ui";
-import { CustomButton } from "@/components/ui/custom";
+import { DownloadIconButton, toast } from "@/components/ui";
 import { DateWithTime, EntityInfoShort } from "@/components/ui/entities";
 import { TriggerSheet } from "@/components/ui/sheet";
 import { DataTableColumnHeader, StatusBadge } from "@/components/ui/table";
-import { downloadScanZip } from "@/lib/helper";
 import { ScanProps } from "@/types";
 
 import { LinkToFindingsFromScan } from "../../link-to-findings-from-scan";
@@ -136,19 +133,10 @@ export const ColumnGetScans: ColumnDef<ScanProps>[] = [
       const scanState = row.original.attributes?.state;
 
       return (
-        <div className="flex w-14 items-center justify-center">
-          <CustomButton
-            variant="ghost"
-            isDisabled={scanState !== "completed"}
-            onPress={() => downloadScanZip(scanId, toast)}
-            className="p-0 text-default-500 hover:text-primary disabled:opacity-30"
-            isIconOnly
-            ariaLabel="Download .zip"
-            size="sm"
-          >
-            <DownloadIcon size={16} />
-          </CustomButton>
-        </div>
+        <DownloadIconButton
+          paramId={scanId}
+          isDisabled={scanState !== "completed"}
+        />
       );
     },
   },

ui/components/ui/download-icon-button/download-icon-button.tsx

@@ -0,0 +1,34 @@
+"use client";
+
+import { downloadScanZip } from "@/lib/helper";
+import { CustomButton } from "../custom/custom-button";
+import { toast } from "@/components/ui";
+import { DownloadIcon } from "lucide-react";
+
+interface DownloadIconButtonProps {
+  paramId: string;
+  ariaLabel?: string;
+  isDisabled?: boolean;
+}
+
+export const DownloadIconButton = ({
+  paramId,
+  ariaLabel = "Download report",
+  isDisabled = false,
+}: DownloadIconButtonProps) => {
+  return (
+    <div className="flex w-14 items-center justify-center">
+      <CustomButton
+        variant="ghost"
+        isDisabled={isDisabled}
+        onPress={() => downloadScanZip(paramId, toast)}
+        className="p-0 text-default-500 hover:text-primary disabled:opacity-30"
+        isIconOnly
+        ariaLabel={ariaLabel}
+        size="sm"
+      >
+        <DownloadIcon size={16} />
+      </CustomButton>
+    </div>
+  );
+};

ui/components/ui/index.ts

@@ -11,3 +11,4 @@ export * from "./main-layout/main-layout";
 export * from "./select/Select";
 export * from "./sidebar";
 export * from "./toast";
+export * from "./download-icon-button/download-icon-button";