[MS] Handle errors for PDF viewer

Scille · Jan 4, 2025 · da7ce0b · da7ce0b
1 parent c22202a
commit da7ce0b
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 29 deletions.
diff --git a/client/src/locales/en-US.json b/client/src/locales/en-US.json
@@ -1760,6 +1760,10 @@
         "spreadsheet": {
             "loadSheetError": "This sheet could not be loaded.",
             "loadDocumentError": "Could not load this document."
+        },
+        "pdf": {
+            "loadDocumentError": "Could not load this PDF document.",
+            "loadPageError": "Could not load this page."
         }
     }
 }
diff --git a/client/src/locales/fr-FR.json b/client/src/locales/fr-FR.json
@@ -1760,6 +1760,10 @@
         "spreadsheet": {
             "loadSheetError": "Impossible de charger cette feuille.",
             "loadDocumentError": "Impossible de charger ce document."
+        },
+        "pdf": {
+            "loadDocumentError": "Impossible de charger ce document.",
+            "loadPageError": "Impossible de charger cette page."
         }
     }
 }
diff --git a/client/src/views/viewers/PdfViewer.vue b/client/src/views/viewers/PdfViewer.vue
@@ -3,20 +3,27 @@
 <template>
   <file-viewer-wrapper>
     <template #viewer>
+      <ms-report-text
+        class="pdf-error"
+        v-show="error"
+        :theme="MsReportTheme.Error"
+      >
+        {{ $msTranslate(error) }}
+      </ms-report-text>
       <div
         class="pdf-container"
         v-if="pdf"
       >
         <ms-spinner v-show="loading" />
         <canvas
-          v-show="!loading"
+          v-show="!loading && !error"
           class="canvas"
           ref="canvas"
         />
       </div>
     </template>
     <template #controls>
-      <file-controls>
+      <file-controls v-show="pdf">
         <file-controls-zoom
           @change="onChange"
           ref="zoomControl"
@@ -33,23 +40,22 @@
 </template>
 
 <script setup lang="ts">
-import { inject, onMounted, ref, Ref, shallowRef } from 'vue';
+import { onMounted, ref, Ref, shallowRef } from 'vue';
 import { FileContentInfo } from '@/views/viewers/utils';
 import { FileViewerWrapper } from '@/views/viewers';
 import { FileControls, FileControlsPagination, FileControlsZoom } from '@/components/viewers';
-import { I18n, MsSpinner, Translatable } from 'megashark-lib';
+import { I18n, MsSpinner, Translatable, MsReportText, MsReportTheme } from 'megashark-lib';
 import * as pdfjs from 'pdfjs-dist';
-import { Information, InformationLevel, InformationManager, InformationManagerKey, PresentationMode } from '@/services/informationManager';
 
 const props = defineProps<{
   contentInfo: FileContentInfo;
 }>();
 
 const loading = ref(true);
+const error = ref('');
 const canvas = ref();
 const currentPage = ref(1);
 const pdf: Ref<pdfjs.PDFDocumentProxy | null> = shallowRef(null);
-const informationManager: InformationManager = inject(InformationManagerKey)!;
 const actions: Ref<Array<{ icon?: string; text?: Translatable; handler: () => void }>> = ref([]);
 const zoomControl = ref();
 const scale = ref(1);
@@ -60,22 +66,16 @@ onMounted(async () => {
 
   try {
     pdf.value = await pdfjs.getDocument(props.contentInfo.data).promise;
-    await loadPage(1);
     for (let i = 1; i <= pdf.value.numPages; i++) {
       actions.value.push({ text: I18n.valueAsTranslatable(`Page ${i.toString()}`), handler: () => loadPage(i) });
     }
-  } catch (error: any) {
-    window.electronAPI.log('error', `Failed to parse PDF: ${error}`);
-    informationManager.present(
-      new Information({
-        message: 'FAILED TO PARSE PDF',
-        level: InformationLevel.Error,
-      }),
-      PresentationMode.Toast,
-    );
+    await loadPage(1);
+  } catch (e: any) {
+    window.electronAPI.log('error', `Failed to parse PDF: ${e}`);
+    error.value = 'fileViewers.pdf.loadDocumentError';
+  } finally {
+    loading.value = false;
   }
-
-  loading.value = false;
 });
 
 async function onChange(value: number): Promise<void> {
@@ -88,6 +88,7 @@ async function loadPage(pageIndex: number): Promise<void> {
     return;
   }
 
+  error.value = '';
   loading.value = true;
 
   try {
@@ -108,18 +109,12 @@ async function loadPage(pageIndex: number): Promise<void> {
     };
     page.render(renderContext);
     currentPage.value = pageIndex;
-  } catch (error: any) {
-    window.electronAPI.log('error', `Failed to open PDF page: ${error}`);
-    informationManager.present(
-      new Information({
-        message: 'FAILED TO PARSE PDF',
-        level: InformationLevel.Error,
-      }),
-      PresentationMode.Toast,
-    );
+  } catch (e: any) {
+    window.electronAPI.log('error', `Failed to open PDF page: ${e}`);
+    error.value = 'fileViewers.pdf.loadPageError';
+  } finally {
+    loading.value = false;
   }
-
-  loading.value = false;
 }
 </script>
 
@@ -134,4 +129,8 @@ async function loadPage(pageIndex: number): Promise<void> {
     transition: all 0.3s ease-in-out;
   }
 }
+
+.pdf-error {
+  width: 100%;
+}
 </style>