feat: update SDK and GUI versions, add debugger protection settings

- Updated SDK_DECODER_SEMVER to "1.3.0" and GUI_SEMVER to "1.2.4" in config.ini. - Updated MailViewer component to handle PDF already open error and improved iframe handling. - Removed deprecated useMsgConverter setting from settings page. - Added IsDebuggerRunning function to check for attached debuggers and quit the app if detected. - Enhanced PDF viewer to prevent infinite loading and improved error handling. Co-Authored-By: Laky-64 <iraci.matteo@gmail.com>
2026-02-04 23:25:20 +01:00
parent 0cda0a26fc
commit e7d1850a63
24 changed files with 1053 additions and 709 deletions
--- a/frontend/.gitignore
+++ b/frontend/.gitignore
@@ -25,3 +25,6 @@ vite.config.ts.timestamp-*
 # Paraglide
 src/lib/paraglide
 project.inlang/cache/
+
+# Wails
+/src/lib/wailsjs
--- a/frontend/messages/en.json
+++ b/frontend/messages/en.json
@@ -85,5 +85,9 @@
 	"mail_pec_signed_badge": "Signed mail",
 	"mail_pec_feature_warning": "PEC detected: some features may be limited.",
 	"mail_sign_label": "Sign:",
-	"mail_loading_msg_conversion": "Converting MSG file... This might take a while."
+	"mail_loading_msg_conversion": "Converting MSG file... This might take a while.",
+	"mail_pdf_already_open": "The PDF is already open in another window.",
+	"settings_danger_debugger_protection_label": "Enable attached debugger protection",
+	"settings_danger_debugger_protection_hint": "This will prevent the app from being debugged by an attached debugger.",
+	"settings_danger_debugger_protection_info": "Info: This actions are currently not configurable and is always enabled for private builds."
 }
--- a/frontend/messages/it.json
+++ b/frontend/messages/it.json
@@ -34,7 +34,7 @@
 	"settings_msg_converter_description": "Configura come vengono elaborati i file MSG.",
 	"settings_msg_converter_label": "Usa convertitore MSG in EML",
 	"settings_msg_converter_hint": "Usa un'applicazione esterna per convertire i file .MSG in .EML. Disabilitalo per usare la versione OSS (meno accurata).",
-	"settings_danger_zone_title": "Zona Pericolo",
+	"settings_danger_zone_title": "Zona Pericolosa",
 	"settings_danger_zone_description": "Azioni avanzate. Procedere con cautela.",
 	"settings_danger_devtools_label": "Apri DevTools",
 	"settings_danger_devtools_hint": "A causa di limitazioni del framework, i DevTools devono essere aperti manualmente. Per aprire i DevTools, premi Ctrl+Shift+F12.",
@@ -85,5 +85,9 @@
 	"mail_pec_signed_badge": "Mail firmata",
 	"mail_pec_feature_warning": "PEC rilevata: alcune funzionalità potrebbero essere limitate.",
 	"mail_sign_label": "Firma:",
-	"mail_loading_msg_conversion": "Conversione file MSG in corso... Potrebbe richiedere del tempo."
+	"mail_loading_msg_conversion": "Conversione file MSG in corso... Potrebbe richiedere del tempo.",
+	"mail_pdf_already_open": "Il file PDF è già aperto in una finestra separata.",
+	"settings_danger_debugger_protection_label": "Abilita protezione da debugger",
+	"settings_danger_debugger_protection_hint": "Questo impedirà che il debug dell'app venga eseguito da un debugger collegato.",
+	"settings_danger_debugger_protection_info": "Info: Questa azione non è attualmente configurabile ed è sempre abilitata per le build private."
 }
--- a/frontend/package.json.md5
+++ b/frontend/package.json.md5
@@ -1 +1 @@
-80dcc9e81c52df44518195ddfd550d26
+3c4a64d0cfb34e86fac16fceae842e43
--- a/frontend/src/lib/components/dashboard/MailViewer.svelte
+++ b/frontend/src/lib/components/dashboard/MailViewer.svelte
@@ -1,12 +1,11 @@
 <script lang="ts">
