# Task Management - Delta Changes ## MODIFIED Requirements ### Requirement: Task Result Display The system SHALL provide interactive PDF preview of OCR results with layout preservation on Results and Task Detail pages. #### Scenario: Results page shows layout-preserving PDF preview - **WHEN** Results page loads with a completed task - **THEN** page SHALL fetch PDF from `/api/v2/tasks/{task_id}/download/pdf` - **AND** page SHALL render PDF using react-pdf PDFViewer component - **AND** page SHALL NOT show placeholder text "請使用上方下載按鈕..." - **AND** PDF SHALL display with original document layout preserved - **AND** PDF SHALL support zoom and page navigation controls #### Scenario: Task detail page shows PDF preview - **WHEN** Task Detail page loads for a completed task - **THEN** page SHALL fetch layout-preserving PDF - **AND** page SHALL render PDF using PDFViewer component - **AND** page SHALL NOT show placeholder text - **AND** PDF SHALL visually match original document layout #### Scenario: Preview handles loading state - **WHEN** PDF is being generated or fetched - **THEN** page SHALL display loading spinner - **AND** page SHALL show progress indicator during PDF generation - **AND** page SHALL NOT show error or placeholder text #### Scenario: Preview handles errors gracefully - **WHEN** PDF generation fails or file is missing - **THEN** page SHALL display helpful error message - **AND** error message SHALL suggest trying download again or contact support - **AND** page SHALL NOT crash or expose technical errors to user - **AND** page MAY fallback to markdown preview if PDF unavailable ## ADDED Requirements ### Requirement: Interactive PDF Viewer Features The PDF viewer component SHALL provide essential viewing controls for user convenience. #### Scenario: PDF viewer provides zoom controls - **WHEN** user views PDF preview - **THEN** viewer SHALL provide zoom in (+) and zoom out (-) buttons - **AND** viewer SHALL provide fit-to-width option - **AND** viewer SHALL provide fit-to-page option - **AND** zoom level SHALL persist during page navigation #### Scenario: PDF viewer provides page navigation - **WHEN** PDF contains multiple pages - **THEN** viewer SHALL display current page number and total pages - **AND** viewer SHALL provide previous/next page buttons - **AND** viewer SHALL provide page selector dropdown - **AND** page navigation SHALL be smooth without flickering ### Requirement: Frontend PDF Library Integration The frontend SHALL use react-pdf for PDF rendering capabilities. #### Scenario: react-pdf configured correctly - **WHEN** application initializes - **THEN** react-pdf library SHALL be installed and imported - **AND** PDF.js worker SHALL be configured properly - **AND** worker path SHALL point to correct pdfjs-dist worker file - **AND** PDF rendering SHALL work without console errors