v0.0.4

src/web/js/40-messages-reader.js

@@ -326,10 +326,9 @@ function renderMessageDetail(detail) {
       event.preventDefault();
       const filename = String(attachment.filename || "").toLowerCase();
       const contentType = String(attachment.content_type || attachment.contentType || "").toLowerCase();
-      const actions = [
-        { label: "Open", action: () => openAttachment(detail.folder, detail.uid, attachment) },
-        { label: "Download", action: () => downloadAttachment(detail.folder, detail.uid, attachment) },
-      ];
+      const actions = [];
+      if (attachmentCanPreview(attachment)) actions.push({ label: "Preview", action: () => openAttachment(detail.folder, detail.uid, attachment) });
+      actions.push({ label: "Download", action: () => downloadAttachment(detail.folder, detail.uid, attachment) });
       if (contentType.includes("text/calendar") || filename.endsWith(".ics")) actions.push("separator", { label: "Add to calendar", action: () => importCalendarAttachment(detail.folder, detail.uid, attachment) });
       if (contentType.includes("text/vcard") || contentType.includes("text/x-vcard") || filename.endsWith(".vcf")) actions.push("separator", { label: "Import contact", action: () => importVcardAttachment(detail.folder, detail.uid, attachment) });
       if ((detail.attachments || []).length > 1) actions.push("separator", { label: "Download all as ZIP", action: () => downloadAllAttachmentsZip(detail) });
@@ -514,27 +513,59 @@ function attachmentMime(attachment, blob = null) {
   return String(blob?.type || attachment?.content_type || attachment?.contentType || "application/octet-stream").toLowerCase();
 }
 
-function attachmentCanPreview(attachment) {
+function attachmentPreviewLimitBytes(attachment) {
   const mime = attachmentMime(attachment);
   const filename = String(attachment?.filename || "").toLowerCase();
-  return mime.startsWith("image/")
-    || mime === "application/pdf"
-    || mime.startsWith("text/")
-    || mime.startsWith("video/")
-    || /\.(pdf|png|jpe?g|gif|webp|txt|log|md|csv|html?|xhtml|mp4|webm|ogv|mov)$/i.test(filename);
+  if (mime.startsWith("text/") || /\.(txt|log|md|csv|html?|xhtml)$/i.test(filename)) return 5 * 1024 * 1024;
+  if (mime.startsWith("image/") || mime === "application/pdf" || mime.startsWith("video/") || /\.(pdf|png|jpe?g|gif|webp|mp4|webm|ogv|mov)$/i.test(filename)) return 30 * 1024 * 1024;
+  return 0;
+}
+
+function attachmentCanPreview(attachment) {
+  return attachmentPreviewLimitBytes(attachment) > 0;
+}
+
+function attachmentExceedsPreviewLimit(attachment, actualSize = null) {
+  const limit = attachmentPreviewLimitBytes(attachment);
+  if (!limit) return false;
+  const size = Number(actualSize ?? attachment?.size ?? 0);
+  return Number.isFinite(size) && size > limit;
+}
+
+async function offerAttachmentDownload(folder, uid, attachment, reason) {
+  const confirmed = await appConfirm(trText(reason), {
+    title: trText("Preview unavailable"),
+    confirmLabel: trText("Download"),
+  });
+  if (confirmed) await downloadAttachment(folder, uid, attachment);
 }
 
 async function openAttachment(folder, uid, attachment) {
   try {
+    if (!attachmentCanPreview(attachment)) {
+      await offerAttachmentDownload(folder, uid, attachment, "Preview is not available for this attachment type. Download it instead?");
+      return;
+    }
+    if (attachmentExceedsPreviewLimit(attachment)) {
+      await offerAttachmentDownload(folder, uid, attachment, "This attachment is too large for preview. Download it instead?");
+      return;
+    }
     const blob = await fetchAttachmentBlob(folder, uid, attachment);
     const mime = attachmentMime(attachment, blob);
     const filename = String(attachment?.filename || "").toLowerCase();
     const isHtml = mime.includes("html") || /\.(html?|xhtml)$/i.test(filename);
     const isImage = mime.startsWith("image/") || /\.(png|jpe?g|gif|webp)$/i.test(filename);
     const isVideo = mime.startsWith("video/") || /\.(mp4|webm|ogv|mov)$/i.test(filename);
-    const safe = attachmentCanPreview({ ...attachment, content_type: mime });
-    if (!safe) return toast("Preview is not available for this attachment type", "warning");
-    if (blob.size > 30 * 1024 * 1024) return toast("Attachment is too large for preview", "warning");
+    const previewAttachment = { ...attachment, content_type: mime };
+    const safe = attachmentCanPreview(previewAttachment);
+    if (!safe) {
+      await offerAttachmentDownload(folder, uid, attachment, "Preview is not available for this attachment type. Download it instead?");
+      return;
+    }
+    if (attachmentExceedsPreviewLimit(previewAttachment, blob.size)) {
+      await offerAttachmentDownload(folder, uid, attachment, "This attachment is too large for preview. Download it instead?");
+      return;
+    }
 
     const dialog = el("dialog", "dialog attachment-preview-dialog");
     const card = el("div", "dialog-card attachment-preview-card");
@@ -570,7 +601,6 @@ async function openAttachment(folder, uid, attachment) {
       video.preload = "metadata";
       body.append(video);
     } else if (isHtml) {
-      if (blob.size > 5 * 1024 * 1024) return toast("HTML attachment is too large for inline preview", "warning");
       const frame = document.createElement("iframe");
       frame.setAttribute("sandbox", "");
       frame.referrerPolicy = "no-referrer";
@@ -579,7 +609,6 @@ async function openAttachment(folder, uid, attachment) {
       frame.srcdoc = `<!doctype html><html><head>${csp}<meta name="color-scheme" content="light"><style>body{margin:0;padding:20px;color:#202622;background:#fff;font:14px/1.55 system-ui,sans-serif}img{max-width:100%;height:auto}pre{white-space:pre-wrap}</style></head><body>${safeHtml}</body></html>`;
       body.append(frame);
     } else {
-      if (blob.size > 5 * 1024 * 1024) return toast("Text attachment is too large for inline preview", "warning");
       const pre = document.createElement("pre");
       pre.textContent = await blob.text();
       body.append(pre);