LAINE: Implement DOCX and PDF File Preview Support

[paulnathanielsango]

Laine Coding Exam - Paul Nathaniel

Description: This PR updates the file preview feature to handle both .docx and .pdf file types. It fetches file content from the backend based on the file extension and displays it accordingly.`

Backend changes made:

laine-fe-coding-challenge\backend\server.js

• /api/files/:fileId/content converts .docx files to HTML using Mammoth and returns the content as a JSON response, handling errors with appropriate status codes.
• /api/files/:fileId/view serves .pdf files directly to the client, sending the file from the server, and handles errors if the file cannot be sent.
• Both endpoints check the file type and ensure proper handling of DOCX and PDF files while providing error handling for missing files or conversion failures.
• The solution provides basic file serving and content conversion, but may require optimizations for scalability, error monitoring, and security.
• Future improvements could include support for more file types, caching, rate limiting, and asynchronous processing for larger files.

Frontend changes made:

laine-fe-coding-challenge\frontend\src\app\page.tsx
laine-fe-coding-challenge\frontend\src\components\CommentSection.tsx

• Modified useEffect to handle fetching both .docx and .pdf files.
• For .docx, the content is parsed and displayed as HTML.
• For .pdf, an <iframe> is used to display the file.
• Error handling was added for failed fetch requests.
• The display is cleared if no file is selected or if an error occurs.

Testing: Manually tested .docx and .pdf files to ensure they are displayed correctly.

• DOCX files render as HTML content.
• PDF files load within an embedded iframe.
• Error handling was verified by simulating failed file fetches.

Screenshots: N/A