-  import { X, MailOpen, Image, FileText, File, ShieldCheck, Shield, Signature, FileUser, Loader2 } from "@lucide/svelte";
+  import { X, MailOpen, Image, FileText, File, ShieldCheck, Shield, Signature, FileCode, Loader2 } from "@lucide/svelte";
  import { ShowOpenFileDialog, ReadEML, OpenPDF, OpenImageWindow, OpenPDFWindow, OpenImage, ReadMSG, ReadPEC, OpenEMLWindow } from "$lib/wailsjs/go/main/App";
  import type { internal } from "$lib/wailsjs/go/models";
  import { sidebarOpen } from "$lib/stores/app";
  import { onDestroy, onMount } from "svelte";
  import { toast } from "svelte-sonner";
  import { EventsOn, WindowShow, WindowUnminimise } from "$lib/wailsjs/runtime/runtime";
-  import type { SupportedFileTypePreview } from "$lib/types";
  import { mailState } from "$lib/stores/mail-state.svelte";
  import { settingsStore } from "$lib/stores/settings.svelte";
  import * as m from "$lib/paraglide/messages";
@@ -15,6 +14,9 @@
  let isLoading = $state(false);
  let loadingText = $state("");

+
+  let iFrameUtilHTML = "<style>body{margin:0;padding:20px;font-family:sans-serif;} a{pointer-events:none!important;cursor:default!important;}</style><script>function handleWheel(event){if(event.ctrlKey){event.preventDefault();}}document.addEventListener('wheel',handleWheel,{passive:false});<\/script>";
+
  function onClear() {
    mailState.clear();
  }
@@ -22,7 +24,7 @@
  $effect(() => {
    console.log("Current email changed:", mailState.currentEmail);
    if(mailState.currentEmail !== null) {
-        sidebarOpen.set(false);
+      sidebarOpen.set(false);
    }
    console.log(mailState.currentEmail?.attachments)
  })
@@ -47,21 +49,12 @@
              let emlContent;
              
              if (lowerArg.endsWith(".msg")) {
-                  const useExt = settingsStore.settings.useMsgConverter ?? true;
-                  if (useExt) {
-                     loadingText = m.mail_loading_msg_conversion();
-                  }
-                  emlContent = await ReadMSG(arg, useExt);
-                  if(emlContent.isPec) {
-                     toast.warning(m.mail_pec_feature_warning());
-                  }
+                  loadingText = m.mail_loading_msg_conversion();
+                  emlContent = await ReadMSG(arg, true);
              } else {
                  // EML handling
                  try {
                    emlContent = await ReadPEC(arg);
-                    if(emlContent.isPec) {
-                      toast.warning(m.mail_pec_feature_warning());
-                    }
                  } catch (e) {
                    console.warn("ReadPEC failed, trying ReadEML:", e);
                    emlContent = await ReadEML(arg);
@@ -103,9 +96,13 @@
      } else {
         await OpenPDF(base64Data, filename);
      }
-    } catch (error) {
+    } catch (error: string | any) {
+      if(error.includes(filename) && error.includes("already open")) {
+        toast.error(m.mail_pdf_already_open());
+        return;
+      }
      console.error("Failed to open PDF:", error);
-        toast.error(m.mail_error_pdf());
+      toast.error(m.mail_error_pdf());
    }
  }

@@ -141,17 +138,11 @@
        // If the file is .eml, otherwise if is .msg, read accordingly
        let email: internal.EmailData;
        if(result.toLowerCase().endsWith(".msg")) {
-          const useExt = settingsStore.settings.useMsgConverter ?? true;
-          if (useExt) {
-             loadingText = m.mail_loading_msg_conversion();
-          }
-          email = await ReadMSG(result, useExt);
+          loadingText = m.mail_loading_msg_conversion();
+          email = await ReadMSG(result, true);
        } else {
          email = await ReadEML(result);
        }
-        if(email.isPec) {
-          toast.warning(m.mail_pec_feature_warning(), {duration: 10000});
-        }
        mailState.setParams(email);
        sidebarOpen.set(false);

