From 09f3a6b0ef4265377cb2cdce7b83eef634077428 Mon Sep 17 00:00:00 2001
From: Torben Buck <dev@tbuck.de>
Date: Fri, 1 May 2026 08:11:07 +0200
Subject: [PATCH] feat: add PDF attachment preview preferences

---
 index.html                          |  47 +++++---
 src/js/UserPreferences.js           |  31 ++++++
 src/js/main.js                      |  35 +++---
 src/js/ui/AttachmentModalManager.js | 162 ++++++++++++++++++++++------
 src/js/ui/MessageContentRenderer.js |   7 +-
 src/styles.css                      |  18 ++--
 tests/UIManager.test.js             |  24 ++++-
 tests/setup.js                      |  10 ++
 8 files changed, 249 insertions(+), 85 deletions(-)
 create mode 100644 src/js/UserPreferences.js

diff --git a/index.html b/index.html
index 06715e8b..89d19036 100644
--- a/index.html
+++ b/index.html
@@ -127,20 +127,12 @@
                 </div>
                 <!-- Theme Menu -->
                 <div id="themeMenu" class="theme-menu">
-                    <button id="themeToggle" class="theme-toggle" aria-label="Change theme" title="Change theme (T)">
-                        <!-- Sun Icon (for dark mode - shows sun to switch to light) -->
-                        <svg id="themeIconSun" class="theme-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                            <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v2.25m6.364.386-1.591 1.591M21 12h-2.25m-.386 6.364-1.591-1.591M12 18.75V21m-4.773-4.227-1.591 1.591M5.25 12H3m4.227-4.773L5.636 5.636M15.75 12a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0Z" />
-                        </svg>
-                        <!-- Moon Icon (for light mode - shows moon to switch to dark) -->
-                        <svg id="themeIconMoon" class="theme-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                            <path stroke-linecap="round" stroke-linejoin="round" d="M21.752 15.002A9.72 9.72 0 0 1 18 15.75c-5.385 0-9.75-4.365-9.75-9.75 0-1.33.266-2.597.748-3.752A9.753 9.753 0 0 0 3 11.25C3 16.635 7.365 21 12.75 21a9.753 9.753 0 0 0 9.002-5.998Z" />
-                        </svg>
-                        <!-- System Icon -->
-                        <svg id="themeIconSystem" class="theme-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
-                            <path stroke-linecap="round" stroke-linejoin="round" d="M9 17.25v1.007a3 3 0 0 1-.879 2.122L7.5 21h9l-.621-.621A3 3 0 0 1 15 18.257V17.25m6-12V15a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 15V5.25m18 0A2.25 2.25 0 0 0 18.75 3H5.25A2.25 2.25 0 0 0 3 5.25m18 0V12a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 12V5.25" />
-                        </svg>
-                    </button>
+                    <button id="themeToggle" class="theme-toggle" aria-label="Settings" title="Settings">
+                        <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.075.04.149.083.221.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 0 1 1.37.49l1.296 2.247a1.125 1.125 0 0 1-.26 1.431l-1.003.827c-.293.241-.438.613-.431.992a7.723 7.723 0 0 1 0 .255c-.007.378.138.75.431.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 0 1-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 0 1-.22.128c-.333.183-.583.495-.646.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.397-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.645-.87a6.52 6.52 0 0 1-.22-.127c-.326-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 0 1-1.369-.49l-1.297-2.247a1.125 1.125 0 0 1 .26-1.431l1.004-.827c.292-.241.437-.613.43-.991a6.932 6.932 0 0 1 0-.255c.007-.379-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 0 1-.26-1.43l1.297-2.247a1.125 1.125 0 0 1 1.37-.491l1.216.456c.356.133.75.072 1.076-.124.072-.044.146-.086.22-.128.333-.183.583-.495.645-.869l.214-1.28Z" />
+                            <path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
+                        </svg>
+                    </button>
                     <div id="themeMenuDropdown" class="theme-menu-dropdown">
                         <div class="theme-menu-section">
                             <div class="theme-menu-label">App Theme</div>
@@ -203,12 +195,12 @@
                             </button>
                         </div>
                         <div class="theme-menu-section">
