I have used JSzip for my project to provide ZIP file downloads. I came around some requirement which requires multiple ZIP files to be inside a single ZIP file. I have tried multiple ways to achieve this but still can't move forward as it downloads a empty ZIP only

I have attached my code here

downLoadFilesAsZip = async(item) => {
const zip1 = new JSZip();
for (const index in item.docLinks) {
  const url = item.docLinks[index];
  let linkParts = url.split("?");
  let filename = linkParts[0].substring(linkParts[0].lastIndexOf('/')+1);
  console.log("indexFiles",index);
  const response = await axios({
    url: url,
    method: 'GET',
    responseType: 'blob',
    headers: {
      'Content-Type': 'application/json',
    }
  });
  zip1.file(filename,response.data);

}
await zip1.generateAsync({ type: 'blob' })
  .then((blob) => {
    saveAs(blob, `${item.type}/${item.name}.zip`)
  })

}

downLoadAllAsZip = () => {
  {
    this.state.docGroups.length !== 0 && this.state.docGroups.map((item) => {
      if(item.docLinks !== null && item.docLinks.length > 0){
          return(
            this.downLoadFilesAsZip(item)
          );
      }
    })
  }  
}

This below code gives 10 to 15 separate zip file downloads

And I have a button where I pass my input to this function downLoadAllAsZip()

It is okay to have multiple folders instead of mutiple zip also but it has to be inside a single ZIP file.