diff --git a/src/components/modals/FileViewerModal.tsx b/src/components/modals/FileViewerModal.tsx index 85ad325..28dfeb8 100644 --- a/src/components/modals/FileViewerModal.tsx +++ b/src/components/modals/FileViewerModal.tsx @@ -1,4 +1,5 @@ import React, { useState, useEffect } from 'react'; +import JSZip from 'jszip'; interface FileType { url: string; @@ -82,6 +83,7 @@ const FileViewerModal: React.FC = ({ isOpen, onClose, file const [error, setError] = useState(null); const [selectedFile, setSelectedFile] = useState(null); const [showPreview, setShowPreview] = useState(false); + const [downloadingAll, setDownloadingAll] = useState(false); const fileArray = Array.isArray(files) ? files : [files]; @@ -146,6 +148,42 @@ const FileViewerModal: React.FC = ({ isOpen, onClose, file setSelectedFile(null); }; + // Function to download all files as zip + const downloadAllFiles = async () => { + if (fileArray.length === 0) return; + + setDownloadingAll(true); + const zip = new JSZip(); + + try { + // Download all files + const filePromises = fileArray.map(async (file) => { + const response = await fetch(file.url); + const blob = await response.blob(); + zip.file(file.name, blob); + }); + + await Promise.all(filePromises); + + // Generate and download zip + const content = await zip.generateAsync({ type: "blob" }); + const zipUrl = URL.createObjectURL(content); + + const link = document.createElement('a'); + link.href = zipUrl; + link.download = 'files.zip'; + document.body.appendChild(link); + link.click(); + document.body.removeChild(link); + URL.revokeObjectURL(zipUrl); + } catch (err) { + console.error('Failed to download files:', err); + setError('Failed to download files'); + } finally { + setDownloadingAll(false); + } + }; + const renderFileContent = (file: FileType) => { const fileType = file.type.toLowerCase(); @@ -256,7 +294,31 @@ const FileViewerModal: React.FC = ({ isOpen, onClose, file const renderFileList = () => { return (
-

Files ({fileArray.length})

+
+

Files ({fileArray.length})

+ {fileArray.length > 1 && ( + + )} +
{fileArray.map((file, index) => (