@@ -182,15 +173,10 @@
    return "";
  }

-  function getFileExtension(filename: string): string {
-    return filename.slice((filename.lastIndexOf(".") - 1 >>> 0) + 2).toLowerCase();
-  }
-
-  function shouldPreview(filename: string): boolean {
-    if (!settingsStore.settings.useBuiltinPreview) return false;
-    const ext = getFileExtension(filename);
-    const supported = settingsStore.settings.previewFileSupportedTypes || [];
-    return supported.includes(ext as SupportedFileTypePreview);
+  function handleWheel(event: WheelEvent) {
+    if (event.ctrlKey) {
+      event.preventDefault();
+    }
  }
 </script>

@@ -290,7 +276,7 @@
                    class="att-btn pdf"
                    onclick={() => openPDFHandler(arrayBufferToBase64(att.data), att.filename)}
                  >
-                    <FileText size="15" />
+                    <FileText />
                    <span class="att-name">{att.filename}</span>
                  </button>
                {:else if att.filename.toLowerCase().endsWith(".eml")}
@@ -316,7 +302,7 @@
                    href={`data:${att.contentType};base64,${arrayBufferToBase64(att.data)}`}
                    download={att.filename}
                  >
-                    <FileUser size="14" />
+                    <FileCode size="14" />
                    <span class="att-name">{att.filename}</span>
                  </a>
                {:else}
@@ -342,11 +328,11 @@

        <div class="email-body-wrapper">
          <iframe
-            srcdoc={mailState.currentEmail.body +
-              "<style>body{margin:0;padding:20px;font-family:sans-serif;} a{pointer-events:none!important;cursor:default!important;}</style>"}
+            srcdoc={mailState.currentEmail.body + iFrameUtilHTML}
            title="Email Body"
            class="email-iframe"
-            sandbox="allow-same-origin"
+            sandbox="allow-same-origin allow-scripts"
+            onwheel={handleWheel}
          ></iframe>
        </div>
      </div>
@@ -641,28 +627,6 @@
    font-style: italic;
  }

