aimond/sapiens-web3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve Mohamed Salah slide loading time and display

Browse Source 
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
This commit is contained in:
kimjaehyeon0101
2025-10-15 04:41:04 +00:00
parent 4fbfc0a057
commit 542586127a
1 changed files with 18 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
client/src/pages/Report.tsx
View File

@ -48,6 +48,7 @@ function MohamedSalahSlides() {
const pdfOptions = useMemo(() => ({ const pdfOptions = useMemo(() => ({
cMapUrl: 'https://unpkg.com/pdfjs-dist@3.11.174/cmaps/', cMapUrl: 'https://unpkg.com/pdfjs-dist@3.11.174/cmaps/',
cMapPacked: true, cMapPacked: true,
standardFontDataUrl: 'https://unpkg.com/pdfjs-dist@3.11.174/standard_fonts/',
}), []); }), []);
const handleSliderChange = (value: number[]) => { const handleSliderChange = (value: number[]) => {
@ -91,20 +92,20 @@ function MohamedSalahSlides() {
return ( return (
<div className="space-y-6"> <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 && ( {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="text-center">
<div className="animate-spin rounded-full h-12 w-12 border-b-2 border-blue-600 mx-auto mb-4"></div> <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> <p className="text-gray-600" data-testid="text-loading-slides">Loading slides...</p>
</div> </div>
</div> </div>
)} )}
{!isLoading && (
<Document <Document
file="/attached_assets/mohamed_salah_pdf_en_1760419721874.pdf" file="/attached_assets/mohamed_salah_pdf_en_1760419721874.pdf"
onLoadSuccess={onDocumentLoadSuccess} onLoadSuccess={onDocumentLoadSuccess}
options={pdfOptions} options={pdfOptions}
loading=""
> >
<Page <Page
pageNumber={currentSlide} pageNumber={currentSlide}
@ -112,9 +113,9 @@ function MohamedSalahSlides() {
renderTextLayer={false} renderTextLayer={false}
renderAnnotationLayer={false} renderAnnotationLayer={false}
data-testid="canvas-pdf-slide" data-testid="canvas-pdf-slide"
loading=""
/> />
</Document> </Document>
)}
</div> </div>
<div className="space-y-4"> <div className="space-y-4">