[GOOD FIRST ISSUE]: Add keyboard navigation shortcuts to PDF Document Viewer

[Hanu2908]

Task summary

When students review question sets or lecture notes in the in-app PDF viewer on desktop, pressing keyboard shortcuts should navigate pages and dismiss overlays without clicking on-screen buttons.

Estimated scope / difficulty

Starter (1 to 2 hours)

Motivation and context

When viewing assignment PDFs or lecture documents on desktop/laptop keyboards, students need quick keyboard controls to flip through multi-page documents and close views cleanly.

Relevant files and code pointers

• src/pages/app/PDFViewerPage.tsx
• src/components/ImageZoomModal.tsx
• tests/unit/components.test.tsx

Acceptance criteria

• ArrowRight and ArrowDown navigate to the next page.
• ArrowLeft and ArrowUp navigate to the previous page.
• Escape closes the PDF viewer when open as a modal; when rendered as a standalone page, it navigates back using router history.
• Keyboard handlers are ignored if an input field, textarea, or child modal is focused.
• Unit tests added in tests/unit/components.test.tsx verifying keydown event dispatching.
• npm test and npm run lint pass with 0 errors.

Implementation guide and hints

Look at how window keydown event listeners and cleanup functions are implemented in src/components/ImageZoomModal.tsx. Ensure event listeners are attached on mount and cleaned up on unmount.

[Hanu2908]

Hi @choudharyms! 👋

You are invited to collaborate on this starter issue.

Quick links to get started:

• Setup guide & local workflow: CONTRIBUTING.md
• Code pointers: [\src/pages/app/PDFViewerPage.tsx](https://github.com/Hanu2908/ClassHub/blob/main/src/pages/app/PDFViewerPage.tsx) and [\src/components/ImageZoomModal.tsx](https://github.com/Hanu2908/ClassHub/blob/main/src/components/ImageZoomModal.tsx)
• Test suite:
  pm test\

Feel free to open a pull request whenever you're ready or comment here if you have any questions!