-                            <div class="theme-menu-label">Inline Images</div>
+                            <div class="theme-menu-label">Inline Image Attachments</div>
                             <button class="theme-menu-item" data-type="inline-images" data-inline-images="collapsed">
                                 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 7.5h16.5m-16.5 4.5h9m-9 4.5h7.5" />
                                 </svg>
-                                <span>Collapsed by default</span>
+                                <span>Collapsed</span>
                                 <svg class="check-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="m4.5 12.75 6 6 9-13.5" />
                                 </svg>
@@ -217,7 +209,28 @@
                                 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="m2.25 15.75 5.159-5.159a2.25 2.25 0 0 1 3.182 0l5.159 5.159m-1.5-1.5 1.409-1.409a2.25 2.25 0 0 1 3.182 0l2.159 2.159M3.75 19.5h16.5A1.5 1.5 0 0 0 21.75 18V6A1.5 1.5 0 0 0 20.25 4.5H3.75A1.5 1.5 0 0 0 2.25 6v12a1.5 1.5 0 0 0 1.5 1.5Zm11.25-10.5h.008v.008H15V9Z" />
                                 </svg>
-                                <span>Expanded by default</span>
+                                <span>Expanded</span>
+                                <svg class="check-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="m4.5 12.75 6 6 9-13.5" />
+                                </svg>
+                            </button>
+                        </div>
+                        <div class="theme-menu-section">
+                            <div class="theme-menu-label">PDF Attachments</div>
+                            <button class="theme-menu-item" data-type="pdf-attachments" data-pdf-open-mode="in-app">
+                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="M3.75 4.5h16.5v15H3.75v-15Zm3 4.5h10.5M6.75 12h10.5m-10.5 3h6" />
+                                </svg>
+                                <span>Open in app</span>
+                                <svg class="check-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="m4.5 12.75 6 6 9-13.5" />
+                                </svg>
+                            </button>
+                            <button class="theme-menu-item" data-type="pdf-attachments" data-pdf-open-mode="external">
+                                <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
+                                    <path stroke-linecap="round" stroke-linejoin="round" d="M13.5 6H5.25A2.25 2.25 0 0 0 3 8.25v10.5A2.25 2.25 0 0 0 5.25 21h10.5A2.25 2.25 0 0 0 18 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25" />
+                                </svg>
+                                <span>Open externally</span>
                                 <svg class="check-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor">
                                     <path stroke-linecap="round" stroke-linejoin="round" d="m4.5 12.75 6 6 9-13.5" />
                                 </svg>
diff --git a/src/js/UserPreferences.js b/src/js/UserPreferences.js
new file mode 100644
index 00000000..dd738aa8
--- /dev/null
+++ b/src/js/UserPreferences.js
@@ -0,0 +1,31 @@
+import { storage } from './storage.js';
+
+export const PDF_ATTACHMENT_OPEN_MODE = {
+    IN_APP: 'in-app',
+    EXTERNAL: 'external'
+};
+
+export const PDF_ATTACHMENT_OPEN_MODE_STORAGE_KEY = 'msgReader_pdfAttachmentOpenMode';
+
+export function getPdfAttachmentOpenMode() {
+    const savedValue = storage.get(
+        PDF_ATTACHMENT_OPEN_MODE_STORAGE_KEY,
+        PDF_ATTACHMENT_OPEN_MODE.IN_APP
+    );
+
+    return Object.values(PDF_ATTACHMENT_OPEN_MODE).includes(savedValue)
+        ? savedValue
+        : PDF_ATTACHMENT_OPEN_MODE.IN_APP;
+}
+
+export function setPdfAttachmentOpenMode(openMode) {
+    if (!Object.values(PDF_ATTACHMENT_OPEN_MODE).includes(openMode)) {
+        return false;
+    }
+
+    return storage.set(PDF_ATTACHMENT_OPEN_MODE_STORAGE_KEY, openMode);
+}
+
+export function pdfAttachmentsOpenInApp() {
+    return getPdfAttachmentOpenMode() === PDF_ATTACHMENT_OPEN_MODE.IN_APP;
+}
diff --git a/src/js/main.js b/src/js/main.js
index d593ffec..ff1c6789 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -5,11 +5,15 @@ import FileHandler from './FileHandler.js';
 import KeyboardManager from './KeyboardManager.js';
 import { extractMsg, extractEml } from './utils.js';
 import { isTauri, getPendingFiles, onFileOpen, onFileDrop, checkForUpdates } from './tauri-bridge.js';
