Merge pull request #2616 from Chia-Network/checkpoint/main_from_release_2.5.2_3b65c4febd8630753237d867c8fee62db2a759bd

checkpoint: into main from release/2.5.2  @ 3b65c4f

Author: TheLastCicada

package-lock.json

@@ -91,6 +91,7 @@
     "react-virtuoso": "4.5.0",
     "redux": "4.2.1",
     "regenerator-runtime": "0.14.1",
+    "sanitize-filename": "1.6.3",
     "seedrandom": "3.0.5",
     "stacktrace-js": "2.0.2",
     "stream-browserify": "3.0.0",

packages/gui/package.json

@@ -17,7 +17,7 @@ export default function MultipleDownloadDialog(props: MultipleDownloadDialogProp
   const [progressObject, setProgressObject] = useState<any>({
     progress: 0,
     url: '',
-    i: 1,
+    index: 0,
     total: 1,
   });
   const [responseObject, setResponseObject] = useState<any>({});
@@ -31,11 +31,11 @@ export default function MultipleDownloadDialog(props: MultipleDownloadDialogProp
       setResponseObject(obj);
       setDownloadDone(true);
     };
-    ipcRenderer.on('downloadProgress', downloadProgressFn);
+    ipcRenderer.on('multipleDownloadProgress', downloadProgressFn);
     ipcRenderer.on('multipleDownloadDone', downloadDoneFn);
 
     return () => {
-      ipcRenderer.off('downloadProgress', downloadProgressFn);
+      ipcRenderer.off('multipleDownloadProgress', downloadProgressFn);
       ipcRenderer.off('multipleDownloadDone', downloadDoneFn);
     };
   }, []);
@@ -75,7 +75,7 @@ export default function MultipleDownloadDialog(props: MultipleDownloadDialogProp
     }
     return (
       <Trans>
-        Downloading files {progressObject.i + 1}/{progressObject.total}
+        Downloading files {progressObject.index + 1}/{progressObject.total}
       </Trans>
     );
   }