-  .badged-row {
-    display: flex;
-    gap: 8px;
-    align-items: center;
-  }
-
-  .signed-badge {
-    display: inline-flex;
-    align-items: center;
-    gap: 4px;
-    background: rgba(239, 68, 68, 0.15);
-    color: #f87171;
-    border: 1px solid rgba(239, 68, 68, 0.3);
-    padding: 2px 6px;
-    border-radius: 6px;
-    font-size: 11px;
-    font-weight: 700;
-    vertical-align: middle;
-    user-select: none;
-    width: fit-content;
-  }
-
  .pec-badge {
    display: inline-flex;
    align-items: center;
--- a/frontend/src/lib/stores/settings.svelte.ts
+++ b/frontend/src/lib/stores/settings.svelte.ts
@@ -5,9 +5,11 @@ import { getFromLocalStorage, saveToLocalStorage } from "$lib/utils/localStorage
 const STORAGE_KEY = "emly_gui_settings";

 const defaults: EMLy_GUI_Settings = {
-    selectedLanguage: "en",
+    selectedLanguage: "it",
    useBuiltinPreview: true,
+    useBuiltinPDFViewer: true,
    previewFileSupportedTypes: ["jpg", "jpeg", "png"],
+    enableAttachedDebuggerProtection: true,
 };

 class SettingsStore {
--- a/frontend/src/lib/types.d.ts
+++ b/frontend/src/lib/types.d.ts
@@ -6,8 +6,8 @@ interface EMLy_GUI_Settings {
    selectedLanguage: SupportedLanguages = "en" | "it";
    useBuiltinPreview: boolean;
    useBuiltinPDFViewer?: boolean;
-    useMsgConverter?: boolean;
    previewFileSupportedTypes?: SupportedFileTypePreview[];
+    enableAttachedDebuggerProtection?: boolean;
 }

 type SupportedLanguages = "en" | "it";
--- a/frontend/src/lib/wailsjs/go/main/App.d.ts
+++ b/frontend/src/lib/wailsjs/go/main/App.d.ts
@@ -18,6 +18,8 @@ export function GetStartupFile():Promise<string>;

 export function GetViewerData():Promise<main.ViewerData>;

+export function IsDebuggerRunning():Promise<boolean>;
+
 export function OpenDefaultAppsSettings():Promise<void>;

 export function OpenEMLWindow(arg1:string,arg2:string):Promise<void>;
--- a/frontend/src/lib/wailsjs/go/main/App.js
+++ b/frontend/src/lib/wailsjs/go/main/App.js
@@ -3,81 +3,85 @@
 // This file is automatically generated. DO NOT EDIT

 export function CheckIsDefaultEMLHandler() {
-  return window['go']['main']['App']['CheckIsDefaultEMLHandler']();
+  return ObfuscatedCall(0, []);
 }

 export function GetConfig() {
-  return window['go']['main']['App']['GetConfig']();
+  return ObfuscatedCall(1, []);
 }

 export function GetImageViewerData() {
-  return window['go']['main']['App']['GetImageViewerData']();
+  return ObfuscatedCall(2, []);
 }

 export function GetMachineData() {
-  return window['go']['main']['App']['GetMachineData']();
+  return ObfuscatedCall(3, []);
 }

 export function GetPDFViewerData() {
-  return window['go']['main']['App']['GetPDFViewerData']();
+  return ObfuscatedCall(4, []);
 }

 export function GetStartupFile() {
-  return window['go']['main']['App']['GetStartupFile']();
+  return ObfuscatedCall(5, []);
 }

 export function GetViewerData() {
-  return window['go']['main']['App']['GetViewerData']();
+  return ObfuscatedCall(6, []);
+}
+
+export function IsDebuggerRunning() {
+  return ObfuscatedCall(7, []);
 }

 export function OpenDefaultAppsSettings() {
-  return window['go']['main']['App']['OpenDefaultAppsSettings']();
+  return ObfuscatedCall(8, []);
 }

 export function OpenEMLWindow(arg1, arg2) {
-  return window['go']['main']['App']['OpenEMLWindow'](arg1, arg2);
+  return ObfuscatedCall(9, [arg1, arg2]);
 }

 export function OpenImage(arg1, arg2) {
-  return window['go']['main']['App']['OpenImage'](arg1, arg2);
+  return ObfuscatedCall(10, [arg1, arg2]);
 }

 export function OpenImageWindow(arg1, arg2) {
-  return window['go']['main']['App']['OpenImageWindow'](arg1, arg2);
+  return ObfuscatedCall(11, [arg1, arg2]);
 }

 export function OpenPDF(arg1, arg2) {
-  return window['go']['main']['App']['OpenPDF'](arg1, arg2);
+  return ObfuscatedCall(12, [arg1, arg2]);
 }

 export function OpenPDFWindow(arg1, arg2) {
-  return window['go']['main']['App']['OpenPDFWindow'](arg1, arg2);
+  return ObfuscatedCall(13, [arg1, arg2]);
 }

 export function QuitApp() {
-  return window['go']['main']['App']['QuitApp']();
+  return ObfuscatedCall(14, []);
 }

 export function ReadEML(arg1) {
-  return window['go']['main']['App']['ReadEML'](arg1);
+  return ObfuscatedCall(15, [arg1]);
 }

 export function ReadMSG(arg1, arg2) {
-  return window['go']['main']['App']['ReadMSG'](arg1, arg2);
+  return ObfuscatedCall(16, [arg1, arg2]);
 }

 export function ReadMSGOSS(arg1) {
-  return window['go']['main']['App']['ReadMSGOSS'](arg1);
+  return ObfuscatedCall(17, [arg1]);
 }

 export function ReadPEC(arg1) {
-  return window['go']['main']['App']['ReadPEC'](arg1);
+  return ObfuscatedCall(18, [arg1]);
 }

 export function SaveConfig(arg1) {
-  return window['go']['main']['App']['SaveConfig'](arg1);
+  return ObfuscatedCall(19, [arg1]);
 }

 export function ShowOpenFileDialog() {
-  return window['go']['main']['App']['ShowOpenFileDialog']();
+  return ObfuscatedCall(20, []);
 }
--- a/frontend/src/routes/(app)/+layout.svelte
+++ b/frontend/src/routes/(app)/+layout.svelte
@@ -11,7 +11,7 @@
  import { Toaster } from "$lib/components/ui/sonner/index.js";
  import AppSidebar from "$lib/components/SidebarApp.svelte";
  import * as Sidebar from "$lib/components/ui/sidebar/index.js";
-  import { dev } from '$app/environment';
+  import { dev } from "$app/environment";
  import {
    PanelRightClose,
    PanelRightOpen,
@@ -30,9 +30,11 @@
    Quit,
  } from "$lib/wailsjs/runtime/runtime";
  import { RefreshCcwDot } from "@lucide/svelte";
+  import { IsDebuggerRunning, QuitApp } from "$lib/wailsjs/go/main/App";

  let versionInfo: utils.Config | null = $state(null);
  let isMaximized = $state(false);
+  let isDebugerOn: boolean = $state(false);

  async function syncMaxState() {
    isMaximized = await WindowIsMaximised();
@@ -67,9 +69,31 @@
  }

  onMount(async () => {
+    if (browser) {
+      detectDebugging();
+      setInterval(detectDebugging, 1000);
+    }
+
    versionInfo = data.data as utils.Config;
  });

+  function handleWheel(event: WheelEvent) {
+    if (event.ctrlKey) {
+      event.preventDefault();
+    }
+  }
+
+  async function detectDebugging() {
+    if (!browser) return;
+    if (isDebugerOn === true) return; // Prevent multiple detections
+    isDebugerOn = await IsDebuggerRunning();
+    if (isDebugerOn) {
+      if(dev) toast.warning("Debugger is attached.");
+      await new Promise((resolve) => setTimeout(resolve, 5000));
+      await QuitApp();
+    }
+  }
+
  let { data, children } = $props();

  const THEME_KEY = "emly_theme";
@@ -101,7 +125,7 @@
  syncMaxState();
 </script>

-<div class="app">
+<div class="app" onwheel={handleWheel}>
  <!-- svelte-ignore a11y_no_static_element_interactions -->
  <div
    class="titlebar"
@@ -113,7 +137,8 @@
      <div class="version-wrapper">
        <version>
          {#if dev}
-            v{versionInfo?.EMLy.GUISemver}_{versionInfo?.EMLy.GUIReleaseChannel} <debug>(DEBUG BUILD)</debug>
+            v{versionInfo?.EMLy.GUISemver}_{versionInfo?.EMLy.GUIReleaseChannel}
+            <debug>(DEBUG BUILD)</debug>
          {:else}
            v{versionInfo?.EMLy.GUISemver}_{versionInfo?.EMLy.GUIReleaseChannel}
          {/if}
@@ -123,12 +148,15 @@
            <div class="tooltip-item">
              <span class="label">GUI:</span>
              <span class="value">v{versionInfo.EMLy.GUISemver}</span>
-              <span class="channel">({versionInfo.EMLy.GUIReleaseChannel})</span>
+              <span class="channel">({versionInfo.EMLy.GUIReleaseChannel})</span
+              >
            </div>
            <div class="tooltip-item">
              <span class="label">SDK:</span>
              <span class="value">v{versionInfo.EMLy.SDKDecoderSemver}</span>
-              <span class="channel">({versionInfo.EMLy.SDKDecoderReleaseChannel})</span>
+              <span class="channel"
+                >({versionInfo.EMLy.SDKDecoderReleaseChannel})</span
+              >
            </div>
          </div>
        {/if}
@@ -294,7 +322,7 @@
    opacity: 0.4;
  }

-  .title version debug{
+  .title version debug {
    color: #e11d48;
    opacity: 1;
    font-weight: 600;
--- a/frontend/src/routes/(app)/+page.ts
+++ b/frontend/src/routes/(app)/+page.ts
@@ -23,8 +23,7 @@ export const load: PageLoad = async () => {
            let emlContent: internal.EmailData;
            
            if (startupFile.toLowerCase().endsWith(".msg")) {
-                const useExt = settingsStore.settings.useMsgConverter ?? true;
-                emlContent = await ReadMSG(startupFile, useExt);
+                emlContent = await ReadMSG(startupFile, true);
            } else {
                emlContent = await ReadEML(startupFile);
            }
--- a/frontend/src/routes/(app)/settings/+page.svelte
+++ b/frontend/src/routes/(app)/settings/+page.svelte
@@ -24,16 +24,19 @@
  import * as m from "$lib/paraglide/messages";
  import { setLocale } from "$lib/paraglide/runtime";
  import { mailState } from "$lib/stores/mail-state.svelte.js";
+  import { dev } from '$app/environment';

  let { data } = $props();
  let config = $derived(data.config);

+  let runningInDevMode: boolean = dev || false;
+
  const defaults: EMLy_GUI_Settings = {
    selectedLanguage: "it",
    useBuiltinPreview: true,
    useBuiltinPDFViewer: true,
-    useMsgConverter: true,
    previewFileSupportedTypes: ["jpg", "jpeg", "png"],
+    enableAttachedDebuggerProtection: true,
  };

  async function setLanguage(
@@ -60,9 +63,10 @@
      useBuiltinPreview: !!s.useBuiltinPreview,
      useBuiltinPDFViewer:
        s.useBuiltinPDFViewer ?? defaults.useBuiltinPDFViewer ?? true,
-      useMsgConverter: s.useMsgConverter ?? defaults.useMsgConverter ?? true,
      previewFileSupportedTypes:
        s.previewFileSupportedTypes || defaults.previewFileSupportedTypes || [],
+      enableAttachedDebuggerProtection:
+        s.enableAttachedDebuggerProtection ?? defaults.enableAttachedDebuggerProtection ?? true,
    };
  }

@@ -71,7 +75,7 @@
      (a.selectedLanguage ?? "") === (b.selectedLanguage ?? "") &&
      !!a.useBuiltinPreview === !!b.useBuiltinPreview &&
      !!a.useBuiltinPDFViewer === !!b.useBuiltinPDFViewer &&
-      !!a.useMsgConverter === !!b.useMsgConverter &&
+      !!a.enableAttachedDebuggerProtection === !!b.enableAttachedDebuggerProtection &&
      JSON.stringify(a.previewFileSupportedTypes?.sort()) ===
        JSON.stringify(b.previewFileSupportedTypes?.sort())
    );
@@ -366,36 +370,7 @@
      </Card.Content>
    </Card.Root>

-    <Card.Root>
-      <Card.Header class="space-y-1">
-        <Card.Title>{m.settings_msg_converter_title()}</Card.Title>
-        <Card.Description
-          >{m.settings_msg_converter_description()}</Card.Description
-        >
-      </Card.Header>
-      <Card.Content class="space-y-4">
-        <div class="space-y-3">
-          <div
-            class="flex items-center justify-between gap-4 rounded-lg border bg-card p-4"
-          >
-            <div>
-              <Label class="text-base">
-                {m.settings_msg_converter_label()}
-              </Label>
-              <p class="text-sm text-muted-foreground">
-                {m.settings_msg_converter_hint()}
-              </p>
-            </div>
-            <Switch
-              bind:checked={form.useMsgConverter}
-              class="cursor-pointer hover:cursor-pointer"
-            />
-          </div>
-        </div>
-      </Card.Content>
-    </Card.Root>
-
-    {#if $dangerZoneEnabled}
+    {#if $dangerZoneEnabled || dev}
      <Card.Root class="border-destructive/50 bg-destructive/15">
        <Card.Header class="space-y-1">
          <Card.Title class="text-destructive"
@@ -490,6 +465,26 @@
          </div>
          <Separator />

+          <div
+            class="flex items-center justify-between gap-4 rounded-lg border bg-card p-4 border-destructive/30"
+          >
+            <div class="space-y-1">
+              <Label class="text-sm">{m.settings_danger_debugger_protection_label()}</Label>
+              <div class="text-sm text-muted-foreground">
+                {m.settings_danger_debugger_protection_hint()}
+              </div>
+            </div>
+            <Switch
+              bind:checked={form.enableAttachedDebuggerProtection}
+              class="cursor-pointer hover:cursor-pointer"
+              disabled={!runningInDevMode}
+            />
+          </div>
+          <div class="text-xs text-muted-foreground">
+            <strong>{m.settings_danger_debugger_protection_info()}</strong>
+          </div>
+          <Separator />
+
          <div class="text-xs text-muted-foreground">
            GUI: {config
              ? `${config.GUISemver} (${config.GUIReleaseChannel})`
--- a/frontend/src/routes/pdf/+layout.svelte
+++ b/frontend/src/routes/pdf/+layout.svelte
@@ -37,10 +37,17 @@
    toggleMaximize();
  }

+  function handleWheel(event: WheelEvent) {
+    if (event.ctrlKey) {
+      event.preventDefault();
+    }
+  }
+
  syncMaxState();
 </script>

-<div class="app-layout">
+<!-- svelte-ignore a11y_no_static_element_interactions -->
+<div class="app-layout" onwheel={handleWheel}>
  <!-- Titlebar -->
  <!-- svelte-ignore a11y_no_static_element_interactions -->
  <div
--- a/frontend/src/routes/pdf/+page.svelte
+++ b/frontend/src/routes/pdf/+page.svelte
@@ -1,19 +1,19 @@
 <script lang="ts">
  import { onMount } from "svelte";
-  import type { PageData } from './$types';
+  import type { PageData } from "./$types";
  import {
    RotateCcw,
    RotateCw,
    ZoomIn,
    ZoomOut,
-    AlignHorizontalSpaceAround
+    AlignHorizontalSpaceAround,
  } from "@lucide/svelte";
  import { sidebarOpen } from "$lib/stores/app";
  import { toast } from "svelte-sonner";
  import * as pdfjsLib from "pdfjs-dist";
  import pdfWorker from "pdfjs-dist/build/pdf.worker.min.mjs?url";

-  if (typeof Promise.withResolvers === 'undefined') {
+  if (typeof Promise.withResolvers === "undefined") {
    // @ts-ignore
    Promise.withResolvers = function () {
      let resolve, reject;
@@ -36,7 +36,7 @@
  let scale = $state(1.5); // Default scale
  let error = $state("");
  let loading = $state(true);
-  
+
  let pdfDoc = $state<pdfjsLib.PDFDocumentProxy | null>(null);
  let pageNum = $state(1);
  let totalPages = $state(0);
@@ -53,7 +53,7 @@
        const len = binaryString.length;
        const bytes = new Uint8Array(len);
        for (let i = 0; i < len; i++) {
-            bytes[i] = binaryString.charCodeAt(i);
+          bytes[i] = binaryString.charCodeAt(i);
        }
        pdfData = bytes;
        filename = result.filename;
@@ -62,10 +62,10 @@
        sidebarOpen.set(false);

        await loadPDF();
-
      } else {
        toast.error("No PDF data provided");
-        error = "No PDF data provided. Please open this window from the main EMLy application.";
+        error =
+          "No PDF data provided. Please open this window from the main EMLy application.";
        loading = false;
      }
    } catch (e) {
@@ -76,29 +76,30 @@

  async function loadPDF() {
    if (!pdfData) return;
-    
+
    // Set a timeout to prevent infinite loading
    const timeout = setTimeout(() => {
-        if (loading) {
-            loading = false;
-            error = "Timeout loading PDF. The worker might have failed to initialize.";
-            toast.error(error);
-        }
+      if (loading) {
+        loading = false;
+        error =
+          "Timeout loading PDF. The worker might have failed to initialize.";
+        toast.error(error);
+      }
    }, 10000);

    try {
-        const loadingTask = pdfjsLib.getDocument({ data: pdfData });
-        pdfDoc = await loadingTask.promise;
-        totalPages = pdfDoc.numPages;
-        pageNum = 1;
-        await renderPage(pageNum);
-        loading = false;
+      const loadingTask = pdfjsLib.getDocument({ data: pdfData });
+      pdfDoc = await loadingTask.promise;
+      totalPages = pdfDoc.numPages;
+      pageNum = 1;
+      await renderPage(pageNum);
+      loading = false;
    } catch (e) {
-        console.error(e);
-        error = "Error parsing PDF: " + e;
-        loading = false;
+      console.error(e);
+      error = "Error parsing PDF: " + e;
+      loading = false;
    } finally {
-        clearTimeout(timeout);
+      clearTimeout(timeout);
    }
  }

@@ -106,36 +107,36 @@
    if (!pdfDoc || !canvasRef) return;

    if (renderTask) {
-        await renderTask.promise.catch(() => {}); // Cancel previous render if any (though we wait usually)
+      await renderTask.promise.catch(() => {}); // Cancel previous render if any (though we wait usually)
    }

    try {
-        const page = await pdfDoc.getPage(num);
-        
-        // Calculate scale if needed or use current scale
-        // We apply rotation to the viewport
-        const viewport = page.getViewport({ scale: scale, rotation: rotation });
+      const page = await pdfDoc.getPage(num);

-        const canvas = canvasRef;
-        const context = canvas.getContext('2d');
+      // Calculate scale if needed or use current scale
+      // We apply rotation to the viewport
+      const viewport = page.getViewport({ scale: scale, rotation: rotation });

-        if (!context) return;
+      const canvas = canvasRef;
+      const context = canvas.getContext("2d");

-        canvas.height = viewport.height;
-        canvas.width = viewport.width;
+      if (!context) return;

-        const renderContext = {
-            canvasContext: context,
-            viewport: viewport
-        };
-        
-        // Cast to any to avoid type mismatch with PDF.js definitions
-        await page.render(renderContext as any).promise;
+      canvas.height = viewport.height;
+      canvas.width = viewport.width;
+
+      const renderContext = {
+        canvasContext: context,
+        viewport: viewport,
+      };
+
+      // Cast to any to avoid type mismatch with PDF.js definitions
+      await page.render(renderContext as any).promise;
    } catch (e: any) {
-        if (e.name !== 'RenderingCancelledException') {
-            console.error(e);
-            toast.error("Error rendering page: " + e.message);
-        }
+      if (e.name !== "RenderingCancelledException") {
+        console.error(e);
+        toast.error("Error rendering page: " + e.message);
+      }
    }
  }

@@ -143,11 +144,13 @@
    if (!pdfDoc || !canvasContainerRef) return;
    // We need to fetch page to get dimensions
    loading = true;
-    pdfDoc.getPage(pageNum).then(page => {
-        const containerWidth = canvasContainerRef!.clientWidth - 40; // padding
-        const viewport = page.getViewport({ scale: 1, rotation: rotation });
-        scale = containerWidth / viewport.width;
-        renderPage(pageNum).then(() => { loading = false; });
+    pdfDoc.getPage(pageNum).then((page) => {
+      const containerWidth = canvasContainerRef!.clientWidth - 40; // padding
+      const viewport = page.getViewport({ scale: 1, rotation: rotation });
+      scale = containerWidth / viewport.width;
+      renderPage(pageNum).then(() => {
+        loading = false;
+      });
    });
  }

@@ -157,7 +160,7 @@
    const _deps = [scale, rotation];

    if (pdfDoc) {
-        renderPage(pageNum);
+      renderPage(pageNum);
    }
  });

@@ -180,7 +183,6 @@
    pageNum--;
    renderPage(pageNum);
  }
-
 </script>

 <div class="viewer-container">
@@ -345,15 +347,15 @@
    padding: 20px;
    background: #333; /* Dark background for contrast */
  }
-  
+
  canvas {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    max-width: none; /* Allow canvas to be larger than container */
  }

  ::-webkit-scrollbar {
-    width: 6px;
-    height: 6px;
+    width: 10px;
+    height: 10px;
  }

  ::-webkit-scrollbar-track {
@@ -372,4 +374,4 @@
  ::-webkit-scrollbar-corner {
    background: transparent;
  }
-</style>
+</style>