-import { themeManager, THEMES, EMAIL_THEMES } from './ThemeManager.js';
+import { themeManager } from './ThemeManager.js';
 import {
     getInlineImageAttachmentVisibility,
     setInlineImageAttachmentVisibility
 } from './InlineImagePreference.js';
+import {
+    getPdfAttachmentOpenMode,
+    setPdfAttachmentOpenMode
+} from './UserPreferences.js';
 import { devModeManager } from './DevModeManager.js';
 import { DevPanel } from './ui/DevPanel.js';
 
@@ -252,6 +256,8 @@ function initTheme() {
                 document.dispatchEvent(new CustomEvent('inline-image-attachment-visibility-change', {
                     detail: { visibility: item.dataset.inlineImages }
                 }));
+            } else if (type === 'pdf-attachments') {
+                setPdfAttachmentOpenMode(item.dataset.pdfOpenMode);
             }
 
             updateThemeUI();
@@ -273,31 +279,14 @@ function initTheme() {
 }
 
 /**
- * Update theme-related UI elements
- * Updates icons, active states in dropdown menu
+ * Update settings UI elements
+ * Updates active states in dropdown menu
  */
 function updateThemeUI() {
     const savedTheme = themeManager.getSavedTheme();
-    const activeTheme = themeManager.getActiveTheme();
     const savedEmailTheme = themeManager.getSavedEmailTheme();
     const inlineImageVisibility = getInlineImageAttachmentVisibility();
-
-    // Update toggle button icon
-    const sunIcon = document.getElementById('themeIconSun');
-    const moonIcon = document.getElementById('themeIconMoon');
-    const systemIcon = document.getElementById('themeIconSystem');
-
-    sunIcon?.classList.remove('active');
-    moonIcon?.classList.remove('active');
-    systemIcon?.classList.remove('active');
-
-    if (savedTheme === THEMES.SYSTEM) {
-        systemIcon?.classList.add('active');
-    } else if (activeTheme === THEMES.DARK) {
-        sunIcon?.classList.add('active'); // Show sun when dark (to switch to light)
-    } else {
-        moonIcon?.classList.add('active'); // Show moon when light (to switch to dark)
-    }
+    const pdfAttachmentOpenMode = getPdfAttachmentOpenMode();
 
     // Update active states in dropdown menu
     document.querySelectorAll('.theme-menu-item[data-type="app"]').forEach(item => {
@@ -311,6 +300,10 @@ function updateThemeUI() {
     document.querySelectorAll('.theme-menu-item[data-type="inline-images"]').forEach(item => {
         item.classList.toggle('active', item.dataset.inlineImages === inlineImageVisibility);
     });
+
+    document.querySelectorAll('.theme-menu-item[data-type="pdf-attachments"]').forEach(item => {
+        item.classList.toggle('active', item.dataset.pdfOpenMode === pdfAttachmentOpenMode);
+    });
 }
 
 // Initialize the app when the DOM is loaded
diff --git a/src/js/ui/AttachmentModalManager.js b/src/js/ui/AttachmentModalManager.js
index 4b0a42d2..79e9e927 100644
--- a/src/js/ui/AttachmentModalManager.js
+++ b/src/js/ui/AttachmentModalManager.js
@@ -2,6 +2,7 @@ import { isTauri, openWithSystemViewer, saveFileWithDialog } from '../tauri-brid
 import { extractEml } from '../utils.js';
 import { dataUrlToArrayBuffer, decodeDataUrlText, getDataUrlBase64 } from '../encoding.js';
 import { formatContact, getContactEmail } from '../addressUtils.js';
+import { pdfAttachmentsOpenInApp } from '../UserPreferences.js';
 
 /**
  * Manages the attachment preview modal
@@ -45,6 +46,7 @@ export class AttachmentModalManager {
         this.imageViewerFallbackWidth = 960;
         this.imageViewerFallbackHeight = 720;
         this.inlineImageMetadataBySource = new Map();
+        this._pdfPreviewObjectUrl = null;
 
         // Navigation stack for nested content (e.g., attachments within nested emails)
         this.navigationStack = [];
@@ -299,13 +301,38 @@ export class AttachmentModalManager {
     }
 
     /**
-     * Checks if a MIME type is PDF
+     * Checks if a filename has a PDF extension
+     * @param {string} fileName - Filename to check
+     * @returns {boolean} True if filename ends in .pdf
+     */
+    _hasPdfExtension(fileName) {
+        return /\.pdf$/i.test(fileName || '');
+    }
+
+    /**
+     * Checks if a MIME type is a generic binary type that may hide the real type
      * @param {string} mimeType - MIME type to check
-     * @returns {boolean} True if the MIME type is PDF
+     * @returns {boolean} True if the MIME type is generic binary
      */
-    isPdf(mimeType) {
-        if (!mimeType) return false;
-        return mimeType.toLowerCase() === 'application/pdf';
+    _isGenericBinaryMime(mimeType) {
+        const normalizedMime = (mimeType || '').toLowerCase();
+        return (
+            !normalizedMime ||
+            normalizedMime === 'application/octet-stream' ||
+            normalizedMime === 'binary/octet-stream'
+        );
+    }
+
+    /**
+     * Checks if an attachment is PDF by MIME type or filename fallback
+     * @param {string} mimeType - MIME type to check
+     * @param {string} [fileName=''] - Original filename
+     * @returns {boolean} True if the attachment is PDF
+     */
+    isPdf(mimeType, fileName = '') {
+        const normalizedMime = (mimeType || '').toLowerCase();
+        if (normalizedMime === 'application/pdf') return true;
+        return this._hasPdfExtension(fileName) && this._isGenericBinaryMime(mimeType);
     }
 
     /**
@@ -339,42 +366,62 @@ export class AttachmentModalManager {
     /**
      * Checks if an attachment can be previewed in the modal
      * @param {string} mimeType - MIME type to check
+     * @param {string} [fileName=''] - Original filename
      * @returns {boolean} True if the attachment is previewable
      */
-    isPreviewable(mimeType) {
+    isPreviewable(mimeType, fileName = '') {
         return (
             this.isPreviewableImage(mimeType) ||
-            this.isPdf(mimeType) ||
+            this.isPdf(mimeType, fileName) ||
             this.isText(mimeType) ||
             this.isPreviewableEml(mimeType)
         );
     }
 
     /**
-     * Checks if an attachment should be opened with system viewer (Tauri PDF)
+     * Checks if an attachment should be opened outside the modal
      * @param {Object} attachment - Attachment object
-     * @returns {boolean} True if should use system viewer
+     * @returns {boolean} True if should use the external PDF path
      */
-    _shouldOpenWithSystemViewer(attachment) {
-        return isTauri() && this.isPdf(attachment.attachMimeTag);
+    _shouldOpenPdfExternally(attachment) {
+        return (
+            this.isPdf(attachment.attachMimeTag, attachment.fileName) &&
+            !pdfAttachmentsOpenInApp()
+        );
     }
 
     /**
-     * Opens a PDF with the system viewer (Tauri only)
+     * Opens a PDF outside the modal
      * @param {Object} attachment - Attachment object
      */
-    _openPdfWithSystemViewer(attachment) {
-        openWithSystemViewer(attachment.contentBase64, attachment.fileName).catch((err) => {
-            console.error('Failed to open PDF with system viewer:', err);
+    _openPdfExternally(attachment) {
+        if (isTauri()) {
+            openWithSystemViewer(attachment.contentBase64, attachment.fileName).catch((err) => {
+                console.error('Failed to open PDF with system viewer:', err);
+                if (this.showToast) {
+                    this.showToast('Failed to open PDF', 'error');
+                }
+            });
+            return;
+        }
+
+        try {
+            const objectUrl = this._createPdfObjectUrl(attachment);
+            const openedWindow = window.open(objectUrl, '_blank', 'noopener,noreferrer');
+            if (!openedWindow && this.showToast) {
+                this.showToast('Unable to open PDF', 'error');
+            }
+            window.setTimeout(() => URL.revokeObjectURL(objectUrl), 60000);
+        } catch (err) {
+            console.error('Failed to open PDF:', err);
             if (this.showToast) {
                 this.showToast('Failed to open PDF', 'error');
             }
-        });
+        }
     }
 
     /**
      * Opens the attachment preview modal for a specific attachment
-     * In Tauri, PDFs are opened with the system viewer instead of the modal
      * @param {Object} attachment - Attachment object to preview
      */
     open(attachment) {
@@ -383,16 +430,15 @@ export class AttachmentModalManager {
         // Clear navigation stack when opening a new attachment
         this.clearNavigationStack();
 
-        // In Tauri, open PDFs with system viewer (WebKit has issues with data: URLs)
-        if (this._shouldOpenWithSystemViewer(attachment)) {
-            this._openPdfWithSystemViewer(attachment);
+        if (this._shouldOpenPdfExternally(attachment)) {
+            this._openPdfExternally(attachment);
             return;
         }
 
         // Build list of previewable attachments if not already set
         if (this.currentAttachments) {
             this.previewableAttachments = this.currentAttachments.filter((att) =>
-                this.isPreviewable(att.attachMimeTag)
+                this.isPreviewable(att.attachMimeTag, att.fileName)
             );
         }
 
@@ -424,6 +470,7 @@ export class AttachmentModalManager {
      */
     renderAttachmentPreview(attachment) {
         this.resetImagePreviewState();
+        this._revokePdfPreviewObjectUrl();
 
         // Set filename with breadcrumb if navigating from nested content
         this.updateFilenameWithBreadcrumb(attachment.fileName);
@@ -442,13 +489,8 @@ export class AttachmentModalManager {
         // Render appropriate preview
         if (this.isPreviewableImage(attachment.attachMimeTag)) {
             this.renderImagePreview(attachment);
-        } else if (this.isPdf(attachment.attachMimeTag)) {
-            // Use object tag for better PDF compatibility with data: URLs
-            const pdfObject = document.createElement('object');
-            pdfObject.data = attachment.contentBase64;
-            pdfObject.type = 'application/pdf';
-            pdfObject.innerHTML = `<p class="text-center p-4">PDF cannot be displayed. <a href="${attachment.contentBase64}" download="${attachment.fileName}" class="text-blue-500 underline">Download here</a></p>`;
-            this.attachmentModalContent.appendChild(pdfObject);
+        } else if (this.isPdf(attachment.attachMimeTag, attachment.fileName)) {
+            this.renderPdfPreview(attachment);
         } else if (this.isText(attachment.attachMimeTag)) {
             try {
                 const base64Data = getDataUrlBase64(attachment.contentBase64);
@@ -477,6 +519,60 @@ export class AttachmentModalManager {
         this.updateNavButtons();
     }
 
+    /**
+     * Creates an object URL for a PDF attachment
+     * @param {Object} attachment - PDF attachment object
+     * @returns {string} Object URL
+     */
+    _createPdfObjectUrl(attachment) {
+        const blob = new Blob(
+            [dataUrlToArrayBuffer(attachment.contentBase64)],
+            { type: 'application/pdf' }
+        );
+        return URL.createObjectURL(blob);
+    }
+
+    /**
+     * Releases the current in-modal PDF object URL
+     */
+    _revokePdfPreviewObjectUrl() {
+        if (this._pdfPreviewObjectUrl) {
+            URL.revokeObjectURL(this._pdfPreviewObjectUrl);
+            this._pdfPreviewObjectUrl = null;
+        }
+    }
+
+    /**
+     * Renders a PDF attachment in the preview modal
+     * @param {Object} attachment - PDF attachment object
+     */
+    renderPdfPreview(attachment) {
+        const pdfObject = document.createElement('object');
+        pdfObject.className = 'attachment-pdf-preview';
+        pdfObject.type = 'application/pdf';
+
+        try {
+            this._pdfPreviewObjectUrl = this._createPdfObjectUrl(attachment);
+            pdfObject.data = this._pdfPreviewObjectUrl;
+        } catch (err) {
+            console.error('Error building PDF preview:', err);
+        }
+
+        const fallback = document.createElement('p');
+        fallback.className = 'text-center p-4';
+        fallback.textContent = 'PDF cannot be displayed. ';
+
+        const downloadLink = document.createElement('a');
+        downloadLink.href = attachment.contentBase64;
+        downloadLink.download = attachment.fileName;
+        downloadLink.className = 'text-blue-500 underline';
+        downloadLink.textContent = 'Download here';
+
+        fallback.appendChild(downloadLink);
+        pdfObject.appendChild(fallback);
+        this.attachmentModalContent.appendChild(pdfObject);
+    }
+
     /**
      * Renders an image preview with zoom support inside a fixed viewer area
      * @param {Object} attachment - Image attachment to preview
@@ -909,9 +1005,9 @@ export class AttachmentModalManager {
                 attachmentsList.className = 'nested-email-attachments-list';
 
                 emailData.attachments.forEach((att) => {
-                    const isPreviewable = this.isPreviewable(att.attachMimeTag);
+                    const isPreviewable = this.isPreviewable(att.attachMimeTag, att.fileName);
                     const isImage = this.isPreviewableImage(att.attachMimeTag);
-                    const isPdf = this.isPdf(att.attachMimeTag);
+                    const isPdf = this.isPdf(att.attachMimeTag, att.fileName);
                     const isText = this.isText(att.attachMimeTag);
                     const isEml = this.isPreviewableEml(att.attachMimeTag);
 
@@ -966,9 +1062,8 @@ export class AttachmentModalManager {
                             if (downloadBtn) {
                                 e.stopPropagation();
                                 this.downloadAttachment(att);
-                            } else if (this._shouldOpenWithSystemViewer(att)) {
-                                // PDF in Tauri: open with system viewer instead of modal preview
-                                this._openPdfWithSystemViewer(att);
+                            } else if (this._shouldOpenPdfExternally(att)) {
+                                this._openPdfExternally(att);
                             } else {
                                 this.pushToStack(attachment);
                                 this.renderAttachmentPreview(att);
@@ -1072,6 +1167,7 @@ export class AttachmentModalManager {
     close() {
         if (!this.attachmentModal) return;
 
+        this._revokePdfPreviewObjectUrl();
         this.attachmentModal.classList.remove('active');
         this.attachmentModalContent.innerHTML = '';
         this.attachmentModalContent.classList.remove('attachment-modal-content--image');
diff --git a/src/js/ui/MessageContentRenderer.js b/src/js/ui/MessageContentRenderer.js
index 04276ac8..6e7a5b8a 100644
--- a/src/js/ui/MessageContentRenderer.js
+++ b/src/js/ui/MessageContentRenderer.js
@@ -502,7 +502,10 @@ export class MessageContentRenderer {
     renderAttachmentItems(items) {
         return items
             .map(({ attachment, index }) => {
-                const isPreviewable = this.attachmentModal?.isPreviewable(attachment.attachMimeTag);
+                const isPreviewable = this.attachmentModal?.isPreviewable(
+                    attachment.attachMimeTag,
+                    attachment.fileName
+                );
 
                 if (isPreviewable) {
                     return `
@@ -563,7 +566,7 @@ export class MessageContentRenderer {
      */
     getAttachmentItemIcon(attachment) {
         const isImage = this.attachmentModal?.isPreviewableImage(attachment.attachMimeTag);
-        const isPdf = this.attachmentModal?.isPdf(attachment.attachMimeTag);
+        const isPdf = this.attachmentModal?.isPdf(attachment.attachMimeTag, attachment.fileName);
         const isText = this.attachmentModal?.isText(attachment.attachMimeTag);
         const isEml = this.attachmentModal?.isPreviewableEml(attachment.attachMimeTag);
 
diff --git a/src/styles.css b/src/styles.css
index 435f2f27..543d8b2f 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -861,12 +861,18 @@
 
     .attachment-modal-content iframe,
     .attachment-modal-content object {
-        width: 80vw;
-        height: 80vh;
+        flex: 1;
+        width: 100%;
+        height: 100%;
+        min-width: 0;
         border: none;
         border-radius: 0 0 1rem 1rem;
     }
 
+    .attachment-modal-content .attachment-pdf-preview {
+        min-height: min(80vh, 860px);
+    }
+
     .attachment-modal-nav {
         position: absolute;
         top: 50%;
@@ -1477,14 +1483,6 @@
         height: 1.25rem;
     }
 
-    .theme-toggle .theme-icon {
-        display: none;
-    }
-
-    .theme-toggle .theme-icon.active {
-        display: block;
-    }
-
     /* Theme dropdown menu */
     .theme-menu {
         position: relative;
diff --git a/tests/UIManager.test.js b/tests/UIManager.test.js
index 30052623..6d3a1dd9 100644
--- a/tests/UIManager.test.js
+++ b/tests/UIManager.test.js
@@ -21,6 +21,7 @@ import { AttachmentModalManager } from '../src/js/ui/AttachmentModalManager.js';
 import { MessageListRenderer } from '../src/js/ui/MessageListRenderer.js';
 import { MessageContentRenderer } from '../src/js/ui/MessageContentRenderer.js';
 import { isTauri, openWithSystemViewer, saveFileWithDialog } from '../src/js/tauri-bridge.js';
+import { setPdfAttachmentOpenMode } from '../src/js/UserPreferences.js';
 
 /**
  * Creates a mock message object for testing
@@ -456,7 +457,10 @@ describe('AttachmentModalManager', () => {
         test('isPdf', () => {
             expect(modal.isPdf('application/pdf')).toBe(true);
             expect(modal.isPdf('APPLICATION/PDF')).toBe(true);
+            expect(modal.isPdf('application/octet-stream', 'report.pdf')).toBe(true);
+            expect(modal.isPdf('', 'report.pdf')).toBe(true);
             expect(modal.isPdf('image/png')).toBe(false);
+            expect(modal.isPdf('image/png', 'report.pdf')).toBe(false);
             expect(modal.isPdf(null)).toBe(false);
         });
 
@@ -720,7 +724,9 @@ describe('AttachmentModalManager', () => {
             };
             modal.setAttachments([att]);
             modal.renderAttachmentPreview(att);
-            expect(modal.attachmentModalContent.querySelector('object')).toBeTruthy();
+            const object = modal.attachmentModalContent.querySelector('object');
+            expect(object).toBeTruthy();
+            expect(object.data).toBe('blob:mock-object-url');
         });
 
         test('creates pre for text', () => {
@@ -872,8 +878,22 @@ describe('AttachmentModalManager', () => {
     });
 
     describe('Tauri PDF handling', () => {
-        test('opens PDF with system viewer in Tauri', () => {
+        test('previews PDF in app by default in Tauri', () => {
+            isTauri.mockReturnValue(true);
+            const pdfAtt = {
+                fileName: 'test.pdf',
+                attachMimeTag: 'application/pdf',
+                contentBase64: 'data:application/pdf;base64,abc'
+            };
+            modal.open(pdfAtt);
+            expect(openWithSystemViewer).not.toHaveBeenCalled();
+            expect(modal.attachmentModal.classList.contains('active')).toBe(true);
+            expect(modal.attachmentModalContent.querySelector('object')).toBeTruthy();
+        });
+
+        test('opens PDF with system viewer in Tauri when preference is external', () => {
             isTauri.mockReturnValue(true);
+            setPdfAttachmentOpenMode('external');
             const pdfAtt = {
                 fileName: 'test.pdf',
                 attachMimeTag: 'application/pdf',
diff --git a/tests/setup.js b/tests/setup.js
index e16efe46..0d650415 100644
--- a/tests/setup.js
+++ b/tests/setup.js
@@ -41,6 +41,16 @@ Object.defineProperty(window, 'matchMedia', {
     }))
 });
 
+Object.defineProperty(URL, 'createObjectURL', {
+    writable: true,
+    value: jest.fn(() => 'blob:mock-object-url')
+});
+
+Object.defineProperty(URL, 'revokeObjectURL', {
+    writable: true,
+    value: jest.fn()
+});
+
 // Reset localStorage before each test
 beforeEach(() => {
     localStorageMock.store = {};