From 6cb4984e46a07c933baf36ad21c66e650ee8d0de Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Mon, 3 Nov 2025 14:46:03 +0200
Subject: [PATCH 1/3] check initVuePdfEmbed before intersectionobserver API

---
 src/components/file_mode/ThumbnailView.vue | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/file_mode/ThumbnailView.vue b/src/components/file_mode/ThumbnailView.vue
index 16dc2d9..ed07b7f 100644
--- a/src/components/file_mode/ThumbnailView.vue
+++ b/src/components/file_mode/ThumbnailView.vue
@@ -153,11 +153,14 @@ const { doc } = useVuePdfEmbed({
   source: pdfSource,
 });
 
+const initVuePdfEmbed = computed(()=> props.showInlinePDF && isPDF.value)
+
 const pageNums = computed(() =>
   doc.value ? [...Array(doc.value.numPages + 1).keys()].slice(1) : []
 );
 
 const resetPageIntersectionObserver = () => {
+  if(!initVuePdfEmbed.value) return
   pageIntersectionObserver?.disconnect()
   pageIntersectionObserver = new IntersectionObserver((entries) => {
     entries.forEach((entry) => {
@@ -177,17 +180,16 @@ const resetPageIntersectionObserver = () => {
 };
 
 watch(pageNums, (newPageNums) => {
+  if(!initVuePdfEmbed.value) return
   pageVisibility.value = { [newPageNums[0]]: true }
   pageRefs.value = []
   nextTick(resetPageIntersectionObserver)
 });
 
 watch(source, (newSource) => {
-    if (isPDF.value) {
-      pdfSource.value = newSource;
-    }
-  }
-);
+  if(!initVuePdfEmbed.value) return
+  pdfSource.value = isPDF.value ? newSource : null;
+});
 
 const loadingProgress = computed(() => {
   if (isEventAttachment(item)) {

From 9d43515067c695a41f490aef9003493eaf35154f Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Mon, 3 Nov 2025 16:23:18 +0200
Subject: [PATCH 2/3] fix for pdf rendering issue

---
 src/components/file_mode/ThumbnailView.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/file_mode/ThumbnailView.vue b/src/components/file_mode/ThumbnailView.vue
index ed07b7f..6c9ba78 100644
--- a/src/components/file_mode/ThumbnailView.vue
+++ b/src/components/file_mode/ThumbnailView.vue
@@ -252,6 +252,7 @@ onBeforeUnmount(() => {
 .pdf-container {
   padding: 24px 16px;
   margin-top: 200px;
+  height: 100vh;
 
   & > * {
     margin: 30px auto 0 auto;

From 705d38456ad2fca89c7724b37aa36b7c297aeb8e Mon Sep 17 00:00:00 2001
From: 10G Meow <10gmeow@gmail.com>
Date: Mon, 3 Nov 2025 16:49:31 +0200
Subject: [PATCH 3/3] set pdf width on large device

---
 src/components/file_mode/ThumbnailView.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/file_mode/ThumbnailView.vue b/src/components/file_mode/ThumbnailView.vue
index 6c9ba78..893eaac 100644
--- a/src/components/file_mode/ThumbnailView.vue
+++ b/src/components/file_mode/ThumbnailView.vue
@@ -25,6 +25,7 @@
             v-if="pageVisibility[pageNum]"
             :source="doc"
             :page="pageNum"
+            :width="!util.isMobileOrTabletBrowser() ? 800 : undefined"
           />
         </div>
       </div>
@@ -46,6 +47,7 @@ import { Attachment } from "../../models/attachment";
 import ImageWithProgress from "../ImageWithProgress.vue";
 import VuePdfEmbed, { useVuePdfEmbed } from 'vue-pdf-embed';
 import { Source } from 'vue-pdf-embed/types';
+import util from "@/plugins/utils";
 
 function isEventAttachment(source: EventAttachment | Attachment | undefined): source is EventAttachment {
     return (source as EventAttachment)?.event !== undefined;
@@ -250,8 +252,7 @@ onBeforeUnmount(() => {
 }
 
 .pdf-container {
-  padding: 24px 16px;
-  margin-top: 200px;
+  margin-top: 100px;
   height: 100vh;
 
   & > * {