From 542586127ae4d4933ec0cbcbcd0784cc7ef2c4b2 Mon Sep 17 00:00:00 2001
From: kimjaehyeon0101 <47347352-kimjaehyeon0101@users.noreply.replit.com>
Date: Wed, 15 Oct 2025 04:41:04 +0000
Subject: [PATCH] Improve Mohamed Salah slide loading time and display

Update `Report.tsx` to optimize PDF rendering, add `standardFontDataUrl` to `pdfOptions`, and modify the loading state display to prevent blocking while slides are loading.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 9a264234-c5d7-4dcc-adf3-a954b149b30d
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/3df548ff-50ae-432f-9be4-25d34eccc983/9a264234-c5d7-4dcc-adf3-a954b149b30d/cEkjo93
---
 client/src/pages/Report.tsx | 35 ++++++++++++++++++-----------------
 1 file changed, 18 insertions(+), 17 deletions(-)

diff --git a/client/src/pages/Report.tsx b/client/src/pages/Report.tsx
index fc49fc1..9558bf5 100644
--- a/client/src/pages/Report.tsx
+++ b/client/src/pages/Report.tsx
@@ -48,6 +48,7 @@ function MohamedSalahSlides() {
   const pdfOptions = useMemo(() => ({
     cMapUrl: 'https://unpkg.com/pdfjs-dist@3.11.174/cmaps/',
     cMapPacked: true,
+    standardFontDataUrl: 'https://unpkg.com/pdfjs-dist@3.11.174/standard_fonts/',
   }), []);
 
   const handleSliderChange = (value: number[]) => {
@@ -91,30 +92,30 @@ function MohamedSalahSlides() {
 
   return (
     <div className="space-y-6">
-      <div className="w-full flex justify-center" data-testid="slide-container-16-9">
+      <div className="w-full flex justify-center relative" data-testid="slide-container-16-9">
         {isLoading && (
-          <div className="w-full flex items-center justify-center py-20">
+          <div className="absolute inset-0 flex items-center justify-center py-20 z-10 bg-white">
             <div className="text-center">
               <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600 mx-auto mb-4"></div>
               <p className="text-gray-600" data-testid="text-loading-slides">Loading slides...</p>
             </div>
           </div>
         )}
-        {!isLoading && (
-          <Document
-            file="/attached_assets/mohamed_salah_pdf_en_1760419721874.pdf"
-            onLoadSuccess={onDocumentLoadSuccess}
-            options={pdfOptions}
-          >
-            <Page 
-              pageNumber={currentSlide}
-              width={1000}
-              renderTextLayer={false}
-              renderAnnotationLayer={false}
-              data-testid="canvas-pdf-slide"
-            />
-          </Document>
-        )}
+        <Document
+          file="/attached_assets/mohamed_salah_pdf_en_1760419721874.pdf"
+          onLoadSuccess={onDocumentLoadSuccess}
+          options={pdfOptions}
+          loading=""
+        >
+          <Page 
+            pageNumber={currentSlide}
+            width={1000}
+            renderTextLayer={false}
+            renderAnnotationLayer={false}
+            data-testid="canvas-pdf-slide"
+            loading=""
+          />
+        </Document>
       </div>
 
       <div className="space-y-4">