From 41bcf9524ad28b43c644cbaee01fcc133181edd1 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Mon, 29 Dec 2025 01:16:56 +0200
Subject: [PATCH] feat(client/pdf): integrate pdf.js

---
 apps/client/src/widgets/type_widgets/File.tsx | 27 ++++++++++---------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/apps/client/src/widgets/type_widgets/File.tsx b/apps/client/src/widgets/type_widgets/File.tsx
index 266526754..224649291 100644
--- a/apps/client/src/widgets/type_widgets/File.tsx
+++ b/apps/client/src/widgets/type_widgets/File.tsx
@@ -1,10 +1,11 @@
-import { useNoteBlob } from "../react/hooks";
 import "./File.css";
-import { TypeWidgetProps } from "./type_widget";
+
 import FNote from "../../entities/fnote";
+import { t } from "../../services/i18n";
 import { getUrlForDownload } from "../../services/open";
 import Alert from "../react/Alert";
-import { t } from "../../services/i18n";
+import { useNoteBlob } from "../react/hooks";
+import { TypeWidgetProps } from "./type_widget";
 
 const TEXT_MAX_NUM_CHARS = 5000;
 
@@ -12,16 +13,16 @@ export default function File({ note }: TypeWidgetProps) {
     const blob = useNoteBlob(note);
 
     if (blob?.content) {
-        return <TextPreview content={blob.content} />
+        return <TextPreview content={blob.content} />;
     } else if (note.mime === "application/pdf") {
-        return <PdfPreview note={note} />
+        return <PdfPreview note={note} />;
     } else if (note.mime.startsWith("video/")) {
-        return <VideoPreview note={note} />
+        return <VideoPreview note={note} />;
     } else if (note.mime.startsWith("audio/")) {
-        return <AudioPreview note={note} />
-    } else {
-        return <NoPreview />
+        return <AudioPreview note={note} />;
     }
+    return <NoPreview />;
+
 }
 
 function TextPreview({ content }: { content: string }) {
@@ -37,14 +38,14 @@ function TextPreview({ content }: { content: string }) {
             )}
             <pre class="file-preview-content">{trimmedContent}</pre>
         </>
-    )
+    );
 }
 
 function PdfPreview({ note }: { note: FNote }) {
     return (
         <iframe
             class="pdf-preview"
-            src={getUrlForDownload(`api/notes/${note.noteId}/open`)} />
+            src={`pdfjs/web/viewer.html?file=../../api/notes/${note.noteId}/open`} />
     );
 }
 
@@ -56,7 +57,7 @@ function VideoPreview({ note }: { note: FNote }) {
             datatype={note?.mime}
             controls
         />
-    )
+    );
 }
 
 function AudioPreview({ note }: { note: FNote }) {
@@ -66,7 +67,7 @@ function AudioPreview({ note }: { note: FNote }) {
             src={getUrlForDownload(`api/notes/${note.noteId}/open-partial`)}
             controls
         />
-    )
+    );
 }
 
 function NoPreview() {