I am downloading multiple files using electron-dl but progressbar is getting corrupted

I am developing an application using React and electron. I need to download 2 files. I am downloading two files with .exe and .svg extensions. However, because the .svg file is small in size, the download ends immediately. In fact, while there is a file with a total size of 5 megabytes, since the svg is 128kb, the progressbar reaches 100% when downloading the svg file. However, even though there are still 4.5 megabytes of undownloaded files, the download acts as if it's completely finished.

main.ts

ipcMain.on('download', (event, info) => {
info.properties.onTotalProgress = (status) =>
  mainWindow.webContents.send('download progress', status);
download(BrowserWindow.getFocusedWindow(), info.url, info.properties)
.then((dl) => mainWindow.webContents.send('download complete', dl.getSavePath())
).catch(console.error);

App.tsx

 /*Download*/
 const downloadPath = path.resolve('/', './exes');
  const downloadPathWindows = `${downloadPath}\\${index}`;
  ipcRenderer.send('download', {
    url: `https://adv.com${book.SmartBookUrl}`,
    properties: {
      directory: downloadPathWindows,
    },
  });
  ipcRenderer.send('download', {
    url: `https://adv.com${book.CoverImageUrl}`,
    properties: {
      directory: downloadPathWindows,
    },
  });


  /*Progress Bar*/
  ipcRenderer.on('download progress', (event, progress) => {
     const progressInPercentages = Math.floor(progress.percent * 100);
     setprogressNumber(progressInPercentages);
  });


  /*Download Complate*/
  ipcRenderer.on('download complete', (event) => {
     setprogressNumber(0);
  };