Merge pull request #311 from abhitrueprogrammer/prod

feat: download files in a zip

Author: abhitrueprogrammer

package.json

@@ -39,6 +39,7 @@
     "google-auth-library": "^10.2.1",
     "googleapis": "^155.0.0",
     "jose": "^5.10.0",
+    "jszip": "^3.10.1",
     "lodash": "^4.17.21",
     "lucide-react": "^0.395.0",
     "mongoose": "^8.13.2",

pnpm-lock.yaml

@@ -26,6 +26,8 @@ import {
   downloadFile,
 } from "@/util/download_paper";
 import type { ICourses } from "@/interface";
+import JSZip from "jszip";
+import { toast } from "react-hot-toast";
 
 const CatalogueContent = () => {
   const router = useRouter();
@@ -226,17 +228,36 @@ const CatalogueContent = () => {
     [],
   );
 
-  const handleDownloadAll = useCallback(async () => {
+  const handleDownloadSelected = useCallback(async () => {
+    const zip = new JSZip();
     const uniquePapers = Array.from(
       new Set(selectedPapers.map((paper) => paper._id)),
     ).map((id) => selectedPapers.find((paper) => paper._id === id)) as IPaper[];
-
+    if(!uniquePapers){
+      toast.error("No papers selected for download.");
+    }
     for (const paper of uniquePapers) {
-      await downloadFile(
-        getSecureUrl(paper.final_url),
-        generateFileName(paper),
-      );
+      try {
+        const response = await fetch(getSecureUrl(paper.final_url));
+        const blob = await response.blob();
+        const filename = generateFileName(paper);
+        zip.file(filename, blob);
+      } catch (err) {
+        // Optionally handle individual download errors
+        console.error(`Failed to fetch ${paper.final_url}`, err);
+      }
     }
+    
+    const zipBlob = await zip.generateAsync({ type: "blob" });
+    const url = URL.createObjectURL(zipBlob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = "papers.zip";
+    document.body.appendChild(a);
+    a.click();
+    a.remove();
+    URL.revokeObjectURL(url);
+    toast.success("Download Initiated")
   }, [selectedPapers]);
 
   const handleApplyFilters = useCallback(
@@ -338,7 +359,7 @@ const CatalogueContent = () => {
           selectedPapers={selectedPapers}
           subject={subject}
           filterOptions={filterOptions}
-          handleDownloadAll={handleDownloadAll}
+          handleDownloadSelected={handleDownloadSelected}
           closeFilters={closeFilters}
         />
       </div>}
@@ -374,7 +395,7 @@ const CatalogueContent = () => {
               selectedPapers={selectedPapers}
               subject={subject}
               filterOptions={filterOptions}
-              handleDownloadAll={handleDownloadAll}
+              handleDownloadSelected={handleDownloadSelected}
               closeFilters={closeFilters}
             />
           </SheetContent>

src/components/CatalogueContent.tsx

@@ -22,7 +22,7 @@ function SideBar({
   handleApplyFilters,
   handleSelectAll,
   handleDeselectAll,
-  handleDownloadAll,
+  handleDownloadSelected: handleDownloadAll,
 }: {
   loading: boolean;
   selectedExams: string[];
@@ -47,7 +47,7 @@ function SideBar({
   ) => void;
   handleSelectAll: () => void;
   handleDeselectAll: () => void;
-  handleDownloadAll: () => void;
+  handleDownloadSelected: () => void;
 }) {
   const exams =
     filterOptions?.unique_exams.map((exam) => ({
@@ -188,7 +188,7 @@ function SideBar({
           onClick={handleDownloadAll}
           className="cursor-pointer rounded-full border-2 border-black px-2 py-1 font-play text-xs font-semibold hover:bg-[#B2B8FF] hover:text-black dark:border-white dark:hover:border-[#434dba] dark:hover:bg-[#434dba] dark:hover:text-white"
         >
-          Download All
+          Download Selected
         </div>
       </div>