@@ -102,7 +102,7 @@ export default function MultipleDownloadDialog(props: MultipleDownloadDialogProp
           <Box>{progressObject.url}</Box>
           <Box
             sx={{
-              width: `${progressObject.progress * 100}%`,
+              width: `${progressObject.progress}%`,
               height: '12px',
               background: `${theme.palette.primary.main}`,
               borderRadius: '3px',

packages/gui/src/components/nfts/MultipleDownloadDialog.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable no-bitwise -- enable bitwise operators for this file */
 
-import type { NFTInfo } from '@chia-network/api';
+import { toBech32m, type NFTInfo } from '@chia-network/api';
 import { useSetNFTStatusMutation, useLocalStorage } from '@chia-network/api-react';
 import { AlertDialog, DropdownActions, MenuItem, useOpenDialog, isValidURL } from '@chia-network/core';
 import {
@@ -32,6 +32,7 @@ import useOpenUnsafeLink from '../../hooks/useOpenUnsafeLink';
 import useViewNFTOnExplorer, { NFTExplorer } from '../../hooks/useViewNFTOnExplorer';
 import NFTSelection from '../../types/NFTSelection';
 import download from '../../util/download';
+import getFileExtension from '../../util/getFileExtension';
 import removeHexPrefix from '../../util/removeHexPrefix';
 
 import MultipleDownloadDialog from './MultipleDownloadDialog';
@@ -392,53 +393,76 @@ type NFTDownloadContextualActionProps = NFTContextualActionProps;
 
 function NFTDownloadContextualAction(props: NFTDownloadContextualActionProps) {
   const { selection } = props;
-  const selectedNft: NFTInfo | undefined = selection?.items[0];
-  const selectedNfts: NFTInfo | undefined = selection?.items;
-  const disabled = !selectedNft;
-  const dataUrl = selectedNft?.dataUris?.[0];
+
+  const selectedNfts: (NFTInfo & { $nftId: string})[] = selection?.items || [];
+
   const openDialog = useOpenDialog();
   const [, setSelectedNFTIds] = useLocalStorage('gallery-selected-nfts', []);
 
+  const downloadable = selectedNfts.filter((nft) => !!nft.dataUris?.length);
+
   async function handleDownload() {
     const { ipcRenderer } = window as any;
-    if (!selectedNft) {
+    if (!downloadable.length) {
       return;
     }
 
-    if (selectedNfts.length > 1) {
-      const folder = await ipcRenderer.invoke('selectMultipleDownloadFolder');
-      if (folder?.canceled !== true) {
-        const nfts = selectedNfts.map((nft: NFTInfo) => {
-          let hash;
-          try {
-            const item = localStorage.getItem(`content-cache-${nft.$nftId}`) || '';
-            const obj = JSON.parse(item);
-            if (obj.valid && obj.binary) {
-              hash = obj.binary;
-            }
-          } catch (e) {
-            return nft;
-          }
-          return { ...nft, hash };
-        });
-        setSelectedNFTIds([]);
-        ipcRenderer.invoke('startMultipleDownload', { folder: folder.filePaths[0], nfts });
-        await openDialog(<MultipleDownloadDialog folder={folder.filePaths[0]} />);
-      }
-    } else {
-      const dataUrlLocal = selectedNft?.dataUris?.[0];
+    if (downloadable.length === 1) {
+      const [first] = downloadable;
+      const dataUrlLocal = first.dataUris?.[0];
       if (dataUrlLocal) {
         download(dataUrlLocal);
       }
+      return;
+    }
+
+    const folder = await ipcRenderer.invoke('selectMultipleDownloadFolder');
+    if (folder?.canceled) {
+      return;
+    }
+
+    setSelectedNFTIds([]);
+
+    try {
+      const selectedFolder = folder.filePaths[0];
+      if (!selectedFolder) {
+        throw new Error('No folder selected');
+      }
+
+      const tasks: { url: string; filename: string }[] = selectedNfts.map((nft) => {
+        const url = nft.dataUris[0];
+        if (!url) {
+          throw new Error('No data URI found for NFT');
+        }
+
+        const nftId = nft.$nftId || toBech32m(nft.launcherId, 'nft')
+
+        const ext = getFileExtension(url);
+        const filename = ext ? `${nftId}.${ext}` : nftId;
+
+        return {
+          url,
+          filename,
+        };
+      });
+
+      ipcRenderer.invoke('startMultipleDownload', { folder: selectedFolder, tasks });
+      await openDialog(<MultipleDownloadDialog folder={selectedFolder} />);
+    } catch (error) {
+      openDialog(
+        <AlertDialog title={<Trans>Download Failed</Trans>}>
+          <Trans>The download failed: {error?.message || 'Unknown error'}</Trans>
+        </AlertDialog>,
+      );
     }
   }
 
-  if (!dataUrl) {
+  if (!downloadable.length) {
     return null;
   }
 
   return (
-    <MenuItem onClick={handleDownload} disabled={disabled} close>
+    <MenuItem onClick={handleDownload} disabled={!downloadable.length} close>
       <ListItemIcon>
         <DownloadIcon />
       </ListItemIcon>

packages/gui/src/components/nfts/NFTContextualActions.tsx

@@ -340,6 +340,7 @@ export default class CacheManager extends EventEmitter {
             timeout,
             maxSize,
             signal: abortController.signal,
+            overrideFile: true,
           });
 
           log('Download finished', url);

packages/gui/src/electron/CacheManager.ts

@@ -14,8 +14,8 @@ import {
 import fs from 'fs';
 import path from 'path';
 import url from 'url';
+import sanitizeFilename from 'sanitize-filename';
 
-import { NFTInfo } from '@chia-network/api';
 import { initialize, enable } from '@electron/remote/main';
 import axios from 'axios';
 import windowStateKeeper from 'electron-window-state';
@@ -32,6 +32,7 @@ import AppIcon from '../assets/img/chia64x64.png';
 import About from '../components/about/About';
 import { i18n } from '../config/locales';
 import chiaEnvironment, { chiaInit } from '../util/chiaEnvironment';
+import downloadFile from './utils/downloadFile';
 import loadConfig, { checkConfigFileExists } from '../util/loadConfig';
 import manageDaemonLifetime from '../util/manageDaemonLifetime';
 import { setUserDataDir } from '../util/userData';
@@ -261,20 +262,7 @@ if (ensureSingleInstance() && ensureCorrectEnvironment()) {
       return { err, statusCode, statusMessage, responseBody };
     });
 
-    function getRemoteFileSize(urlLocal: string): Promise<number> {
-      return new Promise((resolve, reject) => {
-        axios({
-          method: 'HEAD',
-          url: urlLocal,
-        })
-          .then((response) => {
-            resolve(Number(response.headers['content-length'] || -1));
-          })
-          .catch((e) => {
-            reject(e.message);
-          });
-      });
-    }
+
 
     ipcMain.handle('showMessageBox', async (_event, options) => dialog.showMessageBox(mainWindow, options));
 
@@ -334,93 +322,46 @@ if (ensureSingleInstance() && ensureCorrectEnvironment()) {
       return responseObj;
     });
 
-    type DownloadFileWithProgressProps = {
-      folder: string;
-      nft: NFTInfo;
-      current: number;
-      total: number;
-    };
-
-    function downloadFileWithProgress(props: DownloadFileWithProgressProps): Promise<number> {
-      const { folder, nft, current, total } = props;
-      const uri = nft.dataUris[0];
-      return new Promise((resolve, reject) => {
-        getRemoteFileSize(uri)
-          .then((fileSize: number) => {
-            let totalLength = 0;
-            currentDownloadRequest = net.request(uri);
-            currentDownloadRequest.on('response', (response: IncomingMessage) => {
-              let fileName: string = '';
-              /* first try to get file name from server headers */
-              const disposition = response.headers['content-disposition'];
-              if (disposition && typeof disposition === 'string') {
-                const filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
-                const matches = filenameRegex.exec(disposition);
-                if (matches != null && matches[1]) {
-                  fileName = matches[1].replace(/['"]/g, '');
-                }
-              }
-              /* if we didn't get file name from server headers, then parse it from uri */
-              fileName = fileName || uri.replace(/\/$/, '').split('/').splice(-1, 1)[0];
-              currentDownloadRequest.on('abort', () => {
-                reject(new Error('download aborted'));
-              });
-
-              /* if there is already a file with that name in this folder, add nftId to the file name */
-              if (fs.existsSync(path.join(folder, fileName))) {
-                fileName = `${fileName}-${nft.$nftId}`;
-              }
-
-              const fileStream = fs.createWriteStream(path.join(folder, fileName));
-              response.on('data', (chunk) => {
-                fileStream.write(chunk);
-                totalLength += chunk.byteLength;
-                if (fileSize > 0) {
-                  mainWindow?.webContents.send('downloadProgress', {
-                    url: nft.dataUris[0],
-                    nftId: nft.$nftId,
-                    progress: totalLength / fileSize,
-                    i: current,
-                    total,
-                  });
-                }
-              });
-              response.on('end', () => {
-                if (fileStream) {
-                  fileStream.end();
-                }
-                resolve(totalLength);
-              });
-            });
-            currentDownloadRequest.end();
-          })
-          .catch((error) => {
-            reject(error);
-          });
-      });
-    }
 
-    ipcMain.handle('startMultipleDownload', async (_event: any, options: any) => {
+    ipcMain.handle('startMultipleDownload', async (_event: any, options: { folder: string, tasks: { url: string; filename: string }[] }) => {
       /* eslint no-await-in-loop: off -- we want to handle each file separately! */
       let totalDownloadedSize = 0;
       let successFileCount = 0;
       let errorFileCount = 0;
-      for (let i = 0; i < options.nfts.length; i++) {
-        let fileSize;
+
+      const { folder, tasks } = options;
+
+      for (let i = 0; i < tasks.length; i++) {
+        const { url: downloadUrl, filename } = tasks[i];
+
         try {
-          fileSize = await downloadFileWithProgress({
-            folder: options.folder,
-            nft: options.nfts[i],
-            current: i,
-            total: options.nfts.length,
+          const sanitizedFilename = sanitizeFilename(filename);
+          if (sanitizedFilename !== filename) {
+            throw new Error(`Filename ${filename} contains invalid characters. Filename sanitized to ${sanitizedFilename}`);
+          }
+          
+          const filePath = path.join(folder, sanitizedFilename);
+
+          await downloadFile(downloadUrl, filePath, {
+            onProgress: (progress) => {
+              mainWindow?.webContents.send('multipleDownloadProgress', {
+                progress,
+                url: downloadUrl,
+                index: i,
+                total: tasks.length,
+              });
+            },
           });
-          totalDownloadedSize += fileSize;
+
+          const fileStats = await fs.promises.stat(filePath);
+
+          totalDownloadedSize += fileStats.size;
           successFileCount++;
         } catch (e: any) {
           if (e.message === 'download aborted' && abortDownloadingFiles) {
             break;
           }
-          mainWindow?.webContents.send('errorDownloadingUrl', options.nfts[i]);
+          mainWindow?.webContents.send('errorDownloadingUrl', downloadUrl);
           errorFileCount++;
         }
       }