Download S3 directory as .zip on Retool

readme.md

Firstly, you must include JSZip library your retool page. I used this https://unpkg.com/jszip@3.10.1/dist/jszip.min.js .

Secondly, I created 2 Amazon S3 resource:

• Get object (named as getObjectFromS3)
• List objects (names as listObjectsFromS3)

And I created a Javascript query like on downloadDirectoryAsZip.js

Lastly if you don't want to see a lot of success notifications you must turn off notifications on query Response tab.

I hope this help.

downloadDirectoryAsZip.js

const projectId = projectstable.selectedRow.data._id
const zip = new JSZip();

const { Contents } = await listObjectsFromS3.trigger({
  additionalScope: {
    projectId
  }
});


if (!Contents) return;
const promises = [];

for (const node of Contents) {
  if (!node.Key.endsWith("/")) { // if node is a file
    promises.push(
      getObjectFromS3.trigger({ additionalScope: { key: node.Key } }).then((res) => {
        const Body = res.IsJson ? JSON.stringify(res.Body, null, 2) : res.Body;
        return { Body, Key: node.Key }
      })
    )
  }
}

await Promise.all(promises).then((results) => {
  for (const { Body, Key } of results) {
    zip.file(Key, Body, { base64: isBase64(Body) });
  }
});

zip.generateAsync({
    type: "base64"
}).then((base64file) => {
  utils.downloadFile({ base64Binary: base64file }, projectId, "zip");
}).catch((err) => {
  utils.showNotification({title: "Error", description: err, notificationType: "Error"});
})

function isBase64(body) {
  return /^([A-Za-z0-9+/]{4})*([A-Za-z0-9+/]{3}=|[A-Za-z0-9+/]{2}==)?$/.test(body);
}