From f84e68ad068ef83fc385452da2fa56d6ede500e4 Mon Sep 17 00:00:00 2001
From: Dorian <dorian@Dorians-MacBook-Air.local>
Date: Wed, 4 Mar 2026 22:16:34 +0000
Subject: [PATCH] fix(app): add error handling to PdfViewer renderPage and
 VideoPlayer initHls

Prevents unhandled promise rejections from async watchers and lifecycle hooks.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../src/components/renderers/PdfViewer.vue    | 26 +++++++++-------
 .../src/components/renderers/VideoPlayer.vue  | 30 +++++++++++--------
 2 files changed, 33 insertions(+), 23 deletions(-)

diff --git a/packages/app/src/components/renderers/PdfViewer.vue b/packages/app/src/components/renderers/PdfViewer.vue
index 47ab2090..17ed4f4e 100644
--- a/packages/app/src/components/renderers/PdfViewer.vue
+++ b/packages/app/src/components/renderers/PdfViewer.vue
@@ -124,20 +124,24 @@ async function renderPage() {
   const canvas = canvasRef.value
   if (!doc || !canvas) return
 
-  const page = await doc.getPage(currentPage.value)
-  const viewport = page.getViewport({ scale: scale.value })
+  try {
+    const page = await doc.getPage(currentPage.value)
+    const viewport = page.getViewport({ scale: scale.value })
 
-  canvas.height = viewport.height
-  canvas.width = viewport.width
+    canvas.height = viewport.height
+    canvas.width = viewport.width
 
-  const ctx = canvas.getContext('2d')
-  if (!ctx) return
+    const ctx = canvas.getContext('2d')
+    if (!ctx) return
 
-  await page.render({
-    canvasContext: ctx,
-    canvas: canvas,
-    viewport,
-  }).promise
+    await page.render({
+      canvasContext: ctx,
+      canvas: canvas,
+      viewport,
+    }).promise
+  } catch (e) {
+    error.value = `Failed to render page: ${e instanceof Error ? e.message : 'Unknown error'}`
+  }
 }
 
 function goToPage(page: number) {
diff --git a/packages/app/src/components/renderers/VideoPlayer.vue b/packages/app/src/components/renderers/VideoPlayer.vue
index f42a87a3..b84c7867 100644
--- a/packages/app/src/components/renderers/VideoPlayer.vue
+++ b/packages/app/src/components/renderers/VideoPlayer.vue
@@ -58,24 +58,30 @@ const isHls = computed(() =>
 type HlsInstance = import('hls.js').default
 const hls = shallowRef<HlsInstance | null>(null)
 
+const hlsError = ref('')
+
 async function initHls() {
   if (!isHls.value || !videoRef.value || youtubeId.value) return
 
-  const HlsModule = await import('hls.js')
-  const Hls = HlsModule.default
+  try {
+    const HlsModule = await import('hls.js')
+    const Hls = HlsModule.default
 
-  if (!Hls.isSupported()) {
-    // Try native HLS support (Safari)
-    if (videoRef.value.canPlayType('application/vnd.apple.mpegurl')) {
-      videoRef.value.src = props.url
+    if (!Hls.isSupported()) {
+      // Try native HLS support (Safari)
+      if (videoRef.value.canPlayType('application/vnd.apple.mpegurl')) {
+        videoRef.value.src = props.url
+      }
+      return
     }
-    return
-  }
 
-  const instance = new Hls()
-  instance.loadSource(props.url)
-  instance.attachMedia(videoRef.value)
-  hls.value = instance
+    const instance = new Hls()
+    instance.loadSource(props.url)
+    instance.attachMedia(videoRef.value)
+    hls.value = instance
+  } catch (e) {
+    hlsError.value = `Failed to initialize video: ${e instanceof Error ? e.message : 'Unknown error'}`
+  }
 }
 
 onMounted(() => {